@flozy/editor 3.3.1 → 3.3.3

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

@@ -0,0 +1,145 @@
+import { ActionItemsIcon, BookIcon, CheckIcon,
+// ClarifyIcon,
+CloseIcon, DeleteIcon,
+// EditIcon,
+MakeShorterIcon, SummarizeIcon, TextAlignLeftIcon, ToneIcon, TranslateIcon, TryAgainIcon } from "../../assets/svg/AIIcons";
+export const MODES = {
+  default: 0,
+  translate: 1,
+  summarize: 2,
+  actionItems: 3,
+  grammatical: 4,
+  rephraseTone: 5,
+  longer: 6,
+  shorter: 7
+};
+
+// const improveWriting = {
+//   label: "Improve writing",
+//   value: "improve_writing",
+//   Icon: EditIcon,
+//   replace: true,
+// };
+
+const commonOptions = [{
+  label: "Make longer",
+  value: "make_longer",
+  Icon: TextAlignLeftIcon,
+  replace: false,
+  mode: MODES.longer
+}, {
+  label: "Make shorter",
+  value: "make_shorter",
+  Icon: MakeShorterIcon,
+  replace: false,
+  mode: MODES.shorter
+}
+// {
+//   label: "Continue writing",
+//   value: "continue_writing",
+//   Icon: EditIcon,
+//   replace: false,
+// },
+];
+
+export const newContentOptions = [{
+  group: "",
+  groupLabel: "",
+  options: [
+  // improveWriting,
+  ...commonOptions.map(o => ({
+    ...o,
+    replace: true
+  })), {
+    label: "Close",
+    value: "close",
+    Icon: CloseIcon,
+    replace: true
+  }]
+}];
+const languages = ["English", "Korean", "Chinese", "Japanese", "Russian", "French", "Portuguese", "German", "Italian", "Dutch", "Indonesian"];
+const translateOptions = [{
+  options: languages.map(l => ({
+    label: l,
+    value: l,
+    replace: false,
+    mode: MODES.translate
+  }))
+}];
+const tones = ["Professional", "Casual", "Straightforward", "Friendly"];
+const toneOptions = [{
+  options: tones.map(t => ({
+    label: t,
+    value: t,
+    replace: false,
+    mode: MODES.rephraseTone
+  }))
+}];
+export const editContentOptions = [{
+  group: "",
+  groupLabel: "Regenerate page",
+  options: [{
+    label: "Translate",
+    value: "translate",
+    Icon: TranslateIcon,
+    options: translateOptions,
+    replace: false
+  }, {
+    label: "Summarize",
+    value: "summarize",
+    Icon: SummarizeIcon,
+    replace: false,
+    mode: MODES.summarize
+  },
+  // {
+  //   label: "Clarify this",
+  //   value: "clarify",
+  //   Icon: ClarifyIcon,
+  //   replace: false,
+  // },
+  {
+    label: "Find action items",
+    value: "action_items",
+    Icon: ActionItemsIcon,
+    replace: false,
+    mode: MODES.actionItems
+  }]
+}, {
+  group: "",
+  groupLabel: "Edit or review page",
+  options: [{
+    label: "Fix spelling & grammar",
+    value: "spelling_&_grammar",
+    Icon: BookIcon,
+    replace: false,
+    mode: MODES.grammatical
+  },
+  // { ...improveWriting, replace: false },
+  ...commonOptions, {
+    label: "Change tone",
+    value: "change_tone",
+    Icon: ToneIcon,
+    options: toneOptions,
+    replace: false
+  }]
+}];
+export const generatedContentOptions = [{
+  group: "",
+  groupLabel: "",
+  options: [{
+    label: "Replace selection",
+    value: "replace_selection",
+    Icon: CheckIcon,
+    replace: true
+  }, ...commonOptions, {
+    label: "Try again",
+    value: "try_again",
+    Icon: TryAgainIcon,
+    replace: false
+  }, {
+    label: "Delete",
+    value: "close",
+    Icon: DeleteIcon,
+    replace: false
+  }]
+}];

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

