@flozy/editor 3.8.9 → 3.9.0

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

@@ -1,184 +0,0 @@
-import React from "react";
-import { Transforms, Node, Path } from "slate";
-import { useSlateStatic } from "slate-react";
-import { ReactEditor } from "slate-react";
-import { Box, useTheme } from "@mui/material";
-import RnD from "../../common/RnD";
-import { onDropItem } from "../../common/RnD/Utils/gridDropItem";
-import useBreakpoints from "../../hooks/useBreakpoints";
-import { breakpointValues, formatBreakpointValues } from "./breakpointConstants";
-import { useEditorContext } from "../../hooks/useMouseMove";
-import focusOnNewItem from "../../helper/RnD/focusOnNewItem";
-import { bringItemToFB } from "../../helper";
-import itemOptions from "./Options/sectionItemOptions";
-import { jsx as _jsx } from "react/jsx-runtime";
-const FreeGridItem = props => {
-  const theme = useTheme();
-  const breakpoint = useBreakpoints(theme);
-  const {
-    element,
-    attributes,
-    children,
-    customProps
-  } = props;
-  const editor = useSlateStatic();
-  const path = ReactEditor.findPath(editor, element);
-  const {
-    readOnly
-  } = customProps;
-  const {
-    updated_at,
-    childType,
-    zIndex
-  } = element;
-  // get values based on breakpoint size
-  const {
-    gridArea,
-    width,
-    height,
-    left,
-    top,
-    marginTop
-  } = breakpointValues(element.type, breakpoint, element);
-  const {
-    setSelectedElement
-  } = useEditorContext();
-  const arrangeIndex = zIndex === undefined ? path[path.length - 1] : zIndex;
-  const onChangeSettings = () => {};
-  const onChange = data => {
-    let updateData = {
-      ...data
-    };
-    delete updateData.children;
-    updateData = formatBreakpointValues(element.type, breakpoint, updateData);
-    Transforms.setNodes(editor, {
-      ...updateData
-    }, {
-      at: path
-    });
-  };
-  const handleDragEvent = (type, data, cb) => {
-    const toPosition = {
-      left: left + data.lastX,
-      top: top + data.lastY
-    };
-    const {
-      node,
-      ...rest
-    } = data;
-    switch (type) {
-      case "stop":
-        const updated_data = onDropItem({
-          editor,
-          fromPosition: {
-            left,
-            top
-          },
-          toPosition,
-          path,
-          ref: node,
-          breakpoint,
-          ...rest
-        }, ".freegrid-container");
-        if (cb) {
-          cb(updated_data);
-        }
-        break;
-      default:
-    }
-  };
-  const handleResizeEvent = (type, data, cb) => {
-    switch (type) {
-      case "stop":
-        return;
-      default:
-    }
-  };
-  const onDelete = () => {
-    try {
-      Transforms.removeNodes(editor, {
-        at: path
-      });
-    } catch (err) {
-      console.log(err);
-    }
-  };
-  const handleContextMenuClick = d => {
-    switch (d?.name) {
-      case "bringForward":
-        bringItemToFB(editor, {
-          path,
-          moveFront: true
-        });
-        break;
-      case "bringBackward":
-        bringItemToFB(editor, {
-          path,
-          moveFront: false
-        });
-        break;
-      case "cut":
-        window.copiedNode = JSON.stringify(Node.get(editor, path));
-        onDelete();
-        focusOnNewItem(editor, Path.parent(path), {
-          setSelectedElement
-        });
-        break;
-      case "copy":
-        window.copiedNode = JSON.stringify(Node.get(editor, path));
-        break;
-      case "delete":
-        onDelete();
-        setSelectedElement({});
-        break;
-      default:
-        return;
-    }
-  };
-  const handleActionClick = type => {
-    console.log(type);
-  };
-  return /*#__PURE__*/_jsx(RnD, {
-    id: `freegrid_item_${path.join("|")}_${updated_at}_${breakpoint}`,
-    className: `freegrid-item breakpoint-${breakpoint}`,
-    editor: editor,
-    path: path,
-    actions: itemOptions[childType] || itemOptions?.default,
-    settingsProps: {
-      settings: "freegridItem",
-      onChange: onChangeSettings,
-      customProps
-    },
-    style: {
-      "--left": `${left || 0}px`,
-      "--marginTop": `${marginTop || 0}px`,
-      "--gridArea": `${gridArea}`,
-      "--width": `${width}px`,
-      "--height": `${height}px`,
-      "--zIndex": 100 + arrangeIndex
-    },
-    defaultStyle: {
-      height: `${height}px`,
-      width: `${width}px`
-    },
-    gridArea: gridArea,
-    onChange: onChange,
-    delta: {
-      width,
-      height
-    },
-    handleDragEvent: handleDragEvent,
-    handleResizeEvent: handleResizeEvent,
-    readOnly: readOnly,
-    childType: childType || "",
-    handleContextMenuClick: handleContextMenuClick,
-    handleActionClick: handleActionClick,
-    children: /*#__PURE__*/_jsx(Box, {
-      component: "div",
-      ...attributes,
-      className: `fgi_type_${childType}`,
-      children: children
-    })
-  });
-};
-export default FreeGridItem;

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

