@next-bricks/diagram 0.28.1 → 0.30.0

package/dist/chunks/main.229129b2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chunks/main.229129b2.js","mappings":"UAAIA,EACAC,ECDAC,EAIAC,EAIAC,EAIAC,EASAC,EAOAC,EAMAC,EAOAC,EAUAC,EAoBAC,EAMAC,EAIAC,EAUAC,EA+BAC,EAIAC,EAQAC,EACAC,EAgCAC,EAqEAC,E,kBC5OJ,0J,GCCIC,EAA2B,CAAC,EAGhC,SAASC,EAAoBC,GAE5B,IAAIC,EAAeH,EAAyBE,GAC5C,QAAqBE,IAAjBD,EACH,OAAOA,EAAaE,QAGrB,IAAIC,EAASN,EAAyBE,GAAY,CACjDK,GAAIL,EACJM,QAAQ,EACRH,QAAS,CAAC,GAUX,OANAI,EAAoBP,GAAUQ,KAAKJ,EAAOD,QAASC,EAAQA,EAAOD,QAASJ,GAG3EK,EAAOE,QAAS,EAGTF,EAAOD,OACf,CAGAJ,EAAoBU,EAAIF,EAGxBR,EAAoBW,EAAIZ,EC9BxBC,EAAoBY,EAAKP,IACxB,IAAIQ,EAASR,GAAUA,EAAOS,WAC7B,IAAOT,EAAiB,QACxB,IAAM,EAEP,OADAL,EAAoBe,EAAEF,EAAQ,CAAEG,EAAGH,IAC5BA,CAAM,ECLdb,EAAoBe,EAAI,CAACX,EAASa,KACjC,IAAI,IAAIC,KAAOD,EACXjB,EAAoBmB,EAAEF,EAAYC,KAASlB,EAAoBmB,EAAEf,EAASc,IAC5EE,OAAOC,eAAejB,EAASc,EAAK,CAAEI,YAAY,EAAMhC,IAAK2B,EAAWC,IAE1E,ECNDlB,EAAoBuB,EAAI,CAAC,EAGzBvB,EAAoBwB,EAAKC,GACjBC,QAAQC,IAAIP,OAAOQ,KAAK5B,EAAoBuB,GAAGM,QAAO,CAACC,EAAUZ,KACvElB,EAAoBuB,EAAEL,GAAKO,EAASK,GAC7BA,IACL,KCNJ9B,EAAoB+B,EAAKN,GAEjB,UAAYA,EAAU,IAAM,CAAC,IAAM,WAAW,IAAM,WAAW,IAAM,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,WAAW,KAAO,YAAYA,GAAW,MCHhjCzB,EAAoBgC,EAAI,WACvB,GAA0B,iBAAfC,WAAyB,OAAOA,WAC3C,IACC,OAAOC,MAAQ,IAAIC,SAAS,cAAb,EAChB,CAAE,MAAOX,GACR,GAAsB,iBAAXY,OAAqB,OAAOA,MACxC,CACA,CAPuB,GCAxBpC,EAAoBmB,EAAI,CAACkB,EAAKC,IAAUlB,OAAOmB,UAAUC,eAAe/B,KAAK4B,EAAKC,GTA9E5D,EAAa,CAAC,EACdC,EAAoB,wBAExBqB,EAAoByC,EAAI,CAACC,EAAKC,EAAMzB,EAAKO,KACxC,GAAG/C,EAAWgE,GAAQhE,EAAWgE,GAAKE,KAAKD,OAA3C,CACA,IAAIE,EAAQC,EACZ,QAAW3C,IAARe,EAEF,IADA,IAAI6B,EAAUC,SAASC,qBAAqB,UACpCC,EAAI,EAAGA,EAAIH,EAAQI,OAAQD,IAAK,CACvC,IAAIE,EAAIL,EAAQG,GAChB,GAAGE,EAAEC,aAAa,QAAUX,GAAOU,EAAEC,aAAa,iBAAmB1E,EAAoBuC,EAAK,CAAE2B,EAASO,EAAG,KAAO,CACpH,CAEGP,IACHC,GAAa,GACbD,EAASG,SAASM,cAAc,WAEzBC,QAAU,QACjBV,EAAOW,QAAU,IACbxD,EAAoByD,IACvBZ,EAAOa,aAAa,QAAS1D,EAAoByD,IAElDZ,EAAOa,aAAa,eAAgB/E,EAAoBuC,GAExD2B,EAAOc,IAAMjB,GAEdhE,EAAWgE,GAAO,CAACC,GACnB,IAAIiB,EAAmB,CAACC,EAAMC,KAE7BjB,EAAOkB,QAAUlB,EAAOmB,OAAS,KACjCC,aAAaT,GACb,IAAIU,EAAUxF,EAAWgE,GAIzB,UAHOhE,EAAWgE,GAClBG,EAAOsB,YAActB,EAAOsB,WAAWC,YAAYvB,GACnDqB,GAAWA,EAAQG,SAASC,GAAQA,EAAGR,KACpCD,EAAM,OAAOA,EAAKC,EAAM,EAExBN,EAAUe,WAAWX,EAAiBY,KAAK,UAAMrE,EAAW,CAAEsE,KAAM,UAAWC,OAAQ7B,IAAW,MACtGA,EAAOkB,QAAUH,EAAiBY,KAAK,KAAM3B,EAAOkB,SACpDlB,EAAOmB,OAASJ,EAAiBY,KAAK,KAAM3B,EAAOmB,QACnDlB,GAAcE,SAAS2B,KAAKC,YAAY/B,EApCkB,CAoCX,EUvChD7C,EAAoB6E,EAAKzE,IACH,oBAAX0E,QAA0BA,OAAOC,aAC1C3D,OAAOC,eAAejB,EAAS0E,OAAOC,YAAa,CAAEC,MAAO,WAE7D5D,OAAOC,eAAejB,EAAS,aAAc,CAAE4E,OAAO,GAAO,ECL9DhF,EAAoBiF,IAAO5E,IAC1BA,EAAO6E,MAAQ,GACV7E,EAAO8E,WAAU9E,EAAO8E,SAAW,IACjC9E,G,MCHRL,EAAoBoF,EAAI,CAAC,EACzB,IAAIC,EAAe,CAAC,EAChBC,EAAa,CAAC,EAClBtF,EAAoBuF,EAAI,CAACC,EAAMC,KAC1BA,IAAWA,EAAY,IAE3B,IAAIC,EAAYJ,EAAWE,GAE3B,GADIE,IAAWA,EAAYJ,EAAWE,GAAQ,CAAC,KAC5CC,EAAUE,QAAQD,IAAc,GAAnC,CAGA,GAFAD,EAAU7C,KAAK8C,GAEZL,EAAaG,GAAO,OAAOH,EAAaG,GAEvCxF,EAAoBmB,EAAEnB,EAAoBoF,EAAGI,KAAOxF,EAAoBoF,EAAEI,GAAQ,CAAC,GAEvF,IAAII,EAAQ5F,EAAoBoF,EAAEI,GAI9BK,EAAa,uBACbC,EAAW,CAACN,EAAMO,EAASC,EAASC,KACvC,IAAIC,EAAWN,EAAMJ,GAAQI,EAAMJ,IAAS,CAAC,EACzCW,EAAgBD,EAASH,KACzBI,IAAmBA,EAAc5F,UAAY0F,IAAUE,EAAcF,MAAQA,EAAQJ,EAAaM,EAAcC,SAAQF,EAASH,GAAW,CAAEzG,IAAK0G,EAASI,KAAMP,EAAYI,QAASA,GAAO,EAa/LnE,EAAW,GA+Bf,MA7BM,YADC0D,IAELM,EAAS,gBAAiB,UAAU,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC9G8F,EAAS,+BAAgC,SAAS,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACrM8F,EAAS,kBAAmB,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UAC5J8F,EAAS,qBAAsB,SAAS,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAClH8F,EAAS,kBAAmB,UAAU,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAChH8F,EAAS,kBAAmB,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACtN8F,EAAS,oBAAqB,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UAC3L8F,EAAS,oBAAqB,SAAS,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACjH8F,EAAS,mBAAoB,UAAU,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACjH8F,EAAS,2BAA4B,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,OAAO6E,MAAK,IAAM,IAAQrG,EAAoB,SAC9N8F,EAAS,2BAA4B,SAAS,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UAC9N8F,EAAS,qBAAsB,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UAC7U8F,EAAS,oBAAqB,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACxN8F,EAAS,mBAAoB,SAAS,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UAC5J8F,EAAS,2BAA4B,UAAU,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACzH8F,EAAS,8BAA+B,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACrM8F,EAAS,UAAW,UAAU,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACxG8F,EAAS,mCAAoC,SAAS,IAAO9F,EAAoBwB,EAAE,KAAK6E,MAAK,IAAM,IAAQrG,EAAoB,SAC/H8F,EAAS,UAAW,UAAU,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACxG8F,EAAS,UAAW,UAAU,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACxG8F,EAAS,SAAU,WAAW,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACxG8F,EAAS,yBAA0B,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACnK8F,EAAS,SAAU,UAAU,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACnJ8F,EAAS,YAAa,yCAAyC,IAAOpE,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACrL8F,EAAS,QAAS,yCAAyC,IAAO9F,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,WAKhIqF,EAAaG,GADhB1D,EAASqB,OACezB,QAAQC,IAAIG,GAAUuE,MAAK,IAAOhB,EAAaG,GAAQ,IADlC,CA3DL,CA4D0C,C,WCpEvF,IAAIc,EACAtG,EAAoBgC,EAAEuE,gBAAeD,EAAYtG,EAAoBgC,EAAEwE,SAAW,IACtF,IAAIxD,EAAWhD,EAAoBgC,EAAEgB,SACrC,IAAKsD,GAAatD,IACbA,EAASyD,gBACZH,EAAYtD,EAASyD,cAAc9C,MAC/B2C,GAAW,CACf,IAAIvD,EAAUC,EAASC,qBAAqB,UAC5C,GAAGF,EAAQI,OAEV,IADA,IAAID,EAAIH,EAAQI,OAAS,EAClBD,GAAK,KAAOoD,IAAc,aAAaI,KAAKJ,KAAaA,EAAYvD,EAAQG,KAAKS,GAE3F,CAID,IAAK2C,EAAW,MAAM,IAAIK,MAAM,yDAChCL,EAAYA,EAAUM,QAAQ,OAAQ,IAAIA,QAAQ,QAAS,IAAIA,QAAQ,YAAa,KACpF5G,EAAoB6G,EAAIP,EAAY,K,KZlBhC1H,EAAgBkI,IAEnB,IAAID,EAAEA,GAAWA,EAAEE,MAAM,KAAKC,KAAKH,IAAWA,GAAGA,GAAGA,EAAEA,IAAMjG,EAAE,sCAAsCqG,KAAKH,GAAKjC,EAAEjE,EAAE,GAAGiG,EAAEjG,EAAE,IAAI,GAAG,OAAOA,EAAE,KAAKiE,EAAE1B,SAAS0B,EAAEjC,KAAKsE,MAAMrC,EAAEgC,EAAEjG,EAAE,MAAMA,EAAE,KAAKiE,EAAEjC,KAAK,IAAIiC,EAAEjC,KAAKsE,MAAMrC,EAAEgC,EAAEjG,EAAE,MAAMiE,CAAC,EAE3NhG,EAAY,CAACmC,EAAGmG,KAEnBnG,EAAEpC,EAAaoC,GAAGmG,EAAEvI,EAAauI,GAAG,IAAI,IAAItC,EAAE,IAAI,CAAC,GAAGA,GAAG7D,EAAEmC,OAAO,OAAO0B,EAAEsC,EAAEhE,QAAQ,aAAagE,EAAEtC,IAAI,GAAG,IAAIrD,EAAER,EAAE6D,GAAGjE,UAAUY,GAAG,GAAG,GAAGqD,GAAGsC,EAAEhE,OAAO,MAAM,KAAKvC,EAAE,IAAIwG,EAAED,EAAEtC,GAAGtD,UAAU6F,GAAG,GAAG,GAAGxG,GAAGW,EAAE,MAAM,KAAKX,GAAG,KAAKW,GAAI,KAAKA,GAAG,KAAKX,EAAG,GAAG,KAAKA,GAAG,KAAKA,GAAGY,GAAG4F,EAAE,OAAO5F,EAAE4F,EAAEvC,GAAG,GAE/Q/F,EAAiBuI,IAEpB,IAAIxC,EAAEwC,EAAM,GAAGzG,EAAE,GAAG,GAAG,IAAIyG,EAAMlE,OAAO,MAAM,IAAI,GAAG0B,EAAE,GAAG,CAACjE,GAAG,GAAGiE,EAAE,MAAM,GAAGA,EAAE,IAAI,GAAGA,EAAE,IAAI,GAAGA,EAAE,IAAIA,EAAE,EAAE,IAAI,KAAK,IAAI,IAAIrD,EAAE,EAAER,EAAE,EAAEA,EAAEqG,EAAMlE,OAAOnC,IAAKQ,IAAIZ,GAAG,aAAawG,EAAEC,EAAMrG,KAAK,GAAG,KAAKQ,EAAE,EAAE,IAAI,KAAKA,EAAE,EAAE4F,GAAG,OAAOxG,CAAC,CAAC,IAAIoB,EAAE,GAAG,IAAIhB,EAAE,EAAEA,EAAEqG,EAAMlE,OAAOnC,IAAI,CAAC,IAAIoG,EAAEC,EAAMrG,GAAGgB,EAAEY,KAAK,IAAIwE,EAAE,OAAOjG,IAAI,IAAI,IAAIiG,EAAE,IAAIjG,IAAI,OAAOA,IAAI,IAAI,IAAIiG,EAAEpF,EAAEsF,MAAM,IAAItF,EAAEsF,MAAMxI,EAAcsI,GAAG,CAAC,OAAOjG,IAAI,SAASA,IAAI,OAAOa,EAAEsF,MAAMV,QAAQ,aAAa,KAAK,GAElb7H,EAAU,CAACsI,EAAOtB,KAErB,GAAG,KAAKsB,EAAM,CAACtB,EAAQnH,EAAamH,GAAS,IAAIvE,EAAE6F,EAAM,GAAGxC,EAAErD,EAAE,EAAEqD,IAAIrD,GAAGA,EAAE,GAAG,IAAI,IAAIZ,EAAE,EAAEsC,EAAE,EAAElC,GAAE,GAAIkC,IAAItC,IAAI,CAAC,IAAIW,EAAE6B,EAAEpB,EAAEkB,EAAEmE,EAAMlE,eAAekE,EAAMnE,IAAI,GAAG,GAAG,GAAGtC,GAAGmF,EAAQ5C,QAAQ,MAAMC,UAAU7B,EAAEwE,EAAQnF,KAAK,IAAI,OAAOI,IAAI,KAAKgB,EAAEkB,EAAE1B,IAAIqD,EAAE,IAAI7C,GAAG6C,GAAG,GAAG,KAAKzB,GAAG,IAAIpC,GAAG,KAAKgB,EAAE,OAAM,OAAQ,GAAGhB,EAAE,GAAGgB,GAAGoB,EAAE,GAAGF,GAAG1B,GAAG,GAAGD,GAAG8F,EAAMnE,GAAG,OAAM,MAAO,CAAC,GAAG2B,EAAEtD,EAAE8F,EAAMnE,GAAG3B,EAAE8F,EAAMnE,GAAG,OAAM,EAAG3B,GAAG8F,EAAMnE,KAAKlC,GAAE,EAAG,MAAM,GAAG,KAAKgB,GAAG,KAAKA,EAAE,CAAC,GAAG6C,GAAG3B,GAAG1B,EAAE,OAAM,EAAGR,GAAE,EAAGkC,GAAG,KAAK,CAAC,GAAGA,GAAG1B,GAAG4B,EAAEpB,GAAG6C,EAAE,OAAM,EAAG7D,GAAE,CAAE,KAAK,KAAKgB,GAAG,KAAKA,IAAIhB,GAAE,EAAGkC,IAAI,CAAC,CAAC,IAAIkE,EAAE,GAAGjG,EAAEiG,EAAEE,IAAI9C,KAAK4C,GAAG,IAAIxG,EAAE,EAAEA,EAAEyG,EAAMlE,OAAOvC,IAAI,CAAC,IAAImB,EAAEsF,EAAMzG,GAAGwG,EAAExE,KAAK,GAAGb,EAAEZ,IAAIA,IAAI,GAAGY,EAAEZ,IAAIA,IAAIY,EAAEhD,EAAQgD,EAAEgE,IAAU5E,IAAI,CAAC,QAAQA,GAAG,EAO7oBnC,EAAc,CAAC4G,EAAO1E,KACzB,IAAIgF,EAAWN,EAAM1E,GAIrB,OAHIA,EAAME,OAAOQ,KAAKsE,GAAUrE,QAAO,CAACb,EAAGmG,KAClCnG,GAAKnC,EAAUmC,EAAGmG,GAAKA,EAAInG,GACjC,KACWkF,EAAShF,EAAG,EAEvBjC,EAA0B,CAAC2G,EAAO1E,KACrC,IAAIgF,EAAWN,EAAM1E,GACrB,OAAOE,OAAOQ,KAAKsE,GAAUrE,QAAO,CAACb,EAAGmG,KAC/BnG,IAAOkF,EAASlF,GAAGT,QAAU1B,EAAUmC,EAAGmG,GAAMA,EAAInG,GAC1D,EAAE,EAEF9B,EAAoC,CAAC0G,EAAO1E,EAAK6E,EAASwB,IACtD,uBAAyBxB,EAAU,UAAYA,GAAWH,EAAM1E,GAAK6E,GAASK,MAAQ,+BAAiClF,EAAM,cAAgBpC,EAAcyI,GAAmB,IAMlLpI,EAAsB,CAACyG,EAAO4B,EAAWtG,EAAKqG,KACjD,IAAIxB,EAAU9G,EAAwB2G,EAAO1E,GAE7C,OADKnC,EAAQwI,EAAiBxB,IAAU1G,EAAKH,EAAkC0G,EAAO1E,EAAK6E,EAASwB,IAC7FjI,EAAIsG,EAAM1E,GAAK6E,GAAS,EAO5B3G,EAAmB,CAACwG,EAAO1E,EAAKqG,KACnC,IAAIrB,EAAWN,EAAM1E,GAKrB,OAJIA,EAAME,OAAOQ,KAAKsE,GAAUrE,QAAO,CAACb,EAAGmG,KACrCpI,EAAQwI,EAAiBJ,IACtBnG,IAAKnC,EAAUmC,EAAGmG,GADenG,EACVmG,GAC7B,KACWjB,EAAShF,EAAG,EAcvB7B,EAAQoI,IACY,oBAAZC,SAA2BA,QAAQrI,MAAMqI,QAAQrI,KAAKoI,EAAI,EAKlEnI,EAAOqI,IACVA,EAAMpH,OAAS,EACRoH,EAAMrI,OAYVE,GAVAD,EAAQ+E,GAAO,SAAUkD,EAAWxG,EAAGmG,EAAGxG,GAC7C,IAAIiH,EAAU5H,EAAoBuF,EAAEiC,GACpC,OAAII,GAAWA,EAAQvB,KAAauB,EAAQvB,KAAK/B,EAAGE,KAAKF,EAAIkD,EAAWxH,EAAoBoF,EAAEoC,GAAYxG,EAAGmG,EAAGxG,IACzG2D,EAAGkD,EAAWxH,EAAoBoF,EAAEoC,GAAYxG,EAAGmG,EAAGxG,EAC7D,IAMqC,CAAC6G,EAAW5B,EAAO1E,EAAK2G,IACtDjC,GAAS5F,EAAoBmB,EAAEyE,EAAO1E,GAAO5B,EAAIN,EAAY4G,EAAO1E,IAAQ2G,MA8BhFpI,EAAkDF,GAAK,CAACiI,EAAW5B,EAAO1E,EAAK6E,EAAS8B,IACvFjC,GAAU5F,EAAoBmB,EAAEyE,EAAO1E,GACpC/B,EAAoByG,EAAO4B,EAAWtG,EAAK6E,GADM8B,MAGrDnI,EAA+CH,GAAK,CAACiI,EAAW5B,EAAO1E,EAAK6E,EAAS8B,KACxF,IAAIF,EAAQ/B,GAAS5F,EAAoBmB,EAAEyE,EAAO1E,IAAQ9B,EAAiBwG,EAAO1E,EAAK6E,GACvF,OAAO4B,EAAQrI,EAAIqI,GAASE,GAAU,IAMnClI,EAAmB,CAAC,EACpBC,EAAyB,CAC5B,KAAM,IAAOF,EAA+B,UAAW,QAAS,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC,oCAAoC,IAAOM,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACxL,KAAM,IAAOP,EAAkC,UAAW,SAAU,CAAC,EAAE,EAAE,GAAG,KAAK,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC3J,KAAM,IAAON,EAA+B,UAAW,qBAAsB,CAAC,EAAE,EAAE,EAAE,IAAI,IAAOM,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAClK,IAAK,IAAOP,EAAkC,UAAW,mBAAoB,CAAC,EAAE,EAAE,EAAE,IAAI,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAClK,KAAM,IAAON,EAA+B,UAAW,2BAA4B,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOgC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,SACrN,KAAM,IAAOP,EAAkC,UAAW,2BAA4B,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC5K,KAAM,IAAOP,EAAkC,UAAW,qBAAsB,CAAC,EAAE,EAAE,GAAG,IAAI,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACtU,KAAM,IAAON,EAA+B,UAAW,2BAA4B,CAAC,EAAE,EAAE,EAAE,IAAI,IAAOM,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACxK,KAAM,IAAON,EAA+B,UAAW,YAAa,CAAC,EAAE,GAAG,EAAE,IAAI,IAAOM,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC1J,KAAM,IAAOP,EAAkC,UAAW,kBAAmB,CAAC,EAAE,EAAE,EAAE,IAAI,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAClK,KAAM,IAAOP,EAAkC,UAAW,UAAW,CAAC,EAAE,EAAE,GAAG,IAAI,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC3J,KAAM,IAAOP,EAAkC,UAAW,SAAU,CAAC,EAAE,EAAE,GAAG,IAAI,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACtM,KAAM,IAAOP,EAAkC,UAAW,gBAAiB,CAAC,EAAE,EAAE,GAAG,IAAI,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACjK,KAAM,IAAOP,EAAkC,UAAW,kBAAmB,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UAC/M,KAAM,IAAOP,EAAkC,UAAW,UAAW,CAAC,EAAE,GAAG,EAAE,IAAI,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC3J,KAAM,IAAOP,EAAkC,UAAW,mCAAoC,CAAC,EAAE,EAAE,EAAE,IAAI,IAAOO,EAAoBwB,EAAE,KAAK6E,MAAK,IAAM,IAAQrG,EAAoB,SAClL,KAAM,IAAOP,EAAkC,UAAW,mBAAoB,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACpK,IAAK,IAAOP,EAAkC,UAAW,+BAAgC,CAAC,EAAE,EAAE,EAAE,IAAI,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACvP,IAAK,IAAOR,EAAa,UAAW,aAAa,IAAOQ,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC3H,KAAM,IAAON,EAA+B,UAAW,YAAa,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC,oCAAoC,IAAOM,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC5L,KAAM,IAAOP,EAAkC,UAAW,SAAU,CAAC,EAAE,EAAE,GAAG,IAAI,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACtM,KAAM,IAAOP,EAAkC,UAAW,kBAAmB,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UAC/M,GAAI,IAAOP,EAAkC,UAAW,8BAA+B,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC7K,KAAM,IAAOP,EAAkC,UAAW,UAAW,CAAC,EAAE,EAAE,GAAG,IAAI,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UAC3J,KAAM,IAAOP,EAAkC,UAAW,kBAAmB,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACnK,KAAM,IAAOP,EAAkC,UAAW,oBAAqB,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACjN,KAAM,IAAOP,EAAkC,UAAW,yBAA0B,CAAC,EAAE,EAAE,GAAG,IAAI,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,UACtN,KAAM,IAAOP,EAAkC,UAAW,oBAAqB,CAAC,EAAE,EAAE,EAAE,IAAI,IAAOO,EAAoBwB,EAAE,MAAM6E,MAAK,IAAM,IAAQrG,EAAoB,UACpK,KAAM,IAAOP,EAAkC,UAAW,oBAAqB,CAAC,EAAE,EAAE,EAAE,KAAK,IAAOiC,QAAQC,IAAI,CAAC3B,EAAoBwB,EAAE,MAAOxB,EAAoBwB,EAAE,QAAQ6E,MAAK,IAAM,IAAQrG,EAAoB,WAG9MH,EAAe,CAClB,IAAO,CACN,MAED,KAAQ,CACP,MAED,KAAQ,CACP,MAED,KAAQ,CACP,MAED,KAAQ,CACP,GACA,KACA,KACA,KACA,KACA,KACA,MAED,KAAQ,CACP,IACA,MAED,KAAQ,CACP,MAED,KAAQ,CACP,KAED,KAAQ,CACP,KACA,MAED,KAAQ,CACP,MAED,KAAQ,CACP,MAED,KAAQ,CACP,MAED,KAAQ,CACP,MAED,KAAQ,CACP,IACA,MAED,KAAQ,CACP,MAED,KAAQ,CACP,KACA,MAED,KAAQ,CACP,MAED,KAAQ,CACP,MAED,KAAQ,CACP,OAGEC,EAAwB,CAAC,EAC7BE,EAAoBuB,EAAEuG,SAAW,CAACrG,EAASK,KACvC9B,EAAoBmB,EAAEtB,EAAc4B,IACtC5B,EAAa4B,GAAS4C,SAAS/D,IAC9B,GAAGN,EAAoBmB,EAAExB,EAAkBW,GAAK,OAAOwB,EAASc,KAAKjD,EAAiBW,IACtF,IAAIR,EAAsBQ,GAAK,CAC/B,IAAIyH,EAAa/B,IAChBrG,EAAiBW,GAAM,EACvBN,EAAoBU,EAAEJ,GAAOD,WACrBL,EAAoBW,EAAEL,GAC7BD,EAAOD,QAAU4F,GAAS,CAC3B,EAEDlG,EAAsBQ,IAAM,EAC5B,IAAI0H,EAAWC,WACPtI,EAAiBW,GACxBN,EAAoBU,EAAEJ,GAAOD,IAE5B,aADOL,EAAoBW,EAAEL,GACvB2H,CAAK,CACZ,EAED,IACC,IAAIL,EAAUhI,EAAuBU,KAClCsH,EAAQvB,KACVvE,EAASc,KAAKjD,EAAiBW,GAAMsH,EAAQvB,KAAK0B,GAAkB,MAAEC,IAChED,EAAUH,EAClB,CAAE,MAAMpG,GAAKwG,EAAQxG,EAAI,CACzB,IAEF,E,MapQD,IAAI0G,EAAkB,CACrB,KAAM,GAGPlI,EAAoBuB,EAAE4G,EAAI,CAAC1G,EAASK,KAElC,IAAIsG,EAAqBpI,EAAoBmB,EAAE+G,EAAiBzG,GAAWyG,EAAgBzG,QAAWtB,EACtG,GAA0B,IAAvBiI,EAGF,GAAGA,EACFtG,EAASc,KAAKwF,EAAmB,SAEjC,GAAI,qFAAqF1B,KAAKjF,GAyBvFyG,EAAgBzG,GAAW,MAzBsE,CAEvG,IAAImG,EAAU,IAAIlG,SAAQ,CAAC2G,EAASC,IAAYF,EAAqBF,EAAgBzG,GAAW,CAAC4G,EAASC,KAC1GxG,EAASc,KAAKwF,EAAmB,GAAKR,GAGtC,IAAIlF,EAAM1C,EAAoB6G,EAAI7G,EAAoB+B,EAAEN,GAEpDwG,EAAQ,IAAItB,MAgBhB3G,EAAoByC,EAAEC,GAfFoB,IACnB,GAAG9D,EAAoBmB,EAAE+G,EAAiBzG,KAEf,KAD1B2G,EAAqBF,EAAgBzG,MACRyG,EAAgBzG,QAAWtB,GACrDiI,GAAoB,CACtB,IAAIG,EAAYzE,IAAyB,SAAfA,EAAMW,KAAkB,UAAYX,EAAMW,MAChE+D,EAAU1E,GAASA,EAAMY,QAAUZ,EAAMY,OAAOf,IACpDsE,EAAMQ,QAAU,iBAAmBhH,EAAU,cAAgB8G,EAAY,KAAOC,EAAU,IAC1FP,EAAMzC,KAAO,iBACbyC,EAAMxD,KAAO8D,EACbN,EAAMS,QAAUF,EAChBJ,EAAmB,GAAGH,EACvB,CACD,GAEwC,SAAWxG,EAASA,EAC9D,CAEF,EAcF,IAAIkH,EAAuB,CAACC,EAA4BC,KACvD,IAGI5I,EAAUwB,GAHTqH,EAAUC,EAAaC,GAAWH,EAGhB3F,EAAI,EAC3B,GAAG4F,EAASG,MAAM3I,GAAgC,IAAxB4H,EAAgB5H,KAAa,CACtD,IAAIL,KAAY8I,EACZ/I,EAAoBmB,EAAE4H,EAAa9I,KACrCD,EAAoBU,EAAET,GAAY8I,EAAY9I,IAG7C+I,GAAsBA,EAAQhJ,EAClC,CAEA,IADG4I,GAA4BA,EAA2BC,GACrD3F,EAAI4F,EAAS3F,OAAQD,IACzBzB,EAAUqH,EAAS5F,GAChBlD,EAAoBmB,EAAE+G,EAAiBzG,IAAYyG,EAAgBzG,IACrEyG,EAAgBzG,GAAS,KAE1ByG,EAAgBzG,GAAW,CAC5B,EAIGyH,EAAqBC,KAAuC,iCAAIA,KAAuC,kCAAK,GAChHD,EAAmB7E,QAAQsE,EAAqBnE,KAAK,KAAM,IAC3D0E,EAAmBtG,KAAO+F,EAAqBnE,KAAK,KAAM0E,EAAmBtG,KAAK4B,KAAK0E,G,KCrFvFlJ,EAAoByD,QAAKtD,ECGCH,EAAoB,K","sources":["webpack:///webpack/runtime/load script","webpack:///webpack/runtime/consumes","webpack:///./src/index.ts","webpack:///webpack/bootstrap","webpack:///webpack/runtime/compat get default export","webpack:///webpack/runtime/define property getters","webpack:///webpack/runtime/ensure chunk","webpack:///webpack/runtime/get javascript chunk filename","webpack:///webpack/runtime/global","webpack:///webpack/runtime/hasOwnProperty shorthand","webpack:///webpack/runtime/make namespace object","webpack:///webpack/runtime/node module decorator","webpack:///webpack/runtime/sharing","webpack:///webpack/runtime/publicPath","webpack:///webpack/runtime/jsonp chunk loading","webpack:///webpack/runtime/nonce","webpack:///webpack/startup"],"sourcesContent":["var inProgress = {};\nvar dataWebpackPrefix = \"@next-bricks/diagram:\";\n// loadScript function to load a script via script tag\n__webpack_require__.l = (url, done, key, chunkId) => {\n\tif(inProgress[url]) { inProgress[url].push(done); return; }\n\tvar script, needAttach;\n\tif(key !== undefined) {\n\t\tvar scripts = document.getElementsByTagName(\"script\");\n\t\tfor(var i = 0; i < scripts.length; i++) {\n\t\t\tvar s = scripts[i];\n\t\t\tif(s.getAttribute(\"src\") == url || s.getAttribute(\"data-webpack\") == dataWebpackPrefix + key) { script = s; break; }\n\t\t}\n\t}\n\tif(!script) {\n\t\tneedAttach = true;\n\t\tscript = document.createElement('script');\n\n\t\tscript.charset = 'utf-8';\n\t\tscript.timeout = 120;\n\t\tif (__webpack_require__.nc) {\n\t\t\tscript.setAttribute(\"nonce\", __webpack_require__.nc);\n\t\t}\n\t\tscript.setAttribute(\"data-webpack\", dataWebpackPrefix + key);\n\n\t\tscript.src = url;\n\t}\n\tinProgress[url] = [done];\n\tvar onScriptComplete = (prev, event) => {\n\t\t// avoid mem leaks in IE.\n\t\tscript.onerror = script.onload = null;\n\t\tclearTimeout(timeout);\n\t\tvar doneFns = inProgress[url];\n\t\tdelete inProgress[url];\n\t\tscript.parentNode && script.parentNode.removeChild(script);\n\t\tdoneFns && doneFns.forEach((fn) => (fn(event)));\n\t\tif(prev) return prev(event);\n\t}\n\tvar timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);\n\tscript.onerror = onScriptComplete.bind(null, script.onerror);\n\tscript.onload = onScriptComplete.bind(null, script.onload);\n\tneedAttach && document.head.appendChild(script);\n};","var parseVersion = (str) => {\n\t// see webpack/lib/util/semver.js for original code\n\tvar p=p=>{return p.split(\".\").map((p=>{return+p==p?+p:p}))},n=/^([^-+]+)?(?:-([^+]+))?(?:\\+(.+))?$/.exec(str),r=n[1]?p(n[1]):[];return n[2]&&(r.length++,r.push.apply(r,p(n[2]))),n[3]&&(r.push([]),r.push.apply(r,p(n[3]))),r;\n}\nvar versionLt = (a, b) => {\n\t// see webpack/lib/util/semver.js for original code\n\ta=parseVersion(a),b=parseVersion(b);for(var r=0;;){if(r>=a.length)return r<b.length&&\"u\"!=(typeof b[r])[0];var e=a[r],n=(typeof e)[0];if(r>=b.length)return\"u\"==n;var t=b[r],f=(typeof t)[0];if(n!=f)return\"o\"==n&&\"n\"==f||(\"s\"==f||\"u\"==n);if(\"o\"!=n&&\"u\"!=n&&e!=t)return e<t;r++}\n}\nvar rangeToString = (range) => {\n\t// see webpack/lib/util/semver.js for original code\n\tvar r=range[0],n=\"\";if(1===range.length)return\"*\";if(r+.5){n+=0==r?\">=\":-1==r?\"<\":1==r?\"^\":2==r?\"~\":r>0?\"=\":\"!=\";for(var e=1,a=1;a<range.length;a++){e--,n+=\"u\"==(typeof(t=range[a]))[0]?\"-\":(e>0?\".\":\"\")+(e=2,t)}return n}var g=[];for(a=1;a<range.length;a++){var t=range[a];g.push(0===t?\"not(\"+o()+\")\":1===t?\"(\"+o()+\" || \"+o()+\")\":2===t?g.pop()+\" \"+g.pop():rangeToString(t))}return o();function o(){return g.pop().replace(/^\\((.+)\\)$/,\"$1\")}\n}\nvar satisfy = (range, version) => {\n\t// see webpack/lib/util/semver.js for original code\n\tif(0 in range){version=parseVersion(version);var e=range[0],r=e<0;r&&(e=-e-1);for(var n=0,i=1,a=!0;;i++,n++){var f,s,g=i<range.length?(typeof range[i])[0]:\"\";if(n>=version.length||\"o\"==(s=(typeof(f=version[n]))[0]))return!a||(\"u\"==g?i>e&&!r:\"\"==g!=r);if(\"u\"==s){if(!a||\"u\"!=g)return!1}else if(a)if(g==s)if(i<=e){if(f!=range[i])return!1}else{if(r?f>range[i]:f<range[i])return!1;f!=range[i]&&(a=!1)}else if(\"s\"!=g&&\"n\"!=g){if(r||i<=e)return!1;a=!1,i--}else{if(i<=e||s<g!=r)return!1;a=!1}else\"s\"!=g&&\"n\"!=g&&(a=!1,i--)}}var t=[],o=t.pop.bind(t);for(n=1;n<range.length;n++){var u=range[n];t.push(1==u?o()|o():2==u?o()&o():u?satisfy(u,version):!o())}return!!o();\n}\nvar ensureExistence = (scopeName, key) => {\n\tvar scope = __webpack_require__.S[scopeName];\n\tif(!scope || !__webpack_require__.o(scope, key)) throw new Error(\"Shared module \" + key + \" doesn't exist in shared scope \" + scopeName);\n\treturn scope;\n};\nvar findVersion = (scope, key) => {\n\tvar versions = scope[key];\n\tvar key = Object.keys(versions).reduce((a, b) => {\n\t\treturn !a || versionLt(a, b) ? b : a;\n\t}, 0);\n\treturn key && versions[key]\n};\nvar findSingletonVersionKey = (scope, key) => {\n\tvar versions = scope[key];\n\treturn Object.keys(versions).reduce((a, b) => {\n\t\treturn !a || (!versions[a].loaded && versionLt(a, b)) ? b : a;\n\t}, 0);\n};\nvar getInvalidSingletonVersionMessage = (scope, key, version, requiredVersion) => {\n\treturn \"Unsatisfied version \" + version + \" from \" + (version && scope[key][version].from) + \" of shared singleton module \" + key + \" (required \" + rangeToString(requiredVersion) + \")\"\n};\nvar getSingleton = (scope, scopeName, key, requiredVersion) => {\n\tvar version = findSingletonVersionKey(scope, key);\n\treturn get(scope[key][version]);\n};\nvar getSingletonVersion = (scope, scopeName, key, requiredVersion) => {\n\tvar version = findSingletonVersionKey(scope, key);\n\tif (!satisfy(requiredVersion, version)) warn(getInvalidSingletonVersionMessage(scope, key, version, requiredVersion));\n\treturn get(scope[key][version]);\n};\nvar getStrictSingletonVersion = (scope, scopeName, key, requiredVersion) => {\n\tvar version = findSingletonVersionKey(scope, key);\n\tif (!satisfy(requiredVersion, version)) throw new Error(getInvalidSingletonVersionMessage(scope, key, version, requiredVersion));\n\treturn get(scope[key][version]);\n};\nvar findValidVersion = (scope, key, requiredVersion) => {\n\tvar versions = scope[key];\n\tvar key = Object.keys(versions).reduce((a, b) => {\n\t\tif (!satisfy(requiredVersion, b)) return a;\n\t\treturn !a || versionLt(a, b) ? b : a;\n\t}, 0);\n\treturn key && versions[key]\n};\nvar getInvalidVersionMessage = (scope, scopeName, key, requiredVersion) => {\n\tvar versions = scope[key];\n\treturn \"No satisfying version (\" + rangeToString(requiredVersion) + \") of shared module \" + key + \" found in shared scope \" + scopeName + \".\\n\" +\n\t\t\"Available versions: \" + Object.keys(versions).map((key) => {\n\t\treturn key + \" from \" + versions[key].from;\n\t}).join(\", \");\n};\nvar getValidVersion = (scope, scopeName, key, requiredVersion) => {\n\tvar entry = findValidVersion(scope, key, requiredVersion);\n\tif(entry) return get(entry);\n\tthrow new Error(getInvalidVersionMessage(scope, scopeName, key, requiredVersion));\n};\nvar warn = (msg) => {\n\tif (typeof console !== \"undefined\" && console.warn) console.warn(msg);\n};\nvar warnInvalidVersion = (scope, scopeName, key, requiredVersion) => {\n\twarn(getInvalidVersionMessage(scope, scopeName, key, requiredVersion));\n};\nvar get = (entry) => {\n\tentry.loaded = 1;\n\treturn entry.get()\n};\nvar init = (fn) => (function(scopeName, a, b, c) {\n\tvar promise = __webpack_require__.I(scopeName);\n\tif (promise && promise.then) return promise.then(fn.bind(fn, scopeName, __webpack_require__.S[scopeName], a, b, c));\n\treturn fn(scopeName, __webpack_require__.S[scopeName], a, b, c);\n});\n\nvar load = /*#__PURE__*/ init((scopeName, scope, key) => {\n\tensureExistence(scopeName, key);\n\treturn get(findVersion(scope, key));\n});\nvar loadFallback = /*#__PURE__*/ init((scopeName, scope, key, fallback) => {\n\treturn scope && __webpack_require__.o(scope, key) ? get(findVersion(scope, key)) : fallback();\n});\nvar loadVersionCheck = /*#__PURE__*/ init((scopeName, scope, key, version) => {\n\tensureExistence(scopeName, key);\n\treturn get(findValidVersion(scope, key, version) || warnInvalidVersion(scope, scopeName, key, version) || findVersion(scope, key));\n});\nvar loadSingleton = /*#__PURE__*/ init((scopeName, scope, key) => {\n\tensureExistence(scopeName, key);\n\treturn getSingleton(scope, scopeName, key);\n});\nvar loadSingletonVersionCheck = /*#__PURE__*/ init((scopeName, scope, key, version) => {\n\tensureExistence(scopeName, key);\n\treturn getSingletonVersion(scope, scopeName, key, version);\n});\nvar loadStrictVersionCheck = /*#__PURE__*/ init((scopeName, scope, key, version) => {\n\tensureExistence(scopeName, key);\n\treturn getValidVersion(scope, scopeName, key, version);\n});\nvar loadStrictSingletonVersionCheck = /*#__PURE__*/ init((scopeName, scope, key, version) => {\n\tensureExistence(scopeName, key);\n\treturn getStrictSingletonVersion(scope, scopeName, key, version);\n});\nvar loadVersionCheckFallback = /*#__PURE__*/ init((scopeName, scope, key, version, fallback) => {\n\tif(!scope || !__webpack_require__.o(scope, key)) return fallback();\n\treturn get(findValidVersion(scope, key, version) || warnInvalidVersion(scope, scopeName, key, version) || findVersion(scope, key));\n});\nvar loadSingletonFallback = /*#__PURE__*/ init((scopeName, scope, key, fallback) => {\n\tif(!scope || !__webpack_require__.o(scope, key)) return fallback();\n\treturn getSingleton(scope, scopeName, key);\n});\nvar loadSingletonVersionCheckFallback = /*#__PURE__*/ init((scopeName, scope, key, version, fallback) => {\n\tif(!scope || !__webpack_require__.o(scope, key)) return fallback();\n\treturn getSingletonVersion(scope, scopeName, key, version);\n});\nvar loadStrictVersionCheckFallback = /*#__PURE__*/ init((scopeName, scope, key, version, fallback) => {\n\tvar entry = scope && __webpack_require__.o(scope, key) && findValidVersion(scope, key, version);\n\treturn entry ? get(entry) : fallback();\n});\nvar loadStrictSingletonVersionCheckFallback = /*#__PURE__*/ init((scopeName, scope, key, version, fallback) => {\n\tif(!scope || !__webpack_require__.o(scope, key)) return fallback();\n\treturn getStrictSingletonVersion(scope, scopeName, key, version);\n});\nvar installedModules = {};\nvar moduleToHandlerMapping = {\n\t8769: () => (loadStrictVersionCheckFallback(\"default\", \"react\", [6,0,0,0,,\"experimental-ee8509801-20230117\"], () => (__webpack_require__.e(4041).then(() => (() => (__webpack_require__(4041))))))),\n\t1030: () => (loadSingletonVersionCheckFallback(\"default\", \"lodash\", [1,4,17,21], () => (__webpack_require__.e(5250).then(() => (() => (__webpack_require__(5250))))))),\n\t9929: () => (loadStrictVersionCheckFallback(\"default\", \"@next-core/element\", [1,1,2,3], () => (__webpack_require__.e(3426).then(() => (() => (__webpack_require__(1045))))))),\n\t330: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/theme\", [1,1,4,8], () => (__webpack_require__.e(1889).then(() => (() => (__webpack_require__(1889))))))),\n\t9938: () => (loadStrictVersionCheckFallback(\"default\", \"@next-core/react-element\", [1,1,0,22], () => (Promise.all([__webpack_require__.e(4208), __webpack_require__.e(7733)]).then(() => (() => (__webpack_require__(114))))))),\n\t8438: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/utils/general\", [1,1,6,11], () => (__webpack_require__.e(7452).then(() => (() => (__webpack_require__(7452))))))),\n\t7410: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/runtime\", [1,1,33,0], () => (Promise.all([__webpack_require__.e(1860), __webpack_require__.e(8438), __webpack_require__.e(1302), __webpack_require__.e(7058), __webpack_require__.e(7862), __webpack_require__.e(3436)]).then(() => (() => (__webpack_require__(1860))))))),\n\t4993: () => (loadStrictVersionCheckFallback(\"default\", \"@next-core/react-runtime\", [1,1,2,3], () => (__webpack_require__.e(9591).then(() => (() => (__webpack_require__(1972))))))),\n\t6237: () => (loadStrictVersionCheckFallback(\"default\", \"react-dom\", [0,16,9,0], () => (__webpack_require__.e(3144).then(() => (() => (__webpack_require__(3144))))))),\n\t3496: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/http\", [1,1,0,6], () => (__webpack_require__.e(1370).then(() => (() => (__webpack_require__(8989))))))),\n\t1204: () => (loadSingletonVersionCheckFallback(\"default\", \"js-yaml\", [1,3,14,0], () => (__webpack_require__.e(9515).then(() => (() => (__webpack_require__(9515))))))),\n\t8297: () => (loadSingletonVersionCheckFallback(\"default\", \"moment\", [1,2,27,0], () => (Promise.all([__webpack_require__.e(7721), __webpack_require__.e(9844)]).then(() => (() => (__webpack_require__(9420))))))),\n\t2617: () => (loadSingletonVersionCheckFallback(\"default\", \"@babel/parser\", [1,7,24,0], () => (__webpack_require__.e(6773).then(() => (() => (__webpack_require__(6773))))))),\n\t7058: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/i18n\", [1,1,0,39], () => (Promise.all([__webpack_require__.e(8442), __webpack_require__.e(3171)]).then(() => (() => (__webpack_require__(5552))))))),\n\t2350: () => (loadSingletonVersionCheckFallback(\"default\", \"i18next\", [1,22,5,1], () => (__webpack_require__.e(7304).then(() => (() => (__webpack_require__(7304))))))),\n\t6837: () => (loadSingletonVersionCheckFallback(\"default\", \"i18next-browser-languagedetector\", [1,7,2,0], () => (__webpack_require__.e(726).then(() => (() => (__webpack_require__(726))))))),\n\t9259: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/pipes\", [1,2,0,17], () => (__webpack_require__.e(6519).then(() => (() => (__webpack_require__(6519))))))),\n\t161: () => (loadSingletonVersionCheckFallback(\"default\", \"@easyops-cn/brick-next-pipes\", [2,0,6,0], () => (Promise.all([__webpack_require__.e(4741), __webpack_require__.e(1030), __webpack_require__.e(6688)]).then(() => (() => (__webpack_require__(4741))))))),\n\t454: () => (loadFallback(\"default\", \"react-dom\", () => (__webpack_require__.e(3144).then(() => (() => (__webpack_require__(3144))))))),\n\t9435: () => (loadStrictVersionCheckFallback(\"default\", \"react-dom\", [6,0,0,0,,\"experimental-ee8509801-20230117\"], () => (__webpack_require__.e(3144).then(() => (() => (__webpack_require__(3144))))))),\n\t1302: () => (loadSingletonVersionCheckFallback(\"default\", \"moment\", [1,2,30,1], () => (Promise.all([__webpack_require__.e(7721), __webpack_require__.e(9844)]).then(() => (() => (__webpack_require__(9420))))))),\n\t5481: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/cook\", [1,2,2,13], () => (Promise.all([__webpack_require__.e(1122), __webpack_require__.e(2617)]).then(() => (() => (__webpack_require__(1122))))))),\n\t50: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/utils/storyboard\", [1,1,6,11], () => (__webpack_require__.e(6314).then(() => (() => (__webpack_require__(3933))))))),\n\t2890: () => (loadSingletonVersionCheckFallback(\"default\", \"history\", [1,4,10,1], () => (__webpack_require__.e(5384).then(() => (() => (__webpack_require__(5384))))))),\n\t5290: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/http\", [1,1,1,10], () => (__webpack_require__.e(1370).then(() => (() => (__webpack_require__(8989))))))),\n\t5435: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/inject\", [1,1,0,29], () => (Promise.all([__webpack_require__.e(9259), __webpack_require__.e(4658)]).then(() => (() => (__webpack_require__(2277))))))),\n\t6036: () => (loadSingletonVersionCheckFallback(\"default\", \"moment/locale/zh-cn.js\", [1,2,30,1], () => (Promise.all([__webpack_require__.e(7721), __webpack_require__.e(9844)]).then(() => (() => (__webpack_require__(1329))))))),\n\t6154: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/loader\", [1,1,5,5], () => (__webpack_require__.e(7780).then(() => (() => (__webpack_require__(7780))))))),\n\t7731: () => (loadSingletonVersionCheckFallback(\"default\", \"@next-core/supply\", [1,2,1,12], () => (Promise.all([__webpack_require__.e(9259), __webpack_require__.e(1940)]).then(() => (() => (__webpack_require__(9559)))))))\n};\n// no consumes in initial chunks\nvar chunkMapping = {\n\t\"709\": [\n\t\t6237\n\t],\n\t\"1030\": [\n\t\t1030\n\t],\n\t\"1302\": [\n\t\t1302\n\t],\n\t\"2617\": [\n\t\t2617\n\t],\n\t\"3436\": [\n\t\t50,\n\t\t2890,\n\t\t5290,\n\t\t5435,\n\t\t6036,\n\t\t6154,\n\t\t7731\n\t],\n\t\"4208\": [\n\t\t454,\n\t\t9435\n\t],\n\t\"4993\": [\n\t\t4993\n\t],\n\t\"6519\": [\n\t\t161\n\t],\n\t\"6688\": [\n\t\t1204,\n\t\t8297\n\t],\n\t\"7034\": [\n\t\t3496\n\t],\n\t\"7058\": [\n\t\t7058\n\t],\n\t\"7410\": [\n\t\t7410\n\t],\n\t\"7862\": [\n\t\t5481\n\t],\n\t\"8299\": [\n\t\t330,\n\t\t9938\n\t],\n\t\"8438\": [\n\t\t8438\n\t],\n\t\"8442\": [\n\t\t2350,\n\t\t6837\n\t],\n\t\"8769\": [\n\t\t8769\n\t],\n\t\"9259\": [\n\t\t9259\n\t],\n\t\"9929\": [\n\t\t9929\n\t]\n};\nvar startedInstallModules = {};\n__webpack_require__.f.consumes = (chunkId, promises) => {\n\tif(__webpack_require__.o(chunkMapping, chunkId)) {\n\t\tchunkMapping[chunkId].forEach((id) => {\n\t\t\tif(__webpack_require__.o(installedModules, id)) return promises.push(installedModules[id]);\n\t\t\tif(!startedInstallModules[id]) {\n\t\t\tvar onFactory = (factory) => {\n\t\t\t\tinstalledModules[id] = 0;\n\t\t\t\t__webpack_require__.m[id] = (module) => {\n\t\t\t\t\tdelete __webpack_require__.c[id];\n\t\t\t\t\tmodule.exports = factory();\n\t\t\t\t}\n\t\t\t};\n\t\t\tstartedInstallModules[id] = true;\n\t\t\tvar onError = (error) => {\n\t\t\t\tdelete installedModules[id];\n\t\t\t\t__webpack_require__.m[id] = (module) => {\n\t\t\t\t\tdelete __webpack_require__.c[id];\n\t\t\t\t\tthrow error;\n\t\t\t\t}\n\t\t\t};\n\t\t\ttry {\n\t\t\t\tvar promise = moduleToHandlerMapping[id]();\n\t\t\t\tif(promise.then) {\n\t\t\t\t\tpromises.push(installedModules[id] = promise.then(onFactory)['catch'](onError));\n\t\t\t\t} else onFactory(promise);\n\t\t\t} catch(e) { onError(e); }\n\t\t\t}\n\t\t});\n\t}\n}","import(\"./bootstrap.js\");\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\tid: moduleId,\n\t\tloaded: false,\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n\t// Flag the module as loaded\n\tmodule.loaded = true;\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n// expose the modules object (__webpack_modules__)\n__webpack_require__.m = __webpack_modules__;\n\n// expose the module cache\n__webpack_require__.c = __webpack_module_cache__;\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.f = {};\n// This file contains only the entry chunk.\n// The chunk loading function for additional chunks\n__webpack_require__.e = (chunkId) => {\n\treturn Promise.all(Object.keys(__webpack_require__.f).reduce((promises, key) => {\n\t\t__webpack_require__.f[key](chunkId, promises);\n\t\treturn promises;\n\t}, []));\n};","// This function allow to reference async chunks\n__webpack_require__.u = (chunkId) => {\n\t// return url for filenames based on template\n\treturn \"chunks/\" + chunkId + \".\" + {\"114\":\"ff6154a0\",\"709\":\"bc74a999\",\"726\":\"efcf01a2\",\"1030\":\"d12d7dee\",\"1045\":\"c6921aed\",\"1122\":\"aa791e35\",\"1302\":\"c06bd17d\",\"1370\":\"1b4ac3ac\",\"1728\":\"cf49ae61\",\"1860\":\"4fd60630\",\"1889\":\"c14b28e6\",\"1940\":\"788d05b3\",\"1972\":\"d6fea46c\",\"2052\":\"fa66eafb\",\"2277\":\"9a1ded28\",\"2617\":\"7fdfc9fb\",\"3144\":\"712fb13e\",\"3171\":\"9f016ea3\",\"3426\":\"f1ddd917\",\"3436\":\"48e0e4dd\",\"3933\":\"0342d0ab\",\"4041\":\"58c8ed1f\",\"4208\":\"bc504ba3\",\"4658\":\"e875061a\",\"4741\":\"eda28116\",\"4993\":\"133e50a4\",\"5145\":\"f606390f\",\"5250\":\"f7dfb399\",\"5384\":\"f1a69526\",\"5399\":\"e2de915e\",\"5481\":\"d6977dfc\",\"5552\":\"8099590c\",\"6314\":\"a17e6cef\",\"6519\":\"9c35628c\",\"6688\":\"714d3e8b\",\"6773\":\"6ac391fe\",\"7034\":\"286dd8ae\",\"7058\":\"f8880fe9\",\"7304\":\"a2d65f45\",\"7410\":\"fad5932c\",\"7452\":\"9d465fb5\",\"7721\":\"5bd46b7f\",\"7733\":\"7a82300e\",\"7780\":\"bbd9990e\",\"7862\":\"4fd520d3\",\"7920\":\"cc5f2f6b\",\"8299\":\"4ca8ac4b\",\"8438\":\"a7e43856\",\"8442\":\"026d7b4e\",\"8769\":\"70cc3f88\",\"8989\":\"cf6586cc\",\"9259\":\"7e779e4a\",\"9515\":\"c8266f33\",\"9559\":\"2729fe3b\",\"9591\":\"c5101110\",\"9844\":\"db90776a\",\"9929\":\"34c83d45\"}[chunkId] + \".js\";\n};","__webpack_require__.g = (function() {\n\tif (typeof globalThis === 'object') return globalThis;\n\ttry {\n\t\treturn this || new Function('return this')();\n\t} catch (e) {\n\t\tif (typeof window === 'object') return window;\n\t}\n})();","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","__webpack_require__.nmd = (module) => {\n\tmodule.paths = [];\n\tif (!module.children) module.children = [];\n\treturn module;\n};","__webpack_require__.S = {};\nvar initPromises = {};\nvar initTokens = {};\n__webpack_require__.I = (name, initScope) => {\n\tif(!initScope) initScope = [];\n\t// handling circular init calls\n\tvar initToken = initTokens[name];\n\tif(!initToken) initToken = initTokens[name] = {};\n\tif(initScope.indexOf(initToken) >= 0) return;\n\tinitScope.push(initToken);\n\t// only runs once\n\tif(initPromises[name]) return initPromises[name];\n\t// creates a new share scope if needed\n\tif(!__webpack_require__.o(__webpack_require__.S, name)) __webpack_require__.S[name] = {};\n\t// runs all init snippets from all modules reachable\n\tvar scope = __webpack_require__.S[name];\n\tvar warn = (msg) => {\n\t\tif (typeof console !== \"undefined\" && console.warn) console.warn(msg);\n\t};\n\tvar uniqueName = \"@next-bricks/diagram\";\n\tvar register = (name, version, factory, eager) => {\n\t\tvar versions = scope[name] = scope[name] || {};\n\t\tvar activeVersion = versions[version];\n\t\tif(!activeVersion || (!activeVersion.loaded && (!eager != !activeVersion.eager ? eager : uniqueName > activeVersion.from))) versions[version] = { get: factory, from: uniqueName, eager: !!eager };\n\t};\n\tvar initExternal = (id) => {\n\t\tvar handleError = (err) => (warn(\"Initialization of sharing external failed: \" + err));\n\t\ttry {\n\t\t\tvar module = __webpack_require__(id);\n\t\t\tif(!module) return;\n\t\t\tvar initFn = (module) => (module && module.init && module.init(__webpack_require__.S[name], initScope))\n\t\t\tif(module.then) return promises.push(module.then(initFn, handleError));\n\t\t\tvar initResult = initFn(module);\n\t\t\tif(initResult && initResult.then) return promises.push(initResult['catch'](handleError));\n\t\t} catch(err) { handleError(err); }\n\t}\n\tvar promises = [];\n\tswitch(name) {\n\t\tcase \"default\": {\n\t\t\tregister(\"@babel/parser\", \"7.24.0\", () => (__webpack_require__.e(6773).then(() => (() => (__webpack_require__(6773))))));\n\t\t\tregister(\"@easyops-cn/brick-next-pipes\", \"0.6.0\", () => (Promise.all([__webpack_require__.e(4741), __webpack_require__.e(1030), __webpack_require__.e(6688)]).then(() => (() => (__webpack_require__(4741))))));\n\t\t\tregister(\"@next-core/cook\", \"2.2.13\", () => (Promise.all([__webpack_require__.e(1122), __webpack_require__.e(2617)]).then(() => (() => (__webpack_require__(1122))))));\n\t\t\tregister(\"@next-core/element\", \"1.2.3\", () => (__webpack_require__.e(1045).then(() => (() => (__webpack_require__(1045))))));\n\t\t\tregister(\"@next-core/http\", \"1.1.10\", () => (__webpack_require__.e(8989).then(() => (() => (__webpack_require__(8989))))));\n\t\t\tregister(\"@next-core/i18n\", \"1.0.39\", () => (Promise.all([__webpack_require__.e(8438), __webpack_require__.e(7058), __webpack_require__.e(8442), __webpack_require__.e(5552)]).then(() => (() => (__webpack_require__(5552))))));\n\t\t\tregister(\"@next-core/inject\", \"1.0.29\", () => (Promise.all([__webpack_require__.e(1030), __webpack_require__.e(9259), __webpack_require__.e(2277)]).then(() => (() => (__webpack_require__(2277))))));\n\t\t\tregister(\"@next-core/loader\", \"1.5.5\", () => (__webpack_require__.e(5399).then(() => (() => (__webpack_require__(7780))))));\n\t\t\tregister(\"@next-core/pipes\", \"2.0.17\", () => (__webpack_require__.e(6519).then(() => (() => (__webpack_require__(6519))))));\n\t\t\tregister(\"@next-core/react-element\", \"1.0.22\", () => (Promise.all([__webpack_require__.e(8769), __webpack_require__.e(9929), __webpack_require__.e(4208), __webpack_require__.e(114)]).then(() => (() => (__webpack_require__(114))))));\n\t\t\tregister(\"@next-core/react-runtime\", \"1.2.3\", () => (Promise.all([__webpack_require__.e(8769), __webpack_require__.e(1030), __webpack_require__.e(7410), __webpack_require__.e(1972)]).then(() => (() => (__webpack_require__(1972))))));\n\t\t\tregister(\"@next-core/runtime\", \"1.33.0\", () => (Promise.all([__webpack_require__.e(1860), __webpack_require__.e(1030), __webpack_require__.e(8438), __webpack_require__.e(1302), __webpack_require__.e(7058), __webpack_require__.e(7862), __webpack_require__.e(3436), __webpack_require__.e(7920)]).then(() => (() => (__webpack_require__(1860))))));\n\t\t\tregister(\"@next-core/supply\", \"2.1.12\", () => (Promise.all([__webpack_require__.e(1030), __webpack_require__.e(9259), __webpack_require__.e(1302), __webpack_require__.e(9559)]).then(() => (() => (__webpack_require__(9559))))));\n\t\t\tregister(\"@next-core/theme\", \"1.4.8\", () => (Promise.all([__webpack_require__.e(1889), __webpack_require__.e(2052)]).then(() => (() => (__webpack_require__(1889))))));\n\t\t\tregister(\"@next-core/utils/general\", \"1.6.11\", () => (__webpack_require__.e(7452).then(() => (() => (__webpack_require__(7452))))));\n\t\t\tregister(\"@next-core/utils/storyboard\", \"1.6.11\", () => (Promise.all([__webpack_require__.e(8438), __webpack_require__.e(7862), __webpack_require__.e(3933)]).then(() => (() => (__webpack_require__(3933))))));\n\t\t\tregister(\"history\", \"4.10.1\", () => (__webpack_require__.e(5384).then(() => (() => (__webpack_require__(5384))))));\n\t\t\tregister(\"i18next-browser-languagedetector\", \"7.2.0\", () => (__webpack_require__.e(726).then(() => (() => (__webpack_require__(726))))));\n\t\t\tregister(\"i18next\", \"22.5.1\", () => (__webpack_require__.e(7304).then(() => (() => (__webpack_require__(7304))))));\n\t\t\tregister(\"js-yaml\", \"3.14.1\", () => (__webpack_require__.e(9515).then(() => (() => (__webpack_require__(9515))))));\n\t\t\tregister(\"lodash\", \"4.17.21\", () => (__webpack_require__.e(5250).then(() => (() => (__webpack_require__(5250))))));\n\t\t\tregister(\"moment/locale/zh-cn.js\", \"2.29.4\", () => (Promise.all([__webpack_require__.e(7721), __webpack_require__.e(9844)]).then(() => (() => (__webpack_require__(1329))))));\n\t\t\tregister(\"moment\", \"2.29.4\", () => (Promise.all([__webpack_require__.e(7721), __webpack_require__.e(9844)]).then(() => (() => (__webpack_require__(9420))))));\n\t\t\tregister(\"react-dom\", \"0.0.0-experimental-ee8509801-20230117\", () => (Promise.all([__webpack_require__.e(3144), __webpack_require__.e(8769)]).then(() => (() => (__webpack_require__(3144))))));\n\t\t\tregister(\"react\", \"0.0.0-experimental-ee8509801-20230117\", () => (__webpack_require__.e(4041).then(() => (() => (__webpack_require__(4041))))));\n\t\t}\n\t\tbreak;\n\t}\n\tif(!promises.length) return initPromises[name] = 1;\n\treturn initPromises[name] = Promise.all(promises).then(() => (initPromises[name] = 1));\n};","var scriptUrl;\nif (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + \"\";\nvar document = __webpack_require__.g.document;\nif (!scriptUrl && document) {\n\tif (document.currentScript)\n\t\tscriptUrl = document.currentScript.src;\n\tif (!scriptUrl) {\n\t\tvar scripts = document.getElementsByTagName(\"script\");\n\t\tif(scripts.length) {\n\t\t\tvar i = scripts.length - 1;\n\t\t\twhile (i > -1 && (!scriptUrl || !/^http(s?):/.test(scriptUrl))) scriptUrl = scripts[i--].src;\n\t\t}\n\t}\n}\n// When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration\n// or pass an empty string (\"\") and set the __webpack_public_path__ variable from your code to use your own logic.\nif (!scriptUrl) throw new Error(\"Automatic publicPath is not supported in this browser\");\nscriptUrl = scriptUrl.replace(/#.*$/, \"\").replace(/\\?.*$/, \"\").replace(/\\/[^\\/]+$/, \"/\");\n__webpack_require__.p = scriptUrl + \"../\";","// no baseURI\n\n// object to store loaded and loading chunks\n// undefined = chunk not loaded, null = chunk preloaded/prefetched\n// [resolve, reject, Promise] = chunk loading, 0 = chunk loaded\nvar installedChunks = {\n\t8792: 0\n};\n\n__webpack_require__.f.j = (chunkId, promises) => {\n\t\t// JSONP chunk loading for javascript\n\t\tvar installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;\n\t\tif(installedChunkData !== 0) { // 0 means \"already installed\".\n\n\t\t\t// a Promise means \"currently loading\".\n\t\t\tif(installedChunkData) {\n\t\t\t\tpromises.push(installedChunkData[2]);\n\t\t\t} else {\n\t\t\t\tif(!/^(7(058|410|862)|8(299|438|442|769)|1030|1302|2617|3436|4208|4993|6688|9259|9929)$/.test(chunkId)) {\n\t\t\t\t\t// setup Promise in chunk cache\n\t\t\t\t\tvar promise = new Promise((resolve, reject) => (installedChunkData = installedChunks[chunkId] = [resolve, reject]));\n\t\t\t\t\tpromises.push(installedChunkData[2] = promise);\n\n\t\t\t\t\t// start chunk loading\n\t\t\t\t\tvar url = __webpack_require__.p + __webpack_require__.u(chunkId);\n\t\t\t\t\t// create error before stack unwound to get useful stacktrace later\n\t\t\t\t\tvar error = new Error();\n\t\t\t\t\tvar loadingEnded = (event) => {\n\t\t\t\t\t\tif(__webpack_require__.o(installedChunks, chunkId)) {\n\t\t\t\t\t\t\tinstalledChunkData = installedChunks[chunkId];\n\t\t\t\t\t\t\tif(installedChunkData !== 0) installedChunks[chunkId] = undefined;\n\t\t\t\t\t\t\tif(installedChunkData) {\n\t\t\t\t\t\t\t\tvar errorType = event && (event.type === 'load' ? 'missing' : event.type);\n\t\t\t\t\t\t\t\tvar realSrc = event && event.target && event.target.src;\n\t\t\t\t\t\t\t\terror.message = 'Loading chunk ' + chunkId + ' failed.\\n(' + errorType + ': ' + realSrc + ')';\n\t\t\t\t\t\t\t\terror.name = 'ChunkLoadError';\n\t\t\t\t\t\t\t\terror.type = errorType;\n\t\t\t\t\t\t\t\terror.request = realSrc;\n\t\t\t\t\t\t\t\tinstalledChunkData[1](error);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t};\n\t\t\t\t\t__webpack_require__.l(url, loadingEnded, \"chunk-\" + chunkId, chunkId);\n\t\t\t\t} else installedChunks[chunkId] = 0;\n\t\t\t}\n\t\t}\n};\n\n// no prefetching\n\n// no preloaded\n\n// no HMR\n\n// no HMR manifest\n\n// no on chunks loaded\n\n// install a JSONP callback for chunk loading\nvar webpackJsonpCallback = (parentChunkLoadingFunction, data) => {\n\tvar [chunkIds, moreModules, runtime] = data;\n\t// add \"moreModules\" to the modules object,\n\t// then flag all \"chunkIds\" as loaded and fire callback\n\tvar moduleId, chunkId, i = 0;\n\tif(chunkIds.some((id) => (installedChunks[id] !== 0))) {\n\t\tfor(moduleId in moreModules) {\n\t\t\tif(__webpack_require__.o(moreModules, moduleId)) {\n\t\t\t\t__webpack_require__.m[moduleId] = moreModules[moduleId];\n\t\t\t}\n\t\t}\n\t\tif(runtime) var result = runtime(__webpack_require__);\n\t}\n\tif(parentChunkLoadingFunction) parentChunkLoadingFunction(data);\n\tfor(;i < chunkIds.length; i++) {\n\t\tchunkId = chunkIds[i];\n\t\tif(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {\n\t\t\tinstalledChunks[chunkId][0]();\n\t\t}\n\t\tinstalledChunks[chunkId] = 0;\n\t}\n\n}\n\nvar chunkLoadingGlobal = self[\"webpackChunk_next_bricks_diagram\"] = self[\"webpackChunk_next_bricks_diagram\"] || [];\nchunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));\nchunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));","__webpack_require__.nc = undefined;","// module cache are used so entry inlining is disabled\n// startup\n// Load entry module and return exports\nvar __webpack_exports__ = __webpack_require__(7934);\n"],"names":["inProgress","dataWebpackPrefix","parseVersion","versionLt","rangeToString","satisfy","findVersion","findSingletonVersionKey","getInvalidSingletonVersionMessage","getSingletonVersion","findValidVersion","warn","get","init","loadFallback","loadSingletonVersionCheckFallback","loadStrictVersionCheckFallback","installedModules","moduleToHandlerMapping","chunkMapping","startedInstallModules","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","exports","module","id","loaded","__webpack_modules__","call","m","c","n","getter","__esModule","d","a","definition","key","o","Object","defineProperty","enumerable","f","e","chunkId","Promise","all","keys","reduce","promises","u","g","globalThis","this","Function","window","obj","prop","prototype","hasOwnProperty","l","url","done","push","script","needAttach","scripts","document","getElementsByTagName","i","length","s","getAttribute","createElement","charset","timeout","nc","setAttribute","src","onScriptComplete","prev","event","onerror","onload","clearTimeout","doneFns","parentNode","removeChild","forEach","fn","setTimeout","bind","type","target","head","appendChild","r","Symbol","toStringTag","value","nmd","paths","children","S","initPromises","initTokens","I","name","initScope","initToken","indexOf","scope","uniqueName","register","version","factory","eager","versions","activeVersion","from","then","scriptUrl","importScripts","location","currentScript","test","Error","replace","p","str","split","map","exec","apply","b","t","range","pop","requiredVersion","scopeName","msg","console","entry","promise","fallback","consumes","onFactory","onError","error","installedChunks","j","installedChunkData","resolve","reject","errorType","realSrc","message","request","webpackJsonpCallback","parentChunkLoadingFunction","data","chunkIds","moreModules","runtime","some","chunkLoadingGlobal","self"],"sourceRoot":""}

