suneditor 2.44.5 → 2.44.7

package/src/lib/core.js

@@ -5082,11 +5082,10 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
         setContents: function (html) {
             this.removeRange();
             
-            const convertValue = (html === null || html === undefined) ? '' : this.cleanHTML(html, null, null);
-            this._resetComponents();
-
+            const convertValue = (html === null || html === undefined) ? '' : this.convertContentsForEditor(html, null, null);
             if (!this._variable.isCodeView) {
                 context.element.wysiwyg.innerHTML = convertValue;
+                this._resetComponents();
                 // history stack
                 this.history.push(false);
             } else {
@@ -5103,6 +5102,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
             if (!options.iframe) return false;
             if (ctx.head) this._wd.head.innerHTML = ctx.head.replace(/<script[\s\S]*>[\s\S]*<\/script>/gi, '');
             if (ctx.body) this._wd.body.innerHTML = this.convertContentsForEditor(ctx.body);
+            this._resetComponents();
         },
 
         /**
@@ -5153,6 +5153,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
             // element
             if (node.nodeType === 1) {
                 if (util._disallowedTags(node)) return '';
+                if (/__se__tag/.test(node.className)) return node.outerHTML;
 
                 const ch = util.getListChildNodes(node, function(current) { return util.isSpanWithoutAttr(current) && !util.getParentElement(current, util.isNotCheckingNode); }) || [];
                 for (let i = ch.length - 1; i >= 0; i--) {
@@ -5220,8 +5221,8 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
         _convertFontSize: function (to, size) {
             const math = this._w.Math;
             const value = size.match(/(\d+(?:\.\d+)?)(.+)/);
-            const sizeNum = value[1] * 1;
-            const from = value[2];
+            const sizeNum = value ? value[1] * 1 : util.fontValueMap[size];
+            const from = value ? value[2] : 'rem';
             let pxSize = sizeNum;
             
             if (/em/.test(from)) {
@@ -5262,7 +5263,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
                     const allowedStyle = [];
                     for (let i = 0, len = style.length, r; i < len; i++) {
                         r = style[i].match(/([a-zA-Z0-9-]+)(:)([^:]+$)/);
-                        if (r && !/inherit|initial/i.test(r[3])) {
+                        if (r && !/inherit|initial|revert|unset/i.test(r[3])) {
                             const k = util.kebabToCamelCase(r[1].trim());
                             const v = this.wwComputedStyle[k].replace(/"/g, '');
                             const c = r[3].trim();
@@ -5273,7 +5274,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
                                 case 'fontSize':
                                     if (!options.plugins.fontSize) continue;
                                     if (!this._cleanStyleRegExp.fontSizeUnit.test(r[0])) {
-                                        r[0] = r[0].replace(this._w.RegExp('\\d+' + r[0].match(/\d+(.+$)/)[1]), this._convertFontSize.bind(this, options.fontSizeUnit));
+                                        r[0] = r[0].replace((r[0].match(/:\s*([^;]+)/) || [])[1], this._convertFontSize.bind(this, options.fontSizeUnit));
                                     }
                                     break;
                                 case 'color':
@@ -5322,7 +5323,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
             else v = m.match(lowLevelCheck ? this._attributesWhitelistRegExp : this._attributesWhitelistRegExp_all_data);
             
             // attribute
-            if (lowLevelCheck) {
+            if (lowLevelCheck || tagName === 'span') {
                 if (tagName === 'a') {
                     const sv = m.match(/(?:(?:id|name)\s*=\s*(?:"|')[^"']*(?:"|'))/g);
                     if (sv) {
@@ -5342,27 +5343,17 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
                 else if (sv && !v.some(function (v) { return /^style/.test(v.trim()); })) v.push(sv[0]);
             }
 
-            // img
-            if (tagName === 'img') {
-                let w = '', h = '';
+            // figure
+            if (util.isFigures(tagName)) {
                 const sv = m.match(/style\s*=\s*(?:"|')[^"']*(?:"|')/);
                 if (!v) v = [];
                 if (sv) {
-                    w = sv[0].match(/width:(.+);/);
-                    w = util.getNumber(w ? w[1] : '', -1) || '';
-                    h = sv[0].match(/height:(.+);/);
-                    h = util.getNumber(h ? h[1] : '', -1) || '';
-                } 
-                
-                if (!w || !h) {
-                    const avw = m.match(/width\s*=\s*((?:"|')[^"']*(?:"|'))/);
-                    const avh = m.match(/height\s*=\s*((?:"|')[^"']*(?:"|'))/);
-                    if (avw || avh) {
-                        w = !w ? util.getNumber(avw ? avw[1] : '') || '' : w;
-                        h = !h ? util.getNumber(avh ? avh[1] : '') || '' : h;
-                    }
+                    const wsize = sv[0].match(/width\s?:\s?(\d+)(px|%)/);
+                    const hsize = sv[0].match(/height\s?:\s?(\d+)(px|%)/);
+                    const w_ = wsize && wsize[1] && wsize[2] ? wsize[1] + wsize[2] : 'auto';
+                    const h_ = hsize && hsize[1] && hsize[2] ? hsize[1] + hsize[2] : 'auto';
+                    v.push('style="width:'+ w_ + '; height:'+ h_ + ';"');
                 }
-                v.push('data-origin="' + (w + ',' + h) + '"');
             }
 
             if (v) {
@@ -5457,7 +5448,6 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
          */
         cleanHTML: function (html, whitelist, blacklist) {
             html = this._deleteDisallowedTags(this._parser.parseFromString(html, 'text/html').body.innerHTML).replace(/(<[a-zA-Z0-9\-]+)[^>]*(?=>)/g, this._cleanTags.bind(this, true));
-
             const dom = _d.createRange().createContextualFragment(html);
             try {
                 util._consistencyCheckOfHTML(dom, this._htmlCheckWhitelistRegExp, this._htmlCheckBlacklistRegExp, true);
@@ -5536,7 +5526,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
             for (let i = 0, t; i < domTree.length; i++) {
                 t = domTree[i];
 
-                if (!util.isFormatElement(t) && !util.isRangeFormatElement(t) && !util.isComponent(t) && !util.isMedia(t) && t.nodeType !== 8) {
+                if (!util.isFormatElement(t) && !util.isRangeFormatElement(t) && !util.isComponent(t) && !util.isMedia(t) && t.nodeType !== 8 && !/__se__tag/.test(t.className)) {
                     if (!p) p = util.createElement(options.defaultTag);
                     p.appendChild(t);
                     i--;

package/src/lib/history.d.ts

@@ -1,48 +1,48 @@
-import { Core } from "./core";
-
-export interface History {
-    /**
-     * @description History stack
-     */
-    stack: any[];
-    /**
-     * @description Saving the current status to the history object stack
-     * If "delay" is true, it will be saved after (options.historyStackDelayTime || 400) miliseconds
-     * If the function is called again with the "delay" argument true before it is saved, the delay time is renewal
-     * You can specify the delay time by sending a number.
-     * @param {Boolean} delay If true, Add stack without delay time.
-     */
-    push: (delay: boolean | number) => void;
-    /**
-     * @description Undo function
-     */
-    undo: () => void;
-    /**
-     * @description Redo function
-     */
-    redo: () => void;
-    /**
-     * @description Go to the history stack for that index.
-     * If "index" is -1, go to the last stack
-     * @param {Number} index Stack index
-     */
-    go: (index: number) => void;
-
-    /**
-     * @description Get the current history stack index.
-     * @returns
-     */
-    getCurrentIndex: () => number;
-    
-    /**
-     * @description Reset the history object
-     */
-    reset: (ignoreChangeEvent: any) => void;
-    /**
-     * @description Remove all stacks and remove the timeout function.
-     * @private
-     */
-    _destroy: () => void;
-}
-
-export default function _default(core: Core, change: any): History;
+import { Core } from "./core";
+
+export interface History {
+    /**
+     * @description History stack
+     */
+    stack: any[];
+    /**
+     * @description Saving the current status to the history object stack
+     * If "delay" is true, it will be saved after (options.historyStackDelayTime || 400) miliseconds
+     * If the function is called again with the "delay" argument true before it is saved, the delay time is renewal
+     * You can specify the delay time by sending a number.
+     * @param {Boolean} delay If true, Add stack without delay time.
+     */
+    push: (delay: boolean | number) => void;
+    /**
+     * @description Undo function
+     */
+    undo: () => void;
+    /**
+     * @description Redo function
+     */
+    redo: () => void;
+    /**
+     * @description Go to the history stack for that index.
+     * If "index" is -1, go to the last stack
+     * @param {Number} index Stack index
+     */
+    go: (index: number) => void;
+
+    /**
+     * @description Get the current history stack index.
+     * @returns
+     */
+    getCurrentIndex: () => number;
+    
+    /**
+     * @description Reset the history object
+     */
+    reset: (ignoreChangeEvent: any) => void;
+    /**
+     * @description Remove all stacks and remove the timeout function.
+     * @private
+     */
+    _destroy: () => void;
+}
+
+export default function _default(core: Core, change: any): History;

package/src/lib/history.js

@@ -1,219 +1,219 @@
-/*
- * wysiwyg web editor
- *
- * suneditor.js
- * Copyright 2019 JiHong Lee.
- * MIT license.
- */
-'use strict';
-
-export default function (core, change) {
-    const _w = core._w;
-    const util = core.util;
-    const delayTime = core.options.historyStackDelayTime;
-    let editor = core.context.element;
-    let undo = core.context.tool.undo;
-    let redo = core.context.tool.redo;
-
-    let pushDelay = null;
-    let stackIndex = 0;
-    let stack = [];
-
-    function setContentsFromStack () {
-        const item = stack[stackIndex];
-        editor.wysiwyg.innerHTML = item.contents;
-
-        core.setRange(util.getNodeFromPath(item.s.path, editor.wysiwyg), item.s.offset, util.getNodeFromPath(item.e.path, editor.wysiwyg), item.e.offset);
-        core.focus();
-
-        if (stack.length <= 1) {
-            if (undo) undo.setAttribute('disabled', true);
-            if (redo) redo.setAttribute('disabled', true);
-        } else {
-            if (stackIndex === 0) {
-                if (undo) undo.setAttribute('disabled', true);
-                if (redo) redo.removeAttribute('disabled');
-            } else if (stackIndex === stack.length - 1) {
-                if (undo) undo.removeAttribute('disabled');
-                if (redo) redo.setAttribute('disabled', true);
-            } else {
-                if (undo) undo.removeAttribute('disabled');
-                if (redo) redo.removeAttribute('disabled');
-            }
-        }
-
-        core.controllersOff();
-        core._checkComponents();
-        core._setCharCount();
-        core._resourcesStateChange();
-        
-        // onChange
-        change();
-    }
-
-    function pushStack () {
-        core._checkComponents();
-        const current = core.getContents(true);
-        if (!current || (!!stack[stackIndex] && current === stack[stackIndex].contents)) return;
-
-        stackIndex++;
-        const range = core._variable._range;
-
-        if (stack.length > stackIndex) {
-            stack = stack.slice(0, stackIndex);
-            if (redo) redo.setAttribute('disabled', true);
-        }
-
-        if (!range) {
-            stack[stackIndex] = {
-                contents: current,
-                s: { path: [0, 0], offset: [0, 0] },
-                e: { path: 0, offset: 0 }
-            };
-        } else {
-            stack[stackIndex] = {
-                contents: current,
-                s: {
-                    path: util.getNodePath(range.startContainer, null, null),
-                    offset: range.startOffset
-                },
-                e: {
-                    path: util.getNodePath(range.endContainer, null, null),
-                    offset: range.endOffset
-                }
-            };
-        }
-
-        if (stackIndex === 1 && undo) undo.removeAttribute('disabled');
-
-        core._setCharCount();
-        // onChange
-        change();
-    }
-
-    return {
-        /**
-         * @description History stack
-         */
-        stack: stack,
-
-        /**
-         * @description Saving the current status to the history object stack
-         * If "delay" is true, it will be saved after (options.historyStackDelayTime || 400) miliseconds
-         * If the function is called again with the "delay" argument true before it is saved, the delay time is renewal
-         * You can specify the delay time by sending a number.
-         * @param {Boolean|Number} delay If true, Add stack without delay time.
-         */
-        push: function (delay) {
-            _w.setTimeout(core._resourcesStateChange.bind(core));
-            const time = typeof delay === 'number' ? (delay > 0 ? delay : 0) : (!delay ? 0 : delayTime);
-            
-            if (!time || pushDelay) {
-                _w.clearTimeout(pushDelay);
-                if (!time) {
-                    pushStack();
-                    return;
-                }
-            }
-
-            pushDelay = _w.setTimeout(function () {
-                _w.clearTimeout(pushDelay);
-                pushDelay = null;
-                pushStack();
-            }, time);
-        },
-
-        /**
-         * @description Undo function
-         */
-        undo: function () {
-            if (stackIndex > 0) {
-                stackIndex--;
-                setContentsFromStack();
-            }
-        },
-
-        /**
-         * @description Redo function
-         */
-        redo: function () {
-            if (stack.length - 1 > stackIndex) {
-                stackIndex++;
-                setContentsFromStack();
-            }
-        },
-
-        /**
-         * @description Go to the history stack for that index.
-         * If "index" is -1, go to the last stack
-         */
-        go: function (index) {
-            stackIndex = index < 0 ? (stack.length - 1) : index;
-            setContentsFromStack();
-        },
-
-        /**
-         * @description Get the current history stack index.
-         * @returns {Number} Current Stack index
-         */
-        getCurrentIndex: function () {
-            return stackIndex;
-        },
-        
-        /**
-         * @description Reset the history object
-         */
-        reset: function (ignoreChangeEvent) {
-            if (undo) undo.setAttribute('disabled', true);
-            if (redo) redo.setAttribute('disabled', true);
-            core._variable.isChanged = false;
-            if (core.context.tool.save) core.context.tool.save.setAttribute('disabled', true);
-            
-            stack.splice(0);
-            stackIndex = 0;
-
-            // pushStack
-            stack[stackIndex] = {
-                contents: core.getContents(true),
-                s: {
-                    path: [0, 0],
-                    offset: 0
-                },
-                e: {
-                    path: [0, 0],
-                    offset: 0
-                }
-            };
-
-            if (!ignoreChangeEvent) change();
-        },
-
-        /**
-         * @description Reset the disabled state of the buttons to fit the current stack.
-         * @private
-         */
-        _resetCachingButton: function () {
-            editor = core.context.element;
-            undo = core.context.tool.undo;
-            redo = core.context.tool.redo;
-
-            if (stackIndex === 0) {
-                if (undo) undo.setAttribute('disabled', true);
-                if (redo && stackIndex === stack.length - 1) redo.setAttribute('disabled', true);
-                core._variable.isChanged = false;
-                if (core.context.tool.save) core.context.tool.save.setAttribute('disabled', true);
-            } else if (stackIndex === stack.length - 1) {
-                if (redo) redo.setAttribute('disabled', true);
-            }
-        },
-
-        /**
-         * @description Remove all stacks and remove the timeout function.
-         * @private
-         */
-        _destroy: function () {
-            if (pushDelay) _w.clearTimeout(pushDelay);
-            stack = null;
-        }
-    };
+/*
+ * wysiwyg web editor
+ *
+ * suneditor.js
+ * Copyright 2019 JiHong Lee.
+ * MIT license.
+ */
+'use strict';
+
+export default function (core, change) {
+    const _w = core._w;
+    const util = core.util;
+    const delayTime = core.options.historyStackDelayTime;
+    let editor = core.context.element;
+    let undo = core.context.tool.undo;
+    let redo = core.context.tool.redo;
+
+    let pushDelay = null;
+    let stackIndex = 0;
+    let stack = [];
+
+    function setContentsFromStack () {
+        const item = stack[stackIndex];
+        editor.wysiwyg.innerHTML = item.contents;
+
+        core.setRange(util.getNodeFromPath(item.s.path, editor.wysiwyg), item.s.offset, util.getNodeFromPath(item.e.path, editor.wysiwyg), item.e.offset);
+        core.focus();
+
+        if (stack.length <= 1) {
+            if (undo) undo.setAttribute('disabled', true);
+            if (redo) redo.setAttribute('disabled', true);
+        } else {
+            if (stackIndex === 0) {
+                if (undo) undo.setAttribute('disabled', true);
+                if (redo) redo.removeAttribute('disabled');
+            } else if (stackIndex === stack.length - 1) {
+                if (undo) undo.removeAttribute('disabled');
+                if (redo) redo.setAttribute('disabled', true);
+            } else {
+                if (undo) undo.removeAttribute('disabled');
+                if (redo) redo.removeAttribute('disabled');
+            }
+        }
+
+        core.controllersOff();
+        core._checkComponents();
+        core._setCharCount();
+        core._resourcesStateChange();
+        
+        // onChange
+        change();
+    }
+
+    function pushStack () {
+        core._checkComponents();
+        const current = core.getContents(true);
+        if (!current || (!!stack[stackIndex] && current === stack[stackIndex].contents)) return;
+
+        stackIndex++;
+        const range = core._variable._range;
+
+        if (stack.length > stackIndex) {
+            stack = stack.slice(0, stackIndex);
+            if (redo) redo.setAttribute('disabled', true);
+        }
+
+        if (!range) {
+            stack[stackIndex] = {
+                contents: current,
+                s: { path: [0, 0], offset: [0, 0] },
+                e: { path: 0, offset: 0 }
+            };
+        } else {
+            stack[stackIndex] = {
+                contents: current,
+                s: {
+                    path: util.getNodePath(range.startContainer, null, null),
+                    offset: range.startOffset
+                },
+                e: {
+                    path: util.getNodePath(range.endContainer, null, null),
+                    offset: range.endOffset
+                }
+            };
+        }
+
+        if (stackIndex === 1 && undo) undo.removeAttribute('disabled');
+
+        core._setCharCount();
+        // onChange
+        change();
+    }
+
+    return {
+        /**
+         * @description History stack
+         */
+        stack: stack,
+
+        /**
+         * @description Saving the current status to the history object stack
+         * If "delay" is true, it will be saved after (options.historyStackDelayTime || 400) miliseconds
+         * If the function is called again with the "delay" argument true before it is saved, the delay time is renewal
+         * You can specify the delay time by sending a number.
+         * @param {Boolean|Number} delay If true, Add stack without delay time.
+         */
+        push: function (delay) {
+            _w.setTimeout(core._resourcesStateChange.bind(core));
+            const time = typeof delay === 'number' ? (delay > 0 ? delay : 0) : (!delay ? 0 : delayTime);
+            
+            if (!time || pushDelay) {
+                _w.clearTimeout(pushDelay);
+                if (!time) {
+                    pushStack();
+                    return;
+                }
+            }
+
+            pushDelay = _w.setTimeout(function () {
+                _w.clearTimeout(pushDelay);
+                pushDelay = null;
+                pushStack();
+            }, time);
+        },
+
+        /**
+         * @description Undo function
+         */
+        undo: function () {
+            if (stackIndex > 0) {
+                stackIndex--;
+                setContentsFromStack();
+            }
+        },
+
+        /**
+         * @description Redo function
+         */
+        redo: function () {
+            if (stack.length - 1 > stackIndex) {
+                stackIndex++;
+                setContentsFromStack();
+            }
+        },
+
+        /**
+         * @description Go to the history stack for that index.
+         * If "index" is -1, go to the last stack
+         */
+        go: function (index) {
+            stackIndex = index < 0 ? (stack.length - 1) : index;
+            setContentsFromStack();
+        },
+
+        /**
+         * @description Get the current history stack index.
+         * @returns {Number} Current Stack index
+         */
+        getCurrentIndex: function () {
+            return stackIndex;
+        },
+        
+        /**
+         * @description Reset the history object
+         */
+        reset: function (ignoreChangeEvent) {
+            if (undo) undo.setAttribute('disabled', true);
+            if (redo) redo.setAttribute('disabled', true);
+            core._variable.isChanged = false;
+            if (core.context.tool.save) core.context.tool.save.setAttribute('disabled', true);
+            
+            stack.splice(0);
+            stackIndex = 0;
+
+            // pushStack
+            stack[stackIndex] = {
+                contents: core.getContents(true),
+                s: {
+                    path: [0, 0],
+                    offset: 0
+                },
+                e: {
+                    path: [0, 0],
+                    offset: 0
+                }
+            };
+
+            if (!ignoreChangeEvent) change();
+        },
+
+        /**
+         * @description Reset the disabled state of the buttons to fit the current stack.
+         * @private
+         */
+        _resetCachingButton: function () {
+            editor = core.context.element;
+            undo = core.context.tool.undo;
+            redo = core.context.tool.redo;
+
+            if (stackIndex === 0) {
+                if (undo) undo.setAttribute('disabled', true);
+                if (redo && stackIndex === stack.length - 1) redo.setAttribute('disabled', true);
+                core._variable.isChanged = false;
+                if (core.context.tool.save) core.context.tool.save.setAttribute('disabled', true);
+            } else if (stackIndex === stack.length - 1) {
+                if (redo) redo.setAttribute('disabled', true);
+            }
+        },
+
+        /**
+         * @description Remove all stacks and remove the timeout function.
+         * @private
+         */
+        _destroy: function () {
+            if (pushDelay) _w.clearTimeout(pushDelay);
+            stack = null;
+        }
+    };
 }