@flozy/editor 5.4.0 → 5.4.1

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;

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

@@ -1,36 +0,0 @@
-import React from "react";
-import { List, ListItemButton, ListItemIcon, ListItemText, Box } from "@mui/material";
-import { PROPERTY_TYPES } from "./Constants";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const ColumnsList = props => {
-  const {
-    properties
-  } = props;
-  const {
-    onSelect,
-    selected
-  } = props;
-  return /*#__PURE__*/_jsx(Box, {
-    className: "opt-wrpr",
-    children: /*#__PURE__*/_jsx(List, {
-      className: "tv-opt-list",
-      children: properties?.map((m, i) => {
-        const {
-          Icon
-        } = PROPERTY_TYPES?.find(f => f.type === m.type) || {};
-        return /*#__PURE__*/_jsxs(ListItemButton, {
-          className: selected?.type === m?.type ? "active" : "",
-          onClick: onSelect(m),
-          children: [/*#__PURE__*/_jsx(ListItemIcon, {
-            children: /*#__PURE__*/_jsx(Icon, {})
-          }), /*#__PURE__*/_jsx(ListItemText, {
-            primary: m?.label
-          })]
-        }, i);
-      })
-    })
-  });
-};
-ColumnsList.defaultProps = {};
-export default ColumnsList;

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

@@ -1,101 +0,0 @@
-import NotesIcon from "@mui/icons-material/Notes";
-import TagIcon from "@mui/icons-material/Tag";
-import ArrowDropDownCircleIcon from "@mui/icons-material/ArrowDropDownCircle";
-import ChecklistIcon from "@mui/icons-material/Checklist";
-import InsertInvitationIcon from "@mui/icons-material/InsertInvitation";
-import PersonIcon from "@mui/icons-material/Person";
-import CheckCircleOutlineIcon from "@mui/icons-material/CheckCircleOutline";
-import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward";
-import ArrowDownwardIcon from "@mui/icons-material/ArrowDownward";
-// import FilterListIcon from "@mui/icons-material/FilterList";
-
-export const TYPE_LABELS = {
-  text: "Text",
-  number: "Number",
-  select: "Select",
-  "multi-select": "Multi Select",
-  date: "Date",
-  person: "Person",
-  check: "Checkbox"
-};
-export const PROPERTY_DEFAULTS = {
-  text: {
-    label: TYPE_LABELS?.text,
-    visible: true
-  },
-  number: {
-    label: TYPE_LABELS.number,
-    visible: true
-  },
-  select: {
-    label: TYPE_LABELS.select,
-    visible: true
-  },
-  "multi-select": {
-    label: TYPE_LABELS["multi-select"],
-    visible: true
-  },
-  date: {
-    label: TYPE_LABELS.date,
-    visible: true
-  },
-  check: {
-    label: TYPE_LABELS.check,
-    visible: true
-  },
-  person: {
-    label: TYPE_LABELS.person,
-    visible: true
-  }
-};
-export const PROPERTY_TYPES = [{
-  type: "text",
-  label: TYPE_LABELS.text,
-  Icon: NotesIcon
-}, {
-  type: "number",
-  label: TYPE_LABELS.number,
-  Icon: TagIcon
-}, {
-  type: "select",
-  label: TYPE_LABELS.select,
-  Icon: ArrowDropDownCircleIcon
-}, {
-  type: "multi-select",
-  label: TYPE_LABELS["multi-select"],
-  Icon: ChecklistIcon
-}, {
-  type: "date",
-  label: TYPE_LABELS.date,
-  Icon: InsertInvitationIcon
-}, {
-  type: "check",
-  label: TYPE_LABELS.check,
-  Icon: CheckCircleOutlineIcon
-}, {
-  type: "person",
-  label: TYPE_LABELS.person,
-  Icon: PersonIcon
-}];
-export const FILTER_TYPES = [{
-  type: "sort",
-  operator: "asc",
-  label: "Sort Ascending",
-  value: "",
-  Icon: ArrowUpwardIcon
-}, {
-  type: "sort",
-  operator: "desc",
-  label: "Sort Descending",
-  Icon: ArrowDownwardIcon
-}
-// {
-//   type: "filter",
-//   operator: "contains",
-//   label: "Filter",
-//   value: "",
-//   Icon: FilterListIcon,
-// },
-];
-
-export const DEFAULT_OPTION_COLORS = ["rgba(131, 96, 253, 0.5)", "rgba(180, 180, 180, 1)", "rgba(72, 159, 248, 0.5)", "rgba(254, 122, 0, 0.5)", "rgba(214, 105, 190, 0.5)", "rgba(255, 229, 0, 0.5)"];

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

