New to Kendo UI for VueStart a free 30-day trial

Represents a wrapping namespace for the utility functions, nodes, and marks objects of the Editor.

Definition

Package:@progress/kendo-vue-editor

Variables

The PluginKey used in the Editor by the image resizing plugin.

Default:

imageResizeKeyCommon

marks

{ [mark: string]: MarkSpec }

Represents the marks object of the Editor.

nodes

{ [node: string]: NodeSpec }

Represents the nodes object of the Editor.

propsKey

PluginKey

The PluginKey used in the Editor to pass editor props to the tools.

Default:

editorPropsKey

Methods

Aligns the block elements in the selection.

Parameters:viewEditorViewactionsAlignAction[]command?CommandReturns:

boolean

  • If alignment is applied to any of the elements, returns true.

Wraps the selection in a span element with inline styles.

Parameters:viewEditorViewoptions{ style: string; value: string }command?CommandReturns:

boolean

  • If a style is applied to any of the elements, returns true.

Applies the link mark.

Parameters:viewanyoptions{ mark: string; attrs: any }command?CommandReturns:

boolean

  • If the link is applied, returns true.

Checks if any of the list elements in the selection can be indented.

Parameters:stateEditorStatenodeTypeNodeTypeReturns:

boolean

Checks if a node can be inserted in the current selection.

Parameters:stateEditorState

The state object of the Editor.

nodeTypeNodeType

The type of the node that will be inserted.

Returns:

boolean

  • The node of this type can be inserted in the current selection.

Checks if any of the list elements in the selection can be outdented.

Parameters:stateEditorStatelistsTypes{ listItem: string; orderedList: string; bulletList: string }Returns:

boolean

Converts the MS Word lists into HTML lists.

Parameters:htmlstring

The input HTML.

Returns:

string

  • The result HTML.

Creates an Editor document from HTML content.

Parameters:schemaSchema​<any, any>

The schema object of the Editor.

htmlstring

The HTML content.

parseOptions?ParseOptions

The HTML parsing options. Defaults to { preserveWhitespace: 'full' }.

Returns:

Node

  • The document object of the Editor.

Creates a table.

Parameters:tableTypes{ table: NodeType; table_row: NodeType; table_cell: NodeType }

An object which contains table, table_row, and table_cell node types.

rowsnumber

The number of rows.

columnsnumber

The number of columns.

Returns:

Node

  • The generated table.

Formats the paragraph and heading nodes in the selection.

Parameters:viewEditorViewvalue"p" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6"commandName?CommandReturns:

boolean

  • If an element is formatted, returns true.

Returns the paragraph and heading nodes in the selection.

Parameters:stateEditorStateReturns:

string[]

Gets the HTML from the EditorState object.

Parameters:stateEditorState | { doc: Node; schema: Schema​<any, any> }

The state object of the Editor or an object containing editor's doc and schema

  • { doc: value, schema: value.types.schema } where the value variable is the editor's value prop.
Returns:

string

  • The HTML content.
Parameters:stateEditorStatestyle{ name: string; value: RegExp }Returns:

string[]

  • An array of matched styles that are found in the selection.

Returns a mark of the specified type from the nodes in selection.

Parameters:stateEditorStatemarkTypeMarkTypeReturns:

Mark | undefined

A function which returns the mapped Shortcuts object based on the passed settings. Useful when the default Editor nodes or tool settings are changed and the Shortcuts object has to be regenerated.

Parameters:settings?{ types?: { listItem: string; hardBreak: string }; toolsSettings?: { bold?: InlineFormatOptions; italic?: InlineFormatOptions; underline?: InlineFormatOptions } }Returns:

Shortcuts

  • An object which holds the shortcuts.

Checks if according to the specified InlineFormatOptions a node in the selection is present.

Parameters:stateEditorStateoptionsInlineFormatOptionsReturns:

boolean

Checks if the selection contains a specific type of node.

Parameters:stateEditorStatenodeTypeNodeTypeReturns:

boolean

Creates a plugin which adds image resizing functionality.

Parameters:options?ImageResizeOptions

