@flozy/editor 5.5.6 → 5.5.8

package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/Select.js

@@ -1,180 +0,0 @@
-import React from "react";
-import TextField from "@mui/material/TextField";
-import Autocomplete from "@mui/material/Autocomplete";
-import { Avatar, Box, Chip, useTheme } from "@mui/material";
-import { useEditorContext } from "../../../../../hooks/useMouseMove";
-import useCompStyles from "./styles";
-import { CloseIcon } from "../../../../../common/iconslist";
-import { jsx as _jsx } from "react/jsx-runtime";
-const AvatarIcon = props => {
-  const {
-    option,
-    avatar
-  } = props;
-  const nameIndex = option.label || option.value;
-  return avatar && nameIndex ? /*#__PURE__*/_jsx(Avatar, {
-    alt: option.label || option.value,
-    src: option.avatar || null,
-    children: nameIndex[0] || ""
-  }) : null;
-};
-const filter = (opt, params, selectedOpt) => {
-  const selectedVals = selectedOpt?.map(m => m?.value);
-  const fv = opt?.filter(f => !selectedVals.includes(f.value));
-  if (params?.inputValue) {
-    return fv.filter(f => f?.value?.toLowerCase().indexOf(params?.inputValue?.toLowerCase()) >= 0);
-  }
-  return fv;
-};
-export default function Select(props) {
-  const theme = useTheme();
-  const {
-    theme: appTheme
-  } = useEditorContext();
-  const classes = useCompStyles(theme, appTheme);
-  const {
-    value: pValue,
-    onChange,
-    options: selectOptions,
-    multiple = false,
-    limitTags = 2,
-    placeholder = "",
-    disabled = false,
-    optionAvatar = false
-  } = props;
-  const value = Array.isArray(pValue) ? pValue : [];
-  const options = selectOptions?.length ? selectOptions.filter(s => s.value) : [];
-  return /*#__PURE__*/_jsx(Autocomplete, {
-    disabled: disabled,
-    className: "tv-ac-field",
-    multiple: true,
-    limitTags: limitTags,
-    placeholder: placeholder,
-    value: value || "",
-    onChange: (event, newValue) => {
-      const fv = [];
-      newValue?.forEach(m => {
-        if (multiple) {
-          fv.push({
-            value: m.inputValue || m.value
-          });
-        } else {
-          fv[0] = {
-            value: m.inputValue || m.value
-          };
-        }
-      });
-      onChange(fv);
-    },
-    filterOptions: (options, params) => {
-      const filtered = filter(options, params, value);
-
-      // const { inputValue } = params;
-      // Suggest the creation of a new value
-      // const isExisting = options.some(
-      //   (option) => inputValue?.toLowerCase() === option.value?.toLowerCase()
-      // );
-      // no need of new val now
-      // if (inputValue !== "" && !isExisting) {
-      //   filtered.push({
-      //     inputValue,
-      //     value: `Add "${inputValue}"`,
-      //   });
-      // }
-
-      return filtered;
-    },
-    selectOnFocus: true,
-    clearOnBlur: true,
-    handleHomeEndKeys: true,
-    options: options || [],
-    getOptionLabel: option => {
-      // Value selected with enter, right from the input
-      if (typeof option === "string") {
-        return option;
-      }
-      // Add "xxx" option created dynamically
-      if (option.inputValue) {
-        return option.inputValue;
-      }
-      // Regular option
-      return option.value || "";
-    },
-    renderTags: (value, getTagProps) => {
-      return /*#__PURE__*/_jsx(Box, {
-        className: "tv-ms-tag-wrpr",
-        sx: {
-          '& svg': {
-            marginRight: '5px',
-            '& path': {
-              stroke: "#000"
-            }
-          }
-        },
-        children: value?.map((option, index) => {
-          const {
-            key,
-            ...tagProps
-          } = getTagProps({
-            index
-          }) || {};
-          return option?.value ? /*#__PURE__*/_jsx(Chip, {
-            variant: "outlined",
-            label: option?.label || option?.value,
-            ...tagProps,
-            sx: {
-              background: option?.color || appTheme?.palette?.editor?.tv_border1,
-              border: "none",
-              '& .MuiChip-label': {
-                paddingLeft: '12px !important'
-              }
-            },
-            avatar: /*#__PURE__*/_jsx(AvatarIcon, {
-              option: option,
-              avatar: optionAvatar
-            }),
-            deleteIcon: /*#__PURE__*/_jsx(CloseIcon, {})
-          }, key) : null;
-        })
-      });
-    },
-    renderOption: (props, option) => {
-      const {
-        key,
-        ...optionProps
-      } = props;
-      return /*#__PURE__*/_jsx("li", {
-        ...optionProps,
-        children: /*#__PURE__*/_jsx(Chip, {
-          label: option.label || option.value || "",
-          sx: {
-            background: option.color || appTheme?.palette?.editor?.tv_border1,
-            '& .MuiChip-label': {
-              paddingLeft: '12px !important'
-            }
-          },
-          avatar: /*#__PURE__*/_jsx(AvatarIcon, {
-            option: option,
-            avatar: optionAvatar
-          }),
-          deleteIcon: /*#__PURE__*/_jsx(CloseIcon, {})
-        })
-      }, key);
-    },
-    freeSolo: true,
-    size: "small",
-    fullWidth: true,
-    renderInput: params => {
-      return /*#__PURE__*/_jsx(TextField, {
-        size: "small",
-        ...params,
-        placeholder: placeholder
-      });
-    },
-    slotProps: {
-      paper: {
-        sx: classes.autocomplete
-      }
-    }
-  });
-}