@@ -1,160 +0,0 @@
-import React, { useEffect, useRef, useState } from "react";
-import { Box, IconButton, TextField, List, ListItemButton, ListItemIcon, ListItemText, FormControlLabel } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-import ArrowBackIcon from "@mui/icons-material/ArrowBack";
-import DeleteIcon from "@mui/icons-material/Delete";
-import ColorButtons from "../../../Color Picker/ColorButtons";
-import ColorPickerStyles from "../../../Color Picker/Styles";
-import { DEFAULT_OPTION_COLORS } from "./Constants";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const EditOption = props => {
-  const {
-    classes,
-    onClose,
-    mode,
-    onEvent
-  } = props;
-  const [edit, setEdit] = useState({
-    ...(mode?.edit || {})
-  });
-  const editData = useRef({
-    ...edit
-  });
-  const {
-    optionIndex
-  } = edit;
-  const selectedOption = edit?.options[optionIndex] || {};
-  const pickerStyles = ColorPickerStyles();
-  useEffect(() => {
-    return () => {
-      // on un-mount update the option change
-      if (editData?.current) {
-        delete editData?.current?.edited;
-        onEvent("updateProperty", {
-          ...editData?.current
-        });
-      }
-    };
-  }, []);
-  const onChange = e => {
-    const updatedOptions = edit?.options.map((m, i) => {
-      if (i === edit?.optionIndex) {
-        return {
-          ...m,
-          [e.target.name]: e?.target?.value
-        };
-      }
-      return m;
-    });
-
-    // for delete
-    if (edit?.optionIndex > -1 && e?.target?.delete) {
-      updatedOptions.splice(edit?.optionIndex, 1);
-    }
-    const latest = {
-      ...edit,
-      options: [...updatedOptions]
-    };
-    setEdit({
-      ...latest
-    });
-    editData.current = {
-      ...latest,
-      edited: true
-    };
-
-    // if delete go back
-    if (e?.target?.delete) {
-      onEvent("editProperty", {
-        edit: {
-          ...latest
-        }
-      });
-    }
-  };
-  const onBack = () => {
-    onEvent("editProperty", {
-      edit: {
-        ...edit
-      }
-    });
-  };
-  const onDeleteOption = () => {
-    onChange({
-      target: {
-        delete: true
-      }
-    });
-  };
-  const onColorChange = color => {
-    onChange({
-      target: {
-        name: "color",
-        value: color
-      }
-    });
-  };
-  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, {})
-        }), "Edit Option"]
-      }), /*#__PURE__*/_jsx(IconButton, {
-        className: "tv-act-ico bg",
-        size: "small",
-        onClick: onClose,
-        children: /*#__PURE__*/_jsx(CloseIcon, {})
-      })]
-    }), /*#__PURE__*/_jsx(Box, {
-      className: "fe-dv-ap-opt-content mt-1 mb",
-      children: /*#__PURE__*/_jsx(FormControlLabel, {
-        className: "ml-0",
-        label: "Option Name",
-        control: /*#__PURE__*/_jsx(TextField, {
-          size: "small",
-          name: "value",
-          value: selectedOption?.value,
-          onChange: onChange,
-          fullWidth: true,
-          placeholder: "Option Name"
-        }),
-        labelPlacement: "top"
-      })
-    }), /*#__PURE__*/_jsxs(Box, {
-      className: "label-desc mt-1",
-      children: [/*#__PURE__*/_jsx(Box, {
-        className: "label-tp mb",
-        children: "Choose Color"
-      }), /*#__PURE__*/_jsx(Box, {
-        className: "ml",
-        children: /*#__PURE__*/_jsx(ColorButtons, {
-          classes: pickerStyles,
-          onSelect: onColorChange,
-          activeColor: selectedOption?.color,
-          defaultColors: DEFAULT_OPTION_COLORS
-        })
-      })]
-    }), /*#__PURE__*/_jsx(List, {
-      className: "fe-dv-opt-list st",
-      children: /*#__PURE__*/_jsxs(ListItemButton, {
-        onClick: onDeleteOption,
-        children: [/*#__PURE__*/_jsx(ListItemIcon, {
-          children: /*#__PURE__*/_jsx(DeleteIcon, {})
-        }), /*#__PURE__*/_jsx(ListItemText, {
-          children: "Delete Option"
-        })]
-      })
-    })]
-  });
-};
-EditOption.defaultProps = {
-  onEvent: () => {}
-};
-export default EditOption;

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