package/dist/examples.json

@@ -3,12 +3,12 @@
     "doc": "构件 `eo-diagram`\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"600px\"\nbrick: div\nproperties:\n  style:\n    position: fixed\n    height: 100vh\n    width: 100vw\n    top: 0px\n    left: 0px\ncontext:\n  - name: activeTarget\n    value: null\n  - name: nodes\n    value:\n      - id: kspacey\n        label: Kevin Spacey\n      - id: swilliams\n        label: Saul Williams\n      - id: bpitt\n        label: Brad Pitt\n      # - id: hford\n      #   label: Harrison Ford\n      - id: lwilson\n        label: Luke Wilson\n      - id: kbacon\n        label: Kevin Bacon\n  - name: edges\n    value:\n      - source: kspacey\n        target: swilliams\n      - source: swilliams\n        target: kbacon\n      - source: bpitt\n        target: kbacon\n      # - source: hford\n      #   target: lwilson\n      - source: lwilson\n        target: kbacon\nchildren:\n  - brick: eo-button\n    properties:\n      textContent: Add Harrison Ford\n    events:\n      click:\n        - action: context.replace\n          args:\n            - nodes\n            - |\n              <%\n                CTX.nodes.concat({\n                  id: \"hford\",\n                  label: \"Harrison Ford\",\n                })\n              %>\n        - action: context.replace\n          args:\n            - edges\n            - |\n              <%\n                CTX.edges.concat({\n                  source: \"hford\",\n                  target: \"lwilson\",\n                })\n              %>\n        - target: _self\n          properties:\n            style:\n              visibility: hidden\n  - brick: eo-button\n    properties:\n      textContent: Remove Kevin Spacey\n    events:\n      click:\n        - action: context.replace\n          args:\n            - nodes\n            - |\n              <%\n                CTX.nodes.filter(node => node.id !== \"kspacey\")\n              %>\n        - action: context.replace\n          args:\n            - edges\n            - |\n              <%\n                CTX.edges.filter(({ source, target }) => source !== \"kspacey\" && target !== \"kspacey\")\n              %>\n        - target: _self\n          properties:\n            style:\n              visibility: hidden\n  - brick: eo-diagram\n    properties:\n      layout: dagre\n      nodes: <%= CTX.nodes %>\n      edges: <%= CTX.edges %>\n      lines:\n        - arrow: true\n      activeTarget: <%= CTX.activeTarget %>\n      nodeBricks:\n        - useBrick:\n            # if: <% DATA.node.id !== \"kbacon\" %>\n            brick: div\n            properties:\n              style: |\n                <%=\n                  {\n                    width: \"180px\",\n                    height: \"100px\",\n                    border: \"2px solid green\",\n                    display: \"flex\",\n                    alignItems: \"center\",\n                    justifyContent: \"center\",\n                    outline: CTX.activeTarget?.type === \"node\" && CTX.activeTarget.nodeId === DATA.node.id ? \"2px solid orange\" : \"none\",\n                    outlineOffset: \"2px\",\n                  }\n                %>\n            children:\n              - brick: span\n                properties:\n                  textContent: <% DATA.node.label %>\n            events:\n              click:\n                action: context.replace\n                args:\n                  - activeTarget\n                  - type: node\n                    nodeId: <% DATA.node.id %>\n    events:\n      activeTarget.change:\n        action: context.replace\n        args:\n          - activeTarget\n          - <% EVENT.detail %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"position: fixed; height: 100vh; width: 100vw; top: 0px; left: 0px\">\n#   <eo-button id=\"brick-1\">Add Harrison Ford</eo-button>\n#   <eo-button id=\"brick-2\">Remove Kevin Spacey</eo-button>\n#   <eo-diagram layout=\"dagre\" id=\"brick-3\"></eo-diagram>\n# </div>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"click\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const brick = e.target;\n#     brick.style = {\n#       visibility: \"hidden\",\n#     };\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_2.addEventListener(\"click\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const brick = e.target;\n#     brick.style = {\n#       visibility: \"hidden\",\n#     };\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.nodes = \"<%= CTX.nodes %>\";\n#   brick_3.edges = \"<%= CTX.edges %>\";\n#   brick_3.lines = [\n#     {\n#       arrow: true,\n#     },\n#   ];\n#   brick_3.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_3.nodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"div\",\n#         properties: {\n#           style:\n#             '<%=\\n  {\\n    width: \"180px\",\\n    height: \"100px\",\\n    border: \"2px solid green\",\\n    display: \"flex\",\\n    alignItems: \"center\",\\n    justifyContent: \"center\",\\n    outline: CTX.activeTarget?.type === \"node\" && CTX.activeTarget.nodeId === DATA.node.id ? \"2px solid orange\" : \"none\",\\n    outlineOffset: \"2px\",\\n  }\\n%>\\n',\n#         },\n#         children: [\n#           {\n#             brick: \"span\",\n#             properties: {\n#               textContent: \"<% DATA.node.label %>\",\n#             },\n#           },\n#         ],\n#         events: {\n#           click: {\n#             action: \"context.replace\",\n#             args: [\n#               \"activeTarget\",\n#               {\n#                 type: \"node\",\n#                 nodeId: \"<% DATA.node.id %>\",\n#               },\n#             ],\n#           },\n#         },\n#       },\n#     },\n#   ];\n#   brick_3.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# </script>\n# \n```\n\n### Page Architecture\n\n```yaml preview minHeight=\"600px\"\nbrick: div\nproperties:\n  style:\n    position: fixed\n    height: 100vh\n    width: 100vw\n    top: 0px\n    left: 0px\ncontext:\n  - name: activeTarget\n    value: null\n  - name: tempNodeId\n  - name: targetNode\n  - name: editingLabelNodes\n    value: []\n  - name: editingLabelEdges\n    value: []\n  - name: nodes\n    value:\n      - type: board\n        id: 60bf6078b095f\n        name: Visual Builder\n        depth: 0\n        parentId:\n        description: 某某产品\n      - type: page\n        id: 60bf60848d6d2\n        name: 项目列表\n        depth: 1\n        parentId: 60bf6078b095f\n        description: 列表页\n      - type: page\n        id: 60d533eba4ab2\n        name: ccc\n        depth: 1\n        parentId: 60bf6078b095f\n        description: cccc\n      - type: link\n        id: 60bf6091a1089\n        name: 新建项目\n        pageType: information:form:basic-form\n        description: 新建页213\n        to:\n          \"@\":\n            description: 无项目\n            instanceId: 60c5fea301b32\n          description: 新建页213\n          instanceId: 60bf6091a1089\n          module: []\n          name: 新建项目\n          pageType: information:form:basic-form\n        depth: -1\n        parentId:\n      - type: link\n        id: 60bf60a258613\n        name: 项目首页-路由管理\n        description: 路由管理\n        to:\n          description: 路由管理\n          instanceId: 60bf60a258613\n          module:\n            - instanceId: 60bf609b26889\n              name: Project\n          name: 项目首页-路由管理\n        depth: -1\n        parentId:\n      - type: link\n        id: 60c5f39a2c2e1\n        name: Launchpad 出厂配置\n        description: Launchpad 出厂配置\n        to:\n          description: Launchpad 出厂配置\n          instanceId: 60c5f39a2c2e1\n          module: []\n          name: Launchpad 出厂配置\n        depth: -1\n        parentId:\n  - name: edges\n    value:\n      - type: menu\n        source: 60bf6078b095f\n        target: 60bf60848d6d2\n      - type: menu\n        source: 60bf6078b095f\n        target: 60d533eba4ab2\n      - type: link\n        source: 60bf60848d6d2\n        target: 60bf6091a1089\n        description: 无项目\n      - type: link\n        source: 60bf60848d6d2\n        target: 60bf60a258613\n      - type: link\n        source: 60bf60848d6d2\n        target: 60c5f39a2c2e1\nchildren:\n  - brick: eo-diagram\n    properties:\n      layout: dagre\n      nodes: <%= CTX.nodes %>\n      edges: <%= CTX.edges %>\n      lines:\n        - edgeType: link\n          strokeColor: var(--theme-blue-color)\n          arrow: true\n          interactable: true\n          label:\n            useBrick:\n              brick: diagram.editable-label\n              properties:\n                label: <% DATA.edge.description %>\n                type: line\n              events:\n                label.change:\n                  if: <% (DATA.edge.description || \"\") !== (EVENT.detail || \"\") %>\n                  action: context.replace\n                  args:\n                    - edges\n                    - |-\n                      <%\n                        CTX.edges.map((edge) =>\n                          edge.source === DATA.edge.source &&\n                          edge.target === DATA.edge.target\n                            ? { ...edge, description: EVENT.detail }\n                            : edge\n                        )\n                      %>\n                label.editing.change:\n                  action: context.replace\n                  args:\n                    - editingLabelEdges\n                    - |-\n                      <%\n                        EVENT.detail\n                          ? CTX.editingLabelEdges.concat(\n                              `${DATA.edge.source}-:-${DATA.edge.target}`\n                            )\n                          : CTX.editingLabelEdges.filter(\n                              (id) =>\n                                id !== `${DATA.edge.source}-:-${DATA.edge.target}`\n                            )\n                      %>\n                click:\n                  action: context.replace\n                  args:\n                    - activeTarget\n                    - type: edge\n                      edge: <% DATA.edge %>\n        - edgeType: menu\n          strokeColor: var(--palette-gray-5)\n          arrow: true\n          interactable: true\n      layoutOptions:\n        nodePadding: [4, 10, 10]\n      activeTarget: <%= CTX.activeTarget %>\n      disableKeyboardAction: <%= CTX.editingLabelNodes.length > 0 || CTX.editingLabelEdges.length > 0 %>\n      connectNodes:\n        arrow: true\n        strokeColor: |-\n          <%\n            DATA.source.type === \"board\"\n              ? \"var(--palette-gray-5)\"\n              : \"var(--theme-blue-color)\"\n          %>\n      nodeBricks:\n        - useBrick:\n            brick: visual-builder.page-arch-node\n            properties:\n              label: <% DATA.node.name %>\n              type: <% DATA.node.type %>\n              autoFocusOnce: |\n                <% DATA.node.$temp ? DATA.node.id : undefined %>\n              active: <%= CTX.activeTarget?.type === \"node\" && CTX.activeTarget.nodeId === DATA.node.id %>\n            events:\n              click:\n                action: context.replace\n                args:\n                  - activeTarget\n                  - type: node\n                    nodeId: <% DATA.node.id %>\n              label.editing.change:\n                action: context.replace\n                args:\n                  - editingLabelNodes\n                  - |\n                    <%\n                      EVENT.detail\n                        ? CTX.editingLabelNodes.concat(DATA.node.id)\n                        : CTX.editingLabelNodes.filter(\n                            id => id !== DATA.node.id\n                          )\n                    %>\n              label.change:\n              - if: <% CTX.nodes.find(({id}) => id === DATA.node.id)?.$temp %>\n                action: context.replace\n                args:\n                args:\n                  - nodes\n                  - |\n                    <%\n                      CTX.nodes.map((node) => (\n                        node.id === DATA.node.id\n                          ? { ...node, $temp: false, name: EVENT.detail }\n                          : node\n                      ))\n                    %>\n                # Take reaction only if the label has been changed\n              - if: <% CTX.nodes.find(({id}) => id === DATA.node.id)?.name !== EVENT.detail %>\n                action: context.replace\n                args:\n                  - nodes\n                  - |\n                    <%\n                      CTX.nodes.map((node) => (\n                        node.id === DATA.node.id\n                          ? { ...node, name: EVENT.detail }\n                          : node\n                      ))\n                    %>\n              child.append:\n                - action: context.replace\n                  args:\n                    - tempNodeId\n                    - <% _.uniqueId('$temp-') %>\n                - action: context.replace\n                  args:\n                    - nodes\n                    - |\n                      <% CTX.nodes.concat({ id: CTX.tempNodeId, name: \"未命名\", $temp: true }) %>\n                - action: context.replace\n                  args:\n                    - edges\n                    - |\n                      <% CTX.edges.concat({ source: DATA.node.id, target: CTX.tempNodeId, name: \"未命名\", type: \"link\", $temp: true }) %>\n                - action: context.replace\n                  args:\n                    - activeTarget\n                    - type: node\n                      nodeId: <% CTX.tempNodeId %>\n    events:\n      activeTarget.change:\n        action: context.replace\n        args:\n          - activeTarget\n          - <% EVENT.detail %>\n      node.delete:\n        - action: context.replace\n          args:\n            - targetNode\n            - <% EVENT.detail %>\n        - useProvider: basic.show-dialog\n          args:\n          - type: delete\n            title: Delete Confirm\n            content: Please enter {{ expect }} to delete the node.\n            expect: <% EVENT.detail.name || \"未命名\" %>\n          callback:\n            success:\n            - action: context.replace\n              args:\n                - nodes\n                - |-\n                  <%\n                    CTX.nodes.filter(\n                      ({ id }) => id !== CTX.targetNode.id\n                    )\n                  %>\n            - action: context.replace\n              args:\n                - edges\n                - |-\n                  <%\n                    CTX.edges.filter(\n                      ({ source, target }) =>\n                        source !== CTX.targetNode.id &&\n                        target !== CTX.targetNode.id\n                    )\n                  %>\n      edge.delete:\n        action: context.replace\n        args:\n          - edges\n          - |-\n            <%\n              CTX.edges.filter(\n                ({ source, target }) =>\n                  source !== EVENT.detail.source ||\n                  target !== EVENT.detail.target\n              )\n            %>\n      line.click:\n        action: context.replace\n        args:\n          - activeTarget\n          - type: edge\n            edge: <% EVENT.detail.edge %>\n      line.dblclick:\n        target: _self\n        method: callOnLineLabel\n        args:\n          - <% EVENT.detail.id %>\n          - enableEditing\n      nodes.connect:\n        if: |-\n          <%\n            EVENT.detail.target.type !== \"board\" &&\n            !CTX.edges.some(\n              (edge) =>\n                edge.source === EVENT.detail.source.id &&\n                edge.target === EVENT.detail.target.id\n            )\n          %>\n        action: context.replace\n        args:\n          - edges\n          - |-\n            <%\n              CTX.edges.concat({\n                source: EVENT.detail.source.id,\n                target: EVENT.detail.target.id,\n                type:\n                  EVENT.detail.source.type === \"board\"\n                    ? \"menu\"\n                    : \"link\",\n              })\n            %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"position: fixed; height: 100vh; width: 100vw; top: 0px; left: 0px\">\n#   <eo-diagram layout=\"dagre\" disable-keyboard-action id=\"brick-1\"></eo-diagram>\n# </div>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.nodes = \"<%= CTX.nodes %>\";\n#   brick_1.edges = \"<%= CTX.edges %>\";\n#   brick_1.lines = [\n#     {\n#       edgeType: \"link\",\n#       strokeColor: \"var(--theme-blue-color)\",\n#       arrow: true,\n#       interactable: true,\n#       label: {\n#         useBrick: {\n#           brick: \"diagram.editable-label\",\n#           properties: {\n#             label: \"<% DATA.edge.description %>\",\n#             type: \"line\",\n#           },\n#           events: {\n#             \"label.change\": {\n#               if: '<% (DATA.edge.description || \"\") !== (EVENT.detail || \"\") %>',\n#               action: \"context.replace\",\n#               args: [\n#                 \"edges\",\n#                 \"<%\\n  CTX.edges.map((edge) =>\\n    edge.source === DATA.edge.source &&\\n    edge.target === DATA.edge.target\\n      ? { ...edge, description: EVENT.detail }\\n      : edge\\n  )\\n%>\",\n#               ],\n#             },\n#             \"label.editing.change\": {\n#               action: \"context.replace\",\n#               args: [\n#                 \"editingLabelEdges\",\n#                 \"<%\\n  EVENT.detail\\n    ? CTX.editingLabelEdges.concat(\\n        `${DATA.edge.source}-:-${DATA.edge.target}`\\n      )\\n    : CTX.editingLabelEdges.filter(\\n        (id) =>\\n          id !== `${DATA.edge.source}-:-${DATA.edge.target}`\\n      )\\n%>\",\n#               ],\n#             },\n#             click: {\n#               action: \"context.replace\",\n#               args: [\n#                 \"activeTarget\",\n#                 {\n#                   type: \"edge\",\n#                   edge: \"<% DATA.edge %>\",\n#                 },\n#               ],\n#             },\n#           },\n#         },\n#       },\n#     },\n#     {\n#       edgeType: \"menu\",\n#       strokeColor: \"var(--palette-gray-5)\",\n#       arrow: true,\n#       interactable: true,\n#     },\n#   ];\n#   brick_1.layoutOptions = {\n#     nodePadding: [4, 10, 10],\n#   };\n#   brick_1.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_1.connectNodes = {\n#     arrow: true,\n#     strokeColor:\n#       '<%\\n  DATA.source.type === \"board\"\\n    ? \"var(--palette-gray-5)\"\\n    : \"var(--theme-blue-color)\"\\n%>',\n#   };\n#   brick_1.nodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"visual-builder.page-arch-node\",\n#         properties: {\n#           label: \"<% DATA.node.name %>\",\n#           type: \"<% DATA.node.type %>\",\n#           autoFocusOnce: \"<% DATA.node.$temp ? DATA.node.id : undefined %>\\n\",\n#           active:\n#             '<%= CTX.activeTarget?.type === \"node\" && CTX.activeTarget.nodeId === DATA.node.id %>',\n#         },\n#         events: {\n#           click: {\n#             action: \"context.replace\",\n#             args: [\n#               \"activeTarget\",\n#               {\n#                 type: \"node\",\n#                 nodeId: \"<% DATA.node.id %>\",\n#               },\n#             ],\n#           },\n#           \"label.editing.change\": {\n#             action: \"context.replace\",\n#             args: [\n#               \"editingLabelNodes\",\n#               \"<%\\n  EVENT.detail\\n    ? CTX.editingLabelNodes.concat(DATA.node.id)\\n    : CTX.editingLabelNodes.filter(\\n        id => id !== DATA.node.id\\n      )\\n%>\\n\",\n#             ],\n#           },\n#           \"label.change\": [\n#             {\n#               if: \"<% CTX.nodes.find(({id}) => id === DATA.node.id)?.$temp %>\",\n#               action: \"context.replace\",\n#               args: [\n#                 \"nodes\",\n#                 \"<%\\n  CTX.nodes.map((node) => (\\n    node.id === DATA.node.id\\n      ? { ...node, $temp: false, name: EVENT.detail }\\n      : node\\n  ))\\n%>\\n\",\n#               ],\n#             },\n#             {\n#               if: \"<% CTX.nodes.find(({id}) => id === DATA.node.id)?.name !== EVENT.detail %>\",\n#               action: \"context.replace\",\n#               args: [\n#                 \"nodes\",\n#                 \"<%\\n  CTX.nodes.map((node) => (\\n    node.id === DATA.node.id\\n      ? { ...node, name: EVENT.detail }\\n      : node\\n  ))\\n%>\\n\",\n#               ],\n#             },\n#           ],\n#           \"child.append\": [\n#             {\n#               action: \"context.replace\",\n#               args: [\"tempNodeId\", \"<% _.uniqueId('$temp-') %>\"],\n#             },\n#             {\n#               action: \"context.replace\",\n#               args: [\n#                 \"nodes\",\n#                 '<% CTX.nodes.concat({ id: CTX.tempNodeId, name: \"未命名\", $temp: true }) %>\\n',\n#               ],\n#             },\n#             {\n#               action: \"context.replace\",\n#               args: [\n#                 \"edges\",\n#                 '<% CTX.edges.concat({ source: DATA.node.id, target: CTX.tempNodeId, name: \"未命名\", type: \"link\", $temp: true }) %>\\n',\n#               ],\n#             },\n#             {\n#               action: \"context.replace\",\n#               args: [\n#                 \"activeTarget\",\n#                 {\n#                   type: \"node\",\n#                   nodeId: \"<% CTX.tempNodeId %>\",\n#                 },\n#               ],\n#             },\n#           ],\n#         },\n#       },\n#     },\n#   ];\n#   brick_1.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"node.delete\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"node.delete\", (e) => {\n#     const provider = document.createElement(\"basic.show-dialog\");\n#     const promise = Promise.resolve(\n#       provider.resolve({\n#         type: \"delete\",\n#         title: \"Delete Confirm\",\n#         content: \"Please enter {{ expect }} to delete the node.\",\n#         expect: '<% EVENT.detail.name || \"未命名\" %>',\n#       })\n#     );\n#     promise.then((r) => {\n#       // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#     });\n#     promise.then((r) => {\n#       // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#     });\n#   });\n#   brick_1.addEventListener(\"edge.delete\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"line.click\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"line.dblclick\", (e) => {\n#     const brick = e.target;\n#     brick.callOnLineLabel(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<% EVENT.detail.id %>\",\n#       \"enableEditing\"\n#     );\n#   });\n#   brick_1.addEventListener(\"nodes.connect\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# </script>\n# \n```\n\n### Force\n\n```yaml preview minHeight=\"600px\"\nbrick: div\nproperties:\n  style:\n    position: fixed\n    height: 100vh\n    width: 100vw\n    top: 0px\n    left: 0px\ncontext:\n  - name: activeTarget\n    value: null\n  - name: nodes\n    value:\n      - id: 产品评价\n      - id: 产品线\n      - id: 用户角色\n      - id: 模型视图\n      - id: 产品\n      - id: 业务场景\n      - id: 业务规则\n      - id: 模型\n      - id: 产品模块\n      - id: 产品价值点\n      - id: 工作流\n      - id: 测试用例\n      - id: 功能点\n      # - id: 其他\n  - name: edges\n    value:\n      - source: 产品\n        target: 产品评价\n        sourceName: 评价列表\n        targetName: 所属产品\n        sourceConstraints:\n          required: true\n        targetConstraints:\n          multiple: true\n      - source: 产品\n        target: 产品线\n        sourceName: 所属产品线\n        targetName: 产品列表\n        sourceConstraints:\n          multiple: true\n        targetConstraints:\n          required: true\n      - source: 产品\n        target: 用户角色\n        sourceName: 负责人\n        targetName: 负责的产品\n        sourceConstraints:\n          multiple: true\n        targetConstraints:\n          multiple: true\n      - source: 产品\n        target: 模型视图\n        sourceName: 模型视图列表\n        targetName: 所属产品\n        sourceConstraints:\n          required: true\n        targetConstraints:\n          multiple: true\n      - source: 产品\n        target: 业务场景\n        sourceName: 业务场景列表\n        targetName: 所属产品\n        sourceConstraints:\n          required: true\n        targetConstraints:\n          multiple: true\n      - source: 业务场景\n        target: 业务场景\n      - source: 业务场景\n        target: 业务规则\n        sourceName: 业务规则列表\n        targetName: 所属业务场景\n        sourceConstraints:\n          required: true\n        targetConstraints:\n          multiple: true\n      - source: 业务场景\n        target: 用户角色\n        sourceName: 负责人\n        targetName: 负责的业务场景\n        sourceConstraints:\n          multiple: true\n        targetConstraints:\n          multiple: true\n      - source: 产品\n        target: 模型\n        sourceName: 模型列表\n        targetName: 关联的产品\n        sourceConstraints:\n          required: true\n        targetConstraints:\n          multiple: true\n      - source: 产品\n        target: 产品模块\n        sourceName: 模块列表\n        targetName: 所属产品\n        sourceConstraints:\n          required: true\n        targetConstraints:\n          multiple: true\n      - source: 产品\n        target: 产品价值点\n        sourceName: 价值点列表\n        targetName: 所属产品\n        sourceConstraints:\n          required: true\n        targetConstraints:\n          multiple: true\n      - source: 业务场景\n        target: 产品价值点\n        sourceName: 价值点列表\n        targetName: 关联的业务场景\n      - source: 业务场景\n        target: 工作流\n      - source: 业务规则\n        target: 工作流\n      - source: 产品模块\n        target: 产品模块\n      - source: 产品模块\n        target: 测试用例\n        sourceName: 测试用例列表\n        targetName: 所属产品模块\n        sourceConstraints:\n          multiple: true\n        targetConstraints:\n          multiple: true\n      - source: 产品模块\n        target: 功能点\n        sourceName: 功能点列表\n        targetName: 所属产品模块\n        sourceConstraints:\n          required: true\n        targetConstraints:\n          multiple: true\n      - source: 测试用例\n        target: 功能点\n        sourceName: 关联的功能点\n        targetName: 关联的测试用例\n        sourceConstraints:\n          multiple: true\n        targetConstraints:\n          multiple: true\n      # - source: 产品线\n      #   target: 模型视图\nchildren:\n  - brick: eo-diagram\n    properties:\n      layout: force\n      dragNodes: {}\n      nodes: <%= CTX.nodes %>\n      edges: <%= CTX.edges %>\n      activeTarget: <%= CTX.activeTarget %>\n      layoutOptions:\n        # nodePadding: 5\n        dummyNodesOnEdges: 1\n        collide:\n          dummyRadius: 10\n          radiusDiff: 40\n        # rankdir: LR\n        # acyclicer: greedy\n        # align: DL\n      lines:\n        - label:\n            - useBrick:\n                brick: span\n                properties:\n                  hidden: <%= CTX.activeTarget?.type !== \"node\" || (DATA.edge.source !== CTX.activeTarget.nodeId && DATA.edge.target !== CTX.activeTarget.nodeId) %>\n                  textContent: |\n                    <%= DATA.edge.source === CTX.activeTarget?.nodeId ? DATA.edge.sourceName : DATA.edge.target === CTX.activeTarget?.nodeId ? DATA.edge.targetName : \"\" %>\n                  style:\n                    color: var(--palette-gray-6)\n          overrides:\n            activeRelated:\n              strokeColor: var(--palette-blue-4)\n      nodeBricks:\n        - useBrick:\n            # if: <% DATA.node.id !== \"kbacon\" %>\n            brick: div\n            properties:\n              style: |\n                <%=\n                  {\n                    width: \"160px\",\n                    height: \"50px\",\n                    background: \"var(--palette-green-1)\",\n                    border: \"1px solid var(--palette-gray-4)\",\n                    borderRadius: \"8px\",\n                    display: \"flex\",\n                    alignItems: \"center\",\n                    justifyContent: \"center\",\n                    outline: CTX.activeTarget?.type === \"node\" && DATA.node.id === CTX.activeTarget.nodeId ? \"2px solid orange\" : \"none\",\n                    outlineOffset: \"2px\",\n                    cursor: \"pointer\",\n                    userSelect: \"none\",\n                  }\n                %>\n            children:\n              - brick: span\n                properties:\n                  textContent: <% DATA.node.id %>\n            events:\n              click:\n                action: context.replace\n                args:\n                  - activeTarget\n                  - type: node\n                    nodeId: <% DATA.node.id %>\n    events:\n      activeTarget.change:\n        action: context.replace\n        args:\n          - activeTarget\n          - <% EVENT.detail %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"position: fixed; height: 100vh; width: 100vw; top: 0px; left: 0px\">\n#   <eo-diagram layout=\"force\" id=\"brick-1\"></eo-diagram>\n# </div>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.dragNodes = {};\n#   brick_1.nodes = \"<%= CTX.nodes %>\";\n#   brick_1.edges = \"<%= CTX.edges %>\";\n#   brick_1.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_1.layoutOptions = {\n#     dummyNodesOnEdges: 1,\n#     collide: {\n#       dummyRadius: 10,\n#       radiusDiff: 40,\n#     },\n#   };\n#   brick_1.lines = [\n#     {\n#       label: [\n#         {\n#           useBrick: {\n#             brick: \"span\",\n#             properties: {\n#               hidden:\n#                 '<%= CTX.activeTarget?.type !== \"node\" || (DATA.edge.source !== CTX.activeTarget.nodeId && DATA.edge.target !== CTX.activeTarget.nodeId) %>',\n#               textContent:\n#                 '<%= DATA.edge.source === CTX.activeTarget?.nodeId ? DATA.edge.sourceName : DATA.edge.target === CTX.activeTarget?.nodeId ? DATA.edge.targetName : \"\" %>\\n',\n#               style: {\n#                 color: \"var(--palette-gray-6)\",\n#               },\n#             },\n#           },\n#         },\n#       ],\n#       overrides: {\n#         activeRelated: {\n#           strokeColor: \"var(--palette-blue-4)\",\n#         },\n#       },\n#     },\n#   ];\n#   brick_1.nodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"div\",\n#         properties: {\n#           style:\n#             '<%=\\n  {\\n    width: \"160px\",\\n    height: \"50px\",\\n    background: \"var(--palette-green-1)\",\\n    border: \"1px solid var(--palette-gray-4)\",\\n    borderRadius: \"8px\",\\n    display: \"flex\",\\n    alignItems: \"center\",\\n    justifyContent: \"center\",\\n    outline: CTX.activeTarget?.type === \"node\" && DATA.node.id === CTX.activeTarget.nodeId ? \"2px solid orange\" : \"none\",\\n    outlineOffset: \"2px\",\\n    cursor: \"pointer\",\\n    userSelect: \"none\",\\n  }\\n%>\\n',\n#         },\n#         children: [\n#           {\n#             brick: \"span\",\n#             properties: {\n#               textContent: \"<% DATA.node.id %>\",\n#             },\n#           },\n#         ],\n#         events: {\n#           click: {\n#             action: \"context.replace\",\n#             args: [\n#               \"activeTarget\",\n#               {\n#                 type: \"node\",\n#                 nodeId: \"<% DATA.node.id %>\",\n#               },\n#             ],\n#           },\n#         },\n#       },\n#     },\n#   ];\n#   brick_1.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# </script>\n# \n```\n"
   },
   "eo-display-canvas": {
-    "doc": "用于展示查看的画布构件。\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"600px\"\n- brick: div\n  properties:\n    style:\n      display: flex\n      height: 600px\n      gap: 1em\n  context:\n    - name: initialCells\n      value: |\n        <%\n          [\n            {\n              type: \"decorator\",\n              id: \"area-1\",\n              decorator: \"area\",\n              view: {\n                x: 10,\n                y: 20,\n                width: 400,\n                height: 300,\n              },\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Y\",\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Z\",\n              data: {\n                virtual: true,\n              }\n            },\n          ].concat(\n            [\"X\", \"Y\", \"Z\", \"W\"].map((id) => ({\n              type: \"node\",\n              id,\n              data: {\n                name: `Node ${id}`,\n              },\n              view: {\n                x: Math.round(\n                  id === \"X\"\n                    ? 200 + Math.random() * 200\n                    : id === \"Y\"\n                    ? Math.random() * 300\n                    : 300 + Math.random() * 300\n                ),\n                y: (id === \"X\" ? 0 : 300) + Math.round((Math.random() * 200)),\n                width: 60,\n                height: 60,\n              }\n            }))\n          ).concat([\n            {\n              type: \"decorator\",\n              id: \"text-1\",\n              decorator: \"text\",\n              view: {\n                x: 100,\n                y: 120,\n                width: 100,\n                height: 20,\n                text: \"Hello!\"\n              },\n            },\n          ])\n        %>\n    - name: activeTarget\n    - name: targetCell\n  children:\n    - brick: div\n      properties:\n        style:\n          flex: 1\n          minWidth: 0\n      children:\n        - brick: eo-display-canvas\n          properties:\n            style:\n              width: 100%\n              height: 100%\n            activeTarget: <%= CTX.activeTarget %>\n            fadeUnrelatedCells: true\n            # Initial nodes only\n            defaultNodeSize: [60, 60]\n            defaultNodeBricks:\n              - useBrick:\n                  brick: diagram.experimental-node\n                  properties:\n                    textContent: <% `Node ${DATA.node.id}` %>\n                    status: |\n                      <%=\n                        CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\n                          ? \"highlighted\"\n                          // : CTX.unrelated.some(n =>\n                          //     n.type === \"node\" && n.id === DATA.node.id\n                          //   )\n                          // ? \"faded\"\n                          : \"default\"\n                      %>\n            defaultEdgeLines:\n              - if: <% DATA.edge.data?.virtual %>\n                dashed: true\n            cells: <% CTX.initialCells %>\n          events:\n            activeTarget.change:\n              action: context.replace\n              args:\n                - activeTarget\n                - <% EVENT.detail %>\n            cell.contextmenu:\n              - target: eo-context-menu\n                method: open\n                args:\n                  - position:\n                      - <% EVENT.detail.clientX %>\n                      - <% EVENT.detail.clientY %>\n              - action: context.replace\n                args:\n                  - targetCell\n                  - <% EVENT.detail.cell %>\n            scale.change:\n              action: context.replace\n              args:\n                - scale\n                - <% EVENT.detail %>\n- brick: eo-context-menu\n  properties:\n    actions: |\n      <%=\n        [\n          {\n            text: `Test ${CTX.targetCell?.type}`,\n            event: `test-${CTX.targetCell?.type}`,\n          }\n        ]\n      %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: flex; height: 600px; gap: 1em\">\n#   <div style=\"flex: 1; min-width: 0\">\n#     <eo-display-canvas\n#       style=\"width: 100%; height: 100%\"\n#       fade-unrelated-cells\n#       id=\"brick-1\"\n#     ></eo-display-canvas>\n#   </div>\n# </div>\n# <eo-context-menu\n#   actions=\"&lt;%=\n#   [\n#     {\n#       text: `Test ${CTX.targetCell?.type}`,\n#       event: `test-${CTX.targetCell?.type}`,\n#     }\n#   ]\n# %&gt;\n# \"\n# ></eo-context-menu>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_1.defaultNodeSize = [60, 60];\n#   brick_1.defaultNodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"diagram.experimental-node\",\n#         properties: {\n#           textContent: \"<% `Node ${DATA.node.id}` %>\",\n#           status:\n#             '<%=\\n  CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\\n    ? \"highlighted\"\\n    // : CTX.unrelated.some(n =>\\n    //     n.type === \"node\" && n.id === DATA.node.id\\n    //   )\\n    // ? \"faded\"\\n    : \"default\"\\n%>\\n',\n#         },\n#       },\n#     },\n#   ];\n#   brick_1.defaultEdgeLines = [\n#     {\n#       if: \"<% DATA.edge.data?.virtual %>\",\n#       dashed: true,\n#     },\n#   ];\n#   brick_1.cells = \"<% CTX.initialCells %>\";\n#   brick_1.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"cell.contextmenu\", (e) => {\n#     const brick = document.querySelector(\"eo-context-menu\");\n#     brick.open({\n#       position: [\"<% EVENT.detail.clientX %>\", \"<% EVENT.detail.clientY %>\"],\n#     });\n#   });\n#   brick_1.addEventListener(\"cell.contextmenu\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"scale.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# </script>\n# \n```\n"
+    "doc": "用于展示查看的画布构件。\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"600px\"\n- brick: div\n  properties:\n    style:\n      display: flex\n      height: 600px\n      gap: 1em\n  context:\n    - name: initialCells\n      value: |\n        <%\n          [\n            {\n              type: \"decorator\",\n              id: \"area-1\",\n              decorator: \"area\",\n              view: {\n                x: 10,\n                y: 20,\n                width: 400,\n                height: 300,\n              },\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Y\",\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Z\",\n              data: {\n                virtual: true,\n              }\n            },\n          ].concat(\n            [\"X\", \"Y\", \"Z\", \"W\"].map((id) => ({\n              type: \"node\",\n              id,\n              data: {\n                name: `Node ${id}`,\n              },\n              view: {\n                x: Math.round(\n                  id === \"X\"\n                    ? 200 + Math.random() * 200\n                    : id === \"Y\"\n                    ? Math.random() * 300\n                    : 300 + Math.random() * 300\n                ),\n                y: (id === \"X\" ? 0 : 300) + Math.round((Math.random() * 200)),\n                width: 60,\n                height: 60,\n              }\n            }))\n          ).concat([\n            {\n              type: \"decorator\",\n              id: \"text-1\",\n              decorator: \"text\",\n              view: {\n                x: 100,\n                y: 120,\n                width: 100,\n                height: 20,\n                text: \"Hello!\"\n              },\n            },\n          ])\n        %>\n    - name: activeTarget\n    - name: targetCell\n  children:\n    - brick: div\n      properties:\n        style:\n          flex: 1\n          minWidth: 0\n      children:\n        - brick: eo-display-canvas\n          properties:\n            style:\n              width: 100%\n              height: 100%\n            activeTarget: <%= CTX.activeTarget %>\n            fadeUnrelatedCells: true\n            # Initial nodes only\n            defaultNodeSize: [60, 60]\n            defaultNodeBricks:\n              - useBrick:\n                  brick: diagram.experimental-node\n                  properties:\n                    textContent: <% `Node ${DATA.node.id}` %>\n                    status: |\n                      <%=\n                        CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\n                          ? \"highlighted\"\n                          // : CTX.unrelated.some(n =>\n                          //     n.type === \"node\" && n.id === DATA.node.id\n                          //   )\n                          // ? \"faded\"\n                          : \"default\"\n                      %>\n            defaultEdgeLines:\n              - if: <% DATA.edge.data?.virtual %>\n                dashed: true\n            cells: <% CTX.initialCells %>\n          events:\n            activeTarget.change:\n              action: context.replace\n              args:\n                - activeTarget\n                - <% EVENT.detail %>\n            cell.contextmenu:\n              - target: eo-context-menu\n                method: open\n                args:\n                  - position:\n                      - <% EVENT.detail.clientX %>\n                      - <% EVENT.detail.clientY %>\n              - action: context.replace\n                args:\n                  - targetCell\n                  - <% EVENT.detail.cell %>\n            scale.change:\n              action: context.replace\n              args:\n                - scale\n                - <% EVENT.detail %>\n- brick: eo-context-menu\n  properties:\n    actions: |\n      <%=\n        [\n          {\n            text: `Test ${CTX.targetCell?.type}`,\n            event: `test-${CTX.targetCell?.type}`,\n          }\n        ]\n      %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: flex; height: 600px; gap: 1em\">\n#   <div style=\"flex: 1; min-width: 0\">\n#     <eo-display-canvas\n#       style=\"width: 100%; height: 100%\"\n#       fade-unrelated-cells\n#       id=\"brick-1\"\n#     ></eo-display-canvas>\n#   </div>\n# </div>\n# <eo-context-menu\n#   actions=\"&lt;%=\n#   [\n#     {\n#       text: `Test ${CTX.targetCell?.type}`,\n#       event: `test-${CTX.targetCell?.type}`,\n#     }\n#   ]\n# %&gt;\n# \"\n# ></eo-context-menu>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_1.defaultNodeSize = [60, 60];\n#   brick_1.defaultNodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"diagram.experimental-node\",\n#         properties: {\n#           textContent: \"<% `Node ${DATA.node.id}` %>\",\n#           status:\n#             '<%=\\n  CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\\n    ? \"highlighted\"\\n    // : CTX.unrelated.some(n =>\\n    //     n.type === \"node\" && n.id === DATA.node.id\\n    //   )\\n    // ? \"faded\"\\n    : \"default\"\\n%>\\n',\n#         },\n#       },\n#     },\n#   ];\n#   brick_1.defaultEdgeLines = [\n#     {\n#       if: \"<% DATA.edge.data?.virtual %>\",\n#       dashed: true,\n#     },\n#   ];\n#   brick_1.cells = \"<% CTX.initialCells %>\";\n#   brick_1.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"cell.contextmenu\", (e) => {\n#     const brick = document.querySelector(\"eo-context-menu\");\n#     brick.open({\n#       position: [\"<% EVENT.detail.clientX %>\", \"<% EVENT.detail.clientY %>\"],\n#     });\n#   });\n#   brick_1.addEventListener(\"cell.contextmenu\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"scale.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# </script>\n# \n```\n\n### Force layout\n\n```yaml preview minHeight=\"600px\"\n- brick: div\n  properties:\n    style:\n      display: flex\n      height: 600px\n      gap: 1em\n  context:\n    - name: initialCells\n      value: |\n        <%\n          [\n            {\n              type: \"decorator\",\n              id: \"area-1\",\n              decorator: \"area\",\n              view: {\n                x: 10,\n                y: 20,\n                width: 400,\n                height: 300,\n              },\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Y\",\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Z\",\n              data: {\n                virtual: true,\n              }\n            },\n          ].concat(\n            [\"X\", \"Y\", \"Z\", \"W\"].map((id) => ({\n              type: \"node\",\n              id,\n              data: {\n                name: `Node ${id}`,\n              },\n              view: {\n                width: 60,\n                height: 60,\n              }\n            }))\n          ).concat([\n            {\n              type: \"decorator\",\n              id: \"text-1\",\n              decorator: \"text\",\n              view: {\n                x: 100,\n                y: 120,\n                width: 100,\n                height: 20,\n                text: \"Hello!\"\n              },\n            },\n          ])\n        %>\n    - name: activeTarget\n    - name: targetCell\n  children:\n    - brick: div\n      properties:\n        style:\n          flex: 1\n          minWidth: 0\n      children:\n        - brick: eo-display-canvas\n          properties:\n            style:\n              width: 100%\n              height: 100%\n            activeTarget: <%= CTX.activeTarget %>\n            fadeUnrelatedCells: true\n            layout: force\n            # Initial nodes only\n            defaultNodeSize: [60, 60]\n            defaultNodeBricks:\n              - useBrick:\n                  brick: diagram.experimental-node\n                  properties:\n                    textContent: <% `Node ${DATA.node.id}` %>\n                    status: |\n                      <%=\n                        CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\n                          ? \"highlighted\"\n                          // : CTX.unrelated.some(n =>\n                          //     n.type === \"node\" && n.id === DATA.node.id\n                          //   )\n                          // ? \"faded\"\n                          : \"default\"\n                      %>\n            defaultEdgeLines:\n              - if: <% DATA.edge.data?.virtual %>\n                dashed: true\n            cells: <% CTX.initialCells %>\n          events:\n            activeTarget.change:\n              action: context.replace\n              args:\n                - activeTarget\n                - <% EVENT.detail %>\n            cell.contextmenu:\n              - target: eo-context-menu\n                method: open\n                args:\n                  - position:\n                      - <% EVENT.detail.clientX %>\n                      - <% EVENT.detail.clientY %>\n              - action: context.replace\n                args:\n                  - targetCell\n                  - <% EVENT.detail.cell %>\n            scale.change:\n              action: context.replace\n              args:\n                - scale\n                - <% EVENT.detail %>\n- brick: eo-context-menu\n  properties:\n    actions: |\n      <%=\n        [\n          {\n            text: `Test ${CTX.targetCell?.type}`,\n            event: `test-${CTX.targetCell?.type}`,\n          }\n        ]\n      %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: flex; height: 600px; gap: 1em\">\n#   <div style=\"flex: 1; min-width: 0\">\n#     <eo-display-canvas\n#       style=\"width: 100%; height: 100%\"\n#       fade-unrelated-cells\n#       layout=\"force\"\n#       id=\"brick-1\"\n#     ></eo-display-canvas>\n#   </div>\n# </div>\n# <eo-context-menu\n#   actions=\"&lt;%=\n#   [\n#     {\n#       text: `Test ${CTX.targetCell?.type}`,\n#       event: `test-${CTX.targetCell?.type}`,\n#     }\n#   ]\n# %&gt;\n# \"\n# ></eo-context-menu>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_1.defaultNodeSize = [60, 60];\n#   brick_1.defaultNodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"diagram.experimental-node\",\n#         properties: {\n#           textContent: \"<% `Node ${DATA.node.id}` %>\",\n#           status:\n#             '<%=\\n  CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\\n    ? \"highlighted\"\\n    // : CTX.unrelated.some(n =>\\n    //     n.type === \"node\" && n.id === DATA.node.id\\n    //   )\\n    // ? \"faded\"\\n    : \"default\"\\n%>\\n',\n#         },\n#       },\n#     },\n#   ];\n#   brick_1.defaultEdgeLines = [\n#     {\n#       if: \"<% DATA.edge.data?.virtual %>\",\n#       dashed: true,\n#     },\n#   ];\n#   brick_1.cells = \"<% CTX.initialCells %>\";\n#   brick_1.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"cell.contextmenu\", (e) => {\n#     const brick = document.querySelector(\"eo-context-menu\");\n#     brick.open({\n#       position: [\"<% EVENT.detail.clientX %>\", \"<% EVENT.detail.clientY %>\"],\n#     });\n#   });\n#   brick_1.addEventListener(\"cell.contextmenu\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"scale.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# </script>\n# \n```\n\n### Dagre layout\n\n```yaml preview minHeight=\"600px\"\n- brick: div\n  properties:\n    style:\n      display: flex\n      height: 600px\n      gap: 1em\n  context:\n    - name: initialCells\n      value: |\n        <%\n          [\n            {\n              type: \"decorator\",\n              id: \"area-1\",\n              decorator: \"area\",\n              view: {\n                x: 10,\n                y: 20,\n                width: 400,\n                height: 300,\n              },\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Y\",\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Z\",\n              data: {\n                virtual: true,\n              }\n            },\n          ].concat(\n            [\"X\", \"Y\", \"Z\", \"W\"].map((id) => ({\n              type: \"node\",\n              id,\n              data: {\n                name: `Node ${id}`,\n              },\n              view: {\n                width: 60,\n                height: 60,\n              }\n            }))\n          ).concat([\n            {\n              type: \"decorator\",\n              id: \"text-1\",\n              decorator: \"text\",\n              view: {\n                x: 100,\n                y: 120,\n                width: 100,\n                height: 20,\n                text: \"Hello!\"\n              },\n            },\n          ])\n        %>\n    - name: activeTarget\n    - name: targetCell\n  children:\n    - brick: div\n      properties:\n        style:\n          flex: 1\n          minWidth: 0\n      children:\n        - brick: eo-display-canvas\n          properties:\n            style:\n              width: 100%\n              height: 100%\n            activeTarget: <%= CTX.activeTarget %>\n            fadeUnrelatedCells: true\n            layout: dagre\n            # Initial nodes only\n            defaultNodeSize: [60, 60]\n            defaultNodeBricks:\n              - useBrick:\n                  brick: diagram.experimental-node\n                  properties:\n                    textContent: <% `Node ${DATA.node.id}` %>\n                    status: |\n                      <%=\n                        CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\n                          ? \"highlighted\"\n                          // : CTX.unrelated.some(n =>\n                          //     n.type === \"node\" && n.id === DATA.node.id\n                          //   )\n                          // ? \"faded\"\n                          : \"default\"\n                      %>\n            defaultEdgeLines:\n              - if: <% DATA.edge.data?.virtual %>\n                dashed: true\n            cells: <% CTX.initialCells %>\n          events:\n            activeTarget.change:\n              action: context.replace\n              args:\n                - activeTarget\n                - <% EVENT.detail %>\n            cell.contextmenu:\n              - target: eo-context-menu\n                method: open\n                args:\n                  - position:\n                      - <% EVENT.detail.clientX %>\n                      - <% EVENT.detail.clientY %>\n              - action: context.replace\n                args:\n                  - targetCell\n                  - <% EVENT.detail.cell %>\n            scale.change:\n              action: context.replace\n              args:\n                - scale\n                - <% EVENT.detail %>\n- brick: eo-context-menu\n  properties:\n    actions: |\n      <%=\n        [\n          {\n            text: `Test ${CTX.targetCell?.type}`,\n            event: `test-${CTX.targetCell?.type}`,\n          }\n        ]\n      %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: flex; height: 600px; gap: 1em\">\n#   <div style=\"flex: 1; min-width: 0\">\n#     <eo-display-canvas\n#       style=\"width: 100%; height: 100%\"\n#       fade-unrelated-cells\n#       layout=\"dagre\"\n#       id=\"brick-1\"\n#     ></eo-display-canvas>\n#   </div>\n# </div>\n# <eo-context-menu\n#   actions=\"&lt;%=\n#   [\n#     {\n#       text: `Test ${CTX.targetCell?.type}`,\n#       event: `test-${CTX.targetCell?.type}`,\n#     }\n#   ]\n# %&gt;\n# \"\n# ></eo-context-menu>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_1.defaultNodeSize = [60, 60];\n#   brick_1.defaultNodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"diagram.experimental-node\",\n#         properties: {\n#           textContent: \"<% `Node ${DATA.node.id}` %>\",\n#           status:\n#             '<%=\\n  CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\\n    ? \"highlighted\"\\n    // : CTX.unrelated.some(n =>\\n    //     n.type === \"node\" && n.id === DATA.node.id\\n    //   )\\n    // ? \"faded\"\\n    : \"default\"\\n%>\\n',\n#         },\n#       },\n#     },\n#   ];\n#   brick_1.defaultEdgeLines = [\n#     {\n#       if: \"<% DATA.edge.data?.virtual %>\",\n#       dashed: true,\n#     },\n#   ];\n#   brick_1.cells = \"<% CTX.initialCells %>\";\n#   brick_1.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"cell.contextmenu\", (e) => {\n#     const brick = document.querySelector(\"eo-context-menu\");\n#     brick.open({\n#       position: [\"<% EVENT.detail.clientX %>\", \"<% EVENT.detail.clientY %>\"],\n#     });\n#   });\n#   brick_1.addEventListener(\"cell.contextmenu\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"scale.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# </script>\n# \n```\n"
   },
   "diagram.editable-label": {
     "doc": "构件 `diagram.editable-label`\n\n## Examples\n\n### Basic\n\n```yaml preview\nbrick: diagram.editable-label\nproperties:\n  type: line\n  label: Relation\nevents:\n  label.change:\n    action: message.success\n    args:\n      - \"<% `Label changed to: ${EVENT.detail}` %>\"\n# -- YAML DELIMITER (1nbbm8) --\n# <diagram.editable-label\n#   type=\"line\"\n#   label=\"Relation\"\n#   id=\"brick-1\"\n# ></diagram.editable-label>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"label.change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"success\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% `Label changed to: ${EVENT.detail}` %>\",\n#     });\n#   });\n# </script>\n# \n```\n"
   },
   "eo-draw-canvas": {
-    "doc": "用于手工绘图的画布。\n\n注意：将配套另外一个用于展示的画布构件。\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"600px\"\n- brick: div\n  properties:\n    style:\n      display: flex\n      height: 600px\n      gap: 1em\n  context:\n    - name: initialCells\n      value: |\n        <%\n          [\n            {\n              type: \"decorator\",\n              id: \"area-1\",\n              decorator: \"area\",\n              view: {\n                x: 10,\n                y: 20,\n                width: 400,\n                height: 300,\n              },\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Y\",\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Z\",\n              data: {\n                virtual: true,\n              }\n            },\n          ].concat(\n            [\"X\", \"Y\", \"Z\", \"W\"].map((id) => ({\n              type: \"node\",\n              id,\n              data: {\n                name: `Node ${id}`,\n              },\n              view: {\n                x: Math.round(\n                  id === \"X\"\n                    ? 200 + Math.random() * 200\n                    : id === \"Y\"\n                    ? Math.random() * 300\n                    : 300 + Math.random() * 300\n                ),\n                y: (id === \"X\" ? 0 : 300) + Math.round((Math.random() * 200)),\n                width: 60,\n                height: 60,\n              }\n            }))\n          ).concat([\n            {\n              type: \"decorator\",\n              id: \"text-1\",\n              decorator: \"text\",\n              view: {\n                x: 100,\n                y: 120,\n                width: 100,\n                height: 20,\n                text: \"Hello!\"\n              },\n            },\n          ])\n        %>\n    - name: dragging\n    - name: activeTarget\n    - name: targetCell\n    - name: scale\n      value: 1\n  children:\n    - brick: div\n      properties:\n        style:\n          width: 180px\n          display: flex\n          flexDirection: column\n          gap: 1em\n      children:\n        - brick: eo-button\n          properties:\n            textContent: Add random nodes\n          events:\n            click:\n              target: eo-draw-canvas\n              method: addNodes\n              args:\n                - |\n                  <%\n                    ((...seeds) => seeds.map((seed) => ({\n                      id: seed,\n                      data: {\n                        name: String(seed),\n                      },\n                    })))(\n                      Math.round(Math.random() * 1e6),\n                      Math.round(Math.random() * 1e6),\n                      Math.round(Math.random() * 1e6),\n                    )\n                  %>\n              callback:\n                success:\n                  action: console.log\n                  args:\n                    - Added nodes\n                    - <% EVENT.detail %>\n        - brick: eo-button\n          properties:\n            textContent: \"Add edge: Y => Z\"\n          events:\n            click:\n              target: eo-draw-canvas\n              method: addEdge\n              args:\n                - source: Y\n                  target: Z\n                  data:\n                    virtual: true\n        - brick: :forEach\n          dataSource:\n            - X\n            - Y\n          children:\n            - brick: eo-button\n              properties:\n                textContent: <% `Add nodes below ${ITEM}` %>\n              events:\n                click:\n                  target: eo-draw-canvas\n                  method: updateCells\n                  args:\n                    - |\n                      <%\n                        CTX.initialCells.concat([\n                          {\n                            type: \"edge\",\n                            source: ITEM,\n                            target: \"U\",\n                          },\n                          {\n                            type: \"edge\",\n                            source: ITEM,\n                            target: \"V\",\n                          },\n                          {\n                            type: \"node\",\n                            id: \"U\",\n                            data: {\n                              name: \"U\"\n                            }\n                          },\n                          {\n                            type: \"node\",\n                            id: \"V\",\n                            data: {\n                              name: \"V\"\n                            }\n                          },\n                        ])\n                      %>\n                    - reason: add-related-nodes\n                      parent: <% ITEM %>\n                  callback:\n                    success:\n                      action: console.log\n        - brick: hr\n          properties:\n            style:\n              width: 100%\n        - brick: h3\n          properties:\n            textContent: Drag nodes below\n        - brick: :forEach\n          dataSource: |\n            <%\n              [\"A\", \"B\", \"C\"].map((id) => ({\n                type: \"node\",\n                id,\n                data: {\n                  name: `Node ${id}`,\n                },\n              }))\n            %>\n          children:\n            - brick: diagram.experimental-node\n              properties:\n                textContent: <% ITEM.data.name %>\n                usage: library\n              events:\n                drag.move:\n                  action: context.replace\n                  args:\n                    - dragging\n                    - |\n                      <% {position: EVENT.detail, ...ITEM} %>\n                drag.end:\n                  - action: context.replace\n                    args:\n                      - dragging\n                      - null\n                  - target: eo-draw-canvas\n                    method: dropNode\n                    args:\n                      - position: <% EVENT.detail %>\n                        id: <% ITEM.id %>\n                        data: <% ITEM.data %>\n                    callback:\n                      success:\n                        if: <% EVENT.detail %>\n                        then:\n                          action: message.success\n                          args:\n                            - <% JSON.stringify(EVENT.detail) %>\n                        else:\n                          action: message.warn\n                          args:\n                            - Unexpected drop position\n        - brick: hr\n          properties:\n            style:\n              width: 100%\n        - brick: h3\n          properties:\n            textContent: Drag decorators below\n        - brick: :forEach\n          dataSource:\n            - area\n            - text\n          children:\n            - brick: diagram.experimental-node\n              properties:\n                textContent: <% _.upperFirst(ITEM) %>\n                usage: library\n              events:\n                drag.move:\n                  action: context.replace\n                  args:\n                    - dragging\n                    - |\n                      <% {position: EVENT.detail, type: \"decorator\", decorator: ITEM} %>\n                drag.end:\n                  - action: context.replace\n                    args:\n                      - dragging\n                      - null\n                  - target: eo-draw-canvas\n                    method: dropDecorator\n                    args:\n                      - position: <% EVENT.detail %>\n                        decorator: <% ITEM %>\n                        text: '<% ITEM === \"text\" ? \"Text\" : undefined %>'\n                    callback:\n                      success:\n                        if: <% EVENT.detail %>\n                        then:\n                          # action: message.success\n                          # args:\n                          #   - <% JSON.stringify(EVENT.detail) %>\n                        else:\n                          action: message.warn\n                          args:\n                            - Unexpected drop position\n    - brick: div\n      properties:\n        style:\n          flex: 1\n          minWidth: 0\n      children:\n        - brick: eo-draw-canvas\n          properties:\n            style:\n              width: 100%\n              height: 100%\n            activeTarget: <%= CTX.activeTarget %>\n            fadeUnrelatedCells: true\n            # Initial nodes only\n            defaultNodeSize: [60, 60]\n            defaultNodeBricks:\n              - useBrick:\n                  brick: diagram.experimental-node\n                  properties:\n                    textContent: <% `Node ${DATA.node.id}` %>\n                    status: |\n                      <%=\n                        CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\n                          ? \"highlighted\"\n                          // : CTX.unrelated.some(n =>\n                          //     n.type === \"node\" && n.id === DATA.node.id\n                          //   )\n                          // ? \"faded\"\n                          : \"default\"\n                      %>\n            defaultEdgeLines:\n              - if: <% DATA.edge.data?.virtual %>\n                dashed: true\n            cells: <% CTX.initialCells %>\n          events:\n            activeTarget.change:\n              action: context.replace\n              args:\n                - activeTarget\n                - <% EVENT.detail %>\n            cell.move:\n              action: message.info\n              args:\n                - <% `You just moved ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.x)}, ${Math.round(EVENT.detail.y)})` %>\n            cell.resize:\n              action: message.info\n              args:\n                - <% `You just resized ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.width)}, ${Math.round(EVENT.detail.height)})` %>\n            cell.delete:\n              action: message.warn\n              args:\n                - |\n                  <% `You wanna delete ${EVENT.detail.type} ${EVENT.detail.type === \"edge\" ? `(${EVENT.detail.source} => ${EVENT.detail.target})` : EVENT.detail.id}?` %>\n            cell.contextmenu:\n              - target: eo-context-menu\n                method: open\n                args:\n                  - position:\n                      - <% EVENT.detail.clientX %>\n                      - <% EVENT.detail.clientY %>\n              - action: context.replace\n                args:\n                  - targetCell\n                  - <% EVENT.detail.cell %>\n            decorator.text.change:\n              action: message.info\n              args:\n                - <% JSON.stringify(EVENT.detail) %>\n            scale.change:\n              action: context.replace\n              args:\n                - scale\n                - <% EVENT.detail %>\n- brick: diagram.experimental-node\n  properties:\n    usage: dragging\n    textContent: |\n      <%= CTX.dragging?.type === \"decorator\" ? (CTX.dragging.decorator === \"text\" ? \"Text\" : null) : CTX.dragging?.data.name %>\n    decorator: |\n      <%= CTX.dragging?.type === \"decorator\" ? CTX.dragging.decorator : null %>\n    style: |\n      <%=\n        {\n          left: `${CTX.dragging?.position[0]}px`,\n          top: `${CTX.dragging?.position[1]}px`,\n          transform: `scale(${CTX.scale})`,\n          transformOrigin: \"0 0\",\n          padding: CTX.dragging?.decorator === \"text\" ? \"0.5em\" : \"0\"\n        }\n      %>\n    hidden: <%= !CTX.dragging %>\n- brick: eo-context-menu\n  properties:\n    actions: |\n      <%=\n        CTX.targetCell?.type === \"node\" ? [\n          {\n            text: \"添加边\",\n            event: \"add-edge\",\n          }\n        ] : [\n          {\n            text: `Test ${CTX.targetCell?.type}`,\n            event: `test-${CTX.targetCell?.type}`,\n          }\n        ]\n      %>\n  events:\n    add-edge:\n      target: eo-draw-canvas\n      method: manuallyConnectNodes\n      args:\n        - <% CTX.targetCell.id %>\n      callback:\n        success:\n          target: eo-draw-canvas\n          method: addEdge\n          args:\n            - source: <% EVENT.detail.source.id %>\n              target: <% EVENT.detail.target.id %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: flex; height: 600px; gap: 1em\">\n#   <div style=\"width: 180px; display: flex; flex-direction: column; gap: 1em\">\n#     <eo-button id=\"brick-1\">Add random nodes</eo-button>\n#     <eo-button id=\"brick-2\">Add edge: Y =&gt; Z</eo-button>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#     <hr style=\"width: 100%\" />\n#     <h3>Drag nodes below</h3>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#     <hr style=\"width: 100%\" />\n#     <h3>Drag decorators below</h3>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#   </div>\n#   <div style=\"flex: 1; min-width: 0\">\n#     <eo-draw-canvas\n#       style=\"width: 100%; height: 100%\"\n#       fade-unrelated-cells\n#       id=\"brick-6\"\n#     ></eo-draw-canvas>\n#   </div>\n# </div>\n# <diagram.experimental-node\n#   usage=\"dragging\"\n#   decorator='&lt;%= CTX.dragging?.type === \"decorator\" ? CTX.dragging.decorator : null %&gt;\n# '\n#   hidden=\"&lt;%= !CTX.dragging %&gt;\"\n# >\n#   &lt;%= CTX.dragging?.type === \"decorator\" ? (CTX.dragging.decorator === \"text\"\n#   ? \"Text\" : null) : CTX.dragging?.data.name %&gt;\n# </diagram.experimental-node>\n# <eo-context-menu\n#   actions='&lt;%=\n#   CTX.targetCell?.type === \"node\" ? [\n#     {\n#       text: \"添加边\",\n#       event: \"add-edge\",\n#     }\n#   ] : [\n#     {\n#       text: `Test ${CTX.targetCell?.type}`,\n#       event: `test-${CTX.targetCell?.type}`,\n#     }\n#   ]\n# %&gt;\n# '\n#   id=\"brick-7\"\n# ></eo-context-menu>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.addNodes(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<%\\n  ((...seeds) => seeds.map((seed) => ({\\n    id: seed,\\n    data: {\\n      name: String(seed),\\n    },\\n  })))(\\n    Math.round(Math.random() * 1e6),\\n    Math.round(Math.random() * 1e6),\\n    Math.round(Math.random() * 1e6),\\n  )\\n%>\\n\"\n#     );\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.addEdge({ source: \"Y\", target: \"Z\", data: { virtual: true } });\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.updateCells(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       '<%\\n  CTX.initialCells.concat([\\n    {\\n      type: \"edge\",\\n      source: ITEM,\\n      target: \"U\",\\n    },\\n    {\\n      type: \"edge\",\\n      source: ITEM,\\n      target: \"V\",\\n    },\\n    {\\n      type: \"node\",\\n      id: \"U\",\\n      data: {\\n        name: \"U\"\\n      }\\n    },\\n    {\\n      type: \"node\",\\n      id: \"V\",\\n      data: {\\n        name: \"V\"\\n      }\\n    },\\n  ])\\n%>\\n',\n#       { reason: \"add-related-nodes\", parent: \"<% ITEM %>\" }\n#     );\n#   });\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.addEventListener(\"drag.move\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_4.addEventListener(\"drag.end\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_4.addEventListener(\"drag.end\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.dropNode({\n#       position: \"<% EVENT.detail %>\",\n#       id: \"<% ITEM.id %>\",\n#       data: \"<% ITEM.data %>\",\n#     });\n#   });\n# \n#   const brick_5 = document.getElementById(\"brick-5\");\n#   brick_5.addEventListener(\"drag.move\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_5.addEventListener(\"drag.end\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_5.addEventListener(\"drag.end\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.dropDecorator({\n#       position: \"<% EVENT.detail %>\",\n#       decorator: \"<% ITEM %>\",\n#       text: '<% ITEM === \"text\" ? \"Text\" : undefined %>',\n#     });\n#   });\n# \n#   const brick_6 = document.getElementById(\"brick-6\");\n#   brick_6.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_6.defaultNodeSize = [60, 60];\n#   brick_6.defaultNodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"diagram.experimental-node\",\n#         properties: {\n#           textContent: \"<% `Node ${DATA.node.id}` %>\",\n#           status:\n#             '<%=\\n  CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\\n    ? \"highlighted\"\\n    // : CTX.unrelated.some(n =>\\n    //     n.type === \"node\" && n.id === DATA.node.id\\n    //   )\\n    // ? \"faded\"\\n    : \"default\"\\n%>\\n',\n#         },\n#       },\n#     },\n#   ];\n#   brick_6.defaultEdgeLines = [\n#     {\n#       if: \"<% DATA.edge.data?.virtual %>\",\n#       dashed: true,\n#     },\n#   ];\n#   brick_6.cells = \"<% CTX.initialCells %>\";\n#   brick_6.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_6.addEventListener(\"cell.move\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         \"<% `You just moved ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.x)}, ${Math.round(EVENT.detail.y)})` %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.resize\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         \"<% `You just resized ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.width)}, ${Math.round(EVENT.detail.height)})` %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.delete\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"warn\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         '<% `You wanna delete ${EVENT.detail.type} ${EVENT.detail.type === \"edge\" ? `(${EVENT.detail.source} => ${EVENT.detail.target})` : EVENT.detail.id}?` %>\\n',\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.contextmenu\", (e) => {\n#     const brick = document.querySelector(\"eo-context-menu\");\n#     brick.open({\n#       position: [\"<% EVENT.detail.clientX %>\", \"<% EVENT.detail.clientY %>\"],\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.contextmenu\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_6.addEventListener(\"decorator.text.change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"scale.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# \n#   const brick_7 = document.getElementById(\"brick-7\");\n#   brick_7.addEventListener(\"add-edge\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.manuallyConnectNodes(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<% CTX.targetCell.id %>\"\n#     );\n#   });\n# </script>\n# \n```\n"
+    "doc": "用于手工绘图的画布。\n\n注意：将配套另外一个用于展示的画布构件。\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"600px\"\n- brick: div\n  properties:\n    style:\n      display: flex\n      height: 600px\n      gap: 1em\n  context:\n    - name: initialCells\n      value: |\n        <%\n          [\n            {\n              type: \"decorator\",\n              id: \"area-1\",\n              decorator: \"area\",\n              view: {\n                x: 10,\n                y: 20,\n                width: 400,\n                height: 300,\n              },\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Y\",\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Z\",\n              data: {\n                virtual: true,\n              }\n            },\n          ].concat(\n            [\"X\", \"Y\", \"Z\", \"W\"].map((id) => ({\n              type: \"node\",\n              id,\n              data: {\n                name: `Node ${id}`,\n              },\n              view: {\n                x: Math.round(\n                  id === \"X\"\n                    ? 200 + Math.random() * 200\n                    : id === \"Y\"\n                    ? Math.random() * 300\n                    : 300 + Math.random() * 300\n                ),\n                y: (id === \"X\" ? 0 : 300) + Math.round((Math.random() * 200)),\n                width: 60,\n                height: 60,\n              }\n            }))\n          ).concat([\n            {\n              type: \"decorator\",\n              id: \"text-1\",\n              decorator: \"text\",\n              view: {\n                x: 100,\n                y: 120,\n                width: 100,\n                height: 20,\n                text: \"Hello!\"\n              },\n            },\n          ])\n        %>\n    - name: dragging\n    - name: activeTarget\n    - name: targetCell\n    - name: scale\n      value: 1\n  children:\n    - brick: div\n      properties:\n        style:\n          width: 180px\n          display: flex\n          flexDirection: column\n          gap: 1em\n      children:\n        - brick: eo-button\n          properties:\n            textContent: Add random nodes\n          events:\n            click:\n              target: eo-draw-canvas\n              method: addNodes\n              args:\n                - |\n                  <%\n                    ((...seeds) => seeds.map((seed) => ({\n                      id: seed,\n                      data: {\n                        name: String(seed),\n                      },\n                    })))(\n                      Math.round(Math.random() * 1e6),\n                      Math.round(Math.random() * 1e6),\n                      Math.round(Math.random() * 1e6),\n                    )\n                  %>\n              callback:\n                success:\n                  action: console.log\n                  args:\n                    - Added nodes\n                    - <% EVENT.detail %>\n        - brick: eo-button\n          properties:\n            textContent: \"Add edge: Y => Z\"\n          events:\n            click:\n              target: eo-draw-canvas\n              method: addEdge\n              args:\n                - source: Y\n                  target: Z\n                  data:\n                    virtual: true\n        - brick: :forEach\n          dataSource:\n            - X\n            - Y\n          children:\n            - brick: eo-button\n              properties:\n                textContent: <% `Add nodes below ${ITEM}` %>\n              events:\n                click:\n                  target: eo-draw-canvas\n                  method: updateCells\n                  args:\n                    - |\n                      <%\n                        CTX.initialCells.concat([\n                          {\n                            type: \"edge\",\n                            source: ITEM,\n                            target: \"U\",\n                          },\n                          {\n                            type: \"edge\",\n                            source: ITEM,\n                            target: \"V\",\n                          },\n                          {\n                            type: \"node\",\n                            id: \"U\",\n                            data: {\n                              name: \"U\"\n                            }\n                          },\n                          {\n                            type: \"node\",\n                            id: \"V\",\n                            data: {\n                              name: \"V\"\n                            }\n                          },\n                        ])\n                      %>\n                    - reason: add-related-nodes\n                      parent: <% ITEM %>\n                  callback:\n                    success:\n                      action: console.log\n        - brick: hr\n          properties:\n            style:\n              width: 100%\n        - brick: h3\n          properties:\n            textContent: Drag nodes below\n        - brick: :forEach\n          dataSource: |\n            <%\n              [\"A\", \"B\", \"C\"].map((id) => ({\n                type: \"node\",\n                id,\n                data: {\n                  name: `Node ${id}`,\n                },\n              }))\n            %>\n          children:\n            - brick: diagram.experimental-node\n              properties:\n                textContent: <% ITEM.data.name %>\n                usage: library\n              events:\n                drag.move:\n                  action: context.replace\n                  args:\n                    - dragging\n                    - |\n                      <% {position: EVENT.detail, ...ITEM} %>\n                drag.end:\n                  - action: context.replace\n                    args:\n                      - dragging\n                      - null\n                  - target: eo-draw-canvas\n                    method: dropNode\n                    args:\n                      - position: <% EVENT.detail %>\n                        id: <% ITEM.id %>\n                        data: <% ITEM.data %>\n                    callback:\n                      success:\n                        if: <% EVENT.detail %>\n                        then:\n                          action: message.success\n                          args:\n                            - <% JSON.stringify(EVENT.detail) %>\n                        else:\n                          action: message.warn\n                          args:\n                            - Unexpected drop position\n        - brick: hr\n          properties:\n            style:\n              width: 100%\n        - brick: h3\n          properties:\n            textContent: Drag decorators below\n        - brick: :forEach\n          dataSource:\n            - area\n            - text\n          children:\n            - brick: diagram.experimental-node\n              properties:\n                textContent: <% _.upperFirst(ITEM) %>\n                usage: library\n              events:\n                drag.move:\n                  action: context.replace\n                  args:\n                    - dragging\n                    - |\n                      <% {position: EVENT.detail, type: \"decorator\", decorator: ITEM} %>\n                drag.end:\n                  - action: context.replace\n                    args:\n                      - dragging\n                      - null\n                  - target: eo-draw-canvas\n                    method: dropDecorator\n                    args:\n                      - position: <% EVENT.detail %>\n                        decorator: <% ITEM %>\n                        text: '<% ITEM === \"text\" ? \"Text\" : undefined %>'\n                    callback:\n                      success:\n                        if: <% EVENT.detail %>\n                        then:\n                          # action: message.success\n                          # args:\n                          #   - <% JSON.stringify(EVENT.detail) %>\n                        else:\n                          action: message.warn\n                          args:\n                            - Unexpected drop position\n    - brick: div\n      properties:\n        style:\n          flex: 1\n          minWidth: 0\n      children:\n        - brick: eo-draw-canvas\n          properties:\n            style:\n              width: 100%\n              height: 100%\n            activeTarget: <%= CTX.activeTarget %>\n            fadeUnrelatedCells: true\n            # Initial nodes only\n            defaultNodeSize: [60, 60]\n            defaultNodeBricks:\n              - useBrick:\n                  brick: diagram.experimental-node\n                  properties:\n                    textContent: <% `Node ${DATA.node.id}` %>\n                    status: |\n                      <%=\n                        CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\n                          ? \"highlighted\"\n                          // : CTX.unrelated.some(n =>\n                          //     n.type === \"node\" && n.id === DATA.node.id\n                          //   )\n                          // ? \"faded\"\n                          : \"default\"\n                      %>\n            defaultEdgeLines:\n              - if: <% DATA.edge.data?.virtual %>\n                dashed: true\n            cells: <% CTX.initialCells %>\n          events:\n            activeTarget.change:\n              action: context.replace\n              args:\n                - activeTarget\n                - <% EVENT.detail %>\n            cell.move:\n              action: message.info\n              args:\n                - <% `You just moved ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.x)}, ${Math.round(EVENT.detail.y)})` %>\n            cell.resize:\n              action: message.info\n              args:\n                - <% `You just resized ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.width)}, ${Math.round(EVENT.detail.height)})` %>\n            cell.delete:\n              action: message.warn\n              args:\n                - |\n                  <% `You wanna delete ${EVENT.detail.type} ${EVENT.detail.type === \"edge\" ? `(${EVENT.detail.source} => ${EVENT.detail.target})` : EVENT.detail.id}?` %>\n            cell.contextmenu:\n              - target: eo-context-menu\n                method: open\n                args:\n                  - position:\n                      - <% EVENT.detail.clientX %>\n                      - <% EVENT.detail.clientY %>\n              - action: context.replace\n                args:\n                  - targetCell\n                  - <% EVENT.detail.cell %>\n            decorator.text.change:\n              action: message.info\n              args:\n                - <% JSON.stringify(EVENT.detail) %>\n            scale.change:\n              action: context.replace\n              args:\n                - scale\n                - <% EVENT.detail %>\n- brick: diagram.experimental-node\n  properties:\n    usage: dragging\n    textContent: |\n      <%= CTX.dragging?.type === \"decorator\" ? (CTX.dragging.decorator === \"text\" ? \"Text\" : null) : CTX.dragging?.data.name %>\n    decorator: |\n      <%= CTX.dragging?.type === \"decorator\" ? CTX.dragging.decorator : null %>\n    style: |\n      <%=\n        {\n          left: `${CTX.dragging?.position[0]}px`,\n          top: `${CTX.dragging?.position[1]}px`,\n          transform: `scale(${CTX.scale})`,\n          transformOrigin: \"0 0\",\n          padding: CTX.dragging?.decorator === \"text\" ? \"0.5em\" : \"0\"\n        }\n      %>\n    hidden: <%= !CTX.dragging %>\n- brick: eo-context-menu\n  properties:\n    actions: |\n      <%=\n        CTX.targetCell?.type === \"node\" ? [\n          {\n            text: \"添加边\",\n            event: \"add-edge\",\n          }\n        ] : [\n          {\n            text: `Test ${CTX.targetCell?.type}`,\n            event: `test-${CTX.targetCell?.type}`,\n          }\n        ]\n      %>\n  events:\n    add-edge:\n      target: eo-draw-canvas\n      method: manuallyConnectNodes\n      args:\n        - <% CTX.targetCell.id %>\n      callback:\n        success:\n          target: eo-draw-canvas\n          method: addEdge\n          args:\n            - source: <% EVENT.detail.source.id %>\n              target: <% EVENT.detail.target.id %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: flex; height: 600px; gap: 1em\">\n#   <div style=\"width: 180px; display: flex; flex-direction: column; gap: 1em\">\n#     <eo-button id=\"brick-1\">Add random nodes</eo-button>\n#     <eo-button id=\"brick-2\">Add edge: Y =&gt; Z</eo-button>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#     <hr style=\"width: 100%\" />\n#     <h3>Drag nodes below</h3>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#     <hr style=\"width: 100%\" />\n#     <h3>Drag decorators below</h3>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#   </div>\n#   <div style=\"flex: 1; min-width: 0\">\n#     <eo-draw-canvas\n#       style=\"width: 100%; height: 100%\"\n#       fade-unrelated-cells\n#       id=\"brick-6\"\n#     ></eo-draw-canvas>\n#   </div>\n# </div>\n# <diagram.experimental-node\n#   usage=\"dragging\"\n#   decorator='&lt;%= CTX.dragging?.type === \"decorator\" ? CTX.dragging.decorator : null %&gt;\n# '\n#   hidden=\"&lt;%= !CTX.dragging %&gt;\"\n# >\n#   &lt;%= CTX.dragging?.type === \"decorator\" ? (CTX.dragging.decorator === \"text\"\n#   ? \"Text\" : null) : CTX.dragging?.data.name %&gt;\n# </diagram.experimental-node>\n# <eo-context-menu\n#   actions='&lt;%=\n#   CTX.targetCell?.type === \"node\" ? [\n#     {\n#       text: \"添加边\",\n#       event: \"add-edge\",\n#     }\n#   ] : [\n#     {\n#       text: `Test ${CTX.targetCell?.type}`,\n#       event: `test-${CTX.targetCell?.type}`,\n#     }\n#   ]\n# %&gt;\n# '\n#   id=\"brick-7\"\n# ></eo-context-menu>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.addNodes(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<%\\n  ((...seeds) => seeds.map((seed) => ({\\n    id: seed,\\n    data: {\\n      name: String(seed),\\n    },\\n  })))(\\n    Math.round(Math.random() * 1e6),\\n    Math.round(Math.random() * 1e6),\\n    Math.round(Math.random() * 1e6),\\n  )\\n%>\\n\"\n#     );\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.addEdge({ source: \"Y\", target: \"Z\", data: { virtual: true } });\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.updateCells(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       '<%\\n  CTX.initialCells.concat([\\n    {\\n      type: \"edge\",\\n      source: ITEM,\\n      target: \"U\",\\n    },\\n    {\\n      type: \"edge\",\\n      source: ITEM,\\n      target: \"V\",\\n    },\\n    {\\n      type: \"node\",\\n      id: \"U\",\\n      data: {\\n        name: \"U\"\\n      }\\n    },\\n    {\\n      type: \"node\",\\n      id: \"V\",\\n      data: {\\n        name: \"V\"\\n      }\\n    },\\n  ])\\n%>\\n',\n#       { reason: \"add-related-nodes\", parent: \"<% ITEM %>\" }\n#     );\n#   });\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.addEventListener(\"drag.move\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_4.addEventListener(\"drag.end\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_4.addEventListener(\"drag.end\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.dropNode({\n#       position: \"<% EVENT.detail %>\",\n#       id: \"<% ITEM.id %>\",\n#       data: \"<% ITEM.data %>\",\n#     });\n#   });\n# \n#   const brick_5 = document.getElementById(\"brick-5\");\n#   brick_5.addEventListener(\"drag.move\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_5.addEventListener(\"drag.end\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_5.addEventListener(\"drag.end\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.dropDecorator({\n#       position: \"<% EVENT.detail %>\",\n#       decorator: \"<% ITEM %>\",\n#       text: '<% ITEM === \"text\" ? \"Text\" : undefined %>',\n#     });\n#   });\n# \n#   const brick_6 = document.getElementById(\"brick-6\");\n#   brick_6.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_6.defaultNodeSize = [60, 60];\n#   brick_6.defaultNodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"diagram.experimental-node\",\n#         properties: {\n#           textContent: \"<% `Node ${DATA.node.id}` %>\",\n#           status:\n#             '<%=\\n  CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\\n    ? \"highlighted\"\\n    // : CTX.unrelated.some(n =>\\n    //     n.type === \"node\" && n.id === DATA.node.id\\n    //   )\\n    // ? \"faded\"\\n    : \"default\"\\n%>\\n',\n#         },\n#       },\n#     },\n#   ];\n#   brick_6.defaultEdgeLines = [\n#     {\n#       if: \"<% DATA.edge.data?.virtual %>\",\n#       dashed: true,\n#     },\n#   ];\n#   brick_6.cells = \"<% CTX.initialCells %>\";\n#   brick_6.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_6.addEventListener(\"cell.move\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         \"<% `You just moved ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.x)}, ${Math.round(EVENT.detail.y)})` %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.resize\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         \"<% `You just resized ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.width)}, ${Math.round(EVENT.detail.height)})` %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.delete\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"warn\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         '<% `You wanna delete ${EVENT.detail.type} ${EVENT.detail.type === \"edge\" ? `(${EVENT.detail.source} => ${EVENT.detail.target})` : EVENT.detail.id}?` %>\\n',\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.contextmenu\", (e) => {\n#     const brick = document.querySelector(\"eo-context-menu\");\n#     brick.open({\n#       position: [\"<% EVENT.detail.clientX %>\", \"<% EVENT.detail.clientY %>\"],\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.contextmenu\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_6.addEventListener(\"decorator.text.change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"scale.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# \n#   const brick_7 = document.getElementById(\"brick-7\");\n#   brick_7.addEventListener(\"add-edge\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.manuallyConnectNodes(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<% CTX.targetCell.id %>\"\n#     );\n#   });\n# </script>\n# \n```\n\n### Force layout\n\n```yaml preview minHeight=\"600px\"\n- brick: div\n  properties:\n    style:\n      display: flex\n      height: 600px\n      gap: 1em\n  context:\n    - name: initialCells\n      value: |\n        <%\n          [\n            {\n              type: \"decorator\",\n              id: \"area-1\",\n              decorator: \"area\",\n              view: {\n                x: 10,\n                y: 20,\n                width: 400,\n                height: 300,\n              },\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Y\",\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Z\",\n              data: {\n                virtual: true,\n              }\n            },\n          ].concat(\n            [\"X\", \"Y\", \"Z\", \"W\"].map((id) => ({\n              type: \"node\",\n              id,\n              data: {\n                name: `Node ${id}`,\n              },\n              view: {\n                width: 60,\n                height: 60,\n              }\n            }))\n          ).concat([\n            {\n              type: \"decorator\",\n              id: \"text-1\",\n              decorator: \"text\",\n              view: {\n                x: 100,\n                y: 120,\n                width: 100,\n                height: 20,\n                text: \"Hello!\"\n              },\n            },\n          ])\n        %>\n    - name: dragging\n    - name: activeTarget\n    - name: targetCell\n    - name: scale\n      value: 1\n  children:\n    - brick: div\n      properties:\n        style:\n          width: 180px\n          display: flex\n          flexDirection: column\n          gap: 1em\n      children:\n        - brick: eo-button\n          properties:\n            textContent: Add random nodes\n          events:\n            click:\n              target: eo-draw-canvas\n              method: addNodes\n              args:\n                - |\n                  <%\n                    ((...seeds) => seeds.map((seed) => ({\n                      id: seed,\n                      data: {\n                        name: String(seed),\n                      },\n                    })))(\n                      Math.round(Math.random() * 1e6),\n                      Math.round(Math.random() * 1e6),\n                      Math.round(Math.random() * 1e6),\n                    )\n                  %>\n              callback:\n                success:\n                  action: console.log\n                  args:\n                    - Added nodes\n                    - <% EVENT.detail %>\n        - brick: eo-button\n          properties:\n            textContent: \"Add edge: Y => Z\"\n          events:\n            click:\n              target: eo-draw-canvas\n              method: addEdge\n              args:\n                - source: Y\n                  target: Z\n                  data:\n                    virtual: true\n        - brick: :forEach\n          dataSource:\n            - X\n            - Y\n          children:\n            - brick: eo-button\n              properties:\n                textContent: <% `Add nodes below ${ITEM}` %>\n              events:\n                click:\n                  target: eo-draw-canvas\n                  method: updateCells\n                  args:\n                    - |\n                      <%\n                        CTX.initialCells.concat([\n                          {\n                            type: \"edge\",\n                            source: ITEM,\n                            target: \"U\",\n                          },\n                          {\n                            type: \"edge\",\n                            source: ITEM,\n                            target: \"V\",\n                          },\n                          {\n                            type: \"node\",\n                            id: \"U\",\n                            data: {\n                              name: \"U\"\n                            }\n                          },\n                          {\n                            type: \"node\",\n                            id: \"V\",\n                            data: {\n                              name: \"V\"\n                            }\n                          },\n                        ])\n                      %>\n                    - reason: add-related-nodes\n                      parent: <% ITEM %>\n                  callback:\n                    success:\n                      action: console.log\n        - brick: hr\n          properties:\n            style:\n              width: 100%\n        - brick: h3\n          properties:\n            textContent: Drag nodes below\n        - brick: :forEach\n          dataSource: |\n            <%\n              [\"A\", \"B\", \"C\"].map((id) => ({\n                type: \"node\",\n                id,\n                data: {\n                  name: `Node ${id}`,\n                },\n              }))\n            %>\n          children:\n            - brick: diagram.experimental-node\n              properties:\n                textContent: <% ITEM.data.name %>\n                usage: library\n              events:\n                drag.move:\n                  action: context.replace\n                  args:\n                    - dragging\n                    - |\n                      <% {position: EVENT.detail, ...ITEM} %>\n                drag.end:\n                  - action: context.replace\n                    args:\n                      - dragging\n                      - null\n                  - target: eo-draw-canvas\n                    method: dropNode\n                    args:\n                      - position: <% EVENT.detail %>\n                        id: <% ITEM.id %>\n                        data: <% ITEM.data %>\n                    callback:\n                      success:\n                        if: <% EVENT.detail %>\n                        then:\n                          action: message.success\n                          args:\n                            - <% JSON.stringify(EVENT.detail) %>\n                        else:\n                          action: message.warn\n                          args:\n                            - Unexpected drop position\n        - brick: hr\n          properties:\n            style:\n              width: 100%\n        - brick: h3\n          properties:\n            textContent: Drag decorators below\n        - brick: :forEach\n          dataSource:\n            - area\n            - text\n          children:\n            - brick: diagram.experimental-node\n              properties:\n                textContent: <% _.upperFirst(ITEM) %>\n                usage: library\n              events:\n                drag.move:\n                  action: context.replace\n                  args:\n                    - dragging\n                    - |\n                      <% {position: EVENT.detail, type: \"decorator\", decorator: ITEM} %>\n                drag.end:\n                  - action: context.replace\n                    args:\n                      - dragging\n                      - null\n                  - target: eo-draw-canvas\n                    method: dropDecorator\n                    args:\n                      - position: <% EVENT.detail %>\n                        decorator: <% ITEM %>\n                        text: '<% ITEM === \"text\" ? \"Text\" : undefined %>'\n                    callback:\n                      success:\n                        if: <% EVENT.detail %>\n                        then:\n                          # action: message.success\n                          # args:\n                          #   - <% JSON.stringify(EVENT.detail) %>\n                        else:\n                          action: message.warn\n                          args:\n                            - Unexpected drop position\n    - brick: div\n      properties:\n        style:\n          flex: 1\n          minWidth: 0\n      children:\n        - brick: eo-draw-canvas\n          properties:\n            style:\n              width: 100%\n              height: 100%\n            activeTarget: <%= CTX.activeTarget %>\n            fadeUnrelatedCells: true\n            layout: force\n            # Initial nodes only\n            defaultNodeSize: [60, 60]\n            defaultNodeBricks:\n              - useBrick:\n                  brick: diagram.experimental-node\n                  properties:\n                    textContent: <% `Node ${DATA.node.id}` %>\n                    status: |\n                      <%=\n                        CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\n                          ? \"highlighted\"\n                          // : CTX.unrelated.some(n =>\n                          //     n.type === \"node\" && n.id === DATA.node.id\n                          //   )\n                          // ? \"faded\"\n                          : \"default\"\n                      %>\n            defaultEdgeLines:\n              - if: <% DATA.edge.data?.virtual %>\n                dashed: true\n            cells: <% CTX.initialCells %>\n          events:\n            activeTarget.change:\n              action: context.replace\n              args:\n                - activeTarget\n                - <% EVENT.detail %>\n            cell.move:\n              action: message.info\n              args:\n                - <% `You just moved ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.x)}, ${Math.round(EVENT.detail.y)})` %>\n            cell.resize:\n              action: message.info\n              args:\n                - <% `You just resized ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.width)}, ${Math.round(EVENT.detail.height)})` %>\n            cell.delete:\n              action: message.warn\n              args:\n                - |\n                  <% `You wanna delete ${EVENT.detail.type} ${EVENT.detail.type === \"edge\" ? `(${EVENT.detail.source} => ${EVENT.detail.target})` : EVENT.detail.id}?` %>\n            cell.contextmenu:\n              - target: eo-context-menu\n                method: open\n                args:\n                  - position:\n                      - <% EVENT.detail.clientX %>\n                      - <% EVENT.detail.clientY %>\n              - action: context.replace\n                args:\n                  - targetCell\n                  - <% EVENT.detail.cell %>\n            decorator.text.change:\n              action: message.info\n              args:\n                - <% JSON.stringify(EVENT.detail) %>\n            scale.change:\n              action: context.replace\n              args:\n                - scale\n                - <% EVENT.detail %>\n- brick: diagram.experimental-node\n  properties:\n    usage: dragging\n    textContent: |\n      <%= CTX.dragging?.type === \"decorator\" ? (CTX.dragging.decorator === \"text\" ? \"Text\" : null) : CTX.dragging?.data.name %>\n    decorator: |\n      <%= CTX.dragging?.type === \"decorator\" ? CTX.dragging.decorator : null %>\n    style: |\n      <%=\n        {\n          left: `${CTX.dragging?.position[0]}px`,\n          top: `${CTX.dragging?.position[1]}px`,\n          transform: `scale(${CTX.scale})`,\n          transformOrigin: \"0 0\",\n          padding: CTX.dragging?.decorator === \"text\" ? \"0.5em\" : \"0\"\n        }\n      %>\n    hidden: <%= !CTX.dragging %>\n- brick: eo-context-menu\n  properties:\n    actions: |\n      <%=\n        CTX.targetCell?.type === \"node\" ? [\n          {\n            text: \"添加边\",\n            event: \"add-edge\",\n          }\n        ] : [\n          {\n            text: `Test ${CTX.targetCell?.type}`,\n            event: `test-${CTX.targetCell?.type}`,\n          }\n        ]\n      %>\n  events:\n    add-edge:\n      target: eo-draw-canvas\n      method: manuallyConnectNodes\n      args:\n        - <% CTX.targetCell.id %>\n      callback:\n        success:\n          target: eo-draw-canvas\n          method: addEdge\n          args:\n            - source: <% EVENT.detail.source.id %>\n              target: <% EVENT.detail.target.id %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: flex; height: 600px; gap: 1em\">\n#   <div style=\"width: 180px; display: flex; flex-direction: column; gap: 1em\">\n#     <eo-button id=\"brick-1\">Add random nodes</eo-button>\n#     <eo-button id=\"brick-2\">Add edge: Y =&gt; Z</eo-button>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#     <hr style=\"width: 100%\" />\n#     <h3>Drag nodes below</h3>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#     <hr style=\"width: 100%\" />\n#     <h3>Drag decorators below</h3>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#   </div>\n#   <div style=\"flex: 1; min-width: 0\">\n#     <eo-draw-canvas\n#       style=\"width: 100%; height: 100%\"\n#       fade-unrelated-cells\n#       layout=\"force\"\n#       id=\"brick-6\"\n#     ></eo-draw-canvas>\n#   </div>\n# </div>\n# <diagram.experimental-node\n#   usage=\"dragging\"\n#   decorator='&lt;%= CTX.dragging?.type === \"decorator\" ? CTX.dragging.decorator : null %&gt;\n# '\n#   hidden=\"&lt;%= !CTX.dragging %&gt;\"\n# >\n#   &lt;%= CTX.dragging?.type === \"decorator\" ? (CTX.dragging.decorator === \"text\"\n#   ? \"Text\" : null) : CTX.dragging?.data.name %&gt;\n# </diagram.experimental-node>\n# <eo-context-menu\n#   actions='&lt;%=\n#   CTX.targetCell?.type === \"node\" ? [\n#     {\n#       text: \"添加边\",\n#       event: \"add-edge\",\n#     }\n#   ] : [\n#     {\n#       text: `Test ${CTX.targetCell?.type}`,\n#       event: `test-${CTX.targetCell?.type}`,\n#     }\n#   ]\n# %&gt;\n# '\n#   id=\"brick-7\"\n# ></eo-context-menu>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.addNodes(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<%\\n  ((...seeds) => seeds.map((seed) => ({\\n    id: seed,\\n    data: {\\n      name: String(seed),\\n    },\\n  })))(\\n    Math.round(Math.random() * 1e6),\\n    Math.round(Math.random() * 1e6),\\n    Math.round(Math.random() * 1e6),\\n  )\\n%>\\n\"\n#     );\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.addEdge({ source: \"Y\", target: \"Z\", data: { virtual: true } });\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.updateCells(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       '<%\\n  CTX.initialCells.concat([\\n    {\\n      type: \"edge\",\\n      source: ITEM,\\n      target: \"U\",\\n    },\\n    {\\n      type: \"edge\",\\n      source: ITEM,\\n      target: \"V\",\\n    },\\n    {\\n      type: \"node\",\\n      id: \"U\",\\n      data: {\\n        name: \"U\"\\n      }\\n    },\\n    {\\n      type: \"node\",\\n      id: \"V\",\\n      data: {\\n        name: \"V\"\\n      }\\n    },\\n  ])\\n%>\\n',\n#       { reason: \"add-related-nodes\", parent: \"<% ITEM %>\" }\n#     );\n#   });\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.addEventListener(\"drag.move\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_4.addEventListener(\"drag.end\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_4.addEventListener(\"drag.end\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.dropNode({\n#       position: \"<% EVENT.detail %>\",\n#       id: \"<% ITEM.id %>\",\n#       data: \"<% ITEM.data %>\",\n#     });\n#   });\n# \n#   const brick_5 = document.getElementById(\"brick-5\");\n#   brick_5.addEventListener(\"drag.move\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_5.addEventListener(\"drag.end\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_5.addEventListener(\"drag.end\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.dropDecorator({\n#       position: \"<% EVENT.detail %>\",\n#       decorator: \"<% ITEM %>\",\n#       text: '<% ITEM === \"text\" ? \"Text\" : undefined %>',\n#     });\n#   });\n# \n#   const brick_6 = document.getElementById(\"brick-6\");\n#   brick_6.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_6.defaultNodeSize = [60, 60];\n#   brick_6.defaultNodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"diagram.experimental-node\",\n#         properties: {\n#           textContent: \"<% `Node ${DATA.node.id}` %>\",\n#           status:\n#             '<%=\\n  CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\\n    ? \"highlighted\"\\n    // : CTX.unrelated.some(n =>\\n    //     n.type === \"node\" && n.id === DATA.node.id\\n    //   )\\n    // ? \"faded\"\\n    : \"default\"\\n%>\\n',\n#         },\n#       },\n#     },\n#   ];\n#   brick_6.defaultEdgeLines = [\n#     {\n#       if: \"<% DATA.edge.data?.virtual %>\",\n#       dashed: true,\n#     },\n#   ];\n#   brick_6.cells = \"<% CTX.initialCells %>\";\n#   brick_6.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_6.addEventListener(\"cell.move\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         \"<% `You just moved ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.x)}, ${Math.round(EVENT.detail.y)})` %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.resize\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         \"<% `You just resized ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.width)}, ${Math.round(EVENT.detail.height)})` %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.delete\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"warn\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         '<% `You wanna delete ${EVENT.detail.type} ${EVENT.detail.type === \"edge\" ? `(${EVENT.detail.source} => ${EVENT.detail.target})` : EVENT.detail.id}?` %>\\n',\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.contextmenu\", (e) => {\n#     const brick = document.querySelector(\"eo-context-menu\");\n#     brick.open({\n#       position: [\"<% EVENT.detail.clientX %>\", \"<% EVENT.detail.clientY %>\"],\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.contextmenu\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_6.addEventListener(\"decorator.text.change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"scale.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# \n#   const brick_7 = document.getElementById(\"brick-7\");\n#   brick_7.addEventListener(\"add-edge\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.manuallyConnectNodes(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<% CTX.targetCell.id %>\"\n#     );\n#   });\n# </script>\n# \n```\n\n### Dagre layout\n\n```yaml preview minHeight=\"600px\"\n- brick: div\n  properties:\n    style:\n      display: flex\n      height: 600px\n      gap: 1em\n  context:\n    - name: initialCells\n      value: |\n        <%\n          [\n            {\n              type: \"decorator\",\n              id: \"area-1\",\n              decorator: \"area\",\n              view: {\n                x: 10,\n                y: 20,\n                width: 400,\n                height: 300,\n              },\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Y\",\n            },\n            {\n              type: \"edge\",\n              source: \"X\",\n              target: \"Z\",\n              data: {\n                virtual: true,\n              }\n            },\n          ].concat(\n            [\"X\", \"Y\", \"Z\", \"W\"].map((id) => ({\n              type: \"node\",\n              id,\n              data: {\n                name: `Node ${id}`,\n              },\n              view: {\n                width: 60,\n                height: 60,\n              }\n            }))\n          ).concat([\n            {\n              type: \"decorator\",\n              id: \"text-1\",\n              decorator: \"text\",\n              view: {\n                x: 100,\n                y: 120,\n                width: 100,\n                height: 20,\n                text: \"Hello!\"\n              },\n            },\n          ])\n        %>\n    - name: dragging\n    - name: activeTarget\n    - name: targetCell\n    - name: scale\n      value: 1\n  children:\n    - brick: div\n      properties:\n        style:\n          width: 180px\n          display: flex\n          flexDirection: column\n          gap: 1em\n      children:\n        - brick: eo-button\n          properties:\n            textContent: Add random nodes\n          events:\n            click:\n              target: eo-draw-canvas\n              method: addNodes\n              args:\n                - |\n                  <%\n                    ((...seeds) => seeds.map((seed) => ({\n                      id: seed,\n                      data: {\n                        name: String(seed),\n                      },\n                    })))(\n                      Math.round(Math.random() * 1e6),\n                      Math.round(Math.random() * 1e6),\n                      Math.round(Math.random() * 1e6),\n                    )\n                  %>\n              callback:\n                success:\n                  action: console.log\n                  args:\n                    - Added nodes\n                    - <% EVENT.detail %>\n        - brick: eo-button\n          properties:\n            textContent: \"Add edge: Y => Z\"\n          events:\n            click:\n              target: eo-draw-canvas\n              method: addEdge\n              args:\n                - source: Y\n                  target: Z\n                  data:\n                    virtual: true\n        - brick: :forEach\n          dataSource:\n            - X\n            - Y\n          children:\n            - brick: eo-button\n              properties:\n                textContent: <% `Add nodes below ${ITEM}` %>\n              events:\n                click:\n                  target: eo-draw-canvas\n                  method: updateCells\n                  args:\n                    - |\n                      <%\n                        CTX.initialCells.concat([\n                          {\n                            type: \"edge\",\n                            source: ITEM,\n                            target: \"U\",\n                          },\n                          {\n                            type: \"edge\",\n                            source: ITEM,\n                            target: \"V\",\n                          },\n                          {\n                            type: \"node\",\n                            id: \"U\",\n                            data: {\n                              name: \"U\"\n                            }\n                          },\n                          {\n                            type: \"node\",\n                            id: \"V\",\n                            data: {\n                              name: \"V\"\n                            }\n                          },\n                        ])\n                      %>\n                    - reason: add-related-nodes\n                      parent: <% ITEM %>\n                  callback:\n                    success:\n                      action: console.log\n        - brick: hr\n          properties:\n            style:\n              width: 100%\n        - brick: h3\n          properties:\n            textContent: Drag nodes below\n        - brick: :forEach\n          dataSource: |\n            <%\n              [\"A\", \"B\", \"C\"].map((id) => ({\n                type: \"node\",\n                id,\n                data: {\n                  name: `Node ${id}`,\n                },\n              }))\n            %>\n          children:\n            - brick: diagram.experimental-node\n              properties:\n                textContent: <% ITEM.data.name %>\n                usage: library\n              events:\n                drag.move:\n                  action: context.replace\n                  args:\n                    - dragging\n                    - |\n                      <% {position: EVENT.detail, ...ITEM} %>\n                drag.end:\n                  - action: context.replace\n                    args:\n                      - dragging\n                      - null\n                  - target: eo-draw-canvas\n                    method: dropNode\n                    args:\n                      - position: <% EVENT.detail %>\n                        id: <% ITEM.id %>\n                        data: <% ITEM.data %>\n                    callback:\n                      success:\n                        if: <% EVENT.detail %>\n                        then:\n                          action: message.success\n                          args:\n                            - <% JSON.stringify(EVENT.detail) %>\n                        else:\n                          action: message.warn\n                          args:\n                            - Unexpected drop position\n        - brick: hr\n          properties:\n            style:\n              width: 100%\n        - brick: h3\n          properties:\n            textContent: Drag decorators below\n        - brick: :forEach\n          dataSource:\n            - area\n            - text\n          children:\n            - brick: diagram.experimental-node\n              properties:\n                textContent: <% _.upperFirst(ITEM) %>\n                usage: library\n              events:\n                drag.move:\n                  action: context.replace\n                  args:\n                    - dragging\n                    - |\n                      <% {position: EVENT.detail, type: \"decorator\", decorator: ITEM} %>\n                drag.end:\n                  - action: context.replace\n                    args:\n                      - dragging\n                      - null\n                  - target: eo-draw-canvas\n                    method: dropDecorator\n                    args:\n                      - position: <% EVENT.detail %>\n                        decorator: <% ITEM %>\n                        text: '<% ITEM === \"text\" ? \"Text\" : undefined %>'\n                    callback:\n                      success:\n                        if: <% EVENT.detail %>\n                        then:\n                          # action: message.success\n                          # args:\n                          #   - <% JSON.stringify(EVENT.detail) %>\n                        else:\n                          action: message.warn\n                          args:\n                            - Unexpected drop position\n    - brick: div\n      properties:\n        style:\n          flex: 1\n          minWidth: 0\n      children:\n        - brick: eo-draw-canvas\n          properties:\n            style:\n              width: 100%\n              height: 100%\n            activeTarget: <%= CTX.activeTarget %>\n            fadeUnrelatedCells: true\n            layout: dagre\n            # Initial nodes only\n            defaultNodeSize: [60, 60]\n            defaultNodeBricks:\n              - useBrick:\n                  brick: diagram.experimental-node\n                  properties:\n                    textContent: <% `Node ${DATA.node.id}` %>\n                    status: |\n                      <%=\n                        CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\n                          ? \"highlighted\"\n                          // : CTX.unrelated.some(n =>\n                          //     n.type === \"node\" && n.id === DATA.node.id\n                          //   )\n                          // ? \"faded\"\n                          : \"default\"\n                      %>\n            defaultEdgeLines:\n              - if: <% DATA.edge.data?.virtual %>\n                dashed: true\n            cells: <% CTX.initialCells %>\n          events:\n            activeTarget.change:\n              action: context.replace\n              args:\n                - activeTarget\n                - <% EVENT.detail %>\n            cell.move:\n              action: message.info\n              args:\n                - <% `You just moved ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.x)}, ${Math.round(EVENT.detail.y)})` %>\n            cell.resize:\n              action: message.info\n              args:\n                - <% `You just resized ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.width)}, ${Math.round(EVENT.detail.height)})` %>\n            cell.delete:\n              action: message.warn\n              args:\n                - |\n                  <% `You wanna delete ${EVENT.detail.type} ${EVENT.detail.type === \"edge\" ? `(${EVENT.detail.source} => ${EVENT.detail.target})` : EVENT.detail.id}?` %>\n            cell.contextmenu:\n              - target: eo-context-menu\n                method: open\n                args:\n                  - position:\n                      - <% EVENT.detail.clientX %>\n                      - <% EVENT.detail.clientY %>\n              - action: context.replace\n                args:\n                  - targetCell\n                  - <% EVENT.detail.cell %>\n            decorator.text.change:\n              action: message.info\n              args:\n                - <% JSON.stringify(EVENT.detail) %>\n            scale.change:\n              action: context.replace\n              args:\n                - scale\n                - <% EVENT.detail %>\n- brick: diagram.experimental-node\n  properties:\n    usage: dragging\n    textContent: |\n      <%= CTX.dragging?.type === \"decorator\" ? (CTX.dragging.decorator === \"text\" ? \"Text\" : null) : CTX.dragging?.data.name %>\n    decorator: |\n      <%= CTX.dragging?.type === \"decorator\" ? CTX.dragging.decorator : null %>\n    style: |\n      <%=\n        {\n          left: `${CTX.dragging?.position[0]}px`,\n          top: `${CTX.dragging?.position[1]}px`,\n          transform: `scale(${CTX.scale})`,\n          transformOrigin: \"0 0\",\n          padding: CTX.dragging?.decorator === \"text\" ? \"0.5em\" : \"0\"\n        }\n      %>\n    hidden: <%= !CTX.dragging %>\n- brick: eo-context-menu\n  properties:\n    actions: |\n      <%=\n        CTX.targetCell?.type === \"node\" ? [\n          {\n            text: \"添加边\",\n            event: \"add-edge\",\n          }\n        ] : [\n          {\n            text: `Test ${CTX.targetCell?.type}`,\n            event: `test-${CTX.targetCell?.type}`,\n          }\n        ]\n      %>\n  events:\n    add-edge:\n      target: eo-draw-canvas\n      method: manuallyConnectNodes\n      args:\n        - <% CTX.targetCell.id %>\n      callback:\n        success:\n          target: eo-draw-canvas\n          method: addEdge\n          args:\n            - source: <% EVENT.detail.source.id %>\n              target: <% EVENT.detail.target.id %>\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: flex; height: 600px; gap: 1em\">\n#   <div style=\"width: 180px; display: flex; flex-direction: column; gap: 1em\">\n#     <eo-button id=\"brick-1\">Add random nodes</eo-button>\n#     <eo-button id=\"brick-2\">Add edge: Y =&gt; Z</eo-button>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#     <hr style=\"width: 100%\" />\n#     <h3>Drag nodes below</h3>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#     <hr style=\"width: 100%\" />\n#     <h3>Drag decorators below</h3>\n#     <!-- WARN: \":forEach\" is not supported in HTML mode, please try YAML. -->\n#   </div>\n#   <div style=\"flex: 1; min-width: 0\">\n#     <eo-draw-canvas\n#       style=\"width: 100%; height: 100%\"\n#       fade-unrelated-cells\n#       layout=\"dagre\"\n#       id=\"brick-6\"\n#     ></eo-draw-canvas>\n#   </div>\n# </div>\n# <diagram.experimental-node\n#   usage=\"dragging\"\n#   decorator='&lt;%= CTX.dragging?.type === \"decorator\" ? CTX.dragging.decorator : null %&gt;\n# '\n#   hidden=\"&lt;%= !CTX.dragging %&gt;\"\n# >\n#   &lt;%= CTX.dragging?.type === \"decorator\" ? (CTX.dragging.decorator === \"text\"\n#   ? \"Text\" : null) : CTX.dragging?.data.name %&gt;\n# </diagram.experimental-node>\n# <eo-context-menu\n#   actions='&lt;%=\n#   CTX.targetCell?.type === \"node\" ? [\n#     {\n#       text: \"添加边\",\n#       event: \"add-edge\",\n#     }\n#   ] : [\n#     {\n#       text: `Test ${CTX.targetCell?.type}`,\n#       event: `test-${CTX.targetCell?.type}`,\n#     }\n#   ]\n# %&gt;\n# '\n#   id=\"brick-7\"\n# ></eo-context-menu>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.addNodes(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<%\\n  ((...seeds) => seeds.map((seed) => ({\\n    id: seed,\\n    data: {\\n      name: String(seed),\\n    },\\n  })))(\\n    Math.round(Math.random() * 1e6),\\n    Math.round(Math.random() * 1e6),\\n    Math.round(Math.random() * 1e6),\\n  )\\n%>\\n\"\n#     );\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.addEdge({ source: \"Y\", target: \"Z\", data: { virtual: true } });\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.updateCells(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       '<%\\n  CTX.initialCells.concat([\\n    {\\n      type: \"edge\",\\n      source: ITEM,\\n      target: \"U\",\\n    },\\n    {\\n      type: \"edge\",\\n      source: ITEM,\\n      target: \"V\",\\n    },\\n    {\\n      type: \"node\",\\n      id: \"U\",\\n      data: {\\n        name: \"U\"\\n      }\\n    },\\n    {\\n      type: \"node\",\\n      id: \"V\",\\n      data: {\\n        name: \"V\"\\n      }\\n    },\\n  ])\\n%>\\n',\n#       { reason: \"add-related-nodes\", parent: \"<% ITEM %>\" }\n#     );\n#   });\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.addEventListener(\"drag.move\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_4.addEventListener(\"drag.end\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_4.addEventListener(\"drag.end\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.dropNode({\n#       position: \"<% EVENT.detail %>\",\n#       id: \"<% ITEM.id %>\",\n#       data: \"<% ITEM.data %>\",\n#     });\n#   });\n# \n#   const brick_5 = document.getElementById(\"brick-5\");\n#   brick_5.addEventListener(\"drag.move\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_5.addEventListener(\"drag.end\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_5.addEventListener(\"drag.end\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.dropDecorator({\n#       position: \"<% EVENT.detail %>\",\n#       decorator: \"<% ITEM %>\",\n#       text: '<% ITEM === \"text\" ? \"Text\" : undefined %>',\n#     });\n#   });\n# \n#   const brick_6 = document.getElementById(\"brick-6\");\n#   brick_6.activeTarget = \"<%= CTX.activeTarget %>\";\n#   brick_6.defaultNodeSize = [60, 60];\n#   brick_6.defaultNodeBricks = [\n#     {\n#       useBrick: {\n#         brick: \"diagram.experimental-node\",\n#         properties: {\n#           textContent: \"<% `Node ${DATA.node.id}` %>\",\n#           status:\n#             '<%=\\n  CTX.activeTarget?.type === \"node\" && CTX.activeTarget.id === DATA.node.id\\n    ? \"highlighted\"\\n    // : CTX.unrelated.some(n =>\\n    //     n.type === \"node\" && n.id === DATA.node.id\\n    //   )\\n    // ? \"faded\"\\n    : \"default\"\\n%>\\n',\n#         },\n#       },\n#     },\n#   ];\n#   brick_6.defaultEdgeLines = [\n#     {\n#       if: \"<% DATA.edge.data?.virtual %>\",\n#       dashed: true,\n#     },\n#   ];\n#   brick_6.cells = \"<% CTX.initialCells %>\";\n#   brick_6.addEventListener(\"activeTarget.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_6.addEventListener(\"cell.move\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         \"<% `You just moved ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.x)}, ${Math.round(EVENT.detail.y)})` %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.resize\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         \"<% `You just resized ${EVENT.detail.type} ${EVENT.detail.id} to (${Math.round(EVENT.detail.width)}, ${Math.round(EVENT.detail.height)})` %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.delete\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"warn\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message:\n#         '<% `You wanna delete ${EVENT.detail.type} ${EVENT.detail.type === \"edge\" ? `(${EVENT.detail.source} => ${EVENT.detail.target})` : EVENT.detail.id}?` %>\\n',\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.contextmenu\", (e) => {\n#     const brick = document.querySelector(\"eo-context-menu\");\n#     brick.open({\n#       position: [\"<% EVENT.detail.clientX %>\", \"<% EVENT.detail.clientY %>\"],\n#     });\n#   });\n#   brick_6.addEventListener(\"cell.contextmenu\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_6.addEventListener(\"decorator.text.change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"info\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n#   brick_6.addEventListener(\"scale.change\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n# \n#   const brick_7 = document.getElementById(\"brick-7\");\n#   brick_7.addEventListener(\"add-edge\", (e) => {\n#     const brick = document.querySelector(\"eo-draw-canvas\");\n#     brick.manuallyConnectNodes(\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       \"<% CTX.targetCell.id %>\"\n#     );\n#   });\n# </script>\n# \n```\n"
   }
 }