package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/SimpleSelect.js

@@ -1,62 +0,0 @@
-import React from "react";
-import { MenuItem, Select, useTheme } from "@mui/material";
-import { useEditorContext } from "../../../../../hooks/useMouseMove";
-import useCompStyles from "./styles";
-import KeyboardArrowDownRoundedIcon from '@mui/icons-material/KeyboardArrowDownRounded';
-import { jsx as _jsx } from "react/jsx-runtime";
-const SimpleSelect = props => {
-  const theme = useTheme();
-  const {
-    theme: appTheme
-  } = useEditorContext();
-  const classes = useCompStyles(theme, appTheme);
-  const {
-    value,
-    options,
-    handleChange,
-    disabled = false
-  } = props;
-  return /*#__PURE__*/_jsx(Select, {
-    disabled: disabled,
-    value: value,
-    onChange: handleChange,
-    IconComponent: KeyboardArrowDownRoundedIcon,
-    fullWidth: true,
-    size: "small",
-    sx: {
-      color: appTheme?.palette?.editor?.tv_text,
-      fontSize: '14px !important',
-      marginTop: '4px !important',
-      padding: '3px 0px !important',
-      background: 'transparent !important',
-      '& .MuiOutlinedInput-root': {
-        height: '34px !important',
-        background: 'transparent !important'
-      },
-      '& .MuiOutlinedInput-notchedOutline': {
-        border: `1px solid ${appTheme?.palette?.editor?.inputFieldBorder} !important`,
-        boxShadow: '0px 4px 18px 0px #0000000D !important',
-        background: 'transparent !important'
-      },
-      "&:hover .MuiOutlinedInput-notchedOutline": {
-        border: `1px solid ${appTheme?.palette?.editor?.inputFieldBorder} !important`,
-        boxShadow: '0px 4px 18px 0px #0000000D !important',
-        background: 'transparent !important'
-      }
-    },
-    MenuProps: {
-      PaperProps: {
-        sx: classes.simpleselect,
-        className: "tv-cf-opt-wrpr"
-      }
-    },
-    children: options?.map((m, i) => {
-      return /*#__PURE__*/_jsx(MenuItem, {
-        value: m.key,
-        className: "tv-cf-opt-wrpr",
-        children: m.label
-      }, i);
-    })
-  });
-};
-export default SimpleSelect;

package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/styles.js

