@operato/flow 9.0.0 → 9.0.2

package/dist/src/nodes/iterator.js

@@ -0,0 +1,29 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export class Iterator extends FlowNodeAbstract {
+    get type() {
+        return 'iterator';
+    }
+    get size() {
+        return this.model.size || { w: 200, h: 500 };
+    }
+    renderNode() {
+        const { w, h } = this.size;
+        return svg `
+      <rect class="node-outline" x="${-w / 2}" y="${-h / 2}" width="${w}" height="${h}" 
+            fill="#f3f3f3" stroke="#000" stroke-dasharray="5,5" stroke-width="1.5" />
+
+      <text x="${-w / 2 + 10}" y="${-h / 2 + 15}" font-size="12" fill="#333">🔁</text>
+
+      <text class="node-label" x="0" y="5" text-anchor="middle" font-weight="bold">${this.label}</text>
+    `;
+    }
+    get anchorModels() {
+        const { h } = this.size;
+        return [
+            { id: 'in', type: 'in', pos: { x: 0, y: -(h !== null && h !== void 0 ? h : 500) / 2 }, angle: 270 },
+            { id: 'out', type: 'out', pos: { x: 0, y: (h !== null && h !== void 0 ? h : 500) / 2 }, angle: 90 }
+        ].map(anchorModel => this.applyAnchorsOption(anchorModel));
+    }
+}
+//# sourceMappingURL=iterator.js.map

package/dist/src/nodes/iterator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"iterator.js","sourceRoot":"","sources":["../../../src/nodes/iterator.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,KAAK,CAAA;AAE5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAEhE,MAAM,OAAO,QAAS,SAAQ,gBAAgB;IAC5C,IAAI,IAAI;QACN,OAAO,UAAU,CAAA;IACnB,CAAC;IAED,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,KAAM,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAA;IAC/C,CAAC;IAED,UAAU;QACR,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAE1B,OAAO,GAAG,CAAA;sCACwB,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,YAAY,CAAC,aAAa,CAAC;;;iBAGpE,CAAC,CAAC,GAAG,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC,GAAG,CAAC,GAAG,EAAE;;qFAEsC,IAAI,CAAC,KAAK;KAC1F,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,MAAM,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAEvB,OAAO;YACL,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,aAAD,CAAC,cAAD,CAAC,GAAI,GAAG,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE;YACvE,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,aAAD,CAAC,cAAD,CAAC,GAAI,GAAG,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE;SACxE,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,WAA0B,CAAC,CAAC,CAAA;IAC3E,CAAC;CACF","sourcesContent":["import { svg, SVGTemplateResult } from 'lit'\nimport { AnchorModel } from '../types.js'\nimport { FlowNodeAbstract } from '../base/flow-node-abstract.js'\n\nexport class Iterator extends FlowNodeAbstract {\n  get type() {\n    return 'iterator'\n  }\n\n  get size(): { w: number; h: number } {\n    return this.model!.size || { w: 200, h: 500 }\n  }\n\n  renderNode(): SVGTemplateResult {\n    const { w, h } = this.size\n\n    return svg`\n      <rect class=\"node-outline\" x=\"${-w / 2}\" y=\"${-h / 2}\" width=\"${w}\" height=\"${h}\" \n            fill=\"#f3f3f3\" stroke=\"#000\" stroke-dasharray=\"5,5\" stroke-width=\"1.5\" />\n\n      <text x=\"${-w / 2 + 10}\" y=\"${-h / 2 + 15}\" font-size=\"12\" fill=\"#333\">🔁</text>\n\n      <text class=\"node-label\" x=\"0\" y=\"5\" text-anchor=\"middle\" font-weight=\"bold\">${this.label}</text>\n    `\n  }\n\n  get anchorModels(): AnchorModel[] {\n    const { h } = this.size\n\n    return [\n      { id: 'in', type: 'in', pos: { x: 0, y: -(h ?? 500) / 2 }, angle: 270 },\n      { id: 'out', type: 'out', pos: { x: 0, y: (h ?? 500) / 2 }, angle: 90 }\n    ].map(anchorModel => this.applyAnchorsOption(anchorModel as AnchorModel))\n  }\n}\n"]}