@@ -1,36 +0,0 @@
-import React from "react";
-import { Box, List, ListItemButton } from "@mui/material";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const AddElement = props => {
-  const {
-    handleClick
-  } = props;
-  return /*#__PURE__*/_jsx(Box, {
-    children: /*#__PURE__*/_jsxs(List, {
-      className: "item-list-wrpr",
-      children: [/*#__PURE__*/_jsx(ListItemButton, {
-        className: "item-wrapper",
-        onClick: handleClick("addText"),
-        children: "Text"
-      }), /*#__PURE__*/_jsx(ListItemButton, {
-        className: "item-wrapper",
-        onClick: handleClick("addButton"),
-        children: "Button"
-      }), /*#__PURE__*/_jsx(ListItemButton, {
-        className: "item-wrapper",
-        onClick: handleClick("addImage"),
-        children: "Image"
-      }), /*#__PURE__*/_jsx(ListItemButton, {
-        className: "item-wrapper",
-        onClick: handleClick("addVideo"),
-        children: "Video"
-      }), /*#__PURE__*/_jsx(ListItemButton, {
-        className: "item-wrapper",
-        onClick: handleClick("addBox"),
-        children: "Box"
-      })]
-    })
-  });
-};
-export default AddElement;

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

@@ -1,24 +0,0 @@
-import React from "react";
-import { Box, List, ListItemButton } from "@mui/material";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const More = props => {
-  const {
-    handleClick
-  } = props;
-  return /*#__PURE__*/_jsx(Box, {
-    children: /*#__PURE__*/_jsxs(List, {
-      className: "item-list-wrpr",
-      children: [/*#__PURE__*/_jsx(ListItemButton, {
-        className: "item-wrapper",
-        onClick: handleClick("addSection"),
-        children: "Add Section"
-      }), /*#__PURE__*/_jsx(ListItemButton, {
-        className: "item-wrapper",
-        onClick: handleClick("duplicateSection"),
-        children: "Duplicate Section"
-      })]
-    })
-  });
-};
-export default More;

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

