@operato/flow 9.0.0-beta.52

package/dist/src/handlers/dnd-event-handler.js

@@ -0,0 +1,41 @@
+import { OxFlowEditor } from '../ox-flow-editor';
+import { FlowEventHandler } from './flow-event-handler';
+export class DndEventHandler extends FlowEventHandler {
+    constructor() {
+        super(...arguments);
+        /** 드래그 오버 허용 */
+        this.allowDrop = (e) => {
+            e.preventDefault();
+            e.dataTransfer.dropEffect = 'copy';
+        };
+        /** 노드 드롭 처리 */
+        this.onDrop = (e) => {
+            var _a, _b;
+            e.preventDefault();
+            const data = (_a = e.dataTransfer) === null || _a === void 0 ? void 0 : _a.getData('application/node-type');
+            if (!data)
+                return;
+            const transferedData = JSON.parse(data);
+            const clazz = this.host.availableNodeTypes[transferedData.id];
+            const editor = (_b = this.listeningTarget) === null || _b === void 0 ? void 0 : _b.querySelector('.editor');
+            const rect = editor === null || editor === void 0 ? void 0 : editor.getBoundingClientRect();
+            const x = e.clientX - rect.left;
+            const y = e.clientY - rect.top;
+            const newNode = new clazz({
+                type: transferedData.id,
+                id: OxFlowEditor.getUniqueId(),
+                pos: { x, y }
+            });
+            this.host.addFlowNode(newNode);
+        };
+    }
+    addEventListeners() {
+        this.listeningTarget.addEventListener('dragover', this.allowDrop);
+        this.listeningTarget.addEventListener('drop', this.onDrop);
+    }
+    removeEventListeners() {
+        this.listeningTarget.removeEventListener('dragover', this.allowDrop);
+        this.listeningTarget.removeEventListener('drop', this.onDrop);
+    }
+}
+//# sourceMappingURL=dnd-event-handler.js.map

package/dist/src/handlers/dnd-event-handler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dnd-event-handler.js","sourceRoot":"","sources":["../../../src/handlers/dnd-event-handler.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAEvD,MAAM,OAAO,eAAgB,SAAQ,gBAAgB;IAArD;;QAWE,gBAAgB;QACR,cAAS,GAAG,CAAC,CAAY,EAAE,EAAE;YACnC,CAAC,CAAC,cAAc,EAAE,CAAA;YAClB,CAAC,CAAC,YAAa,CAAC,UAAU,GAAG,MAAM,CAAA;QACrC,CAAC,CAAA;QAED,eAAe;QACP,WAAM,GAAG,CAAC,CAAY,EAAE,EAAE;;YAChC,CAAC,CAAC,cAAc,EAAE,CAAA;YAElB,MAAM,IAAI,GAAG,MAAA,CAAC,CAAC,YAAY,0CAAE,OAAO,CAAC,uBAAuB,CAAC,CAAA;YAC7D,IAAI,CAAC,IAAI;gBAAE,OAAM;YAEjB,MAAM,cAAc,GAAmB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;YACvD,MAAM,KAAK,GAA2B,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,cAAc,CAAC,EAAE,CAAC,CAAA;YACrF,MAAM,MAAM,GAAG,MAAA,IAAI,CAAC,eAAe,0CAAE,aAAa,CAAC,SAAS,CAAgB,CAAA;YAC5E,MAAM,IAAI,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,qBAAqB,EAAE,CAAA;YAC5C,MAAM,CAAC,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAA;YAC/B,MAAM,CAAC,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAA;YAE9B,MAAM,OAAO,GAAa,IAAI,KAAK,CAAC;gBAClC,IAAI,EAAE,cAAc,CAAC,EAAE;gBACvB,EAAE,EAAE,YAAY,CAAC,WAAW,EAAE;gBAC9B,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE;aACd,CAAC,CAAA;YAEF,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAA;QAChC,CAAC,CAAA;IACH,CAAC;IAtCQ,iBAAiB;QACtB,IAAI,CAAC,eAAe,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,SAA0B,CAAC,CAAA;QAClF,IAAI,CAAC,eAAe,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,MAAuB,CAAC,CAAA;IAC7E,CAAC;IAEM,oBAAoB;QACzB,IAAI,CAAC,eAAe,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,SAA0B,CAAC,CAAA;QACrF,IAAI,CAAC,eAAe,CAAC,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,MAAuB,CAAC,CAAA;IAChF,CAAC;CA8BF","sourcesContent":["import { OxFlowEditor } from '../ox-flow-editor'\nimport { FlowNode, FlowNodeImplementation } from '../types'\nimport { FlowEventHandler } from './flow-event-handler'\n\nexport class DndEventHandler extends FlowEventHandler {\n  public addEventListeners() {\n    this.listeningTarget.addEventListener('dragover', this.allowDrop as EventListener)\n    this.listeningTarget.addEventListener('drop', this.onDrop as EventListener)\n  }\n\n  public removeEventListeners() {\n    this.listeningTarget.removeEventListener('dragover', this.allowDrop as EventListener)\n    this.listeningTarget.removeEventListener('drop', this.onDrop as EventListener)\n  }\n\n  /** 드래그 오버 허용 */\n  private allowDrop = (e: DragEvent) => {\n    e.preventDefault()\n    e.dataTransfer!.dropEffect = 'copy'\n  }\n\n  /** 노드 드롭 처리 */\n  private onDrop = (e: DragEvent) => {\n    e.preventDefault()\n\n    const data = e.dataTransfer?.getData('application/node-type')\n    if (!data) return\n\n    const transferedData: { id: string } = JSON.parse(data)\n    const clazz: FlowNodeImplementation = this.host.availableNodeTypes[transferedData.id]\n    const editor = this.listeningTarget?.querySelector('.editor') as HTMLElement\n    const rect = editor?.getBoundingClientRect()\n    const x = e.clientX - rect.left\n    const y = e.clientY - rect.top\n\n    const newNode: FlowNode = new clazz({\n      type: transferedData.id,\n      id: OxFlowEditor.getUniqueId(),\n      pos: { x, y }\n    })\n\n    this.host.addFlowNode(newNode)\n  }\n}\n"]}

