@flozy/editor 7.0.8 → 7.0.9

package/dist/Editor/themeSettingsAI/index.js

@@ -1,356 +0,0 @@
-import React, { useState } from "react";
-import { Button, Checkbox, CircularProgress, Divider, Drawer, FormControlLabel, Grid, IconButton, InputAdornment, Tab, Tabs, TextField, TextareaAutosize, Typography, styled } from "@mui/material";
-
-// Style
-import Style from "./style";
-
-// icons
-import { CloseIcon } from "../common/iconslist";
-import { CloudIcon } from "./icons";
-import { TickIcon } from "./icons";
-import { ResetIcon } from "./icons";
-import { useEditorTheme } from "../hooks/useEditorTheme";
-import ActiveTheme from "../themeSettings/ActiveTheme";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-function generateUniqueId() {
-  const timestamp = Date.now(); // current timestamp in milliseconds
-  const randomNum = Math.floor(Math.random() * 1000000); // random number for uniqueness
-  return `id_${timestamp}_${randomNum}`;
-}
-async function getTheme(fileInputRef, onThemeChange, setLoading) {
-  const file = fileInputRef.current?.files[0];
-  if (file) {
-    setLoading(true);
-    // Create a FormData object to hold the file
-    const formData = new FormData();
-    formData.append("file", file); // 'image' is the key that your backend will use to access the file
-
-    try {
-      // Send the file using the fetch API
-      const response = await fetch("https://aicheck.agenciflow.com/create", {
-        method: "POST",
-        body: formData
-      });
-
-      // Handle the response
-      if (response.ok) {
-        const data = await response.json(); // Assuming the response is JSON
-        const theme = JSON.parse(data?.response || "{}");
-        onThemeChange({
-          id: generateUniqueId(),
-          name: "AI Generated",
-          theme: theme
-        });
-      } else {
-        console.error("Error:", response.statusText);
-      }
-    } catch (error) {
-      console.error("Fetch error:", error);
-    }
-    setLoading(false);
-  } else {
-    console.log("No file selected");
-  }
-}
-const ThemeSettingsAI = props => {
-  const {
-    className,
-    openAITheme,
-    setOpenAITheme
-  } = props;
-
-  // State
-  // const [themeDrawer, setThemeDrawer] = useState(true);
-  const [themeTabType, setThemeTabType] = React.useState(0);
-  const [enableGenerateTheme, setEnableGenerateTheme] = React.useState(false);
-  const [generateTheme] = React.useState(false);
-  const [loading, setLoading] = React.useState(false);
-  const [imageSrc, setImageSrc] = useState(null);
-  const {
-    updateTheme
-  } = useEditorTheme();
-  const onThemeChange = theme => {
-    updateTheme(theme, {
-      action: "THEME_CHANGE"
-    });
-  };
-
-  //   image upload
-  const fileInputRef = React.useRef(null);
-  const handleDivClick = () => {
-    // Trigger the click event on the hidden file input element
-    fileInputRef.current.click();
-  };
-  const handleImageUpload = event => {
-    const file = event.target.files[0];
-    if (file) {
-      const reader = new FileReader();
-      reader.onload = () => {
-        setImageSrc(reader.result);
-      };
-      reader.readAsDataURL(file);
-      setEnableGenerateTheme(true);
-    }
-  };
-  const handleTabChange = (event, newValue) => {
-    setThemeTabType(newValue);
-  };
-  const handleClose = () => {
-    setOpenAITheme(false);
-  };
-
-  // themeCard
-  // const ThemeCard = () => {
-  //   return (
-  //     <Grid className="themeCardWrapper">
-  //       {/* remove selected based on condition */}
-  //       <Grid
-  //         container
-  //         justifyContent={"space-between"}
-  //         className="themeCard selected"
-  //       >
-  //         <TickIcon />
-  //         <Grid>
-  //           <Typography variant="body1" className="fs-14 fw-500">
-  //             Slate Gray
-  //           </Typography>
-  //           <Typography
-  //             variant="body2"
-  //             color={"textSecondary"}
-  //             className="fs-12"
-  //           >
-  //             Muted Elegance
-  //           </Typography>
-  //         </Grid>
-  //         <Grid className="flexAlign" sx={{ gap: "5px" }}>
-  //           <Grid className="primaryCard"></Grid>
-  //           <Grid className="secondaryCard"></Grid>
-  //           <Grid className="otherColors" sx={{ gap: "5px" }}>
-  //             <Grid className="smallCard"></Grid>
-  //             <Grid className="smallCard"></Grid>
-  //             <Grid className="smallCard"></Grid>
-  //             <Grid className="smallCard"></Grid>
-  //           </Grid>
-  //         </Grid>
-  //       </Grid>
-  //     </Grid>
-  //   );
-  // };
-
-  return /*#__PURE__*/_jsx(Grid, {
-    className: className,
-    children: /*#__PURE__*/_jsx(Drawer, {
-      className: className,
-      open: openAITheme,
-      onClose: handleClose,
-      anchor: "right",
-      children: /*#__PURE__*/_jsxs(Grid, {
-        className: "settingsContainer",
-        children: [/*#__PURE__*/_jsxs(Grid, {
-          container: true,
-          justifyContent: "space-between",
-          wrap: "nowrap",
-          className: "header",
-          children: [/*#__PURE__*/_jsx(Grid, {
-            children: /*#__PURE__*/_jsx(Typography, {
-              variant: "body1",
-              className: "title",
-              children: "Create theme with AI"
-            })
-          }), /*#__PURE__*/_jsx(IconButton, {
-            className: "closeBtn",
-            onClick: handleClose,
-            children: /*#__PURE__*/_jsx(CloseIcon, {})
-          })]
-        }), /*#__PURE__*/_jsxs(Tabs, {
-          value: themeTabType,
-          onChange: handleTabChange,
-          variant: "scrollable",
-          scrollButtons: false,
-          "aria-label": "scrollable prevent tabs example",
-          sx: {
-            mb: 2
-          },
-          children: [/*#__PURE__*/_jsx(Tab, {
-            label: /*#__PURE__*/_jsx(Typography, {
-              variant: "body1",
-              className: "fs-14 fw-500 transformNone",
-              children: "Image"
-            })
-          }), /*#__PURE__*/_jsx(Tab, {
-            label: /*#__PURE__*/_jsx(Typography, {
-              variant: "body1",
-              className: "fs-14 fw-500 transformNone",
-              children: "Text"
-            })
-          }), /*#__PURE__*/_jsx(Tab, {
-            label: /*#__PURE__*/_jsx(Typography, {
-              variant: "body1",
-              className: "fs-14 fw-500 transformNone",
-              children: "Image link"
-            })
-          })]
-        }), themeTabType === 0 && /*#__PURE__*/_jsx(Grid, {
-          className: "imageUpload",
-          children: /*#__PURE__*/_jsxs(Grid, {
-            container: true,
-            justifyContent: "center",
-            alignItems: "center",
-            className: "imgUploadInner",
-            onClick: handleDivClick,
-            children: [/*#__PURE__*/_jsx("input", {
-              type: "file",
-              accept: ".png",
-              ref: fileInputRef,
-              onChange: handleImageUpload,
-              style: {
-                display: "none"
-              }
-            }), imageSrc ? /*#__PURE__*/_jsxs(_Fragment, {
-              children: [/*#__PURE__*/_jsx(IconButton, {
-                className: "resetIcon",
-                onClick: () => setImageSrc(null),
-                children: /*#__PURE__*/_jsx(ResetIcon, {})
-              }), /*#__PURE__*/_jsx(Grid, {
-                className: "changeImgText",
-                children: "Change Image"
-              }), /*#__PURE__*/_jsx("img", {
-                src: imageSrc,
-                alt: "Uploaded Preview",
-                className: "uploadedImage"
-              })]
-            }) : /*#__PURE__*/_jsxs(Grid, {
-              container: true,
-              justifyContent: "center",
-              alignItems: "center",
-              direction: "column",
-              children: [/*#__PURE__*/_jsx(CloudIcon, {}), /*#__PURE__*/_jsx(Typography, {
-                variant: "body1",
-                className: "fw-600",
-                sx: {
-                  pb: 0.5
-                },
-                children: "Upload a logo or image"
-              }), /*#__PURE__*/_jsx(Typography, {
-                variant: "body2",
-                className: "fs-12",
-                color: "textSecondary",
-                children: "Click here to upload PDF, PPT, and image files."
-              })]
-            })]
-          })
-        }), themeTabType === 1 && /*#__PURE__*/_jsx(Grid, {
-          className: "textArea",
-          children: /*#__PURE__*/_jsx(TextareaAutosize, {
-            placeholder: "Describe the theme you are interested in..."
-          })
-        }), themeTabType === 2 && /*#__PURE__*/_jsxs(_Fragment, {
-          children: [/*#__PURE__*/_jsx(Grid, {
-            className: "textArea imageUrl invalidUrl",
-            children: /*#__PURE__*/_jsx(TextField, {
-              fullWidth: true,
-              placeholder: "Add Image URL",
-              size: "small"
-              //   value={imageUrl}
-              ,
-              id: "outlined-basic",
-              variant: "outlined",
-              InputProps: {
-                endAdornment: /*#__PURE__*/_jsx(InputAdornment, {
-                  position: "end",
-                  children: /*#__PURE__*/_jsx(TickIcon, {})
-                })
-              }
-            })
-          }), /*#__PURE__*/_jsx(Grid, {
-            className: "imageUpload",
-            children: /*#__PURE__*/_jsx(Grid, {
-              container: true,
-              justifyContent: "center",
-              justifyItems: "center",
-              className: "imgUploadInner",
-              children: /*#__PURE__*/_jsx(Grid, {
-                container: true,
-                justifyContent: "center",
-                alignItems: "center",
-                direction: "column",
-                children: /*#__PURE__*/_jsx("img", {
-                  src: "",
-                  alt: ""
-                })
-              })
-            })
-          })]
-        }), /*#__PURE__*/_jsxs(Grid, {
-          children: [/*#__PURE__*/_jsx(FormControlLabel, {
-            sx: {
-              mb: 1,
-              mt: 1
-            },
-            control: /*#__PURE__*/_jsx(Checkbox, {
-              checked: enableGenerateTheme,
-              onChange: event => setEnableGenerateTheme(event.target.checked),
-              size: "small"
-            }),
-            label: /*#__PURE__*/_jsx(Typography, {
-              variant: "body2",
-              className: "fs-12",
-              children: "a generated theme is used, the site text style will also change."
-            })
-          }), /*#__PURE__*/_jsxs(Grid, {
-            container: true,
-            justifyContent: generateTheme ? "space-between" : "flex-end",
-            children: [generateTheme && /*#__PURE__*/_jsx(Button, {
-              className: "outlineBtn",
-              variant: "outlined",
-              size: "small",
-              color: "primary",
-              children: "Regenerate theme"
-            }), /*#__PURE__*/_jsxs(Button, {
-              variant: "contained",
-              size: "small",
-              className: `blueBtn ${enableGenerateTheme ? "eanbled" : "disabled"}`,
-              disabled: loading,
-              onClick: () => {
-                // setGenerateTheme(true);
-                getTheme(fileInputRef, onThemeChange, setLoading);
-              },
-              children: [loading ? /*#__PURE__*/_jsx(CircularProgress, {
-                size: 18,
-                style: {
-                  marginRight: "10px"
-                }
-              }) : null, loading ? "Generating..." : "Generate Theme"]
-            })]
-          })]
-        }), /*#__PURE__*/_jsx(Divider, {
-          sx: {
-            mt: 2,
-            mb: 2
-          }
-        }), /*#__PURE__*/_jsx(Typography, {
-          variant: "body1",
-          className: "fs-14 fw-600",
-          sx: {
-            mt: 1,
-            mb: 1
-          },
-          children: "Active Theme"
-        }), /*#__PURE__*/_jsx(Grid, {
-          className: "themeCardWrapper",
-          children: /*#__PURE__*/_jsxs(Grid, {
-            container: true,
-            justifyContent: "space-between",
-            className: "themeCard selected",
-            children: [/*#__PURE__*/_jsx(TickIcon, {}), /*#__PURE__*/_jsx(ActiveTheme, {
-              explore: false
-            })]
-          })
-        })]
-      })
-    })
-  });
-};
-export default styled(ThemeSettingsAI)(Style);

