@progress/kendo-react-editor
Version:
Kendo UI for React Editor package
388 lines • 15.3 kB
JavaScript
;
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
var shortcuts = require("./../config/shortcuts");
var schema_1 = require("./../config/schema");
var kendo_editor_common_1 = require("@progress/kendo-editor-common");
/**
* Represents a wrapping namespace for the utility functions, `nodes`, and `marks` objects of the Editor.
*/
var EditorUtils;
(function (EditorUtils) {
/**
* Aligns the block elements in the selection.
*
* @returns {boolean} - If alignment is applied to any of the elements, returns `true`.
*/
function alignBlocks(view, actions, command) {
return Boolean(kendo_editor_common_1.alignBlocks(actions, command)(view.state, view.dispatch));
}
EditorUtils.alignBlocks = alignBlocks;
/**
* Wraps the selection in a `span` element with inline styles.
*
* @returns {boolean} - If a style is applied to any of the elements, returns `true`.
*/
function applyInlineStyle(view, options, command) {
return kendo_editor_common_1.applyInlineStyle(options, command)(view.state, view.dispatch);
}
EditorUtils.applyInlineStyle = applyInlineStyle;
/**
* Applies the link mark.
*
* @returns {boolean} - If the link is applied, returns `true`.
*/
function applyLink(view, options, command) {
return kendo_editor_common_1.applyLink(options, command)(view.state, view.dispatch);
}
EditorUtils.applyLink = applyLink;
/**
* Checks if any of the `list` elements in the selection can be indented.
*
* @returns {boolean}
*/
function canIndentList(state, nodeType) {
return kendo_editor_common_1.canIndentAsListItem(state, nodeType);
}
EditorUtils.canIndentList = canIndentList;
/**
* Checks if a node can be inserted in the current selection.
*
* @param {EditorState} state - The `state` object of the Editor.
* @param {NodeType} nodeType - The type of the node that will be inserted.
* @returns {boolean} - The node of this type can be inserted in the current selection.
*/
function canInsert(state, nodeType) {
return kendo_editor_common_1.canInsert(state, nodeType);
}
EditorUtils.canInsert = canInsert;
/**
* Checks if any of the `list` elements in the selection can be outdented.
*
* @returns {boolean}
*/
function canOutdentList(state, listsTypes) {
return kendo_editor_common_1.canOutdentAsListItem(state, { listsTypes: listsTypes, nodes: [] });
}
EditorUtils.canOutdentList = canOutdentList;
/**
* Converts the MS Word lists into HTML lists.
*
* @param {string} html - The input HTML.
* @returns {string} - The result HTML.
*/
function convertMsLists(html) { return kendo_editor_common_1.convertMsLists(html); }
EditorUtils.convertMsLists = convertMsLists;
/**
* Creates an Editor document from HTML content.
*
* @param {Schema} schema - The `schema` object of the Editor.
* @param {string} html - The HTML content.
* @param {ParseOptions} parseOptions - The HTML parsing options. Defaults to `{ preserveWhitespace: 'full' }`.
* @returns {Node} - The `document` object of the Editor.
*/
function createDocument(schema, html, parseOptions) { return kendo_editor_common_1.parseContent(html, schema, parseOptions !== undefined ? parseOptions : { preserveWhitespace: 'full' }); }
EditorUtils.createDocument = createDocument;
/**
* Creates a table.
*
* @param {object} tableTypes - An object which contains `table`, `table_row`, and `table_cell` node types.
* @param {number} rows - The number of rows.
* @param {number} columns - The number of columns.
* @returns {Node<any>} - The generated table.
*
* @example
* ```jsx-no-run
* import { EditorUtils } from '@progress/kendo-react-editor';
*
* const nodes = editorRef.view.state.schema.nodes;
* const rows = 3;
* const columns = 4;
*
* const table = EditorUtils.createTable(nodes, rows, columns);
* ```
*/
function createTable(tableTypes, rows, columns) {
return kendo_editor_common_1.createTable(tableTypes, rows, columns);
}
EditorUtils.createTable = createTable;
/**
* Formats the paragraph and heading nodes in the selection.
*
* @returns {boolean} - If an element is formatted, returns `true`.
*/
function formatBlockElements(view, value, commandName) {
return kendo_editor_common_1.formatBlockElements(value, commandName)(view.state, view.dispatch);
}
EditorUtils.formatBlockElements = formatBlockElements;
/**
* Returns the paragraph and heading nodes in the selection.
*
* @returns {string[]}
*/
function getBlockFormats(state) {
return kendo_editor_common_1.getBlockFormats(state);
}
EditorUtils.getBlockFormats = getBlockFormats;
/**
* Gets the HTML from the `EditorState` object.
*
* @param {EditorState} state - 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.
*/
function getHtml(state) {
return kendo_editor_common_1.getHtml(state);
}
EditorUtils.getHtml = getHtml;
/**
* @returns {string[]} - An array of matched styles that are found in the selection.
*/
function getInlineStyles(state, style) {
return kendo_editor_common_1.getInlineStyles(state, style);
}
EditorUtils.getInlineStyles = getInlineStyles;
/**
* Returns a mark of the specified type from the nodes in selection.
*
* @returns {Mark<any>}
*/
function getMark(state, markType) {
return kendo_editor_common_1.getMark(state, markType);
}
EditorUtils.getMark = getMark;
/**
* Checks if according to the specified `InlineFormatOptions` a node in the selection is present.
*
* @returns {boolean}
*/
function hasMark(state, options) {
return kendo_editor_common_1.hasMark(state, options);
}
EditorUtils.hasMark = hasMark;
/**
* Checks if the selection contains a specific type of node.
*
* @returns {boolean}
*/
function hasNode(state, nodeType) {
return kendo_editor_common_1.hasNode(state, nodeType);
}
EditorUtils.hasNode = hasNode;
/**
* Indents the block elements in the selection.
*
* @returns {boolean} - If indentation is applied to any of the elements, returns `true`.
*/
function indentBlocks(view, actions, command, dir) {
return Boolean(kendo_editor_common_1.indentBlocks(actions, command, dir)(view.state, view.dispatch));
}
EditorUtils.indentBlocks = indentBlocks;
/**
* Adds new lines after block elements and hard breaks.
*
* @param {string} content - The HTML content.
* @returns {string} - The indented HTML.
*/
function indentHtml(content) {
return kendo_editor_common_1.indentHtml(content);
}
EditorUtils.indentHtml = indentHtml;
/**
* Inserts a node in the selection.
*
* @param {EditorView} view - The `view` object of the Editor.
* @param {Node} node - A `node` object of the Editor.
* @param {boolean} scrollIntoView - An optional parameter.
* Defines if the content element will be scrolled to the current selection.
*/
function insertNode(view, node, scrollIntoView) {
kendo_editor_common_1.insertNode(node, scrollIntoView)(view.state, view.dispatch);
}
EditorUtils.insertNode = insertNode;
/**
* Checks if any of the block elements in the selection is aligned.
*
* @returns {boolean}
*/
function isAligned(state, actions) {
return kendo_editor_common_1.isAligned(state, actions);
}
EditorUtils.isAligned = isAligned;
/**
* Checks if any of the block elements in the selection is indented.
*
* @returns {boolean}
*/
function isIndented(state, actions, dir) {
return kendo_editor_common_1.isIndented(state, actions, dir);
}
EditorUtils.isIndented = isIndented;
/**
* Removes the comments from the HTML.
*
* @param {string} html - The input HTML.
* @returns {string} - The result HTML.
*
* @example
* ```jsx-no-run
* import { EditorUtils } from '@progress/kendo-react-editor';
* const html = EditorUtils.removeComments('<p>some content<!-- comment --></p>');
* ```
*/
function removeComments(html) {
return kendo_editor_common_1.removeComments(html);
}
EditorUtils.removeComments = removeComments;
/**
* Removes the specified tag from the HTML and keeps its child nodes.
*
* @param {string} html - The input HTML.
* @param {string} tag - 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.
*
* @example
* ```jsx-no-run
* import { EditorUtils } from '@progress/kendo-react-editor';
* const html = EditorUtils.removeTag('<p>some <span>content</span></p>', 'span|p');
* ```
*/
function removeTag(html, tag) {
return kendo_editor_common_1.removeTag(html, tag);
}
EditorUtils.removeTag = removeTag;
/**
* A function for sanitizing the content on paste ([see example]({% slug paste_editor %})).
*
* @param {string} html - The input HTML.
* @param {PasteCleanupSettings} settings - The settings used for sanitizing the content.
* @returns {string} - The resulting HTML.
*/
function pasteCleanup(html, settings) {
return kendo_editor_common_1.pasteCleanup(html, settings);
}
EditorUtils.pasteCleanup = pasteCleanup;
/**
* A function for sanitizing the CSS classes of the pasted from MS Word content ([see example]({% slug paste_editor %})).
* 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>`.
*
* @param {Attr} attr - The DOM class attribute that will be sanitized.
*/
function sanitizeClassAttr(attr) {
kendo_editor_common_1.sanitizeClassAttr(attr);
}
EditorUtils.sanitizeClassAttr = sanitizeClassAttr;
/**
* A function for sanitizing the style attributes of the pasted from MS Word content ([see example]({% slug paste_editor %})).
* 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>`.
*
* @param {Attr} attr - The DOM style attribute that will be sanitized.
*/
function sanitizeStyleAttr(attr) {
kendo_editor_common_1.sanitizeStyleAttr(attr);
}
EditorUtils.sanitizeStyleAttr = sanitizeStyleAttr;
/**
* A function that will remove a DOM attribute from the pasted content ([see example]({% slug paste_editor %})).
*
* @param {Attr} attr - The DOM attribute that will be removed.
*/
function removeAttribute(attr) {
kendo_editor_common_1.removeAttribute(attr);
}
EditorUtils.removeAttribute = removeAttribute;
/**
* Removes the invalid HTML.
*
* @param {string} html - The HTML which will be sanitized.
* @returns {string} - The sanitized HTML.
*
* @example
* ```jsx-no-run
* import { EditorUtils } from '@progress/kendo-react-editor';
* const html = EditorUtils.sanitize('something pasted from MS Word, containing <o:p>, <w:sdtPr>, <v:shapes tags');
* ```
*/
function sanitize(html) {
return kendo_editor_common_1.sanitize(html);
}
EditorUtils.sanitize = sanitize;
/**
* Creates a plugin which highlights the matches of Find and Replace dialog.
*
* @param {PluginKey} key - The key of the plugin (Optional).
* @returns {Plugin} - The text highlight plugin.
*/
function textHighlight(key) {
return kendo_editor_common_1.textHighlight(key);
}
EditorUtils.textHighlight = textHighlight;
/**
* Sets the HTML to the `EditorView`.
*
* @param {EditorView} view - The `view` object of the Editor.
* @param {string} html - The HTML content.
* @param {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`.
* @param {ParseOptions} parseOptions - An optional parameter.
* Defines the options that will be used for parsing the HTML. Defaults to `{ preserveWhitespace: 'full' }`.
*/
function setHtml(view, html, command, parseOptions) {
kendo_editor_common_1.setHtml(html, command, parseOptions)(view.state, view.dispatch);
}
EditorUtils.setHtml = setHtml;
/**
* Toggles the inline element formatting according to the `InlineFormatOptions` and `markAttrs` settings.
*
* @returns {boolean}
*/
function toggleInlineFormat(view, options, transaction, markAttrs) {
return kendo_editor_common_1.toggleInlineFormat(options, transaction, markAttrs)(view.state, view.dispatch);
}
EditorUtils.toggleInlineFormat = toggleInlineFormat;
/**
* Toggles a list of the specified type.
*
* @returns {boolean}
*/
function toggleList(view, types, command) {
return kendo_editor_common_1.toggleList(view.state, view.dispatch, view, types, command);
}
EditorUtils.toggleList = toggleList;
// tslint:disable:max-line-length
/**
* 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.
* @params - An object which holds specific types of nodes and tool settings that are used by the default `Shortcuts` handlers.
* @returns - An object which holds the shortcuts.
*/
// tslint:enable:max-line-length
function getShortcuts(settings) {
return shortcuts.getShortcuts(settings);
}
EditorUtils.getShortcuts = getShortcuts;
/**
* Represents the `marks` object of the Editor.
*/
EditorUtils.marks = __assign({}, schema_1.marks);
/**
* Represents the `nodes` object of the Editor.
*/
EditorUtils.nodes = __assign({}, schema_1.nodes);
})(EditorUtils = exports.EditorUtils || (exports.EditorUtils = {}));
//# sourceMappingURL=index.js.map