@flozy/editor 1.0.8 → 1.1.0

package/dist/Editor/common/Icon.js

@@ -4,104 +4,105 @@ import { BsTypeH1, BsTypeH2, BsTypeH3, BsCameraVideoFill } from "react-icons/bs"
 import { FaSuperscript, FaSubscript } from "react-icons/fa";
 import { AiFillEdit, AiOutlineTable, AiOutlineInsertRowBelow, AiOutlineInsertRowRight, AiOutlineDelete, AiFillTag, AiOutlineUpload, AiOutlineArrowsAlt, AiOutlineInsertRowAbove, AiOutlineInsertRowLeft, AiFillHtml5 } from "react-icons/ai";
 import { SiLatex } from "react-icons/si";
+import { jsx as _jsx } from "react/jsx-runtime";
 const iconList = {
-  bold: /*#__PURE__*/React.createElement(MdFormatBold, {
+  bold: /*#__PURE__*/_jsx(MdFormatBold, {
     size: 20
   }),
-  italic: /*#__PURE__*/React.createElement(MdFormatItalic, {
+  italic: /*#__PURE__*/_jsx(MdFormatItalic, {
     size: 20
   }),
-  strikethrough: /*#__PURE__*/React.createElement(MdStrikethroughS, {
+  strikethrough: /*#__PURE__*/_jsx(MdStrikethroughS, {
     size: 20
   }),
-  underline: /*#__PURE__*/React.createElement(MdFormatUnderlined, {
+  underline: /*#__PURE__*/_jsx(MdFormatUnderlined, {
     size: 20
   }),
-  headingOne: /*#__PURE__*/React.createElement(BsTypeH1, {
+  headingOne: /*#__PURE__*/_jsx(BsTypeH1, {
     size: 20
   }),
-  headingTwo: /*#__PURE__*/React.createElement(BsTypeH2, {
+  headingTwo: /*#__PURE__*/_jsx(BsTypeH2, {
     size: 20
   }),
-  headingThree: /*#__PURE__*/React.createElement(BsTypeH3, {
+  headingThree: /*#__PURE__*/_jsx(BsTypeH3, {
     size: 20
   }),
-  blockquote: /*#__PURE__*/React.createElement(MdFormatQuote, {
+  blockquote: /*#__PURE__*/_jsx(MdFormatQuote, {
     size: 20
   }),
-  superscript: /*#__PURE__*/React.createElement(FaSuperscript, {
+  superscript: /*#__PURE__*/_jsx(FaSuperscript, {
     size: 15
   }),
-  subscript: /*#__PURE__*/React.createElement(FaSubscript, {
+  subscript: /*#__PURE__*/_jsx(FaSubscript, {
     size: 15
   }),
-  alignLeft: /*#__PURE__*/React.createElement(MdFormatAlignLeft, {
+  alignLeft: /*#__PURE__*/_jsx(MdFormatAlignLeft, {
     size: 20
   }),
-  alignCenter: /*#__PURE__*/React.createElement(MdFormatAlignCenter, {
+  alignCenter: /*#__PURE__*/_jsx(MdFormatAlignCenter, {
     size: 20
   }),
-  alignRight: /*#__PURE__*/React.createElement(MdFormatAlignRight, {
+  alignRight: /*#__PURE__*/_jsx(MdFormatAlignRight, {
     size: 20
   }),
-  orderedList: /*#__PURE__*/React.createElement(MdFormatListNumbered, {
+  orderedList: /*#__PURE__*/_jsx(MdFormatListNumbered, {
     size: 20
   }),
-  unorderedList: /*#__PURE__*/React.createElement(MdFormatListBulleted, {
+  unorderedList: /*#__PURE__*/_jsx(MdFormatListBulleted, {
     size: 20
   }),
-  link: /*#__PURE__*/React.createElement(MdInsertLink, {
+  link: /*#__PURE__*/_jsx(MdInsertLink, {
     size: 20
   }),
-  image: /*#__PURE__*/React.createElement(MdImage, {
+  image: /*#__PURE__*/_jsx(MdImage, {
     size: 20
   }),
-  video: /*#__PURE__*/React.createElement(MdVideoLibrary, {
+  video: /*#__PURE__*/_jsx(MdVideoLibrary, {
     size: 20
   }),
-  add: /*#__PURE__*/React.createElement(MdAdd, {
+  add: /*#__PURE__*/_jsx(MdAdd, {
     size: 20
   }),
-  table: /*#__PURE__*/React.createElement(AiOutlineTable, {
+  table: /*#__PURE__*/_jsx(AiOutlineTable, {
     size: 20
   }),
-  insertRowBelow: /*#__PURE__*/React.createElement(AiOutlineInsertRowBelow, {
+  insertRowBelow: /*#__PURE__*/_jsx(AiOutlineInsertRowBelow, {
     size: 25
   }),
-  insertColumnRight: /*#__PURE__*/React.createElement(AiOutlineInsertRowRight, {
+  insertColumnRight: /*#__PURE__*/_jsx(AiOutlineInsertRowRight, {
     size: 25
   }),
-  insertColumnLeft: /*#__PURE__*/React.createElement(AiOutlineInsertRowLeft, {
+  insertColumnLeft: /*#__PURE__*/_jsx(AiOutlineInsertRowLeft, {
     size: 25
   }),
-  insertRowAbove: /*#__PURE__*/React.createElement(AiOutlineInsertRowAbove, {
+  insertRowAbove: /*#__PURE__*/_jsx(AiOutlineInsertRowAbove, {
     size: 25
   }),
-  trashCan: /*#__PURE__*/React.createElement(AiOutlineDelete, {
+  trashCan: /*#__PURE__*/_jsx(AiOutlineDelete, {
     size: 25
   }),
-  addId: /*#__PURE__*/React.createElement(AiFillTag, {
+  addId: /*#__PURE__*/_jsx(AiFillTag, {
     size: 20
   }),
-  upload: /*#__PURE__*/React.createElement(AiOutlineUpload, {
+  upload: /*#__PURE__*/_jsx(AiOutlineUpload, {
     size: 20
   }),
-  equation: /*#__PURE__*/React.createElement(SiLatex, {
+  equation: /*#__PURE__*/_jsx(SiLatex, {
     size: 20
   }),
-  resize: /*#__PURE__*/React.createElement(AiOutlineArrowsAlt, {
+  resize: /*#__PURE__*/_jsx(AiOutlineArrowsAlt, {
     size: 20
   }),
-  videoPlayer: /*#__PURE__*/React.createElement(BsCameraVideoFill, {
+  videoPlayer: /*#__PURE__*/_jsx(BsCameraVideoFill, {
     size: 20
   }),
-  insertHtml: /*#__PURE__*/React.createElement(AiFillHtml5, {
+  insertHtml: /*#__PURE__*/_jsx(AiFillHtml5, {
     size: 20
   }),
-  arrowRight: /*#__PURE__*/React.createElement(MdArrowForward, {
+  arrowRight: /*#__PURE__*/_jsx(MdArrowForward, {
     size: 35
   }),
-  pen: /*#__PURE__*/React.createElement(AiFillEdit, {
+  pen: /*#__PURE__*/_jsx(AiFillEdit, {
     size: 20
   })
 };

package/dist/Editor/common/MentionsPopup.js

@@ -2,6 +2,7 @@ import React, { useRef, useEffect } from "react";
 import { Transforms } from "slate";
 import { ReactEditor } from "slate-react";
 import { insertMention } from "../utils/mentions";
+import { jsx as _jsx } from "react/jsx-runtime";
 const MentionsPopup = props => {
   const {
     editor,
@@ -21,7 +22,7 @@ const MentionsPopup = props => {
       el.style.left = `${rect.left + window.scrollX}px`;
     }
   }, [chars.length, editor, index, target]);
-  return target && chars.length > 0 ? /*#__PURE__*/React.createElement("div", {
+  return target && chars.length > 0 ? /*#__PURE__*/_jsx("div", {
     ref: ref,
     style: {
       top: "-9999px",
@@ -33,22 +34,23 @@ const MentionsPopup = props => {
       borderRadius: "4px",
       boxShadow: "0 1px 5px rgba(0,0,0,.2)"
     },
-    "data-cy": "mentions-portal"
-  }, chars.map((char, i) => /*#__PURE__*/React.createElement("div", {
-    key: char,
-    onClick: () => {
-      Transforms.select(editor, target);
-      insertMention(editor, char);
-      setMentions({
-        ...mentions,
-        target: null
-      });
-    },
-    style: {
-      padding: "1px 3px",
-      borderRadius: "3px",
-      background: i === index ? "#B4D5FF" : "transparent"
-    }
-  }, char))) : null;
+    "data-cy": "mentions-portal",
+    children: chars.map((char, i) => /*#__PURE__*/_jsx("div", {
+      onClick: () => {
+        Transforms.select(editor, target);
+        insertMention(editor, char);
+        setMentions({
+          ...mentions,
+          target: null
+        });
+      },
+      style: {
+        padding: "1px 3px",
+        borderRadius: "3px",
+        background: i === index ? "#B4D5FF" : "transparent"
+      },
+      children: char
+    }, char))
+  }) : null;
 };
 export default MentionsPopup;

package/dist/Editor/utils/SlateUtilityFunctions.js

@@ -1,4 +1,3 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import { Editor, Transforms, Element as SlateElement } from "slate";
 import Link from "../Elements/Link/Link";
 import Image from "../Elements/Embed/Image";
@@ -9,6 +8,7 @@ import Table from "../Elements/Table/Table";
 import Mentions from "../Elements/Mentions/Mentions";
 import Grid from "../Elements/Grid/Grid";
 import GridItem from "../Elements/Grid/GridItem";
+import { jsx as _jsx } from "react/jsx-runtime";
 const alignment = ["alignLeft", "alignRight", "alignCenter"];
 const list_types = ["orderedList", "unorderedList"];
 export const sizeMap = {
@@ -93,59 +93,76 @@ export const activeMark = (editor, format) => {
 };
 export const getMarked = (leaf, children) => {
   if (leaf.bold) {
-    children = /*#__PURE__*/React.createElement("strong", null, children);
+    children = /*#__PURE__*/_jsx("strong", {
+      children: children
+    });
   }
   if (leaf.code) {
-    children = /*#__PURE__*/React.createElement("code", null, children);
+    children = /*#__PURE__*/_jsx("code", {
+      children: children
+    });
   }
   if (leaf.italic) {
-    children = /*#__PURE__*/React.createElement("em", null, children);
+    children = /*#__PURE__*/_jsx("em", {
+      children: children
+    });
   }
   if (leaf.strikethrough) {
-    children = /*#__PURE__*/React.createElement("span", {
+    children = /*#__PURE__*/_jsx("span", {
       style: {
         textDecoration: "line-through"
-      }
-    }, children);
+      },
+      children: children
+    });
   }
   if (leaf.underline) {
-    children = /*#__PURE__*/React.createElement("u", null, children);
+    children = /*#__PURE__*/_jsx("u", {
+      children: children
+    });
   }
   if (leaf.superscript) {
-    children = /*#__PURE__*/React.createElement("sup", null, children);
+    children = /*#__PURE__*/_jsx("sup", {
+      children: children
+    });
   }
   if (leaf.subscript) {
-    children = /*#__PURE__*/React.createElement("sub", null, children);
+    children = /*#__PURE__*/_jsx("sub", {
+      children: children
+    });
   }
   if (leaf.color) {
-    children = /*#__PURE__*/React.createElement("span", {
+    children = /*#__PURE__*/_jsx("span", {
       style: {
         color: leaf.color
-      }
-    }, children);
+      },
+      children: children
+    });
   }
   if (leaf.bgColor) {
-    children = /*#__PURE__*/React.createElement("span", {
+    children = /*#__PURE__*/_jsx("span", {
       style: {
         backgroundColor: leaf.bgColor
-      }
-    }, children);
+      },
+      children: children
+    });
   }
   if (leaf.fontSize) {
     const size = sizeMap[leaf.fontSize];
-    children = /*#__PURE__*/React.createElement("span", {
+    children = /*#__PURE__*/_jsx("span", {
       style: {
         fontSize: size
-      }
-    }, children);
+      },
+      children: children
+    });
   }
   if (leaf.fontFamily) {
     const family = fontFamilyMap[leaf.fontFamily];
-    children = /*#__PURE__*/React.createElement("span", {
+    children = /*#__PURE__*/_jsx("span", {
       style: {
         fontFamily: family
-      }
-    }, children);
+      },
+      children: children
+    });
   }
   return children;
 };
@@ -157,68 +174,131 @@ export const getBlock = props => {
   const attributes = props.attributes ?? {};
   switch (element.type) {
     case "headingOne":
-      return /*#__PURE__*/React.createElement("h1", _extends({}, attributes, element.attr), children);
+      return /*#__PURE__*/_jsx("h1", {
+        ...attributes,
+        ...element.attr,
+        children: children
+      });
     case "headingTwo":
-      return /*#__PURE__*/React.createElement("h2", _extends({}, attributes, element.attr), children);
+      return /*#__PURE__*/_jsx("h2", {
+        ...attributes,
+        ...element.attr,
+        children: children
+      });
     case "headingThree":
-      return /*#__PURE__*/React.createElement("h3", _extends({}, attributes, element.attr), children);
+      return /*#__PURE__*/_jsx("h3", {
+        ...attributes,
+        ...element.attr,
+        children: children
+      });
     case "blockquote":
-      return /*#__PURE__*/React.createElement("blockquote", _extends({}, attributes, element.attr), children);
+      return /*#__PURE__*/_jsx("blockquote", {
+        ...attributes,
+        ...element.attr,
+        children: children
+      });
     case "alignLeft":
-      return /*#__PURE__*/React.createElement("div", _extends({
+      return /*#__PURE__*/_jsx("div", {
         style: {
           listStylePosition: "inside"
-        }
-      }, attributes, element.attr), children);
+        },
+        ...attributes,
+        ...element.attr,
+        children: children
+      });
     case "alignCenter":
-      return /*#__PURE__*/React.createElement("div", _extends({
+      return /*#__PURE__*/_jsx("div", {
         style: {
           display: "flex",
           alignItems: "center",
           listStylePosition: "inside",
           flexDirection: "column"
-        }
-      }, attributes, element.attr), children);
+        },
+        ...attributes,
+        ...element.attr,
+        children: children
+      });
     case "alignRight":
-      return /*#__PURE__*/React.createElement("div", _extends({
+      return /*#__PURE__*/_jsx("div", {
         style: {
           display: "flex",
           alignItems: "flex-end",
           listStylePosition: "inside",
           flexDirection: "column"
-        }
-      }, attributes, element.attr), children);
+        },
+        ...attributes,
+        ...element.attr,
+        children: children
+      });
     case "list-item":
-      return /*#__PURE__*/React.createElement("li", _extends({}, attributes, element.attr), children);
+      return /*#__PURE__*/_jsx("li", {
+        ...attributes,
+        ...element.attr,
+        children: children
+      });
     case "orderedList":
-      return /*#__PURE__*/React.createElement("ol", _extends({
-        type: "1"
-      }, attributes), children);
+      return /*#__PURE__*/_jsx("ol", {
+        type: "1",
+        ...attributes,
+        children: children
+      });
     case "unorderedList":
-      return /*#__PURE__*/React.createElement("ul", attributes, children);
+      return /*#__PURE__*/_jsx("ul", {
+        ...attributes,
+        children: children
+      });
     case "link":
-      return /*#__PURE__*/React.createElement(Link, props);
+      return /*#__PURE__*/_jsx(Link, {
+        ...props
+      });
     case "table":
-      return /*#__PURE__*/React.createElement(Table, props);
+      return /*#__PURE__*/_jsx(Table, {
+        ...props
+      });
     case "table-row":
-      return /*#__PURE__*/React.createElement("tr", attributes, children);
+      return /*#__PURE__*/_jsx("tr", {
+        ...attributes,
+        children: children
+      });
     case "table-cell":
-      return /*#__PURE__*/React.createElement("td", _extends({}, element.attr, attributes), children);
+      return /*#__PURE__*/_jsx("td", {
+        ...element.attr,
+        ...attributes,
+        children: children
+      });
     case "image":
-      return /*#__PURE__*/React.createElement(Image, props);
+      return /*#__PURE__*/_jsx(Image, {
+        ...props
+      });
     case "video":
-      return /*#__PURE__*/React.createElement(Video, props);
+      return /*#__PURE__*/_jsx(Video, {
+        ...props
+      });
     case "equation":
-      return /*#__PURE__*/React.createElement(Equation, props);
+      return /*#__PURE__*/_jsx(Equation, {
+        ...props
+      });
     case "htmlCode":
-      return /*#__PURE__*/React.createElement(HtmlCode, props);
+      return /*#__PURE__*/_jsx(HtmlCode, {
+        ...props
+      });
     case "mention":
-      return /*#__PURE__*/React.createElement(Mentions, props);
+      return /*#__PURE__*/_jsx(Mentions, {
+        ...props
+      });
     case "grid":
-      return /*#__PURE__*/React.createElement(Grid, props);
+      return /*#__PURE__*/_jsx(Grid, {
+        ...props
+      });
     case "grid-item":
-      return /*#__PURE__*/React.createElement(GridItem, props);
+      return /*#__PURE__*/_jsx(GridItem, {
+        ...props
+      });
     default:
-      return /*#__PURE__*/React.createElement("div", _extends({}, element.attr, attributes), children);
+      return /*#__PURE__*/_jsx("div", {
+        ...element.attr,
+        ...attributes,
+        children: children
+      });
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flozy/editor",
-  "version": "1.0.8",
+  "version": "1.1.0",
   "description": "An Editor for flozy app brain",
   "files": [
     "dist"
@@ -34,8 +34,8 @@
     "yjs": "^13.6.8"
   },
   "peerDependencies": {
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react": ">=15.0.0",
+    "react-dom": ">=15.0.0"
   },
   "scripts": {
     "prepare": "husky install .husky",
@@ -115,7 +115,7 @@
   },
   "babel": {
     "presets": [
-      "@babel/preset-react"
+      ["@babel/preset-react", {"runtime": "automatic"}]
     ]
   }
 }