@flozy/editor 5.2.8 → 5.3.0

package/dist/Editor/Elements/DataView/Layouts/FilterSort/index.js

@@ -1,64 +0,0 @@
-import React from "react";
-import { Box, Popover, SwipeableDrawer, IconButton, useTheme } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-import useFilterSortStyles from "./styles";
-import SortOptions from "./SortOptions";
-import { useEditorContext } from "../../../../hooks/useMouseMove";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const FilterSort = props => {
-  const {
-    theme: appTheme
-  } = useEditorContext();
-  const theme = useTheme();
-  const {
-    open,
-    mode,
-    anchorEl,
-    onClose
-  } = props;
-  const classes = useFilterSortStyles(theme, appTheme);
-  const isMobile = window.matchMedia("(max-width: 899px)")?.matches || false;
-  const PoperComponent = isMobile ? SwipeableDrawer : Popover;
-  const renderMode = () => {
-    if (mode?.type === "filter") {
-      return "Filter Mode will be availbele soon";
-    } else if (mode?.type === "sort") {
-      return /*#__PURE__*/_jsx(SortOptions, {
-        onClose: onClose
-      });
-    } else {
-      return "Unknown Filter / Sort Mode";
-    }
-  };
-  return /*#__PURE__*/_jsx(PoperComponent, {
-    open: open,
-    sx: classes.root,
-    anchorEl: anchorEl,
-    anchorOrigin: {
-      vertical: "bottom",
-      horizontal: "right"
-    },
-    transformOrigin: {
-      vertical: "top",
-      horizontal: "right"
-    },
-    onClose: onClose,
-    anchor: "bottom",
-    children: /*#__PURE__*/_jsxs(Box, {
-      sx: classes.contentWrapper,
-      children: [/*#__PURE__*/_jsxs(Box, {
-        className: "fe-dv-ap-title",
-        children: [/*#__PURE__*/_jsx("span", {
-          children: "Sort By"
-        }), /*#__PURE__*/_jsx(IconButton, {
-          className: "tv-act-ico bg br1",
-          size: "small",
-          onClick: onClose,
-          children: /*#__PURE__*/_jsx(CloseIcon, {})
-        })]
-      }), renderMode()]
-    })
-  });
-};
-export default FilterSort;

package/dist/Editor/Elements/DataView/Layouts/FilterSort/styles.js

