@flozy/editor 5.5.7 → 5.5.8

package/dist/Editor/Elements/DataView/DataViewButton.js

@@ -1,23 +0,0 @@
-import React from "react";
-import ToolbarIcon from "../../common/ToolbarIcon";
-import Icon from "../../common/Icon";
-import { insertDataView } from "../../utils/dataView";
-import { jsx as _jsx } from "react/jsx-runtime";
-const DataViewButton = props => {
-  const {
-    editor,
-    icoBtnType
-  } = props;
-  const onClick = () => {
-    insertDataView(editor);
-  };
-  return /*#__PURE__*/_jsx(ToolbarIcon, {
-    title: "Dynamic Table",
-    onClick: onClick,
-    icon: /*#__PURE__*/_jsx(Icon, {
-      icon: "dataView"
-    }),
-    icoBtnType: icoBtnType
-  });
-};
-export default DataViewButton;

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

@@ -1,83 +0,0 @@
-import React, { useEffect, useRef, useState } from "react";
-import { Box, Checkbox, Popper, useTheme } from "@mui/material";
-import DataTypes from "./DataTypes";
-import useColumnStyles from "./colStyles";
-import Icon from "../../../common/Icon";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const ColumnView = props => {
-  const theme = useTheme();
-  const {
-    needAnchor,
-    rowIndex,
-    row,
-    property,
-    onSelect,
-    selected,
-    readOnly
-  } = props;
-  const DataType = DataTypes[property?.type] || DataTypes["text"];
-  const anchorRef = useRef(null);
-  const [anchorEl, setAnchorEl] = useState(null);
-  const [popperRefresh, setPopperRefresh] = useState(new Date().getTime());
-  const open = Boolean(anchorEl);
-  const classes = useColumnStyles(theme);
-  const parentRef = useRef(null);
-  useEffect(() => {
-    if (!anchorRef?.current) return;
-    setAnchorEl(anchorRef?.current);
-    parentRef.current = anchorRef?.current.closest(".tv-d-wrapper");
-    const resizeObserver = new ResizeObserver(() => {
-      if (parentRef?.current) {
-        setPopperRefresh(new Date().getTime());
-      }
-    });
-    resizeObserver.observe(parentRef.current);
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, [anchorRef?.current]);
-  const handleSelect = id => e => {
-    onSelect(id, e.target.checked);
-  };
-  return /*#__PURE__*/_jsxs(Box, {
-    component: "td",
-    children: [needAnchor ? /*#__PURE__*/_jsx("span", {
-      ref: anchorRef,
-      style: {
-        position: "absolute",
-        width: "1px"
-      }
-    }) : null, /*#__PURE__*/_jsx(DataType, {
-      options: property?.options,
-      property: property?.key,
-      value: row[property?.key] || "",
-      rowIndex: rowIndex,
-      label: property?.label,
-      readOnly: readOnly
-    }), needAnchor && !readOnly ? /*#__PURE__*/_jsx(Popper, {
-      sx: classes.root,
-      open: open,
-      anchorEl: anchorEl,
-      placement: "left",
-      className: `tv-tr-pop ${selected ? "active" : ""}`,
-      disablePortal: true,
-      children: /*#__PURE__*/_jsx(Checkbox, {
-        onClick: handleSelect(row?.id),
-        size: "small",
-        className: "tv-ck-box",
-        sx: {
-          mr: 0
-        },
-        checked: selected,
-        icon: /*#__PURE__*/_jsx(Icon, {
-          icon: "uncheckedIcon"
-        }),
-        checkedIcon: /*#__PURE__*/_jsx(Icon, {
-          icon: "checkedIcon"
-        })
-      })
-    }, popperRefresh) : null]
-  });
-};
-export default ColumnView;

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

@@ -1,33 +0,0 @@
-import React from "react";
-import { useDataView } from "../../Providers/DataViewProvider";
-import Checkbox from "@mui/material/Checkbox";
-import Icon from "../../../../common/Icon";
-import { jsx as _jsx } from "react/jsx-runtime";
-const CheckType = props => {
-  const {
-    rowIndex,
-    property,
-    value,
-    readOnly
-  } = props;
-  const {
-    onChange
-  } = useDataView();
-  const handleChange = e => {
-    onChange(rowIndex, {
-      [property]: e?.target?.checked
-    });
-  };
-  return /*#__PURE__*/_jsx(Checkbox, {
-    checked: value || false,
-    icon: /*#__PURE__*/_jsx(Icon, {
-      icon: "checkListButton"
-    }),
-    checkedIcon: /*#__PURE__*/_jsx(Icon, {
-      icon: "checkListButtonActive"
-    }),
-    onChange: handleChange,
-    disabled: readOnly
-  }, rowIndex);
-};
-export default CheckType;

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;