@@ -1,47 +0,0 @@
-import React from "react";
-import { Transforms, Node } from "slate";
-import { Box } from "@mui/material";
-import { StyleContent } from "../../../common/StyleBuilder";
-import sectionStyle from "../../../common/StyleBuilder/sectionStyle";
-import { jsx as _jsx } from "react/jsx-runtime";
-const SectionSettings = props => {
-  const {
-    editor,
-    path,
-    classes
-  } = props;
-  const element = Node.get(editor, path);
-  const styleMaps = sectionStyle?.filter(f => !f?.hideOnFGS);
-  const onChange = data => {
-    const updated_props = {
-      ...element,
-      ...data,
-      field_type: data?.element
-    };
-    delete updated_props.children;
-    Transforms.setNodes(editor, {
-      ...updated_props
-    }, {
-      at: path
-    });
-  };
-  const handleClose = () => {
-    console.log("close");
-  };
-  return /*#__PURE__*/_jsx(Box, {
-    component: "div",
-    className: "style-settings-wrpr",
-    sx: classes.sectionSettingsPopper,
-    children: styleMaps?.map((m, i) => {
-      return /*#__PURE__*/_jsx(StyleContent, {
-        renderTabs: sectionStyle,
-        value: m.value,
-        element: element,
-        onChange: onChange,
-        customProps: {},
-        handleClose: handleClose
-      }, `tab_${m.value}_$${i}`);
-    })
-  });
-};
-export default SectionSettings;

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

@@ -1,11 +0,0 @@
-const commonOptions = ["drag", "edit", "settings", "close"];
-const textOptions = ["drag", "edit", "settings", "link", "close"];
-const buttonOptions = ["drag", "edit", "settings", "link", "close"];
-const imageOptions = ["drag", "edit", "settings", "link", "close"];
-const itemOptions = {
-  default: commonOptions,
-  text: textOptions,
-  button: buttonOptions,
-  image: imageOptions
-};
-export default itemOptions;

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

@@ -1,75 +0,0 @@
-const breakpointConstants = {
-  freegrid: ["height"],
-  freegridItem: ["left", "top", "marginTop", "width", "height", "gridArea"],
-  freegridBox: ["left", "top", "marginTop", "width", "height", "gridArea"]
-};
-export function CssVar(device = "lg", key, props) {
-  const keyTo = `${key}_${device}`;
-  const value = props[keyTo] === undefined ? props[key] : props[keyTo];
-  return value;
-}
-export function breakpointValues(type, breakpoint = "lg", props) {
-  try {
-    const breakpointDatas = breakpointConstants[type]?.reduce((a, b) => {
-      const bpKey = `${b}_${breakpoint}`;
-      a[b] = props[bpKey] === undefined ? props[b] : props[bpKey];
-      return a;
-    }, {});
-    return breakpointDatas;
-  } catch (err) {
-    console.log(err);
-    return {};
-  }
-}
-export function formatBreakpointValues(type, breakpoint = "lg", data) {
-  try {
-    const bpValues = breakpointConstants[type];
-    if (breakpoint === "lg") {
-      return data;
-    } else {
-      let rtData = {};
-      Object.keys(data).forEach(key => {
-        if (bpValues.indexOf(key) > -1) {
-          rtData[`${key}_${breakpoint}`] = data[key];
-        } else {
-          rtData[key] = data[key];
-        }
-      });
-      return rtData;
-    }
-  } catch (err) {
-    console.log(err);
-    return {};
-  }
-}
-export function wrapThemeBreakpoints(sxProp, prop, theme) {
-  try {
-    const formatedSxProp = Object.keys(sxProp).reduce((a, b) => {
-      switch (b) {
-        case "md":
-          a[theme.breakpoints.up("lg")] = {
-            [prop]: sxProp["md"] || sxProp["lg"]
-          };
-          break;
-        case "sm":
-          a[theme.breakpoints.up("lg")] = {
-            [prop]: sxProp["sm"] || sxProp["lg"]
-          };
-          break;
-        case "xs":
-          a[theme.breakpoints.between("xs", "md")] = {
-            [prop]: sxProp["xs"] || sxProp["lg"]
-          };
-          break;
-        default:
-          a[theme.breakpoints.up("lg")] = {
-            [prop]: sxProp["lg"]
-          };
-      }
-      return a;
-    }, {});
-    return formatedSxProp;
-  } catch (err) {
-    console.log(err);
-  }
-}

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