package/dist/src/nodes/select.d.ts

@@ -0,0 +1,17 @@
+import { SVGTemplateResult } from 'lit';
+import { AnchorModel, FlowDataSchema } from '../types.js';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+import { PropertySpec } from '@operato/property-editor';
+export declare class Select extends FlowNodeAbstract {
+    get type(): string;
+    get optionsSpec(): PropertySpec[];
+    get inputSchema(): FlowDataSchema;
+    get outputSchema(): FlowDataSchema;
+    get size(): {
+        w: number;
+        h: number;
+    };
+    renderNode(): SVGTemplateResult;
+    /** 기본 앵커 포인트 (input 1개, output 3개) */
+    get anchorModels(): AnchorModel[];
+}

package/dist/src/nodes/select.js

@@ -0,0 +1,71 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+const MINWIDTH = 160;
+const ANCHOR_SPACING = 80;
+const HEIGHT = 40;
+export class Select extends FlowNodeAbstract {
+    get type() {
+        return 'select';
+    }
+    get optionsSpec() {
+        return [
+            {
+                type: 'number',
+                name: 'outputCount',
+                label: 'output-count'
+            }
+        ];
+    }
+    get inputSchema() {
+        return {
+            type: 'object',
+            properties: {
+                selectionKey: { type: 'string' }
+            },
+            required: ['selectionKey']
+        };
+    }
+    get outputSchema() {
+        return {
+            type: 'object',
+            properties: {
+                selectionKey: { type: 'string' }
+            },
+            required: ['selectionKey']
+        };
+    }
+    get size() {
+        const { outputCount } = this.options || { outputCount: 3 };
+        return { w: Math.max(MINWIDTH, outputCount * ANCHOR_SPACING), h: HEIGHT };
+    }
+    renderNode() {
+        const { w, h } = this.size;
+        return svg `
+      <rect class="node-outline" x="${-w / 2}" y="${-h / 2}" width="${w}" height="${h}" fill="#e2e3e5" stroke="#000" stroke-width="1" />
+
+      <text class="node-label" x="0" y="5" text-anchor="middle">${this.label}</text>
+    `;
+    }
+    /** 기본 앵커 포인트 (input 1개, output 3개) */
+    get anchorModels() {
+        const { outputCount } = this.options || { outputCount: 3 };
+        const { w, h } = this.size;
+        const anchors = [{ id: 'in', type: 'in', pos: { x: 0, y: -h / 2 } }];
+        const anchorSpacing = w / outputCount;
+        const startOffsetX = (-(outputCount - 1) * anchorSpacing) / 2;
+        for (let i = 0; i < outputCount; i++) {
+            anchors.push({
+                id: `out-${i + 1}`,
+                type: 'out',
+                pos: {
+                    x: startOffsetX + i * anchorSpacing,
+                    y: h / 2
+                },
+                label: `case ${i + 1}`,
+                weight: outputCount - i
+            });
+        }
+        return anchors;
+    }
+}
+//# sourceMappingURL=select.js.map

