drawio-mcp-server 1.7.0 → 2.0.3

package/build/plugin/mcp-plugin.js

@@ -0,0 +1,2618 @@
+"use strict";
+var DrawMcp = (() => {
+  // src/shape-library.ts
+  var shapeLibrary = {
+    rectangle: {
+      category: "general",
+      style: "rounded=0;whiteSpace=wrap;html=1;"
+    },
+    rounded_rectangle: {
+      category: "general",
+      style: "rounded=1;whiteSpace=wrap;html=1;"
+    },
+    text: {
+      category: "general",
+      style: "text;html=1;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;"
+    },
+    ellipse: {
+      category: "general",
+      style: "ellipse;whiteSpace=wrap;html=1;"
+    },
+    square: {
+      category: "general",
+      style: "whiteSpace=wrap;html=1;aspect=fixed;"
+    },
+    circle: {
+      category: "general",
+      style: "ellipse;whiteSpace=wrap;html=1;aspect=fixed;"
+    },
+    process: {
+      category: "general",
+      style: "shape=process;whiteSpace=wrap;html=1;backgroundOutline=1;"
+    },
+    diamond: {
+      category: "general",
+      style: "rhombus;whiteSpace=wrap;html=1;"
+    },
+    parallelogram: {
+      category: "general",
+      style: "shape=parallelogram;perimeter=parallelogramPerimeter;whiteSpace=wrap;html=1;fixedSize=1;"
+    },
+    hexagon: {
+      category: "general",
+      style: "shape=hexagon;perimeter=hexagonPerimeter2;whiteSpace=wrap;html=1;fixedSize=1;"
+    },
+    triangle: {
+      category: "general",
+      style: "triangle;whiteSpace=wrap;html=1;"
+    },
+    cylinder3: {
+      category: "general",
+      style: "shape=cylinder3;whiteSpace=wrap;html=1;boundedLbl=1;backgroundOutline=1;size=15;"
+    },
+    cloud: {
+      category: "general",
+      style: "ellipse;shape=cloud;whiteSpace=wrap;html=1;"
+    },
+    document: {
+      category: "general",
+      style: "shape=document;whiteSpace=wrap;html=1;boundedLbl=1;"
+    },
+    internalStorage: {
+      category: "general",
+      style: "shape=internalStorage;whiteSpace=wrap;html=1;backgroundOutline=1;"
+    },
+    cube: {
+      category: "general",
+      style: "shape=cube;whiteSpace=wrap;html=1;boundedLbl=1;backgroundOutline=1;darkOpacity=0.05;darkOpacity2=0.1;"
+    },
+    step: {
+      category: "general",
+      style: "shape=step;perimeter=stepPerimeter;whiteSpace=wrap;html=1;fixedSize=1;"
+    },
+    trapezoid: {
+      category: "general",
+      style: "shape=trapezoid;perimeter=trapezoidPerimeter;whiteSpace=wrap;html=1;fixedSize=1;"
+    },
+    tape: {
+      category: "general",
+      style: "shape=tape;whiteSpace=wrap;html=1;"
+    },
+    note: {
+      category: "general",
+      style: "shape=note;whiteSpace=wrap;html=1;backgroundOutline=1;darkOpacity=0.05;"
+    },
+    card: {
+      category: "general",
+      style: "shape=card;whiteSpace=wrap;html=1;"
+    },
+    callout: {
+      category: "general",
+      style: "shape=callout;whiteSpace=wrap;html=1;perimeter=calloutPerimeter;"
+    },
+    umlActor: {
+      category: "general",
+      style: "shape=umlActor;verticalLabelPosition=bottom;verticalAlign=top;html=1;outlineConnect=0;"
+    },
+    xor: {
+      category: "general",
+      style: "shape=xor;whiteSpace=wrap;html=1;"
+    },
+    or: {
+      category: "general",
+      style: "shape=or;whiteSpace=wrap;html=1;"
+    },
+    dataStorage: {
+      category: "general",
+      style: "shape=dataStorage;whiteSpace=wrap;html=1;fixedSize=1;"
+    },
+    swimlane: {
+      category: "general",
+      title: "Container",
+      style: "swimlane;startSize=0;"
+    },
+    verticalContainer: {
+      category: "general",
+      title: "Vertical Container",
+      style: "swimlane;whiteSpace=wrap;html=1;"
+    },
+    horizontalContainer: {
+      category: "general",
+      title: "Horizontal Container",
+      style: "swimlane;horizontal=0;whiteSpace=wrap;html=1;"
+    },
+    list: {
+      category: "general",
+      title: "List",
+      style: "swimlane;fontStyle=0;childLayout=stackLayout;horizontal=1;startSize=30;horizontalStack=0;resizeParent=1;resizeParentMax=0;resizeLast=0;collapsible=1;marginBottom=0;whiteSpace=wrap;html=1;"
+    },
+    listItem: {
+      category: "general",
+      title: "List Item",
+      style: "text;strokeColor=none;fillColor=none;align=left;verticalAlign=middle;spacingLeft=4;spacingRight=4;overflow=hidden;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rotatable=0;whiteSpace=wrap;html=1;"
+    },
+    curve: {
+      category: "general",
+      style: "curved=1;endArrow=classic;html=1;rounded=0;fontSize=12;startSize=8;endSize=8;"
+    },
+    flexArrow: {
+      category: "general",
+      title: "Bidirectional Arrow",
+      style: "shape=flexArrow;endArrow=classic;startArrow=classic;html=1;rounded=0;fontSize=12;startSize=8;endSize=8;curved=1;"
+    },
+    arrow: {
+      category: "general",
+      title: "Arrow",
+      style: "shape=flexArrow;endArrow=classic;html=1;rounded=0;fontSize=12;startSize=8;endSize=8;curved=1;"
+    },
+    dashedLine: {
+      category: "general",
+      style: "endArrow=none;dashed=1;html=1;rounded=0;fontSize=12;startSize=8;endSize=8;curved=1;"
+    },
+    dottedLine: {
+      category: "general",
+      style: "endArrow=none;dashed=1;html=1;dashPattern=1 3;strokeWidth=2;rounded=0;fontSize=12;startSize=8;endSize=8;"
+    },
+    line: {
+      category: "general",
+      style: "endArrow=none;html=1;rounded=0;fontSize=12;startSize=8;endSize=8;curved=1;"
+    },
+    bidirectionalConnector: {
+      category: "general",
+      style: "endArrow=classic;startArrow=classic;html=1;rounded=0;fontSize=12;startSize=8;endSize=8;curved=1;"
+    },
+    directionalConnector: {
+      category: "general",
+      style: "endArrow=classic;html=1;rounded=0;fontSize=12;startSize=8;endSize=8;curved=1;"
+    },
+    // AWS / Analytics
+    "mxgraph.aws4.athena": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.athena;"
+    },
+    "mxgraph.aws4.elasticsearch_service": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.elasticsearch_service;"
+    },
+    "mxgraph.aws4.kinesis": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.kinesis;"
+    },
+    "mxgraph.aws4.kinesis_data_analytics": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.kinesis_data_analytics;"
+    },
+    "mxgraph.aws4.kinesis_data_firehose": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.kinesis_data_firehose;"
+    },
+    "mxgraph.aws4.kinesis_data_streams": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.kinesis_data_streams;"
+    },
+    "mxgraph.aws4.managed_service_for_apache_flink": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.managed_service_for_apache_flink;"
+    },
+    "mxgraph.aws4.quicksight": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.quicksight;"
+    },
+    "mxgraph.aws4.managed_streaming_for_kafka": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.managed_streaming_for_kafka;"
+    },
+    "mxgraph.aws4.glue": {
+      category: "mxgraph.aws4.analytics",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.glue;"
+    },
+    // AWS / Compute
+    "mxgraph.aws4.compute": {
+      category: "mxgraph.aws4.compute",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.compute;"
+    },
+    "mxgraph.aws4.ec2": {
+      category: "mxgraph.aws4.compute",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.ec2;"
+    },
+    "mxgraph.aws4.lambda": {
+      category: "mxgraph.aws4.compute",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.lambda;"
+    },
+    // AWS / Containers
+    "mxgraph.aws4.containers": {
+      category: "mxgraph.aws4.containers",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.containers;"
+    },
+    "mxgraph.aws4.eks": {
+      category: "mxgraph.aws4.containers",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.eks;"
+    },
+    "mxgraph.aws4.ecr": {
+      category: "mxgraph.aws4.containers",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.ecr;"
+    },
+    "mxgraph.aws4.ecs": {
+      category: "mxgraph.aws4.containers",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.ecs;"
+    },
+    "mxgraph.aws4.fargate": {
+      category: "mxgraph.aws4.containers",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.fargate;"
+    },
+    // AWS / Network & Content Delivery
+    "mxgraph.aws4.api_gateway": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.api_gateway;"
+    },
+    "mxgraph.aws4.cloudfront": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.cloudfront;"
+    },
+    "mxgraph.aws4.route_53": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.route_53;"
+    },
+    "mxgraph.aws4.vpc_privatelink": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.vpc_privatelink;"
+    },
+    "mxgraph.aws4.vpc": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.vpc;"
+    },
+    "mxgraph.aws4.elastic_load_balancing": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.elastic_load_balancing;"
+    },
+    "mxgraph.aws4.endpoint": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;outlineConnect=0;fontColor=#232F3E;gradientColor=none;fillColor=#8C4FFF;strokeColor=none;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;pointerEvents=1;shape=mxgraph.aws4.endpoint;"
+    },
+    "mxgraph.aws4.customer_gateway": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;outlineConnect=0;fontColor=#232F3E;gradientColor=none;fillColor=#8C4FFF;strokeColor=none;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;pointerEvents=1;shape=mxgraph.aws4.customer_gateway;"
+    },
+    "mxgraph.aws4.application_load_balancer": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;outlineConnect=0;fontColor=#232F3E;gradientColor=none;fillColor=#8C4FFF;strokeColor=none;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;pointerEvents=1;shape=mxgraph.aws4.application_load_balancer;"
+    },
+    "mxgraph.aws4.network_load_balancer": {
+      category: "mxgraph.aws4.network",
+      style: "sketch=0;outlineConnect=0;fontColor=#232F3E;gradientColor=none;fillColor=#8C4FFF;strokeColor=none;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;pointerEvents=1;shape=mxgraph.aws4.network_load_balancer;"
+    },
+    // AWS / Application Integration
+    "mxgraph.aws4.sns": {
+      category: "mxgraph.aws4.application_integration",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#E7157B;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.sns;"
+    },
+    "mxgraph.aws4.sqs": {
+      category: "mxgraph.aws4.application_integration",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#E7157B;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.sqs;"
+    },
+    "mxgraph.aws4.eventbridge": {
+      category: "mxgraph.aws4.application_integration",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#E7157B;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.eventbridge;"
+    },
+    "mxgraph.aws4.managed_workflows_for_apache_airflow": {
+      category: "mxgraph.aws4.application_integration",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#E7157B;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.managed_workflows_for_apache_airflow;"
+    },
+    // AWS / Database
+    "mxgraph.aws4.database": {
+      category: "mxgraph.aws4.database",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#C925D1;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.database;"
+    },
+    "mxgraph.aws4.aurora": {
+      category: "mxgraph.aws4.database",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#C925D1;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.aurora;"
+    },
+    "mxgraph.aws4.documentdb_with_mongodb_compatibility": {
+      category: "mxgraph.aws4.database",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#C925D1;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.documentdb_with_mongodb_compatibility;"
+    },
+    "mxgraph.aws4.dynamodb": {
+      category: "mxgraph.aws4.database",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#C925D1;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.dynamodb;"
+    },
+    "mxgraph.aws4.elasticache": {
+      category: "mxgraph.aws4.database",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#C925D1;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.elasticache;"
+    },
+    "mxgraph.aws4.neptune": {
+      category: "mxgraph.aws4.database",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#C925D1;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.neptune;"
+    },
+    "mxgraph.aws4.rds": {
+      category: "mxgraph.aws4.database",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#C925D1;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.rds;"
+    },
+    "mxgraph.aws4.redshift": {
+      category: "mxgraph.aws4.database",
+      style: "sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#C925D1;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.redshift;"
+    },
+    "mxgraph.aws4.": {
+      category: "mxgraph.aws4.database",
+      style: ""
+    }
+  };
+
+  // src/websocketManager.ts
+  function createWebSocketManager(options) {
+    let socket = null;
+    let reconnectAttempts = 0;
+    let currentState = "disconnected";
+    let messageHandler = null;
+    let pingIntervalId = null;
+    let reconnectTimeoutId = null;
+    const {
+      url,
+      maxReconnectAttempts = 5,
+      reconnectDelay = 3e3,
+      pingInterval = 3e4
+    } = options;
+    const updateState = (newState) => {
+      if (currentState !== newState) {
+        console.debug(
+          `[websocketManager] State change: ${currentState} \u2192 ${newState}`
+        );
+        currentState = newState;
+      }
+    };
+    const connect = () => {
+      if (socket && socket.readyState === WebSocket.OPEN) {
+        console.debug("[websocketManager] Already connected");
+        return;
+      }
+      updateState("connecting");
+      try {
+        socket = new WebSocket(url);
+        socket.addEventListener("open", () => {
+          console.debug("[websocketManager] WebSocket connection established");
+          reconnectAttempts = 0;
+          updateState("connected");
+          startPing();
+        });
+        socket.addEventListener("message", (event) => {
+          try {
+            const parsedMessage = JSON.parse(event.data);
+            console.debug("[websocketManager] Received message:", parsedMessage);
+            if (messageHandler) {
+              messageHandler(parsedMessage);
+            }
+          } catch (error) {
+            console.error(
+              "[websocketManager] Failed to parse WebSocket message:",
+              error
+            );
+          }
+        });
+        socket.addEventListener("close", () => {
+          console.debug("[websocketManager] WebSocket connection closed");
+          updateState("disconnected");
+          stopPing();
+          attemptReconnect();
+        });
+        socket.addEventListener("error", (event) => {
+          console.error("[websocketManager] WebSocket error:", event);
+          updateState("disconnected");
+        });
+      } catch (error) {
+        console.error(
+          "[websocketManager] Failed to create WebSocket connection:",
+          error
+        );
+        updateState("disconnected");
+      }
+    };
+    const disconnect = () => {
+      if (reconnectTimeoutId) {
+        clearTimeout(reconnectTimeoutId);
+        reconnectTimeoutId = null;
+      }
+      stopPing();
+      reconnectAttempts = 0;
+      if (socket) {
+        console.debug("[websocketManager] Closing WebSocket connection");
+        socket.close();
+        socket = null;
+      }
+      updateState("disconnected");
+    };
+    const send = (message) => {
+      if (!socket || socket.readyState !== WebSocket.OPEN) {
+        console.warn(
+          "[websocketManager] Cannot send message: WebSocket not connected"
+        );
+        return;
+      }
+      try {
+        const serialized = JSON.stringify(message);
+        console.debug("[websocketManager] Sending message:", message);
+        socket.send(serialized);
+      } catch (error) {
+        console.error("[websocketManager] Failed to send message:", error);
+      }
+    };
+    const getState = () => currentState;
+    const onMessage = (handler) => {
+      messageHandler = handler;
+    };
+    const attemptReconnect = () => {
+      if (reconnectAttempts >= maxReconnectAttempts) {
+        console.error(
+          "[websocketManager] Max reconnection attempts reached. Giving up."
+        );
+        return;
+      }
+      reconnectAttempts++;
+      const delay = reconnectDelay * Math.pow(1.5, reconnectAttempts - 1);
+      console.log(
+        `[websocketManager] Attempting to reconnect in ${Math.round(delay / 1e3)} seconds... (attempt ${reconnectAttempts}/${maxReconnectAttempts})`
+      );
+      reconnectTimeoutId = window.setTimeout(() => {
+        reconnectTimeoutId = null;
+        connect();
+      }, delay);
+    };
+    const startPing = () => {
+      stopPing();
+      pingIntervalId = window.setInterval(() => {
+        if (getState() === "connected") {
+          send({ type: "PING" });
+        }
+      }, pingInterval);
+    };
+    const stopPing = () => {
+      if (pingIntervalId !== null) {
+        clearInterval(pingIntervalId);
+        pingIntervalId = null;
+      }
+    };
+    const ping = () => {
+      return new Promise((resolve) => {
+        if (getState() !== "connected") {
+          resolve(false);
+          return;
+        }
+        const timeoutId = setTimeout(() => {
+          resolve(false);
+        }, 5e3);
+        send({ type: "PING", message: "Ping from plugin" });
+        setTimeout(() => {
+          clearTimeout(timeoutId);
+          resolve(getState() === "connected");
+        }, 1e3);
+      });
+    };
+    return {
+      connect,
+      disconnect,
+      send,
+      getState,
+      onMessage,
+      ping
+    };
+  }
+
+  // src/pluginConfig.ts
+  var DEFAULT_PLUGIN_CONFIG = {
+    websocketPort: 3333,
+    serverUrl: ""
+  };
+  var PLUGIN_CONFIG_KEY = "drawio-mcp-plugin-config";
+  var cachedConfig = null;
+  async function fetchPluginConfig() {
+    if (cachedConfig) {
+      return cachedConfig;
+    }
+    try {
+      const response = await fetch("/api/config");
+      if (response.ok) {
+        const serverConfig = await response.json();
+        cachedConfig = {
+          websocketPort: serverConfig.websocketPort || DEFAULT_PLUGIN_CONFIG.websocketPort,
+          serverUrl: serverConfig.serverUrl || window.location.origin
+        };
+        writePluginConfig(cachedConfig);
+        return cachedConfig;
+      }
+    } catch (error) {
+      console.warn("[pluginConfig] Failed to fetch config from server:", error);
+    }
+    return readPluginConfig();
+  }
+  function readPluginConfig() {
+    try {
+      const stored = localStorage.getItem(PLUGIN_CONFIG_KEY);
+      if (stored) {
+        const parsed = JSON.parse(stored);
+        const validated = validatePluginConfig(parsed);
+        if (validated.isValid && validated.config) {
+          return validated.config;
+        }
+      }
+    } catch (error) {
+      console.warn("[pluginConfig] Failed to read from localStorage:", error);
+    }
+    return { ...DEFAULT_PLUGIN_CONFIG };
+  }
+  function writePluginConfig(config) {
+    try {
+      localStorage.setItem(PLUGIN_CONFIG_KEY, JSON.stringify(config));
+      cachedConfig = config;
+    } catch (error) {
+      console.error("[pluginConfig] Failed to write to localStorage:", error);
+      throw error;
+    }
+  }
+  function validatePluginConfig(config) {
+    if (!config || typeof config !== "object") {
+      return { isValid: false, error: "Configuration must be an object" };
+    }
+    const cfg = config;
+    if (typeof cfg.websocketPort !== "number") {
+      return { isValid: false, error: "websocketPort must be a number" };
+    }
+    if (cfg.websocketPort < 1024 || cfg.websocketPort > 65535) {
+      return {
+        isValid: false,
+        error: "websocketPort must be between 1024 and 65535"
+      };
+    }
+    return {
+      isValid: true,
+      config: {
+        websocketPort: cfg.websocketPort,
+        serverUrl: cfg.serverUrl || ""
+      }
+    };
+  }
+  function buildWebSocketUrl(config) {
+    const host = window.location.hostname;
+    return `ws://${host}:${config.websocketPort}`;
+  }
+
+  // src/settingsDialog.ts
+  function createDialogContainer() {
+    const container = document.createElement("div");
+    container.id = "mcp-settings-dialog";
+    container.style.cssText = `
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.5);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 10000;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  `;
+    container.addEventListener("click", (e) => {
+      if (e.target === container) {
+        e.stopPropagation();
+      }
+    });
+    return container;
+  }
+  function createDialogContent() {
+    const content = document.createElement("div");
+    content.className = "dialog-content";
+    content.style.cssText = `
+    background: white;
+    border-radius: 8px;
+    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
+    max-width: 500px;
+    width: 90%;
+    max-height: 90vh;
+    overflow-y: auto;
+    position: relative;
+  `;
+    return content;
+  }
+  function createDialogHeader(title, onClose) {
+    const header = document.createElement("div");
+    header.className = "dialog-header";
+    header.style.cssText = `
+    padding: 16px 20px;
+    border-bottom: 1px solid #e0e0e0;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  `;
+    const titleEl = document.createElement("h2");
+    titleEl.textContent = title;
+    titleEl.style.cssText = `
+    margin: 0;
+    font-size: 18px;
+    font-weight: 600;
+    color: #333;
+  `;
+    const closeBtn = document.createElement("button");
+    closeBtn.textContent = "\xD7";
+    closeBtn.style.cssText = `
+    background: none;
+    border: none;
+    font-size: 24px;
+    cursor: pointer;
+    padding: 0;
+    width: 24px;
+    height: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #666;
+    border-radius: 4px;
+  `;
+    closeBtn.title = "Close";
+    closeBtn.addEventListener("mouseenter", () => {
+      closeBtn.style.backgroundColor = "#f5f5f5";
+    });
+    closeBtn.addEventListener("mouseleave", () => {
+      closeBtn.style.backgroundColor = "transparent";
+    });
+    closeBtn.addEventListener("click", onClose);
+    header.appendChild(titleEl);
+    header.appendChild(closeBtn);
+    return header;
+  }
+  function createDialogBody(state, actions) {
+    const body = document.createElement("div");
+    body.className = "dialog-body";
+    body.style.cssText = `
+    padding: 20px;
+  `;
+    const statusSection = createStatusSection(state);
+    body.appendChild(statusSection);
+    const formSection = createFormSection(state, actions);
+    body.appendChild(formSection);
+    return body;
+  }
+  function createStatusSection(state) {
+    const section = document.createElement("div");
+    section.className = "status-section";
+    section.style.cssText = `
+    margin-bottom: 24px;
+    padding: 16px;
+    background: #f8f9fa;
+    border-radius: 6px;
+    border: 1px solid #e9ecef;
+  `;
+    const title = document.createElement("div");
+    title.style.cssText = `
+    font-weight: 600;
+    margin-bottom: 8px;
+    color: #333;
+  `;
+    title.textContent = "Connection Status";
+    const statusIndicator = document.createElement("div");
+    statusIndicator.className = "status-indicator";
+    statusIndicator.style.cssText = `
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin-bottom: 4px;
+  `;
+    const indicator = document.createElement("div");
+    indicator.style.cssText = `
+    width: 12px;
+    height: 12px;
+    border-radius: 50%;
+    flex-shrink: 0;
+  `;
+    switch (state.connectionState) {
+      case "connected":
+        indicator.style.backgroundColor = "#28a745";
+        break;
+      case "connecting":
+        indicator.style.backgroundColor = "#ffc107";
+        break;
+      case "disconnected":
+        indicator.style.backgroundColor = "#dc3545";
+        break;
+    }
+    const statusText = document.createElement("span");
+    statusText.textContent = state.connectionState.charAt(0).toUpperCase() + state.connectionState.slice(1);
+    statusText.style.fontWeight = "500";
+    statusIndicator.appendChild(indicator);
+    statusIndicator.appendChild(statusText);
+    const portDisplay = document.createElement("div");
+    portDisplay.style.cssText = `
+    font-size: 14px;
+    color: #666;
+  `;
+    portDisplay.textContent = `Port: ${state.config.websocketPort}`;
+    section.appendChild(title);
+    section.appendChild(statusIndicator);
+    section.appendChild(portDisplay);
+    return section;
+  }
+  function createFormSection(state, actions) {
+    const section = document.createElement("div");
+    section.className = "form-section";
+    const portGroup = document.createElement("div");
+    portGroup.className = "form-group";
+    portGroup.style.cssText = `
+    margin-bottom: 16px;
+  `;
+    const label = document.createElement("label");
+    label.textContent = "WebSocket Port";
+    label.htmlFor = "mcp-port-input";
+    label.style.cssText = `
+    display: block;
+    margin-bottom: 6px;
+    font-weight: 500;
+    color: #333;
+  `;
+    const input = document.createElement("input");
+    input.id = "mcp-port-input";
+    input.type = "number";
+    input.min = "1024";
+    input.max = "65535";
+    input.value = state.formData.port;
+    input.style.cssText = `
+    width: 100%;
+    padding: 8px 12px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    font-size: 14px;
+    box-sizing: border-box;
+  `;
+    if (state.errors.port) {
+      input.style.borderColor = "#dc3545";
+    }
+    input.addEventListener("input", (e) => {
+      const value = e.target.value;
+      window.dispatchEvent(
+        new CustomEvent("mcp-settings-message", {
+          detail: { type: "UPDATE_PORT", port: value }
+        })
+      );
+    });
+    const hint = document.createElement("div");
+    hint.textContent = "Port must be between 1024 and 65535";
+    hint.style.cssText = `
+    font-size: 12px;
+    color: #666;
+    margin-top: 4px;
+  `;
+    if (state.errors.port) {
+      const error = document.createElement("div");
+      error.textContent = state.errors.port;
+      error.style.cssText = `
+      font-size: 12px;
+      color: #dc3545;
+      margin-top: 4px;
+    `;
+      portGroup.appendChild(error);
+    }
+    portGroup.appendChild(label);
+    portGroup.appendChild(input);
+    portGroup.appendChild(hint);
+    section.appendChild(portGroup);
+    return section;
+  }
+  function createDialogFooter(state, actions) {
+    const footer = document.createElement("div");
+    footer.className = "dialog-footer";
+    footer.style.cssText = `
+    padding: 16px 20px;
+    border-top: 1px solid #e0e0e0;
+    display: flex;
+    justify-content: space-between;
+    gap: 12px;
+    flex-wrap: wrap;
+  `;
+    const leftActions = document.createElement("div");
+    leftActions.style.cssText = `
+    display: flex;
+    gap: 8px;
+    flex-wrap: wrap;
+  `;
+    const rightActions = document.createElement("div");
+    rightActions.style.cssText = `
+    display: flex;
+    gap: 8px;
+  `;
+    const cancelBtn = createButton("Cancel", "ghost", () => {
+      window.dispatchEvent(
+        new CustomEvent("mcp-settings-message", {
+          detail: { type: "CLOSE" }
+        })
+      );
+    });
+    const saveBtn = createButton(
+      state.isSaving ? "Saving..." : "Save",
+      "primary",
+      () => {
+        window.dispatchEvent(
+          new CustomEvent("mcp-settings-message", {
+            detail: { type: "SAVE" }
+          })
+        );
+      },
+      state.isSaving
+    );
+    rightActions.appendChild(cancelBtn);
+    rightActions.appendChild(saveBtn);
+    footer.appendChild(leftActions);
+    footer.appendChild(rightActions);
+    return footer;
+  }
+  function createButton(text, variant, onClick, disabled = false) {
+    const btn = document.createElement("button");
+    btn.textContent = text;
+    btn.disabled = disabled;
+    btn.style.cssText = `
+    padding: 8px 16px;
+    border-radius: 4px;
+    font-size: 14px;
+    cursor: pointer;
+    border: 1px solid transparent;
+    transition: all 0.2s;
+  `;
+    switch (variant) {
+      case "primary":
+        btn.style.cssText += `
+        background-color: #007bff;
+        color: white;
+        border-color: #007bff;
+      `;
+        btn.addEventListener("mouseenter", () => {
+          if (!disabled) btn.style.backgroundColor = "#0056b3";
+        });
+        btn.addEventListener("mouseleave", () => {
+          if (!disabled) btn.style.backgroundColor = "#007bff";
+        });
+        break;
+      case "secondary":
+        btn.style.cssText += `
+        background-color: #6c757d;
+        color: white;
+        border-color: #6c757d;
+      `;
+        btn.addEventListener("mouseenter", () => {
+          if (!disabled) btn.style.backgroundColor = "#545b62";
+        });
+        btn.addEventListener("mouseleave", () => {
+          if (!disabled) btn.style.backgroundColor = "#6c757d";
+        });
+        break;
+      case "ghost":
+        btn.style.cssText += `
+        background-color: transparent;
+        color: #6c757d;
+        border-color: #6c757d;
+      `;
+        btn.addEventListener("mouseenter", () => {
+          if (!disabled) {
+            btn.style.backgroundColor = "#f8f9fa";
+          }
+        });
+        btn.addEventListener("mouseleave", () => {
+          if (!disabled) btn.style.backgroundColor = "transparent";
+        });
+        break;
+    }
+    if (disabled) {
+      btn.style.cssText += `
+      opacity: 0.6;
+      cursor: not-allowed;
+    `;
+    }
+    btn.addEventListener("click", onClick);
+    return btn;
+  }
+  function createSettingsDialog(initialState, actions) {
+    let currentState = { ...initialState };
+    let dialogElement = null;
+    let isVisible = false;
+    const update = (newState) => {
+      currentState = { ...newState };
+      if (dialogElement && isVisible) {
+        render();
+      }
+    };
+    const render = () => {
+      if (dialogElement && dialogElement.parentNode) {
+        dialogElement.parentNode.removeChild(dialogElement);
+      }
+      const container = createDialogContainer();
+      const content = createDialogContent();
+      const header = createDialogHeader("MCP Settings", () => actions.onClose());
+      const body = createDialogBody(currentState, actions);
+      const footer = createDialogFooter(currentState, actions);
+      content.appendChild(header);
+      content.appendChild(body);
+      content.appendChild(footer);
+      container.appendChild(content);
+      dialogElement = container;
+      isVisible = true;
+      setupMessageListeners(container, actions);
+      return container;
+    };
+    const setupMessageListeners = (container, actions2) => {
+      const handleMessage = (event) => {
+        const message = event.detail;
+        switch (message.type) {
+          case "UPDATE_PORT":
+            currentState.formData.port = message.port;
+            delete currentState.errors.port;
+            break;
+          case "SAVE":
+            if (!validateAndSave()) {
+              update(currentState);
+            }
+            break;
+          case "CLOSE":
+            actions2.onClose();
+            break;
+        }
+      };
+      window.addEventListener(
+        "mcp-settings-message",
+        handleMessage
+      );
+      const observer = new MutationObserver((mutations) => {
+        mutations.forEach((mutation) => {
+          mutation.removedNodes.forEach((node) => {
+            if (node === container) {
+              window.removeEventListener(
+                "mcp-settings-message",
+                handleMessage
+              );
+              observer.disconnect();
+            }
+          });
+        });
+      });
+      if (container.parentNode) {
+        observer.observe(container.parentNode, { childList: true });
+      }
+    };
+    const validateAndSave = () => {
+      const portNum = parseInt(currentState.formData.port, 10);
+      if (isNaN(portNum)) {
+        currentState.errors.port = "Port must be a number";
+        return false;
+      }
+      if (portNum < 1024 || portNum > 65535) {
+        currentState.errors.port = "Port must be between 1024 and 65535";
+        return false;
+      }
+      currentState.errors = {};
+      currentState.isSaving = true;
+      const newConfig = {
+        websocketPort: portNum,
+        serverUrl: currentState.config.serverUrl
+      };
+      actions.onSave(newConfig);
+      return true;
+    };
+    const dialogProxy = {
+      get element() {
+        if (!dialogElement) {
+          render();
+        }
+        return dialogElement;
+      },
+      update
+    };
+    return dialogProxy;
+  }
+  function showSettingsDialog(dialog) {
+    if (!dialog.element.parentNode) {
+      document.body.appendChild(dialog.element);
+    }
+  }
+  function hideSettingsDialog(dialog) {
+    if (dialog.element.parentNode) {
+      dialog.element.parentNode.removeChild(dialog.element);
+    }
+  }
+
+  // src/drawio-tools.ts
+  function transform_NamedNodeMap_to_record(attributes) {
+    const tstr = Object.prototype.toString.call(attributes);
+    if (tstr !== "[object NamedNodeMap]") {
+      return attributes;
+    }
+    if (attributes.length === void 0) {
+      return attributes;
+    }
+    let transformed_attributes = {};
+    for (let i = 0; i < attributes.length; i++) {
+      const attr = attributes[i];
+      if (attr && attr.name && attr.value !== void 0) {
+        transformed_attributes[attr.name] = attr.value;
+      }
+    }
+    return transformed_attributes;
+  }
+  function transform_cells_NamedNodeMap_to_attributes(cell) {
+    if (cell.value.attributes && typeof cell.value.attributes === "object") {
+      const attributes = cell.value.attributes;
+      return transform_NamedNodeMap_to_record(attributes);
+    }
+    return {};
+  }
+  function remove_circular_dependencies(obj, visited = /* @__PURE__ */ new WeakSet(), path = []) {
+    if (obj === null || typeof obj !== "object") {
+      return obj;
+    }
+    if (Array.isArray(obj)) {
+      if (visited.has(obj)) {
+        return `[Circular ${path.join(".")}]`;
+      }
+      visited.add(obj);
+      return obj.map(
+        (item, index) => remove_circular_dependencies(item, visited, [...path, `[${index}]`])
+      );
+    }
+    const tstr = Object.prototype.toString.call(obj);
+    if (tstr === "[object NamedNodeMap]") {
+      return transform_NamedNodeMap_to_record(obj);
+    }
+    if (tstr !== "[object Object]" && tstr !== "[object Element]") {
+      return obj;
+    }
+    if (visited.has(obj)) {
+      return `[Circular ${path.join(".")}]`;
+    }
+    visited.add(obj);
+    const result = {};
+    for (const key in obj) {
+      const value = obj[key];
+      if (typeof value !== "function" && key !== "children" && key !== "edges" && !key.startsWith("aria") && key !== "ownerDocument" && key !== "part" && key !== "classList" && key !== "childNodes" && key !== "shadowRoot" && key !== "innerHTML" && key !== "outerHTML" && key !== "scrollTop" && key !== "scrollLeft" && key !== "scrollWidth" && key !== "scrollHeight" && key !== "clientTop" && key !== "clientLeft" && key !== "clientWidth" && key !== "clientHeight" && key !== "onbeforecopy" && key !== "onbeforecut" && key !== "onbeforepaste" && key !== "onsearch" && key !== "elementTiming" && key !== "onfullscreenchange" && key !== "onfullscreenerror" && key !== "onwebkitfullscreenchange" && key !== "onwebkitfullscreenerror" && key !== "firstElementChild" && key !== "lastElementChild" && key !== "childElementCount" && key !== "previousElementSibling" && key !== "nextElementSibling" && key !== "currentCSSZoom" && key !== "parentNode" && key !== "parentElement" && key !== "firstChild" && key !== "lastChild" && key !== "previousSibling" && key !== "nextSibling" && key !== "nodeValue" && key !== "textContent" && key !== "ELEMENT_NODE" && key !== "ATTRIBUTE_NODE" && key !== "TEXT_NODE" && key !== "CDATA_SECTION_NODE" && key !== "ENTITY_REFERENCE_NODE" && key !== "ENTITY_NODE" && key !== "PROCESSING_INSTRUCTION_NODE" && key !== "COMMENT_NODE" && key !== "DOCUMENT_NODE" && key !== "DOCUMENT_TYPE_NODE" && key !== "DOCUMENT_FRAGMENT_NODE" && key !== "NOTATION_NODE" && key !== "DOCUMENT_POSITION_DISCONNECTED" && key !== "DOCUMENT_POSITION_PRECEDING" && key !== "DOCUMENT_POSITION_FOLLOWING" && key !== "DOCUMENT_POSITION_CONTAINS" && key !== "DOCUMENT_POSITION_CONTAINED_BY" && key !== "DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC") {
+        let stripped_value = {};
+        if ((key === "parent" || key === "source" || key === "target") && value !== void 0 && value !== null) {
+          stripped_value = {
+            id: value.id
+          };
+        } else {
+          stripped_value = value;
+        }
+        result[key] = remove_circular_dependencies(stripped_value, visited, [
+          ...path,
+          key
+        ]);
+      }
+    }
+    return result;
+  }
+  function transform_cell_for_display(cell) {
+    if (!cell || typeof cell !== "object") {
+      return null;
+    }
+    const transformed = {
+      id: cell.id || "",
+      mxObjectId: cell.mxObjectId || "",
+      value: "",
+      geometry: cell.geometry,
+      style: cell.style,
+      edge: cell.edge,
+      edges: cell.edges,
+      parent: cell.parent,
+      source: cell.source,
+      target: cell.target
+    };
+    if (cell.value !== null && cell.value !== void 0) {
+      if (typeof cell.value === "string") {
+        transformed.value = cell.value;
+      } else if (typeof cell.value === "object") {
+        const transformed_attributes = transform_cells_NamedNodeMap_to_attributes(cell);
+        transformed.value = {
+          attributes: transformed_attributes,
+          nodeName: cell.value.nodeName,
+          localName: cell.value.localName,
+          tagName: cell.value.tagName
+        };
+      }
+    }
+    return transformed;
+  }
+  function get_cell_layer(graph, cell) {
+    if (!cell || !graph) {
+      return null;
+    }
+    try {
+      const layer = graph.getLayerForCell(cell);
+      if (layer) {
+        return {
+          id: layer.id || "",
+          name: layer.value || "Default Layer"
+        };
+      }
+    } catch (error) {
+      console.warn("Could not get layer for cell:", error);
+    }
+    return null;
+  }
+  function get_cell_tags(graph, cell) {
+    if (!cell || !graph) {
+      return [];
+    }
+    try {
+      const tags = graph.getTagsForCell(cell);
+      return tags || [];
+    } catch (error) {
+      console.warn("Could not get tags for cell:", error);
+      return [];
+    }
+  }
+  function mx_isRoot(root_cell) {
+    return function(cell) {
+      return null != cell && cell == root_cell;
+    };
+  }
+  function mx_isLayer(root_cell) {
+    return function(cell) {
+      return mx_isRoot(root_cell)(cell.getParent());
+    };
+  }
+  function resolve_parent(graph, parent_id) {
+    if (parent_id) {
+      const model = graph.getModel();
+      const parent = model.getCell(parent_id);
+      if (!parent) {
+        throw new Error(`Parent cell '${parent_id}' not found`);
+      }
+      return parent;
+    }
+    return graph.getDefaultParent();
+  }
+  function normalize_shape_style(shapeName, style) {
+    if (!style || !shapeName.startsWith("mxgraph.aws4.")) {
+      return style;
+    }
+    const hasExplicitShape = style.includes("shape=");
+    if (hasExplicitShape) {
+      return style;
+    }
+    return `shape=${shapeName};${style}`;
+  }
+  function apply_style_to_cell(graph, cell, style) {
+    if (!style || !cell) {
+      return;
+    }
+    const model = graph.getModel();
+    model.setStyle(cell, style);
+    if (typeof cell.setStyle === "function") {
+      cell.setStyle(style);
+    }
+    if (typeof graph.refresh === "function") {
+      graph.refresh(cell);
+    }
+  }
+  function create_shape_vertex(graph, options) {
+    const mxCell = window.mxCell;
+    const mxGeometry = window.mxGeometry;
+    const cell = new mxCell(
+      options.text,
+      new mxGeometry(options.x, options.y, options.width, options.height),
+      options.style
+    );
+    cell.vertex = true;
+    graph.addCell(cell, options.parent);
+    return cell;
+  }
+  function add_new_rectangle(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const x = options.x || 100;
+    const y = options.y || 100;
+    const width = options.width || 120;
+    const height = options.height || 60;
+    const text = options.text || "";
+    const style = options.style || "whiteSpace=wrap;html=1;fillColor=#ffffff;strokeColor=#000000;";
+    const parent = resolve_parent(graph, options.parent_id);
+    graph.getModel().beginUpdate();
+    try {
+      const vertex = graph.insertVertex(
+        parent,
+        null,
+        text,
+        x,
+        y,
+        width,
+        height,
+        style
+      );
+      return vertex;
+    } finally {
+      graph.getModel().endUpdate();
+    }
+  }
+  function delete_cell_by_id(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const cell_id = options.cell_id;
+    const cell = graph.getModel().getCell(cell_id);
+    if (!cell) {
+      return false;
+    }
+    graph.getModel().beginUpdate();
+    try {
+      graph.removeCells([cell]);
+      return true;
+    } finally {
+      graph.getModel().endUpdate();
+    }
+  }
+  var SELF_CONNECTOR_DEFAULT_STYLE = "edgeStyle=loopEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;endArrow=classic;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0.5;entryY=1;entryDx=0;entryDy=0;";
+  function add_edge(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const source = model.getCell(options.source_id);
+    const target = model.getCell(options.target_id);
+    if (!source || !target) {
+      return null;
+    }
+    const isSelfConnector = options.source_id === options.target_id;
+    const defaultStyle = isSelfConnector ? SELF_CONNECTOR_DEFAULT_STYLE : "endArrow=classic;html=1;rounded=0;";
+    const style = options.style || defaultStyle;
+    const text = options.text || "";
+    const parent = resolve_parent(graph, options.parent_id);
+    model.beginUpdate();
+    try {
+      const edge = graph.insertEdge(parent, null, text, source, target, style);
+      if (options.points && options.points.length > 0) {
+        const geo = edge.getGeometry();
+        const mxPoint = window.mxPoint;
+        geo.points = options.points.map((p) => new mxPoint(p.x, p.y));
+        model.setGeometry(edge, geo);
+      }
+      return edge;
+    } finally {
+      model.endUpdate();
+    }
+  }
+  function edit_cell(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const cell_id = options.cell_id;
+    if (!cell_id) {
+      throw new Error("edit_cell requires a cell_id");
+    }
+    const cell = model.getCell(cell_id);
+    if (!cell) {
+      throw new Error(`edit_cell could not find cell with id '${cell_id}'`);
+    }
+    model.beginUpdate();
+    try {
+      const has_position_change = options.x !== void 0 || options.y !== void 0;
+      const has_size_change = options.width !== void 0 || options.height !== void 0;
+      if (has_position_change || has_size_change) {
+        const geometry = cell.geometry ? cell.geometry.clone() : null;
+        if (!geometry) {
+          throw new Error(
+            `Cell '${cell_id}' does not support geometry updates (missing geometry)`
+          );
+        }
+        if (options.x !== void 0) geometry.x = options.x;
+        if (options.y !== void 0) geometry.y = options.y;
+        if (options.width !== void 0) geometry.width = options.width;
+        if (options.height !== void 0)
+          geometry.height = options.height;
+        model.setGeometry(cell, geometry);
+      }
+      if (options.text !== void 0) {
+        graph.cellLabelChanged(cell, options.text, false);
+      }
+      if (options.style !== void 0) {
+        graph.setCellStyle(options.style, [cell]);
+      }
+    } finally {
+      model.endUpdate();
+    }
+    return cell;
+  }
+  function edit_edge(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const cell_id = options.cell_id;
+    if (!cell_id) {
+      throw new Error("edit_edge requires a cell_id");
+    }
+    const edge = model.getCell(cell_id);
+    if (!edge) {
+      throw new Error(`edit_edge could not find edge with id '${cell_id}'`);
+    }
+    if (!edge.edge) {
+      throw new Error(`Cell '${cell_id}' is not an edge`);
+    }
+    model.beginUpdate();
+    try {
+      if (options.source_id !== void 0) {
+        const newSource = model.getCell(options.source_id);
+        if (!newSource) {
+          throw new Error(
+            `edit_edge could not find source cell '${options.source_id}'`
+          );
+        }
+        model.setTerminal(edge, newSource, true);
+      }
+      if (options.target_id !== void 0) {
+        const newTarget = model.getCell(options.target_id);
+        if (!newTarget) {
+          throw new Error(
+            `edit_edge could not find target cell '${options.target_id}'`
+          );
+        }
+        model.setTerminal(edge, newTarget, false);
+      }
+      if (options.text !== void 0) {
+        graph.cellLabelChanged(edge, options.text, false);
+      }
+      if (options.style !== void 0) {
+        graph.setCellStyle(options.style, [edge]);
+      }
+      if (options.points !== void 0) {
+        const geo = edge.getGeometry().clone();
+        const mxPoint = window.mxPoint;
+        geo.points = options.points.map((p) => new mxPoint(p.x, p.y));
+        model.setGeometry(edge, geo);
+      }
+    } finally {
+      model.endUpdate();
+    }
+    return edge;
+  }
+  function set_cell_shape(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const cell_id = options.cell_id;
+    const shape_name = options.shape_name;
+    if (!cell_id) {
+      throw new Error("set_cell_shape requires a cell_id");
+    }
+    if (!shape_name) {
+      throw new Error("set_cell_shape requires a shape_name");
+    }
+    const cell = model.getCell(cell_id);
+    if (!cell) {
+      throw new Error(`set_cell_shape could not find cell with id '${cell_id}'`);
+    }
+    if (cell.edge) {
+      throw new Error(
+        `Cell '${cell_id}' is an edge; set_cell_shape expects a vertex`
+      );
+    }
+    const style = shapeLibrary?.[shape_name]?.style;
+    if (!style) {
+      throw new Error(
+        `set_cell_shape could not find a shape named '${shape_name}'`
+      );
+    }
+    model.beginUpdate();
+    try {
+      apply_style_to_cell(graph, cell, style);
+    } finally {
+      model.endUpdate();
+    }
+    return cell;
+  }
+  function set_cell_data(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const mxUtils = window.mxUtils;
+    const cell_id = options.cell_id;
+    const key = options.key;
+    const value = options.value;
+    if (!cell_id) {
+      throw new Error("set_cell_data requires a cell_id");
+    }
+    if (!key) {
+      throw new Error("set_cell_data requires a key");
+    }
+    if (value === void 0) {
+      throw new Error("set_cell_data requires a value");
+    }
+    const cell = model.getCell(cell_id);
+    if (!cell) {
+      throw new Error(`set_cell_data could not find cell with id '${cell_id}'`);
+    }
+    model.beginUpdate();
+    try {
+      let d = graph.getModel().getValue(cell);
+      if (!mxUtils.isNode(d)) {
+        var h = mxUtils.createXmlDocument().createElement("object");
+        h.setAttribute("label", d || "");
+        d = h;
+      }
+      d = d.cloneNode(true);
+      d.setAttribute(key, value);
+      graph.getModel().setValue(cell, d);
+    } catch (e) {
+      console.error(`[set-cell-data] error`, e);
+    } finally {
+      model.endUpdate();
+    }
+    return cell;
+  }
+  function get_shape_categories(ui2) {
+    const shapes = shapeLibrary;
+    const categories = /* @__PURE__ */ new Set();
+    for (const shape of Object.values(shapes)) {
+      categories.add(shape.category || "General");
+    }
+    return [...categories];
+  }
+  function get_shapes_in_category(ui2, options) {
+    const shapes = shapeLibrary;
+    return Object.entries(shapes).filter(([_, shape]) => {
+      return shape.category === options.category_id;
+    }).map(([shape_key, shape_value]) => {
+      return {
+        id: shape_key,
+        title: shape_value.title || shape_key
+      };
+    });
+  }
+  function get_shape_by_name(ui2, options) {
+    const shapes = shapeLibrary;
+    const shape = shapes[options.shape_name];
+    if (!shape) return null;
+    return {
+      id: options.shape_name,
+      ...shape
+    };
+  }
+  function add_cell_of_shape(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const shape_name = options.shape_name;
+    if (!shape_name) {
+      throw new Error("add_cell_of_shape requires a shape_name");
+    }
+    const x = options.x || 100;
+    const y = options.y || 100;
+    const width = options.width || 120;
+    const height = options.height || 80;
+    const text = options.text || "";
+    const style = options.style || "";
+    const parent = resolve_parent(graph, options.parent_id);
+    const shape_entry = get_shape_by_name(ui2, { shape_name });
+    if (!shape_entry) return null;
+    const mergedStyle = normalize_shape_style(
+      shape_name,
+      [shape_entry.style, style].filter((entry) => typeof entry === "string" && entry.trim().length > 0).join(";")
+    );
+    graph.getModel().beginUpdate();
+    try {
+      const cell = create_shape_vertex(graph, {
+        parent,
+        text,
+        x,
+        y,
+        width,
+        height,
+        style: mergedStyle
+      });
+      return cell;
+    } finally {
+      graph.getModel().endUpdate();
+    }
+  }
+  function list_paged_model(ui2, options = {}) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const cells = model.cells;
+    if (!cells) {
+      return [];
+    }
+    function parse_style_attributes(style) {
+      const attributes = {};
+      if (!style) return attributes;
+      const pairs = style.split(";");
+      for (const pair of pairs) {
+        const [key, ...valueParts] = pair.split("=");
+        if (key && valueParts.length > 0) {
+          attributes[key.trim()] = valueParts.join("=").trim();
+        }
+      }
+      return attributes;
+    }
+    function extract_cell_attributes(cell) {
+      const attributes = {};
+      attributes.id = cell.id || "";
+      attributes.edge = cell.edge || false;
+      if (cell.style) {
+        Object.assign(attributes, parse_style_attributes(cell.style));
+      }
+      if (cell.value && typeof cell.value === "object" && cell.value.attributes) {
+        const transformed_attributes = transform_cells_NamedNodeMap_to_attributes(cell);
+        Object.assign(attributes, transformed_attributes);
+      }
+      if (cell.value && typeof cell.value === "string") {
+        attributes.text = cell.value;
+      }
+      return attributes;
+    }
+    function evaluate_filter_expression(expression, attributes) {
+      if (!Array.isArray(expression) || expression.length === 0) {
+        return true;
+      }
+      const [operator, ...operands] = expression;
+      switch (operator) {
+        case "and":
+          return operands.every(
+            (op) => evaluate_filter_expression(op, attributes)
+          );
+        case "or":
+          return operands.some(
+            (op) => evaluate_filter_expression(op, attributes)
+          );
+        case "equal":
+          if (operands.length !== 2) return false;
+          const [key, value] = operands;
+          return attributes[key] === value;
+        default:
+          return true;
+      }
+    }
+    function matches_cell_type(cell, cell_type, isLayer) {
+      switch (cell_type) {
+        case "edge":
+          return cell.edge === true || cell.edge === 1;
+        case "vertex":
+          return cell.edge === false;
+        case "object":
+          return cell.value?.nodeName === "object";
+        case "group":
+          return cell.style === "group";
+        case "layer":
+          return isLayer(cell);
+        default:
+          return true;
+      }
+    }
+    let filtered_cells = Object.values(cells);
+    if (options.filter) {
+      const filter = options.filter;
+      const allParentIds = [
+        ...filter.parent_ids || [],
+        ...filter.layer_ids || []
+      ];
+      filtered_cells = filtered_cells.filter((cell) => {
+        if (options.filter?.cell_type && !matches_cell_type(
+          cell,
+          options.filter.cell_type,
+          mx_isLayer(model.root)
+        )) {
+          return false;
+        }
+        if (options.filter?.attributes && options.filter.attributes.length > 0) {
+          const cellAttributes = extract_cell_attributes(cell);
+          if (!evaluate_filter_expression(options.filter.attributes, cellAttributes)) {
+            return false;
+          }
+        }
+        if (allParentIds.length > 0) {
+          const parent = cell.parent;
+          if (!parent || !parent.id || !allParentIds.includes(parent.id)) {
+            return false;
+          }
+        }
+        if (filter.ids && filter.ids.length > 0) {
+          if (!filter.ids.includes(cell.id)) {
+            return false;
+          }
+        }
+        return true;
+      });
+    }
+    const page = Math.max(0, options.page || 0);
+    const page_size = Math.max(1, options.page_size || 50);
+    const start_index = page * page_size;
+    const cell_ids = filtered_cells.map((cell) => cell.id);
+    const paginated_ids = cell_ids.slice(start_index, start_index + page_size);
+    const transformed_cells = [];
+    for (const cell_id of paginated_ids) {
+      const cell = cells[cell_id];
+      if (cell) {
+        const sanitized_cell = remove_circular_dependencies(cell);
+        const transformed_cell = transform_cell_for_display(sanitized_cell);
+        if (transformed_cell) {
+          const layer_info = get_cell_layer(graph, cell);
+          if (layer_info) {
+            transformed_cell.layer = layer_info;
+          }
+          const tags_info = get_cell_tags(graph, cell);
+          if (tags_info && tags_info.length > 0) {
+            transformed_cell.tags = tags_info;
+          }
+          transformed_cells.push(transformed_cell);
+        }
+      }
+    }
+    return transformed_cells;
+  }
+  function list_layers(ui2) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const root = model.getRoot();
+    const layers = [];
+    for (let i = 0; i < model.getChildCount(root); i++) {
+      const layer = model.getChildAt(root, i);
+      if (layer) {
+        layers.push({
+          id: layer.getId(),
+          name: layer.getValue() || `Layer ${i}`,
+          visible: layer.isVisible(),
+          locked: !layer.isConnectable()
+        });
+      }
+    }
+    return layers;
+  }
+  function set_active_layer(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const layer = model.getCell(options.layer_id);
+    if (!layer) {
+      throw new Error(`Layer with ID ${options.layer_id} not found`);
+    }
+    graph.setDefaultParent(layer);
+    return {
+      id: layer.getId(),
+      name: layer.getValue() || "Unnamed Layer"
+    };
+  }
+  function move_cell_to_layer(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const cell = model.getCell(options.cell_id);
+    const targetLayer = model.getCell(options.target_layer_id);
+    if (!cell) {
+      throw new Error(`Cell with ID ${options.cell_id} not found`);
+    }
+    if (!targetLayer) {
+      throw new Error(
+        `Target layer with ID ${options.target_layer_id} not found`
+      );
+    }
+    model.beginUpdate();
+    try {
+      model.add(targetLayer, cell);
+    } finally {
+      model.endUpdate();
+    }
+    return {
+      moved_cell: options.cell_id,
+      to_layer: options.target_layer_id
+    };
+  }
+  function set_cell_parent(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const cell = model.getCell(options.cell_id);
+    if (!cell) {
+      throw new Error(`Cell with ID ${options.cell_id} not found`);
+    }
+    const parent = model.getCell(options.parent_id);
+    if (!parent) {
+      throw new Error(`Parent cell with ID ${options.parent_id} not found`);
+    }
+    model.beginUpdate();
+    try {
+      model.add(parent, cell);
+    } finally {
+      model.endUpdate();
+    }
+    return {
+      cell_id: options.cell_id,
+      parent_id: options.parent_id
+    };
+  }
+  function get_active_layer(ui2) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const activeLayer = graph.getDefaultParent();
+    return {
+      id: activeLayer.getId(),
+      name: activeLayer.getValue() || "Default Layer"
+    };
+  }
+  function create_layer(ui2, options) {
+    const { editor } = ui2;
+    const { graph } = editor;
+    const model = graph.getModel();
+    const root = model.getRoot();
+    model.beginUpdate();
+    let newLayer;
+    try {
+      newLayer = new window.mxCell(options.name);
+      newLayer.setId(null);
+      model.add(root, newLayer);
+    } finally {
+      model.endUpdate();
+    }
+    return {
+      id: newLayer.getId(),
+      name: options.name
+    };
+  }
+  var PNG_SIZE_WARNING_THRESHOLD = 5 * 1024 * 1024;
+  function export_diagram(ui2, options) {
+    const format = options.format || "xml";
+    const scale = options.scale ?? 1;
+    const border = options.border ?? 0;
+    const background = options.transparent ? null : options.background ?? null;
+    const includeShadow = options.shadow ?? false;
+    const cropToDiagram = options.crop ?? true;
+    const selectionOnly = options.selection_only ?? false;
+    const embedXml = options.embed_xml ?? false;
+    const size = options.size ?? "diagram";
+    const dpi = options.dpi ?? 96;
+    switch (format) {
+      case "xml":
+        return export_xml(ui2, { selectionOnly, size });
+      case "svg":
+        return export_svg(ui2, {
+          scale,
+          border,
+          background,
+          includeShadow,
+          cropToDiagram,
+          selectionOnly,
+          embedXml,
+          size
+        });
+      case "png":
+        return export_png(ui2, {
+          scale,
+          border,
+          background,
+          includeShadow,
+          cropToDiagram,
+          selectionOnly,
+          embedXml,
+          size,
+          dpi
+        });
+      default:
+        throw new Error(`Unsupported export format: ${format}`);
+    }
+  }
+  function export_xml(ui2, params) {
+    const mxUtils = window.mxUtils;
+    const { selectionOnly, size } = params;
+    const ignoreSelection = !selectionOnly;
+    const currentPage = size === "page" || size === "selection";
+    const uncompressed = true;
+    let xml;
+    if (size === "selection" && selectionOnly) {
+      const enc = new window.mxCodec();
+      const node = enc.encode(ui2.editor.graph.getModel());
+      xml = mxUtils.getXml(node);
+    } else {
+      const node = ui2.getXmlFileData(ignoreSelection, currentPage, uncompressed);
+      xml = mxUtils.getXml(node);
+    }
+    return {
+      format: "xml",
+      mimeType: "application/xml",
+      data: xml
+    };
+  }
+  function export_svg(ui2, params) {
+    const mxUtils = window.mxUtils;
+    const Graph = window.Graph;
+    const {
+      scale,
+      border,
+      background,
+      includeShadow,
+      selectionOnly,
+      embedXml,
+      size
+    } = params;
+    const graph = ui2.editor.graph;
+    const ignoreSelection = !selectionOnly && size !== "selection";
+    const bg = background !== "none" ? background : null;
+    if (embedXml) {
+      const currentPage = size === "page" || size === "selection";
+      const svgString2 = ui2.getFileData(
+        false,
+        true,
+        null,
+        null,
+        ignoreSelection,
+        currentPage
+      );
+      const bounds = graph.getGraphBounds();
+      const w2 = Math.ceil(bounds.width * scale + bounds.x * scale + 2 * border);
+      const h2 = Math.ceil(bounds.height * scale + bounds.y * scale + 2 * border);
+      return {
+        format: "svg",
+        mimeType: "image/svg+xml",
+        data: svgString2,
+        width: w2,
+        height: h2
+      };
+    }
+    const svgRoot = graph.getSvg(
+      bg,
+      scale,
+      border,
+      !params.cropToDiagram,
+      null,
+      ignoreSelection
+    );
+    if (graph.shadowVisible || includeShadow) {
+      graph.addSvgShadow(svgRoot, null, null, border === 0);
+    }
+    const svgString = (Graph.xmlDeclaration || '<?xml version="1.0" encoding="UTF-8"?>') + "\n" + (Graph.svgDoctype || "") + "\n" + mxUtils.getXml(svgRoot);
+    const w = parseInt(svgRoot.getAttribute("width")) || 0;
+    const h = parseInt(svgRoot.getAttribute("height")) || 0;
+    return {
+      format: "svg",
+      mimeType: "image/svg+xml",
+      data: svgString,
+      width: w,
+      height: h
+    };
+  }
+  function export_png(ui2, params) {
+    return new Promise((resolve, reject) => {
+      const {
+        scale,
+        border,
+        background,
+        includeShadow,
+        selectionOnly,
+        embedXml,
+        size,
+        dpi,
+        cropToDiagram
+      } = params;
+      const imageCache = {};
+      const ignoreSelection = !selectionOnly && size !== "selection";
+      let xml = null;
+      if (embedXml) {
+        xml = ui2.getFileData(
+          true,
+          null,
+          null,
+          null,
+          ignoreSelection,
+          size === "page" || size === "selection"
+        );
+      }
+      ui2.exportToCanvas(
+        (canvas) => {
+          try {
+            let dataUrl;
+            if (xml != null) {
+              dataUrl = ui2.createImageDataUri(canvas, xml, "png", dpi);
+            } else {
+              dataUrl = canvas.toDataURL("image/png");
+            }
+            const base64Data = dataUrl.replace(/^data:image\/png;base64,/, "");
+            const result = {
+              format: "png",
+              mimeType: "image/png",
+              data: base64Data,
+              width: canvas.width,
+              height: canvas.height
+            };
+            if (base64Data.length > PNG_SIZE_WARNING_THRESHOLD) {
+              const sizeMB = (base64Data.length / (1024 * 1024)).toFixed(1);
+              result.warning = `PNG export is large (${sizeMB} MB). Consider using SVG or reducing scale to reduce size.`;
+            }
+            resolve(result);
+          } catch (err) {
+            reject(err);
+          }
+        },
+        null,
+        imageCache,
+        background,
+        (err) => reject(err),
+        null,
+        ignoreSelection,
+        scale,
+        background === null,
+        includeShadow,
+        null,
+        null,
+        border,
+        !cropToDiagram,
+        false,
+        null
+      );
+    });
+  }
+  function extractXmlFromSvg(svgContent) {
+    try {
+      const parser = new DOMParser();
+      const svgDoc = parser.parseFromString(svgContent, "image/svg+xml");
+      const metadata = svgDoc.querySelector("metadata");
+      if (metadata) {
+        const mxfile2 = metadata.querySelector("mxfile");
+        if (mxfile2) {
+          const serializer = new XMLSerializer();
+          return serializer.serializeToString(mxfile2);
+        }
+      }
+      const defs = svgDoc.querySelector("defs");
+      if (defs) {
+        const mxfile2 = defs.querySelector("mxfile");
+        if (mxfile2) {
+          const serializer = new XMLSerializer();
+          return serializer.serializeToString(mxfile2);
+        }
+      }
+      const mxfile = svgDoc.querySelector("mxfile");
+      if (mxfile) {
+        const serializer = new XMLSerializer();
+        return serializer.serializeToString(mxfile);
+      }
+      return null;
+    } catch (error) {
+      console.error("[import-diagram] Error extracting XML from SVG:", error);
+      return null;
+    }
+  }
+  function extractXmlFromPng(base64Png) {
+    try {
+      const binaryString = atob(base64Png);
+      const bytes = new Uint8Array(binaryString.length);
+      for (let i = 0; i < binaryString.length; i++) {
+        bytes[i] = binaryString.charCodeAt(i);
+      }
+      const pngSignature = [137, 80, 78, 71, 13, 10, 26, 10];
+      for (let i = 0; i < 8; i++) {
+        if (bytes[i] !== pngSignature[i]) {
+          console.error("[import-diagram] Invalid PNG signature");
+          return null;
+        }
+      }
+      let offset = 8;
+      while (offset < bytes.length) {
+        const length = bytes[offset] << 24 | bytes[offset + 1] << 16 | bytes[offset + 2] << 8 | bytes[offset + 3];
+        const chunkType = String.fromCharCode(
+          bytes[offset + 4],
+          bytes[offset + 5],
+          bytes[offset + 6],
+          bytes[offset + 7]
+        );
+        if (chunkType === "tEXt") {
+          const chunkData = bytes.slice(offset + 8, offset + 8 + length);
+          let nullIndex = -1;
+          for (let i = 0; i < chunkData.length; i++) {
+            if (chunkData[i] === 0) {
+              nullIndex = i;
+              break;
+            }
+          }
+          if (nullIndex !== -1) {
+            const keyword = String.fromCharCode(...chunkData.slice(0, nullIndex));
+            const text = String.fromCharCode(...chunkData.slice(nullIndex + 1));
+            if (keyword === "mxGraphModel" || keyword === "mxfile" || text.includes("<mxfile") || text.includes("<mxGraphModel")) {
+              return text;
+            }
+          }
+        }
+        if (chunkType === "zTXt") {
+          const chunkData = bytes.slice(offset + 8, offset + 8 + length);
+          let nullIndex = -1;
+          for (let i = 0; i < chunkData.length; i++) {
+            if (chunkData[i] === 0) {
+              nullIndex = i;
+              break;
+            }
+          }
+          if (nullIndex !== -1) {
+            const keyword = String.fromCharCode(...chunkData.slice(0, nullIndex));
+            const compressionMethod = chunkData[nullIndex + 1];
+            if (compressionMethod === 0) {
+              const compressedData = chunkData.slice(nullIndex + 2);
+              if (typeof DecompressionStream !== "undefined") {
+                console.warn(
+                  "[import-diagram] zTXt chunk found but decompression not implemented in sync context"
+                );
+              }
+            }
+          }
+        }
+        offset += 12 + length;
+      }
+      return null;
+    } catch (error) {
+      console.error("[import-diagram] Error extracting XML from PNG:", error);
+      return null;
+    }
+  }
+  function import_diagram(ui2, options) {
+    const {
+      data,
+      format,
+      mode = "replace",
+      filename
+    } = options;
+    if (!data) {
+      return { success: false, message: "No data provided" };
+    }
+    let xml = null;
+    switch (format) {
+      case "xml":
+        xml = data;
+        break;
+      case "svg":
+        let svgContent = data;
+        if (!data.trim().startsWith("<")) {
+          try {
+            svgContent = atob(data);
+          } catch (e) {
+            return { success: false, message: "Invalid base64 SVG data" };
+          }
+        }
+        xml = extractXmlFromSvg(svgContent);
+        if (!xml) {
+          return { success: false, message: "Could not extract XML from SVG" };
+        }
+        break;
+      case "png":
+        xml = extractXmlFromPng(data);
+        if (!xml) {
+          return { success: false, message: "Could not extract XML from PNG" };
+        }
+        break;
+      default:
+        return { success: false, message: `Unsupported format: ${format}` };
+    }
+    if (!xml) {
+      return { success: false, message: "Failed to extract XML from input" };
+    }
+    const mxUtils = window.mxUtils;
+    if (!mxUtils) {
+      return { success: false, message: "mxUtils not available" };
+    }
+    try {
+      const doc = mxUtils.parseXml(xml);
+      if (!doc || !doc.documentElement) {
+        return { success: false, message: "Invalid XML structure" };
+      }
+      const root = doc.documentElement;
+      if (root.nodeName !== "mxfile" && root.nodeName !== "mxGraphModel") {
+        return {
+          success: false,
+          message: `Invalid Draw.io XML: expected mxfile or mxGraphModel, got ${root.nodeName}`
+        };
+      }
+      const { editor } = ui2;
+      const { graph } = editor;
+      const model = graph.getModel();
+      let cellCount = 0;
+      const cells = doc.getElementsByTagName("mxCell");
+      cellCount = cells.length;
+      switch (mode) {
+        case "replace":
+          let graphModelElement = doc.documentElement;
+          if (graphModelElement.nodeName === "mxfile") {
+            const diagram = graphModelElement.querySelector("diagram");
+            if (diagram) {
+              const mxGraphModel = diagram.querySelector("mxGraphModel");
+              if (mxGraphModel) {
+                graphModelElement = mxGraphModel;
+              }
+            }
+          }
+          if (editor.setGraphXml) {
+            editor.setGraphXml(graphModelElement);
+            graph.refresh();
+            graph.fit();
+          } else {
+            model.clear();
+            model.setRoot(new window.mxCell());
+            const codec = new window.mxCodec(
+              graphModelElement.ownerDocument
+            );
+            codec.decode(graphModelElement, model);
+          }
+          return {
+            success: true,
+            message: `Diagram replaced successfully${filename ? ` from ${filename}` : ""}`,
+            cells: cellCount
+          };
+        case "add":
+          model.beginUpdate();
+          try {
+            const importedDoc = mxUtils.parseXml(xml);
+            const importedRoot = importedDoc.documentElement;
+            let graphModel = importedRoot;
+            if (importedRoot.nodeName === "mxfile") {
+              const diagram = importedRoot.querySelector("diagram");
+              if (diagram) {
+                graphModel = diagram.querySelector("mxGraphModel") || diagram;
+              }
+            }
+            const importedRootCell = graphModel.querySelector("root");
+            if (importedRootCell) {
+              const defaultParent = graph.getDefaultParent();
+              const importedCells = importedRootCell.querySelectorAll("mxCell");
+              const idMapping = {};
+              importedCells.forEach((cell) => {
+                const oldId = cell.getAttribute("id");
+                if (oldId === "0" || oldId === "1") {
+                  return;
+                }
+                const newCell = new window.mxCell();
+                newCell.setId(null);
+                if (cell.hasAttribute("value")) {
+                  newCell.setValue(cell.getAttribute("value"));
+                }
+                if (cell.hasAttribute("style")) {
+                  newCell.setStyle(cell.getAttribute("style"));
+                }
+                if (cell.hasAttribute("vertex")) {
+                  newCell.vertex = cell.getAttribute("vertex") === "1";
+                }
+                if (cell.hasAttribute("edge")) {
+                  newCell.edge = cell.getAttribute("edge") === "1";
+                }
+                const geo = cell.querySelector("mxGeometry");
+                if (geo) {
+                  const geometry = new window.mxGeometry(
+                    parseFloat(geo.getAttribute("x") || "0"),
+                    parseFloat(geo.getAttribute("y") || "0"),
+                    parseFloat(geo.getAttribute("width") || "0"),
+                    parseFloat(geo.getAttribute("height") || "0")
+                  );
+                  if (geo.getAttribute("relative") === "1") {
+                    geometry.relative = true;
+                  }
+                  newCell.setGeometry(geometry);
+                }
+                model.add(defaultParent, newCell);
+                idMapping[oldId] = newCell.getId();
+              });
+              importedCells.forEach((cell) => {
+                const oldId = cell.getAttribute("id");
+                const newId = idMapping[oldId];
+                if (!newId) return;
+                const newCell = model.getCell(newId);
+                if (!newCell) return;
+                const parentId = cell.getAttribute("parent");
+                if (parentId && idMapping[parentId]) {
+                  const parentCell = model.getCell(idMapping[parentId]);
+                  if (parentCell) {
+                    model.add(parentCell, newCell);
+                  }
+                }
+                if (newCell.edge) {
+                  const sourceId = cell.getAttribute("source");
+                  const targetId = cell.getAttribute("target");
+                  if (sourceId && idMapping[sourceId]) {
+                    const sourceCell = model.getCell(idMapping[sourceId]);
+                    if (sourceCell) {
+                      model.setTerminal(newCell, sourceCell, true);
+                    }
+                  }
+                  if (targetId && idMapping[targetId]) {
+                    const targetCell = model.getCell(idMapping[targetId]);
+                    if (targetCell) {
+                      model.setTerminal(newCell, targetCell, false);
+                    }
+                  }
+                }
+              });
+            }
+          } finally {
+            model.endUpdate();
+          }
+          return {
+            success: true,
+            message: `Diagram imported successfully (added to current diagram)${filename ? ` from ${filename}` : ""}`,
+            cells: cellCount
+          };
+        case "new-page":
+          if (!ui2.pages || !ui2.insertPage) {
+            return {
+              success: false,
+              message: "New page creation not supported in this Draw.io version"
+            };
+          }
+          const newPage = ui2.insertPage();
+          if (!newPage) {
+            return { success: false, message: "Failed to create new page" };
+          }
+          ui2.selectPage(newPage);
+          model.beginUpdate();
+          try {
+            let pageGraphModel = doc.documentElement;
+            if (pageGraphModel.nodeName === "mxfile") {
+              const diagram = pageGraphModel.querySelector("diagram");
+              if (diagram) {
+                const mxGraphModel = diagram.querySelector("mxGraphModel");
+                if (mxGraphModel) {
+                  pageGraphModel = mxGraphModel;
+                }
+              }
+            }
+            if (editor.setGraphXml) {
+              editor.setGraphXml(pageGraphModel);
+              graph.refresh();
+              graph.fit();
+            } else {
+              const codec = new window.mxCodec(
+                pageGraphModel.ownerDocument
+              );
+              codec.decode(pageGraphModel, model);
+            }
+          } finally {
+            model.endUpdate();
+          }
+          if (filename && newPage.setName) {
+            const pageName = filename.replace(/\.[^/.]+$/, "");
+            newPage.setName(pageName);
+          }
+          return {
+            success: true,
+            message: `Diagram imported successfully (new page created)${filename ? `: ${filename}` : ""}`,
+            pages: ui2.pages.length,
+            cells: cellCount
+          };
+        default:
+          return { success: false, message: `Unsupported import mode: ${mode}` };
+      }
+    } catch (error) {
+      console.error("[import-diagram] Error importing diagram:", error);
+      return {
+        success: false,
+        message: `Import failed: ${error instanceof Error ? error.message : "Unknown error"}`
+      };
+    }
+  }
+
+  // src/plugin.ts
+  function reply_name(event_name, request_id) {
+    return `${event_name}.${request_id}`;
+  }
+  var createToolHandler = (toolName, parameterKeys, executeFunction) => {
+    return (request) => {
+      const optionEntries = Object.entries(request).filter(([key, _value]) => {
+        return parameterKeys.has(key);
+      });
+      const options = optionEntries.reduce(
+        (acc, [key, value]) => {
+          acc[key] = value;
+          return acc;
+        },
+        {}
+      );
+      const sendReply = (result, success, error) => {
+        const reply = {
+          __event: reply_name(toolName, request.__request_id),
+          __request_id: request.__request_id,
+          success,
+          result: success ? remove_circular_dependencies(result) : void 0,
+          error: !success ? remove_circular_dependencies(error) : void 0
+        };
+        if (wsManager) {
+          wsManager.send(reply);
+        }
+        return reply;
+      };
+      try {
+        const result = executeFunction(ui, options);
+        if (result instanceof Promise) {
+          result.then(
+            (resolved) => sendReply(resolved, true),
+            (err) => {
+              console.error(
+                `[plugin] Tool ${toolName} failed for request ID ${request.__request_id}:`,
+                err
+              );
+              sendReply(void 0, false, err);
+            }
+          );
+          return void 0;
+        }
+        return sendReply(result, true);
+      } catch (error) {
+        console.error(
+          `[plugin] Tool ${toolName} failed for request ID ${request.__request_id}:`,
+          error
+        );
+        return sendReply(void 0, false, error);
+      }
+    };
+  };
+  var ui;
+  var wsManager = null;
+  var settingsDialog = null;
+  var toolDefinitions = [
+    {
+      name: "get-selected-cell",
+      params: /* @__PURE__ */ new Set([]),
+      handler: (ui2, _options) => {
+        return ui2.editor.graph.getSelectionCell() || "no cell selected";
+      }
+    },
+    {
+      name: "add-rectangle",
+      params: /* @__PURE__ */ new Set(["x", "y", "width", "height", "text", "style", "parent_id"]),
+      handler: add_new_rectangle
+    },
+    {
+      name: "delete-cell-by-id",
+      params: /* @__PURE__ */ new Set(["cell_id"]),
+      handler: delete_cell_by_id
+    },
+    {
+      name: "add-edge",
+      params: /* @__PURE__ */ new Set(["source_id", "target_id", "style", "text", "parent_id", "points"]),
+      handler: add_edge
+    },
+    {
+      name: "get-shape-categories",
+      params: /* @__PURE__ */ new Set([]),
+      handler: get_shape_categories
+    },
+    {
+      name: "get-shapes-in-category",
+      params: /* @__PURE__ */ new Set(["category_id"]),
+      handler: get_shapes_in_category
+    },
+    {
+      name: "get-shape-by-name",
+      params: /* @__PURE__ */ new Set(["shape_name"]),
+      handler: get_shape_by_name
+    },
+    {
+      name: "add-cell-of-shape",
+      params: /* @__PURE__ */ new Set([
+        "shape_name",
+        "x",
+        "y",
+        "width",
+        "height",
+        "text",
+        "style",
+        "parent_id"
+      ]),
+      handler: add_cell_of_shape
+    },
+    {
+      name: "set-cell-shape",
+      params: /* @__PURE__ */ new Set(["cell_id", "shape_name"]),
+      handler: set_cell_shape
+    },
+    {
+      name: "set-cell-data",
+      params: /* @__PURE__ */ new Set(["cell_id", "key", "value"]),
+      handler: (ui2, options) => {
+        return set_cell_data(ui2, options);
+      }
+    },
+    {
+      name: "list-paged-model",
+      params: /* @__PURE__ */ new Set(["page", "page_size", "filter"]),
+      handler: list_paged_model
+    },
+    {
+      name: "edit-cell",
+      params: /* @__PURE__ */ new Set(["cell_id", "text", "x", "y", "width", "height", "style"]),
+      handler: edit_cell
+    },
+    {
+      name: "edit-edge",
+      params: /* @__PURE__ */ new Set(["cell_id", "text", "source_id", "target_id", "style", "points"]),
+      handler: edit_edge
+    },
+    {
+      name: "list-layers",
+      params: /* @__PURE__ */ new Set([]),
+      handler: list_layers
+    },
+    {
+      name: "set-active-layer",
+      params: /* @__PURE__ */ new Set(["layer_id"]),
+      handler: set_active_layer
+    },
+    {
+      name: "move-cell-to-layer",
+      params: /* @__PURE__ */ new Set(["cell_id", "target_layer_id"]),
+      handler: move_cell_to_layer
+    },
+    {
+      name: "set-cell-parent",
+      params: /* @__PURE__ */ new Set(["cell_id", "parent_id"]),
+      handler: set_cell_parent
+    },
+    {
+      name: "get-active-layer",
+      params: /* @__PURE__ */ new Set([]),
+      handler: get_active_layer
+    },
+    {
+      name: "create-layer",
+      params: /* @__PURE__ */ new Set(["name"]),
+      handler: create_layer
+    },
+    {
+      name: "export-diagram",
+      params: /* @__PURE__ */ new Set([
+        "format",
+        "scale",
+        "border",
+        "background",
+        "shadow",
+        "crop",
+        "selection_only",
+        "transparent",
+        "dpi",
+        "embed_xml",
+        "size"
+      ]),
+      handler: export_diagram
+    },
+    {
+      name: "import-diagram",
+      params: /* @__PURE__ */ new Set(["data", "format", "mode", "filename"]),
+      handler: import_diagram
+    }
+  ];
+  var toolHandlers = /* @__PURE__ */ new Map();
+  var handleWebSocketMessage = (message) => {
+    console.debug("[plugin] Received WebSocket message:", message);
+    if (message.__event && toolHandlers.has(message.__event)) {
+      const handler = toolHandlers.get(message.__event);
+      if (handler) {
+        handler(message);
+      }
+    }
+  };
+  var initializeWebSocket = async () => {
+    const config = await fetchPluginConfig();
+    const wsUrl = buildWebSocketUrl(config);
+    wsManager = createWebSocketManager({
+      url: wsUrl,
+      maxReconnectAttempts: 5,
+      reconnectDelay: 3e3,
+      pingInterval: 3e4
+    });
+    wsManager.onMessage(handleWebSocketMessage);
+    wsManager.connect();
+    console.log(`[plugin] WebSocket initialized with URL: ${wsUrl}`);
+  };
+  var initializeSettingsDialog = () => {
+    const config = readPluginConfig();
+    const connectionState = wsManager ? wsManager.getState() : "disconnected";
+    const initialState = {
+      config: { ...config },
+      connectionState,
+      isSaving: false,
+      formData: {
+        port: config.websocketPort.toString()
+      },
+      errors: {}
+    };
+    const actions = {
+      onSave: (newConfig) => {
+        writePluginConfig(newConfig);
+        if (wsManager) {
+          wsManager.disconnect();
+        }
+        initializeWebSocket();
+        if (settingsDialog) {
+          settingsDialog.update({
+            ...initialState,
+            config: { ...newConfig },
+            connectionState: wsManager ? wsManager.getState() : "disconnected",
+            isSaving: false
+          });
+        }
+        console.log("[plugin] Configuration saved and WebSocket reinitialized");
+      },
+      onClose: () => {
+        if (settingsDialog) {
+          hideSettingsDialog(settingsDialog);
+        }
+      },
+      onPing: async () => {
+        if (wsManager) {
+          return await wsManager.ping();
+        }
+        return false;
+      },
+      onReconnect: () => {
+        if (wsManager) {
+          wsManager.disconnect();
+          wsManager.connect();
+        }
+      }
+    };
+    settingsDialog = createSettingsDialog(initialState, actions);
+  };
+  var showSettings = () => {
+    if (!settingsDialog) {
+      initializeSettingsDialog();
+    }
+    if (settingsDialog) {
+      const config = readPluginConfig();
+      const connectionState = wsManager ? wsManager.getState() : "disconnected";
+      settingsDialog.update({
+        config: { ...config },
+        connectionState,
+        isSaving: false,
+        formData: {
+          port: config.websocketPort.toString()
+        },
+        errors: {}
+      });
+      showSettingsDialog(settingsDialog);
+    }
+  };
+  var addMenuItem = (ui2) => {
+    if (!ui2.menus) {
+      console.warn(
+        "[plugin] Menu bar not available, cannot add MCP Settings menu item"
+      );
+      return;
+    }
+    const menubar = ui2.menus;
+    try {
+      let targetMenu = menubar.get("extras") || menubar.get("file") || menubar.get("edit");
+      if (!targetMenu) {
+        console.warn("[plugin] Could not find suitable menu to add MCP Settings");
+        return;
+      }
+      ui2.actions.addAction("Draw.io MCP", function() {
+        showSettings();
+      });
+      var oldFunct = targetMenu.funct;
+      targetMenu.funct = function(targetMenu2, parent) {
+        oldFunct.apply(this, arguments);
+        ui2.menus.addMenuItems(targetMenu2, ["Draw.io MCP"], parent);
+      };
+    } catch (error) {
+      console.error("[plugin] Failed to add menu item:", error);
+    }
+  };
+  function initPlugin() {
+    console.debug("[plugin] Loading Draw.io MCP Plugin...");
+    const checkInterval = setInterval(() => {
+      if (window.Draw) {
+        clearInterval(checkInterval);
+        window.Draw.loadPlugin((drawioUI) => {
+          console.debug("[plugin] Plugin loaded successfully");
+          ui = drawioUI;
+          if (window.__DRAWIO_MCP_TEST_HOOKS__ === true) {
+            window.ui = drawioUI;
+          }
+          toolDefinitions.forEach((def) => {
+            const handler = createToolHandler(def.name, def.params, def.handler);
+            toolHandlers.set(def.name, handler);
+          });
+          initializeWebSocket();
+          initializeSettingsDialog();
+          addMenuItem(ui);
+          console.info("[plugin] MCP Plugin fully initialized");
+        });
+      }
+    }, 1e3);
+  }
+  if (typeof window !== "undefined") {
+    if (document.readyState === "loading") {
+      document.addEventListener("DOMContentLoaded", initPlugin);
+    } else {
+      initPlugin();
+    }
+  }
+})();