@flozy/editor 3.8.9 → 3.9.0

package/dist/Editor/helper/index.js

@@ -1,12 +1,9 @@
-import { Editor, Transforms, Path } from "slate";
-import { ReactEditor } from "slate-react";
 import html2canvas from "html2canvas";
 import { rectIntersection, closestCenter } from "@dnd-kit/core";
 import { getQueryStrings } from "../utils/SlateUtilityFunctions";
 import { Node } from "slate";
 const HIDE_PLACHOLDERS = ["grid", "grid-item", "table"];
 const PREVIEW_IMAGE_HIDE_CLASS = ["grid-container-toolbar", "grid-item-toolbar", "element-toolbar", "mini-tool-wrpr-ei", "element-selector", "element-selector-ctrl"];
-const RND_ITEMS = ["freegridItem", "freegridBox"];
 export const getThumbnailImage = async (dom, options = {}) => {
   try {
     const canvas = await html2canvas(dom, {
@@ -143,142 +140,6 @@ export const isEmptyTextNode = element => {
     return false;
   }
 };
-export const clearSelection = editor => {
-  try {
-    ReactEditor.focus(editor);
-    Transforms.collapse(editor, {
-      edge: "start"
-    });
-    Transforms.deselect(editor);
-  } catch (err) {
-    console.log(err);
-  }
-};
-export const isSelectionInNodeType = (editor, type) => {
-  const {
-    selection
-  } = editor;
-  if (selection) {
-    const [match] = Editor.nodes(editor, {
-      match: n => n.type === type,
-      mode: "lowest" // This ensures that we check the lowest node that matches the type
-    });
-
-    return {
-      selected: !!match,
-      match
-    };
-  }
-  return {
-    selected: false
-  };
-};
-export const getCaretPosition = editor => {
-  const {
-    selection
-  } = editor;
-  if (selection) {
-    const {
-      anchor
-    } = selection;
-    const {
-      path,
-      offset
-    } = anchor;
-    return path && offset ? {
-      path,
-      offset
-    } : null;
-  }
-  return null;
-};
-export const onPasteRnDNode = (editor, {
-  path,
-  children,
-  slateNodes
-}) => {
-  try {
-    const cur_root_path = Path.parent(path);
-    const parsed_node = slateNodes || JSON.parse(window.copiedNode);
-    let new_path = [...path, children.length];
-    if (RND_ITEMS.indexOf(parsed_node?.type) > -1) {
-      Transforms.insertNodes(editor, [{
-        ...parsed_node,
-        // for differentiate the items
-        left: parsed_node?.left + 20,
-        marginTop: parsed_node?.marginTop + 20,
-        // to maintain unique drop location in different section also
-        gridArea: "1 / 1 / 2 / 2"
-      }], {
-        at: new_path
-      });
-    } else {
-      // for pasting whole section
-      new_path = Path.next(cur_root_path);
-      Transforms.insertNodes(editor, [{
-        ...parsed_node
-      }], {
-        at: new_path
-      });
-    }
-    return new_path;
-  } catch (err) {
-    console.log(err);
-  }
-};
-export const setSelection = (editor, {
-  path
-}) => {
-  try {
-    ReactEditor.focus(editor);
-    const point = {
-      path,
-      offset: 0
-    };
-    Transforms.select(editor, {
-      anchor: point,
-      focus: point
-    });
-    ReactEditor.focus(editor);
-  } catch (err) {
-    console.log(err);
-  }
-};
-export const focusSelection = (editor, {
-  path
-}) => {
-  try {
-    ReactEditor.focus(editor);
-    const selectedNode = Node.get(editor, path);
-    const selectedDOM = ReactEditor.toDOMNode(editor, selectedNode);
-    selectedDOM.scrollIntoView({
-      behavior: "smooth",
-      block: "center"
-    });
-  } catch (err) {
-    console.log(err);
-  }
-};
-export const bringItemToFB = (editor, {
-  path,
-  moveFront
-}) => {
-  try {
-    const itemNode = Node.get(editor, path);
-    const {
-      zIndex
-    } = itemNode;
-    let arrangeIndex = zIndex === undefined ? path[path.length - 1] : zIndex;
-    arrangeIndex = moveFront ? arrangeIndex + 1 : arrangeIndex - 1;
-    Transforms.setNodes(editor, {
-      zIndex: Math.min(arrangeIndex, editor.children.length)
-    }, {
-      at: path
-    });
-  } catch (err) {
-    console.log(err);
-  }
-};
 export const debounce = function (func, wait, immediate) {
   let timeout;
   return function () {

package/dist/Editor/helper/theme.js

@@ -6,12 +6,6 @@ export const breakpoints = {
 };
 export const BREAKPOINTS_DEVICES = ["xs", "sm", "md", "lg"];
 export const getDevice = width => {
-  // stimulated environment
-  const breakpoint = document.getElementsByClassName("et-wrpr")[0];
-  const etDataset = breakpoint?.dataset;
-  if (etDataset?.breakpoint) {
-    return etDataset?.breakpoint;
-  }
   if (width > 0 && width < breakpoints.mobile) {
     return "xs";
   } else {
@@ -48,7 +42,7 @@ const overrides = {
     return `${val?.widthInPercent || 100}%`;
   },
   overrideReSizeH: val => {
-    return val ? `${val?.height}px` : "auto";
+    return `${val?.height}px`;
   },
   overrideBorderRadius: val => {
     return `${val?.topLeft}px ${val?.topRight}px ${val?.bottomLeft}px ${val?.bottomRight}px`;
@@ -104,46 +98,4 @@ export const getTRBLBreakPoints = (value, breakpoint) => {
     console.log(err);
   }
 };
-export const getBRValue = (props, rbr = "lg") => {
-  const {
-    value,
-    breakpoint,
-    ot,
-    ov
-  } = props;
-  const val = getBreakPointsValue(value, breakpoint, ot, ov);
-  return val[rbr] || val["lg"];
-};
-const isObject = value => {
-  return Object.prototype.toString.call(value) === "[object Object]";
-};
-export const groupByBreakpoint = (styleProps, theme) => {
-  const tProps = Object.keys(styleProps);
-  const groupedXS = tProps.reduce((a, b) => {
-    if (isObject(styleProps[b])) {
-      a[b] = styleProps[b]["xs"];
-      if (b === "height" && !a[b]) {
-        a[b] = "auto";
-      }
-    } else {
-      a[b] = styleProps[b];
-    }
-    return a;
-  }, {});
-  const groupedLG = tProps.reduce((a, b) => {
-    if (isObject(styleProps[b])) {
-      a[b] = styleProps[b]["lg"] || styleProps[b];
-    } else {
-      a[b] = styleProps[b];
-    }
-    return a;
-  }, {});
-  return {
-    [theme.breakpoints.up("lg")]: {
-      ...groupedLG
-    },
-    [theme.breakpoints.between("xs", "md")]: {
-      ...groupedXS
-    }
-  };
-};
+export const getCustomizationValue = value => isNaN(parseInt(value)) ? null : parseInt(value);

package/dist/Editor/hooks/useMouseMove.js

@@ -22,36 +22,16 @@ export const EditorProvider = ({
   theme,
   children
 }) => {
+  const [event] = useMouseMove();
   const [previous, setPrevious] = useState("");
   const [drop, setDrop] = useState(0);
   const [selectedPath, setSelectedPath] = useState(null);
-  const [selectedElement, setSelectedElement] = useState({});
-  const [dragging, setDragging] = useState({});
-  const [event] = useMouseMove(dragging);
   const path = event?.target?.getAttribute("data-path");
   const [popupType, setPopupType] = useState(""); // opened popup name in the editor will be stored
   const [openAI, setOpenAI] = useState("");
-  const [contextMenu, setContextMenu] = useState({
-    path: null
-  });
-  useEffect(() => {
-    window.updateSelectedItem = d => {
-      setSelectedElement(d);
-    };
-  }, []);
   const onDrop = () => {
     setDrop(drop + 1);
   };
-  const isSelectedElement = path => {
-    const cu_path = path.split("|");
-    const se_path = selectedElement?.path?.split("|");
-    const isParentSelected = se_path?.slice(0, cu_path.length).join("|") === path;
-    // check if child or parent is selected
-    if (selectedElement?.path === path || isParentSelected) {
-      return selectedElement;
-    }
-    return {};
-  };
   const value = useMemo(() => {
     if (path) {
       setPrevious(path);
@@ -72,15 +52,8 @@ export const EditorProvider = ({
       theme: theme,
       selectedPath: selectedPath,
       setSelectedPath: setSelectedPath,
-      selectedElement: selectedElement,
-      setSelectedElement: setSelectedElement,
-      isSelectedElement: isSelectedElement,
-      setDragging: setDragging,
-      dragging: dragging,
       popupType,
       setPopupType,
-      setContextMenu,
-      contextMenu,
       openAI,
       setOpenAI
     },
@@ -90,7 +63,7 @@ export const EditorProvider = ({
 export const useEditorContext = () => {
   return useContext(EditorContext);
 };
-const useMouseMove = dragging => {
+const useMouseMove = () => {
   const [event, setEvent] = useState({
     target: null
   });
@@ -101,13 +74,12 @@ const useMouseMove = dragging => {
     };
   }, []);
   const onMouseMove = e => {
-    if (!dragging?.id) {
-      const dpath = e?.target?.closest(".dpath");
-      if (dpath) {
-        setEvent({
-          target: dpath
-        });
-      }
+    const dpath = e?.target?.closest(".dpath");
+    if (dpath) {
+      console.log(`Stopped position: (${e.clientX}, ${e.clientY})`, dpath);
+      setEvent({
+        target: dpath
+      });
     }
   };
   const debounceMouseMove = debounce(onMouseMove, 100);

package/dist/Editor/hooks/withCommon.js

@@ -7,9 +7,8 @@ import withEquation from "../plugins/withEquation";
 import withMentions from "../plugins/withMentions";
 import withLayout from "../plugins/withLayout";
 import withHtml from "../plugins/withHTML";
-import withErrorHandling from "./withErrorHandling";
 import withCustomDeleteBackward from "../plugins/withCustomDeleteBackward";
 const withCommon = (props, rest = {}) => {
-  return rest.needLayout ? withErrorHandling(withHtml(withEquation(withLayout(withHistory(withEmbeds(withTables(withLinks(withMentions(withCustomDeleteBackward(withReact(props))))))))))) : withErrorHandling(withHtml(withEquation(withHistory(withEmbeds(withTables(withLinks(withMentions(withCustomDeleteBackward(withReact(props))))))))));
+  return rest.needLayout ? withHtml(withEquation(withLayout(withHistory(withEmbeds(withTables(withLinks(withMentions(withCustomDeleteBackward(withReact(props)))))))))) : withHtml(withEquation(withHistory(withEmbeds(withTables(withLinks(withMentions(withCustomDeleteBackward(withReact(props)))))))));
 };
 export default withCommon;

package/dist/Editor/utils/SlateUtilityFunctions.js

@@ -40,10 +40,6 @@ import insertNewLine from "./insertNewLine";
 import Divider from "../Elements/Divider/Divider";
 import { getBorderColor } from "./helper";
 import Code from "../Elements/EmbedScript/Code";
-import FreeGrid from "../Elements/FreeGrid/FreeGrid";
-import FreeGridItem from "../Elements/FreeGrid/FreeGridItem";
-import FreeGridBox from "../Elements/FreeGrid/FreeGridBox";
-import { wrapThemeBreakpoints } from "../Elements/FreeGrid/breakpointConstants";
 import { jsx as _jsx } from "react/jsx-runtime";
 const alignment = ["alignLeft", "alignRight", "alignCenter"];
 const list_types = ["orderedList", "unorderedList"];
@@ -164,7 +160,7 @@ export const activeMark = (editor, format) => {
     return null;
   }
 };
-export const getMarked = (leaf, children, theme) => {
+export const getMarked = (leaf, children) => {
   const className = leaf?.doublequote ? "doublequote" : "";
   if (leaf.bold) {
     children = /*#__PURE__*/_jsx("strong", {
@@ -222,14 +218,10 @@ export const getMarked = (leaf, children, theme) => {
         className: className,
         component: "span",
         sx: {
-          ...wrapThemeBreakpoints({
+          fontSize: {
             lg: sizeMap[leaf.fontSize] || leaf.fontSize,
             ...getBreakPointsValue(leaf.fontSize, null, "overrideText")
-          }, "fontSize", theme),
-          // fontSize: {
-          //   lg: sizeMap[leaf.fontSize] || leaf.fontSize,
-          //   ...getBreakPointsValue(leaf.fontSize, null, "overrideText"),
-          // },
+          },
           ...textStyles,
           fontFamily: family,
           fontWeight: leaf.fontWeight
@@ -415,18 +407,6 @@ export const getBlock = props => {
       return /*#__PURE__*/_jsx(Grid, {
         ...props
       });
-    case "freegrid":
-      return /*#__PURE__*/_jsx(FreeGrid, {
-        ...props
-      });
-    case "freegridItem":
-      return /*#__PURE__*/_jsx(FreeGridItem, {
-        ...props
-      });
-    case "freegridBox":
-      return /*#__PURE__*/_jsx(FreeGridBox, {
-        ...props
-      });
     case "grid-item":
       return /*#__PURE__*/_jsx(GridItem, {
         ...props,

package/dist/Editor/utils/draftToSlate.js

@@ -100,7 +100,7 @@ export const draftToSlate = props => {
       return a;
     }, []);
     return converted;
-  } else if (data?.length) {
+  } else if (data?.length > 0) {
     return data;
   } else {
     return [{

package/dist/Editor/utils/events.js

@@ -3,7 +3,6 @@ import { toggleBlock } from "./SlateUtilityFunctions";
 import insertNewLine from "./insertNewLine";
 import { insertAccordion } from "./accordion";
 import { isListItem } from "./helper";
-import RnDCtrlCmds from "./RnD/RnDCtrlCmds";
 import EDITORCMDS from "../common/EditorCmds";
 const HOTKEYS = {
   b: "bold",
@@ -76,10 +75,6 @@ export const commands = props => {
       } else {
         Editor.addMark(editor, HOTKEYS[event.key], true);
       }
-    } else if (RnDCtrlCmds[event.key]) {
-      RnDCtrlCmds[event.key](event, {
-        editor
-      });
     } else if (EDITORCMDS[event.key]) {
       EDITORCMDS[event.key](event, {
         editor,

package/dist/Editor/utils/helper.js

@@ -398,33 +398,4 @@ export const onDeleteKey = (event, {
   } catch (err) {
     console.log(err);
   }
-};
-export const selectText = (editor, {
-  path,
-  cursorOnly
-}) => {
-  try {
-    ReactEditor.focus(editor);
-    const range = Editor.range(editor, path);
-    const textNode = Node.get(editor, path);
-    if (!cursorOnly) {
-      Transforms.select(editor, range);
-    }
-    if (cursorOnly && textNode) {
-      const textLength = Node.string(textNode).length;
-      editor.selection = {
-        anchor: {
-          path: path,
-          offset: textLength
-        },
-        focus: {
-          path: path,
-          offset: textLength
-        }
-      };
-    }
-    ReactEditor.focus(editor);
-  } catch (err) {
-    console.log(err);
-  }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flozy/editor",
-  "version": "3.8.9",
+  "version": "3.9.0",
   "description": "An Editor for flozy app brain",
   "files": [
     "dist"
@@ -36,7 +36,6 @@
     "react-gcolor-picker": "^1.3.1",
     "react-icons": "^4.10.1",
     "react-katex": "^3.0.1",
-    "react-rnd": "^10.4.11",
     "react-scripts": "5.0.1",
     "react-signature-canvas": "^1.0.6",
     "react-slick": "^0.29.0",
@@ -57,7 +56,6 @@
   },
   "scripts": {
     "prepare": "husky install .husky",
-    "analyze": "source-map-explorer build/static/js/*.js",
     "lint": "./node_modules/.bin/eslint --ignore-path .gitignore .",
     "start": "craco start",
     "build": "NODE_OPTIONS='--max_old_space_size=4096' craco build",
@@ -66,7 +64,7 @@
     "storybook": "NODE_OPTIONS='--max_old_space_size=4096' storybook dev -p 6006",
     "build-storybook": "NODE_OPTIONS='--max_old_space_size=4096' storybook build",
     "publish:npm": "rm -rf dist && mkdir dist &&  babel src/components -d dist --copy-files",
-    "publish:local": "rm -rf /Users/agmac03/flozy/client/node_modules/@flozy/editor/dist && babel src/components -d /Users/agmac03/flozy/client/node_modules/@flozy/editor/dist --copy-files"
+    "publish:local": "rm -rf /Users/agenciflow08/Documents/flozy/client/node_modules/@flozy/editor/dist && babel src/components -d /Users/agenciflow08/Documents/flozy/client/node_modules/@flozy/editor/dist --copy-files"
   },
   "eslintConfig": {
     "extends": [
@@ -114,7 +112,6 @@
     "babel-plugin-named-exports-order": "^0.0.2",
     "eslint-plugin-storybook": "^0.6.13",
     "prop-types": "^15.8.1",
-    "source-map-explorer": "^2.5.3",
     "storybook": "^7.4.0",
     "webpack": "^5.88.2"
   },