package/dist/src/nodes/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/nodes/select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,KAAK,CAAA;AAE5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAGhE,MAAM,QAAQ,GAAG,GAAG,CAAA;AACpB,MAAM,cAAc,GAAG,EAAE,CAAA;AACzB,MAAM,MAAM,GAAG,EAAE,CAAA;AACjB,MAAM,OAAO,MAAO,SAAQ,gBAAgB;IAC1C,IAAI,IAAI;QACN,OAAO,QAAQ,CAAA;IACjB,CAAC;IAED,IAAI,WAAW;QACb,OAAO;YACL;gBACE,IAAI,EAAE,QAAQ;gBACd,IAAI,EAAE,aAAa;gBACnB,KAAK,EAAE,cAAc;aACtB;SACF,CAAA;IACH,CAAC;IAED,IAAI,WAAW;QACb,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,YAAY,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;aACjC;YACD,QAAQ,EAAE,CAAC,cAAc,CAAC;SAC3B,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,YAAY,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;aACjC;YACD,QAAQ,EAAE,CAAC,cAAc,CAAC;SAC3B,CAAA;IACH,CAAC;IAED,IAAI,IAAI;QACN,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,OAAO,IAAI,EAAE,WAAW,EAAE,CAAC,EAAE,CAAA;QAC1D,OAAO,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,WAAW,GAAG,cAAc,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,CAAA;IAC3E,CAAC;IAED,UAAU;QACR,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAE1B,OAAO,GAAG,CAAA;sCACwB,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,YAAY,CAAC,aAAa,CAAC;;kEAEnB,IAAI,CAAC,KAAK;KACvE,CAAA;IACH,CAAC;IAED,sCAAsC;IACtC,IAAI,YAAY;QACd,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,OAAO,IAAI,EAAE,WAAW,EAAE,CAAC,EAAE,CAAA;QAC1D,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAE1B,MAAM,OAAO,GAAkB,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAA;QAEnF,MAAM,aAAa,GAAG,CAAC,GAAG,WAAW,CAAA;QACrC,MAAM,YAAY,GAAG,CAAC,CAAC,CAAC,WAAW,GAAG,CAAC,CAAC,GAAG,aAAa,CAAC,GAAG,CAAC,CAAA;QAE7D,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,WAAW,EAAE,CAAC,EAAE,EAAE,CAAC;YACrC,OAAO,CAAC,IAAI,CAAC;gBACX,EAAE,EAAE,OAAO,CAAC,GAAG,CAAC,EAAE;gBAClB,IAAI,EAAE,KAAK;gBACX,GAAG,EAAE;oBACH,CAAC,EAAE,YAAY,GAAG,CAAC,GAAG,aAAa;oBACnC,CAAC,EAAE,CAAC,GAAG,CAAC;iBACT;gBACD,KAAK,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE;gBACtB,MAAM,EAAE,WAAW,GAAG,CAAC;aACxB,CAAC,CAAA;QACJ,CAAC;QAED,OAAO,OAAO,CAAA;IAChB,CAAC;CACF","sourcesContent":["import { svg, SVGTemplateResult } from 'lit'\nimport { AnchorModel, FlowDataSchema } from '../types.js'\nimport { FlowNodeAbstract } from '../base/flow-node-abstract.js'\nimport { PropertySpec } from '@operato/property-editor'\n\nconst MINWIDTH = 160\nconst ANCHOR_SPACING = 80\nconst HEIGHT = 40\nexport class Select extends FlowNodeAbstract {\n  get type() {\n    return 'select'\n  }\n\n  get optionsSpec(): PropertySpec[] {\n    return [\n      {\n        type: 'number',\n        name: 'outputCount',\n        label: 'output-count'\n      }\n    ]\n  }\n\n  get inputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        selectionKey: { type: 'string' }\n      },\n      required: ['selectionKey']\n    }\n  }\n\n  get outputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        selectionKey: { type: 'string' }\n      },\n      required: ['selectionKey']\n    }\n  }\n\n  get size(): { w: number; h: number } {\n    const { outputCount } = this.options || { outputCount: 3 }\n    return { w: Math.max(MINWIDTH, outputCount * ANCHOR_SPACING), h: HEIGHT }\n  }\n\n  renderNode(): SVGTemplateResult {\n    const { w, h } = this.size\n\n    return svg`\n      <rect class=\"node-outline\" x=\"${-w / 2}\" y=\"${-h / 2}\" width=\"${w}\" height=\"${h}\" fill=\"#e2e3e5\" stroke=\"#000\" stroke-width=\"1\" />\n\n      <text class=\"node-label\" x=\"0\" y=\"5\" text-anchor=\"middle\">${this.label}</text>\n    `\n  }\n\n  /** 기본 앵커 포인트 (input 1개, output 3개) */\n  get anchorModels(): AnchorModel[] {\n    const { outputCount } = this.options || { outputCount: 3 }\n    const { w, h } = this.size\n\n    const anchors: AnchorModel[] = [{ id: 'in', type: 'in', pos: { x: 0, y: -h / 2 } }]\n\n    const anchorSpacing = w / outputCount\n    const startOffsetX = (-(outputCount - 1) * anchorSpacing) / 2\n\n    for (let i = 0; i < outputCount; i++) {\n      anchors.push({\n        id: `out-${i + 1}`,\n        type: 'out',\n        pos: {\n          x: startOffsetX + i * anchorSpacing,\n          y: h / 2\n        },\n        label: `case ${i + 1}`,\n        weight: outputCount - i\n      })\n    }\n\n    return anchors\n  }\n}\n"]}