package/dist/src/handlers/flow-event-handler.d.ts

@@ -0,0 +1,20 @@
+import { Anchor, FlowEdge, FlowNode } from '../types.js';
+import { OxFlowEditor } from '../ox-flow-editor.js';
+export declare abstract class FlowEventHandler {
+    protected host: OxFlowEditor;
+    constructor(host: OxFlowEditor);
+    abstract addEventListeners(): void;
+    abstract removeEventListeners(): void;
+    get listeningTarget(): HTMLElement | DocumentFragment;
+    protected getFlowObject(e: Event): {
+        type: 'node' | 'edge' | 'anchor';
+        object: FlowNode | FlowEdge | Anchor;
+    } | undefined;
+    protected findNearestAnchor(x: number, y: number, fromAnchor: Anchor): {
+        anchor: Anchor;
+        anchorX: number;
+        anchorY: number;
+        weight?: number;
+    } | null;
+    protected getEditorOffset(): DOMRect;
+}

package/dist/src/handlers/flow-event-handler.js

@@ -0,0 +1,75 @@
+export class FlowEventHandler {
+    constructor(host) {
+        this.host = host;
+    }
+    get listeningTarget() {
+        return this.host.renderRoot;
+    }
+    getFlowObject(e) {
+        const target = e.target;
+        const closest = target.closest('.node, .edge');
+        if (!closest) {
+            return;
+        }
+        if (closest.classList.contains('edge')) {
+            const id = closest.getAttribute('data-id');
+            const edge = this.host.edges.find(edge => edge.id == id);
+            return edge && { type: 'edge', object: edge };
+        }
+        else if (closest.classList.contains('node')) {
+            const id = closest.getAttribute('data-id');
+            const node = this.host.nodes.find(node => node.id == id);
+            if (!node) {
+                return;
+            }
+            const anchorElement = target.closest('.anchor');
+            if (anchorElement) {
+                const anchorId = anchorElement.getAttribute('data-id');
+                if (anchorId) {
+                    const anchor = node.findAnchor(anchorId);
+                    if (anchor) {
+                        return { type: 'anchor', object: anchor };
+                    }
+                }
+            }
+            return { type: 'node', object: node };
+        }
+    }
+    findNearestAnchor(x, y, fromAnchor) {
+        let nearestNode = null;
+        let nearestAnchor = null;
+        let minDistance = 30;
+        for (const node of this.host.nodes) {
+            if (node.id == fromAnchor.node.id) {
+                continue;
+            }
+            for (const anchor of node.anchors) {
+                if (anchor.type == 'out') {
+                    continue;
+                }
+                const { x: nodeX, y: nodeY } = node.pos;
+                const { x: offsetX, y: offsetY } = anchor.pos;
+                const anchorX = nodeX + offsetX;
+                const anchorY = nodeY + offsetY;
+                const distance = Math.hypot(x - anchorX, y - anchorY);
+                if (distance < minDistance) {
+                    nearestNode = node;
+                    nearestAnchor = anchor;
+                    minDistance = distance;
+                }
+            }
+        }
+        return nearestNode && nearestAnchor
+            ? {
+                anchor: nearestAnchor,
+                anchorX: nearestNode.pos.x + nearestAnchor.pos.x,
+                anchorY: nearestNode.pos.y + nearestAnchor.pos.y
+            }
+            : null;
+    }
+    getEditorOffset() {
+        var _a;
+        return ((_a = this.host.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.editor')).getBoundingClientRect();
+    }
+}
+//# sourceMappingURL=flow-event-handler.js.map

package/dist/src/handlers/flow-event-handler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flow-event-handler.js","sourceRoot":"","sources":["../../../src/handlers/flow-event-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { Anchor, FlowEdge, FlowNode } from '../types.js'\nimport { OxFlowEditor } from '../ox-flow-editor.js'\n\nexport abstract class FlowEventHandler {\n  protected host: OxFlowEditor\n\n  constructor(host: OxFlowEditor) {\n    this.host = host\n  }\n\n  public abstract addEventListeners(): void\n  public abstract removeEventListeners(): void\n\n  get listeningTarget() {\n    return this.host.renderRoot\n  }\n\n  protected getFlowObject(\n    e: Event\n  ): { type: 'node' | 'edge' | 'anchor'; object: FlowNode | FlowEdge | Anchor } | undefined {\n    const target = e.target as HTMLElement\n\n    const closest = target.closest('.node, .edge')\n    if (!closest) {\n      return\n    }\n\n    if (closest.classList.contains('edge')) {\n      const id = closest.getAttribute('data-id')\n      const edge = this.host.edges.find(edge => edge.id == id)\n\n      return edge && { type: 'edge', object: edge }\n    } else if (closest.classList.contains('node')) {\n      const id = closest.getAttribute('data-id')\n      const node = this.host.nodes.find(node => node.id == id)\n\n      if (!node) {\n        return\n      }\n\n      const anchorElement = target.closest('.anchor')\n      if (anchorElement) {\n        const anchorId = anchorElement.getAttribute('data-id')\n        if (anchorId) {\n          const anchor = node.findAnchor(anchorId)\n          if (anchor) {\n            return { type: 'anchor', object: anchor }\n          }\n        }\n      }\n\n      return { type: 'node', object: node }\n    }\n  }\n\n  protected findNearestAnchor(\n    x: number,\n    y: number,\n    fromAnchor: Anchor\n  ): { anchor: Anchor; anchorX: number; anchorY: number; weight?: number } | null {\n    let nearestNode: FlowNode | null = null\n    let nearestAnchor: Anchor | null = null\n    let minDistance = 30\n\n    for (const node of this.host.nodes) {\n      if (node.id == fromAnchor.node.id) {\n        continue\n      }\n\n      for (const anchor of node.anchors!) {\n        if (anchor.type == 'out') {\n          continue\n        }\n\n        const { x: nodeX, y: nodeY } = node.pos\n        const { x: offsetX, y: offsetY } = anchor.pos\n\n        const anchorX = nodeX + offsetX\n        const anchorY = nodeY + offsetY\n        const distance = Math.hypot(x - anchorX, y - anchorY)\n\n        if (distance < minDistance) {\n          nearestNode = node\n          nearestAnchor = anchor\n          minDistance = distance\n        }\n      }\n    }\n\n    return nearestNode && nearestAnchor\n      ? {\n          anchor: nearestAnchor,\n          anchorX: nearestNode.pos.x + nearestAnchor.pos.x,\n          anchorY: nearestNode.pos.y + nearestAnchor.pos.y\n        }\n      : null\n  }\n\n  protected getEditorOffset(): DOMRect {\n    return (this.host.renderRoot?.querySelector('.editor') as HTMLElement).getBoundingClientRect()\n  }\n}\n"]}

package/dist/src/handlers/keydown-event-handler.d.ts

@@ -0,0 +1,6 @@
+import { FlowEventHandler } from './flow-event-handler.js';
+export declare class KeydownEventHandler extends FlowEventHandler {
+    addEventListeners(): void;
+    removeEventListeners(): void;
+    private onKeydown;
+}

package/dist/src/handlers/keydown-event-handler.js

@@ -0,0 +1,24 @@
+import { FlowEventHandler } from './flow-event-handler.js';
+export class KeydownEventHandler extends FlowEventHandler {
+    constructor() {
+        super(...arguments);
+        this.onKeydown = (e) => {
+            const isDeleteKey = e.key === 'Delete' || e.key === 'Backspace'; // MacOS 지원
+            const flowContext = this.host.context;
+            const entity = flowContext.selected;
+            if (entity && isDeleteKey) {
+                if (flowContext.selected) {
+                    this.host.deleteEntity(entity);
+                }
+                e.preventDefault();
+            }
+        };
+    }
+    addEventListeners() {
+        window.addEventListener('keydown', this.onKeydown);
+    }
+    removeEventListeners() {
+        window.removeEventListener('keydown', this.onKeydown);
+    }
+}
+//# sourceMappingURL=keydown-event-handler.js.map

package/dist/src/handlers/keydown-event-handler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"keydown-event-handler.js","sourceRoot":"","sources":["../../../src/handlers/keydown-event-handler.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAA;AAE1D,MAAM,OAAO,mBAAoB,SAAQ,gBAAgB;IAAzD;;QASU,cAAS,GAAG,CAAC,CAAgB,EAAE,EAAE;YACvC,MAAM,WAAW,GAAG,CAAC,CAAC,GAAG,KAAK,QAAQ,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,CAAA,CAAC,WAAW;YAC3E,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAA;YACrC,MAAM,MAAM,GAAG,WAAW,CAAC,QAAQ,CAAA;YAEnC,IAAI,MAAM,IAAI,WAAW,EAAE,CAAC;gBAC1B,IAAI,WAAW,CAAC,QAAQ,EAAE,CAAC;oBACzB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;gBAChC,CAAC;gBAED,CAAC,CAAC,cAAc,EAAE,CAAA;YACpB,CAAC;QACH,CAAC,CAAA;IACH,CAAC;IArBQ,iBAAiB;QACtB,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,SAA0B,CAAC,CAAA;IACrE,CAAC;IAEM,oBAAoB;QACzB,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,SAA0B,CAAC,CAAA;IACxE,CAAC;CAeF","sourcesContent":["import { FlowEventHandler } from './flow-event-handler.js'\n\nexport class KeydownEventHandler extends FlowEventHandler {\n  public addEventListeners() {\n    window.addEventListener('keydown', this.onKeydown as EventListener)\n  }\n\n  public removeEventListeners() {\n    window.removeEventListener('keydown', this.onKeydown as EventListener)\n  }\n\n  private onKeydown = (e: KeyboardEvent) => {\n    const isDeleteKey = e.key === 'Delete' || e.key === 'Backspace' // MacOS 지원\n    const flowContext = this.host.context\n    const entity = flowContext.selected\n\n    if (entity && isDeleteKey) {\n      if (flowContext.selected) {\n        this.host.deleteEntity(entity)\n      }\n\n      e.preventDefault()\n    }\n  }\n}\n"]}

package/dist/src/handlers/pointer-event-handler.d.ts

@@ -0,0 +1,9 @@
+import { FlowEventHandler } from './flow-event-handler.js';
+export declare class PointerEventHandler extends FlowEventHandler {
+    addEventListeners(): void;
+    removeEventListeners(): void;
+    onPointerdown: (e: Event) => void;
+    /** 노드 드래그 시작 */
+    private startNodeDrag;
+    private handleStartEdgeDrag;
+}

package/dist/src/handlers/pointer-event-handler.js

@@ -0,0 +1,118 @@
+import { FlowEdgeInstance } from '../base/flow-edge-instance.js';
+import { FlowEventHandler } from './flow-event-handler.js';
+export class PointerEventHandler extends FlowEventHandler {
+    constructor() {
+        super(...arguments);
+        this.onPointerdown = (e) => {
+            const { type, object } = this.getFlowObject(e) || {};
+            switch (type) {
+                case 'node':
+                    this.host.selected = object; // setSelectedNode(object as FlowNode)
+                    this.startNodeDrag(e, object);
+                    break;
+                case 'edge':
+                    this.host.selected = object; // setSelectedEdge(object as FlowEdge)
+                    break;
+                case 'anchor':
+                    this.handleStartEdgeDrag(e, object);
+                    break;
+                default:
+                // this.host.clearSelection()
+            }
+        };
+        /** 노드 드래그 시작 */
+        this.startNodeDrag = (e, node) => {
+            e.stopPropagation();
+            const { x, y } = node.pos || { x: 0, y: 0 };
+            var isDragging = true;
+            var offsetX = e.clientX - x;
+            var offsetY = e.clientY - y;
+            const onNodeDrag = (e) => {
+                if (!isDragging)
+                    return;
+                const newX = e.clientX - offsetX;
+                const newY = e.clientY - offsetY;
+                node.pos = {
+                    x: newX,
+                    y: newY
+                };
+                this.host.onNodeUpdated(node);
+            };
+            const onNodeStopDrag = () => {
+                isDragging = false;
+                window.removeEventListener('pointermove', onNodeDrag);
+                window.removeEventListener('pointerup', onNodeStopDrag);
+            };
+            window.addEventListener('pointermove', onNodeDrag);
+            window.addEventListener('pointerup', onNodeStopDrag);
+        };
+        this.handleStartEdgeDrag = (e, anchor) => {
+            const fromNode = anchor.node;
+            const fromAnchor = anchor;
+            if (!fromNode || !fromAnchor)
+                return;
+            const { x, y } = fromNode.pos;
+            const { x: offsetX, y: offsetY } = fromAnchor.pos;
+            const fromX = x + offsetX;
+            const fromY = y + offsetY;
+            var edgeGuide = null;
+            var { nodes, edges, addLog } = this.host;
+            const onPointerMove = (e) => {
+                const mouseX = e.clientX - this.getEditorOffset().left;
+                const mouseY = e.clientY - this.getEditorOffset().top;
+                const nearestAnchor = this.findNearestAnchor(mouseX, mouseY, fromAnchor);
+                const toX = nearestAnchor ? nearestAnchor.anchorX : mouseX;
+                const toY = nearestAnchor ? nearestAnchor.anchorY : mouseY;
+                edgeGuide = { fromX, fromY, toX, toY, weight: fromAnchor.weight, label: fromAnchor.label };
+                this.host.drawEdgeGuide(edgeGuide);
+            };
+            const onPointerUp = (e) => {
+                const mouseX = e.clientX - this.getEditorOffset().left;
+                const mouseY = e.clientY - this.getEditorOffset().top;
+                const { anchor: nearestAnchor } = this.findNearestAnchor(mouseX, mouseY, fromAnchor) || {};
+                if (nearestAnchor) {
+                    if (fromNode.id === nearestAnchor.node.id) {
+                        addLog('Cannot connect a node to itself.');
+                    }
+                    else if (!edges.some(edge => edge.from.nodeId === fromNode.id &&
+                        edge.from.anchorId === fromAnchor.id &&
+                        edge.to.nodeId === nearestAnchor.node.id &&
+                        edge.to.anchorId === nearestAnchor.id)) {
+                        const newEdge = new FlowEdgeInstance({
+                            id: `edge-${edges.length + 1}`,
+                            type: 'control',
+                            from: {
+                                nodeId: fromNode.id,
+                                anchorId: fromAnchor.id
+                            },
+                            to: {
+                                nodeId: nearestAnchor.node.id,
+                                anchorId: nearestAnchor.id
+                            },
+                            weight: edgeGuide === null || edgeGuide === void 0 ? void 0 : edgeGuide.weight,
+                            label: edgeGuide === null || edgeGuide === void 0 ? void 0 : edgeGuide.label,
+                            dataMappings: []
+                        }, fromNode, nearestAnchor.node);
+                        this.host.addFlowEdge(newEdge, true);
+                    }
+                    else {
+                        addLog('Edge already exists.');
+                    }
+                }
+                this.host.drawEdgeGuide(null);
+                this.host.requestUpdate();
+                window.removeEventListener('pointermove', onPointerMove);
+                window.removeEventListener('pointerup', onPointerUp);
+            };
+            window.addEventListener('pointermove', onPointerMove);
+            window.addEventListener('pointerup', onPointerUp);
+        };
+    }
+    addEventListeners() {
+        this.listeningTarget.addEventListener('pointerdown', this.onPointerdown);
+    }
+    removeEventListeners() {
+        this.listeningTarget.removeEventListener('pointerdown', this.onPointerdown);
+    }
+}
+//# sourceMappingURL=pointer-event-handler.js.map

package/dist/src/handlers/pointer-event-handler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pointer-event-handler.js","sourceRoot":"","sources":["../../../src/handlers/pointer-event-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { FlowEdgeInstance } from '../base/flow-edge-instance.js'\nimport { Anchor, FlowEdge, FlowNode } from '../types.js'\nimport { FlowEventHandler } from './flow-event-handler.js'\n\nexport class PointerEventHandler extends FlowEventHandler {\n  public addEventListeners() {\n    this.listeningTarget.addEventListener('pointerdown', this.onPointerdown)\n  }\n\n  public removeEventListeners() {\n    this.listeningTarget.removeEventListener('pointerdown', this.onPointerdown)\n  }\n\n  onPointerdown = (e: Event) => {\n    const { type, object } = this.getFlowObject(e) || {}\n\n    switch (type) {\n      case 'node':\n        this.host.selected = object as FlowNode // setSelectedNode(object as FlowNode)\n        this.startNodeDrag(e as PointerEvent, object as FlowNode)\n        break\n      case 'edge':\n        this.host.selected = object as FlowEdge // setSelectedEdge(object as FlowEdge)\n        break\n      case 'anchor':\n        this.handleStartEdgeDrag(e as PointerEvent, object as Anchor)\n        break\n      default:\n      // this.host.clearSelection()\n    }\n  }\n\n  /** 노드 드래그 시작 */\n  private startNodeDrag = (e: PointerEvent, node: FlowNode) => {\n    e.stopPropagation()\n\n    const { x, y } = node.pos || { x: 0, y: 0 }\n\n    var isDragging = true\n\n    var offsetX = e.clientX - x\n    var offsetY = e.clientY - y\n\n    const onNodeDrag = (e: MouseEvent) => {\n      if (!isDragging) return\n\n      const newX = e.clientX - offsetX\n      const newY = e.clientY - offsetY\n\n      node.pos = {\n        x: newX,\n        y: newY\n      }\n\n      this.host.onNodeUpdated(node)\n    }\n\n    const onNodeStopDrag = () => {\n      isDragging = false\n      window.removeEventListener('pointermove', onNodeDrag)\n      window.removeEventListener('pointerup', onNodeStopDrag)\n    }\n\n    window.addEventListener('pointermove', onNodeDrag)\n    window.addEventListener('pointerup', onNodeStopDrag)\n  }\n\n  private handleStartEdgeDrag = (e: Event, anchor: Anchor) => {\n    const fromNode = anchor.node\n\n    const fromAnchor = anchor\n\n    if (!fromNode || !fromAnchor) return\n\n    const { x, y } = fromNode.pos\n    const { x: offsetX, y: offsetY } = fromAnchor.pos\n\n    const fromX = x + offsetX\n    const fromY = y + offsetY\n\n    var edgeGuide: any = null\n    var { nodes, edges, addLog } = this.host\n\n    const onPointerMove = (e: MouseEvent) => {\n      const mouseX = e.clientX - this.getEditorOffset().left\n      const mouseY = e.clientY - this.getEditorOffset().top\n\n      const nearestAnchor = this.findNearestAnchor(mouseX, mouseY, fromAnchor)\n      const toX = nearestAnchor ? nearestAnchor.anchorX : mouseX\n      const toY = nearestAnchor ? nearestAnchor.anchorY : mouseY\n\n      edgeGuide = { fromX, fromY, toX, toY, weight: fromAnchor.weight, label: fromAnchor.label }\n      this.host.drawEdgeGuide(edgeGuide)\n    }\n\n    const onPointerUp = (e: MouseEvent) => {\n      const mouseX = e.clientX - this.getEditorOffset().left\n      const mouseY = e.clientY - this.getEditorOffset().top\n\n      const { anchor: nearestAnchor } = this.findNearestAnchor(mouseX, mouseY, fromAnchor) || {}\n\n      if (nearestAnchor) {\n        if (fromNode.id === nearestAnchor.node.id) {\n          addLog('Cannot connect a node to itself.')\n        } else if (\n          !edges.some(\n            edge =>\n              edge.from.nodeId === fromNode.id &&\n              edge.from.anchorId === fromAnchor.id &&\n              edge.to.nodeId === nearestAnchor.node.id &&\n              edge.to.anchorId === nearestAnchor.id\n          )\n        ) {\n          const newEdge: FlowEdge = new FlowEdgeInstance(\n            {\n              id: `edge-${edges.length + 1}`,\n              type: 'control',\n              from: {\n                nodeId: fromNode.id,\n                anchorId: fromAnchor.id\n              },\n              to: {\n                nodeId: nearestAnchor.node.id,\n                anchorId: nearestAnchor.id\n              },\n              weight: edgeGuide?.weight,\n              label: edgeGuide?.label,\n              dataMappings: []\n            },\n            fromNode,\n            nearestAnchor.node\n          )\n\n          this.host.addFlowEdge(newEdge, true)\n        } else {\n          addLog('Edge already exists.')\n        }\n      }\n\n      this.host.drawEdgeGuide(null)\n      this.host.requestUpdate()\n\n      window.removeEventListener('pointermove', onPointerMove)\n      window.removeEventListener('pointerup', onPointerUp)\n    }\n\n    window.addEventListener('pointermove', onPointerMove)\n    window.addEventListener('pointerup', onPointerUp)\n  }\n}\n"]}

package/dist/src/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ox-flow-editor.js';
+export * from './ox-flow-monitor.js';

package/dist/src/index.js

@@ -0,0 +1,3 @@
+export * from './ox-flow-editor.js';
+export * from './ox-flow-monitor.js';
+//# sourceMappingURL=index.js.map

package/dist/src/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA","sourcesContent":["export * from './ox-flow-editor.js'\nexport * from './ox-flow-monitor.js'\n"]}

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

@@ -0,0 +1,12 @@
+import { SVGTemplateResult } from 'lit';
+import { AnchorModel, FlowDataSchema } from '../types.js';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export declare class Decision extends FlowNodeAbstract {
+    get type(): string;
+    /** Input Data Schema */
+    get inputSchema(): FlowDataSchema;
+    /** Output Data Schema */
+    get outputSchema(): FlowDataSchema;
+    renderNode(): SVGTemplateResult;
+    get anchorModels(): AnchorModel[];
+}

package/dist/src/nodes/decision.js

@@ -0,0 +1,41 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export class Decision extends FlowNodeAbstract {
+    get type() {
+        return 'decision';
+    }
+    /** Input Data Schema */
+    get inputSchema() {
+        return {
+            type: 'object',
+            properties: {
+                decisionValue: { type: 'boolean' }
+            },
+            required: ['decisionValue']
+        };
+    }
+    /** Output Data Schema */
+    get outputSchema() {
+        return {
+            type: 'object',
+            properties: {}
+        };
+    }
+    renderNode() {
+        const { w, h } = this.size || { w: 120, h: 60 };
+        return svg `
+      <polygon points="0,-${h / 2} ${w / 2},0 0,${h / 2} -${w / 2},0" class="node-outline" fill="#fff3cd" stroke-width="1"/>
+      <text class="node-label" x="0" y="5" text-anchor="middle">${this.label}</text>
+    `;
+    }
+    get anchorModels() {
+        const { w, h } = this.size || { w: 120, h: 60 };
+        return [
+            { id: 'in', type: 'in', pos: { x: 0, y: -h / 2 } },
+            { id: 'no-1', type: 'out', label: 'No', pos: { x: -w / 2, y: 0 }, angle: 180, weight: 3 },
+            { id: 'yes', type: 'out', label: 'Yes', pos: { x: 0, y: h / 2 }, weight: 2 },
+            { id: 'no-2', type: 'out', label: 'No', pos: { x: w / 2, y: 0 }, angle: 0, weight: 1 }
+        ];
+    }
+}
+//# sourceMappingURL=decision.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"decision.js","sourceRoot":"","sources":["../../../src/nodes/decision.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,wBAAwB;IACxB,IAAI,WAAW;QACb,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,aAAa,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE;aACnC;YACD,QAAQ,EAAE,CAAC,eAAe,CAAC;SAC5B,CAAA;IACH,CAAC;IAED,yBAAyB;IACzB,IAAI,YAAY;QACd,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE,EAAE;SACf,CAAA;IACH,CAAC;IAED,UAAU;QACR,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAA;QAE/C,OAAO,GAAG,CAAA;4BACc,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC;kEACC,IAAI,CAAC,KAAK;KACvE,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAA;QAE/C,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;YAClD,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,EAAE;YACzF,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE;YAC5E,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE;SACvF,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 Decision extends FlowNodeAbstract {\n  get type() {\n    return 'decision'\n  }\n\n  /** Input Data Schema */\n  get inputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        decisionValue: { type: 'boolean' }\n      },\n      required: ['decisionValue']\n    }\n  }\n\n  /** Output Data Schema */\n  get outputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {}\n    }\n  }\n\n  renderNode(): SVGTemplateResult {\n    const { w, h } = this.size || { w: 120, h: 60 }\n\n    return svg`\n      <polygon points=\"0,-${h / 2} ${w / 2},0 0,${h / 2} -${w / 2},0\" class=\"node-outline\" fill=\"#fff3cd\" 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 || { w: 120, h: 60 }\n\n    return [\n      { id: 'in', type: 'in', pos: { x: 0, y: -h / 2 } },\n      { id: 'no-1', type: 'out', label: 'No', pos: { x: -w / 2, y: 0 }, angle: 180, weight: 3 },\n      { id: 'yes', type: 'out', label: 'Yes', pos: { x: 0, y: h / 2 }, weight: 2 },\n      { id: 'no-2', type: 'out', label: 'No', pos: { x: w / 2, y: 0 }, angle: 0, weight: 1 }\n    ]\n  }\n}\n"]}

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

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

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

@@ -0,0 +1,44 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export class EndEvent extends FlowNodeAbstract {
+    get type() {
+        return 'end';
+    }
+    get inputSchema() {
+        return {
+            type: 'object',
+            properties: {
+                result: {
+                    type: 'object',
+                    properties: {}
+                }
+            },
+            required: ['result']
+        };
+    }
+    get outputSchema() {
+        return {
+            type: 'object',
+            properties: {
+                result: {
+                    type: 'object',
+                    properties: {}
+                }
+            },
+            required: ['result']
+        };
+    }
+    renderNode() {
+        const { w, h } = this.size || { w: 48, h: 48 };
+        const radius = Math.min(w, h) / 2 - 2;
+        return svg `
+      <circle class="node-outline" cx="0" cy="0" r="${radius}" fill="#f8d7da" stroke="#000" stroke-width="4" />
+      
+      <text class="node-label" x="0" y="5" text-anchor="middle">${this.label}</text>
+    `;
+    }
+    get anchorModels() {
+        return [{ id: 'in', type: 'in', pos: { x: 0, y: -24 } }];
+    }
+}
+//# sourceMappingURL=end-event.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"end-event.js","sourceRoot":"","sources":["../../../src/nodes/end-event.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,KAAK,CAAA;IACd,CAAC;IAED,IAAI,WAAW;QACb,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,MAAM,EAAE;oBACN,IAAI,EAAE,QAAQ;oBACd,UAAU,EAAE,EAAE;iBACf;aACF;YACD,QAAQ,EAAE,CAAC,QAAQ,CAAC;SACrB,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,MAAM,EAAE;oBACN,IAAI,EAAE,QAAQ;oBACd,UAAU,EAAE,EAAE;iBACf;aACF;YACD,QAAQ,EAAE,CAAC,QAAQ,CAAC;SACrB,CAAA;IACH,CAAC;IAED,UAAU;QACR,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAA;QAC9C,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;QAErC,OAAO,GAAG,CAAA;sDACwC,MAAM;;kEAEM,IAAI,CAAC,KAAK;KACvE,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,OAAO,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAA;IAC1D,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 EndEvent extends FlowNodeAbstract {\n  get type() {\n    return 'end'\n  }\n\n  get inputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        result: {\n          type: 'object',\n          properties: {}\n        }\n      },\n      required: ['result']\n    }\n  }\n\n  get outputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        result: {\n          type: 'object',\n          properties: {}\n        }\n      },\n      required: ['result']\n    }\n  }\n\n  renderNode(): SVGTemplateResult {\n    const { w, h } = this.size || { w: 48, h: 48 }\n    const radius = Math.min(w, h) / 2 - 2\n\n    return svg`\n      <circle class=\"node-outline\" cx=\"0\" cy=\"0\" r=\"${radius}\" fill=\"#f8d7da\" stroke=\"#000\" stroke-width=\"4\" />\n      \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: 'in', type: 'in', pos: { x: 0, y: -24 } }]\n  }\n}\n"]}

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

@@ -0,0 +1,5 @@
+import { FlowNodeImplementation } from '../types.js';
+declare const _default: {
+    [key: string]: FlowNodeImplementation;
+};
+export default _default;

package/dist/src/nodes/index.js

@@ -0,0 +1,19 @@
+import { Task } from './task.js';
+import { Subflow } from './subflow.js';
+import { StartEvent } from './start-event.js';
+import { IntermediateEvent } from './intermediate-event.js';
+import { EndEvent } from './end-event.js';
+import { Decision } from './decision.js';
+import { Select } from './select.js';
+import { Iterator } from './iterator.js';
+export default {
+    start: StartEvent,
+    task: Task,
+    subflow: Subflow,
+    iterator: Iterator,
+    decision: Decision,
+    select: Select,
+    intermediate: IntermediateEvent,
+    end: EndEvent
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nodes/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAChC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAIxC,eAAe;IACb,KAAK,EAAE,UAAU;IACjB,IAAI,EAAE,IAAI;IACV,OAAO,EAAE,OAAO;IAChB,QAAQ,EAAE,QAAQ;IAClB,QAAQ,EAAE,QAAQ;IAClB,MAAM,EAAE,MAAM;IACd,YAAY,EAAE,iBAAiB;IAC/B,GAAG,EAAE,QAAQ;CAC+B,CAAA","sourcesContent":["import { Task } from './task.js'\nimport { Subflow } from './subflow.js'\nimport { StartEvent } from './start-event.js'\nimport { IntermediateEvent } from './intermediate-event.js'\nimport { EndEvent } from './end-event.js'\nimport { Decision } from './decision.js'\nimport { Select } from './select.js'\nimport { Iterator } from './iterator.js'\n\nimport { FlowNodeImplementation } from '../types.js'\n\nexport default {\n  start: StartEvent,\n  task: Task,\n  subflow: Subflow,\n  iterator: Iterator,\n  decision: Decision,\n  select: Select,\n  intermediate: IntermediateEvent,\n  end: EndEvent\n} as { [key: string]: FlowNodeImplementation }\n"]}

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

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

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

@@ -0,0 +1,46 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export class IntermediateEvent extends FlowNodeAbstract {
+    get type() {
+        return 'intermediate';
+    }
+    get inputSchema() {
+        return {
+            type: 'object',
+            properties: {
+                result: {
+                    type: 'object',
+                    properties: {}
+                }
+            },
+            required: ['result']
+        };
+    }
+    get outputSchema() {
+        return {
+            type: 'object',
+            properties: {
+                result: {
+                    type: 'object',
+                    properties: {}
+                }
+            },
+            required: ['result']
+        };
+    }
+    renderNode() {
+        const { w, h } = this.size || { w: 48, h: 48 };
+        const bigR = Math.min(w, h) / 2 - 1;
+        const smallR = bigR * 0.8;
+        return svg `
+      <circle class="node-outline" cx="0" cy="0" r="${bigR}" fill="#f8d7da" stroke="#000" stroke-width="1" />
+      <circle class="node-outline" cx="0" cy="0" r="${smallR}" fill="none" stroke="#000" stroke-width="1" />
+      
+      <text class="node-label" x="0" y="5" text-anchor="middle">${this.label}</text>
+    `;
+    }
+    get anchorModels() {
+        return [{ id: 'in', type: 'in', pos: { x: 0, y: -24 } }];
+    }
+}
+//# sourceMappingURL=intermediate-event.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"intermediate-event.js","sourceRoot":"","sources":["../../../src/nodes/intermediate-event.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,KAAK,CAAA;AAE5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAEhE,MAAM,OAAO,iBAAkB,SAAQ,gBAAgB;IACrD,IAAI,IAAI;QACN,OAAO,cAAc,CAAA;IACvB,CAAC;IAED,IAAI,WAAW;QACb,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,MAAM,EAAE;oBACN,IAAI,EAAE,QAAQ;oBACd,UAAU,EAAE,EAAE;iBACf;aACF;YACD,QAAQ,EAAE,CAAC,QAAQ,CAAC;SACrB,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,OAAO;YACL,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE;gBACV,MAAM,EAAE;oBACN,IAAI,EAAE,QAAQ;oBACd,UAAU,EAAE,EAAE;iBACf;aACF;YACD,QAAQ,EAAE,CAAC,QAAQ,CAAC;SACrB,CAAA;IACH,CAAC;IAED,UAAU;QACR,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAA;QAC9C,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;QACnC,MAAM,MAAM,GAAG,IAAI,GAAG,GAAG,CAAA;QAEzB,OAAO,GAAG,CAAA;sDACwC,IAAI;sDACJ,MAAM;;kEAEM,IAAI,CAAC,KAAK;KACvE,CAAA;IACH,CAAC;IAED,IAAI,YAAY;QACd,OAAO,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAA;IAC1D,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 IntermediateEvent extends FlowNodeAbstract {\n  get type() {\n    return 'intermediate'\n  }\n\n  get inputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        result: {\n          type: 'object',\n          properties: {}\n        }\n      },\n      required: ['result']\n    }\n  }\n\n  get outputSchema(): FlowDataSchema {\n    return {\n      type: 'object',\n      properties: {\n        result: {\n          type: 'object',\n          properties: {}\n        }\n      },\n      required: ['result']\n    }\n  }\n\n  renderNode(): SVGTemplateResult {\n    const { w, h } = this.size || { w: 48, h: 48 }\n    const bigR = Math.min(w, h) / 2 - 1\n    const smallR = bigR * 0.8\n\n    return svg`\n      <circle class=\"node-outline\" cx=\"0\" cy=\"0\" r=\"${bigR}\" fill=\"#f8d7da\" stroke=\"#000\" stroke-width=\"1\" />\n      <circle class=\"node-outline\" cx=\"0\" cy=\"0\" r=\"${smallR}\" fill=\"none\" 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  get anchorModels(): AnchorModel[] {\n    return [{ id: 'in', type: 'in', pos: { x: 0, y: -24 } }]\n  }\n}\n"]}

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

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

package/dist/src/nodes/iterator.js

@@ -0,0 +1,26 @@
+import { svg } from 'lit';
+import { FlowNodeAbstract } from '../base/flow-node-abstract.js';
+export class Iterator extends FlowNodeAbstract {
+    get type() {
+        return 'iterator';
+    }
+    renderNode() {
+        const { w, h } = this.size || { w: 200, h: 500 };
+        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 || { h: 500 };
+        return [
+            { id: 'in', type: 'in', pos: { x: 0, y: -(h !== null && h !== void 0 ? h : 500) / 2 } },
+            { id: 'out', type: 'out', pos: { x: 0, y: (h !== null && h !== void 0 ? h : 500) / 2 } }
+        ];
+    }
+}
+//# sourceMappingURL=iterator.js.map