@@ -24,6 +24,7 @@ const Form = props => {
   } = props;
   const {
     readOnly,
+    site_id,
     page_id,
     onFormSubmit
   } = customProps;
@@ -65,6 +66,13 @@ const Form = props => {
   const getFieldProps = (key = "", val = "") => {
     return element?.children?.find(obj => obj && obj[key] === val);
   };
+  const getFieldData = (key, type, field_type) => {
+    return element?.children?.filter(obj => obj && obj?.hasOwnProperty(key) && obj?.type === type && obj?.[key]?.includes(field_type));
+  };
+  const isMetaDataKey = (data, key) => {
+    let metaData = data?.find(meta => meta?.key === key);
+    return metaData;
+  };
   const handleSubmit = async (event, test = false) => {
     if (event) {
       event.preventDefault();
@@ -74,26 +82,45 @@ const Form = props => {
       setLoading(true);
       let response = {};
       let user_email = "";
+      let meta_data = [];
       const validations = [];
+      let metaFieldDataBoards = getFieldData('element_metadatakey', "form-field", "board");
       for (let pair of formData.entries()) {
         const emailObject = getFieldProps("element", "email");
         if (emailObject?.name === pair[0]) {
           user_email = pair[1];
         }
+        const isMetaKey = isMetaDataKey(metaFieldDataBoards, pair[0]);
+        if (isMetaKey) {
+          meta_data.push({
+            [isMetaKey?.element_metadatakey]: pair[1],
+            type: "board",
+            metadatamapping: element?.metadatamapping
+          });
+        }
         const fieldData = getFieldProps("name", pair[0]);
         let rule = [];
         if (fieldData?.required) {
           rule.push(`isRequired`);
         }
-        if (fieldData?.field_type === "email") {
+        if (fieldData?.element === "email") {
           rule.push(`isEmail`);
         }
-        if (fieldData?.required || fieldData?.field_type === "email") {
+        if (fieldData?.required || fieldData?.element === "email") {
           validations.push({
             name: pair[0],
             value: pair[1],
             field_type: fieldData?.field_type,
-            rules: rule && rule
+            rules: rule?.length > 0 && rule
+          });
+        }
+        if (isMetaKey?.isrequired) {
+          rule.push(`isRequired`);
+          validations.push({
+            name: pair[0],
+            value: pair[1],
+            field_type: isMetaKey?.placeholder,
+            rules: rule?.length > 0 && rule
           });
         }
         response = {
@@ -103,6 +130,7 @@ const Form = props => {
       }
       let params = {
         page_id: page_id,
+        site_id: site_id,
         form_id: `${formName}`,
         response: {
           ...response
@@ -112,7 +140,8 @@ const Form = props => {
           email: element?.email,
           form_workflow: element?.workflow,
           save_response: element?.saveResponse
-        }
+        },
+        meta_data: meta_data
       };
       const isValidForm = validations.length !== 0 && validation(validations);
       if (isValidForm) {

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

@@ -0,0 +1,54 @@
+import React from "react";
+import { Box } from "@mui/material";
+import { getTRBLBreakPoints, getBreakPointsValue } from "../../../helper/theme";
+import { jsx as _jsx } from "react/jsx-runtime";
+const FormCheckbox = props => {
+  const {
+    fieldProps
+  } = props;
+  const {
+    bannerSpacing,
+    height,
+    borderRadius,
+    borderStyle,
+    borderWidth,
+    borderColor,
+    textColor,
+    bgColor,
+    lockSpacing,
+    ...rest
+  } = fieldProps;
+  const onChange = e => {
+    e.preventDefault();
+  };
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: "100%",
+      display: "flex"
+    },
+    contentEditable: false,
+    children: /*#__PURE__*/_jsx(Box, {
+      component: "input",
+      ...rest,
+      type: "checkbox",
+      onChange: onChange,
+      sx: {
+        width: "100%",
+        border: `1px solid ${borderColor || "#FFF"}`,
+        padding: {
+          ...getTRBLBreakPoints(bannerSpacing)
+        },
+        height: height || "auto",
+        borderColor: borderColor || "transparent",
+        borderWidth: borderWidth || "1px",
+        borderRadius: {
+          ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
+        },
+        borderStyle: borderStyle || "solid",
+        color: textColor || "#000",
+        background: bgColor || "transparent"
+      }
+    })
+  });
+};
+export default FormCheckbox;

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

@@ -0,0 +1,55 @@
+import React from "react";
+import { Box } from "@mui/material";
+import { getTRBLBreakPoints, getBreakPointsValue } from "../../../helper/theme";
+import { jsx as _jsx } from "react/jsx-runtime";
+const FormDate = props => {
+  const {
+    fieldProps
+  } = props;
+  const {
+    bannerSpacing,
+    height,
+    borderRadius,
+    borderStyle,
+    borderWidth,
+    borderColor,
+    textColor,
+    bgColor,
+    lockSpacing,
+    ...rest
+  } = fieldProps;
+  const onChange = e => {
+    e.preventDefault();
+  };
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: "100%",
+      display: "flex"
+    },
+    contentEditable: false,
+    children: /*#__PURE__*/_jsx(Box, {
+      component: "input",
+      ...rest,
+      type: "date",
+      onChange: onChange,
+      sx: {
+        width: "100%",
+        border: `1px solid ${borderColor || "#FFF"}`,
+        padding: {
+          ...getTRBLBreakPoints(bannerSpacing)
+        },
+        height: height || "auto",
+        borderColor: borderColor || "transparent",
+        borderWidth: borderWidth || "1px",
+        borderRadius: {
+          ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
+        },
+        borderStyle: borderStyle || "solid",
+        color: textColor || "#000",
+        background: bgColor || "transparent",
+        paddingRight: '85px !important'
+      }
+    })
+  });
+};
+export default FormDate;

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

@@ -0,0 +1,54 @@
+import React from "react";
+import { Box } from "@mui/material";
+import { getTRBLBreakPoints, getBreakPointsValue } from "../../../helper/theme";
+import { jsx as _jsx } from "react/jsx-runtime";
+const FormNumbers = props => {
+  const {
+    fieldProps
+  } = props;
+  const {
+    bannerSpacing,
+    height,
+    borderRadius,
+    borderStyle,
+    borderWidth,
+    borderColor,
+    textColor,
+    bgColor,
+    lockSpacing,
+    ...rest
+  } = fieldProps;
+  const onChange = e => {
+    e.preventDefault();
+  };
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: "100%",
+      display: "flex"
+    },
+    contentEditable: false,
+    children: /*#__PURE__*/_jsx(Box, {
+      component: "input",
+      ...rest,
+      type: "number",
+      onChange: onChange,
+      sx: {
+        width: "100%",
+        border: `1px solid ${borderColor || "#FFF"}`,
+        padding: {
+          ...getTRBLBreakPoints(bannerSpacing)
+        },
+        height: height || "auto",
+        borderColor: borderColor || "transparent",
+        borderWidth: borderWidth || "1px",
+        borderRadius: {
+          ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
+        },
+        borderStyle: borderStyle || "solid",
+        color: textColor || "#000",
+        background: bgColor || "transparent"
+      }
+    })
+  });
+};
+export default FormNumbers;

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

