@flozy/editor 5.3.6 → 5.3.8

package/dist/Editor/Elements/Divider/Divider.js

@@ -18,9 +18,9 @@ const Divider = props => {
     theme
   } = useEditorContext();
   const {
-    borderColor = theme?.palette?.primary?.main || "#0F172A",
-    borderWidth = "1px",
-    borderStyle = "solid"
+    borderColor = theme?.palette?.primary?.main || '#0F172A',
+    borderWidth = '1px',
+    borderStyle = 'solid'
   } = element;
   const {
     readOnly
@@ -33,7 +33,7 @@ const Divider = props => {
   } = useEditorContext();
   const [showTool] = useEditorSelection(editor);
   const selected = hoverPath === path.join(",");
-  const width = borderWidth?.includes("px") ? borderWidth : `${borderWidth}px`;
+  const width = borderWidth?.includes('px') ? borderWidth : `${borderWidth}px`;
   const onSettings = () => {
     setOpenSettings(true);
   };
@@ -44,15 +44,15 @@ const Divider = props => {
     onSettings
   }) => {
     const hoverStyles = readOnly ? {
-      "&.MuiIconButton-root:hover": {
-        background: theme?.palette?.type === "dark" ? `${theme?.palette?.greyshades?.light8} !important` : `${theme?.palette?.containers?.card} !important`
+      '&.MuiIconButton-root:hover': {
+        background: theme?.palette?.type === 'dark' ? `${theme?.palette?.greyshades?.light8} !important` : `${theme?.palette?.containers?.card} !important`
       }
     } : {};
     return /*#__PURE__*/_jsx("div", {
       contentEditable: false,
       className: "divider-settings",
       style: {
-        top: "-33px",
+        top: "-20px",
         left: 0
       },
       children: /*#__PURE__*/_jsx(Tooltip, {
@@ -61,11 +61,11 @@ const Divider = props => {
         children: /*#__PURE__*/_jsx(IconButton, {
           size: "small",
           sx: {
-            background: theme?.palette?.type === "dark" ? theme?.palette?.greyshades?.light8 : theme?.palette?.containers?.card,
-            border: theme?.palette?.type === "dark" ? "1px solid #E4E8EB33" : "none",
-            boxShadow: "0px 0px 4px 0px #00000040",
-            borderRadius: "50%",
-            "& svg": {
+            background: theme?.palette?.type === 'dark' ? theme?.palette?.greyshades?.light8 : theme?.palette?.containers?.card,
+            border: theme?.palette?.type === 'dark' ? '1px solid #E4E8EB33' : 'none',
+            boxShadow: '0px 0px 4px 0px #00000040',
+            borderRadius: '50%',
+            '& svg': {
               stroke: theme?.palette?.text?.secondary3
             },
             ...hoverStyles
@@ -103,15 +103,14 @@ const Divider = props => {
     className: `dividerComponent`,
     style: {
       userSelect: "none",
-      position: "relative"
+      position: 'relative'
     },
     contentEditable: false,
     children: [!readOnly && /*#__PURE__*/_jsx("div", {
       className: `element-root element-selector`,
       contentEditable: false,
       style: {
-        zIndex: 1000,
-        left: "0%"
+        zIndex: 1000
       },
       children: /*#__PURE__*/_jsx(DividerToolbar, {
         selected: selected,
@@ -127,7 +126,7 @@ const Divider = props => {
         borderTop: !borderColor?.includes("linear") ? `${width} ${borderStyle} ${borderColor}` : `transparent`,
         backgroundImage: borderColor?.includes("linear") ? borderColor : "none",
         height: borderColor?.includes("linear") ? borderWidth : undefined,
-        marginTop: "15px"
+        marginTop: '15px'
       }
     }), /*#__PURE__*/_jsx("span", {
       style: {

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

@@ -19,15 +19,15 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
 const ToolBar = ({
   isEmpty,
   onSettings,
-  setOpenNav,
-  topM
+  setOpenNav
 }) => {
   return !isEmpty ? /*#__PURE__*/_jsxs("div", {
     className: "element-toolbar visible-on-hover",
     contentEditable: false,
     style: {
-      top: "-5px",
-      left: topM ? "35px" : "0px",
+      top: "0px",
+      right: "0px",
+      left: "auto",
       margin: "0px"
     },
     children: [/*#__PURE__*/_jsx(Tooltip, {
@@ -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,18 +76,6 @@ 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",
@@ -167,10 +155,7 @@ const Image = props => {
       }, {
         at: path
       });
-    },
-    MW: 32,
-    MH: 32,
-    MP: 2
+    }
   });
   const arr = Array.from(Node.elements(editor));
   const ele = arr.find(([elem]) => element === elem);
@@ -292,8 +277,7 @@ const Image = props => {
       children: [!readOnly && /*#__PURE__*/_jsx(ToolBar, {
         isEmpty: isEmpty,
         onSettings: onSettings,
-        setOpenNav: setOpenNav,
-        topM: size.width < 100
+        setOpenNav: setOpenNav
       }), /*#__PURE__*/_jsx(ImageContent, {
         ...element,
         readOnly: readOnly,

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

@@ -70,25 +70,13 @@ 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/Form/Form.js

@@ -1,6 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
 import { Transforms } from "slate";
-import { Node } from "slate";
 import { useSlateStatic, ReactEditor } from "slate-react";
 import { IconButton, Tooltip, Grid, Menu, MenuItem, CircularProgress, Box, Typography, useTheme } from "@mui/material";
 import DeleteIcon from "@mui/icons-material/Delete";
@@ -49,15 +48,7 @@ const Form = props => {
     textSize,
     fontFamily,
     textAlign,
-    alignment,
-    fieldFontFamily,
-    fieldFontWeight,
-    fieldTextSize,
-    fieldTextColor,
-    fieldBgColor,
-    fieldBorderColor,
-    fieldBorderWidth,
-    fieldBorderStyle
+    alignment
   } = element;
   const btnR = buttonProps?.borderRadius || {};
   const btnSpacing = buttonProps?.bannerSpacing || {};
@@ -199,24 +190,6 @@ const Form = props => {
     }, {
       at: path
     });
-    // adding form field style to the current form node 
-    const currentNode = Node.get(editor, path);
-    if (currentNode) {
-      currentNode.children.forEach((item, index) => {
-        Transforms.setNodes(editor, {
-          bgColor: data?.fieldBgColor ? data?.fieldBgColor : "rgba(255, 255, 255, 1)",
-          borderColor: data?.fieldBorderColor ? data?.fieldBorderColor : "#ccc",
-          borderStyle: data?.fieldBorderStyle ? data?.fieldBorderStyle : "",
-          borderWidth: data?.fieldBorderWidth ? data?.fieldBorderWidth : "",
-          textColor: data?.fieldTextColor ? data?.fieldTextColor : "",
-          fontFamily: data?.fieldFontFamily ? data?.fieldFontFamily : "",
-          textSize: data?.fieldTextSize ? data?.fieldTextSize : "",
-          fontWeight: data?.fieldFontWeight ? data?.fieldFontWeight : ""
-        }, {
-          at: [...path, index]
-        });
-      });
-    }
     onClose();
   };
   const onClose = () => {
@@ -225,16 +198,7 @@ const Form = props => {
   const onAddFormField = () => {
     try {
       Transforms.insertNodes(editor, {
-        ...formField({
-          fontFamily: fieldFontFamily,
-          fontWeight: fieldFontWeight,
-          textSize: fieldTextSize,
-          textColor: fieldTextColor,
-          bgColor: fieldBgColor,
-          borderColor: fieldBorderColor,
-          borderWidth: fieldBorderWidth,
-          borderStyle: fieldBorderStyle
-        })
+        ...formField()
       }, {
         at: [...path, children.length]
       });

package/dist/Editor/Elements/Form/FormElements/FormCheckbox.js

@@ -16,9 +16,6 @@ const FormCheckbox = props => {
     textColor,
     bgColor,
     lockSpacing,
-    textSize,
-    fontFamily,
-    fontWeight,
     ...rest
   } = fieldProps;
   const onChange = e => {
@@ -49,10 +46,7 @@ const FormCheckbox = props => {
         },
         borderStyle: borderStyle || "solid",
         color: textColor || "#000",
-        background: bgColor || "transparent",
-        fontFamily: fontFamily || "PoppinsRegular",
-        fontSize: textSize || "inherit",
-        fontWeight: `${fontWeight} !important` || "400 !important"
+        background: bgColor || "transparent"
       }
     })
   });

package/dist/Editor/Elements/Form/FormElements/FormDate.js

@@ -16,9 +16,6 @@ const FormDate = props => {
     textColor,
     bgColor,
     lockSpacing,
-    textSize,
-    fontFamily,
-    fontWeight,
     ...rest
   } = fieldProps;
   const onChange = e => {
@@ -50,10 +47,7 @@ const FormDate = props => {
         borderStyle: borderStyle || "solid",
         color: textColor || "#000",
         background: bgColor || "transparent",
-        paddingRight: '85px !important',
-        fontFamily: fontFamily || "PoppinsRegular",
-        fontSize: textSize || "inherit",
-        fontWeight: `${fontWeight} !important` || "400 !important"
+        paddingRight: '85px !important'
       }
     })
   });

package/dist/Editor/Elements/Form/FormElements/FormEmail.js

@@ -16,9 +16,6 @@ const FormEmail = props => {
     textColor,
     bgColor,
     lockSpacing,
-    textSize,
-    fontFamily,
-    fontWeight,
     ...rest
   } = fieldProps;
   const onChange = e => {
@@ -50,10 +47,7 @@ const FormEmail = props => {
         },
         borderStyle: borderStyle || "solid",
         color: textColor || "#000",
-        background: bgColor || "transparent",
-        fontFamily: fontFamily || "PoppinsRegular",
-        fontSize: textSize || "inherit",
-        fontWeight: `${fontWeight} !important` || "400 !important"
+        background: bgColor || "transparent"
       }
     })
   });

package/dist/Editor/Elements/Form/FormElements/FormNumbers.js

@@ -16,9 +16,6 @@ const FormNumbers = props => {
     textColor,
     bgColor,
     lockSpacing,
-    textSize,
-    fontFamily,
-    fontWeight,
     ...rest
   } = fieldProps;
   const onChange = e => {
@@ -66,10 +63,7 @@ const FormNumbers = props => {
         },
         borderStyle: borderStyle || "solid",
         color: textColor || "#000",
-        background: bgColor || "transparent",
-        fontFamily: fontFamily || "PoppinsRegular",
-        fontSize: textSize || "inherit",
-        fontWeight: `${fontWeight} !important` || "400 !important"
+        background: bgColor || "transparent"
       }
     })
   });

package/dist/Editor/Elements/Form/FormElements/FormRadioButton.js

@@ -16,9 +16,6 @@ const FormRadioButton = props => {
     textColor,
     bgColor,
     lockSpacing,
-    textSize,
-    fontFamily,
-    fontWeight,
     ...rest
   } = fieldProps;
   const onChange = e => {
@@ -49,10 +46,7 @@ const FormRadioButton = props => {
         },
         borderStyle: borderStyle || "solid",
         color: textColor || "#000",
-        background: bgColor || "transparent",
-        fontFamily: fontFamily || "PoppinsRegular",
-        fontSize: textSize || "inherit",
-        fontWeight: `${fontWeight} !important` || "400 !important"
+        background: bgColor || "transparent"
       }
     })
   });

package/dist/Editor/Elements/Form/FormElements/FormText.js

@@ -16,9 +16,6 @@ const FormText = props => {
     textColor,
     bgColor,
     lockSpacing,
-    textSize,
-    fontFamily,
-    fontWeight,
     ...rest
   } = fieldProps;
   const onChange = e => {
@@ -48,10 +45,7 @@ const FormText = props => {
         },
         borderStyle: borderStyle || "solid",
         color: textColor || "#000",
-        background: bgColor || "transparent",
-        fontSize: textSize || "inherit",
-        fontFamily: fontFamily || "PoppinsRegular",
-        fontWeight: `${fontWeight} !important` || "400 !important"
+        background: bgColor || "transparent"
       }
     })
   });

package/dist/Editor/Elements/Form/FormElements/FormTextArea.js

@@ -15,9 +15,6 @@ const FormTextArea = props => {
     borderColor,
     textColor,
     bgColor,
-    textSize,
-    fontFamily,
-    fontWeight,
     ...rest
   } = fieldProps;
   const onChange = e => {
@@ -48,9 +45,7 @@ const FormTextArea = props => {
         borderStyle: borderStyle || "solid",
         color: `${textColor || "#000"} !important`,
         background: `${bgColor || "transparent"} !important`,
-        fontSize: textSize || "14px",
-        fontFamily: fontFamily || "PoppinsRegular",
-        fontWeight: `${fontWeight} !important` || "400 !important"
+        fontSize: '14px'
       }
     })
   });

