diagrams-js 0.2.3 → 0.2.4

package/dist/index.js

@@ -11,7 +11,7 @@ var e=(()=>{var e=import.meta.url;return(function(t={}){var n,r=t,i,a,o=new Prom
 <svg xmlns="http://www.w3.org/2000/svg" width="${t.width}" height="${t.height}"></svg>
 `;return e.FS.createPath(`/`,e.PATH.dirname(n)),e.FS.writeFile(n,r),n}):[]}function l(e,t){for(let n of t)e.FS.analyzePath(n).exists&&e.FS.unlink(n)}function u(e,t,n){let r;try{let n=e.lengthBytesUTF8(t);return r=e.ccall(`malloc`,`number`,[`number`],[n+1]),e.stringToUTF8(t,r,n+1),e.ccall(`viz_read_one_graph`,`number`,[`number`],[r])}finally{r&&e.ccall(`free`,`number`,[`number`],[r])}}function d(e,t,n){let r=e.ccall(`viz_create_graph`,`number`,[`string`,`number`,`number`],[t.name,t.directed===void 0?!0:t.directed,t.strict===void 0?!1:t.strict]);return f(e,r,t),r}function f(e,t,n){p(e,t,n),n.nodes&&n.nodes.forEach(n=>{if(n.name===void 0)throw Error(`nodes must have a name`);let r=e.ccall(`viz_add_node`,`number`,[`number`,`string`],[t,String(n.name)]);n.attributes&&m(e,t,r,n.attributes)}),n.edges&&n.edges.forEach(n=>{if(n.tail===void 0)throw Error(`edges must have a tail`);if(n.head===void 0)throw Error(`edges must have a head`);let r=e.ccall(`viz_add_edge`,`number`,[`number`,`string`,`string`],[t,String(n.tail),String(n.head)]);n.attributes&&m(e,t,r,n.attributes)}),n.subgraphs&&n.subgraphs.forEach(n=>{f(e,e.ccall(`viz_add_subgraph`,`number`,[`number`,`string`],[t,n.name===void 0?0:String(n.name)]),n)})}function p(e,t,n){if(n.graphAttributes)for(let[r,i]of Object.entries(n.graphAttributes))h(e,t,i,n=>{e.ccall(`viz_set_default_graph_attribute`,`number`,[`number`,`string`,`number`],[t,r,n])});if(n.nodeAttributes)for(let[r,i]of Object.entries(n.nodeAttributes))h(e,t,i,n=>{e.ccall(`viz_set_default_node_attribute`,`number`,[`number`,`string`,`number`],[t,r,n])});if(n.edgeAttributes)for(let[r,i]of Object.entries(n.edgeAttributes))h(e,t,i,n=>{e.ccall(`viz_set_default_edge_attribute`,`number`,[`number`,`string`,`number`],[t,r,n])})}function m(e,t,n,r){for(let[i,a]of Object.entries(r))h(e,t,a,t=>{e.ccall(`viz_set_attribute`,`number`,[`number`,`string`,`number`],[n,i,t])})}function h(e,t,n,r){let i;if(i=typeof n==`object`&&`html`in n?e.ccall(`viz_string_dup_html`,`number`,[`number`,`string`],[t,String(n.html)]):e.ccall(`viz_string_dup`,`number`,[`number`,`string`],[t,String(n)]),i==0)throw Error(`couldn't dup string`);r(i),typeof n==`object`&&`html`in n?e.ccall(`viz_string_free_html`,`number`,[`number`,`number`],[t,i]):e.ccall(`viz_string_free`,`number`,[`number`,`number`],[t,i])}var g=class{constructor(e){this.module=e}get graphvizVersion(){return i(this.module)}get formats(){return a(this.module,`device`)}get engines(){return a(this.module,`layout`)}renderFormats(e,t,n={}){return o(this.module,e,t,{engine:`dot`,...n})}render(e,t={}){let n;n=t.format===void 0?`dot`:t.format;let r=o(this.module,e,[n],{engine:`dot`,...t});return r.status===`success`&&(r.output=r.output[n]),r}renderString(e,t={}){let n=this.render(e,t);if(n.status!==`success`)throw Error(n.errors.find(e=>e.level==`error`)?.message||`render failed`);return n.output}renderSVGElement(e,t={}){let n=this.renderString(e,{...t,format:`svg`}),r;return r=t.trustedTypePolicy===void 0?n:t.trustedTypePolicy.createHTML(n),new DOMParser().parseFromString(r,`image/svg+xml`).documentElement}renderJSON(e,t={}){let n=this.renderString(e,{...t,format:`json`});return JSON.parse(n)}};function ee(){return e().then(e=>new g(e))}var _=class{stack=[];get(){return this.stack[this.stack.length-1]}push(e){this.stack.push(e)}pop(){return this.stack.pop()}};const v=new _;new _;function y(e){v.push(e)}const b={shape:`box`,style:`rounded`,labeljust:`l`,fontname:`Sans-Serif`,fontsize:`12`};function x(e=`cluster`,t=`LR`,n,r,i){let a=new Map,o=[],s=`cluster_${e.replace(/\s+/g,`_`)}`;if(!r)throw Error(`Cluster must be created through diagram.cluster() or cluster.cluster()`);let c=r.themeConfig,l={...b};l.label=e,l.pencolor=c.pencolor;let u=i?i.depth+1:0,d=c.bgcolor;l.bgcolor=d[u%d.length],n&&Object.assign(l,n);let f={label:e,name:s,depth:u,graphAttr:l,get diagram(){return r},"~node"(e,t,n){a.set(e,{label:t,attrs:n})},add(e){return e[`~register`](f),e},subgraph(e){o.push(e)},cluster(e){let t=x(e,`LR`,void 0,r,f);return o.push(t),t},getNodes(){return a},getSubgraphs(){return o},getParent(){return i},getDiagram(){return r}};return f}function S(e={}){let t=e.node,n=e.forward??!1,r=e.reverse??!1,i={};e.label&&(i.label=e.label),e.color&&(i.color=e.color),e.style&&(i.style=e.style);for(let[t,n]of Object.entries(e))t!==`node`&&t!==`forward`&&t!==`reverse`&&t!==`label`&&t!==`color`&&t!==`style`&&(i[t]=String(n));let a={get node(){return t},set node(e){t=e},get forward(){return n},set forward(e){n=e},get reverse(){return r},set reverse(e){r=e},get attrs(){let e;return e=n&&r?`both`:n?`forward`:r?`back`:`none`,{...i,dir:e}},to(e){return n=!0,C(e)?(Object.assign(i,e.attrs),a):t?(t[`~connect`](e,a),e):(t=e,e)},from(e){return r=!0,C(e)?(Object.assign(i,e.attrs),a):t?(e[`~connect`](t,a),e):(t=e,e)}};return a}function C(e){return typeof e==`object`&&!!e&&`attrs`in e&&`forward`in e&&`reverse`in e}function w(e){return S({label:e})}function T(e){return S({color:e})}function E(e){return S({style:e})}S.label=w,S.color=T,S.style=E;const D={pastel:{bgcolor:[`#E5F5FD`,`#EBF3E7`,`#ECE8F6`,`#FDF7E3`],pencolor:`#AEB6BE`,edgecolor:`#7B8894`},neutral:{bgcolor:[`#F8F9FA`,`#F1F3F5`,`#E9ECEF`,`#DEE2E6`],pencolor:`#ADB5BD`,edgecolor:`#495057`},blues:{bgcolor:[`#E7F5FF`,`#D0EBFF`,`#A5D8FF`,`#74C0FC`],pencolor:`#339AF0`,edgecolor:`#1971C2`},greens:{bgcolor:[`#EBFBEE`,`#D3F9D8`,`#B2F2BB`,`#8CE99A`],pencolor:`#40C057`,edgecolor:`#2F9E44`},orange:{bgcolor:[`#FFF4E6`,`#FFE8CC`,`#FFD8A8`,`#FFC078`],pencolor:`#FD7E14`,edgecolor:`#E8590C`}};function te(){return typeof window<`u`&&typeof document<`u`}function O(e){let t=e.match(/translate\(\s*([^,\s]+)[,\s]+([^\s)]+)\s*\)/);return t?{x:parseFloat(t[1]),y:parseFloat(t[2])}:null}function k(e){let t=e.match(/transform="([^"]+)"/);if(t){let e=O(t[1]);if(e)return e}let n=e.match(/<ellipse[^>]+cx="([^"]+)"[^>]+cy="([^"]+)"/);if(n)return{x:parseFloat(n[1]),y:parseFloat(n[2])};let r=e.match(/<polygon[^>]+points="([^"]+)"/);if(r){let e=r[1].match(/[-\d.]+/g);if(e&&e.length>=4){let t=0,n=0,r=0;for(let i=0;i<e.length;i+=2)t+=parseFloat(e[i]),n+=parseFloat(e[i+1]),r++;return{x:t/r,y:n/r}}}let i=e.match(/<path[^>]+d="([^"]+)"/);if(i){let e=i[1].match(/[-\d.]+/g);if(e&&e.length>=4){let t=[],n=[];for(let r=0;r<e.length;r+=2){let i=parseFloat(e[r]),a=parseFloat(e[r+1]);!isNaN(i)&&!isNaN(a)&&(t.push(i),n.push(a))}if(t.length>0&&n.length>0)return{x:(Math.min(...t)+Math.max(...t))/2,y:(Math.min(...n)+Math.max(...n))/2}}}let a=e.match(/<text[^>]*\sx="([^"]+)"/),o=e.match(/<text[^>]*\sy="([^"]+)"/);if(a&&o){let t=e.match(/font-size="([^"]+)"/),n=t?parseFloat(t[1]):13;return{x:parseFloat(a[1]),y:parseFloat(o[1])-n-32}}return null}function ne(e){let t=e.match(/<title>([^<]*)<\/title>/);return t?t[1].replace(/&#(\d+);/g,(e,t)=>String.fromCharCode(parseInt(t,10))):null}function re(e){let t=0;for(let n=0;n<e.length;n++){let r=e.charCodeAt(n);t=(t<<5)-t+r,t&=t}return`icon-${Math.abs(t).toString(36)}`}function ie(e,t,n){return!n||Object.keys(n).length===0||t.length===0?e:te()?ae(e,t,n):A(e,t,n)}function ae(e,t,n){let r=new DOMParser().parseFromString(e,`image/svg+xml`).querySelector(`svg`);if(!r)return console.warn(`No SVG element found`),e;let i=r.querySelector(`defs`);i||(i=document.createElementNS(`http://www.w3.org/2000/svg`,`defs`),r.insertBefore(i,r.firstChild));let a=new Map;return r.querySelectorAll(`g.node`).forEach(e=>{let r=e.querySelector(`title`);if(!r)return;let o=r.textContent,s=t.find(e=>e.node.nodeId===o);if(!s||!n[s.icon])return;let c=n[s.icon],l;if(a.has(c))l=a.get(c);else{l=re(c),a.set(c,l);let e=document.createElementNS(`http://www.w3.org/2000/svg`,`g`);e.setAttribute(`id`,l);let t=document.createElementNS(`http://www.w3.org/2000/svg`,`image`);t.setAttribute(`x`,`-24`),t.setAttribute(`y`,`-24`),t.setAttribute(`width`,`48`),t.setAttribute(`height`,`48`),t.setAttribute(`href`,c),t.setAttribute(`preserveAspectRatio`,`xMidYMid meet`),e.appendChild(t),i.appendChild(e)}let u,d,f=e.getAttribute(`transform`);if(f&&f!==`null`){let e=f.match(/translate\(\s*([^,\s]+)[,\s]+([^\s)]+)\s*\)/);if(!e)return;u=parseFloat(e[1]),d=parseFloat(e[2])}else{let t=e.querySelector(`ellipse`),n=e.querySelector(`polygon`),r=e.querySelector(`path`),i=e.querySelector(`text`);if(t){let e=t.getAttribute(`cx`),n=t.getAttribute(`cy`);if(!e||!n)return;u=parseFloat(e),d=parseFloat(n)}else if(n){let e=n.getAttribute(`points`);if(!e)return;let t=e.match(/[-\d.]+/g);if(!t||t.length<4)return;let r=0,i=0,a=0;for(let e=0;e<t.length;e+=2)r+=parseFloat(t[e]),i+=parseFloat(t[e+1]),a++;u=r/a,d=i/a}else if(r){let e=r.getAttribute(`d`);if(!e)return;let t=e.match(/[-\d.]+/g);if(!t||t.length<4)return;let n=[],i=[];for(let e=0;e<t.length;e+=2){let r=parseFloat(t[e]),a=parseFloat(t[e+1]);!isNaN(r)&&!isNaN(a)&&(n.push(r),i.push(a))}if(n.length===0||i.length===0)return;u=(Math.min(...n)+Math.max(...n))/2,d=(Math.min(...i)+Math.max(...i))/2}else if(i){let e=i.getAttribute(`x`),t=i.getAttribute(`y`),n=i.getAttribute(`font-size`);if(!e||!t)return;u=parseFloat(e),d=parseFloat(t)-(n?parseFloat(n):13)-32}else return}let p=document.createElementNS(`http://www.w3.org/2000/svg`,`use`);p.setAttribute(`href`,`#${l}`),p.setAttribute(`x`,String(u)),p.setAttribute(`y`,String(d+6)),e.appendChild(p)}),new XMLSerializer().serializeToString(r)}function A(e,t,n){let r=new Map,i=[],a=/<g[^>]*class="node"[^>]*>([\s\S]*?)<\/g>/g,o=e,s,c=[];for(;(s=a.exec(e))!==null;){let e=s[0],a=ne(e);if(!a)continue;let o=t.find(e=>e.node.nodeId===a);if(!o||!n[o.icon])continue;let l=n[o.icon],u;if(r.has(l))u=r.get(l);else{u=re(l),r.set(l,u);let e=`<g id="${u}"><image x="-24" y="-24" width="48" height="48" href="${l}" preserveAspectRatio="xMidYMid meet"/></g>`;i.push(e)}let d=k(e);if(!d)continue;let f=`<use href="#${u}" x="${d.x}" y="${d.y+6}"/>`,p=e.replace(/<\/g>$/,`${f}</g>`);c.push({original:e,replacement:p})}for(let{original:e,replacement:t}of c)o=o.replace(e,t);if(i.length>0){let e=`<defs>\n${i.join(`
 `)}\n</defs>`;o=o.replace(/(<svg[^>]*>)/,`$1\n${e}`)}return o}function j(e){return typeof e==`object`&&!!e&&`attrs`in e&&`forward`in e&&`reverse`in e}function oe(){return`${Date.now().toString(36)}_${Math.random().toString(36).substr(2,9)}`}function M(e=``,t={}){let n=t.nodeId??oe(),r=null,i,a={},o=null,s=t[`~iconDataUrl`];s&&(o=s);let c={shape:t.shape!==void 0,height:t.height!==void 0,width:t.width!==void 0,fixedsize:t.fixedsize!==void 0,margin:t.margin!==void 0,labelloc:t.labelloc!==void 0,imagescale:t.imagescale!==void 0};c.shape?a.shape=String(t.shape):o&&(a.shape=`none`);for(let[e,n]of Object.entries(t))e.startsWith(`~`)||e===`nodeId`||e===`shape`||(a[e]=String(n));o&&Object.assign(a,{height:`0.9`,width:`0.8`,fixedsize:`true`,margin:`0,0`,labelloc:`b`,imagescale:`true`});let l={label:e,"~id":n,"~diagram":null,"~cluster":void 0,"~attrs":a,get"~iconDataUrl"(){return o},set"~iconDataUrl"(e){o=e},get nodeId(){return n},get cluster(){return i},"~register"(o){if(N(o)?(i=o,r=o.diagram):r=o,r[`~trackNode`](this),r&&r.autolabel){let n=t[`~type`]??`Node`;e?l.label=n+`
-`+e:l.label=n}let s=l[`~iconDataUrl`];if(s&&(c.shape||(r[`~userNodeAttr`]?.shape?a.shape=r[`~userNodeAttr`].shape:a.shape=`none`),c.height||(r[`~userNodeAttr`]?.height?a.height=r[`~userNodeAttr`].height:a.height=`0.9`),c.width||(r[`~userNodeAttr`]?.width?a.width=r[`~userNodeAttr`].width:a.width=`0.8`),c.fixedsize||(r[`~userNodeAttr`]?.fixedsize?a.fixedsize=r[`~userNodeAttr`].fixedsize:a.fixedsize=`true`),c.margin||(r[`~userNodeAttr`]?.margin?a.margin=r[`~userNodeAttr`].margin:a.margin=`0,0`),c.labelloc||(r[`~userNodeAttr`]?.labelloc?a.labelloc=r[`~userNodeAttr`].labelloc:a.labelloc=`b`),c.imagescale||(r[`~userNodeAttr`]?.imagescale?a.imagescale=r[`~userNodeAttr`].imagescale:a.imagescale=`true`),r[`~trackNodeWithIcon`](l,s)),N(o),o[`~node`](n,e,a),P(this)&&r){let e=se(this,r);r[`~trackPendingIconLoad`](e)}},to(e,t){if(j(e)){if(e.node=l,e.forward=!0,t===void 0)return e;let n=t;if(Array.isArray(n)){for(let t of n){let n=S({...e.attrs,node:l,forward:!0});l[`~connect`](t,n)}return n}return l[`~connect`](n,e)}let n=e;if(Array.isArray(n)){for(let e of n){let t=S({node:l,forward:!0});l[`~connect`](e,t)}return n}let r=S({node:l,forward:!0});return l[`~connect`](n,r)},from(e,t){if(j(e)){e.node=l,e.reverse=!0;let n=t;if(Array.isArray(n)){for(let t of n){let n=S({...e.attrs,node:l,reverse:!0});l[`~connect`](t,n)}return l}return l[`~connect`](n,e)}let n=e;if(Array.isArray(n)){for(let e of n){let t=S({node:e,reverse:!0});l[`~connect`](e,t)}return l}let r=S({node:n,reverse:!0});return l[`~connect`](n,r)},with(e,t){if(j(e)){e.node=l;let n=t;if(Array.isArray(n)){for(let t of n){let n=S({...e.attrs,node:l});l[`~connect`](t,n)}return n}return l[`~connect`](n,e)}let n=e,r=S({node:l});if(Array.isArray(n)){for(let e of n)l[`~connect`](e,r);return n}return l[`~connect`](n,r)},"~connect"(e,t){if(!e||typeof e!=`object`||!(`nodeId`in e))throw Error(`${String(e)} is not a valid Node`);if(!t||typeof t!=`object`||!(`attrs`in t))throw Error(`${String(t)} is not a valid Edge`);if(!r)throw Error(`Node is not registered with a diagram`);return r[`~connect`](l,e,t),e}};return l}function N(e){return typeof e==`object`&&!!e&&`getNodes`in e&&typeof e.getNodes==`function`}function P(e){return`~getIconUrl`in e&&typeof e[`~getIconUrl`]==`function`}async function se(e,t){let n=e,r=n[`~getIconUrl`]();if(r.startsWith(`data:`)){t[`~trackNodeWithIcon`](e,r);return}try{let r=await n.loadIcon();r&&t[`~trackNodeWithIcon`](e,r)}catch(t){console.warn(`Failed to load custom icon for node ${e.nodeId}:`,t)}}async function ce(e,t){try{return await import(`./${e}/${t}`)}catch{}try{return await import(`./providers/${e}/${t}.js`)}catch{}let n,r;n=`diagrams`,r=`js`;try{return await import(`${n}-${r}/${e}/${t}`)}catch{}try{return await import(`https://esm.sh/${n}-${r}/${e}/${t}`)}catch{}return null}async function le(e){let t=new Map;for(let[n,r]of e){let e=await ce(n,r);if(e)for(let[n,r]of Object.entries(e))typeof r==`function`&&!n.startsWith(`_`)&&t.set(n,r)}return t}const F=new Set([`shape`,`height`,`width`,`fixedsize`,`margin`,`labelloc`,`imagescale`]),ue={shape:`none`,height:`0.9`,width:`0.8`,fixedsize:`true`,margin:`0,0`,labelloc:`b`,imagescale:`true`};function de(e,t,n,r){let i={id:e};if(t&&(i.label=t),r){let e=r,t=e[`~provider`],n=e[`~type`],a=e[`~resourceType`];t&&(i.provider=t),n&&(i.service=n),a&&(i.type=a),`~getIconUrl`in e&&typeof e[`~getIconUrl`]==`function`&&(i.iconUrl=e[`~getIconUrl`]())}let a=i.provider!=null,o=i.iconUrl!=null,s=a||o,c={};for(let[e,t]of Object.entries(n))if(!e.startsWith(`~`)){if(s&&F.has(e)){let n=ue[e];if(n!==void 0&&String(t)===n)continue}c[e]=typeof t==`number`?t:String(t)}return Object.keys(c).length>0&&(i.attrs=c),i}function fe(e,t,n){let r={label:e.label},i=[];for(let[r,{label:a,attrs:o}]of e.getNodes())i.push(r),t.push(de(r,a,o,n.get(r)));i.length>0&&(r.nodes=i);let a={};for(let[t,n]of Object.entries(e.graphAttr))t===`shape`||t===`style`||t===`labeljust`||t===`fontname`||t===`fontsize`||t===`label`||t===`pencolor`||t===`bgcolor`||(a[t]=n);Object.keys(a).length>0&&(r.graphAttr=a);let o=e.getSubgraphs();return o.length>0&&(r.clusters=o.map(e=>fe(e,t,n))),r}function pe(e){return e.map(e=>{let t={from:e.from,to:e.to},{dir:n,label:r,color:i,style:a,...o}=e.attrs;return n&&n!==`forward`&&(t.direction=n),r&&(t.label=r),i&&(t.color=i),a&&(t.style=a),Object.keys(o).length>0&&(t.attrs=o),t})}function me(e,t,n,r,i,a,o){let s={nodes:[]};e.name&&(s.name=e.name);let c=e.name?e.name.toLowerCase().replace(/\s+/g,`_`):`diagram`;e.filename!==c&&(s.filename=e.filename),e.direction!==`LR`&&(s.direction=e.direction),e.curveStyle!==`ortho`&&(s.curvestyle=e.curveStyle),e.autolabel&&(s.autolabel=e.autolabel),e.strict&&(s.strict=e.strict),e.theme!==`pastel`&&(s.theme=e.theme),o.graphAttr&&Object.keys(o.graphAttr).length>0&&(s.graphAttr={...o.graphAttr}),o.nodeAttr&&Object.keys(o.nodeAttr).length>0&&(s.nodeAttr={...o.nodeAttr}),o.edgeAttr&&Object.keys(o.edgeAttr).length>0&&(s.edgeAttr={...o.edgeAttr});let l=new Map(a);for(let e of i)l.has(e.node.nodeId)||l.set(e.node.nodeId,e.node);let u=new Set;function d(e){for(let[t]of e.getNodes())u.add(t);for(let t of e.getSubgraphs())d(t)}for(let e of r)d(e);let f=[];for(let[e,{label:n,attrs:r}]of t)u.has(e)||s.nodes.push(de(e,n,r,l.get(e)));return r.length>0&&(s.clusters=r.map(e=>fe(e,f,l)),s.nodes.push(...f)),n.length>0&&(s.edges=pe(n)),s}async function he(e,t){let n=typeof e==`string`?JSON.parse(e):e;if(!n.nodes||!Array.isArray(n.nodes))throw Error(`Invalid diagram JSON: 'nodes' array is required`);let r=new Map;for(let e of n.nodes)if(e.provider&&e.service){let t=`${e.provider}/${e.service}`;r.set(t,[e.provider,e.service])}let i=await le(Array.from(r.values()));if(t?.providers)for(let e of t.providers)for(let[t,n]of Object.entries(e))typeof n==`function`&&!t.startsWith(`_`)&&i.set(t,n);let a={};n.name!==void 0&&(a.name=n.name),n.filename!==void 0&&(a.filename=n.filename),n.direction!==void 0&&(a.direction=n.direction),n.curvestyle!==void 0&&(a.curvestyle=n.curvestyle),n.autolabel!==void 0&&(a.autolabel=n.autolabel),n.strict!==void 0&&(a.strict=n.strict),n.theme!==void 0&&(a.theme=n.theme),n.graphAttr!==void 0&&(a.graphAttr=n.graphAttr),n.nodeAttr!==void 0&&(a.nodeAttr=n.nodeAttr),n.edgeAttr!==void 0&&(a.edgeAttr=n.edgeAttr);let o=L(n.name??``,a),s=new Map,c=new Map;if(n.clusters){function e(t,n){let r=[...n,t.label];if(t.nodes)for(let e of t.nodes)c.set(e,r);if(t.clusters)for(let n of t.clusters)e(n,r)}for(let t of n.clusters)e(t,[])}let l=new Map;if(n.clusters){function e(t,n){let r=n.cluster(t.label);if(t.graphAttr&&Object.assign(r.graphAttr,t.graphAttr),l.set(t.label,r),t.clusters)for(let n of t.clusters)e(n,r)}for(let t of n.clusters)e(t,o)}for(let e of n.nodes){if(s.has(e.id))throw Error(`Duplicate node ID: "${e.id}"`);let t,n=e.type?i.get(e.type):void 0;if(n)t=n(e.label??``,{nodeId:e.id,...e.attrs});else{let n={nodeId:e.id};e.attrs&&Object.assign(n,e.attrs),t=M(e.label??``,n);let r=t;e.provider&&(r[`~provider`]=e.provider),e.service&&(r[`~type`]=e.service),e.type&&(r[`~resourceType`]=e.type),e.iconUrl&&(r[`~iconDataUrl`]=e.iconUrl)}let r=c.get(e.id);if(r&&r.length>0){let e=r[r.length-1],n=l.get(e);n?n.add(t):o.add(t)}else o.add(t);s.set(e.id,t)}if(n.edges)for(let e of n.edges){let t=s.get(e.from),n=s.get(e.to);if(!t)throw Error(`Edge references unknown source node: "${e.from}"`);if(!n)throw Error(`Edge references unknown target node: "${e.to}"`);let r=e.direction??`forward`,i={};e.label&&(i.label=e.label),e.color&&(i.color=e.color),e.style&&(i.style=e.style),e.attrs&&Object.assign(i,e.attrs);let a=S(i);switch(r){case`forward`:a.forward=!0;break;case`back`:a.reverse=!0;break;case`both`:a.forward=!0,a.reverse=!0;break;case`none`:break;default:a.forward=!0}t[`~connect`](n,a)}return o}const ge=[`TB`,`BT`,`LR`,`RL`],_e=[`ortho`,`curved`,`spline`,`polyline`],I={pad:`0.05`,splines:`ortho`,nodesep:`0.15`,ranksep:`0.20`,fontname:`Sans-Serif`,fontsize:`10`},ve={shape:`box`,style:`rounded`,fontname:`Sans-Serif`,fontsize:`8`},ye={arrowsize:`0.5`,fontcolor:`#2D3436`,fontname:`Sans-Serif`,fontsize:`8`};function L(e=``,t={}){let n=new Map,r=[],i=[],a=null,o=[],s=new Map,c={},l=[],u=t.name??e,d=t.filename??(u?u.toLowerCase().replace(/\s+/g,`_`):`diagram`),f=t.direction??`LR`;if(!ge.includes(f))throw Error(`"${f}" is not a valid direction`);let p=t.curvestyle??`ortho`;if(!_e.includes(p))throw Error(`"${p}" is not a valid curve style`);let m=t.theme??`pastel`;if(!(m in D))throw Error(`"${m}" is not a valid theme. Choose from: ${Object.keys(D).join(`, `)}`);let h=D[m],g=t.autolabel??!1,_=t.strict??!1,v={...I},b={...ve},S={...ye};S.color=h.edgecolor,v.label=u,v.rankdir=f,v.splines=p,t.graphAttr&&Object.assign(v,t.graphAttr);let C=t.nodeAttr?{shape:t.nodeAttr.shape,height:t.nodeAttr.height,width:t.nodeAttr.width,fixedsize:t.nodeAttr.fixedsize,margin:t.nodeAttr.margin,labelloc:t.nodeAttr.labelloc,imagescale:t.nodeAttr.imagescale}:void 0;t.nodeAttr&&Object.assign(b,t.nodeAttr),t.edgeAttr&&Object.assign(S,t.edgeAttr);let w={name:u,filename:d,direction:f,curveStyle:p,autolabel:g,strict:_,theme:m,themeConfig:h,graphAttr:v,nodeAttr:b,edgeAttr:S,"~userNodeAttr":C,"~registerIcon"(e,t,n){o.push({node:e,icon:t,iconPath:n})},"~setIconData"(e){c=e},"~getNodeIconMap"(){return[...o]},"~getIconData"(){return{...c}},"~trackNodeWithIcon"(e,t){let n=e.nodeId.replace(/[^a-zA-Z0-9]/g,`_`);c[n]=t,o.push({node:e,icon:n,iconPath:t})},"~trackPendingIconLoad"(e){l.push(e)},"~trackNode"(e){s.set(e.nodeId,e)},add(e){return e[`~register`](w),e},"~node"(e,t,r){n.set(e,{label:t,attrs:r})},"~connect"(e,t,n){r.push({from:e.nodeId,to:t.nodeId,attrs:n.attrs})},"~subgraph"(e){i.push(e)},cluster(e){let t=x(e,`LR`,void 0,w);return i.push(t),t},render:(async(e={})=>{await h(),a||=await ee();let t=y(),s=e.format??`svg`;if(s===`dot`)return e.dataUrl?k(t,`dot`):t;if(s===`json`){let t=JSON.stringify(w.toJSON(),null,2);return e.dataUrl?k(t,`json`):t}let d=o.length>0,f=e.injectIcons??d,p=a.render(t,{format:`svg`});if(p.status===`failure`)throw Error(`Graphviz rendering failed: ${p.errors.map(e=>e.message).join(`, `)}`);let m=p.output;return f&&(await g(),Object.keys(c).length>0&&o.length>0&&(m=ie(m,o,c))),s===`png`&&(m=await C(m,e)),s===`jpg`&&(m=await D(m,e)),e.dataUrl&&(m=k(m,s)),m;async function h(){l.length!==0&&(await Promise.all(l),l.length=0)}async function g(){o.length}function y(){let e=`${_?`strict `:``}digraph "${u}" {\n`;for(let[t,n]of Object.entries(v))e+=`  ${t}="${n}";\n`;e+=`  node [
+`+e:l.label=n}let s=l[`~iconDataUrl`];if(s&&(c.shape||(r[`~userNodeAttr`]?.shape?a.shape=r[`~userNodeAttr`].shape:a.shape=`none`),c.height||(r[`~userNodeAttr`]?.height?a.height=r[`~userNodeAttr`].height:a.height=`0.9`),c.width||(r[`~userNodeAttr`]?.width?a.width=r[`~userNodeAttr`].width:a.width=`0.8`),c.fixedsize||(r[`~userNodeAttr`]?.fixedsize?a.fixedsize=r[`~userNodeAttr`].fixedsize:a.fixedsize=`true`),c.margin||(r[`~userNodeAttr`]?.margin?a.margin=r[`~userNodeAttr`].margin:a.margin=`0,0`),c.labelloc||(r[`~userNodeAttr`]?.labelloc?a.labelloc=r[`~userNodeAttr`].labelloc:a.labelloc=`b`),c.imagescale||(r[`~userNodeAttr`]?.imagescale?a.imagescale=r[`~userNodeAttr`].imagescale:a.imagescale=`true`),r[`~trackNodeWithIcon`](l,s)),N(o),o[`~node`](n,e,a),P(this)&&r){let e=se(this,r);r[`~trackPendingIconLoad`](e)}},to(e,t){if(j(e)){if(e.node=l,e.forward=!0,t===void 0)return e;let n=t;if(Array.isArray(n)){for(let t of n){let n=S({...e.attrs,node:l,forward:!0});l[`~connect`](t,n)}return n}return l[`~connect`](n,e)}let n=e;if(Array.isArray(n)){for(let e of n){let t=S({node:l,forward:!0});l[`~connect`](e,t)}return n}let r=S({node:l,forward:!0});return l[`~connect`](n,r)},from(e,t){if(j(e)){e.node=l,e.reverse=!0;let n=t;if(Array.isArray(n)){for(let t of n){let n=S({...e.attrs,node:l,reverse:!0});l[`~connect`](t,n)}return l}return l[`~connect`](n,e)}let n=e;if(Array.isArray(n)){for(let e of n){let t=S({node:e,reverse:!0});l[`~connect`](e,t)}return l}let r=S({node:n,reverse:!0});return l[`~connect`](n,r)},with(e,t){if(j(e)){e.node=l;let n=t;if(Array.isArray(n)){for(let t of n){let n=S({...e.attrs,node:l});l[`~connect`](t,n)}return n}return l[`~connect`](n,e)}let n=e,r=S({node:l});if(Array.isArray(n)){for(let e of n)l[`~connect`](e,r);return n}return l[`~connect`](n,r)},"~connect"(e,t){if(!e||typeof e!=`object`||!(`nodeId`in e))throw Error(`${String(e)} is not a valid Node`);if(!t||typeof t!=`object`||!(`attrs`in t))throw Error(`${String(t)} is not a valid Edge`);if(!r)throw Error(`Node is not registered with a diagram`);return r[`~connect`](l,e,t),e}};return l}function N(e){return typeof e==`object`&&!!e&&`getNodes`in e&&typeof e.getNodes==`function`}function P(e){return`~getIconUrl`in e&&typeof e[`~getIconUrl`]==`function`}async function se(e,t){let n=e,r=n[`~getIconUrl`]();if(r.startsWith(`data:`)){t[`~trackNodeWithIcon`](e,r);return}try{let r=await n.loadIcon();r&&t[`~trackNodeWithIcon`](e,r)}catch(t){console.warn(`Failed to load custom icon for node ${e.nodeId}:`,t)}}async function ce(e,t){let n=e,r=t,i=e=>import(e);try{return await i([`.`,n,r].join(`/`))}catch{}try{return await i([`.`,`providers`,n,r].join(`/`)+`.js`)}catch{}try{return await i([`diagrams-js`,n,r].join(`/`))}catch{}try{return await i([`https://esm.sh`,`diagrams-js`,n,r].join(`/`))}catch{}return null}async function le(e){let t=new Map;for(let[n,r]of e){let e=await ce(n,r);if(e)for(let[n,r]of Object.entries(e))typeof r==`function`&&!n.startsWith(`_`)&&t.set(n,r)}return t}const F=new Set([`shape`,`height`,`width`,`fixedsize`,`margin`,`labelloc`,`imagescale`]),ue={shape:`none`,height:`0.9`,width:`0.8`,fixedsize:`true`,margin:`0,0`,labelloc:`b`,imagescale:`true`};function de(e,t,n,r){let i={id:e};if(t&&(i.label=t),r){let e=r,t=e[`~provider`],n=e[`~type`],a=e[`~resourceType`];t&&(i.provider=t),n&&(i.service=n),a&&(i.type=a),`~getIconUrl`in e&&typeof e[`~getIconUrl`]==`function`&&(i.iconUrl=e[`~getIconUrl`]())}let a=i.provider!=null,o=i.iconUrl!=null,s=a||o,c={};for(let[e,t]of Object.entries(n))if(!e.startsWith(`~`)){if(s&&F.has(e)){let n=ue[e];if(n!==void 0&&String(t)===n)continue}c[e]=typeof t==`number`?t:String(t)}return Object.keys(c).length>0&&(i.attrs=c),i}function fe(e,t,n){let r={label:e.label},i=[];for(let[r,{label:a,attrs:o}]of e.getNodes())i.push(r),t.push(de(r,a,o,n.get(r)));i.length>0&&(r.nodes=i);let a={};for(let[t,n]of Object.entries(e.graphAttr))t===`shape`||t===`style`||t===`labeljust`||t===`fontname`||t===`fontsize`||t===`label`||t===`pencolor`||t===`bgcolor`||(a[t]=n);Object.keys(a).length>0&&(r.graphAttr=a);let o=e.getSubgraphs();return o.length>0&&(r.clusters=o.map(e=>fe(e,t,n))),r}function pe(e){return e.map(e=>{let t={from:e.from,to:e.to},{dir:n,label:r,color:i,style:a,...o}=e.attrs;return n&&n!==`forward`&&(t.direction=n),r&&(t.label=r),i&&(t.color=i),a&&(t.style=a),Object.keys(o).length>0&&(t.attrs=o),t})}function me(e,t,n,r,i,a,o){let s={nodes:[]};e.name&&(s.name=e.name);let c=e.name?e.name.toLowerCase().replace(/\s+/g,`_`):`diagram`;e.filename!==c&&(s.filename=e.filename),e.direction!==`LR`&&(s.direction=e.direction),e.curveStyle!==`ortho`&&(s.curvestyle=e.curveStyle),e.autolabel&&(s.autolabel=e.autolabel),e.strict&&(s.strict=e.strict),e.theme!==`pastel`&&(s.theme=e.theme),o.graphAttr&&Object.keys(o.graphAttr).length>0&&(s.graphAttr={...o.graphAttr}),o.nodeAttr&&Object.keys(o.nodeAttr).length>0&&(s.nodeAttr={...o.nodeAttr}),o.edgeAttr&&Object.keys(o.edgeAttr).length>0&&(s.edgeAttr={...o.edgeAttr});let l=new Map(a);for(let e of i)l.has(e.node.nodeId)||l.set(e.node.nodeId,e.node);let u=new Set;function d(e){for(let[t]of e.getNodes())u.add(t);for(let t of e.getSubgraphs())d(t)}for(let e of r)d(e);let f=[];for(let[e,{label:n,attrs:r}]of t)u.has(e)||s.nodes.push(de(e,n,r,l.get(e)));return r.length>0&&(s.clusters=r.map(e=>fe(e,f,l)),s.nodes.push(...f)),n.length>0&&(s.edges=pe(n)),s}async function he(e,t){let n=typeof e==`string`?JSON.parse(e):e;if(!n.nodes||!Array.isArray(n.nodes))throw Error(`Invalid diagram JSON: 'nodes' array is required`);let r=new Map;for(let e of n.nodes)if(e.provider&&e.service){let t=`${e.provider}/${e.service}`;r.set(t,[e.provider,e.service])}let i=await le(Array.from(r.values()));if(t?.providers)for(let e of t.providers)for(let[t,n]of Object.entries(e))typeof n==`function`&&!t.startsWith(`_`)&&i.set(t,n);let a={};n.name!==void 0&&(a.name=n.name),n.filename!==void 0&&(a.filename=n.filename),n.direction!==void 0&&(a.direction=n.direction),n.curvestyle!==void 0&&(a.curvestyle=n.curvestyle),n.autolabel!==void 0&&(a.autolabel=n.autolabel),n.strict!==void 0&&(a.strict=n.strict),n.theme!==void 0&&(a.theme=n.theme),n.graphAttr!==void 0&&(a.graphAttr=n.graphAttr),n.nodeAttr!==void 0&&(a.nodeAttr=n.nodeAttr),n.edgeAttr!==void 0&&(a.edgeAttr=n.edgeAttr);let o=L(n.name??``,a),s=new Map,c=new Map;if(n.clusters){function e(t,n){let r=[...n,t.label];if(t.nodes)for(let e of t.nodes)c.set(e,r);if(t.clusters)for(let n of t.clusters)e(n,r)}for(let t of n.clusters)e(t,[])}let l=new Map;if(n.clusters){function e(t,n){let r=n.cluster(t.label);if(t.graphAttr&&Object.assign(r.graphAttr,t.graphAttr),l.set(t.label,r),t.clusters)for(let n of t.clusters)e(n,r)}for(let t of n.clusters)e(t,o)}for(let e of n.nodes){if(s.has(e.id))throw Error(`Duplicate node ID: "${e.id}"`);let t,n=e.type?i.get(e.type):void 0;if(n)t=n(e.label??``,{nodeId:e.id,...e.attrs});else{let n={nodeId:e.id};e.attrs&&Object.assign(n,e.attrs),t=M(e.label??``,n);let r=t;e.provider&&(r[`~provider`]=e.provider),e.service&&(r[`~type`]=e.service),e.type&&(r[`~resourceType`]=e.type),e.iconUrl&&(r[`~iconDataUrl`]=e.iconUrl)}let r=c.get(e.id);if(r&&r.length>0){let e=r[r.length-1],n=l.get(e);n?n.add(t):o.add(t)}else o.add(t);s.set(e.id,t)}if(n.edges)for(let e of n.edges){let t=s.get(e.from),n=s.get(e.to);if(!t)throw Error(`Edge references unknown source node: "${e.from}"`);if(!n)throw Error(`Edge references unknown target node: "${e.to}"`);let r=e.direction??`forward`,i={};e.label&&(i.label=e.label),e.color&&(i.color=e.color),e.style&&(i.style=e.style),e.attrs&&Object.assign(i,e.attrs);let a=S(i);switch(r){case`forward`:a.forward=!0;break;case`back`:a.reverse=!0;break;case`both`:a.forward=!0,a.reverse=!0;break;case`none`:break;default:a.forward=!0}t[`~connect`](n,a)}return o}const ge=[`TB`,`BT`,`LR`,`RL`],_e=[`ortho`,`curved`,`spline`,`polyline`],I={pad:`0.05`,splines:`ortho`,nodesep:`0.15`,ranksep:`0.20`,fontname:`Sans-Serif`,fontsize:`10`},ve={shape:`box`,style:`rounded`,fontname:`Sans-Serif`,fontsize:`8`},ye={arrowsize:`0.5`,fontcolor:`#2D3436`,fontname:`Sans-Serif`,fontsize:`8`};function L(e=``,t={}){let n=new Map,r=[],i=[],a=null,o=[],s=new Map,c={},l=[],u=t.name??e,d=t.filename??(u?u.toLowerCase().replace(/\s+/g,`_`):`diagram`),f=t.direction??`LR`;if(!ge.includes(f))throw Error(`"${f}" is not a valid direction`);let p=t.curvestyle??`ortho`;if(!_e.includes(p))throw Error(`"${p}" is not a valid curve style`);let m=t.theme??`pastel`;if(!(m in D))throw Error(`"${m}" is not a valid theme. Choose from: ${Object.keys(D).join(`, `)}`);let h=D[m],g=t.autolabel??!1,_=t.strict??!1,v={...I},b={...ve},S={...ye};S.color=h.edgecolor,v.label=u,v.rankdir=f,v.splines=p,t.graphAttr&&Object.assign(v,t.graphAttr);let C=t.nodeAttr?{shape:t.nodeAttr.shape,height:t.nodeAttr.height,width:t.nodeAttr.width,fixedsize:t.nodeAttr.fixedsize,margin:t.nodeAttr.margin,labelloc:t.nodeAttr.labelloc,imagescale:t.nodeAttr.imagescale}:void 0;t.nodeAttr&&Object.assign(b,t.nodeAttr),t.edgeAttr&&Object.assign(S,t.edgeAttr);let w={name:u,filename:d,direction:f,curveStyle:p,autolabel:g,strict:_,theme:m,themeConfig:h,graphAttr:v,nodeAttr:b,edgeAttr:S,"~userNodeAttr":C,"~registerIcon"(e,t,n){o.push({node:e,icon:t,iconPath:n})},"~setIconData"(e){c=e},"~getNodeIconMap"(){return[...o]},"~getIconData"(){return{...c}},"~trackNodeWithIcon"(e,t){let n=e.nodeId.replace(/[^a-zA-Z0-9]/g,`_`);c[n]=t,o.push({node:e,icon:n,iconPath:t})},"~trackPendingIconLoad"(e){l.push(e)},"~trackNode"(e){s.set(e.nodeId,e)},add(e){return e[`~register`](w),e},"~node"(e,t,r){n.set(e,{label:t,attrs:r})},"~connect"(e,t,n){r.push({from:e.nodeId,to:t.nodeId,attrs:n.attrs})},"~subgraph"(e){i.push(e)},cluster(e){let t=x(e,`LR`,void 0,w);return i.push(t),t},render:(async(e={})=>{await h(),a||=await ee();let t=y(),s=e.format??`svg`;if(s===`dot`)return e.dataUrl?k(t,`dot`):t;if(s===`json`){let t=JSON.stringify(w.toJSON(),null,2);return e.dataUrl?k(t,`json`):t}let d=o.length>0,f=e.injectIcons??d,p=a.render(t,{format:`svg`});if(p.status===`failure`)throw Error(`Graphviz rendering failed: ${p.errors.map(e=>e.message).join(`, `)}`);let m=p.output;return f&&(await g(),Object.keys(c).length>0&&o.length>0&&(m=ie(m,o,c))),s===`png`&&(m=await C(m,e)),s===`jpg`&&(m=await D(m,e)),e.dataUrl&&(m=k(m,s)),m;async function h(){l.length!==0&&(await Promise.all(l),l.length=0)}async function g(){o.length}function y(){let e=`${_?`strict `:``}digraph "${u}" {\n`;for(let[t,n]of Object.entries(v))e+=`  ${t}="${n}";\n`;e+=`  node [
 `;for(let[t,n]of Object.entries(b))e+=`    ${t}="${n}",\n`;e+=`  ];
 `,e+=`  edge [
 `;for(let[t,n]of Object.entries(S))e+=`    ${t}="${n}",\n`;e+=`  ];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "diagrams-js",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "description": "A TypeScript port of the diagrams Python library for drawing cloud system architecture diagrams as code",
   "keywords": [
     "architecture",