@flozy/editor 10.2.6 → 10.2.7

package/dist/Editor/common/ImageSelector/ImageSelector.js

@@ -17,7 +17,7 @@ const IMAGE_SLECTOR_OPTIONS = {
 };
 const TAB_SHOW = {
   Image: ["upload", "choose", "addLink"],
-  Video: ["addLink"],
+  Video: ["upload", "addLink"],
   Embed: ["addLink"],
   Document: ["addLink", "upload"]
 };
@@ -35,7 +35,7 @@ const ImageSelector = props => {
     customProps
   } = props;
   const translation = customProps?.translation;
-  const [tabValue, setTabValue] = useState(title === "Image" ? "choose" : "addLink");
+  const [tabValue, setTabValue] = useState(title === "Image" ? "choose" : "Video" ? "upload" : "addLink");
   const [image, setImage] = useState(value || "");
   const handleTabChange = (e, newValue) => {
     setImage("");

package/dist/Editor/common/StyleBuilder/embedVideoStyle.js

@@ -6,6 +6,10 @@ const embedVideoStyle = [{
     label: "URL",
     key: "url",
     type: "text"
+  }, {
+    label: "File",
+    key: "url",
+    type: "embedUpload"
   }]
 }, {
   tab: "Aspect Ratio",

package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js

@@ -0,0 +1,115 @@
+import React, { useState } from "react";
+import { Grid, Button, Typography } from "@mui/material";
+import ImageSelector from "../../ImageSelector/ImageSelector";
+import UploadStyles from "../../ImageSelector/UploadStyles";
+import Icon from "../../Icon";
+import { useEditorContext } from "../../../hooks/useMouseMove";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const EmbedUpload = props => {
+  const {
+    value,
+    data,
+    customProps,
+    onChange
+  } = props;
+  const {
+    translation
+  } = customProps;
+  const {
+    key
+  } = data;
+  const [base64, setBase64] = useState(value);
+  const [open, setOpen] = useState(false);
+  const {
+    theme
+  } = useEditorContext();
+  const classes = UploadStyles(theme);
+  const onRemoveBG = () => {
+    setBase64(null);
+    onChange({
+      [key]: "none"
+    });
+  };
+  const handleClick = () => {
+    setOpen(true);
+  };
+  const handleClose = () => {
+    setOpen(false);
+  };
+  const onSelectImage = img => {
+    setBase64(img);
+    onChange({
+      [key]: img
+    });
+    handleClose();
+  };
+  return /*#__PURE__*/_jsxs(Grid, {
+    item: true,
+    xs: 12,
+    children: [/*#__PURE__*/_jsx(Typography, {
+      variant: "body1",
+      color: "primary",
+      sx: {
+        fontSize: "14px",
+        fontWeight: "500",
+        marginBottom: "8px"
+      },
+      children: translation("Upload Video")
+    }), /*#__PURE__*/_jsx(Grid, {
+      container: true,
+      sx: classes.uploadContainer,
+      children: /*#__PURE__*/_jsx(Grid, {
+        item: true,
+        xs: 12,
+        sx: classes.uploadField,
+        children: /*#__PURE__*/_jsx(Grid, {
+          className: "uploadImageSection",
+          children: base64 ? /*#__PURE__*/_jsxs(Grid, {
+            justifyItems: "center",
+            alignItems: "center",
+            children: [/*#__PURE__*/_jsx(Typography, {
+              style: {
+                padding: "8px",
+                fontSize: "8px",
+                color: theme?.palette?.editor?.textColor,
+                textAlign: "center"
+              },
+              children: base64
+            }), /*#__PURE__*/_jsx(Grid, {
+              className: "removeImageText",
+              onClick: onRemoveBG,
+              children: translation("REMOVE")
+            })]
+          }) : /*#__PURE__*/_jsx(Grid, {
+            className: "uploadImageText",
+            children: /*#__PURE__*/_jsxs(Button, {
+              component: "label",
+              variant: "text",
+              style: {
+                background: "none"
+              },
+              onClick: handleClick,
+              sx: classes.uploadIcon,
+              children: [/*#__PURE__*/_jsx(Icon, {
+                icon: "fileUpload"
+              }), /*#__PURE__*/_jsx("span", {
+                style: {
+                  paddingLeft: "8px"
+                },
+                children: translation("Upload a Video")
+              })]
+            })
+          })
+        })
+      })
+    }), /*#__PURE__*/_jsx(ImageSelector, {
+      open: open,
+      title: "Video",
+      onClose: handleClose,
+      customProps: customProps,
+      onSelectImage: onSelectImage
+    })]
+  });
+};
+export default EmbedUpload;

package/dist/Editor/common/StyleBuilder/fieldTypes/index.js

@@ -19,6 +19,7 @@ import SelectSwitch from "./selectSwitch";
 import CardsMapping from "./card";
 import MetaDataMapping from "./metaDataMapping";
 import LineSpacing from "./lineSpacing";
+import EmbedUpload from "./embedUpload";
 const FieldMap = {
   text: Text,
   bannerSpacing: BannerSpacing,
@@ -40,6 +41,7 @@ const FieldMap = {
   selectSwitch: SelectSwitch,
   card: CardsMapping,
   metadatamapping: MetaDataMapping,
-  lineSpacing: LineSpacing
+  lineSpacing: LineSpacing,
+  embedUpload: EmbedUpload
 };
 export default FieldMap;

package/dist/Editor/common/Uploader.js

@@ -22,6 +22,12 @@ const Uploader = props => {
   const {
     theme
   } = useEditorContext();
+  const allowedFormat = {
+    "Document": ".pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt,.rtf",
+    "Image": "image/*",
+    "Video": "video/*",
+    "Embed": "*"
+  };
   const handleChange = async e => {
     const uFile = e.target.files[0];
     const strImage = await convertBase64(uFile);
@@ -63,6 +69,7 @@ const Uploader = props => {
   const renderThumb = () => {
     switch (title) {
       case "Document":
+      case "Video":
         return /*#__PURE__*/_jsxs(_Fragment, {
           children: [/*#__PURE__*/_jsx(Typography, {
             style: {
@@ -120,6 +127,7 @@ const Uploader = props => {
               sx: classes.uploadIcon,
               children: [/*#__PURE__*/_jsx("input", {
                 type: "file",
+                accept: allowedFormat[title],
                 style: {
                   opacity: 0,
                   width: "0px"

package/dist/Editor/themeSettings/index.js

@@ -72,11 +72,9 @@ const ThemeSettings = props => {
       });
       const currentSelectedTheme = result?.data?.find(d => d.id === id);
       const currThemeName = currentSelectedTheme?.name;
-      if (currThemeName && currThemeName !== name) {
+      if (currentSelectedTheme) {
         // for theme templates created by design team
-        updateTheme({
-          name: currThemeName
-        });
+        updateTheme(currentSelectedTheme);
       }
       setThemes(result?.data || []);
     } catch (err) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flozy/editor",
-  "version": "10.2.6",
+  "version": "10.2.7",
   "description": "An Editor for flozy app brain",
   "files": [
     "dist"