jodit 4.18.3 → 4.18.4

package/types/config.d.ts

@@ -26,7 +26,6 @@ import type { Controls } from "./types/index";
 import type { HAlignClasses } from "./types/index";
 import type { IAsyncStorageOptions } from "./types/index";
 import type { IExtraPlugin } from "./types/index";
-import type { ImageAlignClasses } from "./types/index";
 import type { ImageHAlign } from "./types/index";
 import type { IUIButtonState } from "./types/index";
 import type { IViewOptions } from "./types/index";
@@ -642,29 +641,19 @@ declare class Config implements IViewOptions {
      */
     imageDefaultAlign: ImageHAlign;
     /**
-     * Class names to align images with, instead of an inline `float` or
-     * `margin`. Aligning an image removes every class listed here and adds the
-     * chosen alignment's, which can be several separated by spaces. An
-     * alignment can also list several such sets, to recognise each of them;
-     * aligning writes the first. `alignClasses.img` takes its place when set.
-     *
-     * ```javascript
-     * Jodit.make('#editor', {
-     *   imageAlignClasses: {
-     *     left: 'align-left',
-     *     right: 'align-right',
-     *     center: ['align-center', 'centered']
-     *   }
-     * });
-     * ```
+     * @deprecated Use `alignClasses.img`, which takes the same value. When
+     * `alignClasses.img` isn't set, the editor copies this into it.
      */
-    imageAlignClasses: Nullable<ImageAlignClasses>;
+    imageAlignClasses: Nullable<HAlignClasses>;
     /**
-     * Class names to align elements with, by tag name, as `imageAlignClasses`
-     * does for images: `img`, and `video`, `audio` and `iframe` in the media
-     * popup. A media wrapper (see `mediaWrappers`), and Jodit's own `jodit` and
-     * `jodit-media` wrappers, are aligned with the classes for the media in
-     * them.
+     * Class names to align elements with, by tag name, instead of an inline
+     * `float` or `margin`: `img`, and `video`, `audio` and `iframe` in the
+     * media popup. Aligning an element removes every class listed for its tag
+     * and adds the chosen alignment's, which can be several separated by
+     * spaces. An alignment can also list several such sets, to recognise each
+     * of them; aligning writes the first. A media wrapper (see
+     * `mediaWrappers`), and Jodit's own `jodit` and `jodit-media` wrappers,
+     * are aligned with the classes for the media in them.
      *
      * ```javascript
      * const media = {
@@ -674,7 +663,15 @@ declare class Config implements IViewOptions {
      * };
      *
      * Jodit.make('#editor', {
-     *   alignClasses: { video: media, iframe: media }
+     *   alignClasses: {
+     *     img: {
+     *       left: 'align-left',
+     *       right: 'align-right',
+     *       center: ['align-center', 'centered']
+     *     },
+     *     video: media,
+     *     iframe: media
+     *   }
      * });
      * ```
      */
@@ -1759,7 +1756,7 @@ interface 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: {
@@ -1772,14 +1769,16 @@ interface 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>;
         /**

package/types/core/helpers/utils/align.d.ts

@@ -10,7 +10,7 @@ import type { HAlignClasses, IJodit, ImageHAlign, Nullable } from "../../../type
 /**
  * The class names to align `elm` with: `alignClasses` for its tag, or for the
  * media in it when it wraps media (a `mediaWrappers` wrapper, `jodit` or
- * `jodit-media`), falling back to `imageAlignClasses` for an image
+ * `jodit-media`)
  */
 export declare function getAlignClasses(jodit: IJodit, elm: Nullable<HTMLElement>): Nullable<HAlignClasses>;
 /**

package/types/langs/ar.d.ts

@@ -213,5 +213,12 @@ declare const _exports: {
     spellcheck: string;
     'Speech Recognize': string;
     All: string;
+    'Video properties': string;
+    'Audio properties': string;
+    Poster: string;
+    Autoplay: string;
+    Loop: string;
+    Muted: string;
+    Controls: string;
 };
 export = _exports;

package/types/langs/az.d.ts

@@ -219,5 +219,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/types/langs/cs_cz.d.ts

@@ -211,5 +211,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/types/langs/de.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/types/langs/es.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/types/langs/fa.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/types/langs/fi.d.ts

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

package/types/langs/fr.d.ts

@@ -210,5 +210,12 @@ declare const _exports: {
     Edit: 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/types/langs/he.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/types/langs/hu.d.ts

@@ -212,5 +212,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/types/langs/id.d.ts

@@ -211,5 +211,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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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/types/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>;
             /**

package/types/plugins/resizer/resizer.d.ts

@@ -26,6 +26,7 @@ export declare class resizer extends Plugin {
     private height;
     private ratio;
     private rect;
+    private layer;
     private sizeViewer;
     /** @override */
     protected afterInit(editor: IJodit): void;
@@ -33,6 +34,11 @@ export declare class resizer extends Plugin {
      * Click in the editor area
      */
     protected onEditorClick(e: MouseEvent): void;
+    /**
+     * What a click on `node` resizes: the media in it when it's a media
+     * wrapper (`jodit-media`, or one from `mediaWrappers`), or `node` itself
+     */
+    private __resizable;
     protected __afterInsertImage(image: HTMLImageElement): void;
     private addEventListeners;
     private onStartResizing;
@@ -46,6 +52,10 @@ export declare class resizer extends Plugin {
     private onClickOutside;
     private getWorkplacePosition;
     private applySize;
+    /**
+     * The framed element can go with a wrapper round it, keeping its parent
+     */
+    private get isElementInEditor();
     private onDelete;
     private __onChangeEditor;
     /**

package/types/plugins/video/config.d.ts

@@ -53,3 +53,9 @@ declare module 'jodit/config' {
         };
     }
 }
+/**
+ * The video popup's tabs: Upload, when the uploader is configured, then Link
+ * and Code. `insert` runs what a tab inserts, which by default goes in at the
+ * selection the popup was opened with.
+ */
+export declare function videoTabs(jodit: IJodit, close: () => void, insert?: (run: () => void) => void): HTMLElement;

package/types/plugins/video-properties/interface.d.ts

@@ -0,0 +1,31 @@
+/*!
+ * Jodit Editor (https://xdsoft.net/jodit/)
+ * Released under MIT see LICENSE.txt in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
+ */
+/**
+ * @module plugins/video-properties
+ */
+export type EditedMedia = HTMLVideoElement | HTMLAudioElement | HTMLIFrameElement;
+export interface VideoPropertiesValues {
+    width: number | string;
+    height: number | string;
+    poster: string;
+    autoplay: boolean;
+    loop: boolean;
+    muted: boolean;
+    controls: boolean;
+}
+export interface VideoPropertiesState {
+    /**
+     * What the dialog was opened for: the media, or a wrapper round it
+     */
+    target: HTMLElement;
+    media: EditedMedia;
+    ratio: number;
+    sizeIsLocked: boolean;
+    values: VideoPropertiesValues;
+}
+export interface VideoPropertiesAPI {
+    openPosterPopup: (target: HTMLElement) => void;
+}

package/types/plugins/video-properties/readers.d.ts

@@ -0,0 +1,26 @@
+/*!
+ * Jodit Editor (https://xdsoft.net/jodit/)
+ * Released under MIT see LICENSE.txt in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
+ */
+/**
+ * @module plugins/video-properties
+ */
+import type { Nullable } from "../../types/index";
+import type { EditedMedia, VideoPropertiesState } from "./interface";
+/**
+ * The media `target` is, or holds as its wrapper (`jodit-media`, the resizer's
+ * `jodit` for an embed, or one from `mediaWrappers`)
+ * @private
+ */
+export declare function editedMedia(target: HTMLElement): Nullable<EditedMedia>;
+/**
+ * The size `media` is given, inline or by its attribute
+ * @private
+ */
+export declare function ownSize(media: EditedMedia, key: 'width' | 'height'): string;
+/**
+ * Read the media's values into the state
+ * @private
+ */
+export declare function readValues(state: VideoPropertiesState): void;