@pareto-engineering/design-system 5.1.2 → 5.2.0

package/dist/cjs/f/fields/EditorInput/EditorInput.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var React = _react;
+var _lexical = require("lexical");
 var _formik = require("formik");
 var _LexicalComposer = require("@lexical/react/LexicalComposer");
 var _LexicalRichTextPlugin = require("@lexical/react/LexicalRichTextPlugin");
@@ -68,7 +69,8 @@ const EditorInput = _ref2 => {
     disabled,
     showDebugger,
     setEditorState,
-    setPlainTextKey
+    setPlainTextKey,
+    validate
     // ...otherProps
   } = _ref2;
   const [field,,] = (0, _formik.useField)(name);
@@ -115,6 +117,11 @@ const EditorInput = _ref2 => {
   };
   const onChange = state => {
     setFieldValue(name, JSON.stringify(state));
+    validate?.(state.read(() => {
+      const root = (0, _lexical.$getRoot)();
+      const textContent = root.getTextContent();
+      return textContent;
+    }));
   };
   const initialConfig = {
     nameSpace: name,

package/dist/cjs/f/fields/EditorInput/common/ExposePlainTextPlugin.js

@@ -18,6 +18,13 @@ const ExposePlainTextPlugin = _ref => {
     setPlainTextKey
   } = _ref;
   const [editor] = (0, _LexicalComposerContext.useLexicalComposerContext)();
+  (0, _react.useEffect)(() => {
+    editor.update(() => {
+      const root = (0, _lexical.$getRoot)();
+      const textContent = root.getTextContent();
+      setFieldValue(setPlainTextKey, textContent);
+    });
+  }, []);
   (0, _react.useEffect)(() => editor.registerUpdateListener(_ref2 => {
     let {
       editorState

package/dist/es/f/fields/EditorInput/EditorInput.js

@@ -2,6 +2,7 @@
 /* eslint-disable import/no-extraneous-dependencies -- required here */
 import * as React from 'react';
 import { memo, useEffect } from 'react';
+import { $getRoot } from 'lexical';
 import { useField, useFormikContext } from 'formik';
 import { LexicalComposer } from '@lexical/react/LexicalComposer';
 import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
@@ -57,7 +58,8 @@ const EditorInput = ({
   disabled,
   showDebugger,
   setEditorState,
-  setPlainTextKey
+  setPlainTextKey,
+  validate
   // ...otherProps
 }) => {
   const [field,,] = useField(name);
@@ -104,6 +106,11 @@ const EditorInput = ({
   };
   const onChange = state => {
     setFieldValue(name, JSON.stringify(state));
+    validate?.(state.read(() => {
+      const root = $getRoot();
+      const textContent = root.getTextContent();
+      return textContent;
+    }));
   };
   const initialConfig = {
     nameSpace: name,

package/dist/es/f/fields/EditorInput/common/ExposePlainTextPlugin.js

@@ -11,6 +11,13 @@ const ExposePlainTextPlugin = ({
   setPlainTextKey
 }) => {
   const [editor] = useLexicalComposerContext();
+  useEffect(() => {
+    editor.update(() => {
+      const root = $getRoot();
+      const textContent = root.getTextContent();
+      setFieldValue(setPlainTextKey, textContent);
+    });
+  }, []);
   useEffect(() => editor.registerUpdateListener(({
     editorState
   }) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pareto-engineering/design-system",
-  "version": "5.1.2",
+  "version": "5.2.0",
   "description": "",
   "main": "dist/cjs/index.js",
   "module": "dist/es/index.js",
@@ -87,5 +87,5 @@
     "remark-math": "^6.0.0"
   },
   "browserslist": "> 2%",
-  "gitHead": "4a9a1e6c37055bd9aba28e04c9d5a4dcc7dd7d93"
+  "gitHead": "2f0f3c933a23635520aebf9b3bb932a4063c432e"
 }

package/src/ui/f/fields/EditorInput/EditorInput.jsx

@@ -2,6 +2,7 @@
 /* eslint-disable import/no-extraneous-dependencies -- required here */
 import * as React from 'react'
 import { memo, useEffect } from 'react'
+import { $getRoot } from 'lexical'
 import { useField, useFormikContext } from 'formik'
 import { LexicalComposer } from '@lexical/react/LexicalComposer'
 import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin'
@@ -66,6 +67,7 @@ const EditorInput = ({
   showDebugger,
   setEditorState,
   setPlainTextKey,
+  validate,
   // ...otherProps
 }) => {
   const [field, ,] = useField(name)
@@ -116,6 +118,11 @@ const EditorInput = ({
 
   const onChange = (state) => {
     setFieldValue(name, JSON.stringify(state))
+    validate?.(state.read(() => {
+      const root = $getRoot()
+      const textContent = root.getTextContent()
+      return textContent
+    }))
   }
 
   const initialConfig = {

package/src/ui/f/fields/EditorInput/common/ExposePlainTextPlugin.jsx

@@ -17,6 +17,14 @@ const ExposePlainTextPlugin = ({
 }) => {
   const [editor] = useLexicalComposerContext()
 
+  useEffect(() => {
+    editor.update(() => {
+      const root = $getRoot()
+      const textContent = root.getTextContent()
+      setFieldValue(setPlainTextKey, textContent)
+    })
+  }, [])
+
   useEffect(() => (
     editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {