suneditor 3.0.0-alpha.2 → 3.0.0-alpha.4

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "suneditor",
-	"version": "3.0.0-alpha.2",
+	"version": "3.0.0-alpha.4",
 	"description": "Vanilla javascript based WYSIWYG web editor",
 	"author": "Yi JiHong",
 	"license": "MIT",
@@ -8,6 +8,9 @@
 	"sideEffects": [
 		"./src/assets/css/*.css"
 	],
+	"engines": {
+		"node": ">=14.0.0"
+	},
 	"scripts": {
 		"dev": "webpack-dev-server --config webpack/dev.js",
 		"start": "npm run dev",

package/src/assets/suneditor.css

@@ -480,6 +480,7 @@
 /* default svg */
 .sun-editor svg {
 	fill: currentColor;
+	vertical-align: baseline;
 }
 
 .sun-editor button > svg,
@@ -1148,8 +1149,8 @@
 
 /* table resize */
 /* table resize - ew */
-.sun-editor-editable table th:not(.se-selected-table-cell):hover::before,
-.sun-editor-editable table td:not(.se-selected-table-cell):hover::before {
+.sun-editor-editable[contenteditable='true'] table th:not(.se-selected-table-cell):hover::before,
+.sun-editor-editable[contenteditable='true'] table td:not(.se-selected-table-cell):hover::before {
 	content: '';
 	position: absolute;
 	top: 0;
@@ -1159,8 +1160,8 @@
 	background-color: transparent;
 	cursor: ew-resize;
 }
-.sun-editor-editable table th:not(.se-selected-table-cell):hover::after,
-.sun-editor-editable table td:not(.se-selected-table-cell):hover::after {
+.sun-editor-editable[contenteditable='true'] table th:not(.se-selected-table-cell):hover::after,
+.sun-editor-editable[contenteditable='true'] table td:not(.se-selected-table-cell):hover::after {
 	content: '';
 	position: absolute;
 	top: 0;
@@ -2153,7 +2154,7 @@
 	outline: 2px solid #80bdff;
 }
 
-.sun-editor-editable .se-component figure.se-figure-selected:not(.se-figure-over-selected)::after {
+.sun-editor-editable[contenteditable='true'] .se-component figure.se-figure-selected:not(.se-figure-over-selected)::after {
 	pointer-events: none;
 }
 
@@ -2926,8 +2927,8 @@
 
 /** --- selected class */
 /* -- table */
-.sun-editor-editable table td.se-selected-table-cell::after,
-.sun-editor-editable table th.se-selected-table-cell::after {
+.sun-editor-editable[contenteditable='true'] table td.se-selected-table-cell::after,
+.sun-editor-editable[contenteditable='true'] table th.se-selected-table-cell::after {
 	position: absolute;
 	content: '';
 	background-color: #d0e3ff;
@@ -2939,8 +2940,8 @@
 	right: -1px;
 	top: -1px;
 }
-.sun-editor-editable table td.se-selected-cell-focus,
-.sun-editor-editable table th.se-selected-cell-focus {
+.sun-editor-editable[contenteditable='true'] table td.se-selected-cell-focus,
+.sun-editor-editable[contenteditable='true'] table th.se-selected-cell-focus {
 	outline: 2px dashed #1275ff;
 	z-index: 1;
 }

package/src/core/base/eventHandlers/handler_ww_dragDrop.js

@@ -1,19 +1,20 @@
 import { domUtils } from '../../../helper';
 import { _DragHandle } from '../../../modules';
 
-export function OnDragOver_wysiwyg(dragCursor, _iframe, e) {
+export function OnDragOver_wysiwyg(fc, dragCursor, _iframeTopArea, _innerToolbar, e) {
 	e.preventDefault();
 
 	const { sc, so, ec, eo } = this.selection.getEventLocationRange(e);
 
-	const cursorRange = this._d.createRange();
+	const cursorRange = fc.get('_wd').createRange();
 	cursorRange.setStart(sc, so);
 	cursorRange.setEnd(ec, eo);
 
 	const _offset = { y: 0, x: 0 };
-	if (_iframe) {
-		const iframeOffset = this.offset.getGlobal(this.editor.frameContext.get('topArea'));
-		_offset.y = iframeOffset.top - this._w.scrollY;
+	if (_iframeTopArea) {
+		const iframeOffset = this.offset.getGlobal(_iframeTopArea);
+		const toolbarH = _innerToolbar ? this.context.get('toolbar.main').offsetHeight : 0;
+		_offset.y = iframeOffset.top + toolbarH - this._w.scrollY;
 		_offset.x = iframeOffset.left - this._w.scrollX;
 	}
 
@@ -28,6 +29,10 @@ export function OnDragOver_wysiwyg(dragCursor, _iframe, e) {
 	}
 }
 
+export function OnDragEnd_wysiwyg(dragCursor) {
+	dragCursor.style.display = 'none';
+}
+
 export function OnDrop_wysiwyg(frameContext, dragCursor, e) {
 	try {
 		if (frameContext.get('isReadOnly')) {

package/src/core/base/eventHandlers/handler_ww_key_input.js

@@ -317,6 +317,7 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 					if (fileComponentInfo) {
 						e.preventDefault();
 						e.stopPropagation();
+						if (domUtils.isZeroWith(formatEl.textContent)) domUtils.removeItem(formatEl);
 						if (this.component.select(fileComponentInfo.target, fileComponentInfo.pluginName, false) === false) this.editor.blur();
 						break;
 					}
@@ -588,6 +589,9 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 					} else {
 						this.selection.setRange(temp, 0, temp, 0);
 					}
+
+					// enter scroll
+					this.selection.scrollTo(range);
 					break;
 				} else if (rangeEl && formatEl && !domUtils.isTableCell(rangeEl) && !/^FIGCAPTION$/i.test(rangeEl.nodeName)) {
 					const rangeEnt = this.selection.getRange();
@@ -600,6 +604,9 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 						newEl.appendChild(selectionNode.nextSibling);
 
 						this.selection.setRange(br, 1, br, 1);
+
+						// enter scroll
+						this.selection.scrollTo(range);
 						break;
 					}
 
@@ -675,6 +682,9 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 						const newEl = this.format.addLine(brBlock, this.format.isLine(brBlock.nextElementSibling) && !this.format.isBlock(brBlock.nextElementSibling) ? brBlock.nextElementSibling : null);
 						domUtils.copyFormatAttributes(newEl, brBlock);
 						this.selection.setRange(newEl, 1, newEl, 1);
+
+						// enter scroll
+						this.selection.scrollTo(range);
 						break;
 					}
 
@@ -704,6 +714,9 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 					}
 
 					this._onShortcutKey = true;
+
+					// enter scroll
+					this.selection.scrollTo(range);
 					break;
 				}
 
@@ -734,6 +747,8 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 						this.selection.setRange(firstEl, 0, firstEl, 0);
 					}
 
+					// enter scroll
+					this.selection.scrollTo(range);
 					break;
 				}
 
@@ -756,6 +771,9 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 								domUtils.copyTagAttributes(newEl, formatEl, this.options.get('lineAttrReset'));
 								this.selection.setRange(newEl, offset, newEl, offset);
 							}
+
+							// enter scroll
+							this.selection.scrollTo(range);
 							break;
 						}
 
@@ -797,16 +815,25 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 					domUtils.copyTagAttributes(newEl, formatEl, this.options.get('lineAttrReset'));
 					this.selection.setRange(newEl, offset, newEl, offset);
 
+					// enter scroll
+					this.selection.scrollTo(range);
 					break;
 				}
 			}
 
