sequential-workflow-designer 0.30.4 → 0.31.0

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 (6) hide show
  1. package/README.md +4 -4
  2. package/dist/index.umd.js +16 -11
  3. package/lib/cjs/index.cjs +16 -11
  4. package/lib/esm/index.js +16 -11
  5. package/lib/index.d.ts +4 -4
  6. package/package.json +1 -1
package/README.md CHANGED
@@ -106,10 +106,10 @@ Add the below code to your head section in HTML document.
106
106
  ```html
107
107
  <head>
108
108
  ...
109
- <link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.30.4/css/designer.css" rel="stylesheet">
110
- <link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.30.4/css/designer-light.css" rel="stylesheet">
111
- <link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.30.4/css/designer-dark.css" rel="stylesheet">
112
- <script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.30.4/dist/index.umd.js"></script>
109
+ <link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.31.0/css/designer.css" rel="stylesheet">
110
+ <link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.31.0/css/designer-light.css" rel="stylesheet">
111
+ <link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.31.0/css/designer-dark.css" rel="stylesheet">
112
+ <script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.31.0/dist/index.umd.js"></script>
113
113
  ```
114
114
 
115
115
  Call the designer by:
package/dist/index.umd.js CHANGED
@@ -1524,7 +1524,6 @@
1524
1524
  })(exports.ClickCommandType || (exports.ClickCommandType = {}));
1525
1525
  exports.PlaceholderDirection = void 0;
1526
1526
  (function (PlaceholderDirection) {
1527
- PlaceholderDirection[PlaceholderDirection["gap"] = 0] = "gap";
1528
1527
  PlaceholderDirection[PlaceholderDirection["in"] = 1] = "in";
1529
1528
  PlaceholderDirection[PlaceholderDirection["out"] = 2] = "out";
1530
1529
  })(exports.PlaceholderDirection || (exports.PlaceholderDirection = {}));
@@ -2302,7 +2301,7 @@
2302
2301
  }
2303
2302
 
