@mnykj/wangeditoroptimize-core 1.0.0 → 1.0.1

package/dist/core/src/editor/interface.d.ts

@@ -21,6 +21,7 @@ export interface IDomEditor extends Editor {
     getAllMenuKeys: () => string[];
     alert: (info: string, type: AlertType) => void;
     handleTab: () => void;
+    handleShiftTab: () => void;
     getHtml: () => string;
     getText: () => string;
     getSelectionText: () => string;

package/dist/core/src/index.d.ts

@@ -19,6 +19,8 @@ export * from './menus/index';
 export * from './upload/index';
 export * from './i18n/index';
 export { pinEditorScrollDuring, findEditorScrollParent } from './utils/pin-scroll';
+export { withIsolatedHistoryBatch, cancelPendingHistorySplit } from './utils/history-batch';
+export { withTypingHistory, markTypingHistoryCompositionStart, markTypingHistoryCompositionEnd, resetTypingHistoryState, } from './utils/typing-history';
 export { getEditorNodeAtPath, isBlankParagraphNode, genEmptyParagraph, insertEmptyLineAboveAtPath, canRemoveEmptyLineAboveBlock, removeEmptyLineAboveTopLevelBlock, replaceBlockWithEmptyLine, setBlockToParagraph, resolveElemPath, } from './utils/block-helpers';
 export interface IModuleConf {
     menus: Array<IRegisterMenuConf>;

package/dist/core/src/menus/bar/HoverBar.d.ts

@@ -16,8 +16,8 @@ declare class HoverBar {
     };
     hideAndClean(): void;
     /**
-     * 判断 hoverbar 是否在网页下部？
-     * 如果是，SelectList 和 DropPanel 要显示在 hoverbar 上面
+     * 判断 SelectList / DropPanel 默认向上还是向下。
+     * 色板约 220px、标题列表更高；不再用固定 360px（否则下方够放色板仍强制向上，易被遮挡）。
      */
     private checkPositionBottom;
     private show;

package/dist/core/src/menus/panel-and-modal/SelectList.d.ts

@@ -10,6 +10,8 @@ declare class SelectList extends PanelAndModal {
     type: string;
     readonly $elem: Dom7Array;
     constructor(editor: IDomEditor, width?: number);
+    /** 从点击目标解析 li（点到 span / svg 时也能取到 data-value） */
+    static findOptionLi(target: EventTarget | null): Element | null;
     /**
      * 渲染 list
      * @param options select options

package/dist/core/src/utils/history-batch.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @description Isolate a user action (e.g. paste) as one undo batch that does not
+ * merge with adjacent typing. slate-history 0.66 merges contiguous insert_text
+ * forever and has no withNewBatch — this helper emulates that behavior.
+ */
+import { Editor } from 'slate';
+/** Drop a pending post-paste one-shot wrapper (e.g. before programmatic setHtml). */
+export declare function cancelPendingHistorySplit(editor: Editor): void;
+/**
+ * Run `fn` as a single undo/redo batch that:
+ * 1. Does not merge into the previous history batch
+ * 2. Merges all ops produced inside `fn` into one batch
+ * 3. Ensures the next content edit after `fn` starts a new batch (so typing
+ *    after paste is not coalesced with the paste)
+ */
+export declare function withIsolatedHistoryBatch(editor: Editor, fn: () => void): void;

package/dist/core/src/utils/hotkeys.d.ts

@@ -27,6 +27,7 @@ declare const _default: {
     isTransposeCharacter: (event: KeyboardEvent) => boolean;
     isUndo: (event: KeyboardEvent) => boolean;
     isTab: (event: KeyboardEvent) => boolean;
+    isShiftTab: (event: KeyboardEvent) => boolean;
     isSelectAll: (event: KeyboardEvent) => boolean;
 };
 /**

package/dist/core/src/utils/typing-history.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @description Undo for keyed-in text: each typed character (letter / digit /
+ * symbol) is one Ctrl+Z step. Paste is excluded — withIsolatedHistoryBatch
+ * forces MERGING so a whole paste stays one batch.
+ *
+ * IME 上屏多为一次 insert_text（整词）→ 仍是一步。
+ * 多字 delete（选区删除）不强制断批，避免拆成多次撤销。
+ *
+ * Must wrap the editor *outside* slate-history's withHistory.
+ */
+import { Editor } from 'slate';
+/** Clear typing-history bookkeeping (e.g. after programmatic setHtml). */
+export declare function resetTypingHistoryState(editor: Editor): void;
+/** @deprecated no-op; composition 已由 insert_text 断批覆盖 */
+export declare function markTypingHistoryCompositionStart(_editor: Editor): void;
+/** @deprecated no-op; composition 已由 insert_text 断批覆盖 */
+export declare function markTypingHistoryCompositionEnd(_editor: Editor): void;
+/**
+ * Plugin: one undo step per typed character (paste excluded via MERGING).
+ * Place outside `withHistory`.
+ */
+export declare function withTypingHistory<T extends Editor>(editor: T): T;

package/dist/css/style.css

@@ -1 +1 @@
-.w-e-text-container *,.w-e-toolbar *{box-sizing:border-box;margin:0;outline:none;padding:0}.w-e-text-container blockquote,.w-e-text-container li,.w-e-text-container p,.w-e-text-container td,.w-e-text-container th,.w-e-toolbar *{line-height:1.5}.w-e-text-container{background-color:var(--w-e-textarea-bg-color);color:var(--w-e-textarea-color);height:100%;position:relative}.w-e-text-container .w-e-scroll{-webkit-overflow-scrolling:touch;height:100%}.w-e-text-container [data-slate-editor]{word-wrap:break-word;border-top:1px solid transparent;min-height:100%;outline:0;padding:0 10px;white-space:pre-wrap}.w-e-text-container [data-slate-editor] p{margin:15px 0}.w-e-text-container [data-slate-editor] h1,.w-e-text-container [data-slate-editor] h2,.w-e-text-container [data-slate-editor] h3,.w-e-text-container [data-slate-editor] h4,.w-e-text-container [data-slate-editor] h5{margin:20px 0}.w-e-text-container [data-slate-editor] img{cursor:default;display:inline!important;max-width:100%;min-height:20px;min-width:20px}.w-e-text-container [data-slate-editor] span{text-indent:0}.w-e-text-container [data-slate-editor] [data-selected=true]{box-shadow:0 0 0 2px var(--w-e-textarea-selected-border-color)}.w-e-text-placeholder{font-style:italic;left:10px;top:17px;width:90%}.w-e-max-length-info,.w-e-text-placeholder{color:var(--w-e-textarea-slight-color);pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none}.w-e-max-length-info{bottom:.5em;right:1em}.w-e-bar{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-color);font-size:14px;padding:0 5px}.w-e-bar svg{fill:var(--w-e-toolbar-color);height:14px;width:14px}.w-e-bar-show{display:flex}.w-e-bar-hidden{display:none}.w-e-hover-bar{border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 5px #0000001f;position:absolute}.w-e-toolbar{flex-wrap:wrap;position:relative}.w-e-bar-divider{background-color:var(--w-e-toolbar-border-color);display:inline-flex;height:40px;margin:0 5px;width:1px}.w-e-bar-item{display:flex;height:40px;padding:4px;position:relative;text-align:center}.w-e-bar-item,.w-e-bar-item button{align-items:center;justify-content:center}.w-e-bar-item button{background:transparent;border:none;color:var(--w-e-toolbar-color);cursor:pointer;display:inline-flex;height:32px;overflow:hidden;padding:0 8px;white-space:nowrap}.w-e-bar-item button:hover{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-bar-item button .title{margin-left:5px}.w-e-bar-item .active{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-bar-item .disabled{color:var(--w-e-toolbar-disabled-color);cursor:not-allowed}.w-e-bar-item .disabled svg{fill:var(--w-e-toolbar-disabled-color)}.w-e-bar-item .disabled:hover{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-disabled-color)}.w-e-bar-item .disabled:hover svg{fill:var(--w-e-toolbar-disabled-color)}.w-e-menu-tooltip-v5:before{background-color:var(--w-e-toolbar-active-color);border-radius:5px;color:var(--w-e-toolbar-bg-color);content:attr(data-tooltip);font-size:.75em;padding:5px 10px;text-align:center;top:40px;white-space:pre;z-index:1}.w-e-menu-tooltip-v5:after,.w-e-menu-tooltip-v5:before{opacity:0;position:absolute;transition:opacity .6s;visibility:hidden}.w-e-menu-tooltip-v5:after{border:5px solid transparent;border-bottom:5px solid var(--w-e-toolbar-active-color);content:"";top:30px}.w-e-menu-tooltip-v5:hover:after,.w-e-menu-tooltip-v5:hover:before{opacity:1;visibility:visible}.w-e-menu-tooltip-v5.tooltip-right:before{left:100%;top:10px}.w-e-menu-tooltip-v5.tooltip-right:after{border-bottom-color:transparent;border-left-color:transparent;border-right-color:var(--w-e-toolbar-active-color);border-top-color:transparent;left:100%;margin-left:-10px;top:16px}.w-e-bar-item-group .w-e-bar-item-menus-container{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;display:none;left:0;margin-top:40px;position:absolute;top:0;z-index:1}.w-e-bar-item-group:hover .w-e-bar-item-menus-container{display:block}.w-e-select-list{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;left:0;margin-top:40px;max-height:350px;min-width:100px;overflow-y:auto;position:absolute;top:0;z-index:1}.w-e-select-list ul{line-height:1;list-style:none}.w-e-select-list ul .selected{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-select-list ul li{cursor:pointer;padding:7px 0 7px 25px;position:relative;text-align:left;white-space:nowrap}.w-e-select-list ul li:hover{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-select-list ul li svg{left:0;margin-left:5px;margin-top:-7px;position:absolute;top:50%}.w-e-bar-bottom .w-e-select-list{bottom:0;margin-bottom:40px;margin-top:0;top:inherit}.w-e-drop-panel{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;margin-top:40px;min-width:200px;padding:10px;position:absolute;top:0;z-index:1}.w-e-bar-bottom .w-e-drop-panel{bottom:0;margin-bottom:40px;margin-top:0;top:inherit}.w-e-modal{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;color:var(--w-e-toolbar-color);font-size:14px;min-height:40px;min-width:100px;padding:20px 15px 0;position:absolute;text-align:left;z-index:1}.w-e-modal .btn-close{cursor:pointer;line-height:1;padding:5px;position:absolute;right:8px;top:7px}.w-e-modal .btn-close svg{fill:var(--w-e-toolbar-color);height:10px;width:10px}.w-e-modal .babel-container{display:block;margin-bottom:15px}.w-e-modal .babel-container span{display:block;margin-bottom:10px}.w-e-modal .button-container{margin-bottom:15px}.w-e-modal button{background-color:var(--w-e-modal-button-bg-color);cursor:pointer;font-weight:400;height:32px;padding:4.5px 15px;text-align:center;touch-action:manipulation;transition:all .3s cubic-bezier(.645,.045,.355,1);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.w-e-modal button,.w-e-modal input[type=number],.w-e-modal input[type=text],.w-e-modal textarea{border:1px solid var(--w-e-modal-button-border-color);border-radius:4px;color:var(--w-e-toolbar-color)}.w-e-modal input[type=number],.w-e-modal input[type=text],.w-e-modal textarea{font-feature-settings:"tnum";background-color:var(--w-e-toolbar-bg-color);font-variant:tabular-nums;padding:4.5px 11px;transition:all .3s;width:100%}.w-e-modal textarea{min-height:60px}body .w-e-modal,body .w-e-modal *{box-sizing:border-box}.w-e-progress-bar{background-color:var(--w-e-textarea-handler-bg-color);height:1px;position:absolute;transition:width .3s;width:0}.w-e-full-screen-container{bottom:0!important;display:flex!important;flex-direction:column!important;height:100%!important;left:0!important;margin:0!important;padding:0!important;position:fixed;right:0!important;top:0!important;width:100%!important}.w-e-full-screen-container [data-w-e-textarea=true]{flex:1!important}
+.w-e-text-container [data-slate-editor],.w-e-text-container [data-slate-editor] *,.w-e-toolbar *{box-sizing:border-box;margin:0;outline:none;padding:0}.w-e-text-container blockquote,.w-e-text-container li,.w-e-text-container p,.w-e-text-container td,.w-e-text-container th,.w-e-toolbar *{line-height:1.5}.w-e-text-container{background-color:var(--w-e-textarea-bg-color);color:var(--w-e-textarea-color);height:100%;position:relative}.w-e-text-container .w-e-scroll{-webkit-overflow-scrolling:touch;height:100%}.w-e-text-container [data-slate-editor]{word-wrap:break-word;border-top:1px solid transparent;min-height:100%;outline:0;padding:0 10px;white-space:pre-wrap}.w-e-text-container [data-slate-editor] p{margin:15px 0}.w-e-text-container [data-slate-editor] h1,.w-e-text-container [data-slate-editor] h2,.w-e-text-container [data-slate-editor] h3,.w-e-text-container [data-slate-editor] h4,.w-e-text-container [data-slate-editor] h5{margin:20px 0}.w-e-text-container [data-slate-editor] img{cursor:default;display:inline!important;max-width:100%;min-height:20px;min-width:20px}.w-e-text-container [data-slate-editor] span{text-indent:0}.w-e-text-container [data-slate-editor] [data-selected=true]{box-shadow:0 0 0 2px var(--w-e-textarea-selected-border-color)}.w-e-text-placeholder{font-style:italic;left:10px;top:17px;width:90%}.w-e-max-length-info,.w-e-text-placeholder{color:var(--w-e-textarea-slight-color);pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none}.w-e-max-length-info{bottom:.5em;right:1em}.w-e-bar{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-color);font-size:14px;padding:0 5px}.w-e-bar svg{fill:var(--w-e-toolbar-color);height:14px;width:14px}.w-e-bar-show{display:flex}.w-e-bar-hidden{display:none}.w-e-hover-bar{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 5px #0000001f;position:absolute}.w-e-hover-bar,.w-e-hover-bar>.w-e-bar-item>button{color:var(--w-e-toolbar-color);font-size:14px;font-weight:400;line-height:1.5}.w-e-hover-bar>.w-e-bar-item>button{background:transparent;border:none;box-shadow:none}.w-e-hover-bar>.w-e-bar-item>button svg{fill:var(--w-e-toolbar-color);flex-shrink:0;height:14px!important;width:14px!important}.w-e-hover-bar>.w-e-bar-item>button.select-button{font-size:14px;font-weight:400;letter-spacing:normal}.w-e-hover-bar>.w-e-bar-item>button.active,.w-e-hover-bar>.w-e-bar-item>button:hover{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-hover-bar>.w-e-bar-item>button.active svg,.w-e-hover-bar>.w-e-bar-item>button:hover svg{fill:var(--w-e-toolbar-active-color)}.w-e-hover-bar .w-e-drop-panel,.w-e-hover-bar .w-e-select-list{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-color);font-size:14px;font-weight:400;line-height:1.5}.w-e-hover-bar .w-e-panel-content-color{color:var(--w-e-toolbar-color);font-size:14px;line-height:1.5;list-style:none;margin:0;padding:0;text-align:left;width:230px}.w-e-hover-bar .w-e-panel-content-color li{box-sizing:border-box;display:inline-block;line-height:normal;list-style:none;margin:0;padding:2px;vertical-align:top}.w-e-hover-bar .w-e-panel-content-color .color-block{box-sizing:border-box;height:17px;width:17px}.w-e-hover-bar .w-e-panel-content-color .clear{display:block;font-size:14px;font-weight:400;line-height:1.5;margin:0 0 5px;padding:2px;width:100%}.w-e-toolbar{flex-wrap:wrap;position:relative}.w-e-bar-divider{background-color:var(--w-e-toolbar-border-color);display:inline-flex;height:40px;margin:0 5px;width:1px}.w-e-bar-item{display:flex;height:40px;padding:4px;position:relative;text-align:center}.w-e-bar-item,.w-e-bar-item button{align-items:center;justify-content:center}.w-e-bar-item button{background:transparent;border:none;color:var(--w-e-toolbar-color);cursor:pointer;display:inline-flex;height:32px;overflow:hidden;padding:0 8px;white-space:nowrap}.w-e-bar-item button:hover{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-bar-item button .title{margin-left:5px}.w-e-bar-item .active{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-bar-item .disabled{color:var(--w-e-toolbar-disabled-color);cursor:not-allowed}.w-e-bar-item .disabled svg{fill:var(--w-e-toolbar-disabled-color)}.w-e-bar-item .disabled:hover{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-disabled-color)}.w-e-bar-item .disabled:hover svg{fill:var(--w-e-toolbar-disabled-color)}.w-e-menu-tooltip-v5:before{background-color:var(--w-e-toolbar-active-color);border-radius:5px;color:var(--w-e-toolbar-bg-color);content:attr(data-tooltip);font-size:.75em;padding:5px 10px;text-align:center;top:40px;white-space:pre;z-index:1}.w-e-menu-tooltip-v5:after,.w-e-menu-tooltip-v5:before{opacity:0;position:absolute;transition:opacity .6s;visibility:hidden}.w-e-menu-tooltip-v5:after{border:5px solid transparent;border-bottom:5px solid var(--w-e-toolbar-active-color);content:"";top:30px}.w-e-menu-tooltip-v5:hover:after,.w-e-menu-tooltip-v5:hover:before{opacity:1;visibility:visible}.w-e-menu-tooltip-v5.tooltip-right:before{left:100%;top:10px}.w-e-menu-tooltip-v5.tooltip-right:after{border-bottom-color:transparent;border-left-color:transparent;border-right-color:var(--w-e-toolbar-active-color);border-top-color:transparent;left:100%;margin-left:-10px;top:16px}.w-e-bar-item-group .w-e-bar-item-menus-container{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;display:none;left:0;margin-top:40px;position:absolute;top:0;z-index:1}.w-e-bar-item-group:hover .w-e-bar-item-menus-container{display:block}.w-e-select-list{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;color:var(--w-e-toolbar-color);font-size:14px;font-weight:400;left:0;line-height:1.5;margin-top:40px;max-height:350px;min-width:100px;overflow-y:auto;position:absolute;top:0;z-index:1}.w-e-select-list ul{line-height:1;list-style:none;margin:0;padding:0}.w-e-select-list ul .selected{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-select-list ul li{box-sizing:border-box;cursor:pointer;font-weight:400;line-height:1.25;padding:7px 0 7px 25px;position:relative;text-align:left;white-space:nowrap}.w-e-select-list ul li span{font-size:inherit;font-weight:inherit;line-height:inherit}.w-e-select-list ul li:hover{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-select-list ul li svg{left:0;margin-left:5px;margin-top:-7px;position:absolute;top:50%}.w-e-bar-bottom .w-e-select-list{bottom:0;margin-bottom:40px;margin-top:0;top:inherit}.w-e-drop-panel{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;margin-top:40px;min-width:200px;padding:10px;position:absolute;top:0;z-index:1}.w-e-bar-bottom .w-e-drop-panel{bottom:0;margin-bottom:40px;margin-top:0;top:inherit}.w-e-modal{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;color:var(--w-e-toolbar-color);font-family:Inter,Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,微软雅黑,Arial,sans-serif;font-size:14px;line-height:1.5;min-height:40px;min-width:100px;padding:20px 15px 0;position:absolute;text-align:left;z-index:1}.w-e-modal .btn-close{cursor:pointer;line-height:1;padding:5px;position:absolute;right:8px;top:7px}.w-e-modal .btn-close svg{fill:var(--w-e-toolbar-color);height:10px;width:10px}.w-e-modal .babel-container{display:block;margin-bottom:15px}.w-e-modal .babel-container span{display:block;margin-bottom:10px}.w-e-modal .button-container{margin-bottom:15px}.w-e-modal button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--w-e-modal-button-bg-color);border:1px solid var(--w-e-modal-button-border-color);border-radius:4px;box-sizing:border-box;color:var(--w-e-toolbar-color);cursor:pointer;font-family:inherit;font-size:14px;font-weight:500;height:32px;justify-content:center;outline:none;padding:8px 15px;text-align:center;touch-action:manipulation;transition:all .3s cubic-bezier(.645,.045,.355,1);-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}.w-e-modal button,.w-e-modal button>span{align-items:center;display:inline-flex;line-height:1}.w-e-modal button>span{text-box-trim:trim-both;text-box-edge:cap alphabetic}.w-e-modal input[type=number],.w-e-modal input[type=text],.w-e-modal textarea{font-feature-settings:"tnum";background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-modal-button-border-color);border-radius:4px;color:var(--w-e-toolbar-color);font-family:inherit;font-size:14px;font-variant:tabular-nums;line-height:1.5;padding:4.5px 11px;transition:all .3s;width:100%}.w-e-modal textarea{min-height:60px}body .w-e-modal,body .w-e-modal *{box-sizing:border-box}.w-e-progress-bar{background-color:var(--w-e-textarea-handler-bg-color);height:1px;position:absolute;transition:width .3s;width:0}.w-e-full-screen-container{bottom:0!important;display:flex!important;flex-direction:column!important;height:100%!important;left:0!important;margin:0!important;padding:0!important;position:fixed;right:0!important;top:0!important;width:100%!important}.w-e-full-screen-container [data-w-e-textarea=true]{flex:1!important}

package/dist/index.esm.js

@@ -1,4 +1,4 @@
-import { Editor, Operation, Path, Node, Range, Element, Text, Transforms, Point, createEditor as createEditor$1 } from 'slate';
+import { Editor, Operation, Path, Node, Range, Element as Element$1, Text, Transforms, Point, createEditor as createEditor$1 } from 'slate';
 import toArray from 'lodash.toarray';
 import $, { css, append, addClass, removeClass, hasClass, on, focus, attr, removeAttr, hide, show, offset, width, height, parent, parents, is as is$5, dataset, val, text, html as html$1, children, remove as remove$1, find as find$1, each, empty as empty$1 } from 'dom7';
 import forEach$1 from 'lodash.foreach';
@@ -3840,7 +3840,7 @@ var DomEditor = {
     return Editor.hasPath(editor, anchor.path) && Editor.hasPath(editor, focus.path);
   },
   getNodeType: function getNodeType(node) {
-    if (Element.isElement(node)) {
+    if (Element$1.isElement(node)) {
       return node.type;
     }
     return '';
@@ -3864,7 +3864,7 @@ var DomEditor = {
         var nodeEntry = nodeEntries_1_1.value;
         var _b = __read(nodeEntry, 1),
             node = _b[0];
-        if (Element.isElement(node)) elems.push(node);
+        if (Element$1.isElement(node)) elems.push(node);
       }
     } catch (e_2_1) {
       e_2 = {
@@ -3979,7 +3979,7 @@ var DomEditor = {
     }
     var nodeEntries = Editor.nodes(editor, {
       match: function match(n) {
-        if (Element.isElement(n)) {
+        if (Element$1.isElement(n)) {
           if (!editor.isInline(n)) {
             return true;
           }
@@ -5288,7 +5288,7 @@ function textToHtml(textNode, editor) {
 }
 
 function node2html(node, editor) {
-  if (Element.isElement(node)) {
+  if (Element$1.isElement(node)) {
     return elemToHtml(node, editor);
   } else {
     return textToHtml(node, editor);
@@ -5971,6 +5971,126 @@ collection('Set', function (init) {
 var IGNORE_TAGS = new Set(['doctype', '!doctype', 'meta', 'script', 'style', 'link', 'frame', 'iframe', 'title', 'svg'
 ]);
 
+var PENDING_BASE_APPLY = new WeakMap();
+function restoreBaseApply(e) {
+  var base = PENDING_BASE_APPLY.get(e);
+  if (base) {
+    e.apply = base;
+    PENDING_BASE_APPLY.delete(e);
+    return base;
+  }
+  return e.apply;
+}
+function cancelPendingHistorySplit(editor) {
+  restoreBaseApply(editor);
+}
+function withIsolatedHistoryBatch(editor, fn) {
+  var e = editor;
+  if (typeof e.undo !== 'function' || !e.history) {
+    fn();
+    return;
+  }
+  var apply = restoreBaseApply(e);
+  var startedBatch = false;
+  e.apply = function (op) {
+    if (!startedBatch) {
+      var undos = e.history.undos;
+      var lenBefore = undos.length;
+      HistoryEditor.withoutMerging(e, function () {
+        apply(op);
+      });
+      if (undos.length > lenBefore) {
+        startedBatch = true;
+      }
+      return;
+    }
+    var prev = HistoryEditor.isMerging(e);
+    MERGING.set(e, true);
+    try {
+      apply(op);
+    } finally {
+      if (prev === undefined) {
+        MERGING.delete(e);
+      } else {
+        MERGING.set(e, prev);
+      }
+    }
+  };
+  try {
+    fn();
+  } finally {
+    e.apply = apply;
+    if (!startedBatch) return;
+    var splitOnce_1 = function splitOnce_1(op) {
+      if (op.type === 'set_selection') {
+        apply(op);
+        return;
+      }
+      if (e.apply === splitOnce_1) {
+        e.apply = apply;
+      }
+      PENDING_BASE_APPLY.delete(e);
+      HistoryEditor.withoutMerging(e, function () {
+        apply(op);
+      });
+    };
+    e.apply = splitOnce_1;
+    PENDING_BASE_APPLY.set(e, apply);
+  }
+}
+
+var EDITOR_TO_TYPING_STATE = new WeakMap();
+function getState(editor) {
+  var state = EDITOR_TO_TYPING_STATE.get(editor);
+  if (!state) {
+    state = {
+      lastContentAt: 0
+    };
+    EDITOR_TO_TYPING_STATE.set(editor, state);
+  }
+  return state;
+}
+function shouldSplitTypingBatch(op) {
+  if (op.type === 'insert_text') return true;
+  if (op.type === 'remove_text' && op.text.length === 1) return true;
+  return false;
+}
+function resetTypingHistoryState(editor) {
+  EDITOR_TO_TYPING_STATE.delete(editor);
+}
+function markTypingHistoryCompositionStart(_editor) {}
+function markTypingHistoryCompositionEnd(_editor) {}
+function withTypingHistory(editor) {
+  var e = editor;
+  var apply = e.apply;
+  e.apply = function (op) {
+    if (typeof e.undo !== 'function') {
+      apply(op);
+      return;
+    }
+    var merging = HistoryEditor.isMerging(e);
+    if (merging === true || merging === false) {
+      apply(op);
+      if (op.type === 'insert_text' || op.type === 'remove_text') {
+        getState(e).lastContentAt = Date.now();
+      }
+      return;
+    }
+    if (shouldSplitTypingBatch(op)) {
+      HistoryEditor.withoutMerging(e, function () {
+        apply(op);
+      });
+      getState(e).lastContentAt = Date.now();
+      return;
+    }
+    apply(op);
+    if (op.type !== 'set_selection') {
+      getState(e).lastContentAt = Date.now();
+    }
+  };
+  return e;
+}
+
 function insertElemToEditor(editor, elem) {
   if (editor.isInline(elem)) {
     editor.insertNode(elem);
@@ -6136,6 +6256,7 @@ var withContent = function withContent(editor) {
   e.handleTab = function () {
     e.insertText('    ');
   };
+  e.handleShiftTab = function () {};
   e.getHtml = function () {
     var _a = e.children,
         children = _a === void 0 ? [] : _a;
@@ -6171,7 +6292,7 @@ var withContent = function withContent(editor) {
         var nodeEntry = nodeEntries_1_1.value;
         var _b = __read(nodeEntry, 1),
             node = _b[0];
-        if (Element.isElement(node)) {
+        if (Element$1.isElement(node)) {
           var flag = isPrefix ? node.type.indexOf(type) >= 0 : node.type === type;
           if (flag) {
             var key = DomEditor.findKey(e, node);
@@ -6204,7 +6325,7 @@ var withContent = function withContent(editor) {
     if (children.length > 1) return false;
     var firstNode = children[0];
     if (firstNode == null) return true;
-    if (Element.isElement(firstNode) && firstNode.type === 'paragraph') {
+    if (Element$1.isElement(firstNode) && firstNode.type === 'paragraph') {
       var _b = firstNode.children,
           texts = _b === void 0 ? [] : _b;
       if (texts.length > 1) return false;
@@ -6327,28 +6448,40 @@ var withContent = function withContent(editor) {
     if (html === void 0) {
       html = '';
     }
-    var isEditorDisabled = e.isDisabled();
-    var isEditorFocused = e.isFocused();
-    var editorSelectionStr = JSON.stringify(e.selection);
-    e.enable();
-    e.focus();
-    e.clear();
-    var newContent = htmlToContent(e, html);
-    Transforms.insertFragment(e, newContent);
-    if (!isEditorFocused) {
-      e.deselect();
-      e.blur();
-    }
-    if (isEditorDisabled) {
-      e.deselect();
-      e.disable();
-    }
-    if (e.isFocused()) {
-      try {
-        e.select(JSON.parse(editorSelectionStr));
-      } catch (ex) {
-        e.select(Editor.start(e, []));
+    cancelPendingHistorySplit(e);
+    var applyHtml = function applyHtml() {
+      var isEditorDisabled = e.isDisabled();
+      var isEditorFocused = e.isFocused();
+      var editorSelectionStr = JSON.stringify(e.selection);
+      e.enable();
+      e.focus();
+      e.clear();
+      var newContent = htmlToContent(e, html);
+      Transforms.insertFragment(e, newContent);
+      if (!isEditorFocused) {
+        e.deselect();
+        e.blur();
+      }
+      if (isEditorDisabled) {
+        e.deselect();
+        e.disable();
+      }
+      if (e.isFocused()) {
+        try {
+          e.select(JSON.parse(editorSelectionStr));
+        } catch (ex) {
+          e.select(Editor.start(e, []));
+        }
       }
+    };
+    if (typeof e.undo === 'function' && e.history) {
+      HistoryEditor.withoutSaving(e, applyHtml);
+      var history_1 = e.history;
+      history_1.undos = [];
+      history_1.redos = [];
+      resetTypingHistoryState(e);
+    } else {
+      applyHtml();
     }
   };
   return e;
@@ -6420,47 +6553,49 @@ var withEventData = function withEventData(editor) {
     return data;
   };
   e.insertData = function (data) {
-    var e_1, _a;
-    var fragment = data.getData('application/x-slate-fragment');
-    if (fragment) {
-      var decoded = decodeURIComponent(window.atob(fragment));
-      var parsed = JSON.parse(decoded);
-      e.insertFragment(parsed);
-      return;
-    }
-    var text = data.getData('text/plain');
-    var html = data.getData('text/html');
-    if (html) {
-      e.dangerouslyInsertHtml(html);
-      return;
-    }
-    if (text) {
-      var lines = text.split(/\r\n|\r|\n/);
-      var split = false;
-      try {
-        for (var lines_1 = __values(lines), lines_1_1 = lines_1.next(); !lines_1_1.done; lines_1_1 = lines_1.next()) {
-          var line = lines_1_1.value;
-          if (split) {
-            Transforms.splitNodes(e, {
-              always: true
-            });
-          }
-          insertText(line);
-          split = true;
-        }
-      } catch (e_1_1) {
-        e_1 = {
-          error: e_1_1
-        };
-      } finally {
+    withIsolatedHistoryBatch(e, function () {
+      var e_1, _a;
+      var fragment = data.getData('application/x-slate-fragment');
+      if (fragment) {
+        var decoded = decodeURIComponent(window.atob(fragment));
+        var parsed = JSON.parse(decoded);
+        e.insertFragment(parsed);
+        return;
+      }
+      var text = data.getData('text/plain');
+      var html = data.getData('text/html');
+      if (html) {
+        e.dangerouslyInsertHtml(html);
+        return;
+      }
+      if (text) {
+        var lines = text.split(/\r\n|\r|\n/);
+        var split = false;
         try {
-          if (lines_1_1 && !lines_1_1.done && (_a = lines_1.return)) _a.call(lines_1);
+          for (var lines_1 = __values(lines), lines_1_1 = lines_1.next(); !lines_1_1.done; lines_1_1 = lines_1.next()) {
+            var line = lines_1_1.value;
+            if (split) {
+              Transforms.splitNodes(e, {
+                always: true
+              });
+            }
+            insertText(line);
+            split = true;
+          }
+        } catch (e_1_1) {
+          e_1 = {
+            error: e_1_1
+          };
         } finally {
-          if (e_1) throw e_1.error;
+          try {
+            if (lines_1_1 && !lines_1_1.done && (_a = lines_1.return)) _a.call(lines_1);
+          } finally {
+            if (e_1) throw e_1.error;
+          }
         }
+        return;
       }
-      return;
-    }
+    });
   };
   return e;
 };
@@ -6924,8 +7059,8 @@ function getPositionByNode(editor, node, type) {
   };
   var selection = editor.selection;
   if (selection == null) return defaultStyle;
-  var isVoidElem = Element.isElement(node) && editor.isVoid(node);
-  var isInlineElem = Element.isElement(node) && editor.isInline(node);
+  var isVoidElem = Element$1.isElement(node) && editor.isVoid(node);
+  var isInlineElem = Element$1.isElement(node) && editor.isInline(node);
   var elem = NODE_TO_ELEMENT.get(node);
   if (elem == null) return defaultStyle;
   var _a = elem.getBoundingClientRect(),
@@ -7571,7 +7706,7 @@ function node2Vnode(node, index, parent, editor) {
   NODE_TO_INDEX.set(node, index);
   NODE_TO_PARENT.set(node, parent);
   var vnode;
-  if (Element.isElement(node)) {
+  if (Element$1.isElement(node)) {
     vnode = renderElement(node, editor);
   } else {
     vnode = renderText(node, parent, editor);
@@ -8033,7 +8168,7 @@ function handleOnBlur(e, textarea, editor) {
   }
   if (relatedTarget != null && isDOMNode(relatedTarget) && DomEditor.hasDOMNode(editor, relatedTarget)) {
     var node = DomEditor.toSlateNode(editor, relatedTarget);
-    if (Element.isElement(node) && !editor.isVoid(node)) {
+    if (Element$1.isElement(node) && !editor.isVoid(node)) {
       return;
     }
   }
@@ -8122,7 +8257,7 @@ function handleCompositionEnd(e, textarea, editor) {
   for (var i = 0; i < start.path.length; i++) {
     var _b = __read(Editor.node(editor, start.path.slice(0, i + 1)), 1),
         node = _b[0];
-    if (Element.isElement(node)) {
+    if (Element$1.isElement(node)) {
       if ((IS_SAFARI || IS_FIREFOX) && node.type === 'link' || node.type === 'code') {
         DomEditor.setNewKey(paragraph);
         break;
@@ -8177,6 +8312,7 @@ var HOTKEYS = {
   splitBlock: 'shift?+enter',
   undo: 'mod+z',
   tab: 'tab',
+  shiftTab: 'shift+tab',
   selectAll: 'mod+a'
 };
 var APPLE_HOTKEYS = {
@@ -8239,6 +8375,7 @@ var Hotkeys = {
   isTransposeCharacter: create('transposeCharacter'),
   isUndo: create('undo'),
   isTab: create('tab'),
+  isShiftTab: create('shiftTab'),
   isSelectAll: create('selectAll')
 };
 
@@ -8271,6 +8408,11 @@ function handleOnKeydown(e, textarea, editor) {
   if (textarea.isComposing) return;
   if (!hasEditableTarget(editor, event.target)) return;
   triggerMenuHotKey(editor, event);
+  if (Hotkeys.isShiftTab(event)) {
+    preventDefault(event);
+    editor.handleShiftTab();
+    return;
+  }
   if (Hotkeys.isTab(event)) {
     preventDefault(event);
     editor.handleTab();
@@ -8464,7 +8606,7 @@ function handleOnKeydown(e, textarea, editor) {
     if (IS_CHROME || IS_SAFARI) {
       if (selection && (Hotkeys.isDeleteBackward(event) || Hotkeys.isDeleteForward(event)) && Range.isCollapsed(selection)) {
         var currentNode = Node.parent(editor, selection.anchor.path);
-        if (Element.isElement(currentNode) && Editor.isVoid(editor, currentNode) && Editor.isInline(editor, currentNode)) {
+        if (Element$1.isElement(currentNode) && Editor.isVoid(editor, currentNode) && Editor.isInline(editor, currentNode)) {
           event.preventDefault();
           Transforms.delete(editor, {
             unit: 'block'
@@ -9149,7 +9291,7 @@ function genModalTextareaElems(labelText, textareaId, placeholder) {
 }
 function genModalButtonElems(buttonId, buttonText) {
   var $buttonContainer = $('<div class="button-container"></div>');
-  var $button = $("<button type=\"button\" id=\"" + buttonId + "\">" + buttonText + "</button>");
+  var $button = $("<button type=\"button\" id=\"" + buttonId + "\"><span>" + buttonText + "</span></button>");
   $buttonContainer.append($button);
   return [$buttonContainer[0], $button[0]];
 }
@@ -9175,7 +9317,7 @@ function (_super) {
   ModalButton.prototype.getPosition = function () {
     var editor = getEditorInstance(this);
     var positionNode = this.menu.getModalPositionNode(editor);
-    if (Element.isElement(positionNode)) {
+    if (Element$1.isElement(positionNode)) {
       return getPositionByNode(editor, positionNode, 'modal');
     }
     return getPositionBySelection(editor);
@@ -9253,6 +9395,10 @@ function (_super) {
     });
     return _this;
   }
+  SelectList.findOptionLi = function (target) {
+    if (!(target instanceof Element)) return null;
+    return target.closest('li[data-value]');
+  };
   SelectList.prototype.renderList = function (options) {
     var $elem = this.$elem;
     $elem.empty();
@@ -9350,11 +9496,11 @@ function () {
       selectList.appendTo(this.$elem);
       selectList.show();
       selectList.$elem.on('click', 'li', function (e) {
-        var target = e.target;
-        if (target == null) return;
+        var li = SelectList.findOptionLi(e.target);
+        if (li == null) return;
         e.preventDefault();
-        var $li = $(target);
-        var val = $li.attr('data-value');
+        var val = $(li).attr('data-value');
+        if (val == null || val === '') return;
         _this.onChange(val);
       });
     } else {
@@ -9546,7 +9692,7 @@ function () {
       if (node != null) {
         _this.changeItemsState();
       }
-      if (node && Element.isElement(node)) {
+      if (node && Element$1.isElement(node)) {
         if (isShow) {
           var samePath = _this.isSamePath(node, _this.prevSelectedNode);
           if (samePath) {
@@ -9591,16 +9737,15 @@ function () {
   };
   HoverBar.prototype.checkPositionBottom = function () {
     var $elem = this.$elem;
-    var isBottom = false;
     var innerHeight = window.innerHeight;
-    var minDistance = 360;
-    if (innerHeight && innerHeight >= minDistance) {
-      var bottom = $elem[0].getBoundingClientRect().bottom;
-      if (innerHeight - bottom < minDistance) {
-        isBottom = true;
-      }
+    if (!innerHeight) {
+      $elem.removeClass('w-e-bar-bottom');
+      return;
     }
-    if (isBottom) {
+    var rect = $elem[0].getBoundingClientRect();
+    var spaceBelow = Math.max(0, innerHeight - rect.bottom - 8);
+    var panelNeed = 240;
+    if (spaceBelow < panelNeed) {
       $elem.addClass('w-e-bar-bottom');
     } else {
       $elem.removeClass('w-e-bar-bottom');
@@ -9656,7 +9801,7 @@ function () {
     var editor = this.getEditorInstance();
     var $elem = this.$elem;
     $elem.attr('style', '');
-    if (Element.isElement(node)) {
+    if (Element$1.isElement(node)) {
       var positionStyle = getPositionByNode(editor, node, 'bar');
       $elem.css(positionStyle);
       correctPosition(editor, $elem);
@@ -9786,7 +9931,7 @@ function genToolbarConfig(userConfig) {
 function bindNodeRelation(node, index, parent, editor) {
   NODE_TO_INDEX.set(node, index);
   NODE_TO_PARENT.set(node, parent);
-  if (Element.isElement(node)) {
+  if (Element$1.isElement(node)) {
     var _a = node.children,
         children = _a === void 0 ? [] : _a;
     children.forEach(function (child, i) {
@@ -9812,7 +9957,7 @@ function createEditor (option) {
       html = option.html,
       _c = option.plugins,
       plugins = _c === void 0 ? [] : _c;
-  var editor = withHistory(withMaxLength(withEmitter(withSelection(withContent(withConfig(withDOM(withEventData(createEditor$1()))))))));
+  var editor = withTypingHistory(withHistory(withMaxLength(withEmitter(withSelection(withContent(withConfig(withDOM(withEventData(createEditor$1())))))))));
   if (selector) {
     if (isRepeatedCreateTextarea(editor, selector)) {
       throw new Error("Repeated create editor by selector '" + selector + "'");
@@ -12795,7 +12940,7 @@ function getEditorNodeAtPath(editor, path) {
   }
 }
 function isBlankParagraphNode(node) {
-  if (!node || !Element.isElement(node)) return false;
+  if (!node || !Element$1.isElement(node)) return false;
   if (node.type !== 'paragraph') return false;
   var text = Node.string(node);
   return text.replace(/[\u200B\uFEFF\s]/g, '').length === 0;
@@ -12910,5 +13055,5 @@ function resolveElemPath(editor, elem) {
   return null;
 }
 
-export { DomEditor, ELEM_TO_HTML_CONF, PARSE_ELEM_HTML_CONF, PARSE_STYLE_HTML_FN_LIST, PRE_PARSE_HTML_CONF_LIST, RENDER_ELEM_CONF, RENDER_STYLE_HANDLER_LIST, STYLE_TO_HTML_FN_LIST, TEXT_TAGS, Toolbar, canRemoveEmptyLineAboveBlock, createEditor as coreCreateEditor, createToolbar as coreCreateToolbar, createUploader, execMenuByKey, findEditorScrollParent, genEmptyParagraph, genModalButtonElems, genModalInputElems, genModalTextareaElems, getEditorNodeAtPath, i18nAddResources, i18nChangeLanguage, i18nGetResources, insertEmptyLineAboveAtPath, isBlankParagraphNode, pinEditorScrollDuring, registerElemToHtmlConf, registerMenu, registerParseElemHtmlConf, registerParseStyleHtmlHandler, registerPreParseHtmlConf, registerRenderElemConf, registerStyleHandler, registerStyleToHtmlHandler, removeEmptyLineAboveTopLevelBlock, replaceBlockWithEmptyLine, resolveElemPath, setBlockToParagraph, t };
+export { DomEditor, ELEM_TO_HTML_CONF, PARSE_ELEM_HTML_CONF, PARSE_STYLE_HTML_FN_LIST, PRE_PARSE_HTML_CONF_LIST, RENDER_ELEM_CONF, RENDER_STYLE_HANDLER_LIST, STYLE_TO_HTML_FN_LIST, TEXT_TAGS, Toolbar, canRemoveEmptyLineAboveBlock, cancelPendingHistorySplit, createEditor as coreCreateEditor, createToolbar as coreCreateToolbar, createUploader, execMenuByKey, findEditorScrollParent, genEmptyParagraph, genModalButtonElems, genModalInputElems, genModalTextareaElems, getEditorNodeAtPath, i18nAddResources, i18nChangeLanguage, i18nGetResources, insertEmptyLineAboveAtPath, isBlankParagraphNode, markTypingHistoryCompositionEnd, markTypingHistoryCompositionStart, pinEditorScrollDuring, registerElemToHtmlConf, registerMenu, registerParseElemHtmlConf, registerParseStyleHtmlHandler, registerPreParseHtmlConf, registerRenderElemConf, registerStyleHandler, registerStyleToHtmlHandler, removeEmptyLineAboveTopLevelBlock, replaceBlockWithEmptyLine, resetTypingHistoryState, resolveElemPath, setBlockToParagraph, t, withIsolatedHistoryBatch, withTypingHistory };
 //# sourceMappingURL=index.esm.js.map