@progress/kendo-react-editor/index.d.mts

React Editor enables users to create rich text content through a WYSIWYG interface. KendoReact Editor package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { addColSpan } from '@progress/kendo-editor-common';
import { addColumn } from '@progress/kendo-editor-common';
import { addListNodes } from '@progress/kendo-editor-common';
import { AddMarkStep } from '@progress/kendo-editor-common';
import { addRow } from '@progress/kendo-editor-common';
import { AllSelection } from '@progress/kendo-editor-common';
import { autoJoin } from '@progress/kendo-editor-common';
import { ButtonProps } from '@progress/kendo-react-buttons';
import { canJoin } from '@progress/kendo-editor-common';
import { canSplit } from '@progress/kendo-editor-common';
import { cellAround } from '@progress/kendo-editor-common';
import { CellSelection } from '@progress/kendo-editor-common';
import { chainCommands } from '@progress/kendo-editor-common';
import { colCount } from '@progress/kendo-editor-common';
import { ColorPickerProps } from '@progress/kendo-react-inputs';
import { columnIsHeader } from '@progress/kendo-editor-common';
import { columnResizing } from '@progress/kendo-editor-common';
import { Command } from 'prosemirror-state';
import { ComponentClass } from 'react';
import { ContentMatch } from '@progress/kendo-editor-common';
import { Decoration } from '@progress/kendo-editor-common';
import { DecorationSet } from '@progress/kendo-editor-common';
import { default as default_2 } from 'prop-types';
import { deleteRow } from '@progress/kendo-editor-common';
import { deleteTable } from '@progress/kendo-editor-common';
import { DOMParser as DOMParser_2 } from '@progress/kendo-editor-common';
import { DOMSerializer } from '@progress/kendo-editor-common';
import { dropCursor } from '@progress/kendo-editor-common';
import { DropDownListProps } from '@progress/kendo-react-dropdowns';
import { dropPoint } from '@progress/kendo-editor-common';
import { EditorState } from '@progress/kendo-editor-common';
import { EditorView } from '@progress/kendo-editor-common';
import { findCell } from '@progress/kendo-editor-common';
import { findWrapping } from '@progress/kendo-editor-common';
import { fixTables } from '@progress/kendo-editor-common';
import { Fragment } from '@progress/kendo-editor-common';
import { gapCursor } from '@progress/kendo-editor-common';
import { getHtml } from '@progress/kendo-editor-common';
import { goToNextCell } from '@progress/kendo-editor-common';
import { history as history_2 } from '@progress/kendo-editor-common';
import { ImageResizeOptions } from '@progress/kendo-editor-common';
import { InputRule } from '@progress/kendo-editor-common';
import { inputRules } from '@progress/kendo-editor-common';
import { inSameTable } from '@progress/kendo-editor-common';
import { insertPoint } from '@progress/kendo-editor-common';
import { isInTable } from '@progress/kendo-editor-common';
import { joinPoint } from '@progress/kendo-editor-common';
import { JSX } from 'react/jsx-runtime';
import { keydownHandler } from '@progress/kendo-editor-common';
import { keymap } from '@progress/kendo-editor-common';
import { liftListItem } from '@progress/kendo-editor-common';
import { liftTarget } from '@progress/kendo-editor-common';
import { Mapping } from '@progress/kendo-editor-common';
import { MapResult } from '@progress/kendo-editor-common';
import { Mark } from '@progress/kendo-editor-common';
import { marks } from '@progress/kendo-editor-common';
import { MarkSpec } from '@progress/kendo-editor-common';
import { MarkType } from '@progress/kendo-editor-common';
import { mergeCells } from '@progress/kendo-editor-common';
import { moveCellForward } from '@progress/kendo-editor-common';
import { nextCell } from '@progress/kendo-editor-common';
import { Node as Node_2 } from '@progress/kendo-editor-common';
import { NodeRange } from '@progress/kendo-editor-common';
import { nodes } from '@progress/kendo-editor-common';
import { NodeSelection } from '@progress/kendo-editor-common';
import { NodeSpec } from '@progress/kendo-editor-common';
import { NodeType } from '@progress/kendo-editor-common';
import { parseContent } from '@progress/kendo-editor-common';
import { ParseOptions } from '@progress/kendo-editor-common';
import { PasteCleanupSettings as PasteCleanupSettings_2 } from '@progress/kendo-editor-common';
import { PDFExportProps } from '@progress/kendo-react-pdf';
import { Plugin as Plugin_2 } from '@progress/kendo-editor-common';
import { PluginKey } from '@progress/kendo-editor-common';
import * as React_2 from 'react';
import { redoDepth } from '@progress/kendo-editor-common';
import { removeColSpan } from '@progress/kendo-editor-common';
import { RemoveMarkStep } from '@progress/kendo-editor-common';
import { ReplaceAroundStep } from '@progress/kendo-editor-common';
import { ReplaceError } from '@progress/kendo-editor-common';
import { ReplaceStep } from '@progress/kendo-editor-common';
import { replaceStep } from '@progress/kendo-editor-common';
import { ResizeState } from 'prosemirror-tables';
import { ResolvedPos } from '@progress/kendo-editor-common';
import { rowIsHeader } from '@progress/kendo-editor-common';
import { Schema } from '@progress/kendo-editor-common';
import { selectedRect } from '@progress/kendo-editor-common';
import { Selection as Selection_2 } from '@progress/kendo-editor-common';
import { selectionCell } from '@progress/kendo-editor-common';
import { SelectionRange } from '@progress/kendo-editor-common';
import { setBlockType } from '@progress/kendo-editor-common';
import { setCellAttr } from '@progress/kendo-editor-common';
import { sinkListItem } from '@progress/kendo-editor-common';
import { Slice } from '@progress/kendo-editor-common';
import { splitCell } from '@progress/kendo-editor-common';
import { splitCellWithType } from '@progress/kendo-editor-common';
import { splitListItem } from '@progress/kendo-editor-common';
import { Step } from '@progress/kendo-editor-common';
import { StepMap } from '@progress/kendo-editor-common';
import { StepResult } from '@progress/kendo-editor-common';
import { tableEditing } from '@progress/kendo-editor-common';
import { TableMap } from '@progress/kendo-editor-common';
import { tableNodes } from '@progress/kendo-editor-common';
import { tableNodeTypes } from '@progress/kendo-editor-common';
import { textblockTypeInputRule } from '@progress/kendo-editor-common';
import { TextSelection } from '@progress/kendo-editor-common';
import { toggleHeader } from '@progress/kendo-editor-common';
import { toggleMark } from '@progress/kendo-editor-common';
import { Transaction } from '@progress/kendo-editor-common';
import { Transform } from '@progress/kendo-editor-common';
import { undoDepth } from '@progress/kendo-editor-common';
import { updateColumnsOnResize } from '@progress/kendo-editor-common';
import { wrapIn } from '@progress/kendo-editor-common';
import { wrapInList } from '@progress/kendo-editor-common';
import { wrappingInputRule } from '@progress/kendo-editor-common';

