react-design-editor 0.0.43 → 0.0.44

package/dist/react-design-editor.min.js.LICENSE.txt

@@ -1,9 +1,3 @@
-/*
-object-assign
-(c) Sindre Sorhus
-@license MIT
-*/
-
 /*!
  * MediaElement.js
  * http://www.mediaelementjs.com/
@@ -35,21 +29,3 @@ object-assign
  * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
  * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
  */
-
-/** @license React v0.19.1
- * scheduler.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/** @license React v16.14.0
- * react-dom.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */

package/lib/handlers/AnimationHandler.js

@@ -207,9 +207,15 @@ class AnimationHandler {
                         // I don't know why it works. Magic code...
                         const fill = instance.animations[0].currentValue;
                         const stroke = instance.animations[1].currentValue;
-                        obj.set('fill', '');
-                        obj.set('fill', fill);
-                        obj.set('stroke', stroke);
+                        if (obj.type === 'svg') {
+                            obj.setFill(fill);
+                            obj.setStroke(stroke);
+                        }
+                        else {
+                            obj.set('fill', '');
+                            obj.set('fill', fill);
+                            obj.set('stroke', stroke);
+                        }
                     }
                     else if (type === 'rotation') {
                         let angle = instance.animations[0].currentValue;

package/lib/objects/Svg.d.ts

@@ -1,5 +1,9 @@
 import { FabricGroup, FabricObject, FabricObjectOption } from '../utils';
-export declare type SvgObject = FabricGroup | FabricObject;
+export declare type SvgObject = (FabricGroup | FabricObject) & {
+    loadSvg(option: SvgOption): Promise<SvgObject>;
+    setFill(value: string): SvgObject;
+    setStroke(value: string): SvgObject;
+};
 export interface SvgOption extends FabricObjectOption {
     svg?: string;
     loadType?: 'file' | 'svg';

package/lib/objects/Svg.js

@@ -37,12 +37,20 @@ const Svg = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
                     stroke: options.stroke,
                 });
             }
+            if (this._objects?.length) {
+                this._objects.forEach(obj => this.remove(obj));
+            }
             this.add(createdObj);
         }
+        this.set({
+            fill: options.fill || 'rgba(0, 0, 0, 1)',
+            stroke: options.stroke || 'rgba(255, 255, 255, 0)',
+        });
         this.setCoords();
         if (this.canvas) {
             this.canvas.requestRenderAll();
         }
+        return this;
     },
     loadSvg(option) {
         const { svg, loadType, fill, stroke } = option;
@@ -61,9 +69,11 @@ const Svg = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
     },
     setFill(value) {
         this.getObjects().forEach((obj) => obj.set('fill', value));
+        return this;
     },
     setStroke(value) {
         this.getObjects().forEach((obj) => obj.set('stroke', value));
+        return this;
     },
     toObject(propertiesToInclude) {
         return utils_1.toObject(this, propertiesToInclude, {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "react-design-editor",
-	"version": "0.0.43",
+	"version": "0.0.44",
 	"description": "Design Editor Tools with React.js + ant.design + fabric.js",
 	"main": "dist/react-design-editor.min.js",
 	"typings": "lib/index.d.ts",