@threedddplus/logoeditor 0.0.21 → 0.0.22

package/dist/logoeditor.esm.js

@@ -3142,8 +3142,12 @@ var converterSlice = function converterSlice(set, get) {
       });
       var topColors = sortedFillColors.slice(0, colorValue);
       topColors.map(function (e) {
-        var _C = get().RGBToHex(e);
-        _Fills.push(_C);
+        if (e.search("#") === -1) {
+          var _C = get().RGBToHex(e);
+          _Fills.push(_C);
+        } else {
+          _Fills.push(e);
+        }
       });
       //@ts-ignore
       set({
@@ -3282,16 +3286,30 @@ var converterSlice = function converterSlice(set, get) {
       }
       return tiffConvert;
     }(),
-    imageToSVG: function imageToSVG(data) {
+    imageToSVG: function imageToSVG(data, isSVG) {
+      if (isSVG === void 0) {
+        isSVG = false;
+      }
       use3dddPlus.setState({
         uploadImageModalDisplay: true
       });
-      ImageTracer.imageToSVG(data, function (svgstr) {
-        use3dddPlus.setState({
-          imageData: svgstr
+      if (isSVG) {
+        var reader = new FileReader();
+        reader.onload = function (e) {
+          use3dddPlus.setState({
+            imageData: e.target.result
+          });
+          processImage(e.target.result, 8);
+        };
+        reader.readAsText(data);
+      } else {
+        ImageTracer.imageToSVG(data, function (svgstr) {
+          use3dddPlus.setState({
+            imageData: svgstr
+          });
+          processImage(svgstr, 8);
         });
-        processImage(svgstr, 8);
-      });
+      }
     },
     refreshColor: function refreshColor(colorValue) {
       processImage(use3dddPlus.getState().imageData, colorValue);
@@ -4234,16 +4252,18 @@ var canvas = function canvas() {
   var canvasRef = useRef(null);
   var resizeCanvas = function resizeCanvas() {
     var canvas = use3dddPlus.getState().fabricCanvas;
-    var outerCanvasContainer = document.getElementById('fabCanvas').parentElement;
-    var containerWidth = outerCanvasContainer.clientWidth;
-    var scale = containerWidth / canvas.getWidth();
-    var zoom = canvas.getZoom() * scale;
-    canvas.setWidth(containerWidth);
-    //@ts-ignore
-    canvas.setHeight(parseInt(outerCanvasContainer.clientHeight));
-    console.log('--->', canvas.getHeight(), canvas.getHeight());
-    canvas.setViewportTransform([zoom, 0, 0, zoom, 0, 0]);
-    canvas.renderAll();
+    if (document.getElementById('fabCanvas')) {
+      var outerCanvasContainer = document.getElementById('fabCanvas').parentElement;
+      var containerWidth = outerCanvasContainer.clientWidth;
+      var scale = containerWidth / canvas.getWidth();
+      var zoom = canvas.getZoom() * scale;
+      canvas.setWidth(containerWidth);
+      //@ts-ignore
+      canvas.setHeight(parseInt(outerCanvasContainer.clientHeight));
+      console.log('--->', canvas.getHeight(), canvas.getHeight());
+      canvas.setViewportTransform([zoom, 0, 0, zoom, 0, 0]);
+      canvas.renderAll();
+    }
   };
   React.useEffect(function () {
     var canv = initCanvas();
@@ -4398,6 +4418,7 @@ var FileUploadButton = function FileUploadButton(_ref) {
     if (selectedFile) {
       onFileSelect(selectedFile);
     }
+    fileInputRef.current.value = null;
   };
   var handleDragEnter = function handleDragEnter(event) {
     event.preventDefault();
@@ -4742,17 +4763,19 @@ var PopUpCanvas = function PopUpCanvas() {
     setIsRefresh(true);
   };
   var resizeCanvas = function resizeCanvas() {
-    var canvas = use3dddPlus.getState().popupCanv;
-    var outerCanvasContainer = document.getElementById('imageCanvas').parentElement;
-    console.log(outerCanvasContainer);
-    var containerWidth = outerCanvasContainer.clientWidth;
-    var scale = containerWidth / canvas.getWidth();
-    var zoom = canvas.getZoom() * scale;
-    canvas.setWidth(containerWidth);
-    //@ts-ignore
-    canvas.setHeight(parseInt(outerCanvasContainer.clientHeight));
-    canvas.setViewportTransform([zoom, 0, 0, zoom, 0, 0]);
-    canvas.renderAll();
+    if (document.getElementById('imageCanvas')) {
+      var _canvas = use3dddPlus.getState().popupCanv;
+      var outerCanvasContainer = document.getElementById('imageCanvas').parentElement;
+      console.log(outerCanvasContainer);
+      var containerWidth = outerCanvasContainer.clientWidth;
+      var scale = containerWidth / _canvas.getWidth();
+      var zoom = _canvas.getZoom() * scale;
+      _canvas.setWidth(containerWidth);
+      //@ts-ignore
+      _canvas.setHeight(parseInt(outerCanvasContainer.clientHeight));
+      _canvas.setViewportTransform([zoom, 0, 0, zoom, 0, 0]);
+      _canvas.renderAll();
+    }
   };
   useEffect(function () {
     var popupCanv = Initpopup();
@@ -4778,11 +4801,18 @@ var PopUpCanvas = function PopUpCanvas() {
       });
     });
   }, []);
-  // const popupCanvasCancel = () => {
-  //   use3dddPlus.setState({ uploadImageModalDisplay: false });
-  //   console.log(popupCanvas.getObjects()[0]);
-  //   popupCanvas.remove(...popupCanvas.getObjects());
-  // };
+  var popupCanvasCancel = function popupCanvasCancel() {
+    use3dddPlus.setState({
+      uploadImageModalDisplay: false
+    });
+    popupCanvas.remove.apply(popupCanvas, popupCanvas.getObjects());
+    use3dddPlus.setState({
+      colorFill: {}
+    });
+    use3dddPlus.setState({
+      popupCanvasStoreHistory: []
+    });
+  };
   var popupCanvasContinue = function popupCanvasContinue() {
     //@ts-ignore
     use3dddPlus.setState({
@@ -5062,12 +5092,19 @@ var PopUpCanvas = function PopUpCanvas() {
       size: "1rem"
     })));
   })), React.createElement("div", {
-    className: " flex flex-col"
+    className: " flex flex-col content"
   }, React.createElement("button", {
     type: "button",
     onClick: popupCanvasContinue,
     className: "mt-3 inline-flex w-full justify-center  bg-white px-[110px] py-2 text-sm font-medium text-[#E11A38] shadow-sm ring-1 ring-inset ring-[#E11A38] hover:bg-gray-50 sm:mt-0 sm:w-auto"
-  }, "Continue"))))))))));
+  }, "Continue"), React.createElement("button", {
+    type: "button",
+    onClick: popupCanvasCancel,
+    className: "mt-3 inline-flex w-full justify-center  bg-white  px-[110px] py-2 text-sm font-medium text-[#E11A38] shadow-sm ring-1 ring-inset ring-[#E11A38] hover:bg-gray-50 sm:mt-0 sm:w-auto",
+    style: {
+      marginTop: '10px'
+    }
+  }, "Cancel"))))))))));
 };
 
 var UploadLogo = function UploadLogo() {
@@ -5095,38 +5132,44 @@ var UploadLogo = function UploadLogo() {
         while (1) switch (_context.prev = _context.next) {
           case 0:
             // canvas.discardActiveObject();
-            ext = data.name.substring(data.name.lastIndexOf('.') + 1); // if (ext === 'svg') {
-            //   imageToSVG(data);
-            // } else 
+            ext = data.name.substring(data.name.lastIndexOf('.') + 1);
+            if (!(ext === 'svg')) {
+              _context.next = 5;
+              break;
+            }
+            imageToSVG(data, true);
+            _context.next = 21;
+            break;
+          case 5:
             if (!(ext === 'pdf')) {
-              _context.next = 8;
+              _context.next = 12;
               break;
             }
-            _context.next = 4;
+            _context.next = 8;
             return pdfConverter(data);
-          case 4:
+          case 8:
             pdfData = _context.sent;
             imageToSVG(pdfData);
-            _context.next = 17;
+            _context.next = 21;
             break;
-          case 8:
+          case 12:
             if (!(ext === 'tif' || ext === 'tiff')) {
-              _context.next = 15;
+              _context.next = 19;
               break;
             }
-            _context.next = 11;
+            _context.next = 15;
             return tiffConvert(data);
-          case 11:
+          case 15:
             tiffData = _context.sent;
             imageToSVG(tiffData);
-            _context.next = 17;
+            _context.next = 21;
             break;
-          case 15:
+          case 19:
             objectURL = URL.createObjectURL(data);
             imageToSVG(objectURL);
-          case 17:
+          case 21:
             setSelectedFile(null);
-          case 18:
+          case 22:
           case "end":
             return _context.stop();
         }