@flozy/editor 3.7.4 → 3.7.5

package/dist/Editor/ChatEditor.js

@@ -1,6 +1,6 @@
 import React, { useCallback, useMemo, useRef, useState, useEffect, useImperativeHandle, forwardRef } from "react";
 import { Editable, Slate, ReactEditor } from 'slate-react';
-import { createEditor } from 'slate';
+import { createEditor, Transforms } from 'slate';
 import { useDebounce } from "use-debounce";
 import withCommon from "./hooks/withCommon";
 import { getBlock, getMarked } from "./utils/chatEditor/SlateUtilityFunctions";
@@ -26,7 +26,8 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
     needLayout = false,
     toolBar = true,
     onSave,
-    onsubmit
+    onsubmit,
+    onBlur = () => {}
   } = props;
   const classes = usePopupStyle(theme);
   const convertedContent = draftToSlate({
@@ -54,6 +55,21 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
       if (editor) {
         ReactEditor.focus(editor);
       }
+    },
+    clearAll() {
+      if (!editor) return;
+      editor.children = [{
+        type: 'paragraph',
+        children: [{
+          text: ''
+        }]
+      }];
+      Transforms.select(editor, {
+        path: [0, 0],
+        offset: 0
+      });
+      ReactEditor.focus(editor);
+      setValue(editor.children);
     }
   }));
   useEffect(() => {
@@ -174,6 +190,16 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
     }
   }, [chars, editor, target, mentions, setMentions, search, type, mentionsRef]);
   const handleClose = () => {};
+  const handleBlur = () => {
+    const {
+      value: strVal,
+      ...restVal
+    } = getOnSaveData(value);
+    onBlur({
+      strVal,
+      restVal
+    });
+  };
   return /*#__PURE__*/_jsx(EditorProvider, {
     theme: theme,
     editor: editor,
@@ -192,6 +218,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
         placeholder: "Start typing ...",
         spellCheck: true,
         autoFocus: true,
+        onBlur: handleBlur,
         onKeyDown: onKeyDown
       }), !readOnly ? /*#__PURE__*/_jsx(MentionsPopup, {
         ref: mentionsRef,

package/dist/Editor/Toolbar/PopupTool/index.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import { Popper, Fade, Paper } from "@mui/material";
+import { Popper, Fade, Paper, ClickAwayListener } from "@mui/material";
 import { Editor, Range } from "slate";
 import { useSlate, useFocused } from "slate-react";
 import useDrag from "../../hooks/useDrag";
@@ -9,7 +9,6 @@ import MiniTextFormat from "./MiniTextFormat";
 import { useEditorContext } from "../../hooks/useMouseMove";
 import usePopupStyles from "../PopupTool/PopupToolStyle";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 const PopupTool = props => {
   const {
     theme,
@@ -84,7 +83,14 @@ const PopupTool = props => {
     setOpen(false);
     setPopupType("");
   };
-  return open && !openAI ? /*#__PURE__*/_jsx(_Fragment, {
+  return open && !openAI ? /*#__PURE__*/_jsx(ClickAwayListener, {
+    onClickAway: e => {
+      // close the mini toolbar, if user clicks outside the editor (in Flozy app.)
+      if (e.target !== document.body) {
+        // e.target returns body, if the user clicks material ui select popup inside the tool bar, on that time, we don't need to close
+        handleClose();
+      }
+    },
     children: size.device === "xs" ? /*#__PURE__*/_jsx("div", {
       className: "mobileMiniTextWrapper",
       children: /*#__PURE__*/_jsx(MiniTextFormat, {

package/dist/Editor/common/MentionsPopup/Styles.js

@@ -10,7 +10,7 @@ const usePopupStyles = theme => ({
   papper: {
     boxShadow: "none",
     width: "300px",
-    height: "auto",
+    maxHeight: "300px",
     overflow: "auto",
     padding: "8px",
     margin: "0px",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flozy/editor",
-  "version": "3.7.4",
+  "version": "3.7.5",
   "description": "An Editor for flozy app brain",
   "files": [
     "dist"