/**
 * @hidden
 */
declare interface ApplyColorToolProps extends BasicToolProps, EditorToolsSettings.ApplyColorSettings {
}

/**
 * @hidden
 */
declare interface BasicToolProps {
    /**
     * The `EditorView` object of the Editor component.
     */
    view?: EditorView;
}

/**
 * @hidden
 */
declare interface CleanFormattingToolProps extends ToolProps {
    /**
     * The settings of the tool. Use it to modify the tool appearance.
     */
    settings?: EditorToolsSettings.CleanFormattingSettings;
}

/**
 * Represents the [KendoReact Editor component]({% slug overview_editor %}).
 *
 * @example
 * ```jsx
 * const App = () => {
 *    return (
 *        <Editor
 *            defaultContent="<p>Hello World</p>"
 *            tools={[
 *               [ EditorTools.Bold, EditorTools.Italic ]
 *            ]}
 *        />
 *    );
 * }
 * ```
 */
export declare class Editor extends React_2.Component<EditorProps, EditorStateInterface> {
    /**
     * @hidden
     */
    static propTypes: {
        defaultContent: default_2.Requireable<string>;
        value: default_2.Requireable<NonNullable<string | object | null | undefined>>;
        defaultEditMode: default_2.Requireable<string>;
        contentStyle: default_2.Requireable<object>;
        dir: default_2.Requireable<string>;
        className: default_2.Requireable<string>;
        ariaDescribedBy: default_2.Requireable<string>;
        ariaLabelledBy: default_2.Requireable<string>;
        ariaLabel: default_2.Requireable<string>;
        style: default_2.Requireable<object>;
        tools: default_2.Requireable<any[]>;
        keyboardNavigation: default_2.Requireable<boolean>;
        resizable: default_2.Requireable<boolean>;
        preserveWhitespace: default_2.Requireable<string | boolean>;
        onMount: default_2.Requireable<(...args: any[]) => any>;
        onFocus: default_2.Requireable<(...args: any[]) => any>;
        onBlur: default_2.Requireable<(...args: any[]) => any>;
        onChange: default_2.Requireable<(...args: any[]) => any>;
        onPasteHtml: default_2.Requireable<(...args: any[]) => any>;
        onExecute: default_2.Requireable<(...args: any[]) => any>;
        onIFrameInit: default_2.Requireable<(...args: any[]) => any>;
    };
    /**
     * @hidden
     */
    readonly state: EditorStateInterface;
    /**
     * The value of the Editor.
     */
    get value(): Node_2 | string;
    /**
     * Returns the DOM element of the Editor.
     */
    get element(): HTMLElement | null;
    /**
     * Returns the content-editable DOM element of the Editor.
     */
    get contentElement(): HTMLDivElement | null;
    /**
     * Returns the `view` object of the Editor.
     */
    get view(): EditorView | undefined;
    private _element;
    private _view?;
    private _contentElement;
    private iframe;
    private trOnChange;
    private htmlOnChange;
    private pasteEvent?;
    private readonly showLicenseWatermark;
    private readonly licenseMessage?;
    constructor(props: EditorProps);
    /**
     * @hidden
     */
    componentDidMount(): void;
    /**
     * @hidden
     */
    componentDidUpdate(prevProps: EditorProps): void;
    /**
     * @hidden
     */
    componentWillUnmount(): void;
    /**
     * @hidden
     */
    focus: () => void;
    /**
     * @hidden
     */
    render(): JSX.Element;
    private renderDialog;
    private renderTool;
    private updateTools;
    private initialize;
    private filterTransaction;
    private onPasteHtml;
    private dispatchTransaction;
    private onFocus;
    private onBlur;
    private onPaste;
    private onIFrameInit;
}

/**
 * Represents the object of the `onBlur` Editor event.
 */
