@knotx/plugins-connection-line 0.0.8 → 0.2.1

package/dist/index.cjs

@@ -76,17 +76,17 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _destroy_dec, _init_dec, _createNodesAndEdges_dec, _createEdges_dec, _createEdge_dec, _createNodeAndEdge_dec, _containerRender_dec, _registerNewNodeCreator_dec, _registerValidator_dec, _options_dec, _getConnectHandleAttributes_dec, _selectedNodeIds_dec, _canInteract_dec, _endInteraction_dec, _startInteraction_dec, _dispatchEdgeOperation_dec, _dispatchNodeOperation_dec, _getNode_dec, _a, _init;
-const DEFAULT_OPTIONS = {
+var _destroy_dec, _init_dec, _createNodesAndEdges_dec, _createEdges_dec, _createEdge_dec, _createNodeAndEdge_dec, _containerRender_dec, _registerNewNodeCreator_dec, _registerValidator_dec, _config_dec, _getConnectHandleAttributes_dec, _selectedNodeIds_dec, _canInteract_dec, _endInteraction_dec, _startInteraction_dec, _dispatchEdgeOperation_dec, _dispatchNodeOperation_dec, _getNode_dec, _a, _init;
+const DEFAULT_CONFIG = {
   allowCreateNodeOnBlankArea: true,
   newNodeType: "default",
   edgeType: "bezier",
   connectionLineClassName: "knotx-connection-line",
   allowMultiDrag: true
 };
-class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.inject.getNode()], _dispatchNodeOperation_dec = [decorators.inject.dispatchNodeOperation()], _dispatchEdgeOperation_dec = [decorators.inject.dispatchEdgeOperation()], _startInteraction_dec = [decorators.inject.startInteraction()], _endInteraction_dec = [decorators.inject.endInteraction()], _canInteract_dec = [decorators.inject.canInteract()], _selectedNodeIds_dec = [decorators.inject("selection", "selectedNodeIds")], _getConnectHandleAttributes_dec = [decorators.register("getConnectHandleAttributes")], _options_dec = [decorators.register("options")], _registerValidator_dec = [decorators.register("registerValidator")], _registerNewNodeCreator_dec = [decorators.register("registerNewNodeCreator")], _containerRender_dec = [decorators.layer(core.Layer.Nodes, 10)], _createNodeAndEdge_dec = [decorators.edgeOperator()], _createEdge_dec = [decorators.edgeOperator()], _createEdges_dec = [decorators.edgeOperator()], _createNodesAndEdges_dec = [decorators.edgeOperator()], _init_dec = [decorators.OnInit], _destroy_dec = [decorators.OnDestroy], _a) {
-  constructor(options = {}) {
-    super();
+class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.inject.getNode()], _dispatchNodeOperation_dec = [decorators.inject.dispatchNodeOperation()], _dispatchEdgeOperation_dec = [decorators.inject.dispatchEdgeOperation()], _startInteraction_dec = [decorators.inject.startInteraction()], _endInteraction_dec = [decorators.inject.endInteraction()], _canInteract_dec = [decorators.inject.canInteract()], _selectedNodeIds_dec = [decorators.inject("selection", "selectedNodeIds")], _getConnectHandleAttributes_dec = [decorators.register("getConnectHandleAttributes")], _config_dec = [decorators.register("config")], _registerValidator_dec = [decorators.register("registerValidator")], _registerNewNodeCreator_dec = [decorators.register("registerNewNodeCreator")], _containerRender_dec = [decorators.layer(core.Layer.Nodes, 10)], _createNodeAndEdge_dec = [decorators.edgeOperator()], _createEdge_dec = [decorators.edgeOperator()], _createEdges_dec = [decorators.edgeOperator()], _createNodesAndEdges_dec = [decorators.edgeOperator()], _init_dec = [decorators.OnInit], _destroy_dec = [decorators.OnDestroy], _a) {
+  constructor() {
+    super(...arguments);
     __runInitializers(_init, 5, this);
     __publicField(this, "name", "connectionLine");
     __publicField(this, "getNode", __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
@@ -126,7 +126,7 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
     __publicField(this, "validators$", new rxjs.BehaviorSubject([]));
     // 新节点创建器列表
     __publicField(this, "creators$", new rxjs.BehaviorSubject([]));
-    __publicField(this, "options", __runInitializers(_init, 40, this, DEFAULT_OPTIONS)), __runInitializers(_init, 43, this);
+    __publicField(this, "config", __runInitializers(_init, 40, this, DEFAULT_CONFIG)), __runInitializers(_init, 43, this);
     __publicField(this, "registerValidator", __runInitializers(_init, 44, this, (validator) => {
       const validators = this.validators$.value;
       validators.push(validator);
@@ -153,7 +153,6 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
         }
       };
     })), __runInitializers(_init, 51, this);
-    this.options = lodashEs.merge(DEFAULT_OPTIONS, options);
   }
   containerRender() {
     const size = this.getContainerSize();
@@ -213,7 +212,7 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
    * 根据当前拖拽的节点和选中的节点决定
    */
   getSourceNodeIdsForDrag(currentNodeId) {
-    if (!this.options.allowMultiDrag || !this.selectedNodeIds.includes(currentNodeId)) {
+    if (!this.config.allowMultiDrag || !this.selectedNodeIds.includes(currentNodeId)) {
       return [currentNodeId];
     }
     return [...this.selectedNodeIds];
@@ -223,7 +222,7 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
    */
   createConnectionLine(sourceNodeId, startPosition) {
     const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-    svg.setAttribute("class", `${this.options.connectionLineClassName || "knotx-connection-line"} line-${sourceNodeId}`);
+    svg.setAttribute("class", `${this.config.connectionLineClassName || "knotx-connection-line"} line-${sourceNodeId}`);
     svg.style.position = "absolute";
     svg.style.top = "0";
     svg.style.left = "0";
@@ -296,7 +295,7 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
     const newNodeId = core.generateId();
     const newNode = {
       id: newNodeId,
-      type: this.options.newNodeType,
+      type: this.config.newNodeType,
       position,
       data: {}
     };
@@ -304,7 +303,7 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
       id: core.generateId(),
       source: sourceNodeId,
       target: newNodeId,
-      type: this.options.edgeType
+      type: this.config.edgeType
     }));
     const createResult = this.creators$.value.reduce((result, creator) => {
       var _a2;
@@ -332,7 +331,7 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
         id: core.generateId(),
         source: sourceNodeId,
         target: targetNodeId,
-        type: this.options.edgeType
+        type: this.config.edgeType
       }
     }];
   }
