@flozy/editor 4.6.1 → 4.6.2

package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js

@@ -71,11 +71,11 @@ const FormWorkflow = props => {
         children: [/*#__PURE__*/_jsx(Grid, {
           item: true,
           sx: classes.radioBtn,
-          children: /*#__PURE__*/_jsx(RadioGroup, {
+          children: /*#__PURE__*/_jsxs(RadioGroup, {
             name: "set timing",
             value: schedule,
             defaultValue: 1,
-            children: /*#__PURE__*/_jsx(FormControlLabel, {
+            children: [/*#__PURE__*/_jsx(FormControlLabel, {
               value: "immediately",
               label: "Immediately",
               onChange: () => {
@@ -84,7 +84,16 @@ const FormWorkflow = props => {
               control: /*#__PURE__*/_jsx(Radio, {
                 size: "small"
               })
-            })
+            }), /*#__PURE__*/_jsx(FormControlLabel, {
+              value: "after",
+              label: "After",
+              onChange: () => {
+                setSchedule("after");
+              },
+              control: /*#__PURE__*/_jsx(Radio, {
+                size: "small"
+              })
+            })]
           })
         }), schedule === "after" && /*#__PURE__*/_jsx(Grid, {
           item: true,

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

@@ -47,8 +47,7 @@ const FreeGrid = props => {
   } = element;
   const {
     readOnly,
-    customSX,
-    hideTools
+    customSX
   } = customProps;
   const {
     updated_at,
@@ -207,33 +206,6 @@ const FreeGrid = props => {
           at: [...insertAt]
         });
         break;
-      case "addSignature":
-        Transforms.insertNodes(editor, [{
-          type: "freegridItem",
-          childType: "signature",
-          children: [{
-            type: "signature",
-            children: [{
-              text: ""
-            }],
-            data: {
-              name: "",
-              email: "",
-              date: ""
-            }
-          }],
-          gridArea: "3 / 1 / 4 / 2",
-          left: 50,
-          marginTop: 0,
-          top: 0,
-          width: 217,
-          height: 173,
-          width_xs: 217,
-          height_xs: 173
-        }], {
-          at: [...insertAt]
-        });
-        break;
       case "addImage":
         Transforms.insertNodes(editor, [{
           type: "freegridItem",
@@ -343,26 +315,6 @@ const FreeGrid = props => {
           at: [...insertAt]
         });
         break;
-      case "addDivider":
-        Transforms.insertNodes(editor, [{
-          type: "freegridItem",
-          childType: "divider",
-          children: [{
-            type: "divider",
-            children: [{
-              text: ""
-            }]
-          }],
-          gridArea: "3 / 1 / 4 / 2",
-          left: 50,
-          marginTop: 0,
-          top: 0,
-          width: 170,
-          height: 30
-        }], {
-          at: [...insertAt]
-        });
-        break;
       default:
     }
     // focus on newly added element
@@ -405,7 +357,6 @@ const FreeGrid = props => {
       Transforms.removeNodes(editor, {
         at: Path.parent(path)
       });
-      setSelectedElement({});
     } catch (err) {
       console.log(err);
     }
@@ -435,7 +386,6 @@ const FreeGrid = props => {
       ...getBreakPointsValue(sectionBorderRadius || {}, null, "overrideBorderRadius", true)
     }
   }, theme);
-  const sectionTypeOptions = (itemOptions?.section || []).filter(f => (hideTools || []).indexOf(f) === -1);
   return /*#__PURE__*/_jsx(RnD, {
     id: `freegrid_container_${path.join("|")}_${updated_at}_${breakpoint}`,
     className: `
@@ -463,7 +413,7 @@ const FreeGrid = props => {
       bottomLeft: false,
       bottomRight: false
     },
-    actions: sectionTypeOptions,
+    actions: itemOptions?.section || [],
     type: "parent",
     optionsProps: {
       placement: "right",
@@ -484,8 +434,7 @@ const FreeGrid = props => {
         placement: "left",
         title: "Add Element",
         props: {
-          handleClick: handleAddElementClick,
-          hideTools: hideTools || []
+          handleClick: handleAddElementClick
         }
       },
       more: {
@@ -525,8 +474,6 @@ const FreeGrid = props => {
         backgroundSize: "cover"
       },
       "data-path": path.join("|"),
-      "data-dragoverid": path.join("|"),
-      "data-dragovertype": "parent",
       style: {
         "--cols": `100%`,
         "--rows": `repeat(${repeatTimes}, ${ROW_HEIGHT}px)`

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

@@ -190,8 +190,6 @@ const FreeGridBox = props => {
       ...attributes,
       className: "fgi_type_box freegrid-container-parent",
       "data-path": path.join("|"),
-      "data-dragoverid": path.join("|"),
-      "data-dragovertype": "parent",
       style: {
         "--height": `${height}px`,
         "--cols": `100%`,

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

@@ -28,8 +28,7 @@ const FreeGridItem = props => {
   const editor = useSlateStatic();
   const path = ReactEditor.findPath(editor, element);
   const {
-    readOnly,
-    hideTools
+    readOnly
   } = customProps;
   const {
     updated_at,
@@ -212,20 +211,17 @@ const FreeGridItem = props => {
         break;
     }
   };
-  const itemTypeOptions = (itemOptions[childType] || itemOptions?.default).filter(f => (hideTools || []).indexOf(f) === -1);
   return /*#__PURE__*/_jsx(RnD, {
     id: `freegrid_item_${path.join("|")}_${updated_at}_${breakpoint}`,
     className: `freegrid-item path-${path.length} breakpoint-${breakpoint}`,
     editor: editor,
     path: path,
-    actions: itemTypeOptions,
+    actions: itemOptions[childType] || itemOptions?.default,
     settingsProps: {
       settings: "freegridItem",
       onChange: onChangeSettings,
-      customProps,
-      onlyPopup: true // for signature popup in DnD
+      customProps
     },
-
     style: {
       "--left": `${left || 0}px`,
       "--marginTop": `${marginTop || 0}px`,

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

@@ -39,29 +39,15 @@ const FREE_GRID_ELEMENTS = [{
   actionType: "addAppHeader",
   label: "App Header",
   icon: "appHeader"
-}, {
-  actionType: "addSignature",
-  label: "Signature",
-  icon: "signature"
-}, {
-  actionType: "addDivider",
-  label: "Divider",
-  icon: "divider"
 }];
 const AddElement = props => {
   const {
-    handleClick,
-    hideTools
+    handleClick
   } = props;
-  const ADD_ELEMENTS = FREE_GRID_ELEMENTS.filter(f => (hideTools || []).indexOf(f.actionType) === -1);
   return /*#__PURE__*/_jsx(Box, {
-    sx: {
-      maxHeight: "500px",
-      overflowY: 'auto'
-    },
     children: /*#__PURE__*/_jsx(List, {
       className: "item-list-wrpr",
-      children: ADD_ELEMENTS.map(m => {
+      children: FREE_GRID_ELEMENTS.map(m => {
         return /*#__PURE__*/_jsxs(ListItemButton, {
           className: "item-wrapper",
           onClick: handleClick(m.actionType),

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

@@ -7,11 +7,8 @@ const boxOptions = ["settings", "link", "saveAsTemplate", "close"];
 const appHeaderOptions = ["settings", "saveAsTemplate", "close"];
 const tableOptions = ["drag", "edit", "settings", "saveAsTemplate", "close"];
 const embedScriptOptions = ["embedScript", "saveAsTemplate", "close"];
-const sectionOptions = ["addElementInSection", "settings", "moveUp", "moveDown", "saveAsTemplate", "more"];
+const sectionOptions = ["addElement", "settings", "moveUp", "moveDown", "saveAsTemplate", "more"];
 const formOptions = ["drag", "edit", "settings", "addFormField", "workFlow", "saveAsTemplate", "close"];
-const signatureOptions = ["signatureSettings", "saveAsTemplate", "close"];
-const signOptions = ["removeSign", "saveAsTemplate", "close"];
-const dividerOptions = ["settings", "saveAsTemplate", "close"];
 const itemOptions = {
   default: commonOptions,
   text: textOptions,
@@ -23,9 +20,6 @@ const itemOptions = {
   section: sectionOptions,
   table: tableOptions,
   embedScript: embedScriptOptions,
-  video: videoOptions,
-  signature: signatureOptions,
-  sign: signOptions,
-  divider: dividerOptions
+  video: videoOptions
 };
 export default itemOptions;

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

@@ -20,9 +20,6 @@ const useFreeGridStyles = ({
         marginLeft: `calc((100% - ${MAX_DEVICE_WIDTH}px) * 0.5)`,
         "&.active-drag": {
           pointerEvents: "none",
-          "& *": {
-            pointerEvents: "none"
-          },
           zIndex: "9999 !important"
         },
         "&.inactive-drag": {
@@ -163,51 +160,6 @@ const useFreeGridStyles = ({
             }
           }
         },
-        "& .fgi_type_signature": {
-          height: "100%",
-          "& .signature-container": {
-            height: "100%",
-            "& .signature-btn-container": {
-              height: "100%",
-              display: "flex",
-              flexDirection: "column",
-              "& .sign-placeholder": {
-                display: "flex",
-                // remove hidden sign placeholder
-                width: "100%",
-                background: theme?.palette?.editor?.background,
-                flexGrow: 1
-              },
-              "& button": {
-                margin: "6px 0px"
-              }
-            }
-          }
-        },
-        "& .fgi_type_sign": {
-          width: "100%",
-          height: "100%",
-          "& .signature-signed-wrapper": {
-            width: "100%",
-            height: "100%",
-            "& .signature-signed-span": {
-              width: "100%",
-              height: "100%",
-              "& .signed-btn": {
-                width: "100%",
-                height: "100%",
-                display: "flex",
-                flexDirection: "column",
-                "& img": {
-                  width: "100% !important",
-                  maxWidth: "none !important",
-                  height: "70% !important",
-                  flexGrow: 1
-                }
-              }
-            }
-          }
-        },
         "& .fgi_type_box": {
           display: "grid",
           width: "100%",
@@ -217,26 +169,9 @@ const useFreeGridStyles = ({
           "& .freegrid-item": {
             marginLeft: "0px"
             // pointerEvents: "none",
-          },
-
-          "&.rnd-dragOver": {
-            outline: "2px solid #116dff",
-            "&:before": {
-              content: '"Attach to Box"',
-              position: "absolute",
-              top: "-36px",
-              left: 0,
-              right: 0,
-              margin: "0px auto",
-              width: "fit-content",
-              background: "#116dff",
-              padding: "8px 12px",
-              color: "#FFF",
-              fontSize: "14px",
-              borderRadius: "7px"
-            }
           }
         },
+
         "& .fgi_type_form": {
           "& .form-field": {
             "& input": {
@@ -317,22 +252,6 @@ const useFreeGridStyles = ({
         [theme.breakpoints.between("xs", "md")]: {
           marginLeft: `calc((100% - 320px) * 0.5)`
         }
-      },
-      "&.rnd-dragOver": {
-        "&:before": {
-          content: '"Attact to this Section"',
-          position: "absolute",
-          top: 0,
-          left: 0,
-          right: 0,
-          margin: "0px auto",
-          width: "fit-content",
-          background: "#116dff",
-          padding: "8px 12px",
-          color: "#FFF",
-          fontSize: "14px",
-          borderRadius: "7px"
-        }
       }
     }
   },

package/dist/Editor/Elements/Signature/SignaturePopup.js

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import { Dialog, DialogTitle, DialogContent, DialogActions, Button, IconButton, Grid, TextField, Typography, Tabs, Tab, InputAdornment, Box } from "@mui/material";
+import { Dialog, DialogTitle, DialogContent, DialogActions, Button, IconButton, Grid, TextField, Typography, Tabs, Tab, InputAdornment } from "@mui/material";
 import CloseIcon from "@mui/icons-material/Close";
 import DatePicker from "react-datepicker";
 import "react-datepicker/dist/react-datepicker.css";
@@ -11,7 +11,6 @@ import { useEditorContext } from "../../hooks/useMouseMove";
 import { validationMethods } from "../Form/FormElements/validations";
 import { CalenderDownIconSignature, CalenderIconSignature } from "../../common/iconListV2";
 import ColorPickerButton from "../../common/ColorPickerButton";
-import { SignaturePlaceholderIcon } from "../../common/iconslist";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -25,8 +24,7 @@ const SignaturePopup = props => {
     onSave,
     onClear,
     customProps,
-    className,
-    onlyPopup
+    className
   } = props;
   const {
     readOnly,
@@ -54,9 +52,6 @@ const SignaturePopup = props => {
   };
   const handleClose = () => {
     setOpen(false);
-    if (props.handleClose) {
-      props.handleClose();
-    }
   };
   const handleSave = async () => {
     await customProps?.services("workFlowAction", {
@@ -130,28 +125,16 @@ const SignaturePopup = props => {
     isEmpty = signedData?.signature === "" && signedData?.signedText === "" || signedData?.signedBy === "" || signedData?.signedByEmail === "";
   }
   return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [onlyPopup ? null : /*#__PURE__*/_jsxs("div", {
+    children: [/*#__PURE__*/_jsx("div", {
       className: `signature-btn-container`,
-      contentEditable: false,
-      children: [/*#__PURE__*/_jsxs(Box, {
-        className: "sign-placeholder",
-        children: [/*#__PURE__*/_jsx(SignaturePlaceholderIcon, {}), /*#__PURE__*/_jsx(Typography, {
-          variant: "body2",
-          style: {
-            color: "#A2B0B9"
-          },
-          children: "Your sign will be placed here"
-        })]
-      }), /*#__PURE__*/_jsx(Button, {
+      children: /*#__PURE__*/_jsx(Button, {
+        contentEditable: false,
         onClick: handleOpen,
-        style: {
-          width: "fit-content"
-        },
         children: "Sign Here"
-      })]
+      })
     }), /*#__PURE__*/_jsx(Dialog, {
       className: `${className} dialogComp`,
-      open: onlyPopup || open,
+      open: open,
       onClose: handleClose,
       fullWidth: true,
       PaperProps: {

package/dist/Editor/Elements/Signature/Signed.js

@@ -47,7 +47,7 @@ const Signed = props => {
         src: signature,
         alt: "signature",
         style: {
-          maxWidth: "200px",
+          width: "200px",
           height: "auto",
           marginBottom: "4px"
         }

package/dist/Editor/Elements/SimpleText/index.js

@@ -6,7 +6,6 @@ import { isTextSelected } from "../../utils/helper";
 import { useEditorContext } from "../../hooks/useMouseMove";
 import SimpleTextStyle from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { createElement as _createElement } from "react";
 const SimpleText = props => {
@@ -48,18 +47,20 @@ const SimpleText = props => {
     sx: classes.root,
     key: `para_${path.join("|")}`
   }, children, openAI ? null : /*#__PURE__*/_jsx("span", {
-    contentEditable: false,
     className: "placeholder-simple-text",
-    children: isEmptyEditor ? editorPlaceholder || "Write Something..." : showPlaceHolder ? opacity && selected ? /*#__PURE__*/_jsxs(_Fragment, {
-      children: ["Type ", /*#__PURE__*/_jsx("span", {
-        contentEditable: false,
+    contentEditable: false,
+    children: isEmptyEditor ? editorPlaceholder || "Write Something..." : showPlaceHolder ? opacity && selected ? /*#__PURE__*/_jsxs("span", {
+      className: "placeholder-simple-text-default",
+      contentEditable: false,
+      children: ["Type", " ", /*#__PURE__*/_jsx("span", {
         style: {
-          backgroundColor: '#F2F6FA',
+          backgroundColor: "#F2F6FA",
           padding: "0px 2px",
           borderRadius: "2px"
         },
+        contentEditable: false,
         children: "/"
-      }), " to browse elements"]
+      }), " ", "to browse elements"]
     }) : "" : ""
   }));
 };

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

@@ -23,7 +23,7 @@ const TableRow = props => {
   return /*#__PURE__*/_jsx("tr", {
     ...attributes,
     style: {
-      backgroundColor: bgColor,
+      background: bgColor,
       border: rowBorderColor ? `1px solid ${rowBorderColor}` : ""
     },
     children: children

package/dist/Editor/Styles/EditorStyles.js

@@ -215,7 +215,7 @@ const editorStyles = ({
     },
     "& .content-editable.empty": {
       "&:after": {
-        color: theme?.palette?.type === "dark" ? "#99A5B6" : placeHolderColor
+        color: placeHolderColor
       }
     },
     "& .checkbox-edit": {
@@ -286,7 +286,7 @@ const editorStyles = ({
       }
     },
     "& ::selection": {
-      color: "inherit",
+      color: "black",
       background: "#EAEBFE"
     }
   },

package/dist/Editor/Toolbar/Mini/MiniToolbar.js

@@ -123,7 +123,8 @@ const MiniToolbar = props => {
         label,
         icon: Icon
       }) => {
-        const isDisabled = popupType === type || type === "undo" ? !canUndo : type === "redo" ? !canRedo : false;
+        const isDisabled = popupType === type || type === "undo" ? !canUndo : type === "redo" ? !canRedo : false; // for textFormat type
+
         return /*#__PURE__*/_jsx(Tooltip, {
           arrow: true,
           title: label,

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

@@ -1,28 +1,22 @@
 import React from "react";
-import { Box, Button, Card, CardMedia, Grid } from "@mui/material";
+import { Box, Card, CardMedia, Grid } from "@mui/material";
+
+// const Select = (props) => {
+//     const { classes, data, onSelectTemplate } = props;
+//     return (
+//         <Box
+//             className="template-card-action"
+//             component={"div"}
+//             sx={classes.templateCardBtnGrp}
+//             style={{ padding: 0, background: "transparent"}}
+//         >
+//             <Button className="blueBtn" onClick={onSelectTemplate(data)}>
+//                 Select
+//             </Button>
+//         </Box>
+//     );
+// };
 import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const Select = props => {
-  const {
-    classes,
-    data,
-    onSelectTemplate
-  } = props;
-  return /*#__PURE__*/_jsx(Box, {
-    className: "template-card-action",
-    component: "div",
-    sx: classes.templateCardBtnGrp,
-    style: {
-      padding: 0,
-      background: "transparent"
-    },
-    children: /*#__PURE__*/_jsx(Button, {
-      className: "blueBtn",
-      onClick: onSelectTemplate(data),
-      children: "Select"
-    })
-  });
-};
 const ButtonTemplateCard = props => {
   const {
     classes,
@@ -34,19 +28,19 @@ const ButtonTemplateCard = props => {
     xs: 3,
     children: /*#__PURE__*/_jsx(Card, {
       sx: classes.paperOverrides,
-      children: /*#__PURE__*/_jsxs(Box, {
+      children: /*#__PURE__*/_jsx(Box, {
         sx: classes.buttonCardMediaWrpr,
-        children: [/*#__PURE__*/_jsx(CardMedia, {
-          className: `template-card-media`,
-          component: "div",
-          image: m?.thumbnail,
-          alt: m?.title,
-          sx: classes.buttonCardMedia
-        }), /*#__PURE__*/_jsx(Select, {
-          classes: classes,
-          onSelectTemplate: onSelectTemplate,
-          data: m
-        })]
+        onClick: onSelectTemplate(m),
+        children: /*#__PURE__*/_jsx("div", {
+          className: "img-wrapper",
+          children: /*#__PURE__*/_jsx(CardMedia, {
+            className: `template-card-media`,
+            component: "div",
+            image: m?.thumbnail,
+            alt: m?.title,
+            sx: classes.buttonCardMedia
+          })
+        })
       })
     })
   }, `template_${m.id}`);

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

@@ -1,27 +1,22 @@
 import React from "react";
-import { Box, Button, Card, CardMedia, Grid } from "@mui/material";
+import { Box, Card, CardMedia, Grid } from "@mui/material";
+
+// const Select = (props) => {
+//     const { classes, data, onSelectTemplate } = props;
+//     return (
+//         <Box
+//             className="template-card-action"
+//             component={"div"}
+//             sx={classes.templateCardBtnGrp}
+//             style={{background: "transparent"}}
+//         >
+//             <Button className="blueBtn" onClick={onSelectTemplate(data)}>
+//                 Select
+//             </Button>
+//         </Box>
+//     );
+// };
 import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const Select = props => {
-  const {
-    classes,
-    data,
-    onSelectTemplate
-  } = props;
-  return /*#__PURE__*/_jsx(Box, {
-    className: "template-card-action",
-    component: "div",
-    sx: classes.templateCardBtnGrp,
-    style: {
-      background: "transparent"
-    },
-    children: /*#__PURE__*/_jsx(Button, {
-      className: "blueBtn",
-      onClick: onSelectTemplate(data),
-      children: "Select"
-    })
-  });
-};
 const FullViewCard = props => {
   const {
     classes,
@@ -35,19 +30,19 @@ const FullViewCard = props => {
     children: /*#__PURE__*/_jsx(Card, {
       sx: classes.paperOverrides,
       className: "paperOverrides",
-      children: /*#__PURE__*/_jsxs(Box, {
-        sx: classes.buttonCardMediaWrpr,
-        children: [/*#__PURE__*/_jsx(CardMedia, {
-          component: "div",
-          image: m?.thumbnail,
-          alt: m?.title,
-          sx: classes.fullViewCardMedia,
-          className: height
-        }), /*#__PURE__*/_jsx(Select, {
-          classes: classes,
-          onSelectTemplate: onSelectTemplate,
-          data: m
-        })]
+      children: /*#__PURE__*/_jsx(Box, {
+        sx: classes.fullViewCardMediaWrpr,
+        onClick: onSelectTemplate(m),
+        children: /*#__PURE__*/_jsx("div", {
+          className: "img-wrapper",
+          children: /*#__PURE__*/_jsx(CardMedia, {
+            component: "div",
+            image: m?.thumbnail,
+            alt: m?.title,
+            sx: classes.fullViewCardMedia,
+            className: height
+          })
+        })
       })
     })
   }, `template_${m.id}`);