package/dist/src/nodes/start-event.d.ts

@@ -0,0 +1,15 @@
+import { SVGTemplateResult } from 'lit';
+import { AnchorModel, FlowDataSchema } from '../types.js';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export declare class StartEvent extends FlowNodeAbstract {
+    get type(): string;
+    get inputSchema(): FlowDataSchema;
+    get dataSourceSchema(): FlowDataSchema;
+    get outputSchema(): FlowDataSchema;
+    get size(): {
+        w: number;
+        h: number;
+    };
+    renderNode(): SVGTemplateResult;
+    get anchorModels(): AnchorModel[];
+}

package/dist/src/nodes/start-event.js

@@ -0,0 +1,46 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export class StartEvent extends FlowNodeAbstract {
+    get type() {
+        return 'start';
+    }
+    get inputSchema() {
+        return {
+            type: 'object',
+            properties: {}
+        };
+    }
+    get dataSourceSchema() {
+        return {
+            type: 'object',
+            properties: {
+                payload: { type: 'object', properties: {} }
+            },
+            required: ['payload']
+        };
+    }
+    get outputSchema() {
+        return {
+            type: 'object',
+            properties: {
+                payload: { type: 'object', properties: {} }
+            },
+            required: ['payload']
+        };
+    }
+    get size() {
+        return this.model.size || { w: 48, h: 48 };
+    }
+    renderNode() {
+        const { w, h } = this.size;
+        const r = Math.min(w, h) / 2 - 1;
+        return svg `
+      <circle class="node-outline" cx="0" cy="0" r="${r}" fill="#d4edda" stroke="#000" stroke-width="1" />
+      <text class="node-label" x="0" y="5" text-anchor="middle">${this.label}</text>
+    `;
+    }
+    get anchorModels() {
+        return [{ id: 'out', type: 'out', pos: { x: 0, y: 24 }, angle: 90 }].map(anchorModel => this.applyAnchorsOption(anchorModel));
+    }
+}
+//# sourceMappingURL=start-event.js.map

package/dist/src/nodes/start-event.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"start-event.js","sourceRoot":"","sources":["../../../src/nodes/start-event.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,KAAK,CAAA;AAE5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAEhE,MAAM,OAAO,UAAW,SAAQ,gBAAgB;IAC9C,IAAI,IAAI;QACN,OAAO,OAAO,CAAA;IAChB,CAAC;IAED,IAAI,WAAW;QACb,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE,EAAE;SACf,CAAA;IACH,CAAC;IAED,IAAI,gBAAgB;QAClB,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,EAAE;aAC5C;YACD,QAAQ,EAAE,CAAC,SAAS,CAAC;SACtB,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,EAAE;aAC5C;YACD,QAAQ,EAAE,CAAC,SAAS,CAAC;SACtB,CAAA;IACH,CAAC;IAED,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,KAAM,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAA;IAC7C,CAAC;IAED,UAAU;QACR,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAC1B,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;QAEhC,OAAO,GAAG,CAAA;sDACwC,CAAC;kEACW,IAAI,CAAC,KAAK;KACvE,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,OAAO,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CACrF,IAAI,CAAC,kBAAkB,CAAC,WAA0B,CAAC,CACpD,CAAA;IACH,CAAC;CACF","sourcesContent":["import { svg, SVGTemplateResult } from 'lit'\nimport { AnchorModel, FlowDataSchema } from '../types.js'\nimport { FlowNodeAbstract } from '../base/flow-node-abstract.js'\n\nexport class StartEvent extends FlowNodeAbstract {\n  get type() {\n    return 'start'\n  }\n\n  get inputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {}\n    }\n  }\n\n  get dataSourceSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        payload: { type: 'object', properties: {} }\n      },\n      required: ['payload']\n    }\n  }\n\n  get outputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        payload: { type: 'object', properties: {} }\n      },\n      required: ['payload']\n    }\n  }\n\n  get size(): { w: number; h: number } {\n    return this.model!.size || { w: 48, h: 48 }\n  }\n\n  renderNode(): SVGTemplateResult {\n    const { w, h } = this.size\n    const r = Math.min(w, h) / 2 - 1\n\n    return svg`\n      <circle class=\"node-outline\" cx=\"0\" cy=\"0\" r=\"${r}\" fill=\"#d4edda\" stroke=\"#000\" stroke-width=\"1\" />\n      <text class=\"node-label\" x=\"0\" y=\"5\" text-anchor=\"middle\">${this.label}</text>\n    `\n  }\n\n  get anchorModels(): AnchorModel[] {\n    return [{ id: 'out', type: 'out', pos: { x: 0, y: 24 }, angle: 90 }].map(anchorModel =>\n      this.applyAnchorsOption(anchorModel as AnchorModel)\n    )\n  }\n}\n"]}