package/dist/index.439a5d8f.js

@@ -0,0 +1,2 @@
+(()=>{"use strict";var e,t,r,n,a,o,l,i,d,c,s,u,f,h,m,p,b,v,g,x,y,P={3328:(e,t,r)=>{var n={"./eo-diagram":()=>Promise.all([r.e(5481),r.e(8769),r.e(1030),r.e(9929),r.e(8299),r.e(7410),r.e(4993),r.e(7034),r.e(3039)]).then((()=>()=>r(1508))),"./experimental-node":()=>Promise.all([r.e(8769),r.e(9929),r.e(8299),r.e(4422)]).then((()=>()=>r(5568))),"./eo-display-canvas":()=>Promise.all([r.e(5481),r.e(5145),r.e(8769),r.e(1030),r.e(9929),r.e(8299),r.e(7410),r.e(4993),r.e(709),r.e(9823)]).then((()=>()=>r(6094))),"./editable-label":()=>Promise.all([r.e(8769),r.e(9929),r.e(8299),r.e(6006)]).then((()=>()=>r(947))),"./eo-draw-canvas":()=>Promise.all([r.e(5481),r.e(5145),r.e(8769),r.e(1030),r.e(9929),r.e(8299),r.e(8438),r.e(7410),r.e(4993),r.e(709),r.e(8939)]).then((()=>()=>r(9068)))},a=(e,t)=>(r.R=t,t=r.o(n,e)?n[e]():Promise.resolve().then((()=>{throw new Error('Module "'+e+'" does not exist in container.')})),r.R=void 0,t),o=(e,t)=>{if(r.S){var n="default",a=r.S[n];if(a&&a!==e)throw new Error("Container initialization failed as it has already been initialized with a different share scope");return r.S[n]=e,r.I(n,t)}};r.d(t,{get:()=>a,init:()=>o})}},w={};function k(e){var t=w[e];if(void 0!==t)return t.exports;var r=w[e]={id:e,loaded:!1,exports:{}};return P[e].call(r.exports,r,r.exports,k),r.loaded=!0,r.exports}k.m=P,k.c=w,k.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return k.d(t,{a:t}),t},k.d=(e,t)=>{for(var r in t)k.o(t,r)&&!k.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},k.f={},k.e=e=>Promise.all(Object.keys(k.f).reduce(((t,r)=>(k.f[r](e,t),t)),[])),k.u=e=>"chunks/"+({3039:"eo-diagram",4422:"experimental-node",6006:"editable-label",8939:"eo-draw-canvas",9823:"eo-display-canvas"}[e]||e)+"."+{114:"ff6154a0",709:"bc74a999",726:"efcf01a2",1030:"d12d7dee",1045:"c6921aed",1122:"aa791e35",1302:"c06bd17d",1370:"1b4ac3ac",1860:"4fd60630",1889:"c14b28e6",1940:"788d05b3",1972:"d6fea46c",2052:"fa66eafb",2277:"9a1ded28",2617:"7fdfc9fb",3039:"5f32fd41",3144:"712fb13e",3171:"9f016ea3",3426:"f1ddd917",3436:"48e0e4dd",3933:"0342d0ab",4041:"58c8ed1f",4208:"bc504ba3",4422:"4545beba",4658:"e875061a",4741:"eda28116",4993:"133e50a4",5145:"f606390f",5250:"f7dfb399",5384:"f1a69526",5399:"e2de915e",5481:"d6977dfc",5552:"8099590c",6006:"e37e189e",6314:"a17e6cef",6519:"9c35628c",6688:"714d3e8b",6773:"6ac391fe",7034:"286dd8ae",7058:"f8880fe9",7304:"a2d65f45",7410:"fad5932c",7452:"9d465fb5",7721:"5bd46b7f",7733:"7a82300e",7780:"bbd9990e",7862:"4fd520d3",7920:"cc5f2f6b",8299:"4ca8ac4b",8438:"a7e43856",8442:"026d7b4e",8769:"70cc3f88",8939:"5602b10d",8989:"cf6586cc",9259:"7e779e4a",9515:"c8266f33",9559:"2729fe3b",9591:"c5101110",9823:"74087b7e",9844:"db90776a",9929:"34c83d45"}[e]+".js",k.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),k.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),e={},t="@next-bricks/diagram:",k.l=(r,n,a,o)=>{if(e[r])e[r].push(n);else{var l,i;if(void 0!==a)for(var d=document.getElementsByTagName("script"),c=0;c<d.length;c++){var s=d[c];if(s.getAttribute("src")==r||s.getAttribute("data-webpack")==t+a){l=s;break}}l||(i=!0,(l=document.createElement("script")).charset="utf-8",l.timeout=120,k.nc&&l.setAttribute("nonce",k.nc),l.setAttribute("data-webpack",t+a),l.src=r),e[r]=[n];var u=(t,n)=>{l.onerror=l.onload=null,clearTimeout(f);var a=e[r];if(delete e[r],l.parentNode&&l.parentNode.removeChild(l),a&&a.forEach((e=>e(n))),t)return t(n)},f=setTimeout(u.bind(null,void 0,{type:"timeout",target:l}),12e4);l.onerror=u.bind(null,l.onerror),l.onload=u.bind(null,l.onload),i&&document.head.appendChild(l)}},k.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},k.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),(()=>{k.S={};var e={},t={};k.I=(r,n)=>{n||(n=[]);var a=t[r];if(a||(a=t[r]={}),!(n.indexOf(a)>=0)){if(n.push(a),e[r])return e[r];k.o(k.S,r)||(k.S[r]={});var o=k.S[r],l="@next-bricks/diagram",i=(e,t,r,n)=>{var a=o[e]=o[e]||{},i=a[t];(!i||!i.loaded&&(!n!=!i.eager?n:l>i.from))&&(a[t]={get:r,from:l,eager:!!n})},d=[];return"default"===r&&(i("@babel/parser","7.24.0",(()=>k.e(6773).then((()=>()=>k(6773))))),i("@easyops-cn/brick-next-pipes","0.6.0",(()=>Promise.all([k.e(4741),k.e(1030),k.e(6688)]).then((()=>()=>k(4741))))),i("@next-core/cook","2.2.13",(()=>Promise.all([k.e(1122),k.e(2617)]).then((()=>()=>k(1122))))),i("@next-core/element","1.2.3",(()=>k.e(1045).then((()=>()=>k(1045))))),i("@next-core/http","1.1.10",(()=>k.e(8989).then((()=>()=>k(8989))))),i("@next-core/i18n","1.0.39",(()=>Promise.all([k.e(8438),k.e(7058),k.e(8442),k.e(5552)]).then((()=>()=>k(5552))))),i("@next-core/inject","1.0.29",(()=>Promise.all([k.e(1030),k.e(9259),k.e(2277)]).then((()=>()=>k(2277))))),i("@next-core/loader","1.5.5",(()=>k.e(5399).then((()=>()=>k(7780))))),i("@next-core/pipes","2.0.17",(()=>k.e(6519).then((()=>()=>k(6519))))),i("@next-core/react-element","1.0.22",(()=>Promise.all([k.e(8769),k.e(9929),k.e(4208),k.e(114)]).then((()=>()=>k(114))))),i("@next-core/react-runtime","1.2.3",(()=>Promise.all([k.e(8769),k.e(1030),k.e(7410),k.e(1972)]).then((()=>()=>k(1972))))),i("@next-core/runtime","1.33.0",(()=>Promise.all([k.e(1860),k.e(1030),k.e(8438),k.e(1302),k.e(7058),k.e(7862),k.e(3436),k.e(7920)]).then((()=>()=>k(1860))))),i("@next-core/supply","2.1.12",(()=>Promise.all([k.e(1030),k.e(9259),k.e(1302),k.e(9559)]).then((()=>()=>k(9559))))),i("@next-core/theme","1.4.8",(()=>Promise.all([k.e(1889),k.e(2052)]).then((()=>()=>k(1889))))),i("@next-core/utils/general","1.6.11",(()=>k.e(7452).then((()=>()=>k(7452))))),i("@next-core/utils/storyboard","1.6.11",(()=>Promise.all([k.e(8438),k.e(7862),k.e(3933)]).then((()=>()=>k(3933))))),i("history","4.10.1",(()=>k.e(5384).then((()=>()=>k(5384))))),i("i18next-browser-languagedetector","7.2.0",(()=>k.e(726).then((()=>()=>k(726))))),i("i18next","22.5.1",(()=>k.e(7304).then((()=>()=>k(7304))))),i("js-yaml","3.14.1",(()=>k.e(9515).then((()=>()=>k(9515))))),i("lodash","4.17.21",(()=>k.e(5250).then((()=>()=>k(5250))))),i("moment/locale/zh-cn.js","2.29.4",(()=>Promise.all([k.e(7721),k.e(9844)]).then((()=>()=>k(1329))))),i("moment","2.29.4",(()=>Promise.all([k.e(7721),k.e(9844)]).then((()=>()=>k(9420))))),i("react-dom","0.0.0-experimental-ee8509801-20230117",(()=>Promise.all([k.e(3144),k.e(8769)]).then((()=>()=>k(3144))))),i("react","0.0.0-experimental-ee8509801-20230117",(()=>k.e(4041).then((()=>()=>k(4041)))))),e[r]=d.length?Promise.all(d).then((()=>e[r]=1)):1}}})(),(()=>{var e;k.g.importScripts&&(e=k.g.location+"");var t=k.g.document;if(!e&&t&&(t.currentScript&&(e=t.currentScript.src),!e)){var r=t.getElementsByTagName("script");if(r.length)for(var n=r.length-1;n>-1&&(!e||!/^http(s?):/.test(e));)e=r[n--].src}if(!e)throw new Error("Automatic publicPath is not supported in this browser");e=e.replace(/#.*$/,"").replace(/\?.*$/,"").replace(/\/[^\/]+$/,"/"),k.p=e})(),r=e=>{var t=e=>e.split(".").map((e=>+e==e?+e:e)),r=/^([^-+]+)?(?:-([^+]+))?(?:\+(.+))?$/.exec(e),n=r[1]?t(r[1]):[];return r[2]&&(n.length++,n.push.apply(n,t(r[2]))),r[3]&&(n.push([]),n.push.apply(n,t(r[3]))),n},n=(e,t)=>{e=r(e),t=r(t);for(var n=0;;){if(n>=e.length)return n<t.length&&"u"!=(typeof t[n])[0];var a=e[n],o=(typeof a)[0];if(n>=t.length)return"u"==o;var l=t[n],i=(typeof l)[0];if(o!=i)return"o"==o&&"n"==i||"s"==i||"u"==o;if("o"!=o&&"u"!=o&&a!=l)return a<l;n++}},a=e=>{var t=e[0],r="";if(1===e.length)return"*";if(t+.5){r+=0==t?">=":-1==t?"<":1==t?"^":2==t?"~":t>0?"=":"!=";for(var n=1,o=1;o<e.length;o++)n--,r+="u"==(typeof(i=e[o]))[0]?"-":(n>0?".":"")+(n=2,i);return r}var l=[];for(o=1;o<e.length;o++){var i=e[o];l.push(0===i?"not("+d()+")":1===i?"("+d()+" || "+d()+")":2===i?l.pop()+" "+l.pop():a(i))}return d();function d(){return l.pop().replace(/^\((.+)\)$/,"$1")}},o=(e,t)=>{if(0 in e){t=r(t);var n=e[0],a=n<0;a&&(n=-n-1);for(var l=0,i=1,d=!0;;i++,l++){var c,s,u=i<e.length?(typeof e[i])[0]:"";if(l>=t.length||"o"==(s=(typeof(c=t[l]))[0]))return!d||("u"==u?i>n&&!a:""==u!=a);if("u"==s){if(!d||"u"!=u)return!1}else if(d)if(u==s)if(i<=n){if(c!=e[i])return!1}else{if(a?c>e[i]:c<e[i])return!1;c!=e[i]&&(d=!1)}else if("s"!=u&&"n"!=u){if(a||i<=n)return!1;d=!1,i--}else{if(i<=n||s<u!=a)return!1;d=!1}else"s"!=u&&"n"!=u&&(d=!1,i--)}}var f=[],h=f.pop.bind(f);for(l=1;l<e.length;l++){var m=e[l];f.push(1==m?h()|h():2==m?h()&h():m?o(m,t):!h())}return!!h()},l=(e,t)=>{var r=e[t];return(t=Object.keys(r).reduce(((e,t)=>!e||n(e,t)?t:e),0))&&r[t]},i=(e,t)=>{var r=e[t];return Object.keys(r).reduce(((e,t)=>!e||!r[e].loaded&&n(e,t)?t:e),0)},d=(e,t,r,n)=>"Unsatisfied version "+r+" from "+(r&&e[t][r].from)+" of shared singleton module "+t+" (required "+a(n)+")",c=(e,t,r,n)=>{var a=i(e,r);return o(n,a)||u(d(e,r,a,n)),f(e[r][a])},s=(e,t,r)=>{var a=e[t];return(t=Object.keys(a).reduce(((e,t)=>!o(r,t)||e&&!n(e,t)?e:t),0))&&a[t]},u=e=>{"undefined"!=typeof console&&console.warn&&console.warn(e)},f=e=>(e.loaded=1,e.get()),m=(h=e=>function(t,r,n,a){var o=k.I(t);return o&&o.then?o.then(e.bind(e,t,k.S[t],r,n,a)):e(t,k.S[t],r,n,a)})(((e,t,r,n)=>t&&k.o(t,r)?f(l(t,r)):n())),p=h(((e,t,r,n,a)=>t&&k.o(t,r)?c(t,0,r,n):a())),b=h(((e,t,r,n,a)=>{var o=t&&k.o(t,r)&&s(t,r,n);return o?f(o):a()})),v={},g={1030:()=>p("default","lodash",[1,4,17,21],(()=>k.e(5250).then((()=>()=>k(5250))))),1204:()=>p("default","js-yaml",[1,3,14,0],(()=>k.e(9515).then((()=>()=>k(9515))))),8297:()=>p("default","moment",[1,2,27,0],(()=>Promise.all([k.e(7721),k.e(9844)]).then((()=>()=>k(9420))))),2617:()=>p("default","@babel/parser",[1,7,24,0],(()=>k.e(6773).then((()=>()=>k(6773))))),8438:()=>p("default","@next-core/utils/general",[1,1,6,11],(()=>k.e(7452).then((()=>()=>k(7452))))),7058:()=>p("default","@next-core/i18n",[1,1,0,39],(()=>Promise.all([k.e(8442),k.e(3171)]).then((()=>()=>k(5552))))),2350:()=>p("default","i18next",[1,22,5,1],(()=>k.e(7304).then((()=>()=>k(7304))))),6837:()=>p("default","i18next-browser-languagedetector",[1,7,2,0],(()=>k.e(726).then((()=>()=>k(726))))),9259:()=>p("default","@next-core/pipes",[1,2,0,17],(()=>k.e(6519).then((()=>()=>k(6519))))),161:()=>p("default","@easyops-cn/brick-next-pipes",[2,0,6,0],(()=>Promise.all([k.e(4741),k.e(1030),k.e(6688)]).then((()=>()=>k(4741))))),8769:()=>b("default","react",[6,0,0,0,,"experimental-ee8509801-20230117"],(()=>k.e(4041).then((()=>()=>k(4041))))),9929:()=>b("default","@next-core/element",[1,1,2,3],(()=>k.e(3426).then((()=>()=>k(1045))))),454:()=>m("default","react-dom",(()=>k.e(3144).then((()=>()=>k(3144))))),9435:()=>b("default","react-dom",[6,0,0,0,,"experimental-ee8509801-20230117"],(()=>k.e(3144).then((()=>()=>k(3144))))),7410:()=>p("default","@next-core/runtime",[1,1,33,0],(()=>Promise.all([k.e(1860),k.e(8438),k.e(1302),k.e(7058),k.e(7862),k.e(3436)]).then((()=>()=>k(1860))))),1302:()=>p("default","moment",[1,2,30,1],(()=>Promise.all([k.e(7721),k.e(9844)]).then((()=>()=>k(9420))))),5481:()=>p("default","@next-core/cook",[1,2,2,13],(()=>Promise.all([k.e(1122),k.e(2617)]).then((()=>()=>k(1122))))),50:()=>p("default","@next-core/utils/storyboard",[1,1,6,11],(()=>k.e(6314).then((()=>()=>k(3933))))),2890:()=>p("default","history",[1,4,10,1],(()=>k.e(5384).then((()=>()=>k(5384))))),5290:()=>p("default","@next-core/http",[1,1,1,10],(()=>k.e(1370).then((()=>()=>k(8989))))),5435:()=>p("default","@next-core/inject",[1,1,0,29],(()=>Promise.all([k.e(9259),k.e(4658)]).then((()=>()=>k(2277))))),6036:()=>p("default","moment/locale/zh-cn.js",[1,2,30,1],(()=>Promise.all([k.e(7721),k.e(9844)]).then((()=>()=>k(1329))))),6154:()=>p("default","@next-core/loader",[1,1,5,5],(()=>k.e(7780).then((()=>()=>k(7780))))),7731:()=>p("default","@next-core/supply",[1,2,1,12],(()=>Promise.all([k.e(9259),k.e(1940)]).then((()=>()=>k(9559))))),330:()=>p("default","@next-core/theme",[1,1,4,8],(()=>k.e(1889).then((()=>()=>k(1889))))),9938:()=>b("default","@next-core/react-element",[1,1,0,22],(()=>Promise.all([k.e(4208),k.e(7733)]).then((()=>()=>k(114))))),4993:()=>b("default","@next-core/react-runtime",[1,1,2,3],(()=>k.e(9591).then((()=>()=>k(1972))))),3496:()=>p("default","@next-core/http",[1,1,0,6],(()=>k.e(1370).then((()=>()=>k(8989))))),6237:()=>b("default","react-dom",[0,16,9,0],(()=>k.e(3144).then((()=>()=>k(3144)))))},x={709:[6237],1030:[1030],1302:[1302],2617:[2617],3436:[50,2890,5290,5435,6036,6154,7731],4208:[454,9435],4993:[4993],6519:[161],6688:[1204,8297],7034:[3496],7058:[7058],7410:[7410],7862:[5481],8299:[330,9938],8438:[8438],8442:[2350,6837],8769:[8769],9259:[9259],9929:[9929]},y={},k.f.consumes=(e,t)=>{k.o(x,e)&&x[e].forEach((e=>{if(k.o(v,e))return t.push(v[e]);if(!y[e]){var r=t=>{v[e]=0,k.m[e]=r=>{delete k.c[e],r.exports=t()}};y[e]=!0;var n=t=>{delete v[e],k.m[e]=r=>{throw delete k.c[e],t}};try{var a=g[e]();a.then?t.push(v[e]=a.then(r).catch(n)):r(a)}catch(e){n(e)}}}))},(()=>{var e={2691:0};k.f.j=(t,r)=>{var n=k.o(e,t)?e[t]:void 0;if(0!==n)if(n)r.push(n[2]);else if(/^(7(058|410|862)|8(299|438|442|769)|1030|1302|2617|3436|4208|4993|6688|9259|9929)$/.test(t))e[t]=0;else{var a=new Promise(((r,a)=>n=e[t]=[r,a]));r.push(n[2]=a);var o=k.p+k.u(t),l=new Error;k.l(o,(r=>{if(k.o(e,t)&&(0!==(n=e[t])&&(e[t]=void 0),n)){var a=r&&("load"===r.type?"missing":r.type),o=r&&r.target&&r.target.src;l.message="Loading chunk "+t+" failed.\n("+a+": "+o+")",l.name="ChunkLoadError",l.type=a,l.request=o,n[1](l)}}),"chunk-"+t,t)}};var t=(t,r)=>{var n,a,[o,l,i]=r,d=0;if(o.some((t=>0!==e[t]))){for(n in l)k.o(l,n)&&(k.m[n]=l[n]);i&&i(k)}for(t&&t(r);d<o.length;d++)a=o[d],k.o(e,a)&&e[a]&&e[a][0](),e[a]=0},r=self.webpackChunk_next_bricks_diagram=self.webpackChunk_next_bricks_diagram||[];r.forEach(t.bind(null,0)),r.push=t.bind(null,r.push.bind(r))})(),k.nc=void 0;var j=k(3328);window["bricks/diagram"]=j})();
+//# sourceMappingURL=index.439a5d8f.js.map