export declare interface EditorBlurEvent extends EditorEvent {
    /**
     * The native blur event.
     */
    nativeEvent: FocusEvent;
}

/**
 * Represents the object of the `onChange` Editor event.
 */
export declare interface EditorChangeEvent extends EditorEvent {
    /**
     * Represents the [Editor document](https://prosemirror.net/docs/guide/#doc).
     */
    value: Node_2;
    /**
     * A getter of the Editor HTML content.
     * Once called, it will convert the Editor document into HTML string.
     * Note that, since onChange event is triggered on every key while typing,
     * this conversion may not be suitable if the Editor is dealing with large amount of content.
     */
    html: string;
    /**
     * The Editor Schema object.
     */
    schema: Schema;
    /**
     * The Transaction which causes the change.
     */
    transaction: Transaction;
}

/**
 * @hidden
 */
declare interface EditorDialogProps {
    /**
     * The `EditorView` object.
     */
    view: EditorView;
    /**
     * The `settings` object of the Dialog.
     */
    settings: any;
    /**
     * Represents the `dir` HTML attribute.
     */
    dir?: string;
    /**
     * The `close` event which will be triggered when the Dialog is about to be unmounted.
     */
    onClose: () => void;
    /**
     * Fires when a Dialog is about to be rendered. Used to override the default appearance of the Dialog.
     */
    render?: (tool: React.ReactElement<any>, args?: any) => React.ReactNode;
}

/**
 * Represents a wrapping namespace for the dialog components and props of the Editor.
 */
export declare namespace EditorDialogs {
    /**
     * The InsertLinkDialog component.
     */
    export class InsertLinkDialog extends InsertLinkDialog {
    }
    /**
     * The props for the InsertLinkDialog component.
     */
    export interface InsertLinkDialogProps extends InsertLinkDialogProps {
    }
    /**
     * The InsertImageDialog component.
     */
    export class InsertImageDialog extends InsertImageDialog {
    }
    /**
     * The props for the InsertImageDialog component.
     */
    export interface InsertImageDialogProps extends InsertImageDialogProps {
    }
    /**
     * The ViewHtmlDialog component.
     */
    export class ViewHtmlDialog extends ViewHtmlDialog {
    }
    /**
     * The props for the ViewHtmlDialog component.
     */
    export interface ViewHtmlDialogProps extends ViewHtmlDialogProps {
    }
    /**
     * The FindAndReplaceDialog component.
     */
    export class FindAndReplaceDialog extends FindAndReplaceDialog {
    }
    /**
     * The props for the FindAndReplaceDialog component.
     */
    export interface FindAndReplaceDialogProps extends FindAndReplaceDialogProps {
    }
}

declare interface EditorEvent {
    /**
     * An event target.
     */
    target: Editor;
}

/**
 * Represents the object of the `onExecute` Editor event.
 */
export declare interface EditorExecuteEvent extends EditorEvent {
    /**
     * The transaction that will be executed.
     */
    transaction: Transaction;
    /**
     * The state of the Editor.
     */
    state: EditorState;
}

/**
 * Represents the object of the `onFocus` Editor event.
 */
export declare interface EditorFocusEvent extends EditorEvent {
    /**
     * The native focus event.
     */
    nativeEvent: FocusEvent;
}

/**
 * Represents the object of the `onIFrameInit` Editor event.
 */
export declare interface EditorIFrameInitEvent extends EditorEvent {
    /**
     * The object that represents the iframe element inside the Editor.
     */
    iframe: HTMLIFrameElement;
}

/**
 * Represents the object of the `onMount` Editor event.
 */
export declare interface EditorMountEvent extends EditorEvent {
    /**
     * The content-editable DOM element of the Editor.
     */
    dom: HTMLDivElement;
    /**
     * The default plugins collection of the Editor.
     */
    plugins: Array<Plugin_2>;
    /**
     * The default key bindings of the Editor.
     */
    shortcuts: EditorUtils.Shortcuts;
    /**
     * The default [viewProps](https://prosemirror.net/docs/ref/#view.DirectEditorProps) object of the Editor.
     */
    viewProps: {
        state: EditorState;
        [key: string]: any;
    };
}

/**
 * Represents the object of the `onPaste` Editor event.
 */
export declare interface EditorPasteEvent extends EditorEvent {
    /**
     * The HTML that will be pasted in the Editor.
     */
    pastedHtml: string;
    /**
     * The native paste event.
     */
    nativeEvent: ClipboardEvent;
}

/**
 * Represents the props of the [KendoReact Editor component]({% slug overview_editor %}).
 */
