react-design-editor 0.0.50 → 0.0.51

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (100) hide show
  1. package/dist/react-design-editor.js +7739 -7114
  2. package/dist/react-design-editor.min.js +1 -1
  3. package/dist/react-design-editor.min.js.LICENSE.txt +2 -0
  4. package/lib/Canvas.d.ts +18 -18
  5. package/lib/Canvas.js +172 -172
  6. package/lib/CanvasObject.d.ts +10 -10
  7. package/lib/CanvasObject.js +96 -96
  8. package/lib/constants/code.d.ts +19 -19
  9. package/lib/constants/code.js +22 -22
  10. package/lib/constants/defaults.d.ts +38 -38
  11. package/lib/constants/defaults.js +69 -69
  12. package/lib/constants/index.d.ts +3 -3
  13. package/lib/constants/index.js +26 -26
  14. package/lib/handlers/AlignmentHandler.d.ts +18 -18
  15. package/lib/handlers/AlignmentHandler.js +58 -58
  16. package/lib/handlers/AnimationHandler.d.ts +50 -50
  17. package/lib/handlers/AnimationHandler.js +346 -346
  18. package/lib/handlers/ChartHandler.d.ts +8 -8
  19. package/lib/handlers/ChartHandler.js +8 -8
  20. package/lib/handlers/ContextmenuHandler.d.ts +28 -28
  21. package/lib/handlers/ContextmenuHandler.js +65 -65
  22. package/lib/handlers/CropHandler.d.ts +43 -43
  23. package/lib/handlers/CropHandler.js +261 -261
  24. package/lib/handlers/CustomHandler.d.ts +7 -7
  25. package/lib/handlers/CustomHandler.js +10 -10
  26. package/lib/handlers/DrawingHandler.d.ts +28 -28
  27. package/lib/handlers/DrawingHandler.js +318 -318
  28. package/lib/handlers/ElementHandler.d.ts +80 -80
  29. package/lib/handlers/ElementHandler.js +154 -154
  30. package/lib/handlers/EventHandler.d.ts +170 -170
  31. package/lib/handlers/EventHandler.js +880 -880
  32. package/lib/handlers/FiberHandler.d.ts +6 -6
  33. package/lib/handlers/FiberHandler.js +23 -23
  34. package/lib/handlers/GridHandler.d.ts +19 -19
  35. package/lib/handlers/GridHandler.js +77 -77
  36. package/lib/handlers/GuidelineHandler.d.ts +61 -61
  37. package/lib/handlers/GuidelineHandler.js +315 -315
  38. package/lib/handlers/Handler.d.ts +618 -618
  39. package/lib/handlers/Handler.js +1645 -1645
  40. package/lib/handlers/ImageHandler.d.ts +307 -307
  41. package/lib/handlers/ImageHandler.js +528 -528
  42. package/lib/handlers/InteractionHandler.d.ts +45 -45
  43. package/lib/handlers/InteractionHandler.js +168 -164
  44. package/lib/handlers/LinkHandler.d.ts +115 -115
  45. package/lib/handlers/LinkHandler.js +247 -247
  46. package/lib/handlers/NodeHandler.d.ts +50 -50
  47. package/lib/handlers/NodeHandler.js +274 -274
  48. package/lib/handlers/PortHandler.d.ts +22 -22
  49. package/lib/handlers/PortHandler.js +179 -179
  50. package/lib/handlers/ShortcutHandler.d.ts +119 -119
  51. package/lib/handlers/ShortcutHandler.js +151 -151
  52. package/lib/handlers/TooltipHandler.d.ts +33 -33
  53. package/lib/handlers/TooltipHandler.js +91 -91
  54. package/lib/handlers/TransactionHandler.d.ts +59 -59
  55. package/lib/handlers/TransactionHandler.js +137 -137
  56. package/lib/handlers/WorkareaHandler.d.ts +43 -43
  57. package/lib/handlers/WorkareaHandler.js +354 -354
  58. package/lib/handlers/ZoomHandler.d.ts +48 -48
  59. package/lib/handlers/ZoomHandler.js +143 -143
  60. package/lib/handlers/index.d.ts +23 -23
  61. package/lib/handlers/index.js +48 -48
  62. package/lib/index.d.ts +6 -6
  63. package/lib/index.js +20 -20
  64. package/lib/objects/Arrow.d.ts +2 -2
  65. package/lib/objects/Arrow.js +40 -40
  66. package/lib/objects/Chart.d.ts +10 -10
  67. package/lib/objects/Chart.js +117 -117
  68. package/lib/objects/CirclePort.d.ts +2 -2
  69. package/lib/objects/CirclePort.js +28 -28
  70. package/lib/objects/Cube.d.ts +5 -5
  71. package/lib/objects/Cube.js +71 -71
  72. package/lib/objects/CurvedLink.d.ts +2 -2
  73. package/lib/objects/CurvedLink.js +51 -51
  74. package/lib/objects/Element.d.ts +13 -13
  75. package/lib/objects/Element.js +77 -77
  76. package/lib/objects/Gif.d.ts +3 -3
  77. package/lib/objects/Gif.js +41 -41
  78. package/lib/objects/Iframe.d.ts +9 -9
  79. package/lib/objects/Iframe.js +63 -63
  80. package/lib/objects/Line.d.ts +2 -2
  81. package/lib/objects/Line.js +24 -24
  82. package/lib/objects/Link.d.ts +15 -15
  83. package/lib/objects/Link.js +107 -107
  84. package/lib/objects/Node.d.ts +59 -59
  85. package/lib/objects/Node.js +271 -271
  86. package/lib/objects/OrthogonalLink.d.ts +2 -2
  87. package/lib/objects/OrthogonalLink.js +54 -54
  88. package/lib/objects/Port.d.ts +12 -12
  89. package/lib/objects/Port.js +28 -28
  90. package/lib/objects/Svg.d.ts +12 -12
  91. package/lib/objects/Svg.js +93 -93
  92. package/lib/objects/Video.d.ts +14 -14
  93. package/lib/objects/Video.js +113 -113
  94. package/lib/objects/index.d.ts +15 -15
  95. package/lib/objects/index.js +32 -32
  96. package/lib/utils/ObjectUtil.d.ts +408 -408
  97. package/lib/utils/ObjectUtil.js +13 -13
  98. package/lib/utils/index.d.ts +1 -1
  99. package/lib/utils/index.js +13 -13
  100. package/package.json +1 -1