package/dist/src/nodes/subflow.d.ts

@@ -0,0 +1,12 @@
+import { SVGTemplateResult } from 'lit';
+import { AnchorModel } from '../types.js';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export declare class Subflow extends FlowNodeAbstract {
+    get type(): string;
+    get size(): {
+        w: number;
+        h: number;
+    };
+    renderNode(): SVGTemplateResult;
+    get anchorModels(): AnchorModel[];
+}

package/dist/src/nodes/subflow.js

@@ -0,0 +1,30 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export class Subflow extends FlowNodeAbstract {
+    get type() {
+        return 'subflow';
+    }
+    get size() {
+        return this.model.size || { w: 120, h: 60 };
+    }
+    renderNode() {
+        const { w, h } = this.size;
+        const x = -w / 2;
+        const y = -h / 2;
+        const gap = h * 0.2;
+        return svg `
+      <rect class="node-outline" x="${x}" y="${y}" width="${w}" height="${h}" fill="#e2e3f3" stroke-width="1" stroke="#666"/>
+      <rect class="node-inner" x="${x + gap / 2}" y="${y + gap / 2}" width="${w - gap}" height="${h - gap}" fill="#d6e0f5" stroke-width="1" stroke="#000"/>
+
+      <text class="node-label" x="0" y="-5" text-anchor="middle">${this.label}</text>
+    `;
+    }
+    get anchorModels() {
+        const { w, h } = this.size;
+        return [
+            { id: 'in', type: 'in', pos: { x: 0, y: -h / 2 }, angle: 270 },
+            { id: 'out', type: 'out', pos: { x: 0, y: h / 2 }, angle: 90 }
+        ].map(anchorModel => this.applyAnchorsOption(anchorModel));
+    }
+}
+//# sourceMappingURL=subflow.js.map