@@ -1,106 +0,0 @@
-const useFilterSortStyles = (theme, appTheme) => ({
-  root: {
-    "& .MuiPaper-root": {
-      boxShadow: "0px 4px 10px 0px rgba(0, 0, 0, 0.16)",
-      border: `1px solid ${appTheme?.palette?.editor?.tv_border}`,
-      background: appTheme?.palette?.editor?.tv_pop_bg,
-      color: appTheme?.palette?.editor?.tv_text_primary,
-      borderRadius: "12px",
-      [theme?.breakpoints?.between("xs", "md")]: {
-        borderRadius: "16px 16px 0px 0px",
-        maxHeight: "50%"
-      },
-      "& .MuiSelect-select": {
-        padding: "4px 8px"
-      },
-      "& .ml": {
-        marginLeft: "8px"
-      },
-      "& .tv-act-ico": {
-        color: appTheme?.palette?.editor?.tv_text,
-        "&.br1": {
-          borderRadius: "6px"
-        },
-        "&.bg": {
-          background: appTheme?.palette?.editor?.tv_ico_bg,
-          "&:hover": {
-            background: "rgba(100, 116, 139, 0.12)"
-          }
-        },
-        "& svg": {
-          width: "16px",
-          height: "16px"
-        }
-      },
-      "& .MuiList-root": {
-        padding: "4px 2px",
-        "& .MuiListItemButton-root": {
-          color: appTheme?.palette?.editor?.tv_text_primary,
-          padding: "2px 4px",
-          borderRadius: "8px",
-          "& .MuiListItemIcon-root": {
-            minWidth: "38px",
-            "&.needBg": {
-              minWidth: "20px",
-              width: "20px",
-              height: "20px",
-              alignItems: "center",
-              justifyContent: "center",
-              borderRadius: "4px",
-              marginRight: "12px",
-              background: appTheme?.palette?.editor?.tv_ico_bg
-            },
-            color: `${appTheme?.palette?.editor?.tv_text} !important`,
-            "& svg": {
-              width: "16px"
-            }
-          },
-          "& .MuiTypography-root": {
-            fontSize: "14px"
-          },
-          "&:hover": {
-            background: appTheme?.palette?.editor?.tv_hover_bg,
-            color: `${appTheme?.palette?.editor?.tv_hover_text} !important`,
-            "& .MuiListItemIcon-root": {
-              color: `${appTheme?.palette?.editor?.tv_hover_text} !important`
-            }
-          }
-        }
-      },
-      "& .tv-cf": {
-        "& .MuiInputBase-root": {
-          color: appTheme?.palette?.editor?.tv_text_primary,
-          background: appTheme?.palette?.editor?.tv_input_bg,
-          borderRadius: "8px",
-          "& svg": {
-            color: appTheme?.palette?.editor?.tv_text_primary
-          }
-        }
-      }
-    }
-  },
-  contentWrapper: {
-    padding: "0px",
-    "& .tv-opt-list": {
-      minWidth: "250px"
-    },
-    "& .opt-wrpr": {
-      padding: "8px 8px 8px 8px"
-    },
-    "& .fe-dv-ap-title": {
-      display: "flex",
-      fontWeight: "bold",
-      padding: "8px 8px 8px 8px",
-      justifyContent: "space-between",
-      fontSize: "14px",
-      alignItems: "center",
-      borderBottom: `1px solid ${appTheme?.palette?.editor?.tv_border}`,
-      marginBottom: "0px",
-      "& span": {
-        display: "flex",
-        alignItems: "center"
-      }
-    }
-  }
-});
-export default useFilterSortStyles;

package/dist/Editor/Elements/DataView/Layouts/FilterView.js

