jodit 4.16.0 → 4.17.0

package/es2021/jodit.js

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.16.0
+ * Version: v4.17.0
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */
@@ -1799,7 +1799,7 @@ __webpack_require__.r(__webpack_exports__);
  * ```
  * @packageDocumentation
  * @module constants
- */ const APP_VERSION = "4.16.0";
+ */ const APP_VERSION = "4.17.0";
 // prettier-ignore
 const ES = "es2021";
 const IS_ES_MODERN = true;
@@ -26195,22 +26195,19 @@ jodit_core_ui__WEBPACK_IMPORTED_MODULE_2__.Icon.set('palette', (_palette_svg__WE
     const tabs = [];
     const options = editor.o.uploader;
     if (callbacks.upload && options.showTabInFileSelector !== false && (options.url || options.insertImageAsBase64URI || options.customUploadFunction)) {
-        const dragBox = editor.c.fromHTML('<div class="jodit-drag-and-drop__file-box">' + `<strong>${editor.i18n(isImage ? 'Drop image' : 'Drop file')}</strong>` + `<span><br>${editor.i18n('or click')}</span>` + `<input type="file" accept="${isImage ? 'image/*' : '*'}" tabindex="-1" dir="auto" multiple=""/>` + '</div>');
-        editor.uploader.bind(dragBox, (resp)=>{
-            const handler = (0,jodit_core_helpers__WEBPACK_IMPORTED_MODULE_1__.isFunction)(callbacks.upload) ? callbacks.upload : options.defaultHandlerSuccess;
+        const { upload } = callbacks;
+        tabs.push(UploadTab(editor, (resp)=>{
+            const handler = (0,jodit_core_helpers__WEBPACK_IMPORTED_MODULE_1__.isFunction)(upload) ? upload : options.defaultHandlerSuccess;
             if ((0,jodit_core_helpers__WEBPACK_IMPORTED_MODULE_1__.isFunction)(handler)) {
                 handler.call(editor, resp);
             }
-            editor.e.fire('closeAllPopups');
-        }, (error)=>{
-            editor.message.error(error.message);
-            editor.e.fire('closeAllPopups');
-        });
-        tabs.push({
-            icon: 'upload',
-            name: 'Upload',
-            content: dragBox
-        });
+        }, isImage ? {
+            label: 'Drop image',
+            accept: 'image/*'
+        } : {
+            label: 'Drop file',
+            accept: '*'
+        }));
     }
     if (callbacks.filebrowser) {
         if (editor.o.filebrowser.ajax.url || editor.o.filebrowser.items.url) {
@@ -26278,6 +26275,24 @@ jodit_core_ui__WEBPACK_IMPORTED_MODULE_2__.Icon.set('palette', (_palette_svg__WE
     box.classList.add('jodit-file-selector');
     return box;
 };
+/**
+ * The Upload tab: a box that uploads the files dropped on it or chosen in its
+ * file input, then passes the uploader's answer to `onSuccess` and closes the popup
+ */ const UploadTab = (editor, onSuccess, { label, accept })=>{
+    const dragBox = editor.c.fromHTML('<div class="jodit-drag-and-drop__file-box">' + `<strong>${editor.i18n(label)}</strong>` + `<span><br>${editor.i18n('or click')}</span>` + `<input type="file" accept="${accept}" tabindex="-1" dir="auto" multiple=""/>` + '</div>');
+    editor.uploader.bind(dragBox, (resp)=>{
+        onSuccess.call(editor, resp);
+        editor.e.fire('closeAllPopups');
+    }, (error)=>{
+        editor.message.error(error.message);
+        editor.e.fire('closeAllPopups');
+    });
+    return {
+        icon: 'upload',
+        name: 'Upload',
+        content: dragBox
+    };
+};
 function val(elm, name, value) {
     const child = jodit_core_dom_dom__WEBPACK_IMPORTED_MODULE_0__.Dom.first(elm, (node)=>jodit_core_dom_dom__WEBPACK_IMPORTED_MODULE_0__.Dom.isTag(node, 'input') && (0,jodit_core_helpers__WEBPACK_IMPORTED_MODULE_1__.attr)(node, 'name') === name);
     if (!child) {
@@ -26290,7 +26305,8 @@ function val(elm, name, value) {
 }
 
 /* harmony export */ __webpack_require__.d(__webpack_exports__, [
-/* harmony export */   "FileSelectorWidget", 0, /* binding */ FileSelectorWidget
+/* harmony export */   "FileSelectorWidget", 0, /* binding */ FileSelectorWidget,
+/* harmony export */   "UploadTab", 0, /* binding */ UploadTab
 /* harmony export */ ]);
 
 
@@ -26303,7 +26319,8 @@ function val(elm, name, value) {
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   ColorPickerWidget: function() { return /* reexport safe */ _color_picker_color_picker__WEBPACK_IMPORTED_MODULE_0__.ColorPickerWidget; },
 /* harmony export */   FileSelectorWidget: function() { return /* reexport safe */ _file_selector_file_selector__WEBPACK_IMPORTED_MODULE_1__.FileSelectorWidget; },
-/* harmony export */   TabsWidget: function() { return /* reexport safe */ _tabs_tabs__WEBPACK_IMPORTED_MODULE_2__.TabsWidget; }
+/* harmony export */   TabsWidget: function() { return /* reexport safe */ _tabs_tabs__WEBPACK_IMPORTED_MODULE_2__.TabsWidget; },
+/* harmony export */   UploadTab: function() { return /* reexport safe */ _file_selector_file_selector__WEBPACK_IMPORTED_MODULE_1__.UploadTab; }
 /* harmony export */ });
 /* harmony import */ var _color_picker_color_picker__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(72348);
 /* harmony import */ var _file_selector_file_selector__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(18762);
@@ -32001,6 +32018,18 @@ function brBefore(start) {
 
 
 
+function insertLinks(data) {
+    data.files?.forEach((file)=>{
+        const link = this.createInside.element('a', {
+            href: data.baseurl + file
+        });
+        link.textContent = this.o.uploader.getDisplayName.call(this.uploader, data.baseurl, file);
+        this.s.insertNode(link);
+    });
+}
+jodit_config__WEBPACK_IMPORTED_MODULE_3__.Config.prototype.file = {
+    defaultHandlerSuccess: insertLinks
+};
 jodit_config__WEBPACK_IMPORTED_MODULE_3__.Config.prototype.controls.file = {
     popup: (editor, current, close)=>{
         const insert = (url, title = '')=>{
@@ -32015,7 +32044,9 @@ jodit_config__WEBPACK_IMPORTED_MODULE_3__.Config.prototype.controls.file = {
                 data.files && data.files.forEach((file)=>insert(data.baseurl + file));
                 close();
             },
-            upload: true,
+            upload: (data)=>{
+                (editor.o.file?.defaultHandlerSuccess ?? insertLinks).call(editor, data);
+            },
             url: (url, text)=>{
                 if (sourceAnchor) {
                     (0,jodit_core_helpers_utils_attr__WEBPACK_IMPORTED_MODULE_2__.attr)(sourceAnchor, 'href', url);
@@ -32901,7 +32932,7 @@ jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.iframeBaseUrl = '';
 jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.iframeTitle = 'Jodit Editor';
 jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.iframeDoctype = '<!DOCTYPE html>';
 jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.iframeDefaultSrc = 'about:blank';
-jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.iframeStyle = 'html{' + 'margin:0;' + 'padding:0;' + 'min-height: 100%;' + '}' + 'body{' + 'box-sizing:border-box;' + 'font-size:13px;' + 'line-height:1.6;' + 'padding:10px;' + 'margin:0;' + 'background:transparent;' + 'color:#000;' + 'position:' + 'relative;' + 'z-index:2;' + 'user-select:auto;' + 'margin:0px;' + 'overflow:auto;' + 'outline:none;' + '}' + 'table{' + 'width:100%;' + 'border:none;' + 'border-collapse:collapse;' + 'empty-cells: show;' + 'max-width: 100%;' + '}' + 'th,td{' + 'padding: 2px 5px;' + 'border:1px solid #ccc;' + '-webkit-user-select:text;' + '-moz-user-select:text;' + '-ms-user-select:text;' + 'user-select:text' + '}' + 'p{' + 'margin-top:0;' + '}' + '.jodit_editor .jodit_iframe_wrapper{' + 'display: block;' + 'clear: both;' + 'user-select: none;' + 'position: relative;' + '}' + '.jodit_editor .jodit_iframe_wrapper:after {' + 'position:absolute;' + 'content:"";' + 'z-index:1;' + 'top:0;' + 'left:0;' + 'right: 0;' + 'bottom: 0;' + 'cursor: pointer;' + 'display: block;' + 'background: rgba(0, 0, 0, 0);' + '} ' + '.jodit_disabled{' + 'user-select: none;' + '-o-user-select: none;' + '-moz-user-select: none;' + '-khtml-user-select: none;' + '-webkit-user-select: none;' + '-ms-user-select: none' + '}';
+jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.iframeStyle = 'html{' + 'margin:0;' + 'padding:0;' + 'min-height: 100%;' + '}' + 'body{' + 'box-sizing:border-box;' + 'font-size:13px;' + 'line-height:1.6;' + 'padding:10px;' + 'margin:0;' + 'background:transparent;' + 'color:#000;' + 'position:' + 'relative;' + 'z-index:2;' + 'user-select:auto;' + 'margin:0px;' + 'overflow:auto;' + 'outline:none;' + '}' + 'table{' + 'width:100%;' + 'border:none;' + 'border-collapse:collapse;' + 'empty-cells: show;' + 'max-width: 100%;' + '}' + 'th,td{' + 'padding: 2px 5px;' + 'border:1px solid #ccc;' + '-webkit-user-select:text;' + '-moz-user-select:text;' + '-ms-user-select:text;' + 'user-select:text' + '}' + 'p{' + 'margin-top:0;' + '}' + '.jodit_editor .jodit_iframe_wrapper{' + 'display: block;' + 'clear: both;' + 'user-select: none;' + 'position: relative;' + '}' + '.jodit_editor .jodit_iframe_wrapper:after {' + 'position:absolute;' + 'content:"";' + 'z-index:1;' + 'top:0;' + 'left:0;' + 'right: 0;' + 'bottom: 0;' + 'cursor: pointer;' + 'display: block;' + 'background: rgba(0, 0, 0, 0);' + '} ' + '.jodit-wysiwyg_image-selected::selection,' + '.jodit-wysiwyg_image-selected *:not(img)::selection{' + 'background:transparent' + '}' + '.jodit_disabled{' + 'user-select: none;' + '-o-user-select: none;' + '-moz-user-select: none;' + '-khtml-user-select: none;' + '-webkit-user-select: none;' + '-ms-user-select: none' + '}';
 jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.iframeCSSLinks = [];
 jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.iframeSandbox = null;
 
@@ -33143,13 +33174,19 @@ jodit_config__WEBPACK_IMPORTED_MODULE_0__.Config.prototype.imageProcessor = {
 
 
 
+
 const JODIT_IMAGE_PROCESSOR_BINDED = '__jodit_imageprocessor_binded';
 const JODIT_IMAGE_BLOB_ID = JODIT_IMAGE_PROCESSOR_BINDED + 'blob-id';
+const IMAGE_SELECTED = 'jodit-wysiwyg_image-selected';
 /**
  * Change editor's size after load all images
  */ class imageProcessor extends jodit_core_plugin__WEBPACK_IMPORTED_MODULE_6__.Plugin {
-    afterInit(jodit) {}
+    afterInit(jodit) {
+        jodit.e.on(jodit.ed, 'selectionchange', this.onSelectionChange);
+    }
     beforeDestruct(jodit) {
+        jodit.e.off(jodit.ed, 'selectionchange', this.onSelectionChange);
+        jodit.editor.classList.remove(IMAGE_SELECTED);
         const buffer = (0,jodit_core_decorators__WEBPACK_IMPORTED_MODULE_2__.cached)(jodit, 'buffer');
         const list = buffer?.get(JODIT_IMAGE_BLOB_ID);
         if (buffer && list) {
@@ -33180,6 +33217,13 @@ const JODIT_IMAGE_BLOB_ID = JODIT_IMAGE_PROCESSOR_BINDED + 'blob-id';
             }
         }
     }
+    /**
+	 * While the selection is an image, only the image is highlighted: Safari
+	 * paints the rest of a block image's line with its parent's highlight. See #1528
+	 */ onSelectionChange() {
+        const { jodit } = this;
+        jodit.editor.classList.toggle(IMAGE_SELECTED, isImageSelected(jodit));
+    }
     async afterChange(data) {
         const { jodit: editor } = this;
         if (!editor.editor) {
@@ -33211,6 +33255,9 @@ const JODIT_IMAGE_BLOB_ID = JODIT_IMAGE_PROCESSOR_BINDED + 'blob-id';
 (0,_swc_helpers_ts_decorate__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
     (0,jodit_core_decorators__WEBPACK_IMPORTED_MODULE_2__.watch)(':beforeSetElementValue')
 ], imageProcessor.prototype, "onBeforeSetElementValue", null);
+(0,_swc_helpers_ts_decorate__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+    jodit_core_decorators__WEBPACK_IMPORTED_MODULE_2__.autobind
+], imageProcessor.prototype, "onSelectionChange", null);
 (0,_swc_helpers_ts_decorate__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
     (0,jodit_core_decorators__WEBPACK_IMPORTED_MODULE_2__.watch)([
         ':change',
@@ -33219,6 +33266,14 @@ const JODIT_IMAGE_BLOB_ID = JODIT_IMAGE_PROCESSOR_BINDED + 'blob-id';
     ]),
     (0,jodit_core_decorators__WEBPACK_IMPORTED_MODULE_2__.debounce)()
 ], imageProcessor.prototype, "afterChange", null);
+function isImageSelected(jodit) {
+    const { sel } = jodit.s;
+    if (!sel || !sel.rangeCount) {
+        return false;
+    }
+    const { startContainer, startOffset, endContainer, endOffset } = sel.getRangeAt(0);
+    return startContainer === endContainer && endOffset === startOffset + 1 && jodit_core_dom_dom__WEBPACK_IMPORTED_MODULE_3__.Dom.isTag(startContainer.childNodes[startOffset], 'img') && jodit_core_dom_dom__WEBPACK_IMPORTED_MODULE_3__.Dom.isOrContains(jodit.editor, startContainer);
+}
 /**
  * Remove the invisible-space text beside an image, which only held a caret.
  * Selecting the image replaces the caret, and with the text still after a
@@ -35494,6 +35549,26 @@ const cmd = (control)=>control.args && (0,jodit_core_helpers_checker__WEBPACK_IM
 // Images align with `imageAlignClasses`; the wrappers of iframes and media
 // keep inline styles
 const alignClasses = (editor, elm)=>jodit_core_dom__WEBPACK_IMPORTED_MODULE_0__.Dom.isTag(elm, 'img') ? editor.o.imageAlignClasses : null;
+// A Normal image sits where the text of its line is aligned (#1531)
+const lineAlign = (editor, elm)=>{
+    const block = elm && jodit_core_dom__WEBPACK_IMPORTED_MODULE_0__.Dom.closest(elm, jodit_core_dom__WEBPACK_IMPORTED_MODULE_0__.Dom.isBlock, editor.editor) || editor.editor;
+    const rtl = (0,jodit_core_helpers_utils_css__WEBPACK_IMPORTED_MODULE_3__.css)(block, 'direction') === 'rtl';
+    switch((0,jodit_core_helpers_utils_css__WEBPACK_IMPORTED_MODULE_3__.css)(block, 'text-align')){
+        case 'center':
+        case '-webkit-center':
+            return 'center';
+        case 'justify':
+            return 'justify';
+        case 'right':
+            return 'right';
+        case 'end':
+            return rtl ? 'left' : 'right';
+        case 'start':
+            return rtl ? 'right' : 'left';
+        default:
+            return 'left';
+    }
+};
 const currentAlign = (editor, elm)=>elm ? (0,jodit_core_helpers_utils_align__WEBPACK_IMPORTED_MODULE_2__.getHAlign)(elm, alignClasses(editor, elm)) : 'normal';
 const align = {
     name: 'left',
@@ -35506,7 +35581,7 @@ const align = {
     ],
     update: (editor, button)=>{
         const current = currentAlign(editor, button.target);
-        button.state.icon.name = current === 'normal' ? 'left' : current;
+        button.state.icon.name = current === 'normal' ? lineAlign(editor, button.target) : current;
     },
     isActive: (editor, button)=>currentAlign(editor, button.target) !== 'normal',
     isChildActive: (editor, button)=>{
@@ -42074,7 +42149,8 @@ class AceEditor extends jodit_plugins_source_editor_sourceEditor__WEBPACK_IMPORT
                 }
                 return;
             }
-            this.fromWYSIWYG();
+            // The source plugin carries the fallback editor's text over when this
+            // one is ready; refilling from WYSIWYG here would drop unsynced typing
             tryInitAceEditor();
         };
         editor.e.on('afterSetMode', initAceEditor);
@@ -42456,6 +42532,7 @@ class SourceEditor {
             if (new_value !== this.getMirrorValue()) {
                 this.setMirrorValue(new_value);
             }
+            this.__filledValue = this.getMirrorValue();
             this.__lock = false;
         }
     }
@@ -42625,11 +42702,7 @@ class SourceEditor {
                     }
                     loading = true;
                     (0,jodit_core_helpers__WEBPACK_IMPORTED_MODULE_6__.loadNext)(editor, editor.o.beautifyHTMLCDNUrlsJS).then(()=>{
-                        // The source view was filled before the
-                        // beautifier arrived — format it now.
-                        if (addEventListener()) {
-                            this.syncValueFromWYSIWYG(true);
-                        }
+                        addEventListener() && this.beautifyUntouched();
                     }, ()=>null);
                 };
                 editor.e.on('afterSetMode.source', loadBeautify);
@@ -42649,9 +42722,7 @@ class SourceEditor {
         if (editor.o.sourceEditor !== 'area') {
             const sourceEditor = (0,_editor_factory__WEBPACK_IMPORTED_MODULE_9__.createSourceEditor)(editor.o.sourceEditor, editor, this.mirrorContainer, this.toWYSIWYG, this.fromWYSIWYG);
             sourceEditor.onReadyAlways(()=>{
-                this.sourceEditor?.destruct();
-                this.sourceEditor = sourceEditor;
-                this.syncValueFromWYSIWYG(true);
+                this.takeOver(sourceEditor);
                 editor.events?.fire('sourceEditorReady', editor);
             });
         } else {
@@ -42661,6 +42732,48 @@ class SourceEditor {
             });
         }
     }
+    /**
+	 * Replaces the source editor (the textarea shown while ACE loads) with
+	 * the one that just became ready, carrying its text, selection and focus
+	 * over. Filling the new editor from WYSIWYG instead would drop what was
+	 * typed since the last, debounced, sync and normalise half-typed markup.
+	 */ takeOver(sourceEditor) {
+        const previous = this.sourceEditor;
+        if (!previous || previous === sourceEditor) {
+            this.sourceEditor = sourceEditor;
+            this.syncValueFromWYSIWYG(true);
+            return;
+        }
+        const value = previous.getValue(), start = previous.getSelectionStart(), end = previous.getSelectionEnd(), focused = previous.isFocused, untouched = value === this.__filledValue;
+        previous.destruct();
+        this.sourceEditor = sourceEditor;
+        if (untouched) {
+            this.syncValueFromWYSIWYG(true);
+        } else {
+            sourceEditor.setValue(value);
+            this.toWYSIWYG();
+        }
+        if (start >= 0) {
+            sourceEditor.setSelectionRange(start, end);
+        }
+        focused && sourceEditor.focus();
+    }
+    /**
+	 * The beautifier arrived after the source view was opened: format the
+	 * view if nothing has been typed into it, otherwise leave the typing alone
+	 */ beautifyUntouched() {
+        const value = this.getMirrorValue();
+        if (this.j.o.editHTMLDocumentMode || !value || value !== this.__filledValue) {
+            return;
+        }
+        const html = this.j.e.fire('beautifyHTML', value);
+        if ((0,jodit_core_helpers__WEBPACK_IMPORTED_MODULE_6__.isString)(html) && html !== value) {
+            const focused = this.sourceEditor?.isFocused;
+            this.setMirrorValue(html);
+            this.__filledValue = this.getMirrorValue();
+            focused && this.sourceEditor?.focus();
+        }
+    }
     /** @override */ beforeDestruct() {
         if (this.sourceEditor) {
             this.sourceEditor.destruct();
@@ -42674,7 +42787,10 @@ class SourceEditor {
                 name: 'source',
                 group: 'source'
             }
-        ]), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "sourceEditor", void 0), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "mirrorContainer", void 0), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "__lock", false), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "__oldMirrorValue", ''), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "tempMarkerStart", '{start-jodit-selection}'), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "tempMarkerStartReg", /{start-jodit-selection}/g), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "tempMarkerEnd", '{end-jodit-selection}'), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "tempMarkerEndReg", /{end-jodit-selection}/g), // override it for ace editors
+        ]), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "sourceEditor", void 0), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "mirrorContainer", void 0), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "__lock", false), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "__oldMirrorValue", ''), /**
+	 * What the source view was last filled with from WYSIWYG, read back from
+	 * the editor; while the view still holds it, nothing has been typed there
+	 */ (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "__filledValue", ''), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "tempMarkerStart", '{start-jodit-selection}'), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "tempMarkerStartReg", /{start-jodit-selection}/g), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "tempMarkerEnd", '{end-jodit-selection}'), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "tempMarkerEndReg", /{end-jodit-selection}/g), // override it for ace editors
         (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "getSelectionStart", ()=>{
             return this.sourceEditor?.getSelectionStart() ?? 0;
         }), (0,_swc_helpers_define_property__WEBPACK_IMPORTED_MODULE_0__._)(this, "getSelectionEnd", ()=>{
@@ -45038,10 +45154,19 @@ jodit_core_global__WEBPACK_IMPORTED_MODULE_5__.pluginSystem.add('toolbarNavigati
 
 
 
+function insertVideos(data) {
+    data.files?.forEach((file)=>{
+        this.s.insertNode(this.createInside.element('video', {
+            controls: '',
+            src: data.baseurl + file
+        }));
+    });
+}
 jodit_config__WEBPACK_IMPORTED_MODULE_4__.Config.prototype.video = {
     parseUrlToVideoEmbed: jodit_core_helpers__WEBPACK_IMPORTED_MODULE_0__.convertMediaUrlToVideoEmbed,
     defaultWidth: 400,
-    defaultHeight: 345
+    defaultHeight: 345,
+    defaultHandlerSuccess: insertVideos
 };
 jodit_core_ui_icon__WEBPACK_IMPORTED_MODULE_3__.Icon.set('video', (_video_svg__WEBPACK_IMPORTED_MODULE_6___default()));
 jodit_config__WEBPACK_IMPORTED_MODULE_4__.Config.prototype.controls.video = {
@@ -45078,6 +45203,17 @@ jodit_config__WEBPACK_IMPORTED_MODULE_4__.Config.prototype.controls.video = {
             close();
         };
         jodit.s.save();
+        const { uploader } = jodit.o;
+        // Base64 alone would put whole video files into the content
+        if (uploader.showTabInFileSelector !== false && (uploader.url || uploader.customUploadFunction)) {
+            tabs.push((0,jodit_modules_widget__WEBPACK_IMPORTED_MODULE_5__.UploadTab)(jodit, (data)=>{
+                jodit.s.restore();
+                (jodit.o.video?.defaultHandlerSuccess ?? insertVideos).call(jodit, data);
+            }, {
+                label: 'Drop file',
+                accept: 'video/*'
+            }));
+        }
         tabs.push({
             icon: 'link',
             name: 'Link',