@yh-ui/flow 0.1.21

package/dist/utils/bpmn.mjs

@@ -0,0 +1,430 @@
+const BPMN_NS = "http://www.omg.org/spec/BPMN/20100524/MODEL";
+const BPMN_DI_NS = "http://www.omg.org/spec/BPMN/20100524/DI";
+const BPMN_DC_NS = "http://www.omg.org/spec/BPMN/20100524/DC";
+const NODE_TYPE_TO_BPMN = {
+  "bpmn-start": "startEvent",
+  "bpmn-end": "endEvent",
+  "bpmn-task": "task",
+  "bpmn-service-task": "serviceTask",
+  "bpmn-user-task": "userTask",
+  "bpmn-exclusive-gateway": "exclusiveGateway",
+  "bpmn-parallel-gateway": "parallelGateway",
+  "bpmn-inclusive-gateway": "inclusiveGateway"
+};
+const BPMN_TO_NODE_TYPE = {
+  startEvent: "bpmn-start",
+  endEvent: "bpmn-end",
+  task: "bpmn-task",
+  serviceTask: "bpmn-service-task",
+  userTask: "bpmn-user-task",
+  exclusiveGateway: "bpmn-exclusive-gateway",
+  parallelGateway: "bpmn-parallel-gateway",
+  inclusiveGateway: "bpmn-inclusive-gateway"
+};
+const GATEWAY_DIRECTION = {
+  "bpmn-exclusive-gateway": "diverging",
+  "bpmn-parallel-gateway": "diverging",
+  "bpmn-inclusive-gateway": "diverging"
+};
+export function flowToBpmnXml(nodes, edges, options = {}) {
+  const {
+    processId = "Process_" + Date.now(),
+    processName = "Flow Process",
+    includeDi = true,
+    defaultNodeWidth = 100,
+    defaultNodeHeight = 80
+  } = options;
+  const diBounds = [];
+  const diEdges = [];
+  const bpmnElements = [];
+  for (const node of nodes) {
+    const bpmnType = NODE_TYPE_TO_BPMN[node.type];
+    if (!bpmnType) continue;
+    const nodeWidth = node.width || defaultNodeWidth;
+    const nodeHeight = node.height || defaultNodeHeight;
+    let attributes = `id="${node.id}"`;
+    const label = node.data?.name || node.data?.label || node.id;
+    if (label) {
+      attributes += ` name="${label}"`;
+    }
+    if (bpmnType.includes("Gateway")) {
+      const direction = GATEWAY_DIRECTION[node.type] || "diverging";
+      attributes += ` gatewayDirection="${direction}"`;
+    }
+    if (bpmnType === "serviceTask") {
+      attributes += ` implementation="delegateExpression"`;
+      if (node.data?.implementation) {
+        attributes += ` delegateExpression="${node.data.implementation}"`;
+      }
+    }
+    if (bpmnType === "userTask") {
+      if (node.data?.assignee) {
+        attributes += ` assignee="${node.data.assignee}"`;
+      }
+      if (node.data?.candidateUsers) {
+        attributes += ` candidateUsers="${node.data.candidateUsers}"`;
+      }
+    }
+    bpmnElements.push(`    <bpmn:${bpmnType} ${attributes}/>`);
+    if (includeDi) {
+      diBounds.push({
+        id: `${node.id}_gui`,
+        x: node.position.x,
+        y: node.position.y,
+        width: nodeWidth,
+        height: nodeHeight
+      });
+    }
+  }
+  for (const edge of edges) {
+    let attributes = `id="${edge.id}"`;
+    if (edge.source && edge.target) {
+      attributes += ` sourceRef="${edge.source}" targetRef="${edge.target}"`;
+    }
+    if (edge.type && edge.type !== "default") {
+      const edgeType = edge.type.replace("Edge", "").toLowerCase();
+      if (["smooth", "step", "bezier"].includes(edgeType)) {
+        attributes += ` messageVisibleKind="signal"`;
+      }
+    }
+    if (edge.data?.conditionExpression) {
+      bpmnElements.push(
+        `    <bpmn:sequenceFlow id="${edge.id}" sourceRef="${edge.source}" targetRef="${edge.target}">
+      <bpmn:conditionExpression xsi:type="tFormalExpression" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">${edge.data.conditionExpression}</bpmn:conditionExpression>
+    </bpmn:sequenceFlow>`
+      );
+    } else {
+      bpmnElements.push(`    <bpmn:sequenceFlow ${attributes}/>`);
+    }
+    if (includeDi) {
+      diEdges.push({
+        id: `${edge.id}_di`,
+        sourceRef: edge.source || "",
+        targetRef: edge.target || ""
+      });
+    }
+  }
+  let xml = `<?xml version="1.0" encoding="UTF-8"?>
+<bpmn:definitions xmlns:bpmn="${BPMN_NS}" xmlns:bpmndi="${BPMN_DI_NS}" xmlns:dc="${BPMN_DC_NS}" xmlns:di="${BPMN_DI_NS}" id="definitions_${processId}" targetNamespace="http://bpmn.io/schema/bpmn">
+  <bpmn:process id="${processId}" name="${processName}" isExecutable="false">
+${bpmnElements.join("\n")}
+  </bpmn:process>`;
+  if (includeDi) {
+    xml += `
+  <bpmndi:BPMNDiagram id="BPMNDiagram_1">
+    <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="${processId}">`;
+    for (const bound of diBounds) {
+      xml += `
+      <bpmndi:BPMNShape id="${bound.id}" bpmnElement="${bound.id.replace("_gui", "")}">
+        <dc:Bounds x="${bound.x}" y="${bound.y}" width="${bound.width}" height="${bound.height}"/>
+      </bpmndi:BPMNShape>`;
+    }
+    for (const edge of diEdges) {
+      xml += `
+      <bpmndi:BPMNEdge id="${edge.id}_di" bpmnElement="${edge.id}"/>`;
+    }
+    xml += `
+    </bpmndi:BPMNPlane>
+  </bpmndi:BPMNDiagram>`;
+  }
+  xml += `
+</bpmn:definitions>`;
+  return { xml, processId };
+}
+export function bpmnXmlToFlow(xml, options = {}) {
+  const { defaultPosition = { x: 100, y: 100 }, nodeSpacing = 150 } = options;
+  const nodes = [];
+  const edges = [];
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(xml, "text/xml");
+  const parseError = doc.querySelector("parsererror");
+  if (parseError) {
+    throw new Error(`BPMN XML \u89E3\u6790\u5931\u8D25: ${parseError.textContent}`);
+  }
+  const process = doc.querySelector("bpmn\\:process, process");
+  const processId = process?.getAttribute("id") || "";
+  const processName = process?.getAttribute("name") || "";
+  const diShapes = /* @__PURE__ */ new Map();
+  const bpmnShapes = Array.from(doc.querySelectorAll("bpmndi\\:BPMNShape, BPMNShape"));
+  for (const shape of bpmnShapes) {
+    const bpmnElement = shape.getAttribute("bpmnElement");
+    const bounds = shape.querySelector("dc\\:Bounds, Bounds");
+    if (bpmnElement && bounds) {
+      diShapes.set(bpmnElement, {
+        x: parseFloat(bounds.getAttribute("x") || "0"),
+        y: parseFloat(bounds.getAttribute("y") || "0"),
+        width: parseFloat(bounds.getAttribute("width") || "100"),
+        height: parseFloat(bounds.getAttribute("height") || "80")
+      });
+    }
+  }
+  const findBpmnElements = (root) => {
+    const tags = [
+      "startEvent",
+      "endEvent",
+      "task",
+      "serviceTask",
+      "userTask",
+      "exclusiveGateway",
+      "parallelGateway",
+      "inclusiveGateway"
+    ];
+    const elements = [];
+    tags.forEach((tag) => {
+      const perTagElements = [];
+      perTagElements.push(...Array.from(root.getElementsByTagNameNS(BPMN_NS, tag)));
+      perTagElements.push(...Array.from(root.getElementsByTagName(tag)).filter((el) => !el.prefix));
+      if (perTagElements.length === 0) {
+        perTagElements.push(...Array.from(root.querySelectorAll(`[localName="${tag}"]`)));
+      }
+      elements.push(...perTagElements);
+    });
+    return elements;
+  };
+  const bpmnElements = findBpmnElements(doc);
+  const nodeMap = /* @__PURE__ */ new Map();
+  let maxY = defaultPosition.y;
+  for (const element of bpmnElements) {
+    const id = element.getAttribute("id");
+    const name = element.getAttribute("name") || "";
+    const localName = element.localName;
+    const nodeType = BPMN_TO_NODE_TYPE[localName];
+    if (!nodeType || !id) continue;
+    const di = diShapes.get(id);
+    const position = di ? { x: di.x, y: di.y } : { x: defaultPosition.x, y: defaultPosition.y + maxY };
+    const width = di?.width || 100;
+    const height = di?.height || 80;
+    const data = { label: name || id };
+    if (localName === "userTask") {
+      data.assignee = element.getAttribute("assignee") || "";
+      data.candidateUsers = element.getAttribute("candidateUsers") || "";
+    }
+    if (localName === "serviceTask") {
+      data.implementation = element.getAttribute("delegateExpression") || "";
+    }
+    const node = {
+      id,
+      type: nodeType,
+      position,
+      data,
+      width,
+      height,
+      selected: false,
+      dragging: false
+    };
+    nodes.push(node);
+    nodeMap.set(id, {
+      x: position.x,
+      y: position.y,
+      width,
+      height,
+      outgoing: []
+    });
+    maxY += nodeSpacing;
+  }
+  const sequenceFlows = [
+    ...Array.from(doc.getElementsByTagNameNS(BPMN_NS, "sequenceFlow")),
+    ...Array.from(doc.getElementsByTagName("sequenceFlow")).filter((el) => !el.prefix)
+  ];
+  for (const flow of sequenceFlows) {
+    const id = flow.getAttribute("id");
+    const sourceRef = flow.getAttribute("sourceRef");
+    const targetRef = flow.getAttribute("targetRef");
+    if (!id || !sourceRef || !targetRef) continue;
+    const conditionExpr = flow.querySelector("bpmn\\:conditionExpression, conditionExpression");
+    const conditionText = conditionExpr?.textContent?.trim();
+    const sourceNode = nodeMap.get(sourceRef);
+    if (sourceNode) {
+      sourceNode.outgoing.push(id);
+    }
+    const edge = {
+      id,
+      source: sourceRef,
+      target: targetRef,
+      type: "smoothstep",
+      animated: false,
+      selected: false,
+      data: conditionText ? { conditionExpression: conditionText } : {}
+    };
+    edges.push(edge);
+  }
+  if (diShapes.size === 0) {
+    applySimpleLayout(nodes, edges, nodeSpacing);
+  }
+  return { nodes, edges, processId, processName };
+}
+function applySimpleLayout(nodes, edges, spacing) {
+  const inDegree = /* @__PURE__ */ new Map();
+  const adjacency = /* @__PURE__ */ new Map();
+  for (const node of nodes) {
+    inDegree.set(node.id, 0);
+    adjacency.set(node.id, []);
+  }
+  for (const edge of edges) {
+    if (edge.source && edge.target) {
+      const current = inDegree.get(edge.target) || 0;
+      inDegree.set(edge.target, current + 1);
+      const outgoing = adjacency.get(edge.source) || [];
+      outgoing.push(edge.target);
+      adjacency.set(edge.source, outgoing);
+    }
+  }
+  const queue = [];
+  for (const [nodeId, degree] of inDegree) {
+    if (degree === 0) queue.push(nodeId);
+  }
+  const levels = /* @__PURE__ */ new Map();
+  const visited = /* @__PURE__ */ new Set();
+  let level = 0;
+  while (queue.length > 0) {
+    const levelSize = queue.length;
+    for (let i = 0; i < levelSize; i++) {
+      const nodeId = queue.shift();
+      if (visited.has(nodeId)) continue;
+      visited.add(nodeId);
+      levels.set(nodeId, level);
+      const outgoing = adjacency.get(nodeId) || [];
+      for (const targetId of outgoing) {
+        if (!visited.has(targetId)) {
+          queue.push(targetId);
+        }
+      }
+    }
+    level++;
+  }
+  for (const node of nodes) {
+    if (!levels.has(node.id)) {
+      levels.set(node.id, level);
+    }
+  }
+  const levelNodes = /* @__PURE__ */ new Map();
+  for (const node of nodes) {
+    const l = levels.get(node.id) || 0;
+    const nodesAtLevel = levelNodes.get(l) || [];
+    nodesAtLevel.push(node);
+    levelNodes.set(l, nodesAtLevel);
+  }
+  for (const [l, nodesAtLevel] of levelNodes) {
+    nodesAtLevel.forEach((node, index) => {
+      node.position = {
+        x: 100 + l * 250,
+        y: 100 + index * spacing
+      };
+    });
+  }
+}
+export function validateBpmnXml(xml) {
+  try {
+    const parser = new DOMParser();
+    const doc = parser.parseFromString(xml, "text/xml");
+    const parseError = doc.querySelector("parsererror");
+    if (parseError) {
+      return { valid: false, error: "XML \u683C\u5F0F\u9519\u8BEF" };
+    }
+    const definitions = doc.querySelector("bpmn\\:definitions, definitions");
+    if (!definitions) {
+      return { valid: false, error: "\u7F3A\u5C11 BPMN definitions \u6839\u5143\u7D20" };
+    }
+    const process = doc.querySelector("bpmn\\:process, process");
+    if (!process) {
+      return { valid: false, error: "\u7F3A\u5C11 BPMN process \u5143\u7D20" };
+    }
+    return { valid: true };
+  } catch (e) {
+    return { valid: false, error: e instanceof Error ? e.message : "\u672A\u77E5\u9519\u8BEF" };
+  }
+}
+export function generateSampleBpmnXml() {
+  const sampleNodes = [
+    {
+      id: "start",
+      type: "bpmn-start",
+      position: { x: 100, y: 200 },
+      data: { label: "\u5F00\u59CB", name: "\u5F00\u59CB" },
+      width: 40,
+      height: 40,
+      selected: false,
+      dragging: false
+    },
+    {
+      id: "task1",
+      type: "bpmn-user-task",
+      position: { x: 250, y: 180 },
+      data: { label: "\u5BA1\u6279\u4EFB\u52A1", name: "\u5BA1\u6279\u4EFB\u52A1", assignee: "admin" },
+      width: 120,
+      height: 80,
+      selected: false,
+      dragging: false
+    },
+    {
+      id: "gateway",
+      type: "bpmn-exclusive-gateway",
+      position: { x: 450, y: 200 },
+      data: { label: "\u662F\u5426\u901A\u8FC7", name: "\u662F\u5426\u901A\u8FC7" },
+      width: 50,
+      height: 50,
+      selected: false,
+      dragging: false
+    },
+    {
+      id: "task2",
+      type: "bpmn-service-task",
+      position: { x: 600, y: 100 },
+      data: { label: "\u5904\u7406\u4E1A\u52A1", name: "\u5904\u7406\u4E1A\u52A1", implementation: "${myService}" },
+      width: 120,
+      height: 80,
+      selected: false,
+      dragging: false
+    },
+    {
+      id: "end",
+      type: "bpmn-end",
+      position: { x: 800, y: 200 },
+      data: { label: "\u7ED3\u675F", name: "\u7ED3\u675F" },
+      width: 40,
+      height: 40,
+      selected: false,
+      dragging: false
+    }
+  ];
+  const sampleEdges = [
+    {
+      id: "e1",
+      source: "start",
+      target: "task1",
+      type: "smoothstep",
+      selected: false,
+      animated: false
+    },
+    {
+      id: "e2",
+      source: "task1",
+      target: "gateway",
+      type: "smoothstep",
+      selected: false,
+      animated: false
+    },
+    {
+      id: "e3",
+      source: "gateway",
+      target: "task2",
+      type: "smoothstep",
+      selected: false,
+      animated: false,
+      data: { conditionExpression: "${approved == true}" }
+    },
+    {
+      id: "e4",
+      source: "gateway",
+      target: "end",
+      type: "smoothstep",
+      selected: false,
+      animated: false
+    },
+    { id: "e5", source: "task2", target: "end", type: "smooth", selected: false, animated: false }
+  ];
+  return flowToBpmnXml(sampleNodes, sampleEdges, {
+    processId: "SampleProcess",
+    processName: "\u793A\u4F8B\u6D41\u7A0B"
+  }).xml;
+}