@@ -1,159 +0,0 @@
-const useFreeGridStyles = ({
-  theme,
-  MAX_DEVICE_WIDTH
-}) => ({
-  root: {
-    "&.freegrid-container": {
-      display: "grid",
-      gridTemplateColumns: "var(--cols)",
-      gridTemplateRows: "var(--rows)",
-      gridGap: "0px",
-      backgroundColor: "#FFF",
-      padding: "0px",
-      height: "100%",
-      position: "static",
-      overflow: "hidden",
-      "& .freegrid-item, & .freegrid-box-item": {
-        gridArea: "var(--gridArea)",
-        left: "var(--left)",
-        marginTop: "var(--marginTop)",
-        marginLeft: `calc((100% - ${MAX_DEVICE_WIDTH}px) * 0.5)`,
-        zIndex: "var(--zIndex) !important",
-        "&.active-drag": {},
-        "&.inactive-drag": {},
-        "& .editor-blocker": {
-          position: "absolute",
-          left: 0,
-          top: 0,
-          width: "100%",
-          height: "100%",
-          background: "rgba(0,0,0,0)",
-          border: 0,
-          outline: 0
-        },
-        "&.enable-1, &.enable-2": {
-          "&.type_text": {
-            // height: "fit-content !important",
-          }
-        },
-        "&.enable-1:before, &.enable-2:before": {
-          position: "absolute",
-          content: "attr(placeholder)",
-          top: "-22px",
-          left: "-2px",
-          padding: "2px 4px",
-          backgroundColor: "#2563EB",
-          color: "#FFF",
-          fontSize: "12px",
-          borderTopLeftRadius: "2px",
-          borderTopRightRadius: "2px",
-          width: "auto",
-          height: "16px"
-        },
-        "&:hover": {
-          "& .debug-info": {
-            opacity: 1
-          }
-        },
-        "& .debug-info": {
-          position: "absolute",
-          top: "calc(100% + 8px)",
-          pointerEvents: "none",
-          left: 0,
-          background: "rgba(0,0,0,0.2)",
-          color: "red",
-          width: "100%",
-          padding: "6px",
-          opacity: 0
-        },
-        "&.enable-1": {
-          "&.type_text": {
-            "*": {
-              "::selection": {
-                backgroundColor: "transparent !important",
-                color: "inherit !important"
-              }
-            }
-          }
-        },
-        /** for element items */
-        "& .fgi_type_image, & .fgi_type_video": {
-          height: "100%",
-          "& .embed": {
-            height: "100%",
-            "& .embed-image-wrpr, & .embed-video-wrpr-in, & .element-empty-btn": {
-              height: "100%"
-            }
-          }
-        },
-        "& .fgi_type_button": {
-          height: "100%",
-          "& .editor-btn-wrapper": {
-            height: "100%",
-            "& .editor-btn-wrapper-inner": {
-              width: "100%",
-              height: "100%",
-              "& span": {
-                width: "100%",
-                height: "100%"
-              },
-              "& .btn": {
-                width: "100%",
-                height: "100%",
-                "&.textAlign-left": {
-                  justifyContent: "start"
-                },
-                "&.textAlign-right": {
-                  justifyContent: "end"
-                },
-                "&.textAlign-center": {
-                  justifyContent: "center"
-                }
-              }
-            }
-          }
-        },
-        "& .fgi_type_box": {
-          width: "100%",
-          height: "100%"
-        },
-        /** element toolbar hide */
-        "& .element-toolbar": {
-          display: "none"
-        },
-        [theme.breakpoints.between("xs", "md")]: {
-          marginLeft: `calc((100% - 320px) * 0.5)`
-        }
-      }
-    }
-  },
-  sectionPopper: {
-    zIndex: 1200,
-    width: "40px",
-    left: "-40px !important",
-    "& .papper-root": {
-      fontFamily: "sans-serif",
-      background: "#FFF",
-      "& .MuiIconButton-root": {
-        padding: "10px",
-        color: "#000",
-        background: "#FFF",
-        "& svg": {
-          width: "20px",
-          height: "20px"
-        },
-        "&.active,&:hover ": {}
-      }
-    }
-  },
-  sectionSettingsPopper: {
-    "&.style-settings-wrpr": {
-      height: "300px",
-      overflowY: "auto",
-      overflowX: "hidden",
-      padding: "8px 8px 12px 12px",
-      marginBotton: "12px"
-    }
-  }
-});
-export default useFreeGridStyles;

