title: React-diagrams custom node widget not updating on engine.repaintCanvas()
body: <p>I have copied the react-diagrams demo project and done some changes to the TSCustomNodeWidget.tsx, and when I call engine.repaintCanvas() it does not update the values I have set (whereas the name of the DefaultNodeModel does).</p>
  
  <p>TSCustomNodeModel.ts</p>
  
  <pre><code>import { NodeModel, DefaultPortModel, DefaultNodeModel } from '@projectstorm/react-diagrams';
  import { BaseModelOptions } from '@projectstorm/react-canvas-core';
  
  export interface TSCustomNodeModelOptions extends BaseModelOptions {
      color?: string;
      value?: number;
      name?: string;
  }
  
  export class TSCustomNodeModel extends DefaultNodeModel {
      color: string;
      name: string;
      value: number;
  
      constructor(options: TSCustomNodeModelOptions = {}) {
          super({
              ...options,
              type: 'ts-custom-node'
          });
          this.color = options.color || 'red';
          this.value = options.value || 0;
          this.name = options.name || 'name';
  
          // setup an in and out port
          this.addPort(
              new DefaultPortModel({
                  in: true,
                  name: 'IN'
              })
          );
          this.addPort(
              new DefaultPortModel({
                  in: false,
                  name: 'OUT'
              })
          );
      }
  
      serialize() {
          return {
              ...super.serialize(),
              color: this.color
          };
      }
  
      deserialize(event:any): void {
          super.deserialize(event);
          this.color = event.data.color;
      }
  }
  </code></pre>
  
  <p>TSCustomNodeFactory.tsx</p>
  
  <pre><code>import * as React from 'react';
  import { TSCustomNodeModel } from './TSCustomNodeModel';
  import { TSCustomNodeWidget } from './TSCustomNodeWidget';
  import { AbstractReactFactory } from '@projectstorm/react-canvas-core';
  import { DiagramEngine } from '@projectstorm/react-diagrams-core';
  
  export class TSCustomNodeFactory extends AbstractReactFactory&lt;TSCustomNodeModel, DiagramEngine&gt; {
      constructor() {
          super('ts-custom-node');
      }
  
      generateModel(initialConfig:any) {
          return new TSCustomNodeModel();
      }
  
      generateReactWidget(event:any): JSX.Element {
          return &lt;TSCustomNodeWidget engine={this.engine as DiagramEngine} node={event.model} /&gt;;
      }
  }
  </code></pre>
  
  <p>TSCustomNodeWidget.tsx</p>
  
  <pre><code>import * as React from 'react';
  import { DiagramEngine, PortWidget } from '@projectstorm/react-diagrams-core';
  import { TSCustomNodeModel } from './TSCustomNodeModel';
  
  
  
  export interface TSCustomNodeWidgetProps {
      node: TSCustomNodeModel;
      engine: DiagramEngine;
  }
  
  export interface TSCustomNodeWidgetState {}
  
  export class TSCustomNodeWidget extends React.Component&lt;TSCustomNodeWidgetProps, TSCustomNodeWidgetState&gt; {
      constructor(props: TSCustomNodeWidgetProps) {
          super(props);
          this.state = {};
      }
  
      render() {
          return (
              &lt;div className="custom-node"&gt;
                  &lt;PortWidget engine={this.props.engine} port={this.props.node.getPort('IN')}&gt;
                      &lt;div className="circle-port" /&gt;
                  &lt;/PortWidget&gt;
                  &lt;PortWidget engine={this.props.engine} port={this.props.node.getPort('OUT')}&gt;
                      &lt;div className="circle-port" /&gt;
                  &lt;/PortWidget&gt;
                  &lt;div className="custom-node-color" 
                      style={{ backgroundColor: this.props.node.color }}&gt;
                      {this.props.node.value}
                  &lt;/div&gt;
              &lt;/div&gt;
          );
      }
  }
  </code></pre>
  
  <p>App.tsx
  Setup</p>
  
  <pre><code>    // create an instance of the engine with all the defaults
      const engine = createEngine();
  
      const state = engine.getStateMachine().getCurrentState();
      if (state instanceof DefaultDiagramState) {
          state.dragNewLink.config.allowLooseLinks = false;
      }
  
      const model = new DiagramModel();
      engine.getNodeFactories().registerFactory(new TSCustomNodeFactory());
  
      model.setGridSize(5);
      engine.setModel(model);
  </code></pre>
  
  <p>Adding the node with button (repaintCanvas works)</p>
  
  <pre><code>    function addConstNode() {
          const node = new TSCustomNodeModel({
              name: "CONST",
              value: 0
          });
          node.setPosition(50, 50);
  
          model.addAll(node);
          engine.repaintCanvas();   //This works
  
          return node;
      }
  </code></pre>
  
  <p>Updating the node (repaintCanvas does not work)</p>
  
  <pre><code>currentNode.value = value;
  ...
  engine.repaintCanvas();
  
  </code></pre>