tp-react-elements-dev 1.7.1 → 1.7.3

package/dist/index.esm.js

@@ -52349,25 +52349,59 @@ var JoditEditor = /*@__PURE__*/getDefaultExportFromCjs(joditReactExports);
 const RichTextEditor = ({ props }) => {
     const editor = useRef(null);
     const [content, setContent] = useState("");
+    const value = props.getValues(props.item.name);
     const config = Object.assign({ readonly: false, placeholder: "Start typing...", removeButtons: props.item.removeButtons, style: {
-            'font-family': 'Arial', // Default font is Arial
+            "font-family": "Arial",
         }, controls: {
             font: {
                 list: {
-                    Arial: 'Arial',
-                    'Rotis Semi Sans': 'Rotis Semi Sans', // Allow Rotis Semi Sans
+                    Arial: "Arial",
+                    "Rotis Semi Sans": "Rotis Semi Sans",
                 },
             },
             fontsize: {
-                list: joditReactExports.Jodit.atom([8, 9, 10, 11])
-            }
-        }, defaultFont: 'Arial', defaultFontSize: '11px' }, props.item.sx);
-    // [placeholder]
-    // );
+                list: joditReactExports.Jodit.atom([8, 9, 10, 11]),
+            },
+        }, defaultFont: "Arial", defaultFontSize: "11px", askBeforePasteFromWord: false, askBeforePasteHTML: false, hotkeys: {
+            redo: "ctrl+z",
+            undo: "ctrl+y,ctrl+shift+z",
+            indent: "ctrl+]",
+            outdent: "ctrl+[",
+            bold: "ctrl+b",
+            italic: "ctrl+i",
+            removeFormat: "ctrl+shift+m",
+            insertOrderedList: "ctrl+shift+7",
+            insertUnorderedList: "ctrl+shift+8",
+            openSearchDialog: "ctrl+f",
+            openReplaceDialog: "ctrl+r",
+        }, events: {
+            processPaste: (event, html) => {
+                if (editor.current && editor.current.editor) {
+                    const joditEditor = editor.current.editor;
+                    joditEditor.selection.insertHTML(html);
+                    joditEditor.tempContent = joditEditor.getHTML(); // Correct method
+                }
+            },
+            afterPaste: (event) => {
+                if (editor.current && editor.current.editor) {
+                    const joditEditor = editor.current.editor;
+                    const el = document.createElement("div");
+                    el.innerHTML = joditEditor.tempContent
+                        ? joditEditor.tempContent
+                        : joditEditor.getHTML(); // Correct method
+                    joditEditor.setHTML(el.innerHTML); // Correct method
+                    joditEditor.tempContent = null;
+                }
+            },
+        } }, props.item.sx);
+    // Update content when props value changes
+    useEffect(() => {
+        setContent(value);
+    }, [value]);
     const handleBlur = (newContent) => {
         if (newContent === "<p><br></p>") {
             setContent(newContent);
-            props.setValue(props.item.name, '');
+            props.setValue(props.item.name, "");
         }
         else {
             setContent(newContent);
@@ -52376,7 +52410,7 @@ const RichTextEditor = ({ props }) => {
         props.item.onBlurFn && props.item.onBlurFn(newContent);
     };
     const handleChange = (newContent) => {
-        console.log(newContent, 'newContent Editor');
+        console.log(newContent, "newContent Editor");
     };
     return (jsxRuntimeExports.jsx(JoditEditor, { ref: editor, value: content, config: config, tabIndex: 1, onBlur: handleBlur, onChange: handleChange }));
 };