export declare interface EditorProps {
    /**
     * Sets the default HTML content of the Editor. This content is rendered
     * when the Editor is initialized and no value is provided.
     *
     * @example
     * ```jsx
     *     <Editor
     *         tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *         defaultContent="<p>Hello, World!</p>"
     *     />
     * ```
     */
    defaultContent?: string;
    /**
     * Sets the initial edit mode of the Editor. Defaults to `iframe`.
     * - `iframe`: The Editor content is rendered inside an `<iframe>`.
     * - `div`: The Editor content is rendered inside a `<div>` element.
     *
     * @example
     * ```jsx
     *     <Editor
     *         tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *         defaultEditMode="div"
     *     />
     * ```
     */
    defaultEditMode?: 'iframe' | 'div';
    /**
     * Applies custom styles to the content element wrapper of the Editor.
     *
     * @example
     * ```jsx
     *     <Editor
     *         tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *         contentStyle={{ backgroundColor: 'lightgray' }}
     *     />
     * ```
     */
    contentStyle?: React.CSSProperties;
    /**
     * Specifies the text directionality of the Editor content.
     * Accepts `ltr` (left-to-right) or `rtl` (right-to-left).
     *
     * @example
     * ```jsx
     * <Editor tools={[[EditorTools.Bold, EditorTools.Italic]]} dir="rtl" />
     * ```
     */
    dir?: string;
    /**
     * Adds custom CSS classes to the Editor's root element.
     *
     * @example
     * ```jsx
     *     <Editor
     *         tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *         className="custom-editor-class"
     *         contentStyle={{ backgroundColor: 'lightgray' }}
     *     />
     * ```
     */
    className?: string;
    /**
     * Applies custom styles to the Editor's root element.
     *
     * @example
     * ```jsx
     *     <Editor
     *         tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *         style={{ border: '1px solid black' }}
     *     />
     * ```
     */
    style?: React.CSSProperties;
    /**
     * Identifies the element(s) that describe the Editor component.
     * Similar to the [HTML aria-describedby attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute).
     *
     * @example
     * ```jsx
     *     <Editor
     *         tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *         defaultEditMode="div"
     *         ariaDescribedBy="description-element-id"
     *     />
     * ```
     */
    ariaDescribedBy?: string;
    /**
     * Identifies the element(s) that label the Editor component.
     *
     * @example
     * ```jsx
     *     <Editor
     *         tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *         defaultEditMode="div"
     *         ariaLabelledBy="label-element-id"
     *     />
     * ```
     */
    ariaLabelledBy?: string;
    /**
     * Provides an accessible label for the Editor component.
     * Similar to the [aria-label](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) attribute.
     *
     * @example
     * ```jsx
     * <Editor ariaLabel="Rich Text Editor" />
     * ```
     */
    ariaLabel?: string;
    /**
     * Enables or disables resizing of the Editor. Defaults to `false`.
     *
     * @example
     * ```jsx
     *
     * <Editor tools={[[EditorTools.Bold, EditorTools.Italic]]}
     * resizable={true} />
     * ```
     */
    resizable?: boolean;
    /**
     * Configures the tools available in the Editor's toolbar.
     * By default, no tools are rendered.
     *
     * @example
     * ```jsx
     * <Editor tools={[[EditorTools.Bold, EditorTools.Italic]]} />
     * ```
     */
    tools?: Array<any>;
    /**
     * Triggered when the Editor is about to mount. Useful for configuring the `EditorView` object.
     * To initialize `EditorView`, use the properties of the `event` object.
     *
     * @param event - The event object containing initialization details.
     * @returns An `EditorView` instance or `void`.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       onMount={(event) => console.log(event.dom)}
     *     />
     * ```
     */
    onMount?: (event: EditorMountEvent) => EditorView | void;
    /**
     * Triggered when content is pasted into the Editor. Allows modification of the pasted content.
     *
     * @param event - The event object containing the pasted content details.
     *
     * @returns The modified HTML string or `void`.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       onPasteHtml={(event) => event.pastedHtml.toUpperCase()}
     *     />
     * ```
     */
    onPasteHtml?: (event: EditorPasteEvent) => string | void;
    /**
     * Triggered when the Editor is about to apply a transaction.
     * To prevent the transaction, return `false`.
     *
     * @param event - The event object containing transaction details.
     * @returns `false` to cancel the transaction or `void`.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       onExecute={(event) => {
     *         console.log('onExecute called');
     *         event.transaction.steps.length > 0;
     *       }}
     *     />
     * ```
     */
    onExecute?: (event: EditorExecuteEvent) => boolean | void;
    /**
     * Triggered when the Editor's content element receives focus.
     *
     * @param event - The event object containing focus details.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       onFocus={(event) => console.log('Editor focused')}
     *     />
     * ```
     */
    onFocus?: (event: EditorFocusEvent) => void;
    /**
     * Triggered when the Editor's content element loses focus.
     *
     * @param event - The event object containing blur details.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       onBlur={(event) => console.log('Editor blurred')}
     *     />
     * ```
     */
    onBlur?: (event: EditorBlurEvent) => void;
    /**
     * Triggered when the value of the Editor is about to change.
     *
     * @param event - The event object containing change details.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       onChange={(event) => console.log(event.value)}
     *     />
     * ```
     */
    onChange?: (event: EditorChangeEvent) => void;
    /**
     * Triggered during the initialization of an Editor with the `iframe` property set to `true`.
     * Allows access to the iframe document for customization.
     *
     * @param event - The event object containing iframe details.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       onIFrameInit={(event) => {
     *         console.log('Iframe initialized');
     *         event.iframe.style.border = 'none';
     *       }}
     />
     * ```
     */
    onIFrameInit?: (event: EditorIFrameInitEvent) => void;
    /**
     * Specifies the value of the Editor. Can be a ProseMirror `Node` or an HTML string.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       value="<p>Initial content</p>"
     *     />
     * ```
     */
    value?: Node_2 | string;
    /**
     * Disables the built-in keyboard navigation of the Editor's toolbar when set to `false`.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       keyboardNavigation={false}
     *     />
     * ```
     */
    keyboardNavigation?: boolean;
    /**
     * Defines options for parsing HTML content:
     * - `false`: Collapses whitespace as per HTML rules.
     * - `true`: Preserves whitespace but normalizes newlines to spaces.
     * - `full`: Fully preserves whitespace.
     * Defaults to `full`.
     *
     * @example
     * ```jsx
     *     <Editor
     *       tools={[[EditorTools.Bold, EditorTools.Italic]]}
     *       preserveWhitespace="full"
     *     />
     * ```
     */
    preserveWhitespace?: boolean | 'full';
}

