jodit-pro 4.18.2 → 4.18.6

package/types/config.d.ts

@@ -3,6 +3,9 @@ import type { AutoCompleteDisplayMode } from "./plugins/autocomplete/interface";
 import type { IAutoCompleteItem } from "./plugins/autocomplete/interface";
 import type { AutoCompleteSource } from "./plugins/autocomplete/interface";
 import type { ISnapshotStorage } from "./plugins/backup/interface";
+import type { ChartType } from "./plugins/chart/interface";
+import type { IChartPoint } from "./plugins/chart/interface";
+import type { IControlType } from "jodit/esm/types/index";
 import type { IEmojiData } from "./plugins/emoji/interface";
 import type { AjaxOptions } from "jodit/esm/types/index";
 import type { DeepPartial } from "jodit/esm/types/index";
@@ -20,7 +23,6 @@ import type { ButtonGroup } from "jodit/esm/types/index";
 import type { ILayoutKeys } from "./plugins/keyboard/interface";
 import type { CanPromise } from "jodit/esm/types/index";
 import type { IUIOption } from "jodit/esm/types/index";
-import type { IControlType } from "jodit/esm/types/index";
 import type { IStyleDefinition } from "./plugins/style/interface";
 import type { ITemplateDefinition } from "./plugins/templates/interface";
 import type { ITranslateProviderFactory } from "./plugins/translate/interface";
@@ -58,6 +60,30 @@ interface Config {
         formatDate?: (timestamp: string | Date) => string;
     };
 }
