jodit-pro-react 5.4.14 → 5.4.16

package/build/jodit-react.js.LICENSE.txt

@@ -4,12 +4,6 @@
  * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
  */
 
-/*!
- * 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/
- */
-
 /*!
  * a-color-picker
  * https://github.com/narsenico/a-color-picker
@@ -38,13 +32,3 @@
  * Copyright (c) 2014-2017, Jon Schlinkert.
  * Released under the MIT License.
  */
-
-/**
- * @license React
- * react-jsx-runtime.production.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */

package/build/types/JoditEditor.d.ts

@@ -0,0 +1,17 @@
+import type { DeepPartial } from 'jodit/esm/types';
+import { type Config, Jodit as JoditBaseConstructor } from './include.jodit';
+import React from 'react';
+export interface JoditEditorProps<T extends typeof JoditBaseConstructor = typeof JoditBaseConstructor> {
+    JoditConstructor?: T;
+    config?: DeepPartial<Config>;
+    className?: string;
+    id?: string;
+    name?: string;
+    onBlur?: (value: string, event: MouseEvent) => void;
+    onChange?: (value: string) => void;
+    tabIndex?: number;
+    value?: string;
+    editorRef?: (editor: JoditBaseConstructor) => void;
+}
+declare const JoditEditor: React.ForwardRefExoticComponent<JoditEditorProps<typeof JoditBaseConstructor> & React.RefAttributes<JoditBaseConstructor>>;
+export default JoditEditor;

package/build/types/JoditEditor.js

@@ -0,0 +1,101 @@
+import { Jodit as JoditBaseConstructor } from './include.jodit';
+import React, { forwardRef, useEffect, useRef } from 'react';
+function usePrevious(value) {
+    const ref = useRef('');
+    useEffect(() => {
+        ref.current = value;
+    }, [value]);
+    return ref.current;
+}
+const JoditEditor = forwardRef(({ JoditConstructor = JoditBaseConstructor, className, config, id, name, onBlur, onChange, tabIndex, value, editorRef }, ref) => {
+    const textAreaRef = useRef(null);
+    const joditRef = useRef(null);
+    useEffect(() => {
+        const element = textAreaRef.current;
+        const jodit = JoditConstructor.make(element, config);
+        joditRef.current = jodit;
+        if (typeof editorRef === 'function') {
+            editorRef(jodit);
+        }
+        return () => {
+            if (jodit.isReady) {
+                jodit.destruct();
+            }
+            else {
+                jodit
+                    .waitForReady()
+                    .then((joditInstance) => joditInstance.destruct());
+            }
+        };
+    }, [JoditConstructor, config, editorRef]);
+    useEffect(() => {
+        if (ref) {
+            if (typeof ref === 'function') {
+                ref(joditRef.current);
+            }
+            else {
+                ref.current = joditRef.current;
+            }
+        }
+    }, [textAreaRef, ref, joditRef]);
+    const preClassName = usePrevious(className ?? '');
+    useEffect(() => {
+        const classList = joditRef.current?.container?.classList;
+        if (preClassName !== className &&
+            typeof preClassName === 'string') {
+            preClassName
+                .split(/\s+/)
+                .filter(Boolean)
+                .forEach((cl) => classList?.remove(cl));
+        }
+        if (className && typeof className === 'string') {
+            className
+                .split(/\s+/)
+                .filter(Boolean)
+                .forEach((cl) => classList?.add(cl));
+        }
+    }, [className, preClassName]);
+    useEffect(() => {
+        if (joditRef.current?.workplace) {
+            joditRef.current.workplace.tabIndex = tabIndex || -1;
+        }
+    }, [tabIndex]);
+    useEffect(() => {
+        const jodit = joditRef.current;
+        if (!jodit?.events || !(onBlur || onChange)) {
+            return;
+        }
+        const onBlurHandler = (event) => onBlur && onBlur(joditRef?.current?.value ?? '', event);
+        const onChangeHandler = (value) => onChange && onChange(value);
+        // adding event handlers
+        jodit.events
+            .on('blur', onBlurHandler)
+            .on('change', onChangeHandler);
+        return () => {
+            // Remove event handlers
+            jodit.events
+                ?.off('blur', onBlurHandler)
+                .off('change', onChangeHandler);
+        };
+    }, [onBlur, onChange]);
+    useEffect(() => {
+        const jodit = joditRef.current;
+        const updateValue = () => {
+            if (jodit && value !== undefined && jodit.value !== value) {
+                jodit.value = value;
+            }
+        };
+        if (jodit) {
+            if (jodit.isReady) {
+                updateValue();
+            }
+            else {
+                jodit.waitForReady().then(updateValue);
+            }
+        }
+    }, [value]);
+    return (React.createElement("div", { className: 'jodit-react-container' },
+        React.createElement("textarea", { defaultValue: value, name: name, id: id, ref: textAreaRef })));
+});
+JoditEditor.displayName = 'JoditEditor';
+export default JoditEditor;

package/build/types/include.jodit.d.ts

@@ -1,4 +1,5 @@
-import 'jodit-pro/esm/plugins/all';
+import 'jodit-pro/esm/plugins/all.js';
 
-import { Jodit as JoditConstructor } from 'jodit-pro/esm/index';
-export declare const Jodit: typeof JoditConstructor;
+import { Jodit as JoditConstructor } from 'jodit-pro/esm/index.js';
+export { Config } from 'jodit-pro/esm/config';
+export { JoditConstructor as Jodit };

package/build/types/include.jodit.js

@@ -1,4 +1,4 @@
-import 'jodit-pro/esm/plugins/all';
+import 'jodit-pro/esm/plugins/all.js';
 import 'jodit-pro/es2021/jodit.fat.min.css';
-import { Jodit as JoditConstructor } from 'jodit-pro/esm/index';
-export const Jodit = JoditConstructor;
+import { Jodit as JoditConstructor } from 'jodit-pro/esm/index.js';
+export { JoditConstructor as Jodit };

package/build/types/index.d.ts

@@ -1,9 +1,5 @@
-/*!
- * 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 { Jodit } from './include.jodit';
-import JoditEditor from 'jodit-react/build/types/JoditEditor';
+import { Config, Jodit } from './include.jodit';
+import JoditEditor from './JoditEditor';
 export default JoditEditor;
-export { Jodit };
+export { Config, Jodit };
+export type { JoditEditorProps } from './JoditEditor';

package/build/types/index.js

@@ -1,9 +1,4 @@
-/*!
- * 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 { Jodit } from './include.jodit';
-import JoditEditor from 'jodit-react/build/types/JoditEditor';
+import JoditEditor from './JoditEditor';
 export default JoditEditor;
 export { Jodit };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "jodit-pro-react",
-	"version": "5.4.14",
+	"version": "5.4.16",
 	"description": "Jodit PRO is awesome and usefully wysiwyg editor with filebrowser",
 	"main": "build/jodit-react.js",
 	"module": "./build/esm/index.mjs",
@@ -53,6 +53,7 @@
 	},
 	"devDependencies": {
 		"@swc-node/register": "^1.10.9",
+		"@types/react": "^19.2.10",
 		"cross-env": "^10.1.0",
 		"css-loader": "^7.1.2",
 		"html-webpack-plugin": "^5.6.3",