The resizing option (Optional).

Returns:

Plugin

  • The image resizing plugin.

Indents the block elements in the selection.

Parameters:viewEditorViewactionsIndentAction[]command?Commanddir?stringReturns:

boolean

  • If indentation is applied to any of the elements, returns true.

Adds new lines after block elements and hard breaks.

Parameters:contentstring

The HTML content.

Returns:

string

  • The indented HTML.

Inserts a node in the selection.

Parameters:viewEditorView | { state: EditorState; dispatch: (tr: Transaction) => void }

The view object of the Editor.

nodeNode

A node object of the Editor.

scrollIntoView?boolean

An optional parameter. Defines if the content element will be scrolled to the current selection.

Checks if any of the block elements in the selection is aligned.

Parameters:stateEditorStateactionsAlignAction[]Returns:

boolean

Checks if any of the block elements in the selection is indented.

Parameters:stateanyactionsIndentAction[]dir?stringReturns:

boolean

A function for sanitizing the content on paste (see example).

Parameters:htmlstring

The input HTML.

settingsPasteCleanupSettings

The settings used for sanitizing the content.

Returns:

string

  • The resulting HTML.

A function that will remove a DOM attribute from the pasted content (see example).

Parameters:attrAttr

The DOM attribute that will be removed.

Removes the comments from the HTML.

Parameters:htmlstring

The input HTML.

Returns:

string

  • The result HTML.

Removes the specified tag from the HTML and keeps its child nodes.

Parameters:htmlstring

The input HTML.

tagstring

A tag or multiple tags separated by a vertical slash which will be removed. For example, span or b|i|u|span.

Returns:

string

  • The resulting HTML.

If the input html contains images with 'src' pointing to local file system (it happens when pasting images and text from MS Word), the function will extract the images sources from the RTF in base64 format and replace them in the input html.

Parameters:htmlstring

The input HTML (pasted HTML).

clipboardDataDataTransfer

The paste event clipboardData object (event.clipboardData).

Returns:

string

  • The html with the replaced images sources.

Removes the invalid HTML.

Parameters:htmlstring

The HTML which will be sanitized.

Returns:

string

  • The sanitized HTML.

A function for sanitizing the CSS classes of the pasted from MS Word content (see example). The function will remove any class attribute which value starts with Mso. For example <p class="MsoNormal">pasted from MS Word</p> will result in <p>pasted from MS Word</p>.

Parameters:attrAttr

The DOM class attribute that will be sanitized.

A function for sanitizing the style attributes of the pasted from MS Word content (see example). The function will loop through all styles and will remove those that are invalid. For example <p><span style='color:#7C7C7C;mso-themecolor:accent3;mso-themeshade:191;background:silver;'>content</span></p>, will result in <p><span style="color: #7C7C7C; background: silver;">content</span></p>.

Parameters:attrAttr

The DOM style attribute that will be sanitized.

Sets the HTML to the EditorView.

Parameters:viewEditorView

The view object of the Editor.

htmlstring

The HTML content.

command?Command

An optional parameter. Defines the type of the command that will be set to the setHtml metadata of the transaction. Defaults to SetContent.

parseOptions?ParseOptions

An optional parameter. Defines the options that will be used for parsing the HTML. Defaults to { preserveWhitespace: 'full' }.

Creates a plugin which highlights the matches of Find and Replace dialog.

Parameters:key?PluginKey​<any>

The key of the plugin (Optional).

Returns:

Plugin

  • The text highlight plugin.

Toggles the inline element formatting according to the InlineFormatOptions and markAttrs settings.

Parameters:view{ state: EditorState; dispatch: (tr: Transaction) => void }optionsInlineFormatOptionstransaction?TransactionmarkAttrs?anyReturns:

boolean

Toggles a list of the specified type.

Parameters:viewEditorViewtypes{ listType: string; orderedList: string; bulletList: string; listItem: string }command?CommandReturns:

boolean

Interfaces

ImageResizeOptions

ImageResizeOptions

The image resizing plugin options.

Shortcuts

Shortcuts

Represents the Shortcuts object.