package/dist/src/nodes/subflow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"subflow.js","sourceRoot":"","sources":["../../../src/nodes/subflow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,KAAK,CAAA;AAE5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAEhE,MAAM,OAAO,OAAQ,SAAQ,gBAAgB;IAC3C,IAAI,IAAI;QACN,OAAO,SAAS,CAAA;IAClB,CAAC;IAED,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,KAAM,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAA;IAC9C,CAAC;IAED,UAAU;QACR,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAC1B,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAA;QAChB,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAA;QAChB,MAAM,GAAG,GAAG,CAAC,GAAG,GAAG,CAAA;QAEnB,OAAO,GAAG,CAAA;sCACwB,CAAC,QAAQ,CAAC,YAAY,CAAC,aAAa,CAAC;oCACvC,CAAC,GAAG,GAAG,GAAG,CAAC,QAAQ,CAAC,GAAG,GAAG,GAAG,CAAC,YAAY,CAAC,GAAG,GAAG,aAAa,CAAC,GAAG,GAAG;;mEAEtC,IAAI,CAAC,KAAK;KACxE,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAE1B,OAAO;YACL,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE;YAC9D,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE;SAC/D,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,WAA0B,CAAC,CAAC,CAAA;IAC3E,CAAC;CACF","sourcesContent":["import { svg, SVGTemplateResult } from 'lit'\nimport { AnchorModel } from '../types.js'\nimport { FlowNodeAbstract } from '../base/flow-node-abstract.js'\n\nexport class Subflow extends FlowNodeAbstract {\n  get type() {\n    return 'subflow'\n  }\n\n  get size(): { w: number; h: number } {\n    return this.model!.size || { w: 120, h: 60 }\n  }\n\n  renderNode(): SVGTemplateResult {\n    const { w, h } = this.size\n    const x = -w / 2\n    const y = -h / 2\n    const gap = h * 0.2\n\n    return svg`\n      <rect class=\"node-outline\" x=\"${x}\" y=\"${y}\" width=\"${w}\" height=\"${h}\" fill=\"#e2e3f3\" stroke-width=\"1\" stroke=\"#666\"/>\n      <rect class=\"node-inner\" x=\"${x + gap / 2}\" y=\"${y + gap / 2}\" width=\"${w - gap}\" height=\"${h - gap}\" fill=\"#d6e0f5\" stroke-width=\"1\" stroke=\"#000\"/>\n\n      <text class=\"node-label\" x=\"0\" y=\"-5\" text-anchor=\"middle\">${this.label}</text>\n    `\n  }\n\n  get anchorModels(): AnchorModel[] {\n    const { w, h } = this.size\n\n    return [\n      { id: 'in', type: 'in', pos: { x: 0, y: -h / 2 }, angle: 270 },\n      { id: 'out', type: 'out', pos: { x: 0, y: h / 2 }, angle: 90 }\n    ].map(anchorModel => this.applyAnchorsOption(anchorModel as AnchorModel))\n  }\n}\n"]}

package/dist/src/nodes/task.d.ts

@@ -0,0 +1,17 @@
+import { SVGTemplateResult } from 'lit';
+import { PropertySpec } from '@operato/property-editor';
+import { AnchorModel } from '../types.js';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export declare class Task extends FlowNodeAbstract {
+    private _propertySpecs;
+    get propertySpecs(): PropertySpec[] | null;
+    set propertySpecs(propertySpecs: PropertySpec[] | null);
+    get type(): string;
+    get inputSchema(): import("../types.js").FlowDataSchema;
+    get size(): {
+        w: number;
+        h: number;
+    };
+    renderNode(): SVGTemplateResult;
+    get anchorModels(): AnchorModel[];
+}

package/dist/src/nodes/task.js

@@ -0,0 +1,60 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+import { convertPropertySpecsToSchema } from '../utils/generate-mapping-scheme.js';
+export class Task extends FlowNodeAbstract {
+    constructor() {
+        super(...arguments);
+        this._propertySpecs = [
+            {
+                type: 'string',
+                name: 'message',
+                label: 'message'
+            },
+            {
+                type: 'scenario-step-input',
+                name: 'accessor',
+                label: 'accessor'
+            },
+            {
+                type: 'select',
+                name: 'level',
+                label: 'level',
+                property: {
+                    options: ['info', 'warn', 'error']
+                }
+            }
+        ];
+    }
+    get propertySpecs() {
+        return this._propertySpecs;
+    }
+    set propertySpecs(propertySpecs) {
+        this._propertySpecs = propertySpecs;
+    }
+    get type() {
+        return 'task';
+    }
+    get inputSchema() {
+        return convertPropertySpecsToSchema(this.propertySpecs || []);
+    }
+    get size() {
+        return this.model.size || { w: 120, h: 60 };
+    }
+    renderNode() {
+        const { w, h } = this.size;
+        const x = -w / 2;
+        const y = -h / 2;
+        return svg `
+      <rect class="node-outline" x="${x}" y="${y}" width="${w}" height="${h}" fill="#d1ecf1" stroke-width="1"/>
+      <text class="node-label" x="0" y="5" text-anchor="middle">${this.label}</text>
+    `;
+    }
+    get anchorModels() {
+        const { w, h } = this.size;
+        return [
+            { id: 'in', type: 'in', pos: { x: 0, y: -h / 2 }, angle: 270 },
+            { id: 'out', type: 'out', pos: { x: 0, y: h / 2 }, angle: 90 }
+        ].map(anchorModel => this.applyAnchorsOption(anchorModel));
+    }
+}
+//# sourceMappingURL=task.js.map