@@ -1,174 +0,0 @@
-import React, { useState } from "react";
-import { Box, IconButton, InputBase, Menu, MenuItem } from "@mui/material";
-import { useDataView } from "../Providers/DataViewProvider";
-import FilterSort from "./FilterSort";
-import DeleteIcon from "@mui/icons-material/Delete";
-import SearchIcon from "@mui/icons-material/Search";
-import SwapVertIcon from "@mui/icons-material/SwapVert";
-import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
-import ContentCopyIcon from "@mui/icons-material/ContentCopy";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const FilterView = props => {
-  const {
-    classes,
-    onDelete,
-    onDuplicate,
-    onEnter,
-    readOnly,
-    title,
-    onTitleChange
-  } = props;
-  const {
-    sort,
-    selectedRows,
-    onDeleteRows,
-    search,
-    onSearch
-  } = useDataView();
-  const [anchorEl, setAnchorEl] = useState(null);
-  const [anchorMoreEl, setAnchorMoreEl] = useState(null);
-  const [mode, setMode] = useState({});
-  const [toggle, setToggle] = useState(false);
-  const open = Boolean(anchorEl);
-  const openMore = Boolean(anchorMoreEl);
-  const handleSortClick = e => {
-    setAnchorEl(e?.currentTarget);
-    setMode({
-      type: "sort"
-    });
-  };
-  const handleMoreClick = e => {
-    setAnchorMoreEl(e?.currentTarget);
-    setMode({
-      type: ""
-    });
-  };
-  const handleDeleteRow = () => {
-    onDeleteRows();
-  };
-  const onClose = () => {
-    setAnchorEl(null);
-  };
-  const toggleSearch = () => {
-    setToggle(!toggle);
-  };
-  const onMenuClick = menu => () => {
-    switch (menu) {
-      case "Duplicate":
-        onDuplicate();
-        break;
-      case "Delete":
-        onDelete();
-        break;
-      default:
-    }
-  };
-  const handleMoreClose = () => {
-    setAnchorMoreEl(null);
-  };
-  const handleTitleChange = e => {
-    onTitleChange(e?.target?.value);
-  };
-  const handleEnter = e => {
-    if (e?.key === "Enter") {
-      onEnter();
-    }
-  };
-  return /*#__PURE__*/_jsxs(Box, {
-    className: "fe-tv-fv",
-    contentEditable: false,
-    sx: classes.filterView,
-    children: [/*#__PURE__*/_jsx(Box, {
-      className: "tv-title-wrpr",
-      children: !readOnly ? /*#__PURE__*/_jsx(InputBase, {
-        sx: {
-          paddingBottom: "0px",
-          fontWeight: "bold",
-          fontSize: "16px"
-        },
-        size: "small",
-        placeholder: "Untitled",
-        inputProps: {
-          "aria-label": "Table Name",
-          maxLength: 100
-        },
-        value: title,
-        onChange: handleTitleChange,
-        onKeyUp: handleEnter
-      }) : title || "Untitled"
-    }), /*#__PURE__*/_jsxs(Box, {
-      className: "tv-fi-wrpr",
-      children: [/*#__PURE__*/_jsxs(Box, {
-        className: `tv-sb mr ${toggle ? "open" : ""}`,
-        children: [/*#__PURE__*/_jsx(IconButton, {
-          type: "button",
-          "aria-label": "search",
-          onClick: toggleSearch,
-          children: /*#__PURE__*/_jsx(SearchIcon, {})
-        }), /*#__PURE__*/_jsx(InputBase, {
-          sx: {
-            paddingBottom: "0px"
-          },
-          size: "small",
-          placeholder: "Search here",
-          inputProps: {
-            "aria-label": "search google maps"
-          },
-          value: search,
-          onChange: onSearch
-        })]
-      }), /*#__PURE__*/_jsx(IconButton, {
-        className: `mr ${sort?.length > 0 ? "active" : ""}`,
-        onClick: handleSortClick,
-        children: /*#__PURE__*/_jsx(SwapVertIcon, {})
-      }), /*#__PURE__*/_jsx(FilterSort, {
-        open: open,
-        anchorEl: anchorEl,
-        mode: mode,
-        onClose: onClose
-      }), !readOnly ? /*#__PURE__*/_jsx(IconButton, {
-        className: "mr",
-        onClick: handleMoreClick,
-        children: /*#__PURE__*/_jsx(MoreHorizIcon, {})
-      }) : null, selectedRows?.length > 0 && !readOnly ? /*#__PURE__*/_jsx(IconButton, {
-        className: "mr",
-        onClick: handleDeleteRow,
-        children: /*#__PURE__*/_jsx(DeleteIcon, {})
-      }) : null, !readOnly ? /*#__PURE__*/_jsxs(Menu, {
-        sx: classes.basicMenu,
-        className: "tv-basic-menu",
-        anchorEl: anchorMoreEl,
-        open: openMore,
-        onClose: handleMoreClose,
-        MenuListProps: {
-          "aria-labelledby": "basic-button"
-        },
-        anchorOrigin: {
-          vertical: "bottom",
-          horizontal: "right"
-        },
-        transformOrigin: {
-          vertical: "top",
-          horizontal: "right"
-        },
-        children: [/*#__PURE__*/_jsxs(MenuItem, {
-          onClick: onMenuClick("Duplicate"),
-          children: [" ", /*#__PURE__*/_jsx(ContentCopyIcon, {
-            sx: {
-              mr: 1
-            }
-          }), " Duplicate"]
-        }), /*#__PURE__*/_jsxs(MenuItem, {
-          onClick: onMenuClick("Delete"),
-          children: [" ", /*#__PURE__*/_jsx(DeleteIcon, {
-            sx: {
-              mr: 1
-            }
-          }), " Delete"]
-        })]
-      }) : null]
-    })]
-  });
-};
-export default FilterView;

package/dist/Editor/Elements/DataView/Layouts/Formula.js