-			if (selectRange) break;
+			if (selectRange) {
+				// enter scroll
+				this.selection.scrollTo(range);
+				break;
+			}
 
 			if (rangeEl && domUtils.getParentElement(rangeEl, 'FIGCAPTION') && domUtils.getParentElement(rangeEl, domUtils.isList)) {
 				this.__enterPrevent(e);
 				formatEl = this.format.addLine(formatEl, null);
 				this.selection.setRange(formatEl, 0, formatEl, 0);
+
+				// enter scroll
+				this.selection.scrollTo(range);
 			}
 
 			break;
@@ -829,9 +856,6 @@ export function OnKeyDown_wysiwyg(frameContext, e) {
 		this.selection.setRange(zeroWidth, 1, zeroWidth, 1);
 	}
 
-	// enter scroll
-	if (keyCode === 13) this.selection.scrollTo(range);
-
 	// next component
 	if (!DIR_KEYCODE.test(keyCode)) return;
 

package/src/core/base/eventManager.js

@@ -11,7 +11,7 @@ import { ButtonsHandler, OnClick_menuTray, OnClick_toolbar } from './eventHandle
 import { OnMouseDown_wysiwyg, OnMouseUp_wysiwyg, OnClick_wysiwyg, OnMouseMove_wysiwyg, OnMouseLeave_wysiwyg } from './eventHandlers/handler_ww_mouse';
 import { OnInput_wysiwyg, OnKeyDown_wysiwyg, OnKeyUp_wysiwyg } from './eventHandlers/handler_ww_key_input';
 import { OnPaste_wysiwyg, OnCopy_wysiwyg, OnCut_wysiwyg } from './eventHandlers/handler_ww_clipboard';
