jodit 4.17.6 → 4.18.1

package/types/modules/toolbar/button/button.d.ts

@@ -77,6 +77,23 @@ export declare class ToolbarButton<T extends IViewBased = IViewBased> extends UI
      * `ArrowUp` on the first item close it and give the focus back to the button
      */
     private __onPopupKeyDown;
+    /**
+     * The mouse opens a dropdown without taking the focus out of the editor.
+     * While a dropdown list is open, typing there searches the list, as in an
+     * open `<select>`, instead of writing into the content
+     */
+    private __onEditorKeyDown;
+    private __typed;
+    private __typedAt;
+    private __typedTo;
+    /**
+     * Typing in a dropdown list focuses the next item whose label starts with
+     * the typed text, whatever their case and accents, and repeating one letter
+     * cycles through the items that start with it, like the WAI-ARIA menu
+     * pattern's type-ahead. The typed text starts again after a pause, or once
+     * the focus has moved on
+     */
+    private __typeAhead;
     /**
      * Visible controls of the opened dropdown that can take the focus
      */
@@ -86,6 +103,7 @@ export declare class ToolbarButton<T extends IViewBased = IViewBased> extends UI
      * Create an open popup list
      */
     private __openControlList;
+    private __openMenu;
     protected onOutsideClick(e: MouseEvent): void;
     private openPopup;
     private __closePopup;

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

@@ -6,6 +6,18 @@
 declare module 'jodit/config' {
     interface Config {
         defaultFontSizePoints: 'px' | 'pt';
+        font: {
+            googleFonts: {
+                /**
+                 * Adds the Google Fonts library to the font family dropdown, which then
+                 * also lists the theme's fonts and the fonts the content uses. The
+                 * address answers with the JSON of the Google Fonts Developer API:
+                 * the API itself (`https://www.googleapis.com/webfonts/v1/webfonts?key=…`)
+                 * or a proxy of it. Empty leaves the dropdown as it is
+                 */
+                url: string;
+            };
+        };
     }
 }
 export {};

package/types/plugins/font/font-picker.d.ts

@@ -0,0 +1,51 @@
+/*!
+ * 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/font
+ */
+import type { IJodit, IToolbarButton } from "../../types/index";
+import { UIElement } from "../../core/ui/element";
+/**
+ * The font family dropdown with Google Fonts. Under their own headings it
+ * lists the fonts the editor's styles give text and headings, the fonts the
+ * content uses, the control's list and the Google Fonts library
+ */
+export declare class UIFontPicker extends UIElement<IJodit> {
+    private readonly __button;
+    private readonly __close;
+    className(): string;
+    private readonly __googleFonts;
+    private readonly __fonts;
+    private __observer;
+    constructor(jodit: IJodit, __button: IToolbarButton, __close: () => void);
+    private __render;
+    /**
+     * The fonts the editor's styles give text and each heading
+     */
+    private __themeFonts;
+    /**
+     * The fonts the content sets
+     */
+    private __usedFonts;
+    private __append;
+    /**
+     * Shows the names of the Google Fonts in view, and those just below it,
+     * in their own fonts. Setting every item's font up front would have the
+     * browser look for each of the library's families among the installed
+     * fonts the first time the list opens
+     */
+    private __observeGoogleFonts;
+    /**
+     * Keeps the editor's selection, as the toolbar buttons do
+     */
+    protected onMouseDown(e: MouseEvent): void;
+    protected onClick(e: MouseEvent): void;
+    /**
+     * The font the selected text has without a font of its own: its block's
+     */
+    private __blockFont;
+    destruct(): void;
+}

package/types/plugins/font/google-fonts.d.ts