package/dist/Editor/ErrorBoundary.js

@@ -1,30 +0,0 @@
-import React, { Component } from "react";
-import { jsx as _jsx } from "react/jsx-runtime";
-class ErrorBoundary extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      hasError: false
-    };
-  }
-  static getDerivedStateFromError(error) {
-    // Update state so the next render will show the fallback UI.
-    return {
-      hasError: true
-    };
-  }
-  componentDidCatch(error, errorInfo) {
-    // You can also log the error to an error reporting service
-    console.error("Error caught in Error Boundary: ", error, errorInfo);
-  }
-  render() {
-    if (this.state.hasError) {
-      // You can render any custom fallback UI
-      return /*#__PURE__*/_jsx("h1", {
-        children: "Something went wrong."
-      });
-    }
-    return this.props.children;
-  }
-}
-export default ErrorBoundary;

package/dist/Editor/common/RnD/ContextMenu/CMenus.js

@@ -1,105 +0,0 @@
-import CMDIcon from "@mui/icons-material/KeyboardCommandKey";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-const CMenus = {
-  child: [{
-    name: "bringForward",
-    label: "Move to Front",
-    autoClose: false,
-    render: () => {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Move to Front", " ", /*#__PURE__*/_jsxs("span", {
-          className: "shortcut-help-info",
-          children: [/*#__PURE__*/_jsx(CMDIcon, {}), " \u2191"]
-        })]
-      });
-    }
-  }, {
-    name: "bringBackward",
-    label: "Move to Back",
-    autoClose: false,
-    render: () => {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Move to Back", " ", /*#__PURE__*/_jsxs("span", {
-          className: "shortcut-help-info",
-          children: [/*#__PURE__*/_jsx(CMDIcon, {}), " \u2193"]
-        })]
-      });
-    }
-  }, {
-    name: "cut",
-    label: "Cut",
-    render: () => {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Cut", " ", /*#__PURE__*/_jsxs("span", {
-          className: "shortcut-help-info",
-          children: [/*#__PURE__*/_jsx(CMDIcon, {}), " X"]
-        })]
-      });
-    }
-  }, {
-    name: "copy",
-    label: "Copy",
-    render: () => {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Copy", " ", /*#__PURE__*/_jsxs("span", {
-          className: "shortcut-help-info",
-          children: [/*#__PURE__*/_jsx(CMDIcon, {}), " C"]
-        })]
-      });
-    }
-  }, {
-    name: "paste",
-    label: "Paste",
-    render: () => {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Paste", " ", /*#__PURE__*/_jsxs("span", {
-          className: "shortcut-help-info",
-          children: [/*#__PURE__*/_jsx(CMDIcon, {}), " V"]
-        })]
-      });
-    }
-  }, {
-    name: "delete",
-    label: "Delete"
-  }],
-  parent: [{
-    name: "cut",
-    label: "Cut",
-    render: () => {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Cut", " ", /*#__PURE__*/_jsxs("span", {
-          className: "shortcut-help-info",
-          children: [/*#__PURE__*/_jsx(CMDIcon, {}), " X"]
-        })]
-      });
-    }
-  }, {
-    name: "copy",
-    label: "Copy",
-    render: () => {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Copy", " ", /*#__PURE__*/_jsxs("span", {
-          className: "shortcut-help-info",
-          children: [/*#__PURE__*/_jsx(CMDIcon, {}), " C"]
-        })]
-      });
-    }
-  }, {
-    name: "paste",
-    label: "Paste",
-    render: () => {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Paste", " ", /*#__PURE__*/_jsxs("span", {
-          className: "shortcut-help-info",
-          children: [/*#__PURE__*/_jsx(CMDIcon, {}), " V"]
-        })]
-      });
-    }
-  }, {
-    name: "delete",
-    label: "Delete"
-  }]
-};
-export default CMenus;