@@ -0,0 +1,54 @@
+import React from "react";
+import { Box } from "@mui/material";
+import { getTRBLBreakPoints, getBreakPointsValue } from "../../../helper/theme";
+import { jsx as _jsx } from "react/jsx-runtime";
+const FormRadioButton = props => {
+  const {
+    fieldProps
+  } = props;
+  const {
+    bannerSpacing,
+    height,
+    borderRadius,
+    borderStyle,
+    borderWidth,
+    borderColor,
+    textColor,
+    bgColor,
+    lockSpacing,
+    ...rest
+  } = fieldProps;
+  const onChange = e => {
+    e.preventDefault();
+  };
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: "100%",
+      display: "flex"
+    },
+    contentEditable: false,
+    children: /*#__PURE__*/_jsx(Box, {
+      component: "input",
+      ...rest,
+      type: "radio",
+      onChange: onChange,
+      sx: {
+        width: "100%",
+        border: `1px solid ${borderColor || "#FFF"}`,
+        padding: {
+          ...getTRBLBreakPoints(bannerSpacing)
+        },
+        height: height || "auto",
+        borderColor: borderColor || "transparent",
+        borderWidth: borderWidth || "1px",
+        borderRadius: {
+          ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
+        },
+        borderStyle: borderStyle || "solid",
+        color: textColor || "#000",
+        background: bgColor || "transparent"
+      }
+    })
+  });
+};
+export default FormRadioButton;

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