@@ -348,7 +347,7 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
           id: core.generateId(),
           source: sourceNodeId,
           target: targetNodeId,
-          type: this.options.edgeType
+          type: this.config.edgeType
         }
       }))
     }];
@@ -359,7 +358,8 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
     }
     return this.createNodeAndEdge(sourceNodeIds, position);
   }
-  init() {
+  init(config) {
+    this.config = lodashEs.merge(DEFAULT_CONFIG, config);
     this.dragInteractable = interact__default(`.${this.classNames.source}[data-plugin-id="${this.pluginId}"]`).draggable({
       inertia: false,
       autoScroll: true,
@@ -446,12 +446,12 @@ class ConnectionLine extends (_a = core.BasePlugin, _getNode_dec = [decorators.i
         event.target.classList.remove(this.classNames.active);
       }
     });
-    if (this.options.allowCreateNodeOnBlankArea) {
+    if (this.config.allowCreateNodeOnBlankArea) {
       this.blankAreaDropInteractable = interact__default(`.${core.bem("canvas", "wrapper")}`).dropzone({
         ondrop: (event) => {
           const element = event.target;
           const isNode = !!element.closest(`[data-node-id]`);
-          if (!isNode && this.connectionLines.size > 0 && this.options.allowCreateNodeOnBlankArea) {
+          if (!isNode && this.connectionLines.size > 0 && this.config.allowCreateNodeOnBlankArea) {
             const sourceNodeIds = Array.from(this.connectionLines.keys());
             const firstLine = this.connectionLines.values().next().value;
             if (firstLine) {
@@ -487,7 +487,7 @@ __decorateElement(_init, 5, "endInteraction", _endInteraction_dec, ConnectionLin
 __decorateElement(_init, 5, "canInteract", _canInteract_dec, ConnectionLine);
 __decorateElement(_init, 5, "selectedNodeIds", _selectedNodeIds_dec, ConnectionLine);
 __decorateElement(_init, 5, "getConnectHandleAttributes", _getConnectHandleAttributes_dec, ConnectionLine);
-__decorateElement(_init, 5, "options", _options_dec, ConnectionLine);
+__decorateElement(_init, 5, "config", _config_dec, ConnectionLine);
 __decorateElement(_init, 5, "registerValidator", _registerValidator_dec, ConnectionLine);
 __decorateElement(_init, 5, "registerNewNodeCreator", _registerNewNodeCreator_dec, ConnectionLine);
 __decoratorMetadata(_init, ConnectionLine);

package/dist/index.d.cts

@@ -1,6 +1,6 @@
 import { NodeData, EdgeData, BasePlugin, NodeOperation, EdgeOperation, InteractionPriority } from '@knotx/core';
 
-interface ConnectionLineOptions {
+interface ConnectionLineConfig {
     /**
      * 是否允许连接到画布空白处并创建新节点
      * @default false
@@ -38,7 +38,7 @@ type ConnectionValidator = (context: ConnectionValidateContext) => boolean;
 declare module '@knotx/core' {
     interface PluginData {
         connectionLine: {
-            options: ConnectionLineOptions;
+            config: ConnectionLineConfig;
             registerValidator: (validator: ConnectionValidator) => () => void;
             registerNewNodeCreator: (creator: (sourceNodeIds: string[], node: NodeData, edges: EdgeData[]) => ({
                 node: NodeData;
@@ -59,7 +59,7 @@ declare module '@knotx/core' {
  * 连接线插件
  * 允许从指定DOM元素拖拽出连接线，连接到其他节点
  */
-declare class ConnectionLine extends BasePlugin<'connectionLine'> {
+declare class ConnectionLine extends BasePlugin<'connectionLine', ConnectionLineConfig> {
     name: "connectionLine";
     getNode: (id: string) => NodeData | undefined;
     dispatchNodeOperation: (operation: NodeOperation) => void;
@@ -85,8 +85,7 @@ declare class ConnectionLine extends BasePlugin<'connectionLine'> {
     private blankAreaDropInteractable?;
     private validators$;
     private creators$;
-    constructor(options?: ConnectionLineOptions);
-    options: ConnectionLineOptions;
+    private config;
     registerValidator: (validator: ConnectionValidator) => () => void;
     registerNewNodeCreator: (creator: (sourceNodeIds: string[], node: NodeData, edges: EdgeData[]) => ({
         node: NodeData;
@@ -145,8 +144,8 @@ declare class ConnectionLine extends BasePlugin<'connectionLine'> {
         x: number;
         y: number;
     }): EdgeOperation[];
-    init(): void;
+    init(config: ConnectionLineConfig): void;
     destroy(): void;
 }
 
-export { ConnectionLine, type ConnectionLineOptions, type ConnectionValidateContext, type ConnectionValidator };
+export { ConnectionLine, type ConnectionLineConfig, type ConnectionValidateContext, type ConnectionValidator };

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import { NodeData, EdgeData, BasePlugin, NodeOperation, EdgeOperation, InteractionPriority } from '@knotx/core';
 
-interface ConnectionLineOptions {
+interface ConnectionLineConfig {
     /**
      * 是否允许连接到画布空白处并创建新节点
      * @default false
@@ -38,7 +38,7 @@ type ConnectionValidator = (context: ConnectionValidateContext) => boolean;
 declare module '@knotx/core' {
     interface PluginData {
         connectionLine: {
-            options: ConnectionLineOptions;
+            config: ConnectionLineConfig;
             registerValidator: (validator: ConnectionValidator) => () => void;
             registerNewNodeCreator: (creator: (sourceNodeIds: string[], node: NodeData, edges: EdgeData[]) => ({
                 node: NodeData;
@@ -59,7 +59,7 @@ declare module '@knotx/core' {
  * 连接线插件
  * 允许从指定DOM元素拖拽出连接线，连接到其他节点
  */
-declare class ConnectionLine extends BasePlugin<'connectionLine'> {
+declare class ConnectionLine extends BasePlugin<'connectionLine', ConnectionLineConfig> {
     name: "connectionLine";
     getNode: (id: string) => NodeData | undefined;
     dispatchNodeOperation: (operation: NodeOperation) => void;
@@ -85,8 +85,7 @@ declare class ConnectionLine extends BasePlugin<'connectionLine'> {
     private blankAreaDropInteractable?;
     private validators$;
     private creators$;
-    constructor(options?: ConnectionLineOptions);
-    options: ConnectionLineOptions;
+    private config;
     registerValidator: (validator: ConnectionValidator) => () => void;
     registerNewNodeCreator: (creator: (sourceNodeIds: string[], node: NodeData, edges: EdgeData[]) => ({
         node: NodeData;
@@ -145,8 +144,8 @@ declare class ConnectionLine extends BasePlugin<'connectionLine'> {
         x: number;
         y: number;
     }): EdgeOperation[];
-    init(): void;
+    init(config: ConnectionLineConfig): void;
     destroy(): void;
 }
 
-export { ConnectionLine, type ConnectionLineOptions, type ConnectionValidateContext, type ConnectionValidator };
+export { ConnectionLine, type ConnectionLineConfig, type ConnectionValidateContext, type ConnectionValidator };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { NodeData, EdgeData, BasePlugin, NodeOperation, EdgeOperation, InteractionPriority } from '@knotx/core';
 
-interface ConnectionLineOptions {
+interface ConnectionLineConfig {
     /**
      * 是否允许连接到画布空白处并创建新节点
      * @default false
@@ -38,7 +38,7 @@ type ConnectionValidator = (context: ConnectionValidateContext) => boolean;
 declare module '@knotx/core' {
     interface PluginData {
         connectionLine: {
-            options: ConnectionLineOptions;
+            config: ConnectionLineConfig;
             registerValidator: (validator: ConnectionValidator) => () => void;
             registerNewNodeCreator: (creator: (sourceNodeIds: string[], node: NodeData, edges: EdgeData[]) => ({
                 node: NodeData;
@@ -59,7 +59,7 @@ declare module '@knotx/core' {
  * 连接线插件
  * 允许从指定DOM元素拖拽出连接线，连接到其他节点
  */
-declare class ConnectionLine extends BasePlugin<'connectionLine'> {
+declare class ConnectionLine extends BasePlugin<'connectionLine', ConnectionLineConfig> {
     name: "connectionLine";
     getNode: (id: string) => NodeData | undefined;
     dispatchNodeOperation: (operation: NodeOperation) => void;
@@ -85,8 +85,7 @@ declare class ConnectionLine extends BasePlugin<'connectionLine'> {
     private blankAreaDropInteractable?;
     private validators$;
     private creators$;
-    constructor(options?: ConnectionLineOptions);
-    options: ConnectionLineOptions;
+    private config;
     registerValidator: (validator: ConnectionValidator) => () => void;
     registerNewNodeCreator: (creator: (sourceNodeIds: string[], node: NodeData, edges: EdgeData[]) => ({
         node: NodeData;
@@ -145,8 +144,8 @@ declare class ConnectionLine extends BasePlugin<'connectionLine'> {
         x: number;
         y: number;
     }): EdgeOperation[];
-    init(): void;
+    init(config: ConnectionLineConfig): void;
     destroy(): void;
 }
 
-export { ConnectionLine, type ConnectionLineOptions, type ConnectionValidateContext, type ConnectionValidator };
+export { ConnectionLine, type ConnectionLineConfig, type ConnectionValidateContext, type ConnectionValidator };

package/dist/index.mjs

@@ -70,17 +70,17 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _destroy_dec, _init_dec, _createNodesAndEdges_dec, _createEdges_dec, _createEdge_dec, _createNodeAndEdge_dec, _containerRender_dec, _registerNewNodeCreator_dec, _registerValidator_dec, _options_dec, _getConnectHandleAttributes_dec, _selectedNodeIds_dec, _canInteract_dec, _endInteraction_dec, _startInteraction_dec, _dispatchEdgeOperation_dec, _dispatchNodeOperation_dec, _getNode_dec, _a, _init;
-const DEFAULT_OPTIONS = {
+var _destroy_dec, _init_dec, _createNodesAndEdges_dec, _createEdges_dec, _createEdge_dec, _createNodeAndEdge_dec, _containerRender_dec, _registerNewNodeCreator_dec, _registerValidator_dec, _config_dec, _getConnectHandleAttributes_dec, _selectedNodeIds_dec, _canInteract_dec, _endInteraction_dec, _startInteraction_dec, _dispatchEdgeOperation_dec, _dispatchNodeOperation_dec, _getNode_dec, _a, _init;
+const DEFAULT_CONFIG = {
   allowCreateNodeOnBlankArea: true,
   newNodeType: "default",
   edgeType: "bezier",
   connectionLineClassName: "knotx-connection-line",
   allowMultiDrag: true
 };
-class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()], _dispatchNodeOperation_dec = [inject.dispatchNodeOperation()], _dispatchEdgeOperation_dec = [inject.dispatchEdgeOperation()], _startInteraction_dec = [inject.startInteraction()], _endInteraction_dec = [inject.endInteraction()], _canInteract_dec = [inject.canInteract()], _selectedNodeIds_dec = [inject("selection", "selectedNodeIds")], _getConnectHandleAttributes_dec = [register("getConnectHandleAttributes")], _options_dec = [register("options")], _registerValidator_dec = [register("registerValidator")], _registerNewNodeCreator_dec = [register("registerNewNodeCreator")], _containerRender_dec = [layer(Layer.Nodes, 10)], _createNodeAndEdge_dec = [edgeOperator()], _createEdge_dec = [edgeOperator()], _createEdges_dec = [edgeOperator()], _createNodesAndEdges_dec = [edgeOperator()], _init_dec = [OnInit], _destroy_dec = [OnDestroy], _a) {
-  constructor(options = {}) {
-    super();
+class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()], _dispatchNodeOperation_dec = [inject.dispatchNodeOperation()], _dispatchEdgeOperation_dec = [inject.dispatchEdgeOperation()], _startInteraction_dec = [inject.startInteraction()], _endInteraction_dec = [inject.endInteraction()], _canInteract_dec = [inject.canInteract()], _selectedNodeIds_dec = [inject("selection", "selectedNodeIds")], _getConnectHandleAttributes_dec = [register("getConnectHandleAttributes")], _config_dec = [register("config")], _registerValidator_dec = [register("registerValidator")], _registerNewNodeCreator_dec = [register("registerNewNodeCreator")], _containerRender_dec = [layer(Layer.Nodes, 10)], _createNodeAndEdge_dec = [edgeOperator()], _createEdge_dec = [edgeOperator()], _createEdges_dec = [edgeOperator()], _createNodesAndEdges_dec = [edgeOperator()], _init_dec = [OnInit], _destroy_dec = [OnDestroy], _a) {
+  constructor() {
+    super(...arguments);
     __runInitializers(_init, 5, this);
     __publicField(this, "name", "connectionLine");
     __publicField(this, "getNode", __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
@@ -120,7 +120,7 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
     __publicField(this, "validators$", new BehaviorSubject([]));
     // 新节点创建器列表
     __publicField(this, "creators$", new BehaviorSubject([]));
-    __publicField(this, "options", __runInitializers(_init, 40, this, DEFAULT_OPTIONS)), __runInitializers(_init, 43, this);
+    __publicField(this, "config", __runInitializers(_init, 40, this, DEFAULT_CONFIG)), __runInitializers(_init, 43, this);
     __publicField(this, "registerValidator", __runInitializers(_init, 44, this, (validator) => {
       const validators = this.validators$.value;
       validators.push(validator);
@@ -147,7 +147,6 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
         }
       };
     })), __runInitializers(_init, 51, this);
-    this.options = merge(DEFAULT_OPTIONS, options);
   }
   containerRender() {
     const size = this.getContainerSize();
@@ -207,7 +206,7 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
    * 根据当前拖拽的节点和选中的节点决定
    */
   getSourceNodeIdsForDrag(currentNodeId) {
-    if (!this.options.allowMultiDrag || !this.selectedNodeIds.includes(currentNodeId)) {
+    if (!this.config.allowMultiDrag || !this.selectedNodeIds.includes(currentNodeId)) {
       return [currentNodeId];
     }
     return [...this.selectedNodeIds];
@@ -217,7 +216,7 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
    */
   createConnectionLine(sourceNodeId, startPosition) {
     const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-    svg.setAttribute("class", `${this.options.connectionLineClassName || "knotx-connection-line"} line-${sourceNodeId}`);
+    svg.setAttribute("class", `${this.config.connectionLineClassName || "knotx-connection-line"} line-${sourceNodeId}`);
     svg.style.position = "absolute";
     svg.style.top = "0";
     svg.style.left = "0";
@@ -290,7 +289,7 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
     const newNodeId = generateId();
     const newNode = {
       id: newNodeId,
-      type: this.options.newNodeType,
+      type: this.config.newNodeType,
       position,
       data: {}
     };
@@ -298,7 +297,7 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
       id: generateId(),
       source: sourceNodeId,
       target: newNodeId,
-      type: this.options.edgeType
+      type: this.config.edgeType
     }));
     const createResult = this.creators$.value.reduce((result, creator) => {
       var _a2;
@@ -326,7 +325,7 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
         id: generateId(),
         source: sourceNodeId,
         target: targetNodeId,
-        type: this.options.edgeType
+        type: this.config.edgeType
       }
     }];
   }
@@ -342,7 +341,7 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
           id: generateId(),
           source: sourceNodeId,
           target: targetNodeId,
-          type: this.options.edgeType
+          type: this.config.edgeType
         }
       }))
     }];
@@ -353,7 +352,8 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
     }
     return this.createNodeAndEdge(sourceNodeIds, position);
   }
-  init() {
+  init(config) {
+    this.config = merge(DEFAULT_CONFIG, config);
     this.dragInteractable = interact(`.${this.classNames.source}[data-plugin-id="${this.pluginId}"]`).draggable({
       inertia: false,
       autoScroll: true,
@@ -440,12 +440,12 @@ class ConnectionLine extends (_a = BasePlugin, _getNode_dec = [inject.getNode()]
         event.target.classList.remove(this.classNames.active);
       }
     });
-    if (this.options.allowCreateNodeOnBlankArea) {
+    if (this.config.allowCreateNodeOnBlankArea) {
       this.blankAreaDropInteractable = interact(`.${bem("canvas", "wrapper")}`).dropzone({
         ondrop: (event) => {
           const element = event.target;
           const isNode = !!element.closest(`[data-node-id]`);
-          if (!isNode && this.connectionLines.size > 0 && this.options.allowCreateNodeOnBlankArea) {
+          if (!isNode && this.connectionLines.size > 0 && this.config.allowCreateNodeOnBlankArea) {
             const sourceNodeIds = Array.from(this.connectionLines.keys());
             const firstLine = this.connectionLines.values().next().value;
             if (firstLine) {
@@ -481,7 +481,7 @@ __decorateElement(_init, 5, "endInteraction", _endInteraction_dec, ConnectionLin
 __decorateElement(_init, 5, "canInteract", _canInteract_dec, ConnectionLine);
 __decorateElement(_init, 5, "selectedNodeIds", _selectedNodeIds_dec, ConnectionLine);
 __decorateElement(_init, 5, "getConnectHandleAttributes", _getConnectHandleAttributes_dec, ConnectionLine);
-__decorateElement(_init, 5, "options", _options_dec, ConnectionLine);
+__decorateElement(_init, 5, "config", _config_dec, ConnectionLine);
 __decorateElement(_init, 5, "registerValidator", _registerValidator_dec, ConnectionLine);
 __decorateElement(_init, 5, "registerNewNodeCreator", _registerNewNodeCreator_dec, ConnectionLine);
 __decoratorMetadata(_init, ConnectionLine);

package/package.json

@@ -1,7 +1,6 @@
 {
   "name": "@knotx/plugins-connection-line",
-  "type": "module",
-  "version": "0.0.8",
+  "version": "0.2.1",
   "description": "Connectionline Plugin for Knotx",
   "author": "boenfu",
   "license": "MIT",
@@ -34,13 +33,14 @@
     "@interactjs/modifiers": "^1.10.27",
     "@interactjs/types": "^1.10.27",
     "interactjs": "^1.10.27",
-    "@knotx/plugins-selection": "0.0.8"
+    "@knotx/jsx": "0.2.1",
+    "@knotx/plugins-selection": "0.2.1"
   },
   "dependencies": {
     "lodash-es": "^4.17.21",
     "rxjs": "^7.8.1",
-    "@knotx/core": "0.0.6",
-    "@knotx/decorators": "0.0.6"
+    "@knotx/core": "0.2.1",
+    "@knotx/decorators": "0.2.1"
   },
   "devDependencies": {
     "@interactjs/actions": "^1.10.27",
@@ -49,11 +49,11 @@
     "@interactjs/types": "^1.10.27",
     "@types/lodash-es": "^4.17.12",
     "interactjs": "^1.10.27",
-    "@knotx/build-config": "0.0.6",
-    "@knotx/eslint-config": "0.0.6",
-    "@knotx/jsx": "0.0.6",
-    "@knotx/plugins-selection": "0.0.8",
-    "@knotx/typescript-config": "0.0.6"
+    "@knotx/build-config": "0.2.1",
+    "@knotx/eslint-config": "0.2.1",
+    "@knotx/jsx": "0.2.1",
+    "@knotx/plugins-selection": "0.2.1",
+    "@knotx/typescript-config": "0.2.1"
   },
   "scripts": {
     "build": "unbuild --failOnWarn=false",