@projectstorm/react-diagrams-core - npm Package Compare versions

Comparing version 6.0.1-beta.4 to 6.0.1-beta.5

dist/@types/src/entities/link/LinkModel.d.ts

@@ -74,3 +74,3 @@ import { PortModel } from '../port/PortModel';
     setTargetPort(port: PortModel): void;
-    point(x: number, y: number): PointModel;
+    point(x: number, y: number, index?: number): PointModel;
     addLabel(label: LabelModel): void;
@@ -77,0 +77,0 @@ getPoints(): PointModel[];

dist/index.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports["projectstorm/react-canvas-core"]=t():e["projectstorm/react-canvas-core"]=t()}(window,function(){return function(e){var t={};function i(r){if(t[r])return t[r].exports;var s=t[r]={i:r,l:!1,exports:{}};return e[r].call(s.exports,s,s.exports,i),s.l=!0,s.exports}return i.m=e,i.c=t,i.d=function(e,t,r){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var s in e)i.d(r,s,function(t){return e[t]}.bind(null,s));return r},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=17)}([function(e,t){e.exports=require("@projectstorm/react-canvas-core")},function(e,t){e.exports=require("lodash")},function(e,t){e.exports=require("react")},function(e,t){e.exports=require("@projectstorm/geometry")},function(e,t){e.exports=require("@emotion/styled")},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(1),s=i(3),o=i(0);!function(e){e.TOP="top",e.LEFT="left",e.BOTTOM="bottom",e.RIGHT="right"}(t.PortModelAlignment||(t.PortModelAlignment={}));t.PortModel=class extends o.BasePositionModel{constructor(e){super(e),this.links={},this.reportedPosition=!1}deserialize(e){super.deserialize(e),this.reportedPosition=!1,this.options.name=e.data.name,this.options.alignment=e.data.alignment}serialize(){return Object.assign({},super.serialize(),{name:this.options.name,alignment:this.options.alignment,parentNode:this.parent.getID(),links:r.map(this.links,e=>e.getID())})}setPosition(e,t){let i=this.position;super.setPosition(e,t),r.forEach(this.getLinks(),r=>{let s=r.getPointForPort(this);s.setPosition(s.getX()+e-i.x,s.getY()+t-i.y)})}doClone(e={},t){t.links={},t.parentNode=this.getParent().clone(e)}getNode(){return this.getParent()}getName(){return this.options.name}getMaximumLinks(){return this.options.maximumLinks}setMaximumLinks(e){this.options.maximumLinks=e}removeLink(e){delete this.links[e.getID()]}addLink(e){this.links[e.getID()]=e}getLinks(){return this.links}createLinkModel(){if(r.isFinite(this.options.maximumLinks)){var e=r.size(this.links);if(1===this.options.maximumLinks&&e>=1)return r.values(this.links)[0];if(e>=this.options.maximumLinks)return null}return null}reportPosition(){r.forEach(this.getLinks(),e=>{e.getPointForPort(this).setPosition(this.getCenter())}),this.fireEvent({entity:this},"reportInitialPosition")}getCenter(){return new s.Point(this.getX()+this.width/2,this.getY()+this.height/2)}updateCoords(e){this.width=e.getWidth(),this.height=e.getHeight(),this.setPosition(e.getTopLeft()),this.reportedPosition=!0,this.reportPosition()}canLinkToPort(e){return!0}isLocked(){return super.isLocked()||this.getParent().isLocked()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(7),s=i(1),o=i(3),n=i(0);t.LinkModel=class extends n.BaseModel{constructor(e){super(e),this.points=[new r.PointModel({link:this}),new r.PointModel({link:this})],this.sourcePort=null,this.targetPort=null,this.renderedPaths=[],this.labels=[]}getBoundingBox(){return o.Polygon.boundingBoxFromPoints(s.map(this.points,e=>e.getPosition()))}getSelectionEntities(){return this.getTargetPort()&&this.getSourcePort()?super.getSelectionEntities().concat(s.slice(this.points,1,this.points.length-1)):this.getSourcePort()?this.getTargetPort()?super.getSelectionEntities().concat(this.points):super.getSelectionEntities().concat(s.slice(this.points,1,this.points.length)):super.getSelectionEntities().concat(s.slice(this.points,0,this.points.length-1))}deserialize(e){super.deserialize(e),this.points=s.map(e.data.points||[],t=>{var i=new r.PointModel({link:this,position:new o.Point(t.x,t.y)});return i.deserialize(Object.assign({},e,{data:t})),i}),s.forEach(e.data.labels||[],t=>{let i=e.engine.getFactoryForLabel(t.type).generateModel({});i.deserialize(Object.assign({},e,{data:t})),this.addLabel(i)}),e.data.target&&e.getModel(e.data.targetPort).then(e=>{this.setTargetPort(e)}),e.data.source&&e.getModel(e.data.sourcePort).then(e=>{this.setSourcePort(e)})}getRenderedPath(){return this.renderedPaths}setRenderedPaths(e){this.renderedPaths=e}serialize(){return Object.assign({},super.serialize(),{source:this.sourcePort?this.sourcePort.getParent().getID():null,sourcePort:this.sourcePort?this.sourcePort.getID():null,target:this.targetPort?this.targetPort.getParent().getID():null,targetPort:this.targetPort?this.targetPort.getID():null,points:s.map(this.points,e=>e.serialize()),labels:s.map(this.labels,e=>e.serialize())})}doClone(e={},t){t.setPoints(s.map(this.getPoints(),t=>t.clone(e))),this.sourcePort&&t.setSourcePort(this.sourcePort.clone(e)),this.targetPort&&t.setTargetPort(this.targetPort.clone(e))}clearPort(e){this.sourcePort===e?this.setSourcePort(null):this.targetPort===e&&this.setTargetPort(null)}remove(){this.sourcePort&&this.sourcePort.removeLink(this),this.targetPort&&this.targetPort.removeLink(this),super.remove()}isLastPoint(e){return this.getPointIndex(e)===this.points.length-1}getPointIndex(e){return this.points.indexOf(e)}getPointModel(e){for(var t=0;t<this.points.length;t++)if(this.points[t].getID()===e)return this.points[t];return null}getPortForPoint(e){return null!==this.sourcePort&&this.getFirstPoint().getID()===e.getID()?this.sourcePort:null!==this.targetPort&&this.getLastPoint().getID()===e.getID()?this.targetPort:null}getPointForPort(e){return null!==this.sourcePort&&this.sourcePort.getID()===e.getID()?this.getFirstPoint():null!==this.targetPort&&this.targetPort.getID()===e.getID()?this.getLastPoint():null}getFirstPoint(){return this.points[0]}getLastPoint(){return this.points[this.points.length-1]}setSourcePort(e){null!==e&&e.addLink(this),null!==this.sourcePort&&this.sourcePort.removeLink(this),this.sourcePort=e,this.fireEvent({port:e},"sourcePortChanged")}getSourcePort(){return this.sourcePort}getTargetPort(){return this.targetPort}setTargetPort(e){null!==e&&e.addLink(this),null!==this.targetPort&&this.targetPort.removeLink(this),this.targetPort=e,this.fireEvent({port:e},"targetPortChanged")}point(e,t){return this.addPoint(this.generatePoint(e,t))}addLabel(e){e.setParent(this),this.labels.push(e)}getPoints(){return this.points}getLabels(){return this.labels}setPoints(e){s.forEach(e,e=>{e.setParent(this)}),this.points=e}removePoint(e){this.points.splice(this.getPointIndex(e),1)}removePointsBefore(e){this.points.splice(0,this.getPointIndex(e))}removePointsAfter(e){this.points.splice(this.getPointIndex(e)+1)}removeMiddlePoints(){this.points.length>2&&this.points.splice(0,this.points.length-2)}addPoint(e,t=1){return e.setParent(this),this.points.splice(t,0,e),e}generatePoint(e=0,t=0){return new r.PointModel({link:this,position:new o.Point(e,t)})}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0);t.PointModel=class extends r.BasePositionModel{constructor(e){super(Object.assign({},e,{type:"point"})),this.parent=e.link}isConnectedToPort(){return null!==this.parent.getPortForPoint(this)}getLink(){return this.getParent()}remove(){this.parent&&this.parent.removePoint(this),super.remove()}isLocked(){return super.isLocked()||this.getParent().isLocked()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(1),s=i(3),o=i(0);t.NodeModel=class extends o.BasePositionModel{constructor(e){super(e),this.ports={},this.width=0,this.height=0}getBoundingBox(){return new s.Rectangle(this.getPosition(),this.width,this.height)}setPosition(e,t){let i=this.position;super.setPosition(e,t),r.forEach(this.ports,r=>{r.setPosition(r.getX()+e-i.x,r.getY()+t-i.y)})}deserialize(e){super.deserialize(e),r.forEach(e.data.ports,t=>{let i=e.engine.getFactoryForPort(t.type).generateModel({});i.deserialize(Object.assign({},e,{data:t})),e.registerModel(i),this.addPort(i)})}serialize(){return Object.assign({},super.serialize(),{ports:r.map(this.ports,e=>e.serialize())})}doClone(e={},t){t.ports={},r.forEach(this.ports,i=>{t.addPort(i.clone(e))})}remove(){super.remove(),r.forEach(this.ports,e=>{r.forEach(e.getLinks(),e=>{e.remove()})})}getPortFromID(e){for(var t in this.ports)if(this.ports[t].getID()===e)return this.ports[t];return null}getLink(e){for(let t in this.ports){const i=this.ports[t].getLinks();if(i[e])return i[e]}}getPort(e){return this.ports[e]}getPorts(){return this.ports}removePort(e){for(let t of r.values(e.getLinks()))t.clearPort(e);this.ports[e.getName()]&&(this.ports[e.getName()].setParent(null),delete this.ports[e.getName()])}addPort(e){return e.setParent(this),this.ports[e.getName()]=e,e}updateDimensions({width:e,height:t}){this.width=e,this.height=t}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(8);t.NodeLayerModel=class extends r.LayerModel{constructor(){super({type:"diagram-nodes",isSvg:!1,transformed:!0})}addModel(e){if(!(e instanceof s.NodeModel))throw new Error("Can only add nodes to this layer");super.addModel(e)}getChildModelFactoryBank(e){return e.getNodeFactories()}getNodes(){return this.getModels()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(6);t.LinkLayerModel=class extends r.LayerModel{constructor(){super({type:"diagram-links",isSvg:!0,transformed:!0})}addModel(e){if(!(e instanceof s.LinkModel))throw new Error("Can only add links to this layer");super.addModel(e)}getLinks(){return this.getModels()}getChildModelFactoryBank(e){return e.getLinkFactories()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(1),o=i(20),n=i(0);t.LinkWidget=class extends r.Component{constructor(e){super(e),this.state={sourcePort:null,targetPort:null}}componentWillUnmount(){this.sourceListener&&this.sourceListener.deregister(),this.targetListener&&this.targetListener.deregister()}static getDerivedStateFromProps(e,t){return{sourcePort:e.link.getSourcePort(),targetPort:e.link.getTargetPort()}}installTarget(){this.targetListener&&this.targetListener.deregister(),this.targetListener=this.props.link.getTargetPort().registerListener({reportInitialPosition:e=>{this.forceUpdate()}})}installSource(){this.sourceListener&&this.sourceListener.deregister(),this.sourceListener=this.props.link.getSourcePort().registerListener({reportInitialPosition:e=>{this.forceUpdate()}})}componentDidUpdate(e,t,i){t.sourcePort!==this.state.sourcePort&&this.installSource(),t.targetPort!==this.state.targetPort&&this.installTarget()}static generateLinePath(e,t){return`M${e.getX()},${e.getY()} L ${t.getX()},${t.getY()}`}componentDidMount(){this.props.link.getSourcePort()&&this.installSource(),this.props.link.getTargetPort()&&this.installTarget()}render(){const{link:e}=this.props;return e.getSourcePort()&&!e.getSourcePort().reportedPosition?null:e.getTargetPort()&&!e.getTargetPort().reportedPosition?null:r.createElement(n.PeformanceWidget,{model:this.props.link,serialized:this.props.link.serialize()},()=>r.createElement("g",{"data-linkid":this.props.link.getID()},this.props.diagramEngine.generateWidgetForLink(e),s.map(this.props.link.getLabels(),(e,t)=>r.createElement(o.LabelWidget,{key:e.getID(),engine:this.props.diagramEngine,label:e,index:t}))))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(4),o=i(1),n=i(11);var a;!function(e){e.Container=s.default.div``}(a||(a={}));t.LinkLayerWidget=class extends r.Component{render(){return r.createElement(r.Fragment,null,o.map(this.props.layer.getLinks(),e=>r.createElement(n.LinkWidget,{key:e.getID(),link:e,diagramEngine:this.props.engine})))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(4),o=i(1),n=i(14);var a;!function(e){e.Container=s.default.div``}(a||(a={}));t.NodeLayerWidget=class extends r.Component{render(){return r.createElement(r.Fragment,null,o.map(this.props.layer.getNodes(),e=>r.createElement(n.NodeWidget,{key:e.getID(),diagramEngine:this.props.engine,node:e})))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(1),o=i(0),n=i(4);var a;!function(e){e.Node=n.default.div`
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports["projectstorm/react-canvas-core"]=t():e["projectstorm/react-canvas-core"]=t()}(window,function(){return function(e){var t={};function i(r){if(t[r])return t[r].exports;var s=t[r]={i:r,l:!1,exports:{}};return e[r].call(s.exports,s,s.exports,i),s.l=!0,s.exports}return i.m=e,i.c=t,i.d=function(e,t,r){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var s in e)i.d(r,s,function(t){return e[t]}.bind(null,s));return r},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=17)}([function(e,t){e.exports=require("@projectstorm/react-canvas-core")},function(e,t){e.exports=require("lodash")},function(e,t){e.exports=require("react")},function(e,t){e.exports=require("@projectstorm/geometry")},function(e,t){e.exports=require("@emotion/styled")},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(1),s=i(3),o=i(0);!function(e){e.TOP="top",e.LEFT="left",e.BOTTOM="bottom",e.RIGHT="right"}(t.PortModelAlignment||(t.PortModelAlignment={}));t.PortModel=class extends o.BasePositionModel{constructor(e){super(e),this.links={},this.reportedPosition=!1}deserialize(e){super.deserialize(e),this.reportedPosition=!1,this.options.name=e.data.name,this.options.alignment=e.data.alignment}serialize(){return Object.assign({},super.serialize(),{name:this.options.name,alignment:this.options.alignment,parentNode:this.parent.getID(),links:r.map(this.links,e=>e.getID())})}setPosition(e,t){let i=this.position;super.setPosition(e,t),r.forEach(this.getLinks(),r=>{let s=r.getPointForPort(this);s.setPosition(s.getX()+e-i.x,s.getY()+t-i.y)})}doClone(e={},t){t.links={},t.parentNode=this.getParent().clone(e)}getNode(){return this.getParent()}getName(){return this.options.name}getMaximumLinks(){return this.options.maximumLinks}setMaximumLinks(e){this.options.maximumLinks=e}removeLink(e){delete this.links[e.getID()]}addLink(e){this.links[e.getID()]=e}getLinks(){return this.links}createLinkModel(){if(r.isFinite(this.options.maximumLinks)){var e=r.size(this.links);if(1===this.options.maximumLinks&&e>=1)return r.values(this.links)[0];if(e>=this.options.maximumLinks)return null}return null}reportPosition(){r.forEach(this.getLinks(),e=>{e.getPointForPort(this).setPosition(this.getCenter())}),this.fireEvent({entity:this},"reportInitialPosition")}getCenter(){return new s.Point(this.getX()+this.width/2,this.getY()+this.height/2)}updateCoords(e){this.width=e.getWidth(),this.height=e.getHeight(),this.setPosition(e.getTopLeft()),this.reportedPosition=!0,this.reportPosition()}canLinkToPort(e){return!0}isLocked(){return super.isLocked()||this.getParent().isLocked()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(7),s=i(1),o=i(3),n=i(0);t.LinkModel=class extends n.BaseModel{constructor(e){super(e),this.points=[new r.PointModel({link:this}),new r.PointModel({link:this})],this.sourcePort=null,this.targetPort=null,this.renderedPaths=[],this.labels=[]}getBoundingBox(){return o.Polygon.boundingBoxFromPoints(s.map(this.points,e=>e.getPosition()))}getSelectionEntities(){return this.getTargetPort()&&this.getSourcePort()?super.getSelectionEntities().concat(s.slice(this.points,1,this.points.length-1)):this.getSourcePort()?this.getTargetPort()?super.getSelectionEntities().concat(this.points):super.getSelectionEntities().concat(s.slice(this.points,1,this.points.length)):super.getSelectionEntities().concat(s.slice(this.points,0,this.points.length-1))}deserialize(e){super.deserialize(e),this.points=s.map(e.data.points||[],t=>{var i=new r.PointModel({link:this,position:new o.Point(t.x,t.y)});return i.deserialize(Object.assign({},e,{data:t})),i}),s.forEach(e.data.labels||[],t=>{let i=e.engine.getFactoryForLabel(t.type).generateModel({});i.deserialize(Object.assign({},e,{data:t})),this.addLabel(i)}),e.data.target&&e.getModel(e.data.targetPort).then(e=>{this.setTargetPort(e)}),e.data.source&&e.getModel(e.data.sourcePort).then(e=>{this.setSourcePort(e)})}getRenderedPath(){return this.renderedPaths}setRenderedPaths(e){this.renderedPaths=e}serialize(){return Object.assign({},super.serialize(),{source:this.sourcePort?this.sourcePort.getParent().getID():null,sourcePort:this.sourcePort?this.sourcePort.getID():null,target:this.targetPort?this.targetPort.getParent().getID():null,targetPort:this.targetPort?this.targetPort.getID():null,points:s.map(this.points,e=>e.serialize()),labels:s.map(this.labels,e=>e.serialize())})}doClone(e={},t){t.setPoints(s.map(this.getPoints(),t=>t.clone(e))),this.sourcePort&&t.setSourcePort(this.sourcePort.clone(e)),this.targetPort&&t.setTargetPort(this.targetPort.clone(e))}clearPort(e){this.sourcePort===e?this.setSourcePort(null):this.targetPort===e&&this.setTargetPort(null)}remove(){this.sourcePort&&this.sourcePort.removeLink(this),this.targetPort&&this.targetPort.removeLink(this),super.remove()}isLastPoint(e){return this.getPointIndex(e)===this.points.length-1}getPointIndex(e){return this.points.indexOf(e)}getPointModel(e){for(var t=0;t<this.points.length;t++)if(this.points[t].getID()===e)return this.points[t];return null}getPortForPoint(e){return null!==this.sourcePort&&this.getFirstPoint().getID()===e.getID()?this.sourcePort:null!==this.targetPort&&this.getLastPoint().getID()===e.getID()?this.targetPort:null}getPointForPort(e){return null!==this.sourcePort&&this.sourcePort.getID()===e.getID()?this.getFirstPoint():null!==this.targetPort&&this.targetPort.getID()===e.getID()?this.getLastPoint():null}getFirstPoint(){return this.points[0]}getLastPoint(){return this.points[this.points.length-1]}setSourcePort(e){null!==e&&e.addLink(this),null!==this.sourcePort&&this.sourcePort.removeLink(this),this.sourcePort=e,this.fireEvent({port:e},"sourcePortChanged")}getSourcePort(){return this.sourcePort}getTargetPort(){return this.targetPort}setTargetPort(e){null!==e&&e.addLink(this),null!==this.targetPort&&this.targetPort.removeLink(this),this.targetPort=e,this.fireEvent({port:e},"targetPortChanged")}point(e,t,i=1){return this.addPoint(this.generatePoint(e,t),i)}addLabel(e){e.setParent(this),this.labels.push(e)}getPoints(){return this.points}getLabels(){return this.labels}setPoints(e){s.forEach(e,e=>{e.setParent(this)}),this.points=e}removePoint(e){this.points.splice(this.getPointIndex(e),1)}removePointsBefore(e){this.points.splice(0,this.getPointIndex(e))}removePointsAfter(e){this.points.splice(this.getPointIndex(e)+1)}removeMiddlePoints(){this.points.length>2&&this.points.splice(0,this.points.length-2)}addPoint(e,t=1){return e.setParent(this),this.points.splice(t,0,e),e}generatePoint(e=0,t=0){return new r.PointModel({link:this,position:new o.Point(e,t)})}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0);t.PointModel=class extends r.BasePositionModel{constructor(e){super(Object.assign({},e,{type:"point"})),this.parent=e.link}isConnectedToPort(){return null!==this.parent.getPortForPoint(this)}getLink(){return this.getParent()}remove(){this.parent&&this.parent.removePoint(this),super.remove()}isLocked(){return super.isLocked()||this.getParent().isLocked()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(1),s=i(3),o=i(0);t.NodeModel=class extends o.BasePositionModel{constructor(e){super(e),this.ports={},this.width=0,this.height=0}getBoundingBox(){return new s.Rectangle(this.getPosition(),this.width,this.height)}setPosition(e,t){let i=this.position;super.setPosition(e,t),r.forEach(this.ports,r=>{r.setPosition(r.getX()+e-i.x,r.getY()+t-i.y)})}deserialize(e){super.deserialize(e),r.forEach(e.data.ports,t=>{let i=e.engine.getFactoryForPort(t.type).generateModel({});i.deserialize(Object.assign({},e,{data:t})),e.registerModel(i),this.addPort(i)})}serialize(){return Object.assign({},super.serialize(),{ports:r.map(this.ports,e=>e.serialize())})}doClone(e={},t){t.ports={},r.forEach(this.ports,i=>{t.addPort(i.clone(e))})}remove(){super.remove(),r.forEach(this.ports,e=>{r.forEach(e.getLinks(),e=>{e.remove()})})}getPortFromID(e){for(var t in this.ports)if(this.ports[t].getID()===e)return this.ports[t];return null}getLink(e){for(let t in this.ports){const i=this.ports[t].getLinks();if(i[e])return i[e]}}getPort(e){return this.ports[e]}getPorts(){return this.ports}removePort(e){for(let t of r.values(e.getLinks()))t.clearPort(e);this.ports[e.getName()]&&(this.ports[e.getName()].setParent(null),delete this.ports[e.getName()])}addPort(e){return e.setParent(this),this.ports[e.getName()]=e,e}updateDimensions({width:e,height:t}){this.width=e,this.height=t}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(8);t.NodeLayerModel=class extends r.LayerModel{constructor(){super({type:"diagram-nodes",isSvg:!1,transformed:!0})}addModel(e){if(!(e instanceof s.NodeModel))throw new Error("Can only add nodes to this layer");e.registerListener({entityRemoved:()=>{this.getParent().removeNode(e)}}),super.addModel(e)}getChildModelFactoryBank(e){return e.getNodeFactories()}getNodes(){return this.getModels()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(6);t.LinkLayerModel=class extends r.LayerModel{constructor(){super({type:"diagram-links",isSvg:!0,transformed:!0})}addModel(e){if(!(e instanceof s.LinkModel))throw new Error("Can only add links to this layer");e.registerListener({entityRemoved:()=>{this.getParent().removeLink(e)}}),super.addModel(e)}getLinks(){return this.getModels()}getChildModelFactoryBank(e){return e.getLinkFactories()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(1),o=i(20),n=i(0);t.LinkWidget=class extends r.Component{constructor(e){super(e),this.state={sourcePort:null,targetPort:null}}componentWillUnmount(){this.sourceListener&&this.sourceListener.deregister(),this.targetListener&&this.targetListener.deregister()}static getDerivedStateFromProps(e,t){return{sourcePort:e.link.getSourcePort(),targetPort:e.link.getTargetPort()}}installTarget(){this.targetListener&&this.targetListener.deregister(),this.targetListener=this.props.link.getTargetPort().registerListener({reportInitialPosition:e=>{this.forceUpdate()}})}installSource(){this.sourceListener&&this.sourceListener.deregister(),this.sourceListener=this.props.link.getSourcePort().registerListener({reportInitialPosition:e=>{this.forceUpdate()}})}componentDidUpdate(e,t,i){t.sourcePort!==this.state.sourcePort&&this.installSource(),t.targetPort!==this.state.targetPort&&this.installTarget()}static generateLinePath(e,t){return`M${e.getX()},${e.getY()} L ${t.getX()},${t.getY()}`}componentDidMount(){this.props.link.getSourcePort()&&this.installSource(),this.props.link.getTargetPort()&&this.installTarget()}render(){const{link:e}=this.props;return e.getSourcePort()&&!e.getSourcePort().reportedPosition?null:e.getTargetPort()&&!e.getTargetPort().reportedPosition?null:r.createElement(n.PeformanceWidget,{model:this.props.link,serialized:this.props.link.serialize()},()=>r.createElement("g",{"data-linkid":this.props.link.getID()},this.props.diagramEngine.generateWidgetForLink(e),s.map(this.props.link.getLabels(),(e,t)=>r.createElement(o.LabelWidget,{key:e.getID(),engine:this.props.diagramEngine,label:e,index:t}))))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(4),o=i(1),n=i(11);var a;!function(e){e.Container=s.default.div``}(a||(a={}));t.LinkLayerWidget=class extends r.Component{render(){return r.createElement(r.Fragment,null,o.map(this.props.layer.getLinks(),e=>r.createElement(n.LinkWidget,{key:e.getID(),link:e,diagramEngine:this.props.engine})))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(4),o=i(1),n=i(14);var a;!function(e){e.Container=s.default.div``}(a||(a={}));t.NodeLayerWidget=class extends r.Component{render(){return r.createElement(r.Fragment,null,o.map(this.props.layer.getNodes(),e=>r.createElement(n.NodeWidget,{key:e.getID(),diagramEngine:this.props.engine,node:e})))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(1),o=i(0),n=i(4),a=i(22);var l;!function(e){e.Node=n.default.div`
 		position: absolute;
@@ -8,3 +8,3 @@ -webkit-touch-callout: none; /* iOS Safari */
 		pointer-events: all;
-	`}(a||(a={}));t.NodeWidget=class extends r.Component{constructor(e){super(e),this.ref=r.createRef()}componentWillUnmount(){this.ob.disconnect(),this.ob=null}componentDidUpdate(e,t,i){this.listener&&this.props.node!==e.node&&(this.listener.deregister(),this.installSelectionListener())}installSelectionListener(){this.listener=this.props.node.registerListener({selectionChanged:e=>{this.forceUpdate()}})}componentDidMount(){this.ob=new ResizeObserver(e=>{const t=e[0].contentRect;this.props.node.updateDimensions({width:t.width,height:t.height}),s.forEach(this.props.node.getPorts(),e=>{e.updateCoords(this.props.diagramEngine.getPortCoords(e))})}),this.ob.observe(this.ref.current),this.installSelectionListener()}render(){return r.createElement(o.PeformanceWidget,{model:this.props.node,serialized:this.props.node.serialize()},()=>r.createElement(a.Node,{className:"node",ref:this.ref,"data-nodeid":this.props.node.getID(),style:{top:this.props.node.getY(),left:this.props.node.getX()}},this.props.diagramEngine.generateWidgetForNode(this.props.node)))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(5);t.DragNewLinkState=class extends r.AbstractDisplacementState{constructor(e={}){super({name:"drag-new-link"}),this.config=Object.assign({allowLooseLinks:!0,allowLinksFromLockedPorts:!1},e),this.registerAction(new r.Action({type:r.InputType.MOUSE_DOWN,fire:e=>{this.port=this.engine.getMouseElement(e.event),this.config.allowLinksFromLockedPorts||!this.port.isLocked()?(this.link=this.port.createLinkModel(),this.link?(this.link.setSelected(!0),this.link.setSourcePort(this.port),this.engine.getModel().addLink(this.link),this.port.reportPosition()):this.eject()):this.eject()}})),this.registerAction(new r.Action({type:r.InputType.MOUSE_UP,fire:e=>{const t=this.engine.getMouseElement(e.event);if(t instanceof s.PortModel&&this.port.canLinkToPort(t))return this.link.setTargetPort(t),t.reportPosition(),void this.engine.repaintCanvas();this.config.allowLooseLinks||(this.link.remove(),this.engine.repaintCanvas())}}))}fireMouseMoved(e){const t=this.port.getPosition();this.link.getLastPoint().setPosition(t.x+e.virtualDisplacementX,t.y+e.virtualDisplacementY),this.engine.repaintCanvas()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(1),o=i(7),n=i(5);t.DragDiagramItemsState=class extends r.MoveItemsState{constructor(){super(),this.registerAction(new r.Action({type:r.InputType.MOUSE_UP,fire:e=>{const t=this.engine.getMouseElement(e.event);t instanceof n.PortModel&&s.forEach(this.initialPositions,e=>{if(e.item instanceof o.PointModel){const i=e.item.getParent();if(i.getLastPoint()!==e.item)return;i.setTargetPort(t),t.reportPosition(),this.engine.repaintCanvas()}})}}))}}},function(e,t,i){"use strict";function r(e){for(var i in e)t.hasOwnProperty(i)||(t[i]=e[i])}Object.defineProperty(t,"__esModule",{value:!0}),r(i(18)),r(i(19)),r(i(6)),r(i(7)),r(i(11)),r(i(10)),r(i(12)),r(i(21)),r(i(9)),r(i(13)),r(i(22)),r(i(8)),r(i(14)),r(i(5)),r(i(23)),r(i(24)),r(i(16)),r(i(15)),r(i(25))},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(1),s=i(6),o=i(8),n=i(0),a=i(9),l=i(10);t.DiagramModel=class extends n.CanvasModel{constructor(e={}){super(e),this.addLayer(new l.LinkLayerModel),this.addLayer(new a.NodeLayerModel)}deserialize(e){this.layers=[],super.deserialize(e)}addLayer(e){super.addLayer(e),e instanceof a.NodeLayerModel&&(this.activeNodeLayer=e),e instanceof l.LinkLayerModel&&(this.activeLinkLayer=e)}getLinkLayers(){return r.filter(this.layers,e=>e instanceof l.LinkLayerModel)}getNodeLayers(){return r.filter(this.layers,e=>e instanceof a.NodeLayerModel)}getActiveNodeLayer(){if(!this.activeNodeLayer){const e=this.getNodeLayers();0===e.length?this.addLayer(new a.NodeLayerModel):this.activeNodeLayer=e[0]}return this.activeNodeLayer}getActiveLinkLayer(){if(!this.activeLinkLayer){const e=this.getLinkLayers();0===e.length?this.addLayer(new a.NodeLayerModel):this.activeLinkLayer=e[0]}return this.activeLinkLayer}getNode(e){for(const t of this.getNodeLayers()){const i=t.getModel(e);if(i)return i}}getLink(e){for(const t of this.getLinkLayers()){const i=t.getModel(e);if(i)return i}}addAll(...e){return r.forEach(e,e=>{e instanceof s.LinkModel?this.addLink(e):e instanceof o.NodeModel&&this.addNode(e)}),e}addLink(e){return e.registerListener({entityRemoved:()=>{this.removeLink(e)}}),this.getActiveLinkLayer().addModel(e),this.fireEvent({link:e,isCreated:!0},"linksUpdated"),e}addNode(e){return e.registerListener({entityRemoved:()=>{this.removeNode(e)}}),this.getActiveNodeLayer().addModel(e),this.fireEvent({node:e,isCreated:!0},"nodesUpdated"),e}removeLink(e){r.some(this.getLinkLayers(),t=>t.removeModel(e))&&this.fireEvent({link:e,isCreated:!1},"linksUpdated")}removeNode(e){r.some(this.getNodeLayers(),t=>t.removeModel(e))&&this.fireEvent({node:e,isCreated:!1},"nodesUpdated")}getLinks(){return r.flatMap(this.getLinkLayers(),e=>r.values(e.getModels()))}getNodes(){return r.flatMap(this.getNodeLayers(),e=>r.values(e.getModels()))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0);t.LabelModel=class extends r.BaseModel{constructor(e){super(Object.assign({},e,{offsetX:e.offsetX||0,offsetY:e.offsetY||0}))}deserialize(e){super.deserialize(e),this.options.offsetX=e.data.offsetX,this.options.offsetY=e.data.offsetY}serialize(){return Object.assign({},super.serialize(),{offsetX:this.options.offsetX,offsetY:this.options.offsetY})}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(4);var o;!function(e){e.Label=s.default.div`
+	`}(l||(l={}));t.NodeWidget=class extends r.Component{constructor(e){super(e),this.ref=r.createRef()}componentWillUnmount(){this.ob.disconnect(),this.ob=null}componentDidUpdate(e,t,i){this.listener&&this.props.node!==e.node&&(this.listener.deregister(),this.installSelectionListener())}installSelectionListener(){this.listener=this.props.node.registerListener({selectionChanged:e=>{this.forceUpdate()}})}componentDidMount(){this.ob=new a.default(e=>{const t=e[0].contentRect;this.props.node.updateDimensions({width:t.width,height:t.height}),s.forEach(this.props.node.getPorts(),e=>{e.updateCoords(this.props.diagramEngine.getPortCoords(e))})}),this.ob.observe(this.ref.current),this.installSelectionListener()}render(){return r.createElement(o.PeformanceWidget,{model:this.props.node,serialized:this.props.node.serialize()},()=>r.createElement(l.Node,{className:"node",ref:this.ref,"data-nodeid":this.props.node.getID(),style:{top:this.props.node.getY(),left:this.props.node.getX()}},this.props.diagramEngine.generateWidgetForNode(this.props.node)))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(5);t.DragNewLinkState=class extends r.AbstractDisplacementState{constructor(e={}){super({name:"drag-new-link"}),this.config=Object.assign({allowLooseLinks:!0,allowLinksFromLockedPorts:!1},e),this.registerAction(new r.Action({type:r.InputType.MOUSE_DOWN,fire:e=>{this.port=this.engine.getMouseElement(e.event),this.config.allowLinksFromLockedPorts||!this.port.isLocked()?(this.link=this.port.createLinkModel(),this.link?(this.link.setSelected(!0),this.link.setSourcePort(this.port),this.engine.getModel().addLink(this.link),this.port.reportPosition()):this.eject()):this.eject()}})),this.registerAction(new r.Action({type:r.InputType.MOUSE_UP,fire:e=>{const t=this.engine.getMouseElement(e.event);if(t instanceof s.PortModel&&this.port.canLinkToPort(t))return this.link.setTargetPort(t),t.reportPosition(),void this.engine.repaintCanvas();this.config.allowLooseLinks||(this.link.remove(),this.engine.repaintCanvas())}}))}fireMouseMoved(e){const t=this.port.getPosition();this.link.getLastPoint().setPosition(t.x+e.virtualDisplacementX,t.y+e.virtualDisplacementY),this.engine.repaintCanvas()}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(1),o=i(7),n=i(5);t.DragDiagramItemsState=class extends r.MoveItemsState{constructor(){super(),this.registerAction(new r.Action({type:r.InputType.MOUSE_UP,fire:e=>{const t=this.engine.getMouseElement(e.event);t instanceof n.PortModel&&s.forEach(this.initialPositions,e=>{if(e.item instanceof o.PointModel){const i=e.item.getParent();if(i.getLastPoint()!==e.item)return;i.setTargetPort(t),t.reportPosition(),this.engine.repaintCanvas()}})}}))}}},function(e,t,i){"use strict";function r(e){for(var i in e)t.hasOwnProperty(i)||(t[i]=e[i])}Object.defineProperty(t,"__esModule",{value:!0}),r(i(18)),r(i(19)),r(i(6)),r(i(7)),r(i(11)),r(i(10)),r(i(12)),r(i(21)),r(i(9)),r(i(13)),r(i(23)),r(i(8)),r(i(14)),r(i(5)),r(i(24)),r(i(25)),r(i(16)),r(i(15)),r(i(26))},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(1),s=i(6),o=i(8),n=i(0),a=i(9),l=i(10);t.DiagramModel=class extends n.CanvasModel{constructor(e={}){super(e),this.addLayer(new l.LinkLayerModel),this.addLayer(new a.NodeLayerModel)}deserialize(e){this.layers=[],super.deserialize(e)}addLayer(e){super.addLayer(e),e instanceof a.NodeLayerModel&&(this.activeNodeLayer=e),e instanceof l.LinkLayerModel&&(this.activeLinkLayer=e)}getLinkLayers(){return r.filter(this.layers,e=>e instanceof l.LinkLayerModel)}getNodeLayers(){return r.filter(this.layers,e=>e instanceof a.NodeLayerModel)}getActiveNodeLayer(){if(!this.activeNodeLayer){const e=this.getNodeLayers();0===e.length?this.addLayer(new a.NodeLayerModel):this.activeNodeLayer=e[0]}return this.activeNodeLayer}getActiveLinkLayer(){if(!this.activeLinkLayer){const e=this.getLinkLayers();0===e.length?this.addLayer(new a.NodeLayerModel):this.activeLinkLayer=e[0]}return this.activeLinkLayer}getNode(e){for(const t of this.getNodeLayers()){const i=t.getModel(e);if(i)return i}}getLink(e){for(const t of this.getLinkLayers()){const i=t.getModel(e);if(i)return i}}addAll(...e){return r.forEach(e,e=>{e instanceof s.LinkModel?this.addLink(e):e instanceof o.NodeModel&&this.addNode(e)}),e}addLink(e){return this.getActiveLinkLayer().addModel(e),this.fireEvent({link:e,isCreated:!0},"linksUpdated"),e}addNode(e){return this.getActiveNodeLayer().addModel(e),this.fireEvent({node:e,isCreated:!0},"nodesUpdated"),e}removeLink(e){r.some(this.getLinkLayers(),t=>t.removeModel(e))&&this.fireEvent({link:e,isCreated:!1},"linksUpdated")}removeNode(e){r.some(this.getNodeLayers(),t=>t.removeModel(e))&&this.fireEvent({node:e,isCreated:!1},"nodesUpdated")}getLinks(){return r.flatMap(this.getLinkLayers(),e=>r.values(e.getModels()))}getNodes(){return r.flatMap(this.getNodeLayers(),e=>r.values(e.getModels()))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0);t.LabelModel=class extends r.BaseModel{constructor(e){super(Object.assign({},e,{offsetX:e.offsetX||0,offsetY:e.offsetY||0}))}deserialize(e){super.deserialize(e),this.options.offsetX=e.data.offsetX,this.options.offsetY=e.data.offsetY}serialize(){return Object.assign({},super.serialize(),{offsetX:this.options.offsetX,offsetY:this.options.offsetY})}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(4);var o;!function(e){e.Label=s.default.div`
 		display: inline-block;
@@ -15,4 +15,4 @@ position: absolute;
 		overflow: visible;
-	`}(o||(o={}));t.LabelWidget=class extends r.Component{constructor(e){super(e),this.findPathAndRelativePositionToRenderLabel=e=>{const t=this.props.label.getParent(),i=t.getRenderedPath().map(e=>e.getTotalLength());let r=i.reduce((e,t)=>e+t,0)*(e/(t.getLabels().length+1)),s=0;for(;s<t.getRenderedPath().length;){if(r-i[s]<0)return{path:t.getRenderedPath()[s],position:r};r-=i[s],s++}},this.calculateLabelPosition=()=>{const e=this.findPathAndRelativePositionToRenderLabel(this.props.index+1);if(!e)return;const{path:t,position:i}=e,r=this.ref.current.offsetWidth,s=this.ref.current.offsetHeight,o=t.getPointAtLength(i),n=o.x-r/2+this.props.label.getOptions().offsetX,a=o.y-s/2+this.props.label.getOptions().offsetY;this.ref.current.style.transform=`translate(${n}px, ${a}px)`},this.ref=r.createRef()}componentDidUpdate(){window.requestAnimationFrame(this.calculateLabelPosition)}componentDidMount(){window.requestAnimationFrame(this.calculateLabelPosition)}render(){const e=this.props.engine.getCanvas();return r.createElement(o.Foreign,{key:this.props.label.getID(),width:e.offsetWidth,height:e.offsetHeight},r.createElement(o.Label,{ref:this.ref},this.props.engine.getFactoryForLabel(this.props.label).generateReactWidget({model:this.props.label})))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(0),o=i(10),n=i(12);t.LinkLayerFactory=class extends s.AbstractReactFactory{constructor(){super("diagram-links")}generateModel(e){return new o.LinkLayerModel}generateReactWidget(e){return r.createElement(n.LinkLayerWidget,{layer:e.model,engine:this.engine})}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(0),o=i(9),n=i(13);t.NodeLayerFactory=class extends s.AbstractReactFactory{constructor(){super("diagram-nodes")}generateModel(e){return new o.NodeLayerModel}generateReactWidget(e){return r.createElement(n.NodeLayerWidget,{layer:e.model,engine:this.engine})}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(1),o=i(0);t.PortWidget=class extends r.Component{constructor(e){super(e),this.ref=r.createRef()}report(){this.props.port.updateCoords(this.props.engine.getPortCoords(this.props.port,this.ref.current))}componentWillUnmount(){this.engineListenerHandle&&this.engineListenerHandle.deregister()}componentDidUpdate(e,t,i){this.props.port.reportedPosition||this.report()}componentDidMount(){this.engineListenerHandle=this.props.engine.registerListener({canvasReady:()=>{this.report()}}),this.props.engine.getCanvas()&&this.report()}getExtraProps(){return o.Toolkit.TESTING?{"data-links":s.keys(this.props.port.getNode().getPort(this.props.port.getName()).links).join(",")}:{}}render(){return r.createElement("div",Object.assign({style:this.props.style,ref:this.ref,className:`port ${this.props.className||""}`,"data-name":this.props.port.getName(),"data-nodeid":this.props.port.getNode().getID()},this.getExtraProps()),this.props.children)}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(5),o=i(15),n=i(16);t.DefaultDiagramState=class extends r.State{constructor(){super({name:"default-diagrams"}),this.childStates=[new r.SelectingState],this.dragCanvas=new r.DragCanvasState,this.dragNewLink=new o.DragNewLinkState,this.dragItems=new n.DragDiagramItemsState,this.registerAction(new r.Action({type:r.InputType.MOUSE_DOWN,fire:e=>{const t=this.engine.getActionEventBus().getModelForEvent(e);t?t instanceof s.PortModel?this.transitionWithEvent(this.dragNewLink,e):this.transitionWithEvent(this.dragItems,e):this.transitionWithEvent(this.dragCanvas,e)}}))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(3),s=i(0);t.DiagramEngine=class extends s.CanvasEngine{constructor(){super(),this.maxNumberPointsPerLink=1e3,this.nodeFactories=new s.FactoryBank,this.linkFactories=new s.FactoryBank,this.portFactories=new s.FactoryBank,this.labelFactories=new s.FactoryBank;const e=e=>{e.registerListener({factoryAdded:e=>{e.factory.setDiagramEngine(this)},factoryRemoved:e=>{e.factory.setDiagramEngine(null)}})};e(this.nodeFactories),e(this.linkFactories),e(this.portFactories),e(this.labelFactories)}getMouseElement(e){var t=e.target,i=this.model,r=s.Toolkit.closest(t,".port[data-name]");if(r){var o=s.Toolkit.closest(t,".node[data-nodeid]");return i.getNode(o.getAttribute("data-nodeid")).getPort(r.getAttribute("data-name"))}return(r=s.Toolkit.closest(t,".point[data-id]"))?i.getLink(r.getAttribute("data-linkid")).getPointModel(r.getAttribute("data-id")):(r=s.Toolkit.closest(t,"[data-linkid]"))?i.getLink(r.getAttribute("data-linkid")):(r=s.Toolkit.closest(t,".node[data-nodeid]"))?i.getNode(r.getAttribute("data-nodeid")):null}
+	`}(o||(o={}));t.LabelWidget=class extends r.Component{constructor(e){super(e),this.findPathAndRelativePositionToRenderLabel=e=>{const t=this.props.label.getParent(),i=t.getRenderedPath().map(e=>e.getTotalLength());let r=i.reduce((e,t)=>e+t,0)*(e/(t.getLabels().length+1)),s=0;for(;s<t.getRenderedPath().length;){if(r-i[s]<0)return{path:t.getRenderedPath()[s],position:r};r-=i[s],s++}},this.calculateLabelPosition=()=>{const e=this.findPathAndRelativePositionToRenderLabel(this.props.index+1);if(!e)return;const{path:t,position:i}=e,r=this.ref.current.offsetWidth,s=this.ref.current.offsetHeight,o=t.getPointAtLength(i),n=o.x-r/2+this.props.label.getOptions().offsetX,a=o.y-s/2+this.props.label.getOptions().offsetY;this.ref.current.style.transform=`translate(${n}px, ${a}px)`},this.ref=r.createRef()}componentDidUpdate(){window.requestAnimationFrame(this.calculateLabelPosition)}componentDidMount(){window.requestAnimationFrame(this.calculateLabelPosition)}render(){const e=this.props.engine.getCanvas();return r.createElement(o.Foreign,{key:this.props.label.getID(),width:e.offsetWidth,height:e.offsetHeight},r.createElement(o.Label,{ref:this.ref},this.props.engine.getFactoryForLabel(this.props.label).generateReactWidget({model:this.props.label})))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(0),o=i(10),n=i(12);t.LinkLayerFactory=class extends s.AbstractReactFactory{constructor(){super("diagram-links")}generateModel(e){return new o.LinkLayerModel}generateReactWidget(e){return r.createElement(n.LinkLayerWidget,{layer:e.model,engine:this.engine})}}},function(e,t){e.exports=require("resize-observer-polyfill")},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(0),o=i(9),n=i(13);t.NodeLayerFactory=class extends s.AbstractReactFactory{constructor(){super("diagram-nodes")}generateModel(e){return new o.NodeLayerModel}generateReactWidget(e){return r.createElement(n.NodeLayerWidget,{layer:e.model,engine:this.engine})}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(2),s=i(1),o=i(0);t.PortWidget=class extends r.Component{constructor(e){super(e),this.ref=r.createRef()}report(){this.props.port.updateCoords(this.props.engine.getPortCoords(this.props.port,this.ref.current))}componentWillUnmount(){this.engineListenerHandle&&this.engineListenerHandle.deregister()}componentDidUpdate(e,t,i){this.props.port.reportedPosition||this.report()}componentDidMount(){this.engineListenerHandle=this.props.engine.registerListener({canvasReady:()=>{this.report()}}),this.props.engine.getCanvas()&&this.report()}getExtraProps(){return o.Toolkit.TESTING?{"data-links":s.keys(this.props.port.getNode().getPort(this.props.port.getName()).links).join(",")}:{}}render(){return r.createElement("div",Object.assign({style:this.props.style,ref:this.ref,className:`port ${this.props.className||""}`,"data-name":this.props.port.getName(),"data-nodeid":this.props.port.getNode().getID()},this.getExtraProps()),this.props.children)}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(0),s=i(5),o=i(15),n=i(16);t.DefaultDiagramState=class extends r.State{constructor(){super({name:"default-diagrams"}),this.childStates=[new r.SelectingState],this.dragCanvas=new r.DragCanvasState,this.dragNewLink=new o.DragNewLinkState,this.dragItems=new n.DragDiagramItemsState,this.registerAction(new r.Action({type:r.InputType.MOUSE_DOWN,fire:e=>{const t=this.engine.getActionEventBus().getModelForEvent(e);t?t instanceof s.PortModel?this.transitionWithEvent(this.dragNewLink,e):this.transitionWithEvent(this.dragItems,e):this.transitionWithEvent(this.dragCanvas,e)}}))}}},function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});const r=i(3),s=i(0);t.DiagramEngine=class extends s.CanvasEngine{constructor(){super(),this.maxNumberPointsPerLink=1e3,this.nodeFactories=new s.FactoryBank,this.linkFactories=new s.FactoryBank,this.portFactories=new s.FactoryBank,this.labelFactories=new s.FactoryBank;const e=e=>{e.registerListener({factoryAdded:e=>{e.factory.setDiagramEngine(this)},factoryRemoved:e=>{e.factory.setDiagramEngine(null)}})};e(this.nodeFactories),e(this.linkFactories),e(this.portFactories),e(this.labelFactories)}getMouseElement(e){var t=e.target,i=this.model,r=s.Toolkit.closest(t,".port[data-name]");if(r){var o=s.Toolkit.closest(t,".node[data-nodeid]");return i.getNode(o.getAttribute("data-nodeid")).getPort(r.getAttribute("data-name"))}return(r=s.Toolkit.closest(t,".point[data-id]"))?i.getLink(r.getAttribute("data-linkid")).getPointModel(r.getAttribute("data-id")):(r=s.Toolkit.closest(t,"[data-linkid]"))?i.getLink(r.getAttribute("data-linkid")):(r=s.Toolkit.closest(t,".node[data-nodeid]"))?i.getNode(r.getAttribute("data-nodeid")):null}
 //!-------------- FACTORIES ------------
 getNodeFactories(){return this.nodeFactories}getLinkFactories(){return this.linkFactories}getLabelFactories(){return this.labelFactories}getPortFactories(){return this.portFactories}getFactoryForNode(e){return"string"==typeof e?this.nodeFactories.getFactory(e):this.nodeFactories.getFactory(e.getType())}getFactoryForLink(e){return"string"==typeof e?this.linkFactories.getFactory(e):this.linkFactories.getFactory(e.getType())}getFactoryForLabel(e){return"string"==typeof e?this.labelFactories.getFactory(e):this.labelFactories.getFactory(e.getType())}getFactoryForPort(e){return"string"==typeof e?this.portFactories.getFactory(e):this.portFactories.getFactory(e.getType())}generateWidgetForLink(e){return this.getFactoryForLink(e).generateReactWidget({model:e})}generateWidgetForNode(e){return this.getFactoryForNode(e).generateReactWidget({model:e})}getNodeElement(e){const t=this.canvas.querySelector(`.node[data-nodeid="${e.getID()}"]`);if(null===t)throw new Error("Cannot find Node element with nodeID: ["+e.getID()+"]");return t}getNodePortElement(e){var t=this.canvas.querySelector(`.port[data-name="${e.getName()}"][data-nodeid="${e.getParent().getID()}"]`);if(null===t)throw new Error("Cannot find Node Port element with nodeID: ["+e.getParent().getID()+"] and name: ["+e.getName()+"]");return t}getPortCenter(e){return this.getPortCoords(e).getOrigin()}getPortCoords(e,t){if(!this.canvas)throw new Error("Canvas needs to be set first");t||(t=this.getNodePortElement(e));const i=t.getBoundingClientRect(),s=this.getRelativeMousePoint({clientX:i.left,clientY:i.top}),o=this.model.getZoomLevel()/100;return new r.Rectangle(s.x,s.y,i.width/o,i.height/o)}getNodeDimensions(e){if(!this.canvas)return{width:0,height:0};const t=this.getNodeElement(e).getBoundingClientRect();return{width:t.width,height:t.height}}getMaxNumberPointsPerLink(){return this.maxNumberPointsPerLink}setMaxNumberPointsPerLink(e){this.maxNumberPointsPerLink=e}}}])});

package.json

 {
 	"name": "@projectstorm/react-diagrams-core",
-	"version": "6.0.1-beta.4",
+	"version": "6.0.1-beta.5",
 	"author": "dylanvorster",
@@ -32,4 +32,4 @@ "license": "MIT",
 	"dependencies": {
-		"@projectstorm/geometry": "^6.0.1-beta.4",
-		"@projectstorm/react-canvas-core": "^6.0.1-beta.4"
+		"@projectstorm/geometry": "^6.0.1-beta.5",
+		"@projectstorm/react-canvas-core": "^6.0.1-beta.5"
 	},
@@ -39,5 +39,6 @@ "peerDependencies": {
 		"lodash": "4.*",
-		"react": "16.*"
+		"react": "16.*",
+		"resize-observer-polyfill": "^1.5.1"
 	},
-	"gitHead": "1a7acafdc8076a222d4286aeee0a0ac41ce9ae38"
+	"gitHead": "741851b855dae95ba72d5a259da1f067480a629a"
 }

No alert changes

Improved metrics

Total package byte prevSize

52282

increased by0.29%

Lines of code

666

increased by0.15%

Worsened metrics

Dependency count

6

increased by20%

Dependency changes

• + Addedresize-observer-polyfill@1.5.1(transitive)

• Updated@projectstorm/geometry@^6.0.1-beta.5

• Updated@projectstorm/react-canvas-core@^6.0.1-beta.5