@threedddplus/logoeditor 0.0.112-5 → 0.0.113

package/dist/LogoEditor.d.ts

@@ -1,7 +1,7 @@
-import React from "react";
+import React from 'react';
 import 'react-toastify/dist/ReactToastify.css';
 import './index.css';
-declare const LogoEditor: ({ stepperId, onApply, customLogoColorList, defaultColorList, logoData, customerId, onSaveLogo }: {
+declare const LogoEditor: ({ stepperId, onApply, customLogoColorList, defaultColorList, logoData, customerId, onSaveLogo, onClose, }: {
     stepperId: any;
     onApply: any;
     customLogoColorList: any;
@@ -9,5 +9,6 @@ declare const LogoEditor: ({ stepperId, onApply, customLogoColorList, defaultCol
     logoData: any;
     customerId: any;
     onSaveLogo: any;
+    onClose: any;
 }) => React.JSX.Element;
 export default LogoEditor;

package/dist/logoeditor.cjs.development.js

@@ -14798,41 +14798,31 @@ var LogoEditor = function LogoEditor(_ref) {
     defaultColorList = _ref.defaultColorList,
     logoData = _ref.logoData,
     customerId = _ref.customerId,
-    onSaveLogo = _ref.onSaveLogo;
+    onSaveLogo = _ref.onSaveLogo,
+    onClose = _ref.onClose;
   var _use3dddPlus = use3dddPlus(function (state) {
       return [state.setSelectedStepper, state.loading, state.myLogoHandler];
     }),
     setSelectedStepper = _use3dddPlus[0],
     loading = _use3dddPlus[1],
     myLogoHandler = _use3dddPlus[2];
-  React__default.useEffect(function () {
-    setSelectedStepper(stepperId);
-  }, [stepperId]);
-  var _React$useState = React__default.useState([]),
-    fontFamilies = _React$useState[0],
-    setFontFamilies = _React$useState[1];
-  React__default.useEffect(function () {
+  var _useState = React.useState([]),
+    fontFamilies = _useState[0],
+    setFontFamilies = _useState[1];
+  React.useEffect(function () {
     setSelectedStepper(stepperId);
-    if (stepperId == undefined) {
+    if (stepperId === undefined) {
       myLogoHandler(logoData);
     }
-  }, [stepperId]);
-  React__default.useEffect(function () {
     use3dddPlus.setState({
       customUploadLogoColorList: customLogoColorList
     });
-  }, [customLogoColorList]);
-  React__default.useEffect(function () {
     use3dddPlus.setState({
       defaultColorList: defaultColorList
     });
-  }, [defaultColorList]);
-  React__default.useEffect(function () {
     use3dddPlus.setState({
       customerId: customerId
     });
-  }, [customerId]);
-  React__default.useEffect(function () {
     fetch('https://storage.googleapis.com/3ddplusgcp/richardson-customizer/fonts/fontFamilies.json').then(function (response) {
       return response.json();
     }).then(function (data) {
@@ -14840,12 +14830,13 @@ var LogoEditor = function LogoEditor(_ref) {
     })["catch"](function (error) {
       return console.error('Error fetching font families:', error);
     });
-  }, []);
+  }, [stepperId, customLogoColorList, defaultColorList, customerId, logoData, myLogoHandler, setSelectedStepper]);
   return React__default.createElement(Modal, {
     backdropStyle: "z-[7]",
-    contentStyle: 'top-0 bottom-0 !m-[auto] z-[7] w-[80%] p-0'
+    contentStyle: "top-0 bottom-0 !m-[auto] z-[7] w-[80%] p-0",
+    crossOnClick: onClose
   }, React__default.createElement("div", {
-    className: " flex flex-col md:flex-row w-full h-[88vh]"
+    className: "flex flex-col md:flex-row w-full h-[88vh]"
   }, React__default.createElement(reactToastify.ToastContainer, {
     position: "top-center",
     autoClose: 3000,
@@ -14858,14 +14849,15 @@ var LogoEditor = function LogoEditor(_ref) {
     pauseOnHover: true,
     theme: "colored",
     transition: reactToastify.Bounce
-  }), fontFamilies.map(function (font) {
+  }), fontFamilies.map(function (font, index) {
     return React__default.createElement(FontLoader, {
+      key: index,
       fontPath: font
     });
   }), loading && React__default.createElement(Loader, null), React__default.createElement("div", {
     className: "w-[10%] h-[100%]"
   }, React__default.createElement(LeftMenu, null)), React__default.createElement("div", {
-    className: "flex h-full w-[90%]"
+    className: "flex h-full w-[90%] flex-1"
   }, React__default.createElement(MiddleMenu, {
     onApply: onApply,
     onSaveLogo: onSaveLogo