jodit-pro 4.18.7 → 4.18.9

package/esm/plugins/math/interface.d.ts

@@ -0,0 +1,45 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+export type MathFormat = 'latex' | 'mathml';
+export type MathDisplay = 'block' | 'inline';
+export type MathAlign = 'left' | 'center' | 'right';
+export interface IMathData {
+    format: MathFormat;
+    display: MathDisplay;
+    source: string;
+    background?: string;
+    textColor?: string;
+    borderColor?: string;
+    align?: MathAlign;
+    wrap?: boolean;
+    width?: number;
+}
+export interface IMathSymbol {
+    label: string;
+    latex: string;
+    mathml: string;
+}
+export interface IMathTemplate {
+    title: string;
+    latex: string;
+    mathml: string;
+}
+export interface IMathRenderResult {
+    svg: string;
+    error?: string;
+}
+export interface IMathJax {
+    tex2svg(tex: string, options?: {
+        display?: boolean;
+    }): HTMLElement;
+    mathml2svg(mml: string, options?: {
+        display?: boolean;
+    }): HTMLElement;
+    startup: {
+        promise: Promise<unknown>;
+    };
+    texReset?: () => void;
+}

package/esm/plugins/math/math.d.ts

@@ -0,0 +1,66 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+import type { IJodit, Nullable } from "jodit/esm/types/index";
+import "./config";
+import { Plugin } from "jodit/esm/core/plugin/index";
+/**
+ * Inserts LaTeX / MathML formulas rendered by MathJax as standalone SVG,
+ * either as a block or inline, and lets the user edit or remove them.
+ */
+export declare class MathPlugin extends Plugin {
+    static requires: string[];
+    buttons: Plugin['buttons'];
+    private __dialog;
+    private __editor;
+    private __saveButton;
+    private __popup;
+    private __toolbar;
+    private __target;
+    protected afterInit(jodit: IJodit): void;
+    protected beforeDestruct(): void;
+    /**
+     * Opens the editor dialog for a new formula or for an existing one.
+     */
+    openEditor(target?: Nullable<Node>, display?: unknown): void;
+    /**
+     * Removes the formula that owns the given node.
+     */
+    removeMath(target?: Nullable<Node>): void;
+    private __submit;
+    private __save;
+    /**
+     * A block formula must not stay inside a paragraph, an inline one is
+     * inserted at the caret.
+     */
+    private __insert;
+    private __getDialog;
+    protected onClick(e: MouseEvent): void;
+    protected onDblClick(e: MouseEvent): void;
+    protected onOutsideClick(): void;
+    /**
+     * Shows the contextual popup (edit / delete) at the formula.
+     */
+    openPopup(element: HTMLElement): void;
+    closePopup(): void;
+    /**
+     * An inline formula that carries data but no SVG is an empty `<span>`,
+     * which the core cleaner drops before MathJax can fill it. The source is
+     * written into such elements as a placeholder; the render replaces it.
+     */
+    protected onBeforeSetValue(value: unknown): string | void;
+    /**
+     * Decorates formulas that arrived with the value and renders the ones
+     * that carry data but no SVG yet.
+     */
+    protected onChange(): void;
+    private __decorateAll;
+    /**
+     * The core resizer sets a pixel box on the figure; the width goes into
+     * the data and the explicit height is dropped so the SVG keeps its ratio.
+     */
+    private __syncResized;
+    private __renderMissing;
+}

package/esm/plugins/math/math.js