@@ -1,190 +0,0 @@
-import React, { useEffect, useRef, useState } from "react";
-import { Box, IconButton, TextField, List, ListItemButton, ListItemText, ListItemIcon, FormControlLabel } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
-import DeleteIcon from "@mui/icons-material/Delete";
-import ContentCopyIcon from "@mui/icons-material/ContentCopy";
-import VisibilityIcon from "@mui/icons-material/Visibility";
-import VisibilityOffIcon from "@mui/icons-material/VisibilityOff";
-import ArrowBackIosIcon from "@mui/icons-material/ArrowBackIos";
-import { TYPE_LABELS } from "./Constants";
-import AddOptions from "./AddOptions";
-import FilterProperty from "./FilterProperty";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const EditProperty = props => {
-  const {
-    classes,
-    onClose,
-    mode,
-    onEvent
-  } = props;
-  const [edit, setEdit] = useState({
-    ...(mode?.edit || {})
-  });
-  const editData = useRef({
-    ...edit
-  });
-  useEffect(() => {
-    return () => {
-      // on un-mount update the label
-      if (edit?.label !== editData?.current?.label) {
-        onEvent("updateProperty", {
-          ...editData?.current
-        }, false);
-      }
-    };
-  }, []);
-  const onChange = key => e => {
-    const latest = {
-      ...edit,
-      [key]: e?.target?.value
-    };
-    setEdit({
-      ...edit,
-      [key]: e?.target?.value
-    });
-    editData.current = {
-      ...latest
-    };
-  };
-  const onChangeProperty = () => {
-    onEvent("changeProperty", {
-      edit: {
-        ...edit
-      }
-    });
-  };
-  const onBack = () => {
-    onEvent("allProperties", {
-      edit: null
-    });
-  };
-  const onUpdate = data => {
-    const latest = {
-      ...edit,
-      ...data
-    };
-    setEdit({
-      ...edit,
-      ...data
-    });
-    editData.current = {
-      ...latest
-    };
-    onEvent("updateProperty", {
-      ...editData?.current
-    });
-  };
-  const onAction = action => () => {
-    switch (action) {
-      case "Visibilty":
-        onUpdate({
-          visible: !edit?.visible
-        });
-        onEvent("close");
-        break;
-      case "Duplicate":
-        onEvent("addProperty", {
-          type: editData?.current?.type,
-          overrides: {
-            ...editData?.current
-          }
-        }, false);
-        onEvent("close");
-        break;
-      case "Delete":
-        onEvent("deleteProperty", {
-          ...editData?.current
-        });
-        onEvent("close");
-        break;
-      default:
-        return;
-    }
-  };
-  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(ArrowBackIosIcon, {})
-        }), "Edit Property"]
-      }), /*#__PURE__*/_jsx(IconButton, {
-        className: "tv-act-ico bg br1",
-        size: "small",
-        onClick: onClose,
-        children: /*#__PURE__*/_jsx(CloseIcon, {})
-      })]
-    }), /*#__PURE__*/_jsxs(Box, {
-      className: "fe-dv-ap-opt-content",
-      children: [/*#__PURE__*/_jsx(FormControlLabel, {
-        label: "Field Name",
-        labelPlacement: "top",
-        control: /*#__PURE__*/_jsx(TextField, {
-          size: "small",
-          value: edit?.label,
-          onChange: onChange("label"),
-          fullWidth: true,
-          placeholder: "Field Name"
-        })
-      }), /*#__PURE__*/_jsx(AddOptions, {
-        edit: edit,
-        onUpdate: onUpdate,
-        onEvent: onEvent
-      }), /*#__PURE__*/_jsx(FilterProperty, {
-        edit: edit,
-        onUpdate: onUpdate,
-        onEvent: onEvent
-      }), /*#__PURE__*/_jsx(List, {
-        className: "fe-dv-opt-list st sb",
-        children: /*#__PURE__*/_jsxs(ListItemButton, {
-          onClick: onChangeProperty,
-          children: [/*#__PURE__*/_jsx(ListItemText, {
-            children: "Type"
-          }), /*#__PURE__*/_jsxs(ListItemIcon, {
-            sx: {
-              alignItems: "center"
-            },
-            children: [/*#__PURE__*/_jsx("span", {
-              className: "label-tp",
-              children: TYPE_LABELS[edit?.type]
-            }), /*#__PURE__*/_jsx(KeyboardArrowRightIcon, {})]
-          })]
-        })
-      }), /*#__PURE__*/_jsxs(List, {
-        className: "fe-dv-opt-list",
-        children: [/*#__PURE__*/_jsxs(ListItemButton, {
-          onClick: onAction("Visibilty"),
-          children: [/*#__PURE__*/_jsx(ListItemIcon, {
-            children: edit?.visible ? /*#__PURE__*/_jsx(VisibilityOffIcon, {}) : /*#__PURE__*/_jsx(VisibilityIcon, {})
-          }), /*#__PURE__*/_jsxs(ListItemText, {
-            children: [edit?.visible ? "Hide" : "Show", " in View"]
-          })]
-        }), /*#__PURE__*/_jsxs(ListItemButton, {
-          onClick: onAction("Duplicate"),
-          children: [/*#__PURE__*/_jsx(ListItemIcon, {
-            children: /*#__PURE__*/_jsx(ContentCopyIcon, {})
-          }), /*#__PURE__*/_jsx(ListItemText, {
-            children: "Duplicate Property"
-          })]
-        }), /*#__PURE__*/_jsxs(ListItemButton, {
-          onClick: onAction("Delete"),
-          children: [/*#__PURE__*/_jsx(ListItemIcon, {
-            children: /*#__PURE__*/_jsx(DeleteIcon, {})
-          }), /*#__PURE__*/_jsx(ListItemText, {
-            children: "Delete Property"
-          })]
-        })]
-      })]
-    })]
-  });
-};
-EditProperty.defaultProps = {
-  onEvent: () => {}
-};
-export default EditProperty;