@@ -1,68 +0,0 @@
-const useCompStyles = (theme, appTheme) => ({
-  simpleselect: {
-    border: `1px solid ${appTheme?.palette?.editor?.tv_border}`,
-    background: appTheme?.palette?.editor?.tv_pop_bg,
-    color: appTheme?.palette?.editor?.tv_text,
-    fontSize: '14px',
-    borderRadius: "8px",
-    [theme?.breakpoints?.between("xs", "md")]: {},
-    "& ul": {
-      padding: "4px",
-      "& li": {
-        padding: "4px 6px",
-        borderRadius: "8px",
-        color: appTheme?.palette?.editor?.tv_text_primary,
-        fontSize: "14px",
-        marginTop: "4px",
-        "&.Mui-selected": {
-          background: appTheme?.palette?.editor?.tv_hover_bg,
-          color: appTheme?.palette?.editor?.tv_hover_text,
-          "&:hover": {
-            background: appTheme?.palette?.editor?.tv_hover_bg,
-            color: appTheme?.palette?.editor?.tv_hover_text
-          }
-        },
-        "&:hover": {
-          background: appTheme?.palette?.editor?.tv_hover_bg,
-          color: appTheme?.palette?.editor?.tv_hover_text
-        }
-      }
-    }
-  },
-  autocomplete: {
-    border: `1px solid ${appTheme?.palette?.editor?.tv_border}`,
-    background: appTheme?.palette?.editor?.tv_pop_bg,
-    color: appTheme?.palette?.editor?.tv_text_primary,
-    borderRadius: "8px",
-    "& ul": {
-      padding: "4px",
-      "& .MuiAutocomplete-option": {
-        padding: "4px 6px",
-        borderRadius: "8px",
-        color: appTheme?.palette?.editor?.tv_text_primary,
-        fontSize: "14px",
-        "& .MuiAvatar-root": {
-          width: "20px",
-          height: "20px",
-          marginLeft: "8px",
-          fontSize: "16px",
-          padding: "2px",
-          textTransform: "capitalize"
-        },
-        "&.Mui-selected": {
-          background: appTheme?.palette?.editor?.tv_hover_bg,
-          color: appTheme?.palette?.editor?.tv_hover_text,
-          "&:hover": {
-            background: appTheme?.palette?.editor?.tv_hover_bg,
-            color: appTheme?.palette?.editor?.tv_hover_text
-          }
-        },
-        "&:hover": {
-          background: appTheme?.palette?.editor?.tv_hover_bg,
-          color: appTheme?.palette?.editor?.tv_hover_text
-        }
-      }
-    }
-  }
-});
-export default useCompStyles;

package/dist/Editor/Elements/DataView/Layouts/DataTypes/DateType.js

@@ -1,35 +0,0 @@
-import React from "react";
-import DatePicker from "react-datepicker";
-import { useDataView } from "../../Providers/DataViewProvider";
-import { jsx as _jsx } from "react/jsx-runtime";
-function isValidDate(dateString) {
-  const date = new Date(dateString);
-  return !isNaN(date.getTime());
-}
-const DateType = props => {
-  const {
-    rowIndex,
-    property,
-    value,
-    readOnly
-  } = props;
-  const {
-    onChange
-  } = useDataView();
-  const handleChange = date => {
-    onChange(rowIndex, {
-      [property]: date
-    });
-  };
-  return /*#__PURE__*/_jsx(DatePicker, {
-    disabled: readOnly,
-    selected: isValidDate(value) ? new Date(value) : "",
-    onChange: handleChange,
-    onKeyDown: e => {
-      e.preventDefault();
-      console.log(e?.target.value);
-    },
-    placeholderText: "MM/DD/YYYY"
-  });
-};
-export default DateType;

package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js

@@ -1,39 +0,0 @@
-import React from "react";
-import { useDataView } from "../../Providers/DataViewProvider";
-import Select from "./Components/Select";
-import { jsx as _jsx } from "react/jsx-runtime";
-const MultiSelectType = props => {
-  const {
-    rowIndex,
-    property,
-    value: pValue,
-    options,
-    label = "",
-    readOnly
-  } = props;
-  const {
-    onChange
-  } = useDataView();
-  const value = Array.isArray(pValue) ? pValue : [];
-  const coloredValues = [...(value || [])]?.map(m => {
-    return {
-      ...m,
-      color: options?.find(f => f.value === m.value)?.color || "#FFF"
-    };
-  });
-  const handleChange = data => {
-    onChange(rowIndex, {
-      [property]: data?.filter(f => f?.value)
-    });
-  };
-  return /*#__PURE__*/_jsx(Select, {
-    value: coloredValues,
-    onChange: handleChange,
-    options: options,
-    multiple: true,
-    limitTags: 2,
-    placeholder: label,
-    disabled: readOnly
-  });
-};
-export default MultiSelectType;

package/dist/Editor/Elements/DataView/Layouts/DataTypes/NumberType.js