@@ -1,29 +0,0 @@
-import React from "react";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { jsx as _jsx } from "react/jsx-runtime";
-const RenderFormulaCell = props => {
-  const {
-    property
-  } = props;
-  return /*#__PURE__*/_jsxs("td", {
-    style: {
-      minWidth: "200px",
-      textAlign: "center",
-      color: "#CCC"
-    },
-    children: ["Calculate ", property?.key]
-  });
-};
-const Formula = props => {
-  const {
-    properties
-  } = props;
-  return /*#__PURE__*/_jsx("tr", {
-    children: properties?.map((m, i) => {
-      return /*#__PURE__*/_jsx(RenderFormulaCell, {
-        property: m
-      }, i);
-    })
-  });
-};
-export default Formula;

package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js

@@ -1,113 +0,0 @@
-import React, { useState } from "react";
-import { Box, List, ListItemButton, ListItemText, ListItemIcon, TextField, Chip } from "@mui/material";
-import AddIcon from "@mui/icons-material/Add";
-import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
-import { colors } from "../../../Color Picker/defaultColors";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const DEFAULT_COLORS = colors?.filter(f => !f.includes("linear"));
-const AddOptions = props => {
-  const {
-    edit,
-    onUpdate,
-    onEvent
-  } = props;
-  const [addBox, setAddBox] = useState(false);
-  const [value, setValue] = useState("");
-  const [error, setError] = useState("");
-  const {
-    options
-  } = edit;
-  const onAddBox = () => {
-    setAddBox(!addBox);
-  };
-  const getRandomColor = () => {
-    const randomIndex = Math.floor(Math.random() * DEFAULT_COLORS.length);
-    return DEFAULT_COLORS[randomIndex];
-  };
-  const handleEnter = e => {
-    const isExists = options?.find(f => f.value.toLowerCase() === value.toLowerCase());
-    if (e.keyCode === 13 && value?.trim()) {
-      if (isExists) {
-        setError("Option Already Exists!");
-        return;
-      }
-      onUpdate({
-        ...edit,
-        options: [{
-          value: value,
-          color: getRandomColor()
-        }, ...(options || [])]
-      });
-      setValue("");
-    }
-  };
-  const handleChange = e => {
-    setValue(e?.target?.value);
-    setError("");
-  };
-  const handleChangeOption = optIndex => () => {
-    onEvent("editOption", {
-      edit: {
-        ...edit,
-        optionIndex: optIndex
-      }
-    });
-  };
-  const onBlur = () => {
-    setValue("");
-    setAddBox(false);
-    setError("");
-  };
-  return edit?.type === "select" || edit?.type === "multi-select" ? /*#__PURE__*/_jsxs(Box, {
-    className: "fe-tv-addopt st sb mb-0",
-    children: [/*#__PURE__*/_jsx(List, {
-      className: "fe-dv-opt-list pl-0",
-      children: /*#__PURE__*/_jsxs(ListItemButton, {
-        onClick: onAddBox,
-        children: [/*#__PURE__*/_jsx(ListItemIcon, {
-          children: /*#__PURE__*/_jsx(AddIcon, {})
-        }), /*#__PURE__*/_jsx(ListItemText, {
-          primary: "Add Options"
-        })]
-      })
-    }), /*#__PURE__*/_jsx(Box, {
-      className: "fe-dv-ap-desc",
-      children: "Choose an option or create one"
-    }), addBox ? /*#__PURE__*/_jsx(Box, {
-      children: /*#__PURE__*/_jsx(TextField, {
-        className: "mt",
-        size: "small",
-        fullWidth: true,
-        value: value,
-        onKeyUp: handleEnter,
-        onChange: handleChange,
-        onBlur: onBlur,
-        helperText: error
-      })
-    }) : null, /*#__PURE__*/_jsx(List, {
-      children: options?.map((m, i) => {
-        return /*#__PURE__*/_jsxs(ListItemButton, {
-          onClick: handleChangeOption(i),
-          children: [/*#__PURE__*/_jsx(ListItemText, {
-            primary: /*#__PURE__*/_jsx(Chip, {
-              label: m.value,
-              sx: {
-                background: m.color
-              }
-            })
-          }), /*#__PURE__*/_jsx(ListItemIcon, {
-            sx: {
-              justifyContent: "flex-end"
-            },
-            children: /*#__PURE__*/_jsx(KeyboardArrowRightIcon, {})
-          })]
-        }, i);
-      })
-    })]
-  }) : null;
-};
-AddOptions.defaultProps = {
-  onEvent: () => {}
-};
-export default AddOptions;