+interface Config {
+    chart: {
+        className: string;
+        types: ChartType[];
+        defaultType: ChartType;
+        defaultTitle: string;
+        defaultPoints: IChartPoint[];
+        colors: string[];
+        defaultBackground: string;
+        defaultTextColor: string;
+        defaultBorderColor: string;
+        allowChangeBackground: boolean;
+        allowChangeTextColor: boolean;
+        allowChangeBorderColor: boolean;
+        fontFamily: string;
+        width: number;
+        height: number;
+        popup: Array<IControlType | string>;
+        dialog: {
+            width: number;
+            height: number;
+        };
+    };
+}
 interface Config {
     emoji: {
         data: () => Promise<IEmojiData>;

package/types/plugins/chart/chart.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, Nullable } from "jodit/esm/types/index";
+import "./config";
+import { Plugin } from "jodit/esm/core/plugin/index";
+/**
+ * Inserts self-contained SVG charts (bar, horizontal bar, line, pie, donut)
+ * and lets the user edit them in a dialog or remove them from a popup.
+ */
+export declare class Chart extends Plugin {
+    static requires: string[];
+    buttons: Plugin['buttons'];
+    private __dialog;
+    private __editor;
+    private __popup;
+    private __toolbar;
+    private __target;
+    protected afterInit(jodit: IJodit): void;
+    protected beforeDestruct(): void;
+    /**
+     * Opens the editor dialog for a new chart or for an existing one.
+     */
+    openEditor(target?: Nullable<Node>): void;
+    /**
+     * Removes the chart that owns the given node.
+     */
+    removeChart(target?: Nullable<Node>): void;
+    private __save;
+    private __getDialog;
+    /**
+     * Handler: clicking a chart opens its popup; clicking elsewhere closes it.
+     */
+    protected onClick(e: MouseEvent): void;
+    protected onDblClick(e: MouseEvent): void;
+    protected onOutsideClick(): void;
+    /**
+     * Shows the contextual popup (edit / delete) above the chart.
+     */
+    openPopup(figure: HTMLElement): void;
+    closePopup(): void;
+    /**
+     * Decorates charts that arrived with the value (initial load, paste) and
+     * re-renders charts whose box was changed by the resizer.
+     */
+    protected onChange(): void;
+    private __decorateAll;
+    /**
+     * A figure that carries data but no SVG (e.g. content produced by a
+     * backend) is rendered on load.
+     */
+    private __renderMissing;
+    private __syncResized;
+}

package/types/plugins/chart/config.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 { IControlType } from "jodit/esm/types/index";
+import type { ChartType, IChartPoint } from "./interface";
+declare module 'jodit/esm/config' {
+    interface Config {
+        chart: {
+            className: string;
+            types: ChartType[];
+            defaultType: ChartType;
+            defaultTitle: string;
+            defaultPoints: IChartPoint[];
+            colors: string[];
+            defaultBackground: string;
+            defaultTextColor: string;
+            defaultBorderColor: string;
+            allowChangeBackground: boolean;
+            allowChangeTextColor: boolean;
+            allowChangeBorderColor: boolean;
+            fontFamily: string;
+            width: number;
+            height: number;
+            popup: Array<IControlType | string>;
+            dialog: {
+                width: number;
+                height: number;
+            };
+        };
+    }
+}

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

@@ -0,0 +1,22 @@
+/*!
+ * 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 { ChartType, IChartData, IChartPoint } from "./interface";
+export declare const CHART_ATTR = "data-jodit-chart";
+export declare const CHART_TYPES: ChartType[];
+export declare const CHART_TYPE_TITLES: Record<ChartType, string>;
+export declare function isChartType(value: unknown): value is ChartType;
+export declare function normalizePoint(raw: Partial<IChartPoint>): IChartPoint;
+export declare function normalizeChartData(raw: Partial<IChartData>, defaults: IChartData): IChartData;
+export declare function cloneChartData(data: IChartData): IChartData;
+export declare function isChartElement(node: Nullable<Node>, className: string): node is HTMLElement;
+export declare function findChart(jodit: IJodit, node: Nullable<Node>): Nullable<HTMLElement>;
+export declare function readChartData(jodit: IJodit, figure: HTMLElement): Nullable<IChartData>;
+export declare function defaultChartData(jodit: IJodit): IChartData;
+export declare function decorateChart(jodit: IJodit, figure: HTMLElement): void;
+export declare function applyChartData(jodit: IJodit, figure: HTMLElement, data: IChartData): void;
+export declare function createChart(jodit: IJodit, data: IChartData): HTMLElement;
+export declare function pixels(value: string): number;

package/types/plugins/chart/interface.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/
+ */
+export type ChartType = 'bar' | 'horizontalBar' | 'line' | 'area' | 'pie' | 'donut' | 'radar';
+export interface IChartPoint {
+    label: string;
+    value: number;
+    color?: string;
+}
+export interface IChartData {
+    type: ChartType;
+    title: string;
+    points: IChartPoint[];
+    width: number;
+    height: number;
+    background?: string;
+    textColor?: string;
+    borderColor?: string;
+}
+export interface IChartRenderOptions {
+    colors: string[];
+    fontFamily: string;
+}
+export interface IChartTheme {
+    surface: string;
+    transparent: boolean;
+    border: string;
+    grid: string;
+    ink: string;
+    inkMuted: string;
+    inkSecondary: string;
+}

package/types/plugins/chart/render/bar.d.ts

@@ -0,0 +1,8 @@
+/*!
+ * 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 { IChartData, IChartRenderOptions } from "../interface";
+export declare function renderBar(data: IChartData, options: IChartRenderOptions): string;
+export declare function renderHorizontalBar(data: IChartData, options: IChartRenderOptions): string;

package/types/plugins/chart/render/common.d.ts

@@ -0,0 +1,40 @@
+/*!
+ * 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 { IChartData, IChartPoint, IChartRenderOptions, IChartTheme } from "../interface";
+export declare const PAD = 24;
+export declare const TITLE_HEIGHT = 40;
+export declare const LABEL_FONT = 13;
+export declare const TICK_FONT = 12;
+export declare const TICK_COUNT = 4;
+export declare const BAR_RADIUS = 4;
+export declare const MAX_LABEL = 14;
+export declare const DEFAULT_BACKGROUND = "#ffffff";
+export declare const DEFAULT_TEXT_COLOR = "#111827";
+/**
+ * Colors derived from the chart background and text color so grids, axes and
+ * secondary labels stay readable on light and dark surfaces alike.
+ */
+export declare function chartTheme(data: IChartData): IChartTheme;
+export interface IPlotBox {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export declare function esc(value: string | number): string;
+export declare function num(value: number): string;
+export declare function formatValue(value: number): string;
+export declare function truncate(label: string, max?: number): string;
+export declare function pointColor(point: IChartPoint, index: number, options: IChartRenderOptions): string;
+export declare function niceStep(rawStep: number): number;
+export declare function ticks(points: IChartPoint[]): number[];
+export declare function textWidth(text: string, fontSize: number): number;
+export declare function plotBox(data: IChartData, margin: IPlotBox): IPlotBox;
+export declare function svgOpen(data: IChartData, options: IChartRenderOptions): string;
+export declare function svgClose(): string;
+export declare function renderTitle(data: IChartData, theme: IChartTheme): string;
+export declare function roundedBarPath(x: number, y: number, width: number, height: number, radius: number, side: 'top' | 'right'): string;
+export declare function valuePill(cx: number, cy: number, value: number, color: string, theme: IChartTheme): string;

package/types/plugins/chart/render/index.d.ts

@@ -0,0 +1,7 @@
+/*!
+ * 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 { IChartData, IChartRenderOptions } from "../interface";
+export declare function renderChart(data: IChartData, options: IChartRenderOptions): string;

package/types/plugins/chart/render/line.d.ts

@@ -0,0 +1,7 @@
+/*!
+ * 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 { IChartData, IChartRenderOptions } from "../interface";
+export declare function renderLine(data: IChartData, options: IChartRenderOptions, area: boolean): string;

package/types/plugins/chart/render/pie.d.ts

@@ -0,0 +1,7 @@
+/*!
+ * 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 { IChartData, IChartRenderOptions } from "../interface";
+export declare function renderPie(data: IChartData, options: IChartRenderOptions, donut: boolean): string;

package/types/plugins/chart/render/radar.d.ts

@@ -0,0 +1,7 @@
+/*!
+ * 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 { IChartData, IChartRenderOptions } from "../interface";
+export declare function renderRadar(data: IChartData, options: IChartRenderOptions): string;

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

@@ -0,0 +1,52 @@
+/*!
+ * 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 { IChartData } from "../../interface";
+import { UIElement } from "jodit/esm/core/ui/index";
+/**
+ * Dialog body of the chart editor: live preview, type/title fields and the
+ * editable list of data points.
+ */
+export declare class UIChartEditor extends UIElement<IJodit> {
+    className(): string;
+    state: IChartData;
+    private typeSelect;
+    private titleInput;
+    private addButton;
+    private backgroundInput;
+    private textColorInput;
+    private borderColorInput;
+    private transparentButton;
+    protected render(): string;
+    constructor(jodit: IJodit);
+    private syncTransparent;
+    private createColorInput;
+    private colorField;
+    /**
+     * Loads a copy of the data into the form.
+     */
+    setData(data: IChartData): void;
+    /**
+     * Returns a normalized copy of the edited data.
+     */
+    getData(): IChartData;
+    private addPoint;
+    private removePoint;
+    private rebuildPoints;
+    private createPointRow;
+    private __dragIndex;
+    /**
+     * Native drag and drop of a row. The grip is the draggable element so text
+     * selection inside the inputs keeps working.
+     */
+    private bindDragAndDrop;
+    /**
+     * Moves a point before or after another one and rebuilds the list.
+     */
+    movePoint(from: number, to: number, after: boolean): void;
+    private refresh;
+    private __render;
+}