package/dist/Editor/themeSettingsAI/saveTheme.js

@@ -1,197 +0,0 @@
-import React, { useEffect, useState } from "react";
-import { Box, Button, CircularProgress, Dialog, Divider, Grid, IconButton, TextField, Typography, styled } from "@mui/material";
-
-// Style
-import Style from "./style";
-
-// icons
-import { CloseIcon } from "../common/iconslist";
-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 SaveTheme = props => {
-  const {
-    className,
-    // enableGenerateTheme,
-    saveBtnLabel,
-    loading,
-    onSave,
-    defaultFormData = {}
-  } = props;
-
-  // State
-  const [saveTheme, setSaveTheme] = useState(false);
-  const [error, setError] = useState({});
-  const [form, setForm] = useState(defaultFormData);
-  const {
-    name,
-    mood_name
-  } = form;
-  const updateForm = update => {
-    setForm(prev => ({
-      ...prev,
-      ...update
-    }));
-  };
-  useEffect(() => {
-    setForm(defaultFormData);
-  }, [defaultFormData]);
-  const onClose = () => {
-    setSaveTheme(false);
-    setError({});
-    setForm({});
-  };
-  const validate = () => {
-    let err = {};
-    if (!name) {
-      err.name = "This field is required!";
-    }
-    if (!mood_name) {
-      err.mood_name = "This field is required!";
-    }
-    return err;
-  };
-  console.log("className", className);
-  return /*#__PURE__*/_jsxs(Box, {
-    className: className,
-    children: [/*#__PURE__*/_jsx(Button, {
-      variant: "contained",
-      size: "small"
-      // className={`blueBtn ${enableGenerateTheme ? "eanbled" : "disabled"}`}
-      // disabled={!enableGenerateTheme}
-      ,
-      className: `blueBtn`,
-      onClick: () => setSaveTheme(true),
-      children: saveBtnLabel
-    }), /*#__PURE__*/_jsx(Dialog, {
-      fullWidth: true,
-      maxWidth: "sm",
-      open: saveTheme,
-      onClose: onClose,
-      className: className,
-      sx: {
-        borderRadius: "10px"
-      },
-      children: /*#__PURE__*/_jsxs(Grid, {
-        className: "saveThemeContainer",
-        sx: {
-          p: 2,
-          pt: 2.5
-        },
-        children: [/*#__PURE__*/_jsxs(Grid, {
-          container: true,
-          justifyContent: "space-between",
-          children: [/*#__PURE__*/_jsx(Typography, {
-            variant: "h4",
-            sx: {
-              fontSize: "20px"
-            },
-            className: "fw-600",
-            children: "Save Your theme"
-          }), /*#__PURE__*/_jsx(IconButton, {
-            onClick: onClose,
-            className: "closeBtn",
-            children: /*#__PURE__*/_jsx(CloseIcon, {})
-          })]
-        }), /*#__PURE__*/_jsx(Divider, {
-          sx: {
-            mt: 2,
-            mb: 2
-          }
-        }), /*#__PURE__*/_jsx(Typography, {
-          variant: "body1",
-          className: "fw-500",
-          sx: {
-            pb: 1
-          },
-          children: "Theme name"
-        }), /*#__PURE__*/_jsx(TextField, {
-          variant: "outlined",
-          fullWidth: true,
-          size: "small",
-          placeholder: "Ex : Forest green",
-          onChange: e => updateForm({
-            name: e.target.value
-          }),
-          value: name
-        }), /*#__PURE__*/_jsx(Error, {
-          error: error?.name
-        }), /*#__PURE__*/_jsx(Typography, {
-          variant: "body1",
-          className: "fw-500",
-          sx: {
-            pt: 2,
-            pb: 1
-          },
-          children: "Category"
-        }), /*#__PURE__*/_jsx(TextField, {
-          variant: "outlined",
-          size: "small",
-          placeholder: "Ex : Nature and Calm",
-          fullWidth: true,
-          onChange: e => updateForm({
-            mood_name: e.target.value
-          }),
-          value: mood_name
-        }), /*#__PURE__*/_jsx(Error, {
-          error: error?.mood_name
-        }), /*#__PURE__*/_jsxs(Grid, {
-          container: true,
-          justifyContent: "flex-end",
-          sx: {
-            mt: 3
-          },
-          children: [/*#__PURE__*/_jsx(Button, {
-            variant: "outlined",
-            className: "seondaryOutlineBtn",
-            color: "secondary",
-            onClick: onClose,
-            children: "Cancel"
-          }), /*#__PURE__*/_jsxs(Button, {
-            variant: "contained",
-            color: "primary",
-            className: "blueBtn",
-            sx: {
-              ml: 1
-            },
-            disabled: loading,
-            onClick: async () => {
-              const err = validate();
-              setError(err);
-              if (Object.keys(err)?.length) {
-                return;
-              }
-              await onSave({
-                ...form
-              });
-              onClose();
-            },
-            children: [loading ? /*#__PURE__*/_jsx(CircularProgress, {
-              size: 14,
-              style: {
-                marginRight: "10px"
-              }
-            }) : null, saveBtnLabel]
-          })]
-        })]
-      })
-    })]
-  });
-};
-export default styled(SaveTheme)(Style);
-function Error({
-  error = ""
-}) {
-  if (error) {
-    return /*#__PURE__*/_jsx(Typography, {
-      variant: "body1",
-      sx: {
-        color: "red",
-        mt: 1
-      },
-      children: error
-    });
-  } else {
-    return /*#__PURE__*/_jsx(_Fragment, {});
-  }
-}