-import { OnDragOver_wysiwyg, OnDrop_wysiwyg } from './eventHandlers/handler_ww_dragDrop';
+import { OnDragOver_wysiwyg, OnDragEnd_wysiwyg, OnDrop_wysiwyg } from './eventHandlers/handler_ww_dragDrop';
 
 const { _w, ON_OVER_COMPONENT, isMobile } = env;
 
@@ -656,7 +656,13 @@ EventManager.prototype = {
 		this.addEvent(eventWysiwyg, 'paste', OnPaste_wysiwyg.bind(this, fc), false);
 		this.addEvent(eventWysiwyg, 'copy', OnCopy_wysiwyg.bind(this, fc), false);
 		this.addEvent(eventWysiwyg, 'cut', OnCut_wysiwyg.bind(this, fc), false);
-		this.addEvent(eventWysiwyg, 'dragover', OnDragOver_wysiwyg.bind(this, dragCursor, isIframe ? this.editor.frameContext.get('topArea') : null), false);
+		this.addEvent(
+			eventWysiwyg,
+			'dragover',
+			OnDragOver_wysiwyg.bind(this, fc, dragCursor, isIframe ? this.editor.frameContext.get('topArea') : null, !this.options.get('toolbar_container') && !this.editor.isBalloon && !this.editor.isInline),
+			false
+		);
+		this.addEvent(eventWysiwyg, 'dragend', OnDragEnd_wysiwyg.bind(this, dragCursor), false);
 		this.addEvent(eventWysiwyg, 'drop', OnDrop_wysiwyg.bind(this, fc, dragCursor), false);
 		this.addEvent(eventWysiwyg, 'scroll', OnScroll_wysiwyg.bind(this, fc, eventWysiwyg), { passive: true, useCapture: false });
 		this.addEvent(eventWysiwyg, 'focus', OnFocus_wysiwyg.bind(this, fc), false);

package/src/core/class/component.js

@@ -514,7 +514,7 @@ function OnKeyDown_component(e) {
 		return;
 	}
 
-	// backspace, delete
+	// backspace key, delete key
 	if (keyCode === 8 || keyCode === 46) {
 		e.preventDefault();
 		e.stopPropagation();
@@ -526,7 +526,7 @@ function OnKeyDown_component(e) {
 		}
 	}
 
-	// enter
+	// enter key
 	if (keyCode === 13) {
 		e.preventDefault();
 		const compContext = this.currentInfo || this.get(this.currentTarget);

package/src/core/class/offset.js

@@ -43,11 +43,27 @@ Offset.prototype = {
 	},
 
 	/**
-	 * @description Returns the position of the argument, "this.editor.frameContext.get('wrapper')" to inside the editor.Returns the position of the element in "this.editor.frameContext.get('wrapper')".
+	 * @description Gets the position just outside the argument's internal editor(wysiwygFrame). [getLocal() + iframe offset]
 	 * @param {Node} node Target node
 	 * @returns {{top:boolean, left:boolean}}
 	 */
 	get(node) {
+		const wFrame = this.editor.frameContext.get('wysiwygFrame');
+		const iframe = /iframe/i.test(wFrame?.nodeName);
+		const off = this.getLocal(node);
+
+		return {
+			left: off.left + (iframe ? wFrame.parentElement.offsetLeft : 0),
+			top: off.top + (iframe ? wFrame.parentElement.offsetTop : 0)
+		};
+	},
+
+	/**
+	 * @description Gets the position in the internal editor of the argument.
+	 * @param {Node} node Target node
+	 * @returns {{top:boolean, left:boolean}}
+	 */
+	getLocal(node) {
 		let offsetLeft = 0;
 		let offsetTop = 0;
 		let offsetElement = node.nodeType === 3 ? node.parentElement : node;
@@ -60,12 +76,9 @@ Offset.prototype = {
 			offsetElement = offsetElement.offsetParent;
 		}
 
-		const wFrame = this.editor.frameContext.get('wysiwygFrame');
-		const iframe = /iframe/i.test(wFrame?.nodeName);
-
 		return {
-			left: offsetLeft + (iframe ? wFrame.parentElement.offsetLeft : 0),
-			top: offsetTop - (wysiwyg ? wysiwyg.scrollTop : 0) + (iframe ? wFrame.parentElement.offsetTop : 0)
+			left: offsetLeft,
+			top: offsetTop - (wysiwyg ? wysiwyg.scrollTop : 0)
 		};
 	},
 
@@ -376,22 +389,26 @@ Offset.prototype = {
 		const tmbw = clientSize.h - targetRect.bottom;
 		let toolbarH = !this.editor.toolbar._sticky && (this.editor.isBalloon || this.editor.isInline) ? 0 : this.context.get('toolbar.main').offsetHeight;
 		let rmt, rmb;
+		let rt = 0;
 		if (this.editor.frameContext.get('isFullScreen')) {
 			rmt = tmtw - toolbarH;
 			rmb = tmbw;
 		} else {
 			const tMargin = targetRect.top;
 			const bMargin = clientSize.h - targetRect.bottom;
+			const editorOffset = this.getGlobal();
+			const editorScroll = this.getGlobalScroll();
+			const statusBarH = this.editor.frameContext.get('statusbar')?.offsetHeight || 0;
 
 			if (isIframe) {
-				const editorOffset = this.getGlobal();
-				const editorScroll = this.getGlobalScroll();
 				const emt = editorOffset.top - editorScroll.top - editorScroll.ts;
 				const editorH = this.editor.frameContext.get('topArea').offsetHeight;
 				rmt = targetRect.top - emt;
-				rmb = bMargin - (editorScroll.oh - (editorH + emt) + (this.editor.frameContext.get('statusbar')?.offsetHeight || 0));
+				rmb = bMargin - (editorScroll.oh - (editorH + emt) + statusBarH);
 			} else {
-				const wst = !isTargetAbs && /\d+/.test(this.editor.frameOptions.get('height')) ? this.getGlobal(this.editor.frameContext.get('topArea')).top - _w.scrollY : 0;
+				rt = !this.editor.toolbar._sticky && !this.options.get('toolbar_container') ? toolbarH : 0;
+				const wst = !isTargetAbs && /\d+/.test(this.editor.frameOptions.get('height')) ? editorOffset.top - _w.scrollY + rt : 0;
+				const wsb = !isTargetAbs && /\d+/.test(this.editor.frameOptions.get('height')) ? _w.innerHeight - (editorOffset.top + editorOffset.height - _w.scrollY) : 0;
 				let st = wst;
 				if (toolbarH > wst) {
 					if (this.editor.toolbar._sticky) {
@@ -402,10 +419,12 @@ Offset.prototype = {
 					}
 				} else if (this.options.get('toolbar_container')) {
 					toolbarH = 0;
+				} else {
+					st = wst + (this.editor.toolbar._sticky ? toolbarH : 0);
 				}
 
 				rmt = targetRect.top - st;
-				rmb = wwScroll.rects.bottom - targetRect.bottom;
+				rmb = wwScroll.rects.bottom - targetRect.bottom - wsb - statusBarH;
 			}
 
 			// display margin
@@ -413,7 +432,7 @@ Offset.prototype = {
 			rmb = rmb > 0 ? bMargin : rmb;
 		}
 
-		if (isWWTarget && (rmb + targetH <= 0 || rmt + targetH <= 0)) return;
+		if (isWWTarget && (rmb + targetH <= 0 || rmt + rt + targetH <= 0)) return;
 
 		let t = addOffset.top;
 		let y = 0;
@@ -425,7 +444,7 @@ Offset.prototype = {
 			if (y < 0) {
 				arrowDir = 'down';
 				t -= targetH + elH + ah * 2;
-				y = rmt - (elH + ah);
+				y = toolbarH + rmt - (elH + ah);
 				if (y < 0) {
 					arrowDir = '';
 					t -= y;

package/src/core/class/selection.js

@@ -235,13 +235,13 @@ Selection.prototype = {
 			eo = e.rangeOffset;
 		} else if (this.editor.frameContext.get('_wd').caretRangeFromPoint) {
 			let r = this.editor.frameContext.get('_wd').caretRangeFromPoint(e.clientX, e.clientY);
-			if (!r) r = this.selection.getRange();
+			if (!r) r = this.getRange();
 			sc = r.startContainer;
 			so = r.startOffset;
 			ec = r.endContainer;
 			eo = r.endOffset;
 		} else {
-			const r = this.selection.getRange();
+			const r = this.getRange();
 			sc = r.startContainer;
 			so = r.startOffset;
 			ec = r.endContainer;
@@ -264,7 +264,7 @@ Selection.prototype = {
 		if (ref instanceof Selection) {
 			ref = ref.getRangeAt(0);
 		} else if (ref instanceof Node) {
-			ref = this.selection.setRange(ref, 1, ref, 1);
+			ref = this.setRange(ref, 1, ref, 1);
 		} else if (typeof ref?.startContainer === 'undefined') {
 			console.warn('[SUNEDITOR.html.scrollTo.warn] "selectionRange" must be Selection or Range or Node object.', ref);
 		}
@@ -387,8 +387,10 @@ Selection.prototype = {
 		let rangeObj = this.getRange();
 		if (this._isNone(rangeObj)) {
 			if (!domUtils.isWysiwygFrame(rangeObj.startContainer) || !domUtils.isWysiwygFrame(rangeObj.endContainer)) return false;
-			const ww = rangeObj.startContainer;
-			rangeObj = this.setRange(ww.firstElementChild, 0, ww.lastElementChild, 1);
+			const ww = rangeObj.commonAncestorContainer;
+			const first = ww.children[rangeObj.startOffset];
+			const end = ww.children[rangeObj.endOffset];
+			rangeObj = this.setRange(first, 0, end, first === end ? 0 : 1);
 		}
 
 		const range = rangeObj;

package/src/core/class/viewer.js

@@ -324,7 +324,7 @@ Viewer.prototype = {
 		const iframe = domUtils.createElement('IFRAME', { style: 'display: none;' });
 		this._d.body.appendChild(iframe);
 
-		const contentHTML = this.options.get('printTemplate') ? this.options.get('printTemplate').replace(/\{\s*content\s*\}/i, this.html.get(true)) : this.html.get(true);
+		const contentHTML = this.options.get('printTemplate') ? this.options.get('printTemplate').replace(/\{\{\s*contents\s*\}\}/i, this.html.get(true)) : this.html.get(true);
 		const printDocument = domUtils.getIframeDocument(iframe);
 		const wDoc = this.editor.frameContext.get('_wd');
 
@@ -392,7 +392,7 @@ Viewer.prototype = {
 		this.editor._offCurrentController();
 		this.editor._offCurrentModal();
 
-		const contentHTML = this.options.get('previewTemplate') ? this.options.get('previewTemplate').replace(/\{\s*content\s*\}/i, this.html.get(true)) : this.html.get(true);
+		const contentHTML = this.options.get('previewTemplate') ? this.options.get('previewTemplate').replace(/\{\{\s*contents\s*\}\}/i, this.html.get(true)) : this.html.get(true);
 		const windowObject = this._w.open('', '_blank');
 		windowObject.mimeType = 'text/html';
 		const wDoc = this.editor.frameContext.get('_wd');

package/src/core/section/constructor.js

@@ -98,12 +98,9 @@ const Constructor = function (editorTargets, options) {
 	/** --- Plugins ------------------------------------------------------------------------------------------ */
 	const plugins = {};
 	if (options.plugins) {
+		const excludedPlugins = options.excludedPlugins || [];
 		const originPlugins = options.plugins;
-		const pluginsValues = Array.isArray(originPlugins.length)
-			? originPlugins
-			: Object.keys(originPlugins).map(function (name) {
-					return originPlugins[name];
-			  });
+		const pluginsValues = (Array.isArray(originPlugins) ? originPlugins : Object.keys(originPlugins)).filter((name) => !excludedPlugins.includes(name)).map((name) => originPlugins[name]);
 
 		for (let i = 0, len = pluginsValues.length, p; i < len; i++) {
 			p = pluginsValues[i].default || pluginsValues[i];

package/src/langs/en.js

@@ -54,7 +54,11 @@
 		color: 'Color',
 		colorPicker: 'Color picker',
 		column: 'Column',
+		comment: 'Comments',
+		commentAdd: 'Add comment',
+		commentShow: 'Show comments',
 		copy: 'Copy',
+		copyFormatting: 'Copy formatting',
 		cut: 'Cut',
 		default: 'Default',
 		deleteColumn: 'Delete column',
@@ -65,6 +69,8 @@
 		drag: 'Drag',
 		edit: 'Edit',
 		exportPdf: 'Export to PDF',
+		exportWord: 'Export to Word',
+		find: 'Find',
 		decrease: 'Decrease',
 		increase: 'Increase',
 		fileUpload: 'File upload',
@@ -86,6 +92,7 @@
 		image_modal_file: 'Select from files',
 		image_modal_title: 'Insert image',
 		image_modal_url: 'Image URL',
+		importWord: 'Import from Word',
 		indent: 'Indent',
 		inlineStyle: 'Inline style',
 		insertColumnAfter: 'Insert column after',
@@ -126,6 +133,7 @@
 		newDocument: 'New document',
 		numberedList: 'Numbered list',
 		outdent: 'Outdent',
+		pageBreak: 'Page break',
 		paragraphStyle: 'Paragraph style',
 		preview: 'Preview',
 		print: 'print',
@@ -134,12 +142,15 @@
 		redo: 'Redo',
 		remove: 'Remove',
 		removeFormat: 'Remove Format',
+		replace: 'Replace',
+		replaceAll: 'Replace all',
 		resize100: 'Zoom 100%',
 		resize25: 'Zoom 25%',
 		resize50: 'Zoom 50%',
 		resize75: 'Zoom 75%',
 		resize: 'Resize',
 		revert: 'Revert',
+		revisionHistory: 'Revision History',
 		right: 'Right',
 		rotateLeft: 'Rotate left',
 		rotateRight: 'Rotate right',

package/src/langs/ko.js

@@ -15,10 +15,15 @@
 	const lang = {
 		code: 'ko',
 		align: '정렬',
+		alignBottom: '아래쪽 정렬',
 		alignCenter: '가운데 정렬',
 		alignJustify: '양쪽 정렬',
 		alignLeft: '왼쪽 정렬',
+		alignMiddle: '중간 정렬',
 		alignRight: '오른쪽 정렬',
+		alignTop: '위쪽 정렬',
+		asBlock: '블록으로 보기',
+		asLink: '링크로 보기',
 		audio: '오디오',
 		audio_modal_file: '파일 선택',
 		audio_modal_title: '오디오 삽입',
@@ -26,18 +31,49 @@
 		autoSize: '자동 크기',
 		backgroundColor: '배경색',
 		basic: '기본',
+		blockStyle: '블록 스타일',
 		bold: '굵게',
+		border: '테두리',
+		border_all: '모든 테두리',
+		border_inside: '안쪽 테두리',
+		border_horizontal: '안쪽 가로 테두리',
+		border_vertical: '안쪽 세로 테두리',
+		border_outside: '바깥쪽 테두리',
+		border_left: '왼쪽 테두리',
+		border_top: '위쪽 테두리',
+		border_right: '오른쪽 테두리',
+		border_bottom: '아래쪽 테두리',
+		border_none: '테두리 없음',
 		bulletedList: '원형 리스트',
+		cancel: '취소',
 		caption: '설명 넣기',
+		cellProperties: '셀 속성',
 		center: '가운데',
 		close: '닫기',
 		codeView: 'HTML 편집',
+		color: '색상',
+		colorPicker: '색상 선택기',
+		column: '열',
+		comment: '코멘트',
+		commentAdd: '코멘트 추가',
+		commentShow: '코멘트 보기',
+		copy: '복사',
+		copyFormatting: '서식 복사',
+		cut: '잘라내기',
 		default: '기본값',
 		deleteColumn: '열 삭제',
 		deleteRow: '행 삭제',
 		dir_ltr: '왼쪽에서 오른쪽',
 		dir_rtl: '오른쪽에서 왼쪽',
+		download: '다운로드',
+		drag: '드래그',
 		edit: '편집',
+		exportPdf: 'PDF로 내보내기',
+		exportWord: 'Word로 내보내기',
+		find: '찾기',
+		decrease: '내리기',
+		increase: '올리기',
+		fileUpload: '파일 업로드',
 		fixedColumnWidth: '고정 된 열 너비',
 		font: '글꼴',
 		fontColor: '글자색',
@@ -56,11 +92,14 @@
 		image_modal_file: '파일 선택',
 		image_modal_title: '이미지 삽입',
 		image_modal_url: '이미지 주소',
+		importWord: '워드에서 가져오기',
 		indent: '들여쓰기',
+		inlineStyle: '인라인 스타일',
 		insertColumnAfter: '오른쪽에 열 삽입',
 		insertColumnBefore: '왼쪽에 열 삽입',
 		insertRowAbove: '위에 행 삽입',
 		insertRowBelow: '아래에 행 삽입',
+		insertLine: '라인 삽입',
 		italic: '기울임',
 		layout: '레이아웃',
 		left: '왼쪽',
@@ -72,6 +111,7 @@
 		link_modal_text: '화면 텍스트',
 		link_modal_title: '링크 삽입',
 		link_modal_url: '인터넷 주소',
+		link_modal_relAttribute: 'Rel 속성',
 		list: '리스트',
 		math: '수식',
 		math_modal_fontSizeLabel: '글자 크기',
@@ -90,8 +130,10 @@
 		minSize: '최소화',
 		mirrorHorizontal: '좌우 반전',
 		mirrorVertical: '상하 반전',
+		newDocument: '새 문서',
 		numberedList: '숫자형 리스트',
 		outdent: '내어쓰기',
+		pageBreak: '페이지 나누기',
 		paragraphStyle: '문단 스타일',
 		preview: '미리보기',
 		print: '인쇄',
@@ -100,17 +142,22 @@
 		redo: '다시 실행',
 		remove: '삭제',
 		removeFormat: '형식 제거',
+		replace: '바꾸기',
+		replaceAll: '전체 바꾸기',
 		resize100: '100% 크기',
 		resize25: '25% 크기',
 		resize50: '50% 크기',
 		resize75: '75% 크기',
 		resize: '크기',
 		revert: '되돌리기',
+		revisionHistory: '수정 이력',
 		right: '오른쪽',
 		rotateLeft: '왼쪽으로 회전',
 		rotateRight: '오른쪽으로 회전',
+		row: '행',
 		save: '저장',
 		search: '검색',
+		selectAll: '전체 선택',
 		showBlocks: '블록 보기',
 		size: '크기',
 		splitCells: '셀 분할',
@@ -120,6 +167,7 @@
 		superscript: '위 첨자',
 		table: '테이블',
 		tableHeader: '테이블 제목',
+		tableProperties: '테이블 속성',
 		tags: '태그',
 		tag_blockquote: '인용문',
 		tag_div: '기본 (DIV)',

package/src/modules/Controller.js

@@ -3,7 +3,7 @@ import { domUtils, env } from '../helper';
 import { _DragHandle } from '../modules';
 
 const { ON_OVER_COMPONENT } = env;
-const NON_RESPONSE_KEYCODE = /^(13|1[7-9]|20|27|45|11[2-9]|12[0-3]|144|145)$/;
+const NON_RESPONSE_KEYCODE = /^(1[7-9]|20|27|45|11[2-9]|12[0-3]|144|145)$/;
 const INDEX_0 = 2147483647;
 const INDEX_1 = 2147483646;
 const INDEX_2 = 2147483645;

package/src/plugins/command/fileUpload.js

@@ -121,7 +121,7 @@ FileUpload.prototype = {
 			return;
 		}
 
-		this._submitFile([file]);
+		this.submitFile([file]);
 		this.editor.focus();
 
 		return false;
@@ -156,7 +156,7 @@ FileUpload.prototype = {
 		this.component.select(this._element, FileUpload.key, false);
 	},
 
-	async _submitFile(fileList) {
+	async submitFile(fileList) {
 		if (fileList.length === 0) return;
 
 		let fileSize = 0;
@@ -362,7 +362,7 @@ FileUpload.prototype = {
 };
 
 async function OnChangeFile(e) {
-	await this._submitFile(e.target.files);
+	await this.submitFile(e.target.files);
 }
 
 function CreateHTML_controller({ lang, icons }) {