@flozy/editor 3.6.4 → 3.6.6

package/dist/Editor/ChatEditor.js

@@ -153,8 +153,15 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
         event,
         editor
       });
-    } else if (event.key === "Enter") {
-      onsubmit();
+    } else if (event.key === "Enter" && !event.shiftKey) {
+      const {
+        value: strVal,
+        ...restVal
+      } = getOnSaveData(value);
+      onsubmit(false, {
+        strVal,
+        restVal
+      });
     }
   }, [chars, editor, target, mentions, setMentions, search, type, mentionsRef]);
   const handleClose = () => {};

package/dist/Editor/Elements/AppHeader/AppHeader.js

@@ -146,19 +146,21 @@ function AppHeader(props) {
         src: appLogo
       }) : appTitle
     }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsx(List, {
-      children: menus.map((item, i) => /*#__PURE__*/_jsx(ListItem, {
-        disablePadding: true,
-        children: /*#__PURE__*/_jsx(ListItemButton, {
-          component: "a",
-          href: item.url,
-          sx: {
-            textAlign: "center"
-          },
-          children: /*#__PURE__*/_jsx(ListItemText, {
-            primary: item.text
+      children: menus.map((item, i) => {
+        const buttonProps = handleLinkType(item.url, item.linkType, true, item.target === "_blank");
+        return /*#__PURE__*/_jsx(ListItem, {
+          disablePadding: true,
+          children: /*#__PURE__*/_jsx(ListItemButton, {
+            ...buttonProps,
+            sx: {
+              textAlign: "center"
+            },
+            children: /*#__PURE__*/_jsx(ListItemText, {
+              primary: item.text
+            })
           })
-        })
-      }, `${item.text}_${i}`))
+        }, `${item.text}_${i}`);
+      })
     })]
   });
   const container = window !== undefined ? () => window().document.body : undefined;

package/dist/Editor/Elements/Embed/Frames/ImageFrame.js

@@ -119,7 +119,6 @@ const ImageFrame = props => {
         zIndex: 100
       },
       placement: "top",
-      disablePortal: true,
       children: /*#__PURE__*/_jsxs(Box, {
         sx: classes?.sliderContainer,
         children: [/*#__PURE__*/_jsx(ContinuousSlider, {

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

@@ -39,8 +39,7 @@ const UserInputs = props => {
           fontStyleOptions: ['underline'],
           hideLink: true,
           hideTextColor: true
-        },
-        theme: theme
+        }
       })
     })
   });

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

@@ -9,7 +9,6 @@ import { removeLink } from "../../utils/link";
 import LinkPopup from "./LinkPopup";
 import "./styles.css";
 import { absoluteLink } from "../../utils/helper";
-import { useEditorContext } from "../../hooks/useMouseMove";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const Link = props => {
@@ -30,9 +29,6 @@ const Link = props => {
   const path = ReactEditor.findPath(editor, element);
   const urlPath = element.url || element.href;
   const absLink = absoluteLink(urlPath);
-  const {
-    theme
-  } = useEditorContext();
   const updateLink = () => {
     Transforms.setNodes(editor, {
       href: linkData?.url,
@@ -111,8 +107,7 @@ const Link = props => {
       linkData: linkData,
       handleClose: handleClose,
       handleInputChange: handleInputChange,
-      handleInsertLink: updateLink,
-      theme: theme
+      handleInsertLink: updateLink
     })]
   });
 };

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

@@ -9,8 +9,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const LinkButton = props => {
   const {
-    editor,
-    theme
+    editor
   } = props;
   const linkInputRef = useRef(null);
   const [showInput, setShowInput] = useState(false);
@@ -78,8 +77,7 @@ const LinkButton = props => {
       linkData: linkData,
       handleClose: handleClose,
       handleInputChange: handleInputChange,
-      handleInsertLink: handleInsertLink,
-      theme: theme
+      handleInsertLink: handleInsertLink
     })]
   });
 };

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

@@ -1,7 +1,6 @@
 import React from "react";
 import { Dialog, DialogActions, DialogContent, DialogTitle, FormControl, FormControlLabel, Grid, TextField, Button, IconButton, Typography, Checkbox } from "@mui/material";
 import CloseIcon from "@mui/icons-material/Close";