@@ -0,0 +1,65 @@
+/*!
+ * 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/font
+ */
+import type { IJodit } from "../../types/index";
+import { ViewComponent } from "../../core/component/view-component";
+/**
+ * A font as the Google Fonts Developer API describes it
+ */
+export interface IGoogleFont {
+    family: string;
+    category: string;
+    variants: string[];
+}
+/**
+ * The first family of a `font-family` value, unquoted and in lower case for
+ * comparing
+ */
+export declare function firstFamily(fontFamily: string): string;
+/**
+ * Loads fonts from Google Fonts: the whole of each font the content uses into
+ * the editor's document, and just the letters of its name for the font list
+ */
+export declare class GoogleFonts extends ViewComponent<IJodit> {
+    className(): string;
+    /**
+     * The library by lower-case family, empty until it arrives
+     */
+    readonly fonts: Map<string, IGoogleFont>;
+    readonly ready: Promise<void>;
+    private readonly __links;
+    private readonly __loaded;
+    private readonly __previewed;
+    constructor(jodit: IJodit);
+    /**
+     * The library's font named first in a `font-family` value
+     */
+    find(fontFamily: string): IGoogleFont | undefined;
+    /**
+     * The `font-family` value that applies a font
+     */
+    value(font: IGoogleFont): string;
+    /**
+     * Loads the regular, italic, bold and bold italic styles that a font has
+     * into the editor's document
+     */
+    load(font: IGoogleFont): void;
+    /**
+     * Loads every font of the library that the content uses
+     */
+    loadUsed(): void;
+    /**
+     * Loads into the page just the letters of each font's name, so the font
+     * list can show the name in its font
+     */
+    preview(fonts: IGoogleFont[]): void;
+    private __loadedInto;
+    private __family;
+    private __append;
+    destruct(): void;
+}

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

@@ -3,6 +3,10 @@
  * 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/media
+ */
+import type { IDictionary, MediaWrapper } from "../../types/index";
 declare module 'jodit/config' {
     interface Config {
         /**
@@ -17,6 +21,27 @@ declare module 'jodit/config' {
          * Media tags
          */
         mediaBlocks: string[];
+        /**
+         * Wrappers that media keep in the content, by the media's tag name, such as
+         * Froala's `<span class="fr-video">` around video, audio and embeds. An
+         * element with a wrapper for its tag:
+         * - is wrapped in it instead of the editor-only `mediaFakeTag` when its tag
+         * is one of `mediaBlocks`, or left in it when it's already in one
+         * - goes in inside it when the video popup inserts it, as an upload, a
+         * link's embed or embed code that is one element
+         * - opens the media popup for its wrapper when clicked, whose Align and
+         * Delete act on the wrapper
+         *
+         * A wrapper is given `contenteditable="false"` and `draggable="true"`,
+         * which stay in the value.
+         * ```javascript
+         * const frVideo = { tag: 'span', className: 'fr-video' };
+         *
+         * Jodit.make('#editor', {
+         *   mediaWrappers: { video: frVideo, audio: frVideo, iframe: frVideo }
+         * });
+         * ```
+         */
+        mediaWrappers: IDictionary<MediaWrapper>;
     }
 }
-export {};

package/types/types/toolbar.d.ts

@@ -193,6 +193,8 @@ interface IControlType<T extends IViewBased = IJodit | IViewBased | IFileBrowser
     childTemplate?: (jodit: T, key: string, value: string, button: IToolbarButton) => string;
     /**
      * After click on the button it will show popup element which consist value that this function returned
+     * For a control with a `list`, the returned content replaces the list's buttons in its dropdown,
+     * and `false` keeps them
      * @example
      * ```javascript
      * var editor = Jodit.make('.editor', {

package/types/types/types.d.ts

@@ -187,10 +187,22 @@ export interface ImageEditorOptions {
 export type InsertMode = 'insert_as_html' | 'insert_as_text' | 'insert_clear_html' | 'insert_only_text';
 export type ImageAction = 'resize' | 'crop';
 export type ImageHAlign = 'normal' | 'left' | 'right' | 'center' | '';
+/**
+ * Class names for each alignment, see `alignClasses`. An alignment can list
+ * several sets of class names to recognise; aligning writes the first
+ */
+export type HAlignClasses = Partial<Record<Exclude<ImageHAlign, ''>, string | string[]>>;
 /**
  * Class names for each image alignment, see `imageAlignClasses`
  */
-export type ImageAlignClasses = Partial<Record<Exclude<ImageHAlign, ''>, string>>;
+export type ImageAlignClasses = HAlignClasses;
+/**
+ * A wrapper that media keep in the content, see `mediaWrappers`
+ */
+export interface MediaWrapper {
+    tag: string;
+    className: string;
+}
 export interface ImageBox {
     w: number;
     h: number;