2304
2303
  class RectPlaceholderView {
2305
- static create(parent, width, height, radius, iconSize, direction) {
2304
+ static create(parent, width, height, radius, iconD, iconSize) {
2306
2305
  const g = Dom.svg('g', {
2307
2306
  visibility: 'hidden',
2308
2307
  class: 'sqd-placeholder'
@@ -2316,8 +2315,7 @@
2316
2315
  ry: radius
2317
2316
  });
2318
2317
  g.appendChild(rect);
2319
- if (direction) {
2320
- const iconD = direction === exports.PlaceholderDirection.in ? Icons.folderIn : Icons.folderOut;
2318
+ if (iconD) {
2321
2319
  const icon = Icons.appendPath(g, 'sqd-placeholder-icon-path', iconD, iconSize);
2322
2320
  Dom.translate(icon, (width - iconSize) / 2, (height - iconSize) / 2);
2323
2321
  }
@@ -2339,9 +2337,9 @@
2339
2337
  }
2340
2338
 
2341
2339
  class RectPlaceholder {
2342
- static create(parent, size, direction, sequence, index, radius, iconSize) {
2343
- const view = RectPlaceholderView.create(parent, size.x, size.y, radius, iconSize, direction);
2344
- return new RectPlaceholder(view, sequence, index);
2340
+ static create(parent, size, parentSequence, index, radius, iconD, iconSize) {
2341
+ const view = RectPlaceholderView.create(parent, size.x, size.y, radius, iconD, iconSize);
2342
+ return new RectPlaceholder(view, parentSequence, index);
2345
2343
  }
2346
2344
  constructor(view, parentSequence, index) {
2347
2345
  this.view = view;
@@ -2487,18 +2485,25 @@
2487
2485
  }
2488
2486
  constructor(configuration) {
2489
2487
  this.configuration = configuration;
2490
- this.alongGapSize = new Vector(defaultConfiguration$2.gapWidth, defaultConfiguration$2.gapHeight);
2491
- this.perpendicularGapSize = new Vector(defaultConfiguration$2.gapHeight, defaultConfiguration$2.gapWidth);
2488
+ this.alongGapSize = new Vector(this.configuration.gapWidth, this.configuration.gapHeight);
2489
+ this.perpendicularGapSize = new Vector(this.configuration.gapHeight, this.configuration.gapWidth);
2492
2490
  }
2493
2491
  getGapSize(orientation) {
2494
2492
  return orientation === exports.PlaceholderGapOrientation.perpendicular ? this.perpendicularGapSize : this.alongGapSize;
2495
2493
  }
2496
2494
  createForGap(parent, parentSequence, index, orientation) {
2497
2495
  const gapSize = this.getGapSize(orientation);
2498
- return RectPlaceholder.create(parent, gapSize, exports.PlaceholderDirection.gap, parentSequence, index, this.configuration.radius, this.configuration.iconSize);
2496
+ return RectPlaceholder.create(parent, gapSize, parentSequence, index, this.configuration.radius, this.configuration.iconD, this.configuration.iconSize);
2499
2497
  }
2500
2498
  createForArea(parent, size, direction, parentSequence, index) {
2501
- return RectPlaceholder.create(parent, size, direction, parentSequence, index, this.configuration.radius, this.configuration.iconSize);
2499
+ let iconD;
2500
+ if (direction === exports.PlaceholderDirection.in) {
2501
+ iconD = Icons.folderIn;
2502
+ }
2503
+ else if (direction === exports.PlaceholderDirection.out) {
2504
+ iconD = Icons.folderOut;
2505
+ }
2506
+ return RectPlaceholder.create(parent, size, parentSequence, index, this.configuration.radius, iconD, this.configuration.iconSize);
2502
2507
  }
2503
2508
  }
2504
2509
 
package/lib/cjs/index.cjs CHANGED
@@ -1339,7 +1339,6 @@ exports.ClickCommandType = void 0;
1339
1339
  })(exports.ClickCommandType || (exports.ClickCommandType = {}));
1340
1340
  exports.PlaceholderDirection = void 0;
1341
1341
  (function (PlaceholderDirection) {
1342
- PlaceholderDirection[PlaceholderDirection["gap"] = 0] = "gap";
1343
1342
  PlaceholderDirection[PlaceholderDirection["in"] = 1] = "in";
1344
1343
  PlaceholderDirection[PlaceholderDirection["out"] = 2] = "out";
1345
1344
  })(exports.PlaceholderDirection || (exports.PlaceholderDirection = {}));
@@ -2117,7 +2116,7 @@ class PlaceholderController {
2117
2116
  }
2118
2117
 
2119
2118
  class RectPlaceholderView {
2120
- static create(parent, width, height, radius, iconSize, direction) {
2119
+ static create(parent, width, height, radius, iconD, iconSize) {
2121
2120
  const g = Dom.svg('g', {
2122
2121
  visibility: 'hidden',
2123
2122
  class: 'sqd-placeholder'
@@ -2131,8 +2130,7 @@ class RectPlaceholderView {
2131
2130
  ry: radius
2132
2131
  });
2133
2132
  g.appendChild(rect);
2134
- if (direction) {
2135
- const iconD = direction === exports.PlaceholderDirection.in ? Icons.folderIn : Icons.folderOut;
2133
+ if (iconD) {
2136
2134
  const icon = Icons.appendPath(g, 'sqd-placeholder-icon-path', iconD, iconSize);
2137
2135
  Dom.translate(icon, (width - iconSize) / 2, (height - iconSize) / 2);
2138
2136
  }
@@ -2154,9 +2152,9 @@ class RectPlaceholderView {
2154
2152
  }
2155
2153
 
2156
2154
  class RectPlaceholder {
2157
- static create(parent, size, direction, sequence, index, radius, iconSize) {
2158
- const view = RectPlaceholderView.create(parent, size.x, size.y, radius, iconSize, direction);
2159
- return new RectPlaceholder(view, sequence, index);
2155
+ static create(parent, size, parentSequence, index, radius, iconD, iconSize) {
2156
+ const view = RectPlaceholderView.create(parent, size.x, size.y, radius, iconD, iconSize);
2157
+ return new RectPlaceholder(view, parentSequence, index);
2160
2158
  }
2161
2159
  constructor(view, parentSequence, index) {
2162
2160
  this.view = view;
@@ -2302,18 +2300,25 @@ class RectPlaceholderExtension {
2302
2300
  }
2303
2301
  constructor(configuration) {
2304
2302
  this.configuration = configuration;
2305
- this.alongGapSize = new Vector(defaultConfiguration$2.gapWidth, defaultConfiguration$2.gapHeight);
2306
- this.perpendicularGapSize = new Vector(defaultConfiguration$2.gapHeight, defaultConfiguration$2.gapWidth);
2303
+ this.alongGapSize = new Vector(this.configuration.gapWidth, this.configuration.gapHeight);
2304
+ this.perpendicularGapSize = new Vector(this.configuration.gapHeight, this.configuration.gapWidth);
2307
2305
  }
2308
2306
  getGapSize(orientation) {
2309
2307
  return orientation === exports.PlaceholderGapOrientation.perpendicular ? this.perpendicularGapSize : this.alongGapSize;
2310
2308
  }
2311
2309
  createForGap(parent, parentSequence, index, orientation) {
2312
2310
  const gapSize = this.getGapSize(orientation);
2313
- return RectPlaceholder.create(parent, gapSize, exports.PlaceholderDirection.gap, parentSequence, index, this.configuration.radius, this.configuration.iconSize);
2311
+ return RectPlaceholder.create(parent, gapSize, parentSequence, index, this.configuration.radius, this.configuration.iconD, this.configuration.iconSize);
2314
2312
  }
2315
2313
  createForArea(parent, size, direction, parentSequence, index) {
2316
- return RectPlaceholder.create(parent, size, direction, parentSequence, index, this.configuration.radius, this.configuration.iconSize);
2314
+ let iconD;
2315
+ if (direction === exports.PlaceholderDirection.in) {
2316
+ iconD = Icons.folderIn;
2317
+ }
2318
+ else if (direction === exports.PlaceholderDirection.out) {
2319
+ iconD = Icons.folderOut;
2320
+ }
2321
+ return RectPlaceholder.create(parent, size, parentSequence, index, this.configuration.radius, iconD, this.configuration.iconSize);
2317
2322
  }
2318
2323
  }
2319
2324
 
package/lib/esm/index.js CHANGED
@@ -1338,7 +1338,6 @@ var ClickCommandType;
1338
1338
  })(ClickCommandType || (ClickCommandType = {}));
1339
1339
  var PlaceholderDirection;
1340
1340
  (function (PlaceholderDirection) {
1341
- PlaceholderDirection[PlaceholderDirection["gap"] = 0] = "gap";
1342
1341
  PlaceholderDirection[PlaceholderDirection["in"] = 1] = "in";
1343
1342
  PlaceholderDirection[PlaceholderDirection["out"] = 2] = "out";
1344
1343
  })(PlaceholderDirection || (PlaceholderDirection = {}));
@@ -2116,7 +2115,7 @@ class PlaceholderController {
2116
2115
  }
2117
2116
 
2118
2117
  class RectPlaceholderView {
2119
- static create(parent, width, height, radius, iconSize, direction) {
2118
+ static create(parent, width, height, radius, iconD, iconSize) {
2120
2119
  const g = Dom.svg('g', {
2121
2120
  visibility: 'hidden',
2122
2121
  class: 'sqd-placeholder'
@@ -2130,8 +2129,7 @@ class RectPlaceholderView {
2130
2129
  ry: radius
2131
2130
  });
2132
2131
  g.appendChild(rect);
2133
- if (direction) {
2134
- const iconD = direction === PlaceholderDirection.in ? Icons.folderIn : Icons.folderOut;
2132
+ if (iconD) {
2135
2133
  const icon = Icons.appendPath(g, 'sqd-placeholder-icon-path', iconD, iconSize);
2136
2134
  Dom.translate(icon, (width - iconSize) / 2, (height - iconSize) / 2);
2137
2135
  }
@@ -2153,9 +2151,9 @@ class RectPlaceholderView {
2153
2151
  }
2154
2152
 
2155
2153
  class RectPlaceholder {
2156
- static create(parent, size, direction, sequence, index, radius, iconSize) {
2157
- const view = RectPlaceholderView.create(parent, size.x, size.y, radius, iconSize, direction);
2158
- return new RectPlaceholder(view, sequence, index);
2154
+ static create(parent, size, parentSequence, index, radius, iconD, iconSize) {
2155
+ const view = RectPlaceholderView.create(parent, size.x, size.y, radius, iconD, iconSize);
2156
+ return new RectPlaceholder(view, parentSequence, index);
2159
2157
  }
2160
2158
  constructor(view, parentSequence, index) {
2161
2159
  this.view = view;
@@ -2301,18 +2299,25 @@ class RectPlaceholderExtension {
2301
2299
  }
2302
2300
  constructor(configuration) {
2303
2301
  this.configuration = configuration;
2304
- this.alongGapSize = new Vector(defaultConfiguration$2.gapWidth, defaultConfiguration$2.gapHeight);
2305
- this.perpendicularGapSize = new Vector(defaultConfiguration$2.gapHeight, defaultConfiguration$2.gapWidth);
2302
+ this.alongGapSize = new Vector(this.configuration.gapWidth, this.configuration.gapHeight);
2303
+ this.perpendicularGapSize = new Vector(this.configuration.gapHeight, this.configuration.gapWidth);
2306
2304
  }
2307
2305
  getGapSize(orientation) {
2308
2306
  return orientation === PlaceholderGapOrientation.perpendicular ? this.perpendicularGapSize : this.alongGapSize;
2309
2307
  }
2310
2308
  createForGap(parent, parentSequence, index, orientation) {
2311
2309
  const gapSize = this.getGapSize(orientation);
2312
- return RectPlaceholder.create(parent, gapSize, PlaceholderDirection.gap, parentSequence, index, this.configuration.radius, this.configuration.iconSize);
2310
+ return RectPlaceholder.create(parent, gapSize, parentSequence, index, this.configuration.radius, this.configuration.iconD, this.configuration.iconSize);
2313
2311
  }
2314
2312
  createForArea(parent, size, direction, parentSequence, index) {
2315
- return RectPlaceholder.create(parent, size, direction, parentSequence, index, this.configuration.radius, this.configuration.iconSize);
2313
+ let iconD;
2314
+ if (direction === PlaceholderDirection.in) {
2315
+ iconD = Icons.folderIn;
2316
+ }
2317
+ else if (direction === PlaceholderDirection.out) {
2318
+ iconD = Icons.folderOut;
2319
+ }
2320
+ return RectPlaceholder.create(parent, size, parentSequence, index, this.configuration.radius, iconD, this.configuration.iconSize);
2316
2321
  }
2317
2322
  }
2318
2323
 
package/lib/index.d.ts CHANGED
@@ -250,7 +250,6 @@ interface Placeholder {
250
250
  resolveClick(click: ClickDetails): ClickCommand | null;
251
251
  }
252
252
  declare enum PlaceholderDirection {
253
- gap = 0,
254
253
  in = 1,
255
254
  out = 2
256
255
  }
@@ -783,7 +782,7 @@ declare class DefaultViewportControllerExtension implements ViewportControllerEx
783
782
  declare class RectPlaceholderView implements PlaceholderView {
784
783
  readonly rect: SVGElement;
785
784
  readonly g: SVGGElement;
786
- static create(parent: SVGElement, width: number, height: number, radius: number, iconSize: number, direction: PlaceholderDirection): RectPlaceholderView;
785
+ static create(parent: SVGElement, width: number, height: number, radius: number, iconD: string | undefined, iconSize: number): RectPlaceholderView;
787
786
  private constructor();
788
787
  setIsHover(isHover: boolean): void;
789
788
  setIsVisible(isVisible: boolean): void;
@@ -793,7 +792,7 @@ declare class RectPlaceholder implements Placeholder {
793
792
  readonly view: RectPlaceholderView;
794
793
  readonly parentSequence: Sequence;
795
794
  readonly index: number;
796
- static create(parent: SVGElement, size: Vector, direction: PlaceholderDirection, sequence: Sequence, index: number, radius: number, iconSize: number): RectPlaceholder;
795
+ static create(parent: SVGElement, size: Vector, parentSequence: Sequence, index: number, radius: number, iconD: string | undefined, iconSize: number): RectPlaceholder;
797
796
  constructor(view: RectPlaceholderView, parentSequence: Sequence, index: number);
798
797
  getClientRect(): DOMRect;
799
798
  setIsHover(isHover: boolean): void;
@@ -805,6 +804,7 @@ interface RectPlaceholderConfiguration {
805
804
  gapWidth: number;
806
805
  gapHeight: number;
807
806
  radius: number;
807
+ iconD?: string;
808
808
  iconSize: number;
809
809
  }
810
810
 
@@ -953,7 +953,7 @@ declare enum PlaceholderGapOrientation {
953
953
  interface PlaceholderExtension {
954
954
  getGapSize(orientation: PlaceholderGapOrientation): Vector;
955
955
  createForGap(parentElement: SVGElement, sequence: Sequence, index: number, orientation: PlaceholderGapOrientation): Placeholder;
956
- createForArea(parentElement: SVGElement, size: Vector, direction: PlaceholderDirection, sequence: Sequence, index: number): Placeholder;
956
+ createForArea(parentElement: SVGElement, size: Vector, direction: PlaceholderDirection | null, sequence: Sequence, index: number): Placeholder;
957
957
  }
958
958
  interface ViewportControllerExtension {
959
959
  create(api: WorkspaceApi): ViewportController;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "sequential-workflow-designer",
3
3
  "description": "Customizable no-code component for building flow-based programming applications.",
4
- "version": "0.30.4",
4
+ "version": "0.31.0",
5
5
  "type": "module",
6
6
  "main": "./lib/esm/index.js",
7
7
  "types": "./lib/index.d.ts",