package/dist/Editor/Elements/DataView/Layouts/Options/AddProperty.js

@@ -1,37 +0,0 @@
-import React from "react";
-import { Box, IconButton } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-import PropertyList from "./PropertyList";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const AddProperty = props => {
-  const {
-    classes,
-    onClose,
-    onEvent
-  } = props;
-  const onSelect = type => () => {
-    onEvent("addProperty", type);
-  };
-  return /*#__PURE__*/_jsxs(Box, {
-    sx: classes.addProperty,
-    children: [/*#__PURE__*/_jsxs(Box, {
-      className: "fe-dv-ap-title",
-      children: ["Add Property", /*#__PURE__*/_jsx(IconButton, {
-        className: "tv-act-ico bg br1",
-        size: "small",
-        onClick: onClose,
-        children: /*#__PURE__*/_jsx(CloseIcon, {})
-      })]
-    }), /*#__PURE__*/_jsx(Box, {
-      className: "fe-dv-ap-opt-content mt",
-      children: /*#__PURE__*/_jsx(PropertyList, {
-        onSelect: onSelect
-      })
-    })]
-  });
-};
-AddProperty.defaultProps = {
-  onEvent: () => {}
-};
-export default AddProperty;

package/dist/Editor/Elements/DataView/Layouts/Options/AllProperties.js

@@ -1,111 +0,0 @@
-import React from "react";
-import { Box, IconButton, List, ListItemButton, ListItemText, ListItemIcon } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
-import AddIcon from "@mui/icons-material/Add";
-import { TYPE_LABELS, PROPERTY_TYPES } from "./Constants";
-import { useDataView } from "../../Providers/DataViewProvider";
-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 AllProperties = props => {
-  const {
-    classes,
-    onClose,
-    onEvent
-  } = props;
-  const {
-    properties,
-    onAddProperty
-  } = useDataView();
-  const shownProperties = properties?.filter(f => f.visible === true);
-  const hiddenProperties = properties?.filter(f => f.visible === false);
-  const onEditProperty = data => () => {
-    onEvent("editProperty", {
-      edit: {
-        ...data
-      }
-    });
-  };
-  const onAdd = () => {
-    const np = onAddProperty({
-      type: "text"
-    });
-    onEvent("editProperty", {
-      edit: {
-        ...np
-      }
-    });
-  };
-  return /*#__PURE__*/_jsxs(Box, {
-    sx: classes.addProperty,
-    children: [/*#__PURE__*/_jsxs(Box, {
-      className: "fe-dv-ap-title",
-      children: ["Properties", /*#__PURE__*/_jsx(IconButton, {
-        className: "tv-act-ico bg br1",
-        size: "small",
-        onClick: onClose,
-        children: /*#__PURE__*/_jsx(CloseIcon, {})
-      })]
-    }), /*#__PURE__*/_jsx(Box, {
-      className: "fe-dv-ap-desc",
-      children: "Displayed Properties"
-    }), /*#__PURE__*/_jsxs(Box, {
-      className: "fe-dv-ap-opt-content",
-      children: [/*#__PURE__*/_jsx(List, {
-        className: "fe-dv-opt-list",
-        children: shownProperties?.map((m, i) => {
-          const {
-            Icon
-          } = PROPERTY_TYPES?.find(f => f.type === m.type) || {};
-          return /*#__PURE__*/_jsxs(ListItemButton, {
-            onClick: onEditProperty(m),
-            children: [/*#__PURE__*/_jsx(ListItemIcon, {
-              className: "needBg",
-              children: /*#__PURE__*/_jsx(Icon, {})
-            }), /*#__PURE__*/_jsx(ListItemText, {
-              children: m?.label
-            }), /*#__PURE__*/_jsx(ListItemIcon, {
-              sx: {
-                justifyContent: "end"
-              },
-              children: /*#__PURE__*/_jsx(KeyboardArrowRightIcon, {})
-            })]
-          }, i);
-        })
-      }), hiddenProperties?.length > 0 ? /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsx(Box, {
-          className: "fe-dv-ap-desc",
-          children: "Hidden Properties"
-        }), /*#__PURE__*/_jsx(List, {
-          className: "fe-dv-opt-list",
-          children: hiddenProperties?.map((m, i) => {
-            return /*#__PURE__*/_jsxs(ListItemButton, {
-              onClick: onEditProperty(m),
-              children: [/*#__PURE__*/_jsx(ListItemText, {
-                children: m?.label
-              }), /*#__PURE__*/_jsxs(ListItemIcon, {
-                sx: {
-                  alignItems: "center"
-                },
-                children: [TYPE_LABELS[m?.type], /*#__PURE__*/_jsx(KeyboardArrowRightIcon, {})]
-              })]
-            }, i);
-          })
-        })]
-      }) : null, /*#__PURE__*/_jsx(List, {
-        className: "fe-dv-opt-list",
-        children: /*#__PURE__*/_jsxs(ListItemButton, {
-          onClick: onAdd,
-          children: [/*#__PURE__*/_jsx(ListItemIcon, {
-            children: /*#__PURE__*/_jsx(AddIcon, {})
-          }), /*#__PURE__*/_jsx(ListItemText, {
-            children: "Add New Property"
-          })]
-        })
-      })]
-    })]
-  });
-};
-AllProperties.defaultProps = {};
-export default AllProperties;