@@ -1,30 +0,0 @@
-import React from "react";
-import { TextField } from "@mui/material";
-import { useDataView } from "../../Providers/DataViewProvider";
-import { jsx as _jsx } from "react/jsx-runtime";
-const NumberType = props => {
-  const {
-    rowIndex,
-    property,
-    value,
-    readOnly
-  } = props;
-  const {
-    onChange
-  } = useDataView();
-  const handleChange = e => {
-    onChange(rowIndex, {
-      [property]: e?.target?.value
-    });
-  };
-  return /*#__PURE__*/_jsx(TextField, {
-    type: "number",
-    fullWidth: true,
-    className: "fe-tv-type_text",
-    value: value,
-    size: "small",
-    onChange: handleChange,
-    disabled: readOnly
-  });
-};
-export default NumberType;

package/dist/Editor/Elements/DataView/Layouts/DataTypes/PersonType.js

@@ -1,30 +0,0 @@
-import React from "react";
-import { useDataView } from "../../Providers/DataViewProvider";
-import Select from "./Components/Select";
-import { jsx as _jsx } from "react/jsx-runtime";
-const PersonType = props => {
-  const {
-    rowIndex,
-    property,
-    value,
-    readOnly
-  } = props;
-  const {
-    onChange,
-    users
-  } = useDataView();
-  const handleChange = data => {
-    onChange(rowIndex, {
-      [property]: data?.filter(f => f?.value)
-    });
-  };
-  return /*#__PURE__*/_jsx(Select, {
-    value: value || [],
-    onChange: handleChange,
-    options: users || [],
-    multiple: false,
-    disabled: readOnly,
-    optionAvatar: true
-  });
-};
-export default PersonType;

package/dist/Editor/Elements/DataView/Layouts/DataTypes/SelectType.js

@@ -1,35 +0,0 @@
-import React from "react";
-import { useDataView } from "../../Providers/DataViewProvider";
-import Select from "./Components/Select";
-import { jsx as _jsx } from "react/jsx-runtime";
-const SelectType = props => {
-  const {
-    rowIndex,
-    property,
-    value,
-    options,
-    readOnly
-  } = props;
-  const {
-    onChange
-  } = useDataView();
-  const coloredValues = [...(value || [])]?.map(m => {
-    return {
-      ...m,
-      color: options?.find(f => f.value === m.value)?.color
-    };
-  });
-  const handleChange = data => {
-    onChange(rowIndex, {
-      [property]: data?.filter(f => f?.value)
-    });
-  };
-  return /*#__PURE__*/_jsx(Select, {
-    value: coloredValues,
-    onChange: handleChange,
-    options: options,
-    multiple: false,
-    disabled: readOnly
-  });
-};
-export default SelectType;

package/dist/Editor/Elements/DataView/Layouts/DataTypes/TextType.js

@@ -1,36 +0,0 @@
-import React from "react";
-import { TextField } from "@mui/material";
-import { useDataView } from "../../Providers/DataViewProvider";
-import { jsx as _jsx } from "react/jsx-runtime";
-const TextType = props => {
-  const {
-    rowIndex,
-    property,
-    value,
-    readOnly
-  } = props;
-  const {
-    onChange
-  } = useDataView();
-  const handleChange = e => {
-    onChange(rowIndex, {
-      [property]: e?.target?.value
-    });
-  };
-  const formatValue = () => {
-    if (typeof value === "string") {
-      return value;
-    } else if (value[0]) {
-      return value?.map(m => m.value).join(", ");
-    }
-  };
-  return /*#__PURE__*/_jsx(TextField, {
-    fullWidth: true,
-    className: "fe-tv-type_text",
-    value: formatValue(value),
-    size: "small",
-    onChange: handleChange,
-    disabled: readOnly
-  });
-};
-export default TextType;

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

@@ -1,17 +0,0 @@
-import TextType from "./TextType";
-import DateType from "./DateType";
-import SelectType from "./SelectType";
-import MultiSelectType from "./MultiSelectType";
-import NumberType from "./NumberType";
-import CheckType from "./CheckType";
-import PersonType from "./PersonType";
-const DataTypes = {
-  text: TextType,
-  date: DateType,
-  select: SelectType,
-  "multi-select": MultiSelectType,
-  number: NumberType,
-  check: CheckType,
-  person: PersonType
-};
-export default DataTypes;

package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/ChooseField.js