-import LinkPopupStyles from "./LinkPopupStyles";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const LinkPopup = props => {
@@ -10,10 +9,8 @@ const LinkPopup = props => {
     handleClose,
     linkData,
     handleInputChange,
-    handleInsertLink,
-    theme
+    handleInsertLink
   } = props;
-  const classes = LinkPopupStyles(theme);
   return /*#__PURE__*/_jsxs(Dialog, {
     fullWidth: true,
     open: open,
@@ -47,16 +44,13 @@ const LinkPopup = props => {
         style: {
           paddingTop: "12px"
         },
-        className: classes.titleTypo,
         children: /*#__PURE__*/_jsx(TextField, {
           size: "small",
           fullWidth: true,
           value: linkData?.name,
           name: "name",
           placeholder: "Link Title",
-          onChange: handleInputChange,
-          sx: classes.addLinkField,
-          className: classes.addLinkField
+          onChange: handleInputChange
         })
       }), /*#__PURE__*/_jsx(Grid, {
         item: true,
@@ -70,9 +64,7 @@ const LinkPopup = props => {
           name: "url",
           value: linkData?.url,
           placeholder: "https://google.com",
-          onChange: handleInputChange,
-          sx: classes.addLinkField,
-          className: classes.addLinkField
+          onChange: handleInputChange
         })
       }), /*#__PURE__*/_jsx(Grid, {
         item: true,

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

@@ -117,7 +117,7 @@ const TableCell = props => {
     className: `editor-table-cell ${hasSelected ? "selection" : ""}`,
     style: {
       position: "relative",
-      background: bgColor || entireBgColor,
+      backgroundColor: bgColor || entireBgColor,
       border: `3px solid ${cellBorderColor}`,
       ...(sizeProps || {})
     },

package/dist/Editor/MiniEditor.js

@@ -23,8 +23,7 @@ const MiniEditor = props => {
     miniEditorPlaceholder,
     className,
     otherProps,
-    onSave,
-    theme
+    onSave
   } = props;
   const {
     CHARACTERS = []
@@ -133,7 +132,6 @@ const MiniEditor = props => {
     editor: editor,
     initialValue: content,
     onChange: onChange,
-    theme: theme,
     children: [/*#__PURE__*/_jsx(BasicToolbar, {
       ...props
     }), /*#__PURE__*/_jsx(Editable, {

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

@@ -25,8 +25,7 @@ const BasicToolbar = props => {
       hideTextColor = false,
       hideResetIcon = true,
       onResetClick = () => {}
-    },
-    theme
+    }
   } = props;
   // state
   const [activeColor, setActiveColor] = useState("#000000");
@@ -66,8 +65,7 @@ const BasicToolbar = props => {
             item: true,
             children: /*#__PURE__*/_jsx(LinkButton, {
               active: isBlockActive(editor, link.format),
-              editor: editor,
-              theme: theme
+              editor: editor
             }, link.id)
           }), !hideTextColor && /*#__PURE__*/_jsx(Grid, {
             item: true,

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

@@ -28,8 +28,7 @@ const MiniTextFormat = props => {
     classes,
     editor,
     closeMainPopup,
-    customProps,
-    theme
+    customProps
   } = props;
   const [anchorEl, setAnchorEl] = useState(null);
   const open = Boolean(anchorEl);
@@ -94,8 +93,7 @@ const MiniTextFormat = props => {
           className: "verticalLine ml-1 mr-1"
         }), /*#__PURE__*/_jsx(LinkButton, {
           active: isBlockActive(editor, link.format),
-          editor: editor,
-          theme: theme
+          editor: editor
         }, link.id), /*#__PURE__*/_jsx(Button, {
           onClick: e => setAnchorEl(document.getElementById("mini-text-editor-wrapper")),
           className: "textSettingsIcon",

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

@@ -91,8 +91,7 @@ const PopupTool = props => {
         editor: editor,
         classes: classes,
         closeMainPopup: handleClose,
-        customProps: customProps,
-        theme: theme
+        customProps: customProps
       })
     }) : /*#__PURE__*/_jsx(Popper, {
       id: id,
@@ -114,8 +113,7 @@ const PopupTool = props => {
             editor: editor,
             classes: classes,
             closeMainPopup: handleClose,
-            customProps: customProps,
-            theme: theme
+            customProps: customProps
           })
         })
       })

package/dist/Editor/common/LinkSettings/NavComponents.js

@@ -1,8 +1,24 @@
 import { Autocomplete, Checkbox, FormControlLabel, MenuItem, Select, TextField, Typography, createFilterOptions } from "@mui/material";
 import { useEffect, useMemo, useState } from "react";
+import { useSlate } from "slate-react";
 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 sectionTypes = ["grid"];
+const loopChildren = (children = [], sections) => {
+  if (!children?.length) {
+    return sections;
+  }
+  for (let child of children) {
+    if (sectionTypes.includes(child?.type)) {
+      if (child.id) {
+        sections.push(child.id);
+      }
+    }
+    sections = loopChildren(child.children, sections);
+  }
+  return sections;
+};
 const OpenInNewTab = props => {
   const {
     nav,
@@ -42,21 +58,35 @@ export const SelectPage = props => {
     services
   } = props;
   const [pages, setPages] = useState([]);
+  const editor = useSlate();
   const getPages = async () => {
     const result = await services("getPages", {});
-    const refactor = result?.data?.map(r => {
-      const {
-        title,
-        url_name,
-        ...rest
-      } = r;
-      return {
-        label: url_name,
-        value: url_name,
-        ...rest
+    if (result?.data?.length) {
+      const refactor = result?.data?.map(r => {
+        const {
+          title,
+          url_name,
+          ...rest
+        } = r;
+        return {
+          label: url_name,
+          value: url_name,
+          ...rest
+        };
+      });
+      setPages(refactor);
+    } else {
+      const currentPage = {
+        label: "Current Page",
+        value: "_currentPage",
+        is_current_page: 1,
+        sections: loopChildren(editor.children, [])
       };
-    });
-    setPages(refactor);
+      setPages([currentPage]);
+      if (!value) {
+        onChange(currentPage.value);
+      }
+    }
   };
   useEffect(() => {
     getPages();
@@ -76,12 +106,14 @@ export const SelectPage = props => {
     }
     return [];
   }, [value, pages]);
+  const isCurrentPage = page?.value === "_currentPage";
   return /*#__PURE__*/_jsxs("div", {
     children: [/*#__PURE__*/_jsx(FreeSoloCreateOption, {
       label: page?.label,
-      setValue: val => onChange(val?.value),
+      setValue: val => onChange(val?.value || ""),
       placeholder: "Select Page",
-      options: pages
+      options: pages,
+      disabled: isCurrentPage
     }), /*#__PURE__*/_jsx(FreeSoloCreateOption, {
       label: section?.label,
       setValue: val => {
@@ -96,7 +128,7 @@ export const SelectPage = props => {
         label: p,
         value: p
       }))
-    }), /*#__PURE__*/_jsx(OpenInNewTab, {
+    }), isCurrentPage ? null : /*#__PURE__*/_jsx(OpenInNewTab, {
       ...props
     })]
   });
@@ -149,7 +181,8 @@ export function FreeSoloCreateOption({
   label,
   setValue,
   options = [],
-  placeholder = ""
+  placeholder = "",
+  disabled = false
 }) {
   return /*#__PURE__*/_jsx(Autocomplete, {
     freeSolo: true,
@@ -164,7 +197,7 @@ export function FreeSoloCreateOption({
       children: option.label
     }),
     onChange: (event, newValue) => {
-      if (typeof newValue === 'string') {
+      if (typeof newValue === "string") {
         setValue({
           value: newValue
         });
@@ -189,7 +222,7 @@ export function FreeSoloCreateOption({
       } = params;
       // Suggest the creation of a new value
       const isExisting = options.some(option => inputValue === option.label);
-      if (inputValue !== '' && !isExisting) {
+      if (inputValue !== "" && !isExisting) {
         filtered.push({
           inputValue,
           label: `Add "${inputValue}"`
@@ -202,7 +235,7 @@ export function FreeSoloCreateOption({
     handleHomeEndKeys: true,
     getOptionLabel: option => {
       // Value selected with enter, right from the input
-      if (typeof option === 'string') {
+      if (typeof option === "string") {
         return option;
       }
       // Add "xxx" option created dynamically
@@ -214,6 +247,7 @@ export function FreeSoloCreateOption({
     },
     sx: {
       marginTop: "10px"
-    }
+    },
+    disabled: disabled
   });
 }

package/dist/Editor/common/MUIIcon/index.js

@@ -2,9 +2,8 @@ import React, { useEffect, useState } from "react";
 import { Box } from "@mui/material";
 import { jsx as _jsx } from "react/jsx-runtime";
 const iconLoader = async iconName => {
-  const iconAPI = process.env.ICON_API;
   try {
-    const iconResponse = await fetch(`${iconAPI}/${iconName}`);
+    const iconResponse = await fetch(`${process.env.ICON_API}/icon/${iconName}`);
     const icon = await iconResponse.text();
     return icon;
   } catch (error) {

package/dist/Editor/utils/helper.js

@@ -208,7 +208,13 @@ export const hasVerticalScrollbar = (element = {}) => {
   return element.scrollHeight > element.clientHeight;
 };
 const isHomePage = page => {
-  return page === "home" || page === "iframe.html" || !page;
+  return page === "home" || page === "iframe.html" || page === "_currentPage" || !page;
+};
+const getScrollElement = () => {
+  const slateWrapper = document.getElementById("slate-wrapper-scroll-container");
+  const isSlateWrapperScroll = hasVerticalScrollbar(slateWrapper);
+  const scrollFrom = isSlateWrapperScroll ? slateWrapper : window;
+  return scrollFrom;
 };
 export const handleLinkType = (url, linkType, readOnly, openInNewTab, onClick = () => {}) => {
   const props = {};
@@ -239,16 +245,33 @@ export const handleLinkType = (url, linkType, readOnly, openInNewTab, onClick =
       }
       break;
     case "page":
-      props.component = "a";
-      const [page, section] = url?.split("#") || [];
+      const [page = "", section] = url?.split("#") || [];
       const sec = section ? `#${section}` : "";
-      const currentUserPage = getCurrentUserPage();
-      props.href = isHomePage(page) ? `./${currentUserPage}${sec}` : `./${url}`;
-      if (openInNewTab) {
-        if (isCurrentPage(page)) {
-          // temp fix, if user is presented in current page, open in new tab option is restricted, we will scroll to the element in current page
-        } else {
-          props.target = "_blank";
+      if (page === "_currentPage") {
+        props.component = "button";
+        props.onClick = () => {
+          const scrollFrom = getScrollElement();
+          if (sec) {
+            const element = document.getElementById(section);
+            if (element) {
+              const topPosition = element.getBoundingClientRect().top + scrollFrom.scrollTop;
+              scrollFrom.scrollTo({
+                top: topPosition,
+                behavior: "smooth"
+              });
+            }
+          }
+        };
+      } else {
+        props.component = "a";
+        const currentUserPage = getCurrentUserPage();
+        props.href = isCurrentPage(page) ? `./${currentUserPage}${sec}` : `./${url}`;
+        if (openInNewTab) {
+          if (isCurrentPage(page)) {
+            // temp fix, if user is presented in current page, open in new tab option is restricted, we will scroll to the element in current page
+          } else {
+            props.target = "_blank";
+          }
         }
       }
       break;

package/package.json

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

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

@@ -1,28 +0,0 @@
-const LinkPopupStyles = theme => ({
-  addLinkField: {
-    "& .MuiOutlinedInput-input": {
-      fontSize: "12px",
-      fontWeight: 500,
-      color: `${theme?.palette?.editor?.textColor} !important`
-    },
-    "& .MuiFormHelperText-root": {
-      color: `${theme?.palette?.editor?.textColor} !important`
-    },
-    "& .MuiOutlinedInput-root": {
-      boxShadow: "0px 4px 10px rgba(0, 0, 0, 0.16)",
-      color: `${theme?.palette?.editor?.textColor} !important`,
-      borderRadius: "7px",
-      "& fieldset": {
-        borderColor: "#D8DDE1"
-      },
-      "&:hover fieldset": {
-        borderColor: "#64748B"
-      },
-      "&.Mui-focused fieldset": {
-        borderColor: "#2563EB"
-      },
-      "& .MuiFormLabel-root": {}
-    }
-  }
-});
-export default LinkPopupStyles;