/**
 * @hidden
 */
export declare const editorPropsKey: PluginKey<any>;

/**
 * @hidden
 */
declare interface EditorStateInterface {
    view?: EditorView;
    linkDialog?: boolean;
}

/**
 * Represents a wrapping namespace for the tool components, props, and functions of the Editor.
 */
export declare namespace EditorTools {
    /**
     * The props for the Align tool component of the Editor.
     */
    export interface AlignToolProps extends ToolProps {
    }
    /**
     * The props for the AlignLeft tool component of the Editor.
     */
    export interface AlignLeftProps extends AlignToolProps {
    }
    /**
     * The props for the AlignRight tool component of the Editor.
     */
    export interface AlignRightProps extends AlignToolProps {
    }
    /**
     * The props for the AlignCenter tool component of the Editor.
     */
    export interface AlignCenterProps extends AlignToolProps {
    }
    /**
     * The props for the AlignJustify tool component of the Editor.
     */
    export interface AlignJustifyProps extends AlignToolProps {
    }
    /**
     * Creates the Align tool component of the Editor.
     *
     * @param {AlignSettings} settings
     * @returns {React.ComponentClass<AlignToolProps>} - Editor's Align tool component.
     */
    export function createAlignTool(settings: EditorToolsSettings.AlignSettings): React_2.ComponentClass<AlignToolProps, React_2.ComponentState>;
    const AlignLeft_base: React_2.ComponentClass<AlignToolProps, any>;
    /**
     * The AlignLeft tool component.
     */
    export class AlignLeft extends AlignLeft_base {
    }
    const AlignRight_base: React_2.ComponentClass<AlignToolProps, any>;
    /**
     * The AlignRight tool component.
     */
    export class AlignRight extends AlignRight_base {
    }
    const AlignCenter_base: React_2.ComponentClass<AlignToolProps, any>;
    /**
     * The AlignCenter tool component.
     */
    export class AlignCenter extends AlignCenter_base {
    }
    const AlignJustify_base: React_2.ComponentClass<AlignToolProps, any>;
    /**
     * The AlignJustify tool component.
     */
    export class AlignJustify extends AlignJustify_base {
    }
    /**
     * The props for the InsertTable tool component of the Editor.
     */
    export interface InsertTableProps extends InsertTableToolNS.InsertTableProps {
    }
    /**
     * Creates the InsertTable tool component of the Editor.
     *
     * @param {InsertTableSettings} - The settings of the InsertTable tool.
     * @returns {React.ComponentClass<InsertTableProps>} - The InsertTable tool component of the Editor.
     */
    export function createInsertTableTool(settings: EditorToolsSettings.InsertTableSettings): React_2.ComponentClass<InsertTableProps>;
    const InsertTable_base: React_2.ComponentClass<InsertTableProps, any>;
    /**
     * The InsertTable tool component.
     */
    export class InsertTable extends InsertTable_base {
    }
    /**
     * The props of the `InsertTablePopup` component.
     */
    export interface InsertTablePopupProps extends InsertTablePopupNS.InsertTablePopupProps {
    }
    /**
     * The `InsertTablePopup` component.
     */
    export class InsertTablePopup extends InsertTablePopupNS.InsertTablePopup {
    }
    /**
     * The props for the DropDownList tool component for inline styling of the Editor.
     */
    export interface DropDownListToolProps extends FontStyleToolNS.DropDownListToolProps {
    }
    /**
     * The props for the FontSize tool component of the Editor.
     */
    export interface FontSizeProps extends FontStyleToolNS.DropDownListToolProps {
    }
    /**
     * The props for the FontName tool component of the Editor.
     */
    export interface FontNameProps extends FontStyleToolNS.DropDownListToolProps {
    }
    /**
     * Creates the DropDownList tool component of the Editor which applies inline styles to inline HTML elements.
     *
     * @param {StyleDropDownListSettings} settings
     * @returns {React.ComponentClass<DropDownListToolProps>} - The DropDownList tool component of the Editor.
     */
    export function createStyleDropDownList(settings: EditorToolsSettings.StyleDropDownListSettings): React_2.ComponentClass<DropDownListToolProps, React_2.ComponentState>;
    const FontSize_base: React_2.ComponentClass<DropDownListToolProps, any>;
    /**
     * The FontSize tool component.
     */
    export class FontSize extends FontSize_base {
    }
    const FontName_base: React_2.ComponentClass<DropDownListToolProps, any>;
    /**
     * The FontName tool component.
     */
    export class FontName extends FontName_base {
    }
    /**
     * The props for the ForeColor tool component of the Editor.
     */
    export interface ForeColorProps extends ApplyColorToolProps {
    }
    /**
     * The props for the BackColor tool component of the Editor.
     */
    export interface BackColorProps extends ApplyColorToolProps {
    }
    /**
     * The ForeColor tool component.
     */
    const ForeColor: React_2.FunctionComponent<ForeColorProps>;
    /**
     * The BackColor tool component.
     */
    const BackColor: React_2.FunctionComponent<BackColorProps>;
    /**
     * The props for the FormatBlock tool component of the Editor.
     */
    export interface FormatBlockProps extends FormatBlockToolNS.FormatBlockProps {
    }
    /**
     * Creates the FormatBlock tool component of the Editor.
     *
     * @param {FormatBlockDropDownListSettings} settings
     * @returns {React.ComponentClass<FormatBlockProps>} - The FormatBlock tool component of the Editor.
     */
    export function createFormatBlockDropDownList(settings: EditorToolsSettings.FormatBlockDropDownListSettings): React_2.ComponentClass<FormatBlockProps, React_2.ComponentState>;
    const FormatBlock_base: React_2.ComponentClass<FormatBlockProps, any>;
    /**
     * The FormatBlock tool component.
     */
    export class FormatBlock extends FormatBlock_base {
    }
    /**
     * The props for the Undo tool component of the Editor.
     */
    export interface UndoProps extends HistoryToolNS.UndoProps {
    }
    /**
     * The props for the Redo tool component of the Editor.
     */
    export interface RedoProps extends HistoryToolNS.RedoProps {
    }
    /**
     * Creates the Undo tool component of the Editor.
     *
     * @param {ToolSettings} settings
     * @returns {React.ComponentClass<UndoProps>} - The Undo tool component of the Editor.
     */
    export function createUndoTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the Redo tool component of the Editor.
     *
     * @param {ToolSettings} settings
     * @returns {React.ComponentClass<RedoProps>} - The Redo tool component of the Editor.
     */
    export function createRedoTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    const Undo_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The Undo tool component of the Editor.
     */
    export class Undo extends Undo_base {
    }
    const Redo_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The Redo tool component of the Editor.
     */
    export class Redo extends Redo_base {
    }
    /**
     * The props for the Indent tool component of the Editor.
     */
    export interface IndentProps extends IndentToolNS.IndentProps {
    }
    /**
     * Creates the Indent tool component of the Editor.
     *
     * @param {IndentationSettings} settings
     * @returns {React.ComponentClass<IndentProps>} - The Indent tool component of the Editor.
     */
    export function createIndentTool(settings: EditorToolsSettings.IndentationSettings): React_2.ComponentClass<IndentProps, React_2.ComponentState>;
    const Indent_base: React_2.ComponentClass<IndentProps, any>;
    /**
     * The Indent tool component.
     */
    export class Indent extends Indent_base {
    }
    /**
     * The props for the InlineFormat tool component of the Editor.
     */
    export interface InlineFormatToolProps extends InlineFormatToolNS.InlineFormatToolProps {
    }
    /**
     * The props for the Bold tool component of the Editor.
     */
    export interface BoldProps extends InlineFormatToolNS.BoldProps {
    }
    /**
     * The props for the Italic tool component of the Editor.
     */
    export interface ItalicProps extends InlineFormatToolNS.ItalicProps {
    }
    /**
     * The props for the Underline tool component of the Editor.
     */
    export interface UnderlineProps extends InlineFormatToolNS.UnderlineProps {
    }
    /**
     * The props for the Strikethrough tool component of the Editor.
     */
    export interface StrikethroughProps extends InlineFormatToolNS.StrikethroughProps {
    }
    /**
     * The props for the Subscript tool component of the Editor.
     */
    export interface SubscriptProps extends InlineFormatToolNS.SubscriptProps {
    }
    /**
     * The props for the Superscript tool component of the Editor.
     */
    export interface SuperscriptProps extends InlineFormatToolNS.SuperscriptProps {
    }
    /**
     * Creates the InlineFormat tool component of the Editor.
     *
     * @param {InlineFormatSettings} settings
     * @returns {React.ComponentClass<InlineFormatToolProps>} - Editor's InlineFormat tool component.
     */
    export function createInlineFormatTool(settings: EditorToolsSettings.InlineFormatSettings): React_2.ComponentClass<InlineFormatToolProps, React_2.ComponentState>;
    const Bold_base: React_2.ComponentClass<InlineFormatToolProps, any>;
    /**
     * The Bold tool component.
     */
    export class Bold extends Bold_base {
    }
    const Italic_base: React_2.ComponentClass<InlineFormatToolProps, any>;
    /**
     * The Italic tool component.
     */
    export class Italic extends Italic_base {
    }
    const Underline_base: React_2.ComponentClass<InlineFormatToolProps, any>;
    /**
     * The Underline tool component.
     */
    export class Underline extends Underline_base {
    }
    const Strikethrough_base: React_2.ComponentClass<InlineFormatToolProps, any>;
    /**
     * The Strikethrough tool component.
     */
    export class Strikethrough extends Strikethrough_base {
    }
    const Subscript_base: React_2.ComponentClass<InlineFormatToolProps, any>;
    /**
     * The Subscript tool component.
     */
    export class Subscript extends Subscript_base {
    }
    const Superscript_base: React_2.ComponentClass<InlineFormatToolProps, any>;
    /**
     * The Superscript tool component.
     */
    export class Superscript extends Superscript_base {
    }
    /**
     * The props for the InsertImage tool component of the Editor.
     */
    export interface InsertImageProps extends BasicToolProps, ToolWithDialogRenderProp, ButtonProps {
    }
    /**
     * Creates the InsertImage tool component of the Editor.
     *
     * @param {ImageSettings} settings
     * @returns {React.ComponentClass<InsertImageProps>} - The InsertImage tool component of the Editor.
     */
    export function createInsertImageTool(settings: EditorToolsSettings.ImageSettings): React_2.ComponentClass<InsertImageProps>;
    const InsertImage_base: React_2.ComponentClass<InsertImageProps, any>;
    /**
     * The InsertImage tool component.
     */
    export class InsertImage extends InsertImage_base {
    }
    /**
     * The props for the Link tool component of the Editor.
     */
    export interface LinkProps extends LinkToolNS.LinkProps {
    }
    /**
     * Creates the Link tool component of the Editor.
     *
     * @param {LinkSettings} settings
     * @returns {React.ComponentClass<LinkProps>} - The Link tool component of the Editor.
     */
    export function createLinkTool(settings: EditorToolsSettings.LinkSettings): React_2.ComponentClass<LinkProps>;
    const Link_base: React_2.ComponentClass<LinkProps, any>;
    /**
     * The Link tool component.
     */
    export class Link extends Link_base {
    }
    const InsertFile_base: React_2.ComponentClass<LinkProps, any>;
    /**
     * The InsertFile tool component.
     */
    export class InsertFile extends InsertFile_base {
    }
    /**
     * The base interface of `OrderedListProps` and `UnorderedListProps`.
     */
    export interface ListToolProps extends ListToolNS.ListToolProps {
    }
    /**
     * The props for the OrderedList tool component of the Editor.
     */
    export interface OrderedListProps extends ListToolNS.OrderedListProps {
    }
    /**
     * The props for the UnorderedList tool component of the Editor.
     */
    export interface UnorderedListProps extends ListToolNS.UnorderedListProps {
    }
    /**
     * Creates the List tool component of the Editor.
     *
     * @param {ToolSettings} settings
     * @returns {React.ComponentClass<ListToolProps>} - The List tool component of the Editor.
     */
    export function createListTool(settings: EditorToolsSettings.ListSettings): React_2.ComponentClass<ListToolProps, React_2.ComponentState>;
    const OrderedList_base: React_2.ComponentClass<ListToolProps, any>;
    /**
     * The basic OrderedList tool component. Will render a button which applies `<ol>` HTML element.
     */
    export class OrderedList extends OrderedList_base {
    }
    const UnorderedList_base: React_2.ComponentClass<ListToolProps, any>;
    /**
     * The basic UnorderedList tool component. Will render a button which applies `<ul>` HTML element.
     */
    export class UnorderedList extends UnorderedList_base {
    }
    /**
     * The BulletedList tool component.
     * Will render a SplitButton which applies `<ol>` HTML element with predefined styles - disc and square.
     */
    const BulletedList: (props: any) => JSX.Element;
    /**
     * The NumberedList tool component.
     * Will render a SplitButton which applies `<ul>` HTML element with predefined styles - upper-roman, lower-roman, upper-latin and lower-latin.
     */
    const NumberedList: (props: any) => JSX.Element;
    /**
     * The TableCellProperties tool component.
     */
    const TableCellProperties: React_2.FunctionComponent<TableCellPropertiesProps>;
    /**
     * The props for the TableCellProperties tool component of the Editor.
     */
    export interface TableCellPropertiesProps extends TableCellPropertiesProps {
    }
    /**
     * The TableProperties tool component.
     */
    const TableProperties: React_2.FunctionComponent<TablePropertiesProps>;
    /**
     * The props for the TableProperties tool component of the Editor.
     */
    export interface TablePropertiesProps extends TablePropertiesProps {
    }
    /**
     * The props for the Outdent tool component of the Editor.
     */
    export interface OutdentProps extends IndentToolNS.IndentProps {
    }
    /**
     * Creates the Outdent tool component of the Editor.
     *
     * @param {IndentationSettings} settings
     * @returns {React.ComponentClass<OutdentProps>} - The Outdent tool component of the Editor.
     */
    export function createOutdentTool(settings: EditorToolsSettings.IndentationSettings): React_2.ComponentClass<OutdentProps, React_2.ComponentState>;
    const Outdent_base: React_2.ComponentClass<OutdentProps, any>;
    /**
     * The Outdent tool component.
     */
    export class Outdent extends Outdent_base {
    }
    /**
     * The props for the Print tool component of the Editor.
     */
    export interface PrintProps extends PrintProps {
    }
    /**
     * The Print tool component.
     * Designed to work only if Editor's defaultEditMode prop is set to 'iframe'.
     */
    const Print: React_2.FunctionComponent<PrintProps>;
    /**
     * The props for the Export to PDF tool component of the Editor.
     */
    export interface PdfProps extends PdfProps {
    }
    /**
     * The Export to PDF tool component.
     *
     * To modify the default PDF export options, see the following example:
     *
     * @example
     * ```jsx-no-run
     * import { Editor, EditorTools } from '@progress/kendo-react-editor';
     * const { Bold, Italic, Pdf } = EditorTools;
     *
     * const PdfTool = (props: EditorTools.PdfProps) => (
     *     <Pdf
     *         {...props}
     *         // https://www.telerik.com/kendo-react-ui/components/pdfprocessing/api/PDFExportProps/
     *         savePdfOptions={{
     *             fileName: 'editor-export.pdf',
     *             paperSize: 'A5',
     *             margin: '1cm'
     *         }}
     *     />
     * );
     *
     * const App = () => (
     *     <Editor
     *         tools={[[ Bold, Italic, PdfTool ]]}
     *         contentStyle={{ height: 100 }}
     *         defaultContent="<p>text</p>"
     *     />
     * );
     * ```
     */
    const Pdf: React_2.FunctionComponent<PdfProps>;
    /**
     * The props for the SelectAll tool component of the Editor.
     */
    export interface SelectAllProps extends SelectAllToolProps {
    }
    /**
     * The SelectAll tool component.
     */
    const SelectAll: React_2.FunctionComponent<SelectAllProps>;
    /**
     * The props for the CleanFormatting tool component of the Editor.
     */
    export interface CleanFormattingProps extends CleanFormattingToolProps {
    }
    /**
     * The CleanFormatting tool component.
     */
    const CleanFormatting: React_2.FunctionComponent<CleanFormattingProps>;
    /**
     * The props for the AddRowBefore tool component of the Editor.
     */
    export interface AddRowBeforeProps extends TableEditNS.AddRowBeforeProps {
    }
    /**
     * The props for the AddRowAfter tool component of the Editor.
     */
    export interface AddRowAfterProps extends TableEditNS.AddRowAfterProps {
    }
    /**
     * The props for the AddColumnBefore tool component of the Editor.
     */
    export interface AddColumnBeforeProps extends TableEditNS.AddColumnBeforeProps {
    }
    /**
     * The props for the AddColumnAfter tool component of the Editor.
     */
    export interface AddColumnAfterProps extends TableEditNS.AddColumnAfterProps {
    }
    /**
     * The props for the DeleteRow tool component of the Editor.
     */
    export interface DeleteRowProps extends TableEditNS.DeleteRowProps {
    }
    /**
     * The props for the DeleteColumn tool component of the Editor.
     */
    export interface DeleteColumnProps extends TableEditNS.DeleteColumnProps {
    }
    /**
     * The props for the DeleteTable tool component of the Editor.
     */
    export interface DeleteTableProps extends TableEditNS.DeleteTableProps {
    }
    /**
     * The props for the MergeCells tool component of the Editor.
     */
    export interface MergeCellsProps extends TableEditNS.MergeCellsProps {
    }
    /**
     * The props for the SplitCell tool component of the Editor.
     */
    export interface SplitCellProps extends TableEditNS.SplitCellProps {
    }
    /**
     * Creates the AddRowBefore tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the AddRowBefore tool.
     * @returns {React.ComponentClass<AddRowBeforeProps>} - The AddRowBefore tool component of the Editor.
     */
    export function createAddRowBeforeTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the AddRowAfter tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the AddRowAfter tool.
     * @returns {React.ComponentClass<AddRowAfterProps>} - The AddRowAfter tool component of the Editor.
     */
    export function createAddRowAfterTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the AddColumnBefore tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the AddColumnBefore tool.
     * @returns {React.ComponentClass<AddColumnBeforeProps>} - The AddColumnBefore tool component of the Editor.
     */
    export function createAddColumnBeforeTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the AddColumnAfter tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the AddColumnAfter tool.
     * @returns {React.ComponentClass<AddColumnAfterProps>} - The AddColumnAfter tool component of the Editor.
     */
    export function createAddColumnAfterTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the DeleteRow tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the DeleteRow tool.
     * @returns {React.ComponentClass<DeleteRowProps>} - The DeleteRow tool component of the Editor.
     */
    export function createDeleteRowTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the DeleteColumn tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the DeleteColumn tool.
     * @returns {React.ComponentClass<DeleteColumnProps>} - The DeleteColumn tool component of the Editor.
     */
    export function createDeleteColumnTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the DeleteTable tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the DeleteTable tool.
     * @returns {React.ComponentClass<DeleteTableProps>} - The DeleteTable tool component of the Editor.
     */
    export function createDeleteTableTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the MergeCells tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the MergeCells tool
     * @returns {React.ComponentClass<MergeCellsProps>} - The MergeCells tool component of the Editor.
     */
    export function createMergeCellsTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    /**
     * Creates the SplitCell tool component of the Editor.
     *
     * @param {ToolSettings} - The settings of the SplitCell tool.
     * @returns {React.ComponentClass<SplitCellProps>} - The SplitCell tool component of the Editor.
     */
    export function createSplitCellTool(settings: EditorToolsSettings.ToolSettings): React_2.ComponentClass<ToolProps, React_2.ComponentState>;
    const AddRowBefore_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The AddRowBefore tool component.
     */
    export class AddRowBefore extends AddRowBefore_base {
    }
    const AddRowAfter_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The AddRowAfter tool component.
     */
    export class AddRowAfter extends AddRowAfter_base {
    }
    const AddColumnBefore_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The AddColumnBefore tool component.
     */
    export class AddColumnBefore extends AddColumnBefore_base {
    }
    const AddColumnAfter_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The AddColumnAfter tool component.
     */
    export class AddColumnAfter extends AddColumnAfter_base {
    }
    const DeleteRow_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The DeleteRow tool component.
     */
    export class DeleteRow extends DeleteRow_base {
    }
    const DeleteColumn_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The DeleteColumn tool component.
     */
    export class DeleteColumn extends DeleteColumn_base {
    }
    const DeleteTable_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The DeleteTable tool component.
     */
    export class DeleteTable extends DeleteTable_base {
    }
    const MergeCells_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The MergeCells tool component.
     */
    export class MergeCells extends MergeCells_base {
    }
    const SplitCell_base: React_2.ComponentClass<ToolProps, any>;
    /**
     * The SplitCell tool component.
     */
    export class SplitCell extends SplitCell_base {
    }
    /**
     * The props for the Unlink tool component of the Editor.
     */
    export interface UnlinkProps extends UnlinkToolNS.UnlinkProps {