@@ -1,29 +0,0 @@
-import React from "react";
-import { Box } from "@mui/material";
-import SimpleSelect from "../../DataTypes/Components/SimpleSelect";
-import { jsx as _jsx } from "react/jsx-runtime";
-const ChooseField = props => {
-  const {
-    sort,
-    properties,
-    onChange
-  } = props;
-  const handleChange = e => {
-    onChange(sort, {
-      newKey: e?.target?.value
-    });
-  };
-  return /*#__PURE__*/_jsx(Box, {
-    sx: {
-      width: "120px",
-      mr: 1
-    },
-    className: "tv-cf",
-    children: /*#__PURE__*/_jsx(SimpleSelect, {
-      value: sort?.key,
-      options: properties,
-      handleChange: handleChange
-    })
-  });
-};
-export default ChooseField;

package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/ChooseSort.js

@@ -1,38 +0,0 @@
-import React from "react";
-import { Box } from "@mui/material";
-import SimpleSelect from "../../DataTypes/Components/SimpleSelect";
-import { jsx as _jsx } from "react/jsx-runtime";
-const SORT_LABELS = {
-  asc: "Ascending",
-  desc: "Descending"
-};
-const SORT_OPTIONS = [{
-  key: "asc",
-  label: SORT_LABELS.asc
-}, {
-  key: "desc",
-  label: SORT_LABELS.desc
-}];
-const ChooseSort = props => {
-  const {
-    sort,
-    onChange
-  } = props;
-  const handleChange = e => {
-    onChange(sort, {
-      operator: e?.target?.value
-    });
-  };
-  return /*#__PURE__*/_jsx(Box, {
-    sx: {
-      width: "120px"
-    },
-    className: "tv-cf",
-    children: /*#__PURE__*/_jsx(SimpleSelect, {
-      value: sort?.operator,
-      options: SORT_OPTIONS,
-      handleChange: handleChange
-    })
-  });
-};
-export default ChooseSort;

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

@@ -1,86 +0,0 @@
-import React from "react";
-import { Box, List, ListItem, ListItemButton, ListItemIcon, ListItemText } from "@mui/material";
-import { useDataView } from "../../../Providers/DataViewProvider";
-import ChooseSort from "./ChooseSort";
-import ChooseField from "./ChooseField";
-import ColumnsList from "../../Options/ColumnsList";
-import Icon from "../../../../../common/Icon";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const SortOptions = props => {
-  const {
-    onClose
-  } = props;
-  const {
-    properties,
-    sort,
-    onUpdateSort
-  } = useDataView();
-  const handleSortChange = (currentSortData, data = {}) => {
-    onUpdateSort({
-      ...currentSortData,
-      ...data
-    });
-  };
-  const handleDelete = () => {
-    onClose();
-    onUpdateSort({}, false, true);
-  };
-  const onSelect = s => () => {
-    onUpdateSort({
-      ...s,
-      newKey: s.key,
-      operator: "asc"
-    }, false, false);
-    onClose();
-  };
-  return sort?.length > 0 ? /*#__PURE__*/_jsxs(List, {
-    className: "tv-opt-list",
-    sx: {
-      padding: '0px !important'
-    },
-    children: [sort?.map((m, i) => {
-      return /*#__PURE__*/_jsx(ListItem, {
-        sx: {
-          justifyContent: "space-between",
-          paddingLeft: 0,
-          paddingRight: 0
-        },
-        children: /*#__PURE__*/_jsxs(Box, {
-          sx: {
-            display: "flex",
-            padding: 0
-          },
-          children: [/*#__PURE__*/_jsx(ChooseField, {
-            sort: m,
-            properties: properties,
-            onChange: handleSortChange
-          }), /*#__PURE__*/_jsx(ChooseSort, {
-            sort: m,
-            onChange: handleSortChange
-          })]
-        })
-      }, i);
-    }), /*#__PURE__*/_jsxs(ListItemButton, {
-      onClick: handleDelete,
-      children: [/*#__PURE__*/_jsx(ListItemIcon, {
-        sx: {
-          minWidth: '25px !important',
-          '& svg': {
-            background: 'transparent !important',
-            padding: '0 !important'
-          }
-        },
-        children: /*#__PURE__*/_jsx(Icon, {
-          icon: 'trashIcon'
-        })
-      }), /*#__PURE__*/_jsx(ListItemText, {
-        children: "Delete Sort"
-      })]
-    })]
-  }) : /*#__PURE__*/_jsx(ColumnsList, {
-    properties: properties,
-    onSelect: onSelect
-  });
-};
-export default SortOptions;