jodit 4.18.3 → 4.18.4

package/esm/langs/it.d.ts

@@ -215,5 +215,12 @@ declare const _exports: {
     'Insert className': string;
     'Press Alt for custom resizing': string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/it.js

@@ -230,5 +230,12 @@ export default {
 	'Insert className': 'Inserisci il nome della classe',
 	'Press Alt for custom resizing':
 		'Premere Alt per il ridimensionamento personalizzato',
-	'License: %s': 'Licenza: %s'
+	'License: %s': 'Licenza: %s',
+	'Video properties': 'Proprietà del video',
+	'Audio properties': "Proprietà dell'audio",
+	Poster: 'Immagine di anteprima',
+	Autoplay: 'Riproduzione automatica',
+	Loop: 'Ripeti',
+	Muted: 'Muto',
+	Controls: 'Controlli'
 };

package/esm/langs/ja.d.ts

@@ -215,5 +215,12 @@ declare const _exports: {
     'Insert className': string;
     'Press Alt for custom resizing': string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/ja.js

@@ -228,5 +228,12 @@ export default {
 	'Insert className': 'クラス名を挿入',
 	'Press Alt for custom resizing':
 		'カスタムサイズ変更のためのAltキーを押します',
-	'License: %s': 'ライセンス: %s'
+	'License: %s': 'ライセンス: %s',
+	'Video properties': '動画のプロパティー',
+	'Audio properties': '音声のプロパティー',
+	Poster: 'ポスター画像',
+	Autoplay: '自動再生',
+	Loop: 'ループ再生',
+	Muted: 'ミュート',
+	Controls: 'コントロール'
 };

package/esm/langs/ko.d.ts

@@ -209,5 +209,12 @@ declare const _exports: {
     'Find Next': string;
     'Insert className': string;
     'Press Alt for custom resizing': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/ko.js

@@ -223,5 +223,12 @@ export default {
 	'Find Next': '다음 찾기',
 	'Insert className': 'className 입력',
 	'Press Alt for custom resizing':
-		'사용자 지정 크기 조정에 대 한 고도 누르십시오'
+		'사용자 지정 크기 조정에 대 한 고도 누르십시오',
+	'Video properties': '동영상 속성',
+	'Audio properties': '오디오 속성',
+	Poster: '포스터 이미지',
+	Autoplay: '자동 재생',
+	Loop: '반복 재생',
+	Muted: '음소거',
+	Controls: '컨트롤'
 };

package/esm/langs/mn.d.ts

@@ -210,5 +210,12 @@ declare const _exports: {
     'Insert className': string;
     'Press Alt for custom resizing': string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/mn.js

@@ -226,5 +226,12 @@ export default {
 	'Insert className': 'Бүлгийн нэрээ оруулна уу',
 	'Press Alt for custom resizing':
 		'Хэмжээсийг шинээр өөчрлөхийн тулд Alt товчин дээр дарна уу',
-	'License: %s': 'Лиценз: %s'
+	'License: %s': 'Лиценз: %s',
+	'Video properties': 'Видеоны үзүүлэлт',
+	'Audio properties': 'Аудионы үзүүлэлт',
+	Poster: 'Нүүр зураг',
+	Autoplay: 'Автоматаар тоглуулах',
+	Loop: 'Давтах',
+	Muted: 'Дуугүй',
+	Controls: 'Удирдлага'
 };

package/esm/langs/nl.d.ts

@@ -211,5 +211,12 @@ declare const _exports: {
     'Insert className': string;
     'Press Alt for custom resizing': string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/nl.js

@@ -225,5 +225,12 @@ export default {
 	'Find Next': 'Volgende Zoeken',
 	'Insert className': 'Voeg de klassenaam in',
 	'Press Alt for custom resizing': 'Druk op Alt voor aangepaste grootte',
-	'License: %s': 'Licentie: %s'
+	'License: %s': 'Licentie: %s',
+	'Video properties': 'Video-eigenschappen',
+	'Audio properties': 'Audio-eigenschappen',
+	Poster: 'Voorbeeldafbeelding',
+	Autoplay: 'Automatisch afspelen',
+	Loop: 'Herhalen',
+	Muted: 'Gedempt',
+	Controls: 'Bedieningselementen'
 };

package/esm/langs/no.d.ts

@@ -219,5 +219,12 @@ declare const _exports: {
     Quadrate: string;
     'Find Previous': string;
     'Find Next': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/no.js

@@ -232,5 +232,12 @@ export default {
 	Dot: 'Prikk',
 	Quadrate: 'Firkant',
 	'Find Previous': 'Finn forrige',
-	'Find Next': 'Finn neste'
+	'Find Next': 'Finn neste',
+	'Video properties': 'Videoegenskaper',
+	'Audio properties': 'Lydegenskaper',
+	Poster: 'Forsidebilde',
+	Autoplay: 'Automatisk avspilling',
+	Loop: 'Gjenta',
+	Muted: 'Dempet',
+	Controls: 'Kontroller'
 };

package/esm/langs/pl.d.ts

@@ -210,5 +210,12 @@ declare const _exports: {
     'Insert className': string;
     'Press Alt for custom resizing': string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/pl.js

@@ -225,5 +225,12 @@ export default {
 	'Find Next': 'Znajdź Dalej',
 	'Insert className': 'Wstaw nazwę zajęć',
 	'Press Alt for custom resizing': 'Naciśnij Alt, aby zmienić rozmiar',
-	'License: %s': 'Licencja: %s'
+	'License: %s': 'Licencja: %s',
+	'Video properties': 'Właściwości filmu',
+	'Audio properties': 'Właściwości dźwięku',
+	Poster: 'Obraz podglądu',
+	Autoplay: 'Autoodtwarzanie',
+	Loop: 'Zapętlenie',
+	Muted: 'Wyciszony',
+	Controls: 'Elementy sterujące'
 };

package/esm/langs/pt_br.d.ts

@@ -215,5 +215,12 @@ declare const _exports: {
     'Insert className': string;
     'Press Alt for custom resizing': string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/pt_br.js

@@ -229,5 +229,12 @@ export default {
 	'Insert className': 'Insira o nome da classe',
 	'Press Alt for custom resizing':
 		'Pressione Alt para redimensionamento personalizado',
-	'License: %s': 'Licença: %s'
+	'License: %s': 'Licença: %s',
+	'Video properties': 'Propriedades do vídeo',
+	'Audio properties': 'Propriedades do áudio',
+	Poster: 'Imagem de capa',
+	Autoplay: 'Reprodução automática',
+	Loop: 'Repetir',
+	Muted: 'Sem som',
+	Controls: 'Controles'
 };

package/esm/langs/ru.d.ts

@@ -209,5 +209,12 @@ declare const _exports: {
     'Find Next': string;
     'Insert className': string;
     'Press Alt for custom resizing': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/ru.js

@@ -224,5 +224,12 @@ export default {
 	'Find Next': 'Найти Далее',
 	'Insert className': 'Вставить название класса',
 	'Press Alt for custom resizing':
-		'Нажмите Alt для изменения пользовательского размера'
+		'Нажмите Alt для изменения пользовательского размера',
+	'Video properties': 'Свойства видео',
+	'Audio properties': 'Свойства аудио',
+	Poster: 'Обложка',
+	Autoplay: 'Автовоспроизведение',
+	Loop: 'Повтор',
+	Muted: 'Без звука',
+	Controls: 'Элементы управления'
 };

package/esm/langs/sk.d.ts

@@ -217,5 +217,12 @@ declare const _exports: {
     'Edit image': string;
     'Tiles view': string;
     'List view': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/sk.js

@@ -231,5 +231,12 @@ export default {
 	'Select file': 'Vybrať súbor',
 	'Edit image': 'Upraviť obrázok',
 	'Tiles view': 'Zobrazenie dlaždíc',
-	'List view': 'Zobrazenie zoznamu'
+	'List view': 'Zobrazenie zoznamu',
+	'Video properties': 'Vlastnosti videa',
+	'Audio properties': 'Vlastnosti zvuku',
+	Poster: 'Náhľadový obrázok',
+	Autoplay: 'Automatické prehrávanie',
+	Loop: 'Opakovať',
+	Muted: 'Stlmené',
+	Controls: 'Ovládacie prvky'
 };

package/esm/langs/sv.d.ts

@@ -218,5 +218,12 @@ declare const _exports: {
     'Embed code': string;
     All: string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/sv.js

@@ -233,5 +233,12 @@ export default {
 	space: 'mellanslag',
 	'Embed code': 'Bädda in kod',
 	All: 'Välj alla',
-	'License: %s': 'Licens: %s'
+	'License: %s': 'Licens: %s',
+	'Video properties': 'Videoegenskaper',
+	'Audio properties': 'Ljudegenskaper',
+	Poster: 'Affischbild',
+	Autoplay: 'Automatisk uppspelning',
+	Loop: 'Upprepa',
+	Muted: 'Ljudlös',
+	Controls: 'Kontroller'
 };

package/esm/langs/tr.d.ts

@@ -210,5 +210,12 @@ declare const _exports: {
     'Insert className': string;
     'Press Alt for custom resizing': string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/tr.js

@@ -224,5 +224,12 @@ export default {
 	'Insert className': 'Sınıf adı girin',
 	'Press Alt for custom resizing':
 		'Özel yeniden boyutlandırma için Alt tuşuna basın',
-	'License: %s': 'Lisans: %s'
+	'License: %s': 'Lisans: %s',
+	'Video properties': 'Video özellikleri',
+	'Audio properties': 'Ses özellikleri',
+	Poster: 'Kapak resmi',
+	Autoplay: 'Otomatik oynat',
+	Loop: 'Döngü',
+	Muted: 'Sessiz',
+	Controls: 'Kontroller'
 };

package/esm/langs/ua.d.ts

@@ -209,5 +209,12 @@ declare const _exports: {
     'Find Next': string;
     'Insert className': string;
     'Press Alt for custom resizing': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/ua.js

@@ -223,5 +223,12 @@ export default {
 	'Find Previous': 'Знайти попередні',
 	'Find Next': 'Знайти наступні',
 	'Insert className': 'Вставити клас',
-	'Press Alt for custom resizing': 'Натисніть Alt для зміни розміру'
+	'Press Alt for custom resizing': 'Натисніть Alt для зміни розміру',
+	'Video properties': 'Властивості відео',
+	'Audio properties': 'Властивості аудіо',
+	Poster: 'Обкладинка',
+	Autoplay: 'Автовідтворення',
+	Loop: 'Повтор',
+	Muted: 'Без звуку',
+	Controls: 'Елементи керування'
 };

package/esm/langs/zh_cn.d.ts

@@ -211,5 +211,12 @@ declare const _exports: {
     'Insert className': string;
     'Press Alt for custom resizing': string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/zh_cn.js

@@ -223,5 +223,12 @@ export default {
 	'Find Next': '查找下一个',
 	'Insert className': '插入班级名称',
 	'Press Alt for custom resizing': '按Alt自定义调整大小',
-	'License: %s': '许可证: %s'
+	'License: %s': '许可证: %s',
+	'Video properties': '视频属性',
+	'Audio properties': '音频属性',
+	Poster: '封面图',
+	Autoplay: '自动播放',
+	Loop: '循环播放',
+	Muted: '静音',
+	Controls: '播放控件'
 };

package/esm/langs/zh_tw.d.ts

@@ -210,5 +210,12 @@ declare const _exports: {
     'Press Alt for custom resizing': string;
     Edit: string;
     'License: %s': string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/esm/langs/zh_tw.js

@@ -222,5 +222,12 @@ export default {
 	'Insert className': '插入 class 名稱',
 	'Press Alt for custom resizing': '按住 Alt 以調整自訂大小',
 	Edit: '編輯',
-	'License: %s': '許可證: %s'
+	'License: %s': '許可證: %s',
+	'Video properties': '影片屬性',
+	'Audio properties': '音訊屬性',
+	Poster: '封面圖片',
+	Autoplay: '自動播放',
+	Loop: '循環播放',
+	Muted: '靜音',
+	Controls: '播放控制項'
 };

package/esm/plugins/all.d.ts

@@ -68,6 +68,7 @@ import "./table/table";
 import "./table-keyboard-navigation/table-keyboard-navigation";
 import "./toolbar-navigation/toolbar-navigation";
 import "./video/video";
+import "./video-properties/video-properties";
 import "./wrap-nodes/wrap-nodes";
 import "./dtd/dtd";
 import "./xpath/xpath";

package/esm/plugins/all.js

@@ -69,6 +69,7 @@ import "./table/table.js";
 import "./table-keyboard-navigation/table-keyboard-navigation.js";
 import "./toolbar-navigation/toolbar-navigation.js";
 import "./video/video.js";
+import "./video-properties/video-properties.js";
 import "./wrap-nodes/wrap-nodes.js";
 import "./dtd/dtd.js";
 import "./xpath/xpath.js";

package/esm/plugins/image-processor/image-processor.d.ts

@@ -25,7 +25,10 @@ export declare class imageProcessor extends Plugin {
     }): void;
     /**
      * 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
+     * paints the rest of a block image's line with its parent's highlight. See #1528.
+     * Media in a wrapper (`jodit-media`, the resizer's `jodit` for an embed, or
+     * one from `mediaWrappers`) isn't highlighted either, as Safari paints its
+     * wrapper's whole line, and its resize frame shows it's selected
      */
     private onSelectionChange;
     protected afterChange(data: {

package/esm/plugins/image-processor/image-processor.js

@@ -17,13 +17,14 @@ import { INVISIBLE_SPACE_REG_EXP, SOURCE_CONSUMER } from "../../core/constants.j
 import { autobind, cached, debounce, watch } from "../../core/decorators/index.js";
 import { Dom } from "../../core/dom/dom.js";
 import { pluginSystem } from "../../core/global.js";
-import { $$, dataBind } from "../../core/helpers/index.js";
+import { $$, dataBind, getWrappedMedia } from "../../core/helpers/index.js";
 import { Plugin } from "../../core/plugin/index.js";
 import { dataURItoBlob } from "../../modules/uploader/helpers/data-uri-to-blob.js";
 import "./config.js";
 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';
+const SELECTED_TAGS = new Set(['img', 'jodit', 'jodit-media']);
 /**
  * Change editor's size after load all images
  */
@@ -66,7 +67,10 @@ export class imageProcessor extends Plugin {
     }
     /**
      * 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
+     * paints the rest of a block image's line with its parent's highlight. See #1528.
+     * Media in a wrapper (`jodit-media`, the resizer's `jodit` for an embed, or
+     * one from `mediaWrappers`) isn't highlighted either, as Safari paints its
+     * wrapper's whole line, and its resize frame shows it's selected
      */
     onSelectionChange() {
         const { jodit } = this;
@@ -117,9 +121,11 @@ function isImageSelected(jodit) {
         return false;
     }
     const { startContainer, startOffset, endContainer, endOffset } = sel.getRangeAt(0);
+    const node = startContainer.childNodes[startOffset];
     return (startContainer === endContainer &&
         endOffset === startOffset + 1 &&
-        Dom.isTag(startContainer.childNodes[startOffset], 'img') &&
+        (Dom.isTag(node, SELECTED_TAGS) ||
+            Boolean(getWrappedMedia(jodit, node))) &&
         Dom.isOrContains(jodit.editor, startContainer));
 }
 /**

package/esm/plugins/image-properties/readers/align.d.ts

@@ -6,9 +6,9 @@
 /**
  * @module plugins/image-properties
  */
-import type { ImageAlignClasses, Nullable } from "../../../types/index";
+import type { HAlignClasses, Nullable } from "../../../types/index";
 import type { EditValues } from "../interface";
 /**
  * @private
  */
-export declare function readAlign(image: HTMLImageElement, values: EditValues, classes?: Nullable<ImageAlignClasses>): void;
+export declare function readAlign(image: HTMLImageElement, values: EditValues, classes?: Nullable<HAlignClasses>): void;

package/esm/plugins/index.d.ts

@@ -68,6 +68,7 @@ import "./table/table";
 import "./table-keyboard-navigation/table-keyboard-navigation";
 import "./toolbar-navigation/toolbar-navigation";
 import "./video/video";
+import "./video-properties/video-properties";
 import "./wrap-nodes/wrap-nodes";
 import "./dtd/dtd";
 import "./xpath/xpath";

package/esm/plugins/inline-popup/config/items/iframe.d.ts

@@ -6,10 +6,18 @@
 /**
  * @module plugins/inline-popup
  */
-import type { IJodit } from "../../../../types/index";
+import type { IJodit, Nullable } from "../../../../types/index";
 declare const _default: (import("../../../../types/index").IControlType<IJodit, import("../../../../types/index").IToolbarButton> | {
+    name: string;
+    icon: string;
+    tooltip: string;
+    popup: (editor: IJodit, target: Nullable<Node>, close: () => void) => HTMLElement | void;
+    exec?: undefined;
+} | {
     name: string;
     tooltip: string;
     exec: (editor: IJodit, image: HTMLImageElement) => void;
+    icon?: undefined;
+    popup?: undefined;
 })[];
 export default _default;

package/esm/plugins/inline-popup/config/items/iframe.js

@@ -5,6 +5,14 @@
  */
 import { align } from "./img.js";
 export default [
+    {
+        name: 'replace',
+        icon: 'video',
+        tooltip: 'Replace',
+        popup: (editor, target, close) => target
+            ? editor.e.fire('generateReplaceVideoTabs', target, close)
+            : undefined
+    },
     {
         name: 'bin',
         tooltip: 'Delete',
@@ -12,5 +20,12 @@ export default [
             image && editor.s.removeNode(image);
         }
     },
+    {
+        name: 'pencil',
+        tooltip: 'Edit',
+        exec: (editor, target) => {
+            target && editor.e.fire('openVideoProperties', target);
+        }
+    },
     align
 ];

package/esm/plugins/media/media.js

@@ -26,6 +26,7 @@ export function media(editor) {
                 (_a = getMediaWrapper(editor, element)) !== null && _a !== void 0 ? _a : wrapMedia(editor, element);
         }
         else if (mediaInFakeBlock) {
+            const media = element;
             const wrapper = editor.createInside.element(mediaFakeTag, {
                 'data-jodit-temp': 1,
                 contenteditable: false,
@@ -33,13 +34,21 @@ export function media(editor) {
                 [`data-${keyFake}`]: 1
             });
             attr(wrapper, 'style', attr(element, 'style'));
-            css(wrapper, {
-                display: cssInline(element, 'display') === 'inline-block'
-                    ? 'inline-block'
-                    : 'block',
-                width: element.offsetWidth,
-                height: element.offsetHeight
-            });
+            // The wrapper fits the media, whose size changes as its metadata loads
+            // and as it's resized. A percentage width is of the line, so it takes that
+            const fit = () => {
+                css(wrapper, {
+                    display: cssInline(media, 'display') === 'inline-block'
+                        ? 'inline-block'
+                        : 'block',
+                    width: cssInline(media, 'width').endsWith('%')
+                        ? ''
+                        : 'fit-content',
+                    height: ''
+                });
+            };
+            fit();
+            editor.e.on(media, 'changesize', fit);
             if (element.parentNode) {
                 Dom.before(element, wrapper);
             }

package/esm/plugins/resizer/config.d.ts

@@ -10,7 +10,7 @@ import type { HTMLTagNames } from "../../types/index";
 declare module 'jodit/config' {
     interface Config {
         /**
-         * Set of HTML tag names whose elements can be resized by the user via drag handles (e.g. images, iframes, tables)
+         * Set of HTML tag names whose elements can be resized by the user via drag handles (e.g. images, iframes, tables, videos)
          */
         allowResizeTags: Set<HTMLTagNames>;
         resizer: {
@@ -23,14 +23,16 @@ declare module 'jodit/config' {
              * Save width and height proportions when resizing
              * ```js
              * Jodit.make('#editor', {
-             *   allowResizeTags: ['img', 'iframe', 'table', 'jodit'],
+             *   allowResizeTags: new Set(['img', 'iframe', 'table', 'jodit', 'video']),
              *   resizer: {
              *     useAspectRatio: false, // don't save,
-             *     useAspectRatio: ['img'], // save only for images (default value)
+             *     useAspectRatio: new Set(['img']), // save only for images
              *     useAspectRatio: true // save for all
              *   }
              * });
              * ```
+             * Images and videos keep it by default. A video with no height of its
+             * own keeps it by being given only a width.
              */
             useAspectRatio: boolean | Set<HTMLTagNames>;
             /**