kedao
Version:
Rich Text Editor Based On Draft.js
109 lines (108 loc) • 8.45 kB
TypeScript
import { KeyboardEvent } from 'react';
import { EditorState, RawDraftContentState, SelectionState, convertFromRaw, ContentBlock, DraftInlineStyle, convertToRaw } from 'draft-js';
import Immutable from 'immutable';
import { ConvertOptions, Position } from '../types';
export declare const registerStrictBlockType: (blockType: string) => void;
export declare const selectionContainsBlockType: (editorState: EditorState, blockType: string) => ContentBlock;
export declare const selectionContainsStrictBlock: (editorState: EditorState) => ContentBlock;
export declare const selectBlock: (editorState: EditorState, block: ContentBlock) => EditorState;
export declare const selectNextBlock: (editorState: EditorState, block: ContentBlock) => EditorState;
export declare const removeBlock: (editorState: EditorState, block: ContentBlock, lastSelection?: SelectionState | null) => EditorState;
export declare const getSelectionBlock: (editorState: EditorState) => ContentBlock;
export declare const updateEachCharacterOfSelection: (editorState: EditorState, callback: (character: any) => any) => EditorState;
export declare const getSelectedBlock: (editorState: EditorState) => ContentBlock;
export declare const getSelectedBlocks: (editorState: EditorState) => ContentBlock[];
export declare const setSelectionBlockData: (editorState: EditorState, blockData: any, override?: boolean) => EditorState;
export declare const getSelectionBlockData: (editorState: EditorState, name?: string) => any;
export declare const getSelectionBlockType: (editorState: EditorState) => string;
export declare const getSelectionText: (editorState: EditorState) => string;
export declare const toggleSelectionBlockType: (editorState: EditorState, blockType: string) => EditorState;
export declare const getSelectionEntityType: (editorState: EditorState) => string;
export declare const getSelectionEntityData: (editorState: EditorState, type: string) => any;
export declare const toggleSelectionEntity: (editorState: EditorState, entity: any) => EditorState;
export declare const toggleSelectionLink: (editorState: EditorState, href: any, target?: any) => EditorState;
export declare const getSelectionInlineStyle: (editorState: EditorState) => DraftInlineStyle;
export declare const selectionHasInlineStyle: (editorState: EditorState, style: string) => boolean;
export declare const toggleSelectionInlineStyle: (editorState: EditorState, style: string, prefix?: string) => EditorState;
export declare const removeSelectionInlineStyles: (editorState: EditorState) => EditorState;
export declare const toggleSelectionAlignment: (editorState: EditorState, alignment: any) => EditorState;
export declare const toggleSelectionIndent: (editorState: EditorState, textIndent: any, maxIndent?: number) => EditorState;
export declare const increaseSelectionIndent: (editorState: EditorState, maxIndent?: number) => EditorState;
export declare const decreaseSelectionIndent: (editorState: EditorState, maxIndent?: any) => EditorState;
export declare const toggleSelectionColor: (editorState: EditorState, color: any) => EditorState;
export declare const toggleSelectionBackgroundColor: (editorState: EditorState, color: string) => EditorState;
export declare const toggleSelectionFontSize: (editorState: EditorState, fontSize: any) => EditorState;
export declare const toggleSelectionLineHeight: (editorState: EditorState, lineHeight: any) => EditorState;
export declare const toggleSelectionFontFamily: (editorState: EditorState, fontFamily: any) => EditorState;
export declare const toggleSelectionLetterSpacing: (editorState: EditorState, letterSpacing: string) => EditorState;
export declare const insertText: (editorState: EditorState, text: string, inlineStyle?: DraftInlineStyle, entity?: any) => EditorState;
export declare const insertHTML: (editorState: EditorState, options: ConvertOptions, htmlString: string, source: string) => EditorState;
export declare const insertAtomicBlock: (editorState: EditorState, type: string, immutable?: boolean, data?: {}) => any;
export declare const insertHorizontalLine: (editorState: EditorState) => any;
export declare const insertMedias: (editorState: EditorState, medias?: any[]) => EditorState;
export declare const setMediaData: (editorState: EditorState, entityKey: string, data: Record<string, any>) => EditorState;
export declare const removeMedia: (editorState: EditorState, mediaBlock: ContentBlock) => EditorState;
export declare const setMediaPosition: (editorState: EditorState, mediaBlock: any, position: Position) => EditorState;
export declare const clear: (editorState: EditorState) => EditorState;
export declare const handleKeyCommand: (editorState: EditorState, command: string) => null;
export declare const undo: (editorState: EditorState) => EditorState;
export declare const redo: (editorState: EditorState) => EditorState;
export declare const UniqueIndex: () => number;
export declare const getHexColor: (color: string) => any;
export declare const detectColorsFromHTMLString: (html: string) => any[];
export declare const detectColorsFromDraftState: (draftState: RawDraftContentState) => any[];
/**
* Function will handle followind keyPress scenario:
* case Shift+Enter, select not collapsed ->
* selected text will be removed and line break will be inserted.
* Credit: https://github.com/jpuri/draftjs-utils/blob/9e96939aa4a41bb89ad57f8c71c6a8c27efb76f8/js/block.js
*/
export declare function addLineBreakRemovingSelection(editorState: EditorState): EditorState;
/**
* This function will return the entity applicable to whole of current selection.
* An entity can not span multiple blocks.
* Credit: https://github.com/jpuri/draftjs-utils/blob/9e96939aa4a41bb89ad57f8c71c6a8c27efb76f8/js/inline.js
*/
export declare const getSelectionEntity: (editorState: EditorState) => any;
/**
* Function will add block level meta-data.
* Credit: https://github.com/jpuri/draftjs-utils/blob/9e96939aa4a41bb89ad57f8c71c6a8c27efb76f8/js/block.js
*/
export declare const setBlockData: (editorState: EditorState, data: Immutable.Map<any, any>) => EditorState;
/**
* The function will handle keypress 'Enter' in editor. Following are the scenarios:
*
* 1. Shift+Enter, Selection Collapsed -> line break will be inserted.
* 2. Shift+Enter, Selection not Collapsed ->
* selected text will be removed and line break will be inserted.
* 3. Enter, Selection Collapsed ->
* if current block is of type list and length of block is 0
* a new list block of depth less that current one will be inserted.
* 4. Enter, Selection Collapsed ->
* if current block not of type list, a new unstyled block will be inserted.
* Credit: https://github.com/jpuri/draftjs-utils/blob/9e96939aa4a41bb89ad57f8c71c6a8c27efb76f8/js/keyPress.js
*/
export declare const handleNewLine: (editorState: EditorState, event: KeyboardEvent<{}>) => EditorState;
/**
* Function to check if a block is of type list.
* Credit: https://github.com/jpuri/draftjs-utils/blob/9e96939aa4a41bb89ad57f8c71c6a8c27efb76f8/js/list.js
*/
export declare function isListBlock(block: ContentBlock): boolean;
export declare const compressImage: (url: any, width?: number, height?: number) => Promise<unknown>;
export declare const getToHTMLConfig: (options: ConvertOptions) => {
styleToHTML: (style: any) => any;
entityToHTML: (entity: any, originalText: any) => any;
blockToHTML: (block: any) => any;
};
export declare const getFromHTMLConfig: (options: ConvertOptions, source?: string) => {
htmlToStyle: (nodeName: string, node: any, currentStyle: any) => any;
htmlToEntity: (nodeName: string, node: HTMLVideoElement & HTMLImageElement, createEntity: any) => any;
htmlToBlock: (nodeName: string, node: HTMLElement) => any;
};
export declare const convertRawToHTML: (rawContent: any, options: any) => any;
export declare const convertHTMLToRaw: (HTMLString: string, options?: ConvertOptions, source?: string) => {};
export declare const convertEditorStateToHTML: (editorState: EditorState, options?: ConvertOptions) => any;
export declare const convertHTMLToEditorState: (HTMLString: string, editorDecorators: any, options: ConvertOptions, source?: string) => EditorState;
export declare const convertEditorStateToRaw: (editorState: EditorState) => RawDraftContentState;
export declare const convertRawToEditorState: (rawContent: any, editorDecorators?: any) => EditorState;
export { convertFromRaw, convertToRaw };