@uigraph/sdk 1.2.4 → 1.2.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -1,17 +1,17 @@
1
1
  const require_component_type = require("./__component-type.69UkUMKl.cjs");
2
- const require_headless = require("./__headless.DGmyg-me.cjs");
2
+ const require_headless = require("./__headless.DbTnxFi3.cjs");
3
3
  let daily_code = require("daily-code");
4
4
  daily_code = require_component_type.__toESM(daily_code);
5
5
  let zod = require("zod");
6
6
  zod = require_component_type.__toESM(zod);
7
7
  let __xyflow_react = require("@xyflow/react");
8
8
  __xyflow_react = require_component_type.__toESM(__xyflow_react);
9
+ let markdown_to_quill_delta = require("markdown-to-quill-delta");
10
+ markdown_to_quill_delta = require_component_type.__toESM(markdown_to_quill_delta);
9
11
  let dagre = require("dagre");
10
12
  dagre = require_component_type.__toESM(dagre);
11
13
  let mermaid = require("mermaid");
12
14
  mermaid = require_component_type.__toESM(mermaid);
13
- let markdown_to_quill_delta = require("markdown-to-quill-delta");
14
- markdown_to_quill_delta = require_component_type.__toESM(markdown_to_quill_delta);
15
15
  function mapDynamoTypeToAstType(dynamoType) {
16
16
  switch (dynamoType) {
17
17
  case "S": return "string";
@@ -1779,77 +1779,433 @@ function syncBaseData(prev, next, options) {
1779
1779
  }
1780
1780
  return updated;
1781
1781
  }
1782
- const LAYOUT_SPACING = {
1783
- SUBGRAPH_HEADER_HEIGHT: 35,
1784
- SUBGRAPH_PADDING: 8,
1785
- SUBGRAPH_CONTENT_TOP_MARGIN: 10,
1786
- NODE_SEPARATION_HORIZONTAL: 80,
1787
- NODE_SEPARATION_VERTICAL: 100,
1788
- CONTAINER_SEPARATION_HORIZONTAL: 120,
1789
- CONTAINER_SEPARATION_VERTICAL: 160,
1790
- NESTED_SUBGRAPH_SEPARATION_HORIZONTAL: 120,
1791
- NESTED_SUBGRAPH_SEPARATION_VERTICAL: 140,
1792
- META_GRAPH_MARGIN: 100,
1793
- NESTED_CONTENT_MARGIN: 40,
1794
- MIXED_CONTENT_VERTICAL_SPACING: 100,
1795
- MIXED_CONTENT_HORIZONTAL_SPACING: 120
1782
+ const DEFAULT_C4_LAYOUT = {
1783
+ c4ShapeInRow: 4,
1784
+ c4BoundaryInRow: 2
1796
1785
  };
1797
- const LAYOUT_RANKERS = {
1798
- NETWORK_SIMPLEX: "network-simplex",
1799
- TIGHT_TREE: "tight-tree",
1800
- LONGEST_PATH: "longest-path"
1786
+ function buildStereotype(keyword) {
1787
+ const suffix = keyword.shape === "db" ? "_db" : keyword.shape === "queue" ? "_queue" : "";
1788
+ return `${keyword.isExternal ? "external_" : ""}${keyword.kind}${suffix}`;
1789
+ }
1790
+ const C4_DIAGRAM_TYPES = [
1791
+ "C4Context",
1792
+ "C4Container",
1793
+ "C4Component",
1794
+ "C4Dynamic",
1795
+ "C4Deployment"
1796
+ ];
1797
+ const ELEMENT_KINDS = {
1798
+ Person: "person",
1799
+ System: "system",
1800
+ Container: "container",
1801
+ Component: "component"
1801
1802
  };
1802
- const DEFAULT_LAYOUT_RANKER = LAYOUT_RANKERS.TIGHT_TREE;
1803
- const SEQUENCE_PARTICIPANT_COLOR = "#E2E8F0";
1804
- const SEQUENCE_LAYOUT = {
1805
- COLUMN_WIDTH: 360,
1806
- ROW_HEIGHT: 60,
1807
- HEADER_HEIGHT: 40,
1808
- MESSAGE_NODE_WIDTH: 140,
1809
- MESSAGE_NODE_HEIGHT: 32,
1810
- SELF_LOOP_OFFSET: 48,
1811
- PARTICIPANT_NODE_WIDTH: 10,
1812
- MESSAGE_MAX_WIDTH: 240,
1813
- MESSAGE_TARGET_WRAP_LINES: 2,
1814
- MESSAGE_CHAR_WIDTH: 7,
1815
- MESSAGE_LINE_HEIGHT: 20,
1816
- MESSAGE_HORIZONTAL_PADDING: 24,
1817
- MESSAGE_VERTICAL_PADDING: 8,
1818
- ROW_VERTICAL_PADDING: 16,
1819
- NOTE_OFFSET: 24,
1820
- BLOCK_TOP_PADDING: 36,
1821
- BLOCK_BOTTOM_PADDING: 16,
1822
- BLOCK_SIDE_PADDING: 44,
1823
- BLOCK_SECTION_PADDING: 22,
1824
- BLOCK_CONTENT_INSET: 12,
1825
- BLOCK_FRAME_GAP: 12,
1826
- BOX_TOP_INSET: 26,
1827
- BOX_BOTTOM_PADDING: 24
1803
+ const BOUNDARY_KEYWORDS = {
1804
+ Boundary: { kind: "generic" },
1805
+ Enterprise_Boundary: {
1806
+ kind: "enterprise",
1807
+ fixedType: "ENTERPRISE"
1808
+ },
1809
+ System_Boundary: {
1810
+ kind: "system",
1811
+ fixedType: "SYSTEM"
1812
+ },
1813
+ Container_Boundary: {
1814
+ kind: "container",
1815
+ fixedType: "CONTAINER"
1816
+ },
1817
+ Deployment_Node: {
1818
+ kind: "node",
1819
+ nodeType: "node"
1820
+ },
1821
+ Node: {
1822
+ kind: "node",
1823
+ nodeType: "node"
1824
+ },
1825
+ Node_L: {
1826
+ kind: "node",
1827
+ nodeType: "nodeL"
1828
+ },
1829
+ Node_R: {
1830
+ kind: "node",
1831
+ nodeType: "nodeR"
1832
+ }
1828
1833
  };
1829
- function sanitizeMermaidLabels(src) {
1830
- if (!src) return src;
1831
- const subgraphFixed = src.replace(/([A-Za-z0-9_]+)\[((?:(?![\"']).)*?)\]/g, (m, id, label) => {
1832
- if (/^[\"']/.test(label)) return m;
1833
- if (/[()\"\[\],:;]/.test(label)) return `${id}[\"${String(label).replace(/\\/g, "\\\\").replace(/\"/g, "\\\"")}\"]`;
1834
- return m;
1835
- }).replace(/^([ \t]*subgraph\s+)([^\n\r]+)(\|[^\n\r]*)?$/gim, (m, pre, title, rest) => {
1836
- const t = String(title).trim();
1837
- if (/^[\"']/.test(t)) return m;
1838
- if (/[()\"\[\],:;]/.test(t)) return `${pre}\"${t.replace(/\\/g, "\\\\").replace(/\"/g, "\\\"")}\"${rest || ""}`;
1839
- return m;
1840
- });
1841
- const diagRegex = /\b(graph|flowchart|sequenceDiagram|stateDiagram|classDiagram|gantt|journey|erDiagram|gitGraph|pie|timeline|infoDiagram)\b/i;
1842
- const allStarts = [];
1843
- let mm;
1844
- const globalRegex = new RegExp(diagRegex.source, "gim");
1845
- while ((mm = globalRegex.exec(subgraphFixed)) !== null) {
1846
- allStarts.push(mm.index);
1847
- if (globalRegex.lastIndex === mm.index) globalRegex.lastIndex++;
1834
+ const REL_DIRECTIONS = {
1835
+ Rel: "default",
1836
+ RelIndex: "default",
1837
+ BiRel: "bi",
1838
+ Rel_Back: "back",
1839
+ Rel_U: "up",
1840
+ Rel_Up: "up",
1841
+ Rel_D: "down",
1842
+ Rel_Down: "down",
1843
+ Rel_L: "left",
1844
+ Rel_Left: "left",
1845
+ Rel_R: "right",
1846
+ Rel_Right: "right",
1847
+ Rel_Neighbor: "default",
1848
+ BiRel_Neighbor: "bi"
1849
+ };
1850
+ const DIRECTIONS = [
1851
+ "TB",
1852
+ "BT",
1853
+ "LR",
1854
+ "RL"
1855
+ ];
1856
+ function parseElementKeyword(keyword) {
1857
+ let rest = keyword;
1858
+ let isExternal = false;
1859
+ if (rest.endsWith("_Ext")) {
1860
+ isExternal = true;
1861
+ rest = rest.slice(0, -4);
1862
+ }
1863
+ let shape = "default";
1864
+ if (rest.endsWith("Db")) {
1865
+ shape = "db";
1866
+ rest = rest.slice(0, -2);
1867
+ } else if (rest.endsWith("Queue")) {
1868
+ shape = "queue";
1869
+ rest = rest.slice(0, -5);
1870
+ }
1871
+ const kind = ELEMENT_KINDS[rest];
1872
+ if (!kind) return null;
1873
+ return {
1874
+ kind,
1875
+ shape,
1876
+ isExternal
1877
+ };
1878
+ }
1879
+ function splitArguments(raw) {
1880
+ if (!raw.trim()) return [];
1881
+ const args = [];
1882
+ let current = "";
1883
+ let inQuotes = false;
1884
+ let depth = 0;
1885
+ for (let i = 0; i < raw.length; i++) {
1886
+ const char = raw[i];
1887
+ if (char === "\"" && raw[i - 1] !== "\\") {
1888
+ inQuotes = !inQuotes;
1889
+ current += char;
1890
+ continue;
1891
+ }
1892
+ if (!inQuotes && (char === "(" || char === "[")) depth++;
1893
+ if (!inQuotes && (char === ")" || char === "]")) depth--;
1894
+ if (char === "," && !inQuotes && depth === 0) {
1895
+ args.push(current.trim());
1896
+ current = "";
1897
+ continue;
1898
+ }
1899
+ current += char;
1848
1900
  }
1849
- if (allStarts.length <= 1) return subgraphFixed;
1850
- const first = allStarts[0];
1851
- const second = allStarts[1];
1852
- return subgraphFixed.slice(first, second).trim();
1901
+ args.push(current.trim());
1902
+ return args;
1903
+ }
1904
+ function unquote(value) {
1905
+ const trimmed = value.trim();
1906
+ if (trimmed.startsWith("\"") && trimmed.endsWith("\"") && trimmed.length >= 2) return trimmed.slice(1, -1).replace(/\\"/g, "\"").replace(/<br\s*\/?>/gi, "\n").trim();
1907
+ return trimmed.replace(/<br\s*\/?>/gi, "\n");
1908
+ }
1909
+ function partitionArguments(args) {
1910
+ const positional = [];
1911
+ const named = {};
1912
+ for (const arg of args) {
1913
+ const match = arg.match(/^\$([A-Za-z0-9_]+)\s*=\s*([\s\S]*)$/);
1914
+ if (match) {
1915
+ named[match[1]] = unquote(match[2]);
1916
+ continue;
1917
+ }
1918
+ positional.push(unquote(arg));
1919
+ }
1920
+ return {
1921
+ positional,
1922
+ named
1923
+ };
1924
+ }
1925
+ function slot(positional, index) {
1926
+ const value = positional[index];
1927
+ if (value === void 0) return void 0;
1928
+ if (value === "") return void 0;
1929
+ return value;
1930
+ }
1931
+ function isC4Diagram(code) {
1932
+ for (const line of code.split("\n")) {
1933
+ const trimmed = line.trim();
1934
+ if (!trimmed || trimmed.startsWith("%%")) continue;
1935
+ return C4_DIAGRAM_TYPES.some((type) => trimmed.toLowerCase().startsWith(type.toLowerCase()));
1936
+ }
1937
+ return false;
1938
+ }
1939
+ function toStatements(code) {
1940
+ const statements = [];
1941
+ let buffer = "";
1942
+ let depth = 0;
1943
+ for (const rawLine of code.split("\n")) {
1944
+ const line = rawLine.replace(/%%.*$/, "").trim();
1945
+ if (!line) continue;
1946
+ buffer = buffer ? `${buffer} ${line}` : line;
1947
+ let inQuotes = false;
1948
+ for (let i = 0; i < line.length; i++) {
1949
+ const char = line[i];
1950
+ if (char === "\"" && line[i - 1] !== "\\") inQuotes = !inQuotes;
1951
+ if (inQuotes) continue;
1952
+ if (char === "(") depth++;
1953
+ if (char === ")") depth--;
1954
+ }
1955
+ if (depth > 0) continue;
1956
+ depth = 0;
1957
+ statements.push(...splitOnBraces(buffer));
1958
+ buffer = "";
1959
+ }
1960
+ if (buffer) statements.push(...splitOnBraces(buffer));
1961
+ return statements;
1962
+ }
1963
+ function splitOnBraces(buffer) {
1964
+ const statements = [];
1965
+ let current = "";
1966
+ let inQuotes = false;
1967
+ let depth = 0;
1968
+ function flush() {
1969
+ if (current.trim()) statements.push(current.trim());
1970
+ current = "";
1971
+ }
1972
+ for (let i = 0; i < buffer.length; i++) {
1973
+ const char = buffer[i];
1974
+ if (char === "\"" && buffer[i - 1] !== "\\") inQuotes = !inQuotes;
1975
+ if (!inQuotes && char === "(") depth++;
1976
+ if (!inQuotes && char === ")") depth--;
1977
+ if (!inQuotes && depth === 0 && char === "{") {
1978
+ current += char;
1979
+ flush();
1980
+ continue;
1981
+ }
1982
+ if (!inQuotes && depth === 0 && char === "}") {
1983
+ flush();
1984
+ statements.push("}");
1985
+ continue;
1986
+ }
1987
+ current += char;
1988
+ }
1989
+ flush();
1990
+ return statements;
1991
+ }
1992
+ function parseC4Diagram(code) {
1993
+ const elements = [];
1994
+ const boundaries = [];
1995
+ const relationships = [];
1996
+ const elementStyles = {};
1997
+ const boundaryStyles = {};
1998
+ const relStyles = {};
1999
+ const layout = _objectSpread2({}, DEFAULT_C4_LAYOUT);
2000
+ let type = "C4Context";
2001
+ let title;
2002
+ let accTitle;
2003
+ let accDescription;
2004
+ let direction;
2005
+ const boundaryStack = [];
2006
+ let anonymousBoundaryCount = 0;
2007
+ let accDescrLines;
2008
+ function currentParentId() {
2009
+ return boundaryStack[boundaryStack.length - 1];
2010
+ }
2011
+ function registerChild(childId) {
2012
+ const parentId = currentParentId();
2013
+ if (!parentId) return;
2014
+ const parent = boundaries.find((boundary) => boundary.id === parentId);
2015
+ if (!parent) return;
2016
+ if (parent.childIds.includes(childId)) return;
2017
+ parent.childIds.push(childId);
2018
+ }
2019
+ for (const statement of toStatements(code)) {
2020
+ if (accDescrLines) {
2021
+ if (statement === "}") {
2022
+ accDescription = accDescrLines.join("\n").trim();
2023
+ accDescrLines = void 0;
2024
+ continue;
2025
+ }
2026
+ accDescrLines.push(statement);
2027
+ continue;
2028
+ }
2029
+ const detectedType = C4_DIAGRAM_TYPES.find((candidate) => statement.toLowerCase().startsWith(candidate.toLowerCase()));
2030
+ if (detectedType) {
2031
+ type = detectedType;
2032
+ continue;
2033
+ }
2034
+ if (statement === "}") {
2035
+ boundaryStack.pop();
2036
+ continue;
2037
+ }
2038
+ const directionMatch = statement.match(/^direction\s+(TB|BT|LR|RL)$/i);
2039
+ if (directionMatch) {
2040
+ direction = DIRECTIONS.find((candidate) => candidate === directionMatch[1].toUpperCase());
2041
+ continue;
2042
+ }
2043
+ const accTitleMatch = statement.match(/^accTitle\s*:\s*(.*)$/i);
2044
+ if (accTitleMatch) {
2045
+ accTitle = unquote(accTitleMatch[1]);
2046
+ continue;
2047
+ }
2048
+ if (/^accDescr\s*\{$/i.test(statement)) {
2049
+ accDescrLines = [];
2050
+ continue;
2051
+ }
2052
+ const accDescrMatch = statement.match(/^accDescr\s*:\s*(.*)$/i);
2053
+ if (accDescrMatch) {
2054
+ accDescription = unquote(accDescrMatch[1]);
2055
+ continue;
2056
+ }
2057
+ const titleMatch = statement.match(/^title\s+(.*)$/i);
2058
+ if (titleMatch) {
2059
+ title = unquote(titleMatch[1]);
2060
+ continue;
2061
+ }
2062
+ const callMatch = statement.match(/^([A-Za-z_][A-Za-z0-9_]*)\s*\(([\s\S]*)\)\s*(\{)?\s*$/);
2063
+ if (!callMatch) continue;
2064
+ const [, keyword, rawArgs, openBrace] = callMatch;
2065
+ const { positional, named } = partitionArguments(splitArguments(rawArgs));
2066
+ if (keyword === "UpdateLayoutConfig") {
2067
+ var _named$c4ShapeInRow, _named$c4BoundaryInRo;
2068
+ const inRow = (_named$c4ShapeInRow = named.c4ShapeInRow) !== null && _named$c4ShapeInRow !== void 0 ? _named$c4ShapeInRow : slot(positional, 0);
2069
+ const boundaryInRow = (_named$c4BoundaryInRo = named.c4BoundaryInRow) !== null && _named$c4BoundaryInRo !== void 0 ? _named$c4BoundaryInRo : slot(positional, 1);
2070
+ if (inRow) layout.c4ShapeInRow = Number(inRow) || layout.c4ShapeInRow;
2071
+ if (boundaryInRow) layout.c4BoundaryInRow = Number(boundaryInRow) || layout.c4BoundaryInRow;
2072
+ continue;
2073
+ }
2074
+ if (keyword === "UpdateElementStyle" || keyword === "UpdateBoundaryStyle") {
2075
+ var _named$shadowing, _named$bgColor, _named$fontColor, _named$borderColor, _named$shape, _named$sprite, _named$techn, _named$legendText, _named$legendSprite;
2076
+ const target = slot(positional, 0);
2077
+ if (!target) continue;
2078
+ const shadowing = (_named$shadowing = named.shadowing) !== null && _named$shadowing !== void 0 ? _named$shadowing : slot(positional, 4);
2079
+ const style = {
2080
+ bgColor: (_named$bgColor = named.bgColor) !== null && _named$bgColor !== void 0 ? _named$bgColor : slot(positional, 1),
2081
+ fontColor: (_named$fontColor = named.fontColor) !== null && _named$fontColor !== void 0 ? _named$fontColor : slot(positional, 2),
2082
+ borderColor: (_named$borderColor = named.borderColor) !== null && _named$borderColor !== void 0 ? _named$borderColor : slot(positional, 3),
2083
+ shadowing: shadowing === void 0 ? void 0 : shadowing === "true",
2084
+ shape: (_named$shape = named.shape) !== null && _named$shape !== void 0 ? _named$shape : slot(positional, 5),
2085
+ sprite: (_named$sprite = named.sprite) !== null && _named$sprite !== void 0 ? _named$sprite : slot(positional, 6),
2086
+ techn: (_named$techn = named.techn) !== null && _named$techn !== void 0 ? _named$techn : slot(positional, 7),
2087
+ legendText: (_named$legendText = named.legendText) !== null && _named$legendText !== void 0 ? _named$legendText : slot(positional, 8),
2088
+ legendSprite: (_named$legendSprite = named.legendSprite) !== null && _named$legendSprite !== void 0 ? _named$legendSprite : slot(positional, 9)
2089
+ };
2090
+ if (keyword === "UpdateBoundaryStyle") boundaryStyles[target] = style;
2091
+ else elementStyles[target] = style;
2092
+ continue;
2093
+ }
2094
+ if (keyword === "UpdateRelStyle") {
2095
+ var _named$offsetX, _named$offsetY, _named$textColor, _named$lineColor;
2096
+ const from = slot(positional, 0);
2097
+ const to = slot(positional, 1);
2098
+ if (!from || !to) continue;
2099
+ const offsetX = (_named$offsetX = named.offsetX) !== null && _named$offsetX !== void 0 ? _named$offsetX : slot(positional, 4);
2100
+ const offsetY = (_named$offsetY = named.offsetY) !== null && _named$offsetY !== void 0 ? _named$offsetY : slot(positional, 5);
2101
+ const lineWidth = named.lineWidth;
2102
+ relStyles[`${from}->${to}`] = {
2103
+ textColor: (_named$textColor = named.textColor) !== null && _named$textColor !== void 0 ? _named$textColor : slot(positional, 2),
2104
+ lineColor: (_named$lineColor = named.lineColor) !== null && _named$lineColor !== void 0 ? _named$lineColor : slot(positional, 3),
2105
+ offsetX: offsetX === void 0 ? void 0 : Number(offsetX),
2106
+ offsetY: offsetY === void 0 ? void 0 : Number(offsetY),
2107
+ lineWidth: lineWidth === void 0 ? void 0 : Number(lineWidth),
2108
+ lineStyle: named.lineStyle
2109
+ };
2110
+ continue;
2111
+ }
2112
+ if (/^(SHOW_|HIDE_)/.test(keyword)) continue;
2113
+ const boundaryKeyword = BOUNDARY_KEYWORDS[keyword];
2114
+ if (boundaryKeyword) {
2115
+ var _slot, _ref, _ref2, _boundaryKeyword$fixe, _slot2, _named$descr, _named$sprite2, _named$tags;
2116
+ const id = (_slot = slot(positional, 0)) !== null && _slot !== void 0 ? _slot : `boundary-${++anonymousBoundaryCount}`;
2117
+ const isNode = boundaryKeyword.nodeType !== void 0;
2118
+ const defaultType = isNode ? "node" : "system";
2119
+ const boundaryType = (_ref = (_ref2 = (_boundaryKeyword$fixe = boundaryKeyword.fixedType) !== null && _boundaryKeyword$fixe !== void 0 ? _boundaryKeyword$fixe : named.type) !== null && _ref2 !== void 0 ? _ref2 : slot(positional, 2)) !== null && _ref !== void 0 ? _ref : defaultType;
2120
+ const tagsIndex = boundaryKeyword.fixedType ? 2 : isNode ? 5 : 3;
2121
+ const boundary = {
2122
+ id,
2123
+ label: (_slot2 = slot(positional, 1)) !== null && _slot2 !== void 0 ? _slot2 : id,
2124
+ kind: boundaryKeyword.kind,
2125
+ type: boundaryType,
2126
+ description: isNode ? (_named$descr = named.descr) !== null && _named$descr !== void 0 ? _named$descr : slot(positional, 3) : named.descr,
2127
+ nodeType: boundaryKeyword.nodeType,
2128
+ parentId: currentParentId(),
2129
+ childIds: [],
2130
+ sprite: (_named$sprite2 = named.sprite) !== null && _named$sprite2 !== void 0 ? _named$sprite2 : isNode ? slot(positional, 4) : void 0,
2131
+ tags: (_named$tags = named.tags) !== null && _named$tags !== void 0 ? _named$tags : slot(positional, tagsIndex),
2132
+ link: named.link
2133
+ };
2134
+ registerChild(id);
2135
+ const existing = boundaries.findIndex((entry) => entry.id === id);
2136
+ if (existing === -1) boundaries.push(boundary);
2137
+ else boundaries[existing] = _objectSpread2(_objectSpread2({}, boundary), {}, { childIds: boundaries[existing].childIds });
2138
+ if (openBrace) boundaryStack.push(id);
2139
+ continue;
2140
+ }
2141
+ const relDirection = REL_DIRECTIONS[keyword];
2142
+ if (relDirection) {
2143
+ var _slot3, _named$techn2, _named$descr2, _named$sprite3, _named$tags2;
2144
+ const args = keyword === "RelIndex" ? positional.slice(1) : positional;
2145
+ const from = slot(args, 0);
2146
+ const to = slot(args, 1);
2147
+ if (!from || !to) continue;
2148
+ const relationship = {
2149
+ from,
2150
+ to,
2151
+ label: (_slot3 = slot(args, 2)) !== null && _slot3 !== void 0 ? _slot3 : "",
2152
+ technology: (_named$techn2 = named.techn) !== null && _named$techn2 !== void 0 ? _named$techn2 : slot(args, 3),
2153
+ description: (_named$descr2 = named.descr) !== null && _named$descr2 !== void 0 ? _named$descr2 : slot(args, 4),
2154
+ direction: relDirection,
2155
+ index: relationships.length,
2156
+ sprite: (_named$sprite3 = named.sprite) !== null && _named$sprite3 !== void 0 ? _named$sprite3 : slot(args, 5),
2157
+ tags: (_named$tags2 = named.tags) !== null && _named$tags2 !== void 0 ? _named$tags2 : slot(args, 6),
2158
+ link: named.link
2159
+ };
2160
+ const existing = relationships.findIndex((entry) => entry.from === from && entry.to === to);
2161
+ if (existing === -1) relationships.push(relationship);
2162
+ else relationships[existing] = _objectSpread2(_objectSpread2({}, relationship), {}, { index: relationships[existing].index });
2163
+ continue;
2164
+ }
2165
+ const elementKeyword = parseElementKeyword(keyword);
2166
+ if (elementKeyword) {
2167
+ var _slot4, _named$techn3, _named$descr3, _named$sprite4, _named$tags3;
2168
+ const id = slot(positional, 0);
2169
+ if (!id) continue;
2170
+ const hasTechnologySlot = elementKeyword.kind === "container" || elementKeyword.kind === "component";
2171
+ const descrIndex = hasTechnologySlot ? 3 : 2;
2172
+ const link = named.link;
2173
+ const element = {
2174
+ id,
2175
+ label: (_slot4 = slot(positional, 1)) !== null && _slot4 !== void 0 ? _slot4 : id,
2176
+ technology: (_named$techn3 = named.techn) !== null && _named$techn3 !== void 0 ? _named$techn3 : hasTechnologySlot ? slot(positional, 2) : void 0,
2177
+ description: (_named$descr3 = named.descr) !== null && _named$descr3 !== void 0 ? _named$descr3 : slot(positional, descrIndex),
2178
+ kind: elementKeyword.kind,
2179
+ shape: elementKeyword.shape,
2180
+ isExternal: elementKeyword.isExternal,
2181
+ stereotype: buildStereotype(elementKeyword),
2182
+ parentId: currentParentId(),
2183
+ sprite: (_named$sprite4 = named.sprite) !== null && _named$sprite4 !== void 0 ? _named$sprite4 : slot(positional, descrIndex + 1),
2184
+ tags: (_named$tags3 = named.tags) !== null && _named$tags3 !== void 0 ? _named$tags3 : slot(positional, descrIndex + 2),
2185
+ link,
2186
+ subDiagramId: (link === null || link === void 0 ? void 0 : link.startsWith("uig:")) ? link.slice(4) : void 0
2187
+ };
2188
+ registerChild(id);
2189
+ const existing = elements.findIndex((entry) => entry.id === id);
2190
+ if (existing === -1) elements.push(element);
2191
+ else elements[existing] = element;
2192
+ continue;
2193
+ }
2194
+ }
2195
+ return {
2196
+ type,
2197
+ title,
2198
+ accTitle,
2199
+ accDescription,
2200
+ direction,
2201
+ elements,
2202
+ boundaries,
2203
+ relationships,
2204
+ elementStyles,
2205
+ boundaryStyles,
2206
+ relStyles,
2207
+ layout
2208
+ };
1853
2209
  }
1854
2210
  function flattenMetaData(fields, fieldsValues) {
1855
2211
  const output = {};
@@ -1987,6 +2343,423 @@ function getComponentFieldByLabel(fields, label) {
1987
2343
  return ((_field$label = field.label) === null || _field$label === void 0 ? void 0 : _field$label.toLowerCase()) === label.toLowerCase();
1988
2344
  });
1989
2345
  }
2346
+ const C4_LAYOUT = {
2347
+ WIDTH: 240,
2348
+ MIN_HEIGHT: 80,
2349
+ SHAPE_MARGIN: 90,
2350
+ ROW_MARGIN: 80,
2351
+ SHAPE_PADDING: 24,
2352
+ BOUNDARY_HEADER: 72,
2353
+ BOUNDARY_PADDING: 48,
2354
+ BOUNDARY_MARGIN: 60,
2355
+ DIAGRAM_MARGIN_X: 60,
2356
+ DIAGRAM_MARGIN_Y: 40
2357
+ };
2358
+ const C4_COLORS = {
2359
+ person: {
2360
+ fill: "#08427B",
2361
+ stroke: "#052E56"
2362
+ },
2363
+ personExternal: {
2364
+ fill: "#686868",
2365
+ stroke: "#4D4D4D"
2366
+ },
2367
+ system: {
2368
+ fill: "#1168BD",
2369
+ stroke: "#0B4884"
2370
+ },
2371
+ systemExternal: {
2372
+ fill: "#999999",
2373
+ stroke: "#6B6B6B"
2374
+ },
2375
+ container: {
2376
+ fill: "#438DD5",
2377
+ stroke: "#2E6295"
2378
+ },
2379
+ containerExternal: {
2380
+ fill: "#B3B3B3",
2381
+ stroke: "#8A8A8A"
2382
+ },
2383
+ component: {
2384
+ fill: "#85BBF0",
2385
+ stroke: "#5D82A8"
2386
+ },
2387
+ componentExternal: {
2388
+ fill: "#CCCCCC",
2389
+ stroke: "#A6A6A6"
2390
+ },
2391
+ node: {
2392
+ fill: "#1F2937",
2393
+ stroke: "#4B5563"
2394
+ },
2395
+ nodeExternal: {
2396
+ fill: "#374151",
2397
+ stroke: "#6B7280"
2398
+ }
2399
+ };
2400
+ const BOUNDARY_BORDER = "#828DA3";
2401
+ function getC4ElementColors(element) {
2402
+ var _C4_COLORS$key;
2403
+ return (_C4_COLORS$key = C4_COLORS[element.isExternal ? `${element.kind}External` : element.kind]) !== null && _C4_COLORS$key !== void 0 ? _C4_COLORS$key : C4_COLORS.system;
2404
+ }
2405
+ const NAME_LINE_HEIGHT = 22;
2406
+ const SMALL_LINE_HEIGHT = 18;
2407
+ const PERSON_GLYPH = 30;
2408
+ const CYLINDER_LIPS = 34;
2409
+ const QUEUE_CAPS = 68;
2410
+ function wrappedLines(text, usableWidth, charWidth) {
2411
+ if (!text) return 0;
2412
+ const charsPerLine = Math.max(6, Math.floor(usableWidth / charWidth));
2413
+ return text.split("\n").reduce((total, line) => total + Math.max(1, Math.ceil(line.length / charsPerLine)), 0);
2414
+ }
2415
+ function measureElement(element) {
2416
+ let usableWidth = C4_LAYOUT.WIDTH - C4_LAYOUT.SHAPE_PADDING * 2;
2417
+ if (element.shape === "queue") usableWidth -= QUEUE_CAPS;
2418
+ let height = C4_LAYOUT.SHAPE_PADDING * 2;
2419
+ height += SMALL_LINE_HEIGHT;
2420
+ if (element.kind === "person") height += PERSON_GLYPH;
2421
+ height += wrappedLines(element.label, usableWidth, 8.6) * NAME_LINE_HEIGHT;
2422
+ if (element.technology) height += SMALL_LINE_HEIGHT;
2423
+ height += wrappedLines(element.description, usableWidth, 5.9) * SMALL_LINE_HEIGHT;
2424
+ if (element.shape === "db") height += CYLINDER_LIPS;
2425
+ return {
2426
+ width: C4_LAYOUT.WIDTH,
2427
+ height: Math.max(C4_LAYOUT.MIN_HEIGHT, height)
2428
+ };
2429
+ }
2430
+ function layoutContainer(containerId, data, childrenOf, elementById, placements) {
2431
+ var _childrenOf$get;
2432
+ const childIds = (_childrenOf$get = childrenOf.get(containerId)) !== null && _childrenOf$get !== void 0 ? _childrenOf$get : [];
2433
+ const shapeIds = childIds.filter((id) => elementById.has(id));
2434
+ const boundaryIds = childIds.filter((id) => !elementById.has(id));
2435
+ const originX = containerId ? C4_LAYOUT.BOUNDARY_PADDING : C4_LAYOUT.DIAGRAM_MARGIN_X;
2436
+ const originY = containerId ? C4_LAYOUT.BOUNDARY_HEADER : C4_LAYOUT.DIAGRAM_MARGIN_Y;
2437
+ let cursorY = originY;
2438
+ let maxX = originX;
2439
+ let lastMargin = 0;
2440
+ const perRow = Math.max(1, data.layout.c4ShapeInRow);
2441
+ for (let index = 0; index < shapeIds.length; index += perRow) {
2442
+ const row = shapeIds.slice(index, index + perRow);
2443
+ let rowHeight = 0;
2444
+ row.forEach((id, column) => {
2445
+ const size = measureElement(elementById.get(id));
2446
+ const x = originX + column * (C4_LAYOUT.WIDTH + C4_LAYOUT.SHAPE_MARGIN);
2447
+ placements.set(id, {
2448
+ x,
2449
+ y: cursorY,
2450
+ width: size.width,
2451
+ height: size.height
2452
+ });
2453
+ rowHeight = Math.max(rowHeight, size.height);
2454
+ maxX = Math.max(maxX, x + size.width);
2455
+ });
2456
+ cursorY += rowHeight + C4_LAYOUT.ROW_MARGIN;
2457
+ lastMargin = C4_LAYOUT.ROW_MARGIN;
2458
+ }
2459
+ const boundarySizes = /* @__PURE__ */ new Map();
2460
+ for (const id of boundaryIds) boundarySizes.set(id, layoutContainer(id, data, childrenOf, elementById, placements));
2461
+ const boundariesPerRow = Math.max(1, data.layout.c4BoundaryInRow);
2462
+ for (let index = 0; index < boundaryIds.length; index += boundariesPerRow) {
2463
+ const row = boundaryIds.slice(index, index + boundariesPerRow);
2464
+ let rowHeight = 0;
2465
+ let cursorX = originX;
2466
+ for (const id of row) {
2467
+ const size = boundarySizes.get(id);
2468
+ placements.set(id, {
2469
+ x: cursorX,
2470
+ y: cursorY,
2471
+ width: size.width,
2472
+ height: size.height
2473
+ });
2474
+ cursorX += size.width + C4_LAYOUT.BOUNDARY_MARGIN;
2475
+ rowHeight = Math.max(rowHeight, size.height);
2476
+ maxX = Math.max(maxX, cursorX - C4_LAYOUT.BOUNDARY_MARGIN);
2477
+ }
2478
+ cursorY += rowHeight + C4_LAYOUT.BOUNDARY_MARGIN;
2479
+ lastMargin = C4_LAYOUT.BOUNDARY_MARGIN;
2480
+ }
2481
+ const hasChildren = shapeIds.length > 0 || boundaryIds.length > 0;
2482
+ const trailing = containerId ? C4_LAYOUT.BOUNDARY_PADDING : C4_LAYOUT.DIAGRAM_MARGIN_Y;
2483
+ if (!hasChildren) return {
2484
+ width: C4_LAYOUT.WIDTH + originX + trailing,
2485
+ height: C4_LAYOUT.MIN_HEIGHT + originY + trailing
2486
+ };
2487
+ return {
2488
+ width: maxX + originX,
2489
+ height: cursorY - lastMargin + trailing
2490
+ };
2491
+ }
2492
+ function resolveSide(direction, from, to) {
2493
+ if (direction === "up") return {
2494
+ source: "top",
2495
+ target: "bottom"
2496
+ };
2497
+ if (direction === "down") return {
2498
+ source: "bottom",
2499
+ target: "top"
2500
+ };
2501
+ if (direction === "left") return {
2502
+ source: "left",
2503
+ target: "right"
2504
+ };
2505
+ if (direction === "right") return {
2506
+ source: "right",
2507
+ target: "left"
2508
+ };
2509
+ const dx = to.x - from.x;
2510
+ const dy = to.y - from.y;
2511
+ if (Math.abs(dx) > Math.abs(dy)) {
2512
+ if (dx >= 0) return {
2513
+ source: "right",
2514
+ target: "left"
2515
+ };
2516
+ return {
2517
+ source: "left",
2518
+ target: "right"
2519
+ };
2520
+ }
2521
+ if (dy >= 0) return {
2522
+ source: "bottom",
2523
+ target: "top"
2524
+ };
2525
+ return {
2526
+ source: "top",
2527
+ target: "bottom"
2528
+ };
2529
+ }
2530
+ function applyElementStyle(base, style) {
2531
+ var _style$bgColor, _style$borderColor;
2532
+ return {
2533
+ fill: (_style$bgColor = style === null || style === void 0 ? void 0 : style.bgColor) !== null && _style$bgColor !== void 0 ? _style$bgColor : base.fill,
2534
+ stroke: (_style$borderColor = style === null || style === void 0 ? void 0 : style.borderColor) !== null && _style$borderColor !== void 0 ? _style$borderColor : base.stroke,
2535
+ fontColor: style === null || style === void 0 ? void 0 : style.fontColor
2536
+ };
2537
+ }
2538
+ function convertC4ToReactFlow(data) {
2539
+ const elementById = new Map(data.elements.map((el) => [el.id, el]));
2540
+ const boundaryById = new Map(data.boundaries.map((b) => [b.id, b]));
2541
+ const childrenOf = /* @__PURE__ */ new Map();
2542
+ function attach(id, parentId) {
2543
+ var _childrenOf$get2;
2544
+ const siblings = (_childrenOf$get2 = childrenOf.get(parentId)) !== null && _childrenOf$get2 !== void 0 ? _childrenOf$get2 : [];
2545
+ siblings.push(id);
2546
+ childrenOf.set(parentId, siblings);
2547
+ }
2548
+ for (const boundary of data.boundaries) attach(boundary.id, boundary.parentId);
2549
+ for (const element of data.elements) attach(element.id, element.parentId);
2550
+ const placements = /* @__PURE__ */ new Map();
2551
+ layoutContainer(void 0, data, childrenOf, elementById, placements);
2552
+ const nodes = [];
2553
+ for (const boundary of data.boundaries) {
2554
+ var _data$boundaryStyles$, _style$bgColor2, _style$borderColor2;
2555
+ const placement = placements.get(boundary.id);
2556
+ if (!placement) continue;
2557
+ const style = (_data$boundaryStyles$ = data.boundaryStyles[boundary.id]) !== null && _data$boundaryStyles$ !== void 0 ? _data$boundaryStyles$ : data.elementStyles[boundary.id];
2558
+ nodes.push({
2559
+ id: boundary.id,
2560
+ type: "c4Boundary",
2561
+ position: {
2562
+ x: placement.x,
2563
+ y: placement.y
2564
+ },
2565
+ data: {
2566
+ source: "mermaid",
2567
+ c4BoundaryKind: boundary.kind,
2568
+ boundaryType: boundary.type,
2569
+ description: boundary.description,
2570
+ c4NodeType: boundary.nodeType,
2571
+ link: boundary.link,
2572
+ backgroundColor: (_style$bgColor2 = style === null || style === void 0 ? void 0 : style.bgColor) !== null && _style$bgColor2 !== void 0 ? _style$bgColor2 : "transparent",
2573
+ borderColor: (_style$borderColor2 = style === null || style === void 0 ? void 0 : style.borderColor) !== null && _style$borderColor2 !== void 0 ? _style$borderColor2 : BOUNDARY_BORDER,
2574
+ fontColor: style === null || style === void 0 ? void 0 : style.fontColor,
2575
+ componentFields: [generateComponentFieldNameInput(boundary.label)]
2576
+ },
2577
+ style: {
2578
+ width: placement.width,
2579
+ height: placement.height
2580
+ },
2581
+ width: placement.width,
2582
+ height: placement.height,
2583
+ parentId: boundary.parentId,
2584
+ extent: boundary.parentId ? "parent" : void 0,
2585
+ selectable: true,
2586
+ draggable: true
2587
+ });
2588
+ }
2589
+ for (const element of data.elements) {
2590
+ const placement = placements.get(element.id);
2591
+ if (!placement) continue;
2592
+ const colors = applyElementStyle(getC4ElementColors(element), data.elementStyles[element.id]);
2593
+ nodes.push({
2594
+ id: element.id,
2595
+ type: element.subDiagramId ? "subDiagram" : "c4",
2596
+ position: {
2597
+ x: placement.x,
2598
+ y: placement.y
2599
+ },
2600
+ width: placement.width,
2601
+ height: placement.height,
2602
+ data: {
2603
+ source: "mermaid",
2604
+ diagramId: element.subDiagramId,
2605
+ diagramName: element.label,
2606
+ c4Kind: element.kind,
2607
+ c4Shape: element.shape,
2608
+ isExternal: element.isExternal,
2609
+ technology: element.technology,
2610
+ description: element.description,
2611
+ link: element.link,
2612
+ fill: colors.fill,
2613
+ stroke: colors.stroke,
2614
+ fontColor: colors.fontColor,
2615
+ componentFields: [generateComponentFieldNameInput(element.label)]
2616
+ },
2617
+ style: {
2618
+ width: placement.width,
2619
+ height: placement.height
2620
+ },
2621
+ parentId: element.parentId,
2622
+ extent: element.parentId ? "parent" : void 0
2623
+ });
2624
+ }
2625
+ const parentOf = /* @__PURE__ */ new Map();
2626
+ for (const boundary of data.boundaries) parentOf.set(boundary.id, boundary.parentId);
2627
+ for (const element of data.elements) parentOf.set(element.id, element.parentId);
2628
+ function absoluteCenter(id) {
2629
+ const placement = placements.get(id);
2630
+ let x = placement.x + placement.width / 2;
2631
+ let y = placement.y + placement.height / 2;
2632
+ let parentId = parentOf.get(id);
2633
+ while (parentId) {
2634
+ const parent = placements.get(parentId);
2635
+ x += parent.x;
2636
+ y += parent.y;
2637
+ parentId = parentOf.get(parentId);
2638
+ }
2639
+ return {
2640
+ x,
2641
+ y
2642
+ };
2643
+ }
2644
+ return {
2645
+ nodes,
2646
+ edges: data.relationships.filter((rel) => (elementById.has(rel.from) || boundaryById.has(rel.from)) && (elementById.has(rel.to) || boundaryById.has(rel.to))).map((rel) => {
2647
+ var _style$lineColor, _style$lineWidth;
2648
+ const isBack = rel.direction === "back";
2649
+ const source = isBack ? rel.to : rel.from;
2650
+ const target = isBack ? rel.from : rel.to;
2651
+ const style = data.relStyles[`${rel.from}->${rel.to}`];
2652
+ const lineColor = (_style$lineColor = style === null || style === void 0 ? void 0 : style.lineColor) !== null && _style$lineColor !== void 0 ? _style$lineColor : BOUNDARY_BORDER;
2653
+ const label = [rel.label, rel.technology ? `[${rel.technology}]` : ""].filter(Boolean).join(" ");
2654
+ const side = resolveSide(rel.direction, absoluteCenter(source), absoluteCenter(target));
2655
+ return {
2656
+ id: `c4-rel-${rel.from}-${rel.to}-${rel.index}`,
2657
+ source,
2658
+ target,
2659
+ sourceHandle: `source-${side.source}`,
2660
+ targetHandle: `target-${side.target}`,
2661
+ label,
2662
+ type: "simplebezier",
2663
+ style: {
2664
+ stroke: lineColor,
2665
+ strokeWidth: (_style$lineWidth = style === null || style === void 0 ? void 0 : style.lineWidth) !== null && _style$lineWidth !== void 0 ? _style$lineWidth : 1.5
2666
+ },
2667
+ data: {
2668
+ source: "mermaid",
2669
+ labelColor: style === null || style === void 0 ? void 0 : style.textColor,
2670
+ labelOffsetX: style === null || style === void 0 ? void 0 : style.offsetX,
2671
+ labelOffsetY: style === null || style === void 0 ? void 0 : style.offsetY
2672
+ },
2673
+ markerEnd: {
2674
+ type: __xyflow_react.MarkerType.ArrowClosed,
2675
+ width: 14,
2676
+ height: 14,
2677
+ color: lineColor
2678
+ },
2679
+ markerStart: rel.direction === "bi" ? {
2680
+ type: __xyflow_react.MarkerType.ArrowClosed,
2681
+ width: 14,
2682
+ height: 14,
2683
+ color: lineColor
2684
+ } : void 0
2685
+ };
2686
+ })
2687
+ };
2688
+ }
2689
+ function convertC4MermaidToReactFlow(code) {
2690
+ return convertC4ToReactFlow(parseC4Diagram(code));
2691
+ }
2692
+ const LAYOUT_SPACING = {
2693
+ SUBGRAPH_HEADER_HEIGHT: 35,
2694
+ SUBGRAPH_PADDING: 8,
2695
+ SUBGRAPH_CONTENT_TOP_MARGIN: 10,
2696
+ NODE_SEPARATION_HORIZONTAL: 80,
2697
+ NODE_SEPARATION_VERTICAL: 100,
2698
+ CONTAINER_SEPARATION_HORIZONTAL: 120,
2699
+ CONTAINER_SEPARATION_VERTICAL: 160,
2700
+ NESTED_SUBGRAPH_SEPARATION_HORIZONTAL: 120,
2701
+ NESTED_SUBGRAPH_SEPARATION_VERTICAL: 140,
2702
+ META_GRAPH_MARGIN: 100,
2703
+ NESTED_CONTENT_MARGIN: 40,
2704
+ MIXED_CONTENT_VERTICAL_SPACING: 100,
2705
+ MIXED_CONTENT_HORIZONTAL_SPACING: 120
2706
+ };
2707
+ const LAYOUT_RANKERS = {
2708
+ NETWORK_SIMPLEX: "network-simplex",
2709
+ TIGHT_TREE: "tight-tree",
2710
+ LONGEST_PATH: "longest-path"
2711
+ };
2712
+ const DEFAULT_LAYOUT_RANKER = LAYOUT_RANKERS.TIGHT_TREE;
2713
+ const SEQUENCE_LAYOUT = {
2714
+ COLUMN_WIDTH: 360,
2715
+ ROW_HEIGHT: 60,
2716
+ HEADER_HEIGHT: 40,
2717
+ MESSAGE_NODE_WIDTH: 140,
2718
+ MESSAGE_NODE_HEIGHT: 32,
2719
+ SELF_LOOP_OFFSET: 48,
2720
+ PARTICIPANT_NODE_WIDTH: 10,
2721
+ MESSAGE_MAX_WIDTH: 240,
2722
+ MESSAGE_TARGET_WRAP_LINES: 2,
2723
+ MESSAGE_CHAR_WIDTH: 7,
2724
+ MESSAGE_LINE_HEIGHT: 20,
2725
+ MESSAGE_HORIZONTAL_PADDING: 24,
2726
+ MESSAGE_VERTICAL_PADDING: 8,
2727
+ ROW_VERTICAL_PADDING: 16,
2728
+ NOTE_OFFSET: 24,
2729
+ BLOCK_TOP_PADDING: 36,
2730
+ BLOCK_BOTTOM_PADDING: 16,
2731
+ BLOCK_SIDE_PADDING: 44,
2732
+ BLOCK_SECTION_PADDING: 22,
2733
+ BLOCK_CONTENT_INSET: 12,
2734
+ BLOCK_FRAME_GAP: 12,
2735
+ BOX_TOP_INSET: 26,
2736
+ BOX_BOTTOM_PADDING: 24
2737
+ };
2738
+ function sanitizeMermaidLabels(src) {
2739
+ if (!src) return src;
2740
+ const subgraphFixed = src.replace(/([A-Za-z0-9_]+)\[((?:(?![\"']).)*?)\]/g, (m, id, label) => {
2741
+ if (/^[\"']/.test(label)) return m;
2742
+ if (/[()\"\[\],:;]/.test(label)) return `${id}[\"${String(label).replace(/\\/g, "\\\\").replace(/\"/g, "\\\"")}\"]`;
2743
+ return m;
2744
+ }).replace(/^([ \t]*subgraph\s+)([^\n\r]+)(\|[^\n\r]*)?$/gim, (m, pre, title, rest) => {
2745
+ const t = String(title).trim();
2746
+ if (/^[\"']/.test(t)) return m;
2747
+ if (/[()\"\[\],:;]/.test(t)) return `${pre}\"${t.replace(/\\/g, "\\\\").replace(/\"/g, "\\\"")}\"${rest || ""}`;
2748
+ return m;
2749
+ });
2750
+ const diagRegex = /\b(graph|flowchart|sequenceDiagram|stateDiagram|classDiagram|gantt|journey|erDiagram|gitGraph|pie|timeline|infoDiagram)\b/i;
2751
+ const allStarts = [];
2752
+ let mm;
2753
+ const globalRegex = new RegExp(diagRegex.source, "gim");
2754
+ while ((mm = globalRegex.exec(subgraphFixed)) !== null) {
2755
+ allStarts.push(mm.index);
2756
+ if (globalRegex.lastIndex === mm.index) globalRegex.lastIndex++;
2757
+ }
2758
+ if (allStarts.length <= 1) return subgraphFixed;
2759
+ const first = allStarts[0];
2760
+ const second = allStarts[1];
2761
+ return subgraphFixed.slice(first, second).trim();
2762
+ }
1990
2763
  const LABEL_TYPE_PREFIX = /^\s*type:(\w+)\s*[:|-]\s*/i;
1991
2764
  const TAG_TO_NODE_TYPE = {
1992
2765
  builder: "builder",
@@ -2997,12 +3770,7 @@ function convertSequenceDiagramToReactFlow(mermaidCode) {
2997
3770
  lifelineHeight: grid.contentHeight,
2998
3771
  activations,
2999
3772
  links: participant.links
3000
- }, participant.createdAtRow === void 0 ? {} : { lifelineStartRow: grid.toLayoutRow(participant.createdAtRow) }), participant.destroyedAtRow === void 0 ? {} : { lifelineEndRow: grid.toLastLayoutRow(participant.destroyedAtRow) }), {}, { componentFields: [generateComponentFieldNameInput(participant.name), generateComponentFieldInput({
3001
- componentFieldId: "color",
3002
- label: "Color",
3003
- data: SEQUENCE_PARTICIPANT_COLOR,
3004
- type: require_component_type.ComponentInputType.ColorPicker
3005
- })] })
3773
+ }, participant.createdAtRow === void 0 ? {} : { lifelineStartRow: grid.toLayoutRow(participant.createdAtRow) }), participant.destroyedAtRow === void 0 ? {} : { lifelineEndRow: grid.toLastLayoutRow(participant.destroyedAtRow) }), {}, { componentFields: [generateComponentFieldNameInput(participant.name)] })
3006
3774
  });
3007
3775
  }
3008
3776
  for (const note of data.notes) {
@@ -3134,6 +3902,7 @@ function detectDiagramType(code) {
3134
3902
  for (const line of lines) {
3135
3903
  const trimmed = line.trim().toLowerCase();
3136
3904
  if (trimmed.startsWith("sequencediagram")) return "sequence";
3905
+ if (trimmed.startsWith("c4")) return "c4";
3137
3906
  if (trimmed.startsWith("flowchart") || trimmed.startsWith("graph")) return "flowchart";
3138
3907
  }
3139
3908
  return "flowchart";
@@ -4361,7 +5130,6 @@ function createReactFlowElements(nodes, edges, subgraphs, subgraphLayouts, subgr
4361
5130
  edges: edges.map((edge, index) => {
4362
5131
  const edgeStyle = { strokeWidth: 2.5 };
4363
5132
  const edgeType = "default";
4364
- const animated = true;
4365
5133
  switch (edge.type) {
4366
5134
  case "-->":
4367
5135
  case "->": break;
@@ -4384,7 +5152,6 @@ function createReactFlowElements(nodes, edges, subgraphs, subgraphLayouts, subgr
4384
5152
  target: targetId,
4385
5153
  label: edge.label,
4386
5154
  type: edgeType,
4387
- animated,
4388
5155
  style: edgeStyle,
4389
5156
  labelStyle: {
4390
5157
  fontSize: "12px",
@@ -4443,7 +5210,9 @@ function convertMermaidToReactFlow(_x3) {
4443
5210
  function _convertMermaidToReactFlow() {
4444
5211
  _convertMermaidToReactFlow = _asyncToGenerator(function* (mermaidCode) {
4445
5212
  try {
4446
- if (detectDiagramType(mermaidCode) === "sequence") return convertSequenceDiagramToReactFlow(mermaidCode);
5213
+ const diagramType = detectDiagramType(mermaidCode);
5214
+ if (diagramType === "sequence") return convertSequenceDiagramToReactFlow(mermaidCode);
5215
+ if (diagramType === "c4") return convertC4MermaidToReactFlow(mermaidCode);
4447
5216
  return convertFlowchartToReactFlow(mermaidCode);
4448
5217
  } catch (error) {
4449
5218
  console.error("Error converting Mermaid to React Flow:", error);
@@ -5066,6 +5835,7 @@ function _convertMermaidToReactFlowWithContext() {
5066
5835
  if ((_ctx$style = ctx.style) === null || _ctx$style === void 0 ? void 0 : _ctx$style.height) clonedNode.height = ctx.style.height;
5067
5836
  if ((_ctx$style2 = ctx.style) === null || _ctx$style2 === void 0 ? void 0 : _ctx$style2.width) clonedNode.width = ctx.style.width;
5068
5837
  clonedNode.data = _objectSpread2(_objectSpread2(_objectSpread2({}, clonedNode.data), (0, daily_code.objectPick)((_ctx$style3 = ctx.style) !== null && _ctx$style3 !== void 0 ? _ctx$style3 : {}, [
5838
+ "color",
5069
5839
  "fill",
5070
5840
  "stroke",
5071
5841
  "strokeWidth",
@@ -5122,6 +5892,10 @@ function _convertMermaidToReactFlowWithContext() {
5122
5892
  if (nodeParent) return _objectSpread2(_objectSpread2({}, node), {}, { parentId: nodeParent.id });
5123
5893
  return node;
5124
5894
  })];
5895
+ if (isSequenceDiagram(combinedNodes)) return {
5896
+ edges: resolvedEdges,
5897
+ nodes: combinedNodes
5898
+ };
5125
5899
  return {
5126
5900
  edges: resolvedEdges,
5127
5901
  nodes: (options === null || options === void 0 ? void 0 : options.repositionNodes) ? resizeNodesLayouts(combinedNodes) : combinedNodes
@@ -5735,20 +6509,16 @@ function resolveMermaidDetailedNodeLabel(node) {
5735
6509
  ]);
5736
6510
  }
5737
6511
  if (nodeType === "sequenceParticipant") {
5738
- var _getFieldString4, _getFieldString5;
6512
+ var _getFieldString4;
5739
6513
  const label = (_getFieldString4 = getFieldString(componentFields, "Label")) !== null && _getFieldString4 !== void 0 ? _getFieldString4 : pickString(nodeData === null || nodeData === void 0 ? void 0 : nodeData.label);
5740
6514
  const participantName = name !== null && name !== void 0 ? name : label;
5741
6515
  const rowCount = typeof (nodeData === null || nodeData === void 0 ? void 0 : nodeData.rowCount) === "number" ? nodeData.rowCount : void 0;
5742
- const color = (_getFieldString5 = getFieldString(componentFields, "Color")) !== null && _getFieldString5 !== void 0 ? _getFieldString5 : pickString(nodeData === null || nodeData === void 0 ? void 0 : nodeData.color);
6516
+ const color = pickString(nodeData === null || nodeData === void 0 ? void 0 : nodeData.color);
5743
6517
  return buildDetailedLabel([
5744
6518
  participantName ? `SequenceParticipant: ${participantName}` : "SequenceParticipant",
5745
6519
  ...typeof rowCount === "number" ? [`rows: ${rowCount}`] : [],
5746
6520
  ...color ? [`color: ${color}`] : [],
5747
- ...buildFieldLines(componentFields, new Set([
5748
- "name",
5749
- "label",
5750
- "color"
5751
- ]))
6521
+ ...buildFieldLines(componentFields, new Set(["name", "label"]))
5752
6522
  ]);
5753
6523
  }
5754
6524
  if (nodeType === "comment") return buildDetailedLabel([`Comment: ${(typeof (nodeData === null || nodeData === void 0 ? void 0 : nodeData.isResolved) === "boolean" ? nodeData.isResolved : void 0) ? "Resolved" : "Open"}`, ...buildFieldLines(componentFields, new Set(["name"]))]);
@@ -5831,6 +6601,8 @@ function convertUiGraphToMermaid(input, options) {
5831
6601
  exports.AstToSqlGenerator = AstToSqlGenerator;
5832
6602
  exports.AstToUiConverter = AstToUiConverter;
5833
6603
  exports.BasicDetailsSchema = BasicDetailsSchema;
6604
+ exports.C4_COLORS = C4_COLORS;
6605
+ exports.C4_LAYOUT = C4_LAYOUT;
5834
6606
  exports.ComponentInputType = require_component_type.ComponentInputType;
5835
6607
  exports.DialectIdSchema = DialectIdSchema;
5836
6608
  exports.DocumentCollectionSchema = DocumentCollectionSchema;
@@ -5848,10 +6620,11 @@ exports.MongoNestedFieldSchema = MongoNestedFieldSchema;
5848
6620
  exports.NestedFieldSchema = NestedFieldSchema;
5849
6621
  exports.NoSqlFieldSchema = NoSqlFieldSchema;
5850
6622
  exports.SEQUENCE_LAYOUT = SEQUENCE_LAYOUT;
5851
- exports.SEQUENCE_PARTICIPANT_COLOR = SEQUENCE_PARTICIPANT_COLOR;
5852
6623
  exports.SqlToAstParser = SqlToAstParser;
5853
6624
  exports.buildMetaData = buildMetaData;
5854
6625
  exports.contextSchema = require_headless.contextSchema;
6626
+ exports.convertC4MermaidToReactFlow = convertC4MermaidToReactFlow;
6627
+ exports.convertC4ToReactFlow = convertC4ToReactFlow;
5855
6628
  exports.convertDynamoSchemaToAst = convertDynamoSchemaToAst;
5856
6629
  exports.convertJsonSchemaToAst = convertJsonSchemaToAst;
5857
6630
  exports.convertMermaidToReactFlow = convertMermaidToReactFlow;
@@ -5864,6 +6637,9 @@ exports.estimateSequenceMessageBoxSize = estimateSequenceMessageBoxSize;
5864
6637
  exports.flattenMetaData = flattenMetaData;
5865
6638
  exports.generateTableNodeId = generateTableNodeId;
5866
6639
  exports.generateUUID = generateUUID;
6640
+ exports.getC4ElementColors = getC4ElementColors;
6641
+ exports.isC4Diagram = isC4Diagram;
5867
6642
  exports.isSequenceDiagram = isSequenceDiagram;
6643
+ exports.parseC4Diagram = parseC4Diagram;
5868
6644
  exports.sanitizeMermaidLabels = sanitizeMermaidLabels;
5869
6645
  exports.syncBaseData = syncBaseData;