@threedddplus/logoeditor 0.0.8 → 0.0.9

package/dist/logoeditor.esm.js

@@ -6,7 +6,6 @@ import CryptoJS from 'crypto-js';
 import { fabric } from 'fabric';
 import AWS from 'aws-sdk';
 import ImageTracer from 'imagetracerjs';
-import { createRoot } from 'react-dom/client';
 import { Button as Button$1, useTooltipState, TooltipReference, Tooltip, Input } from 'reakit';
 import { IconContext } from 'react-icons';
 import { IoMdCheckmarkCircle } from 'react-icons/io';
@@ -4956,7 +4955,8 @@ var Loader = function Loader(_ref) {
   }));
 };
 
-var MyLogo$1 = function MyLogo() {
+var MyLogo$1 = function MyLogo(_ref) {
+  var onApply = _ref.onApply;
   var _React$useState = React.useState(),
     logoSelected = _React$useState[0],
     setLogoSelected = _React$useState[1];
@@ -4981,7 +4981,12 @@ var MyLogo$1 = function MyLogo() {
   };
 
   var handleApplyLogo = function handleApplyLogo(logo) {
+    if (logo) {
+      onApply();
+      // setLogoSelected(logo);
+    }
   };
+
   return React.createElement(React.Fragment, null, React.createElement("div", {
     className: "bg-[#F7F7F7] absolute z-100 w-[90%] h-full pr-[56px]"
   }, React.createElement("div", {
@@ -5042,7 +5047,7 @@ var MyLogo$1 = function MyLogo() {
     }
   }, "Edit"), React.createElement("button", {
     onClick: function onClick() {
-      return handleApplyLogo();
+      return handleApplyLogo(logoData);
     },
     className: "border p-3 w-[160px] " + (logoSelected ? 'border-[#e11a38] text-[#e11a38]' : 'bg-[black] text-white font-bold')
   }, "Apply"))), loading && React.createElement(Loader, null));
@@ -6344,7 +6349,8 @@ var ColorPicker = function ColorPicker() {
   })));
 };
 
-var MiddleMenu = function MiddleMenu() {
+var MiddleMenu = function MiddleMenu(_ref) {
+  var onApply = _ref.onApply;
   var _use3dddPlus = use3dddPlus(function (state) {
       return [state.selectedStepper, state.toggleSaveDesign, state.loadingLogo];
     }, shallow),
@@ -6360,7 +6366,9 @@ var MiddleMenu = function MiddleMenu() {
     className: "flex w-[70%]  h-[100%]"
   }, React.createElement(canvas, null)), toggleSaveDesign.status && React.createElement(SaveDesign, null), React.createElement("div", {
     className: "flex-1 z-10  h-[100%] "
-  }, React.createElement(Rightmenu, null))), selectedStepper === 1 && React.createElement(UploadLogo, null), selectedStepper === 4 && React.createElement(AddMascot, null), selectedStepper === 2 && React.createElement(MyLogo$1, null), selectedStepper === 5 && React.createElement(ColorPicker, null));
+  }, React.createElement(Rightmenu, null))), selectedStepper === 1 && React.createElement(UploadLogo, null), selectedStepper === 4 && React.createElement(AddMascot, null), selectedStepper === 2 && React.createElement(MyLogo$1, {
+    onApply: onApply
+  }), selectedStepper === 5 && React.createElement(ColorPicker, null));
 };
 
 // import { Modal } from './components';
@@ -6371,14 +6379,34 @@ var MiddleMenu = function MiddleMenu() {
  * A custom App component. Neat!
  */
 var LogoEditor = function LogoEditor(_ref) {
-  var stepperId = _ref.stepperId;
+  var stepperId = _ref.stepperId,
+    onApply = _ref.onApply,
+    customLogoColorList = _ref.customLogoColorList,
+    defaultColorList = _ref.defaultColorList,
+    logoData = _ref.logoData;
   var _use3dddPlus = use3dddPlus(function (state) {
-      return [state.setSelectedStepper];
+      return [state.setSelectedStepper, state.myLogoHandler];
     }),
-    setSelectedStepper = _use3dddPlus[0];
+    setSelectedStepper = _use3dddPlus[0],
+    myLogoHandler = _use3dddPlus[1];
   React.useEffect(function () {
     setSelectedStepper(stepperId);
+    if (stepperId == undefined) {
+      myLogoHandler(logoData);
+      console.log('logoData', logoData);
+    }
   }, [stepperId]);
+  React.useEffect(function () {
+    use3dddPlus.setState({
+      customUploadLogoColorList: customLogoColorList
+    });
+  }, [customLogoColorList]);
+  React.useEffect(function () {
+    use3dddPlus.setState({
+      defaultColorList: defaultColorList
+    });
+  }, [defaultColorList]);
+  console.log('defaultColorList', defaultColorList);
   return (
     // <Modal
     //   backdropStyle={`z-[7]`}
@@ -6392,16 +6420,12 @@ var LogoEditor = function LogoEditor(_ref) {
       className: "lg:w-[10%]"
     }, React.createElement(LeftMenu, null)), React.createElement("div", {
       className: " flex h-full w-[90%]"
-    }, React.createElement(MiddleMenu, null)))
+    }, React.createElement(MiddleMenu, {
+      onApply: onApply
+    })))
     // </Modal>
   );
 };
 
-var container = /*#__PURE__*/document.getElementById('root');
-var root = /*#__PURE__*/createRoot(container); // createRoot(container!) if you use TypeScript
-root.render(React.createElement(LogoEditor, {
-  stepperId: 1
-}));
-
 export { index$1 as Components, LogoEditor, index as services, use3dddPlus };
 //# sourceMappingURL=logoeditor.esm.js.map