@@ -1,9 +1,17 @@
 import FormEmail from "./FormEmail";
 import FormText from "./FormText";
 import FormTextArea from "./FormTextArea";
+import FormNumbers from "./FormNumbers";
+import FormDate from "./FormDate";
+import FormCheckbox from "./FormCheckbox";
+import FormRadioButton from "./FormRadioButton";
 const FormElements = {
   text: FormText,
   textArea: FormTextArea,
-  email: FormEmail
+  email: FormEmail,
+  numbers: FormNumbers,
+  date: FormDate,
+  checkbox: FormCheckbox,
+  radioButton: FormRadioButton
 };
 export default FormElements;

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

@@ -8,8 +8,8 @@ export const validationMethods = {
       return "Enter valid email address";
     }
   },
-  isRequired: value => {
-    return value === '' ? "Required fields should not be empty" : "";
+  isRequired: (value, field_type = "") => {
+    return value === '' ? `${field_type ? field_type : "Required"} fields should not be empty` : "";
   }
 };
 export const validation = fields => {
@@ -17,7 +17,7 @@ export const validation = fields => {
   let filedValue = [];
   fields.map(field => {
     let val = field.rules.map(vm => {
-      return validationMethods[vm](field["value"]);
+      return validationMethods[vm](field["value"], field["field_type"]);
     });
     return filedValue.push(...val);
   });

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

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import { Transforms } from "slate";
+import { Transforms, Node } from "slate";
 import { useSlateStatic, ReactEditor } from "slate-react";
 import { IconButton, Tooltip, Grid } from "@mui/material";
 import DeleteIcon from "@mui/icons-material/Delete";
@@ -25,9 +25,18 @@ const FormField = props => {
     children,
     ...elementProps
   } = element;
-  const FormElement = FormElements[elementType];
+  const et = elementType?.split(':');
+  const FormElement = FormElements[et[0]];
   const editor = useSlateStatic();
   const path = ReactEditor.findPath(editor, element);
+  const formPath = path.slice(0, path.length - 1);
+  const {
+    metadatamapping
+  } = Node?.get(editor, formPath) || {};
+  const updatedElement = {
+    ...element,
+    metadatamapping
+  };
   const [openSetttings, setOpenSettings] = useState(false);
   const onSettings = () => {
     setOpenSettings(true);
@@ -95,7 +104,7 @@ const FormField = props => {
     children: [!readOnly && /*#__PURE__*/_jsx(FieldToolbar, {}), /*#__PURE__*/_jsx(FormElement, {
       fieldProps: elementProps
     }), openSetttings ? /*#__PURE__*/_jsx(FieldPopup, {
-      element: element,
+      element: updatedElement,
       onSave: onSave,
       onClose: onClose,
       customProps: customProps

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/Link/LinkButton.js

@@ -37,12 +37,14 @@ const LinkButton = props => {
   };
   const toggleLink = () => {
     setSelection(editor.selection);
-    setLinkData({
-      name: Editor.string(editor, editor.selection),
-      url: blockProps?.href || "",
-      showInNewTab: true
-    });
-    setShowInput(true);
+    if (editor.selection) {
+      setLinkData({
+        name: Editor.string(editor, editor.selection),
+        url: blockProps?.href || "",
+        showInNewTab: true
+      });
+      setShowInput(true);
+    }
   };
   const handleInputChange = ({
     target

package/dist/Editor/Styles/EditorStyles.js

@@ -266,6 +266,10 @@ const editorStyles = ({
         padding: "0px"
       }
     }
+  },
+  cardsTypo: {
+    color: theme?.palette?.editor?.textColor,
+    fontSize: '14px !important'
   }
 });
 export default editorStyles;

package/dist/Editor/Toolbar/Basic/index.js

@@ -9,6 +9,7 @@ import ColorPickerButton from "../../common/ColorPickerButton";
 import { colors } from "../../Elements/Color Picker/defaultColors";
 import VariableButton from "../../Elements/Variables/VariableButton";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const allTools = toolbarGroups.flat();
 const BasicToolbar = props => {
@@ -66,12 +67,14 @@ const BasicToolbar = props => {
             item: true,
             children: /*#__PURE__*/_jsx(Tooltip, {
               title: "Font Color",
-              children: /*#__PURE__*/_jsx(ColorPickerButton, {
-                value: activeColor || "#0000",
-                onSave: color => {
-                  handleTextColor(color);
-                },
-                defaultColors: colors
+              children: /*#__PURE__*/_jsx(_Fragment, {
+                children: /*#__PURE__*/_jsx(ColorPickerButton, {
+                  value: activeColor || "#0000",
+                  onSave: color => {
+                    handleTextColor(color);
+                  },
+                  defaultColors: colors
+                })
               })
             })
           })]

package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/InfinityAITool.js

@@ -0,0 +1,24 @@
+import { Box, IconButton } from "@mui/material";
+import Icon from "../../../common/Icon";
+import { useEditorContext } from "../../../hooks/useMouseMove";
+import { jsx as _jsx } from "react/jsx-runtime";
+function InfinityAITool() {
+  const {
+    setOpenAI
+  } = useEditorContext();
+  return /*#__PURE__*/_jsx(Box, {
+    component: "div",
+    children: /*#__PURE__*/_jsx(IconButton, {
+      onClick: () => {
+        const text = window.getSelection().toString().trim();
+        if (text) {
+          setOpenAI("fromToolBar");
+        }
+      },
+      children: /*#__PURE__*/_jsx(Icon, {
+        icon: "infinityIcon"
+      })
+    })
+  });
+}
+export default InfinityAITool;

package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js

@@ -13,6 +13,7 @@ import PopperHeader from "../PopperHeader";
 import MiniColorPicker from "./MiniColorPicker";
 import SelectAlignment from "./SelectAlignment";
 import SelectFontSize from "./SelectFontSize";
+import InfinityAITool from "./InfinityAITool";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const DEFAULT_COLOR = {
@@ -26,7 +27,8 @@ const MiniTextFormat = props => {
   const {
     classes,
     editor,
-    closeMainPopup
+    closeMainPopup,
+    customProps
   } = props;
   const [anchorEl, setAnchorEl] = useState(null);
   const open = Boolean(anchorEl);
@@ -48,7 +50,7 @@ const MiniTextFormat = props => {
       xs: 12,
       children: /*#__PURE__*/_jsxs("div", {
         className: "toolWrapper",
-        children: [/*#__PURE__*/_jsx(SelectTypography, {
+        children: [customProps?.hideTools?.includes("infinityAI") ? null : /*#__PURE__*/_jsx(InfinityAITool, {}), /*#__PURE__*/_jsx(SelectTypography, {
           classes: classes,
           editor: editor,
           closeMainPopup: closeMainPopup