package/dist/Editor/Elements/Form/FormPopup.js

@@ -1,8 +1,7 @@
 import React from "react";
 import StyleBuilder from "../../common/StyleBuilder";
-import { formStyle } from "../../common/StyleBuilder/formStyle";
+import formStyle from "../../common/StyleBuilder/formStyle";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 const FormPopup = props => {
   const {
     element,
@@ -10,16 +9,14 @@ const FormPopup = props => {
     onClose,
     customProps
   } = props;
-  return /*#__PURE__*/_jsx(_Fragment, {
-    children: /*#__PURE__*/_jsx(StyleBuilder, {
-      title: "Form",
-      type: "formStyle",
-      element: element,
-      onSave: onSave,
-      onClose: onClose,
-      renderTabs: formStyle,
-      customProps: customProps
-    })
+  return /*#__PURE__*/_jsx(StyleBuilder, {
+    title: "Form",
+    type: "formStyle",
+    element: element,
+    onSave: onSave,
+    onClose: onClose,
+    renderTabs: formStyle,
+    customProps: customProps
   });
 };
 export default FormPopup;

package/dist/Editor/Elements/FreeGrid/FreeGrid.js

@@ -276,7 +276,7 @@ const FreeGrid = props => {
           ...insertFreeGridItem("table", {
             ...DEFAULT_TABLE_NODE()
           }, {
-            height: 150,
+            height: 130,
             width: 400
           })
         }], {

package/dist/Editor/Elements/FreeGrid/FreeGridItem.js

@@ -144,27 +144,8 @@ const FreeGridItem = props => {
   };
   const onAddFormField = () => {
     try {
-      const {
-        fieldFontFamily,
-        fieldFontWeight,
-        fieldTextSize,
-        fieldTextColor,
-        fieldBgColor,
-        fieldBorderColor,
-        fieldBorderWidth,
-        fieldBorderStyle
-      } = element?.children[0];
       Transforms.insertNodes(editor, {
-        ...formField({
-          fontFamily: fieldFontFamily ? fieldFontFamily : "",
-          fontWeight: fieldFontWeight ? fieldFontWeight : "",
-          textSize: fieldTextSize ? fieldTextSize : "",
-          textColor: fieldTextColor ? fieldTextColor : "",
-          bgColor: fieldBgColor ? fieldBgColor : "",
-          borderColor: fieldBorderColor ? fieldBorderColor : "",
-          borderWidth: fieldBorderWidth ? fieldBorderWidth : "",
-          borderStyle: fieldBorderStyle ? fieldBorderStyle : ""
-        })
+        ...formField()
       }, {
         at: [...path, 0, 0]
       });

package/dist/Editor/Elements/Grid/GridButton.js

@@ -1,9 +1,9 @@
 import React, { useState } from "react";
 import { Button, Dialog, DialogContent, DialogTitle, Grid, Tooltip, Box } from "@mui/material";
 import { insertGrid, insertPlainGrid } from "../../utils/grid";
+import { GridIcon } from "../../common/iconslist";
 import ToolbarIcon from "../../common/ToolbarIcon";
 import GridStyles from "./Styles";
-import { GridElement } from "../../common/iconListV2";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -46,7 +46,7 @@ const GridButton = props => {
     children: [/*#__PURE__*/_jsx(ToolbarIcon, {
       title: "Column",
       onClick: onButtonClick,
-      icon: /*#__PURE__*/_jsx(GridElement, {}),
+      icon: /*#__PURE__*/_jsx(GridIcon, {}),
       icoBtnType: icoBtnType
     }), /*#__PURE__*/_jsxs(Dialog, {
       open: open,

package/dist/Editor/Elements/Grid/GridItem.js

@@ -45,34 +45,29 @@ const GridItemToolbar = props => {
     onAddColumn,
     columnRef
   } = props;
-  return selected && !showTool ? /*#__PURE__*/_jsx(Popper, {
+  return selected && !showTool ? /*#__PURE__*/_jsxs(Popper, {
     anchorEl: columnRef?.current,
     open: true,
     placement: "top-end",
     sx: classes.popTools,
     className: "gi-tool-pp",
-    disablePortal: true,
-    contentEditable: false,
-    children: /*#__PURE__*/_jsxs(Box, {
-      className: "ico-grp-ss",
-      children: [/*#__PURE__*/_jsx(Tooltip, {
-        title: "Column Settings",
-        arrow: true,
-        children: /*#__PURE__*/_jsx(IconButton, {
-          size: "small",
-          onClick: onSettings,
-          children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
-        })
-      }), /*#__PURE__*/_jsx(Tooltip, {
-        title: "Add Column",
-        arrow: true,
-        children: /*#__PURE__*/_jsx(IconButton, {
-          size: "small",
-          onClick: onAddColumn,
-          children: /*#__PURE__*/_jsx(AddIcon, {})
-        })
-      })]
-    })
+    children: [/*#__PURE__*/_jsx(Tooltip, {
+      title: "Column Settings",
+      arrow: true,
+      children: /*#__PURE__*/_jsx(IconButton, {
+        size: "small",
+        onClick: onSettings,
+        children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
+      })
+    }), /*#__PURE__*/_jsx(Tooltip, {
+      title: "Add Column",
+      arrow: true,
+      children: /*#__PURE__*/_jsx(IconButton, {
+        size: "small",
+        onClick: onAddColumn,
+        children: /*#__PURE__*/_jsx(AddIcon, {})
+      })
+    })]
   }) : null;
 };
 const GridItem = props => {
@@ -298,26 +293,24 @@ const GridItem = props => {
     },
     "data-path": path.join(","),
     "data-info": "handle-outside-editor-click",
-    children: [!readOnly && /*#__PURE__*/_jsxs(_Fragment, {
-      children: [/*#__PURE__*/_jsxs("div", {
-        className: `element-selector ${selected ? "selected" : ""}`,
-        contentEditable: false,
-        style: {
-          zIndex: 1000
-        },
-        children: [/*#__PURE__*/_jsx("div", {
-          className: "element-selector-dots tl",
-          children: " "
-        }), /*#__PURE__*/_jsx("div", {
-          className: "element-selector-dots tr",
-          children: " "
-        }), /*#__PURE__*/_jsx("div", {
-          className: "element-selector-dots bl",
-          children: " "
-        }), /*#__PURE__*/_jsx("div", {
-          className: "element-selector-dots br",
-          children: " "
-        })]
+    children: [!readOnly && /*#__PURE__*/_jsxs("div", {
+      className: `element-selector ${selected ? "selected" : ""}`,
+      contentEditable: false,
+      style: {
+        zIndex: 1000
+      },
+      children: [/*#__PURE__*/_jsx("div", {
+        className: "element-selector-dots tl",
+        children: " "
+      }), /*#__PURE__*/_jsx("div", {
+        className: "element-selector-dots tr",
+        children: " "
+      }), /*#__PURE__*/_jsx("div", {
+        className: "element-selector-dots bl",
+        children: " "
+      }), /*#__PURE__*/_jsx("div", {
+        className: "element-selector-dots br",
+        children: " "
       }), /*#__PURE__*/_jsx(GridItemToolbar, {
         classes: classes,
         selected: selected,
@@ -358,14 +351,12 @@ const GridItem = props => {
       onMouseDown: onMouseDown,
       height: "auto"
     }) : null, /*#__PURE__*/_jsxs(Dialog, {
-      sx: classes.dialog,
       open: Boolean(alert),
       onClose: handleClose,
       children: [/*#__PURE__*/_jsx(DialogContent, {
         children: alert
       }), /*#__PURE__*/_jsx(DialogActions, {
         children: /*#__PURE__*/_jsx(Button, {
-          variant: "contained",
           onClick: handleClose,
           children: "Close"
         })

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

@@ -106,12 +106,6 @@ const GridStyles = (theme, appTheme) => ({
         }
       }
     }
-  },
-  dialog: {
-    "& .MuiPaper-root": {
-      background: appTheme?.palette?.editor?.background,
-      color: appTheme?.palette?.editor?.textColor
-    }
   }
 });
 export default GridStyles;

package/dist/Editor/Elements/Link/LinkButton.js

@@ -64,7 +64,7 @@ const LinkButton = props => {
       title: "Link",
       arrow: true,
       children: /*#__PURE__*/_jsx(IconButton, {
-        className: `${showInput ? "clicked btnActive" : ""} ${isActive ? "btnActive" : ""}`,
+        className: `${showInput ? "clicked" : ""} ${isActive ? "btnActive" : ""}`,
         format: "link",
         onClick: toggleLink,
         children: /*#__PURE__*/_jsx(Icon, {

package/dist/Editor/Elements/Search/SearchButton.js

@@ -91,7 +91,6 @@ const SearchButton = /*#__PURE__*/forwardRef((props, ref) => {
   const handleClose = () => {
     clearBrainText(editor);
     setAnchorEl(null);
-    setSearch("");
   };
   const handleClick = data => {
     insertBrain(editor, data, target || editor.selection);

package/dist/Editor/Elements/Signature/Signature.css

@@ -57,7 +57,7 @@
     cursor: pointer;
 }
   .upload-wrapper-ui {
-    border: 1.5px dashed #2563EB !important;
+    border: 1px dashed #92B1F5 !important;
     /* box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.17) !important; */
     border-radius: 7px;
     display: flex;