package/dist/Editor/Elements/DataView/Layouts/Options/ChangeProperty.js

@@ -1,60 +0,0 @@
-import React from "react";
-import { Box, IconButton } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-import PropertyList from "./PropertyList";
-import ArrowBackIcon from "@mui/icons-material/ArrowBack";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const ChangeProperty = props => {
-  const {
-    classes,
-    onClose,
-    onEvent,
-    mode
-  } = props;
-  const onSelect = property => () => {
-    onEvent("updateProperty", {
-      ...(mode?.edit || {}),
-      type: property?.type
-    });
-  };
-  const onBack = () => {
-    onEvent("editProperty", {
-      edit: {
-        ...(mode?.edit || {})
-      }
-    });
-  };
-  return /*#__PURE__*/_jsxs(Box, {
-    sx: classes.addProperty,
-    children: [/*#__PURE__*/_jsxs(Box, {
-      className: "fe-dv-ap-title",
-      children: [/*#__PURE__*/_jsxs("span", {
-        children: [/*#__PURE__*/_jsx(IconButton, {
-          className: "tv-act-ico",
-          size: "small",
-          onClick: onBack,
-          children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
-        }), "Change Property"]
-      }), /*#__PURE__*/_jsx(IconButton, {
-        className: "tv-act-ico bg br1",
-        size: "small",
-        onClick: onClose,
-        children: /*#__PURE__*/_jsx(CloseIcon, {})
-      })]
-    }), /*#__PURE__*/_jsx(Box, {
-      className: "fe-dv-ap-desc",
-      children: "Select Property Type"
-    }), /*#__PURE__*/_jsx(Box, {
-      className: "fe-dv-ap-opt-content mt",
-      children: /*#__PURE__*/_jsx(PropertyList, {
-        onSelect: onSelect,
-        selected: mode?.edit
-      })
-    })]
-  });
-};
-ChangeProperty.defaultProps = {
-  onEvent: () => {}
-};
-export default ChangeProperty;