package/dist/src/nodes/task.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"task.js","sourceRoot":"","sources":["../../../src/nodes/task.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,KAAK,CAAA;AAK5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAChE,OAAO,EAAE,4BAA4B,EAAE,MAAM,qCAAqC,CAAA;AAElF,MAAM,OAAO,IAAK,SAAQ,gBAAgB;IAA1C;;QACU,mBAAc,GAA0B;YAC9C;gBACE,IAAI,EAAE,QAAQ;gBACd,IAAI,EAAE,SAAS;gBACf,KAAK,EAAE,SAAS;aACjB;YACD;gBACE,IAAI,EAAE,qBAAqB;gBAC3B,IAAI,EAAE,UAAU;gBAChB,KAAK,EAAE,UAAU;aAClB;YACD;gBACE,IAAI,EAAE,QAAQ;gBACd,IAAI,EAAE,OAAO;gBACb,KAAK,EAAE,OAAO;gBACd,QAAQ,EAAE;oBACR,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC;iBACnC;aACF;SACF,CAAA;IAyCH,CAAC;IAvCC,IAAI,aAAa;QACf,OAAO,IAAI,CAAC,cAAc,CAAA;IAC5B,CAAC;IAED,IAAI,aAAa,CAAC,aAAoC;QACpD,IAAI,CAAC,cAAc,GAAG,aAAa,CAAA;IACrC,CAAC;IAED,IAAI,IAAI;QACN,OAAO,MAAM,CAAA;IACf,CAAC;IAED,IAAI,WAAW;QACb,OAAO,4BAA4B,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAA;IAC/D,CAAC;IAED,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,KAAM,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAA;IAC9C,CAAC;IAED,UAAU;QACR,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAC1B,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAA;QAChB,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAA;QAEhB,OAAO,GAAG,CAAA;sCACwB,CAAC,QAAQ,CAAC,YAAY,CAAC,aAAa,CAAC;kEACT,IAAI,CAAC,KAAK;KACvE,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAA;QAE1B,OAAO;YACL,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE;YAC9D,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE;SAC/D,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,WAA0B,CAAC,CAAC,CAAA;IAC3E,CAAC;CACF","sourcesContent":["import { svg, SVGTemplateResult } from 'lit'\n\nimport { PropertySpec } from '@operato/property-editor'\n\nimport { AnchorModel } from '../types.js'\nimport { FlowNodeAbstract } from '../base/flow-node-abstract.js'\nimport { convertPropertySpecsToSchema } from '../utils/generate-mapping-scheme.js'\n\nexport class Task extends FlowNodeAbstract {\n  private _propertySpecs: PropertySpec[] | null = [\n    {\n      type: 'string',\n      name: 'message',\n      label: 'message'\n    },\n    {\n      type: 'scenario-step-input',\n      name: 'accessor',\n      label: 'accessor'\n    },\n    {\n      type: 'select',\n      name: 'level',\n      label: 'level',\n      property: {\n        options: ['info', 'warn', 'error']\n      }\n    }\n  ]\n\n  get propertySpecs(): PropertySpec[] | null {\n    return this._propertySpecs\n  }\n\n  set propertySpecs(propertySpecs: PropertySpec[] | null) {\n    this._propertySpecs = propertySpecs\n  }\n\n  get type() {\n    return 'task'\n  }\n\n  get inputSchema() {\n    return convertPropertySpecsToSchema(this.propertySpecs || [])\n  }\n\n  get size(): { w: number; h: number } {\n    return this.model!.size || { w: 120, h: 60 }\n  }\n\n  renderNode(): SVGTemplateResult {\n    const { w, h } = this.size\n    const x = -w / 2\n    const y = -h / 2\n\n    return svg`\n      <rect class=\"node-outline\" x=\"${x}\" y=\"${y}\" width=\"${w}\" height=\"${h}\" fill=\"#d1ecf1\" stroke-width=\"1\"/>\n      <text class=\"node-label\" x=\"0\" y=\"5\" text-anchor=\"middle\">${this.label}</text>\n    `\n  }\n\n  get anchorModels(): AnchorModel[] {\n    const { w, h } = this.size\n\n    return [\n      { id: 'in', type: 'in', pos: { x: 0, y: -h / 2 }, angle: 270 },\n      { id: 'out', type: 'out', pos: { x: 0, y: h / 2 }, angle: 90 }\n    ].map(anchorModel => this.applyAnchorsOption(anchorModel as AnchorModel))\n  }\n}\n"]}

