@@ -11,6 +11,8 @@ import * as React from 'react';
11
11
import { CanvasWidget } from '@projectstorm/react-canvas-core' ;
12
12
import { DemoCanvasWidget } from '../helpers/DemoCanvasWidget' ;
13
13
import { MouseEvent } from 'react' ;
14
+ import { DefaultLinkPointWidget , DefaultLinkSegmentWidget } from '@projectstorm/react-diagrams-defaults/dist' ;
15
+ import { DiagramEngine } from '@projectstorm/react-diagrams-core/dist' ;
14
16
15
17
export class AdvancedLinkModel extends DefaultLinkModel {
16
18
constructor ( ) {
@@ -56,7 +58,56 @@ const CustomLinkArrowWidget = (props) => {
56
58
) ;
57
59
} ;
58
60
59
- export class AdvancedLinkWidget extends DefaultLinkWidget {
61
+ export interface AdvancedLinkWWidgetProps {
62
+ link : DefaultLinkModel ;
63
+ diagramEngine : DiagramEngine ;
64
+ pointAdded ?: ( point : PointModel , event : MouseEvent ) => any ;
65
+ renderPoints ?: boolean ;
66
+ selected ?: ( event : MouseEvent ) => any ;
67
+ }
68
+
69
+ export class AdvancedLinkWidget extends React . Component < AdvancedLinkWWidgetProps > {
70
+ generatePoint = ( point : PointModel ) : JSX . Element => {
71
+ return (
72
+ < DefaultLinkPointWidget
73
+ key = { point . getID ( ) }
74
+ point = { point as any }
75
+ colorSelected = { this . props . link . getOptions ( ) . selectedColor ?? '' }
76
+ color = { this . props . link . getOptions ( ) . color }
77
+ />
78
+ ) ;
79
+ } ;
80
+
81
+ generateLink = ( path : string , extraProps : any , id : string | number ) : JSX . Element => {
82
+ return (
83
+ < DefaultLinkSegmentWidget
84
+ key = { `link-${ id } ` }
85
+ path = { path }
86
+ diagramEngine = { this . props . diagramEngine }
87
+ factory = { this . props . diagramEngine . getFactoryForLink ( this . props . link ) }
88
+ link = { this . props . link }
89
+ extras = { extraProps }
90
+ />
91
+ ) ;
92
+ } ;
93
+
94
+ addPointToLink = ( event : MouseEvent , index : number ) => {
95
+ if (
96
+ ! event . shiftKey &&
97
+ ! this . props . link . isLocked ( ) &&
98
+ this . props . link . getPoints ( ) . length - 1 <= this . props . diagramEngine . getMaxNumberPointsPerLink ( )
99
+ ) {
100
+ const position = this . props . diagramEngine . getRelativeMousePoint ( event ) ;
101
+ const point = this . props . link . point ( position . x , position . y , index ) ;
102
+ event . persist ( ) ;
103
+ event . stopPropagation ( ) ;
104
+ this . props . diagramEngine . getActionEventBus ( ) . fireAction ( {
105
+ event,
106
+ model : point
107
+ } ) ;
108
+ }
109
+ } ;
110
+
60
111
generateArrow ( point : PointModel , previousPoint : PointModel ) : JSX . Element {
61
112
return (
62
113
< CustomLinkArrowWidget
@@ -73,7 +124,6 @@ export class AdvancedLinkWidget extends DefaultLinkWidget {
73
124
//ensure id is present for all points on the path
74
125
var points = this . props . link . getPoints ( ) ;
75
126
var paths = [ ] ;
76
- this . refPaths = [ ] ;
77
127
78
128
//draw the multiple anchors and complex line instead
79
129
for ( let j = 0 ; j < points . length - 1 ; j ++ ) {
0 commit comments