@flozy/editor 5.1.9 → 5.2.0

package/dist/Editor/Elements/AI/PopoverAIInput.js

@@ -108,10 +108,15 @@ const updateAnchorEl = (setAnchorEl, editor, openAI, selectedElement) => {
       return;
     }
     const selection = window.getSelection();
-    if (openAI === "fromToolBar" && selection.anchorOffset !== selection.focusOffset) {
-      // to fix some issue in Drag n Drop
-      return;
-    }
+
+    // if (
+    //   openAI === "fromToolBar" &&
+    //   selection.anchorOffset !== selection.focusOffset
+    // ) {
+    //   // to fix some issue in Drag n Drop
+    //   return;
+    // }
+
     if (selection.rangeCount) {
       let caret;
       if (getSelectedText(editor)) {

package/dist/Editor/Elements/AI/Styles.js

@@ -115,7 +115,7 @@ const Styles = theme => ({
     overflow: "auto",
     // width: "240px",
     minWidth: "200px",
-    border: "1px solid #E0E0E0",
+    border: `1px solid${theme?.palette?.editor?.popUpBorderColor}`,
     padding: "6px"
   },
   optionWrapper: {
@@ -142,22 +142,28 @@ const Styles = theme => ({
       gap: "8px"
     },
     "&:hover": {
-      backgroundColor: `${theme?.palette?.editor?.menuOptionSelectedOption} !important`
+      backgroundColor: `${theme?.palette?.editor?.menuOptionSelectedOption} !important`,
+      "& svg path": {
+        stroke: `${theme?.palette?.editor?.textColor} !important`
+      },
+      "& svg": {
+        color: `${theme?.palette?.editor?.textColor} !important`
+      }
     },
     "& svg path": {
-      stroke: `${theme?.palette?.editor?.menuOptionTextColor} !important`
+      stroke: `${theme?.palette?.editor?.closeButtonSvgStroke} !important`
     },
     "& svg": {
-      color: `${theme?.palette?.editor?.menuOptionTextColor} !important`
+      color: `${theme?.palette?.editor?.closeButtonSvgStroke} !important`
     },
     "&.active": {
       background: `${theme?.palette?.containers?.bg3 || "#E9F3FE"}`,
-      color: "#2563EB",
+      color: theme?.palette?.editor?.menuOptionsSelectedTextColor,
       "& svg path": {
-        stroke: "#2563EB"
+        stroke: theme?.palette?.editor?.menuOptionsSelectedTextColor
       },
       "& svg": {
-        color: "#2563EB !important"
+        color: `${theme?.palette?.editor?.menuOptionsSelectedTextColor} !important`
       }
     }
   },

package/dist/Editor/Elements/Embed/Image.js

@@ -66,7 +66,7 @@ const ImageContent = props => {
     path,
     theme
   } = props;
-  return !url && !readOnly ? /*#__PURE__*/_jsxs(Box, {
+  return !url ? !readOnly ? /*#__PURE__*/_jsxs(Box, {
     component: "button",
     className: "element-empty-btn",
     contentEditable: false,
@@ -76,6 +76,18 @@ const ImageContent = props => {
     children: [/*#__PURE__*/_jsx(Icon, {
       icon: "image"
     }), "Add Image"]
+  }) : /*#__PURE__*/_jsxs(Box, {
+    sx: {
+      color: "#64748B !important",
+      "& svg": {
+        color: "#64748B"
+      }
+    },
+    component: "button",
+    className: "element-empty-btn",
+    children: [/*#__PURE__*/_jsx(Icon, {
+      icon: "shieldNoAccess"
+    }), "The Content is no longer available."]
   }) : /*#__PURE__*/_jsx(Box, {
     component: "img",
     className: "emb-img",

package/dist/Editor/Elements/Embed/Video.js

@@ -70,13 +70,25 @@ const VideoPlaceholder = props => {
     readOnly,
     onSettings
   } = props;
-  return !url && !readOnly ? /*#__PURE__*/_jsxs(Box, {
+  return !url ? !readOnly ? /*#__PURE__*/_jsxs(Box, {
     component: "button",
     className: "element-empty-btn",
     onClick: onSettings,
     children: [/*#__PURE__*/_jsx(Icon, {
       icon: "video"
     }), "Embed Video or Other"]
+  }) : /*#__PURE__*/_jsxs(Box, {
+    sx: {
+      color: "#64748B !important",
+      "& svg": {
+        color: "#64748B"
+      }
+    },
+    component: "button",
+    className: "element-empty-btn",
+    children: [/*#__PURE__*/_jsx(Icon, {
+      icon: "shieldNoAccess"
+    }), "The Content is no longer available."]
   }) : /*#__PURE__*/_jsx(VideoContent, {
     ...props
   });

package/dist/Editor/Elements/Table/DragButton.js

@@ -42,6 +42,7 @@ function DragButton({
   const dragProps = {
     ...dndProps,
     id: dndProps?.id + dragType,
+    disabled: isMobile,
     data: {
       ...dndProps.data,
       dragType

package/dist/Editor/Elements/Table/Table.js

@@ -106,7 +106,8 @@ const Table = props => {
   } = props;
   const classes = TableStyles(editorTheme);
   const {
-    readOnly
+    readOnly,
+    isMobile
   } = customProps;
   const [openSetttings, setOpenSettings] = useState(false);
   const [exandTools, setExpandTools] = useState(null);
@@ -219,10 +220,14 @@ const Table = props => {
     handleRowDragBtns();
   };
   const onMouseOver = () => {
-    containerRef?.current?.classList.remove("hideScroll");
+    if (!isMobile) {
+      containerRef?.current?.classList.remove("hideScroll");
+    }
   };
   const onMouseLeave = () => {
-    containerRef?.current?.classList.add("hideScroll");
+    if (!isMobile) {
+      containerRef?.current?.classList.add("hideScroll");
+    }
   };
   const commonAddBtnProps = {
     tableRef,

package/dist/Editor/Elements/Table/TableCell.js

@@ -401,6 +401,7 @@ const TableCell = props => {
         color: entireTextColor || "inherit",
         cursor: "text",
         verticalAlign: "top",
+        padding: "0px",
         ...(sizeProps || {})
       },
       ...tbProps,
@@ -415,7 +416,8 @@ const TableCell = props => {
         tableDOM: tableDOM
       }) : null, /*#__PURE__*/_jsx("div", {
         style: {
-          overflow: "auto hidden"
+          overflow: "auto hidden",
+          padding: "8px"
         },
         children: children
       }), isHeader && !readOnly && tableSize?.height && !showTool ? /*#__PURE__*/_jsx(Resizer, {

package/dist/Editor/common/Icon.js

@@ -12,6 +12,7 @@ import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
 import EmailRoundedIcon from "@mui/icons-material/EmailRounded";
 import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
 import GridOnIcon from "@mui/icons-material/GridOn";
+import GppBadOutlinedIcon from "@mui/icons-material/GppBadOutlined";
 import { AccordionTextFormatIcon, BoldTextFormatIcon, BulletedListTextFormatIcon, ButtonElementIcon, CarouselElementIcon, CheckListTextFormatIcon, ColorBoxElementIcon, DividerElementIcon, DocUploadElementIcon, EmbedElementIcon, EmojiElementIcon, FormElementIcon, GridElementIcon, H1, H2, H3, ImageElementIcon, ItalicTextFormatIcon, LinkIconV2, OrderedListTextFormatIcon, SignatureElementIcon, TableElementIcon, TopBannerElementIcon, UnderlineTextFormatIcon, VideoElementIcon, CalendlyIcon, LeftAlignTextFormat, CenterAlignTextFormat, RightAlignTextFormat, JustifyTextFormat, FreeGridElement, AppHeaderElement, CodeElementIcon } from "./iconListV2";
 import MoreVertRoundedIcon from "@mui/icons-material/MoreVertRounded";
 import SettingsIcon from "../assets/svg/SettingsIcon";
@@ -280,7 +281,8 @@ const iconList = {
   deleteIcon: /*#__PURE__*/_jsx(DeleteIcon, {}),
   brain: /*#__PURE__*/_jsx(BrainIcon, {}),
   docsIcon: /*#__PURE__*/_jsx(DocsIcon, {}),
-  userIcon: /*#__PURE__*/_jsx(UserIcon, {})
+  userIcon: /*#__PURE__*/_jsx(UserIcon, {}),
+  shieldNoAccess: /*#__PURE__*/_jsx(GppBadOutlinedIcon, {})
 };
 export const icons = {
   ...iconList

package/dist/Editor/common/RnD/VirtualElement/index.js

@@ -141,7 +141,11 @@ const VirtualElement = props => {
     sx: classes.root,
     dangerouslySetInnerHTML: {
       __html: getItems()
-    }
+    },
+    style: {
+      visibility: "hidden"
+    },
+    "aria-hidden": "true"
   });
 };
 export default VirtualElement;

package/package.json

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