package/dist/src/ox-flow-editor.d.ts

@@ -0,0 +1,94 @@
+import '@material/web/icon/icon.js';
+import './components/flow-sidebar.js';
+import './components/flow-toolbar.js';
+import './components/flow-side-panel.js';
+import { LitElement, PropertyValues } from 'lit';
+import { FlowNodeImplementation, FlowNode, FlowEdge, FlowNodeModel, FlowEdgeModel, FlowEntity } from './types.js';
+import { FlowContextType } from './context/flow-context.js';
+export declare class OxFlowEditor extends LitElement {
+    static styles: import("lit").CSSResult[];
+    static getUniqueId(): string;
+    availableNodeTypes: {
+        [type: string]: FlowNodeImplementation;
+    };
+    model: {
+        nodes: FlowNodeModel[];
+        edges: FlowEdgeModel[];
+    };
+    private mode;
+    private logs;
+    private edgeGuide;
+    private flowExecutor?;
+    private _nodes;
+    private _edges;
+    private _selected;
+    private pointerEventHandler;
+    private keydownEventHandler;
+    private dndEventHandler;
+    private flowContext;
+    private flowEditContext;
+    private flowDebugContext;
+    /** 렌더링 */
+    render(): import("lit-html").TemplateResult<1>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changes: PropertyValues<this>): void;
+    setAvailableNodeTypes(availableNodeTypes: {
+        [type: string]: FlowNodeImplementation;
+    }): void;
+    get context(): FlowContextType;
+    getModel(): {
+        nodes: {
+            id: string;
+            label: string | undefined;
+            type: string;
+            pos: {
+                x: number;
+                y: number;
+            };
+            size: {
+                w: number;
+                h: number;
+            };
+            options: {
+                [key: string]: any;
+            } | undefined;
+        }[];
+        edges: {
+            id: string;
+            label: string | undefined;
+            from: import("./types.js").AnchorPointer;
+            to: import("./types.js").AnchorPointer;
+            weight: number | undefined;
+        }[];
+    };
+    get nodes(): FlowNode[];
+    set nodes(nodes: FlowNode[]);
+    get edges(): FlowEdge[];
+    set edges(edges: FlowEdge[]);
+    get selected(): FlowEntity | null;
+    updateFlowContext(partial: Partial<FlowContextType>): void;
+    set selected(selected: FlowEntity | null);
+    addFlowNode(node: FlowNode, withSelect?: boolean): void;
+    addFlowEdge(edge: FlowEdge, withSelect?: boolean): void;
+    drawEdgeGuide(edgeGuide: any): void;
+    /** 노드 삭제 */
+    deleteEntity(target: FlowEntity): void;
+    private setMode;
+    /** 플로우 실행 */
+    private executeFlow;
+    /** 플로우 일시정지 */
+    private pauseFlow;
+    /** 플로우 정지 */
+    private stopFlow;
+    private stepOver;
+    private stepInto;
+    private stepOut;
+    private continueExecution;
+    onNodeUpdated(updatedNode: FlowNode): void;
+    addLog(log: string): void;
+    private toggleBreakpoint;
+    private setCurrentExecutionNode;
+    private runLayout;
+    private onDblClick;
+}