@@ -0,0 +1 @@
+var w=Object.defineProperty;var p=(u,t)=>w(u,"name",{value:t,configurable:!0});var h=function(u,t,o,i){var s=arguments.length,e=s<3?t:i===null?i=Object.getOwnPropertyDescriptor(t,o):i,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")e=Reflect.decorate(u,t,o,i);else for(var a=u.length-1;a>=0;a--)(n=u[a])&&(e=(s<3?n(e):s>3?n(t,o,e):n(t,o))||e);return s>3&&e&&Object.defineProperty(t,o,e),e};import"./config.js";import{UIMathEditor as S}from"./ui/editor/editor.js";import{applyMathData as f,createMath as D,decorateMath as A,defaultMathData as P,findMath as _,isMathDisplay as k,isMathElement as R,MATH_ATTR as g,mathTag as y,pixels as b,readMathData as d}from"./helpers.js";import{loadMathJax as B,renderMath as M}from"./mathjax.js";import{autobind as C,debounce as T,watch as c}from"jodit/esm/core/decorators/index.js";import{Dom as l}from"jodit/esm/core/dom/dom.js";import{toArray as E}from"jodit/esm/core/helpers/array/to-array.js";import{isString as q}from"jodit/esm/core/helpers/checker/is-string.js";import{position as O}from"jodit/esm/core/helpers/size/position.js";import{Plugin as x}from"jodit/esm/core/plugin/index.js";import{Button as j}from"jodit/esm/core/ui/button/button/button.js";import{Popup as z}from"jodit/esm/core/ui/popup/popup.js";import{Dialog as V}from"jodit/esm/modules/dialog/dialog.js";import{makeCollection as H}from"jodit/esm/modules/toolbar/factory.js";import{JoditPro as I}from"../../jodit-pro.js";const v=class v extends x{constructor(){super(...arguments),this.buttons=[{name:"math",group:"insert"}],this.__dialog=null,this.__editor=null,this.__saveButton=null,this.__popup=null,this.__toolbar=null,this.__target=null}afterInit(t){t.e.on("openMathEditor",this.openEditor).on("removeMath",this.removeMath).on("isMathEditorOpened",()=>{var o;return!!(!((o=this.__dialog)===null||o===void 0)&&o.isOpened)}),t.registerCommand("insertMath",(o,i,s)=>(this.openEditor(null,s),!1)),this.__decorateAll()}beforeDestruct(){var t,o;this.closePopup(),(t=this.__popup)===null||t===void 0||t.destruct(),(o=this.__dialog)===null||o===void 0||o.destruct()}openEditor(t,o){const i=_(this.j,t??null),s=i&&d(this.j,i)||P(this.j,k(o)?o:void 0);this.closePopup(),this.j.s.save(),B(this.j).catch(()=>null);const e=this.__getDialog(),n=this.__editor;if(!n)return;n.setData(s);const a=j(e,"ok","Save","primary").onAction(()=>this.__submit(i));this.__saveButton=a,a.setState({disabled:!s.source});const m=[j(e,"cancel","Cancel","default").onAction(()=>e.close())];i&&m.unshift(j(e,"bin","","default").onAction(()=>{e.close(),this.removeMath(i)})),e.setHeader(this.j.i18n(i?"Edit equation":"Insert equation")).setFooter([m,a]).open(),n.focus()}removeMath(t){const o=_(this.j,t??this.__target);this.closePopup(),o&&(this.j.s.setCursorAfter(o),l.safeRemove(o),this.j.synchronizeValues())}__submit(t){const o=this.__editor,i=this.__dialog;if(!o||!i)return;const s=o.getData();s.source&&M(this.j,s).then(e=>{if(e.error)throw new Error(e.error);i.close(),this.__save(t,s,e.svg)}).catch(e=>{this.j.message.error(e.message)})}__save(t,o,i){t&&!l.isTag(t,y(o.display))&&(t=l.replace(t,y(o.display),this.j.createInside)),t?f(this.j,t,o,i):(t=D(this.j,o,i),this.j.s.restore(),this.__insert(t,o.display)),this.j.s.setCursorAfter(t),this.j.synchronizeValues()}__insert(t,o){if(this.j.s.insertNode(t,!1,!1),o!=="block")return;let i=t.parentElement;for(;i&&i!==this.j.editor;){if(l.after(i,t),l.isBlock(i)){l.isEmpty(i)&&l.safeRemove(i);break}i=t.parentElement}}__getDialog(){if(!this.__dialog){const{dialog:t}=this.j.o.math;this.__dialog=new V({language:this.j.o.language,theme:this.j.o.theme,shadowRoot:this.j.o.shadowRoot,events:this.j.o.events}),this.__editor=new S(this.j,{onSubmit:p(()=>{var o;(o=this.__saveButton)===null||o===void 0||o.container.click()},"onSubmit"),onChange:p(o=>{var i;(i=this.__saveButton)===null||i===void 0||i.setState({disabled:!o.source})},"onChange")}),this.__dialog.setContent(this.__editor).setSize(t.width,t.height),this.__dialog.e.on("beforeClose",()=>{this.j.s.restore()})}return this.__dialog}onClick(t){const o=_(this.j,t.target);o?this.openPopup(o):this.closePopup()}onDblClick(t){const o=_(this.j,t.target);o&&this.openEditor(o)}onOutsideClick(){this.closePopup()}openPopup(t){if(this.j.o.readonly||!this.j.o.math.popup.length)return;this.__popup||(this.__popup=new z(this.j,!1),this.__toolbar=H(this.j,this.__popup));const o=this.__popup,i=this.__toolbar;i&&(this.__target=t,i.build(this.j.o.math.popup,t),o.setContent(i.container),o.isOpened?o.updatePosition():o.open(()=>O(t,this.j)))}closePopup(){var t;this.__target=null,(t=this.__popup)===null||t===void 0||t.close()}onBeforeSetValue(t){if(!q(t)||!t.includes(g))return;const o=this.j.c.div();o.innerHTML=t;let i=!1;return E(o.querySelectorAll(`[${g}]`)).forEach(s=>{const e=d(this.j,s);e&&!s.querySelector("svg")&&!s.textContent&&(s.textContent=e.source,i=!0)}),i?o.innerHTML:void 0}onChange(){this.__decorateAll(),this.__target&&!this.j.editor.contains(this.__target)&&this.closePopup()}__decorateAll(){let t=!1;E(this.j.editor.querySelectorAll(`[${g}]`)).forEach(o=>{R(o,this.j.o.math.className)&&(A(this.j,o),o.querySelector("svg")?t=this.__syncResized(o)||t:this.__renderMissing(o))}),t&&this.j.synchronizeValues()}__syncResized(t){const o=d(this.j,t);if(!o||o.display!=="block")return!1;const i=b(t.style.width),s=b(t.style.height);if((!i||i===o.width)&&!s)return!1;const e=t.querySelector("svg");return e?(f(this.j,t,{...o,width:i||o.width},e.outerHTML),!0):!1}__renderMissing(t){const o=d(this.j,t);!o||!o.source||M(this.j,o).then(i=>{this.j.editor.contains(t)&&(f(this.j,t,o,i.svg),this.j.synchronizeValues())}).catch(()=>null)}};p(v,"MathPlugin");let r=v;r.requires=["license"],h([C],r.prototype,"openEditor",null),h([C],r.prototype,"removeMath",null),h([c(":click")],r.prototype,"onClick",null),h([c(":dblclick")],r.prototype,"onDblClick",null),h([c(":outsideClick")],r.prototype,"onOutsideClick",null),h([c(":beforeSetValueToEditor")],r.prototype,"onBeforeSetValue",null),h([c([":change",":afterSetMode"]),T()],r.prototype,"onChange",null),I.plugins.add("math",r);export{r as MathPlugin};

package/esm/plugins/math/mathjax.d.ts

@@ -0,0 +1,17 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+import type { IJodit } from "jodit/esm/types/index";
+import type { IMathData, IMathJax, IMathRenderResult } from "./interface";
+/**
+ * Resolves the MathJax instance of the owner window, loading it from
+ * `math.mathJaxUrl` on first use. A MathJax that the host page already
+ * loaded is reused as is.
+ */
+export declare function loadMathJax(jodit: IJodit): Promise<IMathJax>;
+/**
+ * Renders the formula to a standalone SVG string.
+ */
+export declare function renderMath(jodit: IJodit, data: IMathData): Promise<IMathRenderResult>;

package/esm/plugins/math/mathjax.js

@@ -0,0 +1 @@
+var v=Object.defineProperty;var i=(e,r)=>v(e,"name",{value:r,configurable:!0});import{wrapMathML as c}from"./helpers.js";import{appendScriptAsync as h}from"jodit/esm/core/helpers/utils/append-script.js";import{attr as s}from"jodit/esm/core/helpers/utils/attr.js";function d(e){var r;const t=e.ow;return!((r=t.MathJax)===null||r===void 0)&&r.tex2svg?Promise.resolve(t.MathJax):(t.MathJax||(t.MathJax={svg:{fontCache:"local"},startup:{typeset:!1}}),h(e,e.o.math.mathJaxUrl).then(()=>{var o,a;return(a=(o=t.MathJax)===null||o===void 0?void 0:o.startup)===null||a===void 0?void 0:a.promise}).then(()=>{var o;if(!(!((o=t.MathJax)===null||o===void 0)&&o.tex2svg))throw new Error("MathJax did not initialize");return t.MathJax}))}i(d,"loadMathJax");function g(e,r){return d(e).then(t=>{var o;const a=r.display==="block";(o=t.texReset)===null||o===void 0||o.call(t);const n=(r.format==="mathml"?t.mathml2svg(c(r.source,r.display),{display:a}):t.tex2svg(r.source,{display:a})).querySelector("svg");if(!n)throw new Error("MathJax did not return an SVG");const l=n.querySelector("[data-mjx-error]"),u=l?s(l,"data-mjx-error")||"Syntax error":void 0;return s(n,{role:"img","aria-label":r.source,focusable:null}),{svg:n.outerHTML,error:u}})}i(g,"renderMath");export{d as loadMathJax,g as renderMath};

package/esm/plugins/math/ui/editor/editor.d.ts

@@ -0,0 +1,56 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+import type { IJodit } from "jodit/esm/types/index";
+import type { IMathData } from "../../interface";
+import { UIElement } from "jodit/esm/core/ui/index";
+interface IMathEditorOptions {
+    onSubmit: () => void;
+    onChange: (data: IMathData) => void;
+}
+/**
+ * Dialog body of the equation editor: format tabs, a symbol palette, the
+ * source textarea and a live preview rendered by MathJax.
+ */
+export declare class UIMathEditor extends UIElement<IJodit> {
+    private readonly handlers;
+    className(): string;
+    state: IMathData;
+    private tabs;
+    private source;
+    private templates;
+    private colorInputs;
+    private alignButtons;
+    private alignBox;
+    private wrapButton;
+    private drafts;
+    private renderId;
+    protected render(): string;
+    constructor(jodit: IJodit, handlers: IMathEditorOptions);
+    /**
+     * Color swatches and the alignment switch shown in the preview corner.
+     */
+    private buildAppearance;
+    private colorField;
+    /**
+     * Mirrors the appearance part of the state into the controls.
+     */
+    private syncAppearance;
+    /**
+     * Loads a copy of the data into the form and renders the preview.
+     */
+    setData(data: IMathData): void;
+    getData(): IMathData;
+    focus(): void;
+    private setFormat;
+    /**
+     * Replaces the source with a predefined formula in the active format.
+     */
+    private applyTemplate;
+    private insertSymbol;
+    private refresh;
+    private __render;
+}
+export {};

package/esm/plugins/math/ui/editor/editor.js

@@ -0,0 +1,16 @@
+var b=Object.defineProperty;var u=(h,t)=>b(h,"name",{value:t,configurable:!0});var o,g=function(h,t,e,s){var n=arguments.length,i=n<3?t:s===null?s=Object.getOwnPropertyDescriptor(t,e):s,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(h,t,e,s);else for(var a=h.length-1;a>=0;a--)(l=h[a])&&(i=(n<3?l(i):n>3?l(t,e,i):l(t,e))||i);return n>3&&i&&Object.defineProperty(t,e,i),i};import{FORMAT_TITLES as v,mathStyle as x}from"../../helpers.js";import{renderMath as y}from"../../mathjax.js";import{component as E,debounce as w}from"jodit/esm/core/decorators/index.js";import{assert as c}from"jodit/esm/core/helpers/utils/assert.js";import{attr as p}from"jodit/esm/core/helpers/utils/attr.js";import{Button as d,UIElement as C,UISelect as B,UITextArea as A}from"jodit/esm/core/ui/index.js";const f=["latex","mathml"],_={latex:"e.g. x^2 + y^2 = r^2",mathml:"e.g. <msup><mi>x</mi><mn>2</mn></msup>"};let m=(o=class extends C{className(){return"UIMathEditor"}render(){return`<div>
+			<div class="&__head">
+				<div class="&__tabs"></div>
+				<div class="&__templates"></div>
+			</div>
+			<div class="&__symbols"></div>
+			<div class="&__source"></div>
+			<div class="&__preview-title">~Preview~</div>
+			<div class="&__preview">
+				<div class="&__appearance"></div>
+				<div class="&__canvas">
+					<span class="&__placeholder">~Your equation will render here~</span>
+				</div>
+			</div>
+			<div class="&__error"></div>
+		</div>`}constructor(t,e){super(t),this.handlers=e,this.tabs={},this.templates=null,this.colorInputs={},this.alignButtons={},this.alignBox=null,this.wrapButton=null,this.drafts={latex:"",mathml:""},this.renderId=0;const s=this.getElm("tabs");c(s!=null,"tabs element does not exist"),f.forEach(a=>{const r=d(t,"",v[a]).onAction(()=>this.setFormat(a));p(r.container,"data-format",a),this.tabs[a]=r,s.appendChild(r.container)});const n=this.getElm("templates");c(n!=null,"templates element does not exist"),t.o.math.templates.length&&(this.templates=new B(t,{name:"template",options:[{value:"",text:t.i18n("Templates")},...t.o.math.templates.map((a,r)=>({value:String(r),text:t.i18n(a.title)}))],onChange:u(a=>this.applyTemplate(a),"onChange")}),n.appendChild(this.templates.container));const i=this.getElm("symbols");c(i!=null,"symbols element does not exist"),t.o.math.symbols.forEach(a=>{const r=d(t,"",a.label).onAction(()=>this.insertSymbol(this.state.format==="mathml"?a.mathml:a.latex));r.container.classList.add(this.getFullElName("symbol")),p(r.container,"title",a.latex),i.appendChild(r.container)}),this.source=new A(t,{name:"source",label:v.latex,placeholder:_.latex,resizable:!0,size:4,onChange:u(a=>{this.state.source=a,this.drafts[this.state.format]=a,this.handlers.onChange(this.getData()),this.refresh()},"onChange")}),t.e.on(this.source.nativeInput,"keydown",a=>{a.key==="Enter"&&(a.ctrlKey||a.metaKey)&&(a.preventDefault(),this.handlers.onSubmit())});const l=this.getElm("source");c(l!=null,"source element does not exist"),l.appendChild(this.source.container),this.buildAppearance()}buildAppearance(){const{j:t}=this,{math:e}=t.o,s=this.getElm("appearance");c(s!=null,"appearance element does not exist"),[["background","Background",e.allowChangeBackground],["textColor","Text",e.allowChangeTextColor],["borderColor","Border",e.allowChangeBorderColor]].forEach(([i,l,a])=>{a&&s.appendChild(this.colorField(i,l))}),e.allowChangeAlign&&(this.alignBox=t.c.div(this.getFullElName("align")),["left","center","right"].forEach(i=>{var l;const a=d(t,i,"","initial").onAction(()=>{this.state.align=i,this.syncAppearance(),this.__render()});p(a.container,"data-align",i),this.alignButtons[i]=a,(l=this.alignBox)===null||l===void 0||l.appendChild(a.container)}),e.allowChangeWrap&&(this.wrapButton=d(t,"","Wrap text","initial").onAction(()=>{this.state.wrap=!this.state.wrap,this.syncAppearance(),this.__render()}),p(this.wrapButton.container,"name","wrap"),this.alignBox.appendChild(this.wrapButton.container)),s.appendChild(this.alignBox)),s.childNodes.length||s.remove()}colorField(t,e){const{j:s}=this,n=s.c.element("input",{type:"color",name:t,class:this.getFullElName("color-input")});s.e.on(n,"input",()=>{this.state[t]=n.value,this.syncAppearance(),this.__render()});const i=s.c.element("button",{type:"button",name:`${t}Reset`,title:s.i18n("None"),class:this.getFullElName("color-reset")});return i.textContent="\xD7",s.e.on(i,"click",()=>{this.state[t]="",this.syncAppearance(),this.__render()}),this.colorInputs[t]=n,s.c.element("label",{class:this.getFullElName("color-field")},[n,s.c.span(this.getFullElName("color-label"),s.i18n(e)),i])}syncAppearance(){if(Object.keys(this.colorInputs).forEach(t=>{const e=this.colorInputs[t];if(!e)return;const s=this.state[t]||"";e.classList.toggle(this.getFullElName("color-input","empty"),!s),s&&(e.value=s)}),Object.keys(this.alignButtons).forEach(t=>{var e;(e=this.alignButtons[t])===null||e===void 0||e.setState({variant:this.state.align===t?"primary":"initial"})}),this.alignBox&&(this.alignBox.style.display=this.state.display==="block"?"":"none"),this.wrapButton){const t=this.state.align!=="center";this.wrapButton.container.style.display=t?"":"none",this.wrapButton.setState({variant:this.state.wrap&&t?"primary":"initial"})}}setData(t){this.state={...t},this.drafts={latex:"",mathml:""},this.drafts[t.format]=t.source,this.syncAppearance(),this.setFormat(t.format)}getData(){return{...this.state,source:this.state.source.trim()}}focus(){this.source.focus()}setFormat(t){this.state.format=t,this.state.source=this.drafts[t],f.forEach(e=>{var s,n;(s=this.tabs[e])===null||s===void 0||s.setMod("active",e===t),(n=this.tabs[e])===null||n===void 0||n.setState({variant:e===t?"primary":"initial"})}),this.source.state.label=v[t],this.source.state.placeholder=_[t],this.source.value=this.state.source,this.handlers.onChange(this.getData()),this.__render()}applyTemplate(t){const e=this.j.o.math.templates[Number(t)];t===""||!e||!this.templates||(this.source.value=this.state.format==="mathml"?e.mathml:e.latex,this.templates.value="",this.source.focus())}insertSymbol(t){var e,s;const n=this.source.nativeInput,i=(e=n.selectionStart)!==null&&e!==void 0?e:n.value.length,l=(s=n.selectionEnd)!==null&&s!==void 0?s:i;n.setRangeText(t,i,l,"end"),n.focus(),this.j.e.fire(n,"input")}refresh(){this.__render()}__render(){const t=this.getElm("canvas"),e=this.getElm("error"),s=this.getData(),n=++this.renderId;if(!(!t||!e)){if(e.textContent="",p(t,"style",x(s)||null),!s.source){t.innerHTML=`<span class="${this.getFullElName("placeholder")}">${this.j.i18n("Your equation will render here")}</span>`;return}y(this.j,s).then(i=>{var l;n===this.renderId&&(t.innerHTML=i.svg,e.textContent=(l=i.error)!==null&&l!==void 0?l:"")}).catch(i=>{n===this.renderId&&(e.textContent=i.message)})}}},u(o,"UIMathEditor"),o);g([w(300)],m.prototype,"refresh",null),m=g([E],m);export{m as UIMathEditor};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "jodit-pro",
-	"version": "4.18.7",
+	"version": "4.18.9",
 	"author": "Chupurnov Valerii <chupurnov@gmail.com>",
 	"homepage": "https://xdsoft.net/jodit/pro/",
 	"bugs": {

package/types/config.d.ts

@@ -21,6 +21,11 @@ import type { IJodit } from "jodit/esm/types/index";
 import type { IKeys } from "./plugins/keyboard/interface";
 import type { ButtonGroup } from "jodit/esm/types/index";
 import type { ILayoutKeys } from "./plugins/keyboard/interface";
+import type { MathFormat } from "./plugins/math/interface";
+import type { MathDisplay } from "./plugins/math/interface";
+import type { MathAlign } from "./plugins/math/interface";
+import type { IMathSymbol } from "./plugins/math/interface";
+import type { IMathTemplate } from "./plugins/math/interface";
 import type { CanPromise } from "jodit/esm/types/index";
 import type { IUIOption } from "jodit/esm/types/index";
 import type { IStyleDefinition } from "./plugins/style/interface";
@@ -199,6 +204,31 @@ interface Config {
         periodKeyRepeat: number;
     };
 }
+interface Config {
+    math: {
+        className: string;
+        mathJaxUrl: string;
+        defaultFormat: MathFormat;
+        defaultDisplay: MathDisplay;
+        defaultBackground: string;
+        defaultTextColor: string;
+        defaultBorderColor: string;
+        defaultAlign: MathAlign;
+        defaultWrap: boolean;
+        allowChangeBackground: boolean;
+        allowChangeTextColor: boolean;
+        allowChangeBorderColor: boolean;
+        allowChangeAlign: boolean;
+        allowChangeWrap: boolean;
+        symbols: IMathSymbol[];
+        templates: IMathTemplate[];
+        popup: Array<IControlType | string>;
+        dialog: {
+            width: number;
+            height: number;
+        };
+    };
+}
 interface Config {
     mobileView: {
         mode: string | number;

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

@@ -0,0 +1,34 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+import type { IControlType } from "jodit/esm/types/index";
+import type { IMathSymbol, IMathTemplate, MathAlign, MathDisplay, MathFormat } from "./interface";
+declare module 'jodit/esm/config' {
+    interface Config {
+        math: {
+            className: string;
+            mathJaxUrl: string;
+            defaultFormat: MathFormat;
+            defaultDisplay: MathDisplay;
+            defaultBackground: string;
+            defaultTextColor: string;
+            defaultBorderColor: string;
+            defaultAlign: MathAlign;
+            defaultWrap: boolean;
+            allowChangeBackground: boolean;
+            allowChangeTextColor: boolean;
+            allowChangeBorderColor: boolean;
+            allowChangeAlign: boolean;
+            allowChangeWrap: boolean;
+            symbols: IMathSymbol[];
+            templates: IMathTemplate[];
+            popup: Array<IControlType | string>;
+            dialog: {
+                width: number;
+                height: number;
+            };
+        };
+    }
+}

package/types/plugins/math/helpers.d.ts

@@ -0,0 +1,33 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+import type { IJodit, Nullable } from "jodit/esm/types/index";
+import type { IMathData, MathAlign, MathDisplay, MathFormat } from "./interface";
+export declare const MATH_ATTR = "data-jodit-math";
+export declare const MATHML_NS = "http://www.w3.org/1998/Math/MathML";
+export declare const FORMAT_TITLES: Record<MathFormat, string>;
+export declare function isMathFormat(value: unknown): value is MathFormat;
+export declare function isMathDisplay(value: unknown): value is MathDisplay;
+export declare function isMathAlign(value: unknown): value is MathAlign;
+export declare function normalizeMathData(raw: Partial<IMathData>, defaults: IMathData): IMathData;
+export declare function defaultMathData(jodit: IJodit, display?: MathDisplay): IMathData;
+/**
+ * Inline style of the formula element: colors and alignment live on the
+ * element itself so they survive outside the editor. The SVG uses
+ * `currentColor`, so `color` paints the formula.
+ */
+export declare function mathStyle(data: IMathData): string;
+/**
+ * MathJax expects a `<math>` root; bare MathML children are wrapped into one.
+ */
+export declare function wrapMathML(source: string, display: MathDisplay): string;
+export declare function isMathElement(node: Nullable<Node>, className: string): node is HTMLElement;
+export declare function findMath(jodit: IJodit, node: Nullable<Node>): Nullable<HTMLElement>;
+export declare function readMathData(jodit: IJodit, element: HTMLElement): Nullable<IMathData>;
+export declare function decorateMath(jodit: IJodit, element: HTMLElement): void;
+export declare function applyMathData(jodit: IJodit, element: HTMLElement, data: IMathData, svg: string): void;
+export declare function pixels(value: string): number;
+export declare function mathTag(display: MathDisplay): 'figure' | 'span';
+export declare function createMath(jodit: IJodit, data: IMathData, svg: string): HTMLElement;

package/types/plugins/math/interface.d.ts

@@ -0,0 +1,45 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+export type MathFormat = 'latex' | 'mathml';
+export type MathDisplay = 'block' | 'inline';
+export type MathAlign = 'left' | 'center' | 'right';
+export interface IMathData {
+    format: MathFormat;
+    display: MathDisplay;
+    source: string;
+    background?: string;
+    textColor?: string;
+    borderColor?: string;
+    align?: MathAlign;
+    wrap?: boolean;
+    width?: number;
+}
+export interface IMathSymbol {
+    label: string;
+    latex: string;
+    mathml: string;
+}
+export interface IMathTemplate {
+    title: string;
+    latex: string;
+    mathml: string;
+}
+export interface IMathRenderResult {
+    svg: string;
+    error?: string;
+}
+export interface IMathJax {
+    tex2svg(tex: string, options?: {
+        display?: boolean;
+    }): HTMLElement;
+    mathml2svg(mml: string, options?: {
+        display?: boolean;
+    }): HTMLElement;
+    startup: {
+        promise: Promise<unknown>;
+    };
+    texReset?: () => void;
+}

package/types/plugins/math/math.d.ts

@@ -0,0 +1,66 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+import type { IJodit, Nullable } from "jodit/esm/types/index";
+import "./config";
+import { Plugin } from "jodit/esm/core/plugin/index";
+/**
+ * Inserts LaTeX / MathML formulas rendered by MathJax as standalone SVG,
+ * either as a block or inline, and lets the user edit or remove them.
+ */
+export declare class MathPlugin extends Plugin {
+    static requires: string[];
+    buttons: Plugin['buttons'];
+    private __dialog;
+    private __editor;
+    private __saveButton;
+    private __popup;
+    private __toolbar;
+    private __target;
+    protected afterInit(jodit: IJodit): void;
+    protected beforeDestruct(): void;
+    /**
+     * Opens the editor dialog for a new formula or for an existing one.
+     */
+    openEditor(target?: Nullable<Node>, display?: unknown): void;
+    /**
+     * Removes the formula that owns the given node.
+     */
+    removeMath(target?: Nullable<Node>): void;
+    private __submit;
+    private __save;
+    /**
+     * A block formula must not stay inside a paragraph, an inline one is
+     * inserted at the caret.
+     */
+    private __insert;
+    private __getDialog;
+    protected onClick(e: MouseEvent): void;
+    protected onDblClick(e: MouseEvent): void;
+    protected onOutsideClick(): void;
+    /**
+     * Shows the contextual popup (edit / delete) at the formula.
+     */
+    openPopup(element: HTMLElement): void;
+    closePopup(): void;
+    /**
+     * An inline formula that carries data but no SVG is an empty `<span>`,
+     * which the core cleaner drops before MathJax can fill it. The source is
+     * written into such elements as a placeholder; the render replaces it.
+     */
+    protected onBeforeSetValue(value: unknown): string | void;
+    /**
+     * Decorates formulas that arrived with the value and renders the ones
+     * that carry data but no SVG yet.
+     */
+    protected onChange(): void;
+    private __decorateAll;
+    /**
+     * The core resizer sets a pixel box on the figure; the width goes into
+     * the data and the explicit height is dropped so the SVG keeps its ratio.
+     */
+    private __syncResized;
+    private __renderMissing;
+}

package/types/plugins/math/mathjax.d.ts

@@ -0,0 +1,17 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+import type { IJodit } from "jodit/esm/types/index";
+import type { IMathData, IMathJax, IMathRenderResult } from "./interface";
+/**
+ * Resolves the MathJax instance of the owner window, loading it from
+ * `math.mathJaxUrl` on first use. A MathJax that the host page already
+ * loaded is reused as is.
+ */
+export declare function loadMathJax(jodit: IJodit): Promise<IMathJax>;
+/**
+ * Renders the formula to a standalone SVG string.
+ */
+export declare function renderMath(jodit: IJodit, data: IMathData): Promise<IMathRenderResult>;

package/types/plugins/math/ui/editor/editor.d.ts

@@ -0,0 +1,56 @@
+/*!
+ * Jodit Editor PRO (https://xdsoft.net/jodit/)
+ * See LICENSE.md in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net/jodit/pro/
+ */
+import type { IJodit } from "jodit/esm/types/index";
+import type { IMathData } from "../../interface";
+import { UIElement } from "jodit/esm/core/ui/index";
+interface IMathEditorOptions {
+    onSubmit: () => void;
+    onChange: (data: IMathData) => void;
+}
+/**
+ * Dialog body of the equation editor: format tabs, a symbol palette, the
+ * source textarea and a live preview rendered by MathJax.
+ */
+export declare class UIMathEditor extends UIElement<IJodit> {
+    private readonly handlers;
+    className(): string;
+    state: IMathData;
+    private tabs;
+    private source;
+    private templates;
+    private colorInputs;
+    private alignButtons;
+    private alignBox;
+    private wrapButton;
+    private drafts;
+    private renderId;
+    protected render(): string;
+    constructor(jodit: IJodit, handlers: IMathEditorOptions);
+    /**
+     * Color swatches and the alignment switch shown in the preview corner.
+     */
+    private buildAppearance;
+    private colorField;
+    /**
+     * Mirrors the appearance part of the state into the controls.
+     */
+    private syncAppearance;
+    /**
+     * Loads a copy of the data into the form and renders the preview.
+     */
+    setData(data: IMathData): void;
+    getData(): IMathData;
+    focus(): void;
+    private setFormat;
+    /**
+     * Replaces the source with a predefined formula in the active format.
+     */
+    private applyTemplate;
+    private insertSymbol;
+    private refresh;
+    private __render;
+}
+export {};