@@ -1,107 +1,107 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- const fabric_1 = require("fabric");
4
- const uuidv4_1 = require("uuidv4");
5
- const Node_1 = require("./Node");
6
- const Link = fabric_1.fabric.util.createClass(fabric_1.fabric.Line, {
7
- type: 'link',
8
- superType: 'link',
9
- initialize(fromNode, fromPort, toNode, toPort, options) {
10
- options = options || {};
11
- const coords = [fromPort.left, fromPort.top, toPort.left, toPort.top];
12
- Object.assign(options, {
13
- strokeWidth: 4,
14
- id: options.id || uuidv4_1.uuid(),
15
- originX: 'center',
16
- originY: 'center',
17
- lockScalingX: true,
18
- lockScalingY: true,
19
- lockRotation: true,
20
- hasRotatingPoint: false,
21
- hasControls: false,
22
- hasBorders: false,
23
- perPixelTargetFind: true,
24
- lockMovementX: true,
25
- lockMovementY: true,
26
- selectable: false,
27
- fromNode,
28
- fromPort,
29
- toNode,
30
- toPort,
31
- hoverCursor: 'pointer',
32
- });
33
- this.callSuper('initialize', coords, options);
34
- },
35
- setPort(fromNode, fromPort, _toNode, toPort) {
36
- if (fromNode.type === 'BroadcastNode') {
37
- fromPort = fromNode.fromPort[0];
38
- }
39
- fromPort.links.push(this);
40
- toPort.links.push(this);
41
- this.setPortEnabled(fromNode, fromPort, false);
42
- },
43
- setPortEnabled(node, port, enabled) {
44
- if (node.descriptor.outPortType !== Node_1.OUT_PORT_TYPE.BROADCAST) {
45
- port.set({
46
- enabled,
47
- fill: enabled ? port.originFill : port.selectFill,
48
- });
49
- }
50
- else {
51
- if (node.toPort.id === port.id) {
52
- return;
53
- }
54
- port.links.forEach((link, index) => {
55
- link.set({
56
- fromPort: port,
57
- fromPortIndex: index,
58
- });
59
- });
60
- node.set({
61
- configuration: {
62
- outputCount: port.links.length,
63
- },
64
- });
65
- }
66
- },
67
- toObject() {
68
- return fabric_1.fabric.util.object.extend(this.callSuper('toObject'), {
69
- id: this.get('id'),
70
- name: this.get('name'),
71
- superType: this.get('superType'),
72
- configuration: this.get('configuration'),
73
- fromNode: this.get('fromNode'),
74
- fromPort: this.get('fromPort'),
75
- toNode: this.get('toNode'),
76
- toPort: this.get('toPort'),
77
- });
78
- },
79
- _render(ctx) {
80
- this.callSuper('_render', ctx);
81
- ctx.save();
82
- const xDiff = this.x2 - this.x1;
83
- const yDiff = this.y2 - this.y1;
84
- const angle = Math.atan2(yDiff, xDiff);
85
- ctx.translate((this.x2 - this.x1) / 2, (this.y2 - this.y1) / 2);
86
- ctx.rotate(angle);
87
- ctx.beginPath();
88
- if (this.arrow) {
89
- // Move 5px in front of line to start the arrow so it does not have the square line end showing in front (0,0)
90
- ctx.moveTo(5, 0);
91
- ctx.lineTo(-5, 5);
92
- ctx.lineTo(-5, -5);
93
- }
94
- ctx.closePath();
95
- ctx.lineWidth = this.strokeWidth;
96
- ctx.fillStyle = this.stroke;
97
- ctx.fill();
98
- ctx.restore();
99
- },
100
- });
101
- Link.fromObject = (options, callback) => {
102
- const { fromNode, fromPort, toNode, toPort } = options;
103
- return callback(new Link(fromNode, fromPort, toNode, toPort, options));
104
- };
105
- // @ts-ignore
106
- window.fabric.Link = Link;
107
- exports.default = Link;
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const fabric_1 = require("fabric");
4
+ const uuidv4_1 = require("uuidv4");
5
+ const Node_1 = require("./Node");
6
+ const Link = fabric_1.fabric.util.createClass(fabric_1.fabric.Line, {
7
+ type: 'link',
8
+ superType: 'link',
9
+ initialize(fromNode, fromPort, toNode, toPort, options) {
10
+ options = options || {};
11
+ const coords = [fromPort.left, fromPort.top, toPort.left, toPort.top];
12
+ Object.assign(options, {
13
+ strokeWidth: 4,
14
+ id: options.id || uuidv4_1.uuid(),
15
+ originX: 'center',
16
+ originY: 'center',
17
+ lockScalingX: true,
18
+ lockScalingY: true,
19
+ lockRotation: true,
20
+ hasRotatingPoint: false,
21
+ hasControls: false,
22
+ hasBorders: false,
23
+ perPixelTargetFind: true,
24
+ lockMovementX: true,
25
+ lockMovementY: true,
26
+ selectable: false,
27
+ fromNode,
28
+ fromPort,
29
+ toNode,
30
+ toPort,
31
+ hoverCursor: 'pointer',
32
+ });
33
+ this.callSuper('initialize', coords, options);
34
+ },
35
+ setPort(fromNode, fromPort, _toNode, toPort) {
36
+ if (fromNode.type === 'BroadcastNode') {
37
+ fromPort = fromNode.fromPort[0];
38
+ }
39
+ fromPort.links.push(this);
40
+ toPort.links.push(this);
41
+ this.setPortEnabled(fromNode, fromPort, false);
42
+ },
43
+ setPortEnabled(node, port, enabled) {
44
+ if (node.descriptor.outPortType !== Node_1.OUT_PORT_TYPE.BROADCAST) {
45
+ port.set({
46
+ enabled,
47
+ fill: enabled ? port.originFill : port.selectFill,
48
+ });
49
+ }
50
+ else {
51
+ if (node.toPort.id === port.id) {
52
+ return;
53
+ }
54
+ port.links.forEach((link, index) => {
55
+ link.set({
56
+ fromPort: port,
57
+ fromPortIndex: index,
58
+ });
59
+ });
60
+ node.set({
61
+ configuration: {
62
+ outputCount: port.links.length,
63
+ },
64
+ });
65
+ }
66
+ },
67
+ toObject() {
68
+ return fabric_1.fabric.util.object.extend(this.callSuper('toObject'), {
69
+ id: this.get('id'),
70
+ name: this.get('name'),
71
+ superType: this.get('superType'),
72
+ configuration: this.get('configuration'),
73
+ fromNode: this.get('fromNode'),
74
+ fromPort: this.get('fromPort'),
75
+ toNode: this.get('toNode'),
76
+ toPort: this.get('toPort'),
77
+ });
78
+ },
79
+ _render(ctx) {
80
+ this.callSuper('_render', ctx);
81
+ ctx.save();
82
+ const xDiff = this.x2 - this.x1;
83
+ const yDiff = this.y2 - this.y1;
84
+ const angle = Math.atan2(yDiff, xDiff);
85
+ ctx.translate((this.x2 - this.x1) / 2, (this.y2 - this.y1) / 2);
86
+ ctx.rotate(angle);
87
+ ctx.beginPath();
88
+ if (this.arrow) {
89
+ // Move 5px in front of line to start the arrow so it does not have the square line end showing in front (0,0)
90
+ ctx.moveTo(5, 0);
91
+ ctx.lineTo(-5, 5);
92
+ ctx.lineTo(-5, -5);
93
+ }
94
+ ctx.closePath();
95
+ ctx.lineWidth = this.strokeWidth;
96
+ ctx.fillStyle = this.stroke;
97
+ ctx.fill();
98
+ ctx.restore();
99
+ },
100
+ });
101
+ Link.fromObject = (options, callback) => {
102
+ const { fromNode, fromPort, toNode, toPort } = options;
103
+ return callback(new Link(fromNode, fromPort, toNode, toPort, options));
104
+ };
105
+ // @ts-ignore
106
+ window.fabric.Link = Link;
107
+ exports.default = Link;
@@ -1,59 +1,59 @@
1
- import { fabric } from 'fabric';
2
- import { FabricObject } from '../utils';
3
- import { PortObject } from './Port';
4
- export declare const NODE_COLORS: {
5
- TRIGGER: {
6
- fill: string;
7
- border: string;
8
- };
9
- LOGIC: {
10
- fill: string;
11
- border: string;
12
- };
13
- DATA: {
14
- fill: string;
15
- border: string;
16
- };
17
- ACTION: {
18
- fill: string;
19
- border: string;
20
- };
21
- };
22
- export declare const OUT_PORT_TYPE: {
23
- SINGLE: string;
24
- STATIC: string;
25
- DYNAMIC: string;
26
- BROADCAST: string;
27
- NONE: string;
28
- };
29
- export declare const DESCRIPTIONS: {
30
- script: string;
31
- template: string;
32
- json: string;
33
- cron: string;
34
- };
35
- export declare const getEllipsis: (text: string, length: number) => string;
36
- export declare type NodeType = 'TRIGGER' | 'LOGIC' | 'DATA' | 'ACTION';
37
- export interface NodeObject extends FabricObject<fabric.Group> {
38
- errorFlag?: fabric.IText;
39
- label?: fabric.Text;
40
- toPort?: PortObject;
41
- errors?: any;
42
- fromPort?: PortObject[];
43
- descriptor?: Record<string, any>;
44
- nodeClazz?: string;
45
- configuration?: Record<string, any>;
46
- defaultPortOption?: () => Partial<PortObject>;
47
- toPortOption?: () => Partial<PortObject>;
48
- fromPortOption?: () => Partial<PortObject>;
49
- createToPort?: (left: number, top: number) => PortObject;
50
- createFromPort?: (left: number, top: number) => PortObject[];
51
- singlePort?: (portOption: Partial<PortObject>) => PortObject[];
52
- staticPort?: (portOption: Partial<PortObject>) => PortObject[];
53
- dynamicPort?: (portOption: Partial<PortObject>) => PortObject[];
54
- broadcastPort?: (portOption: Partial<PortObject>) => PortObject[];
55
- setErrors?: (errors: any) => void;
56
- duplicate?: () => NodeObject;
57
- }
58
- declare const Node: any;
59
- export default Node;
1
+ import { fabric } from 'fabric';
2
+ import { FabricObject } from '../utils';
3
+ import { PortObject } from './Port';
4
+ export declare const NODE_COLORS: {
5
+ TRIGGER: {
6
+ fill: string;
7
+ border: string;
8
+ };
9
+ LOGIC: {
10
+ fill: string;
11
+ border: string;
12
+ };
13
+ DATA: {
14
+ fill: string;
15
+ border: string;
16
+ };
17
+ ACTION: {
18
+ fill: string;
19
+ border: string;
20
+ };
21
+ };
22
+ export declare const OUT_PORT_TYPE: {
23
+ SINGLE: string;
24
+ STATIC: string;
25
+ DYNAMIC: string;
26
+ BROADCAST: string;
27
+ NONE: string;
28
+ };
29
+ export declare const DESCRIPTIONS: {
30
+ script: string;
31
+ template: string;
32
+ json: string;
33
+ cron: string;
34
+ };
35
+ export declare const getEllipsis: (text: string, length: number) => string;
36
+ export declare type NodeType = 'TRIGGER' | 'LOGIC' | 'DATA' | 'ACTION';
37
+ export interface NodeObject extends FabricObject<fabric.Group> {
38
+ errorFlag?: fabric.IText;
39
+ label?: fabric.Text;
40
+ toPort?: PortObject;
41
+ errors?: any;
42
+ fromPort?: PortObject[];
43
+ descriptor?: Record<string, any>;
44
+ nodeClazz?: string;
45
+ configuration?: Record<string, any>;
46
+ defaultPortOption?: () => Partial<PortObject>;
47
+ toPortOption?: () => Partial<PortObject>;
48
+ fromPortOption?: () => Partial<PortObject>;
49
+ createToPort?: (left: number, top: number) => PortObject;
50
+ createFromPort?: (left: number, top: number) => PortObject[];
51
+ singlePort?: (portOption: Partial<PortObject>) => PortObject[];
52
+ staticPort?: (portOption: Partial<PortObject>) => PortObject[];
53
+ dynamicPort?: (portOption: Partial<PortObject>) => PortObject[];
54
+ broadcastPort?: (portOption: Partial<PortObject>) => PortObject[];
55
+ setErrors?: (errors: any) => void;
56
+ duplicate?: () => NodeObject;
57
+ }
58
+ declare const Node: any;
59
+ export default Node;