@visuallyjs/browser-ui-react 1.0.0

package/visuallyjs.browser-ui-react.cjs.js

@@ -0,0 +1 @@
+var mt=Object.create;var Te=Object.defineProperty;var pt=Object.getOwnPropertyDescriptor;var ft=Object.getOwnPropertyNames;var Ct=Object.getPrototypeOf,Et=Object.prototype.hasOwnProperty;var gt=(e,t)=>{for(var r in t)Te(e,r,{get:t[r],enumerable:!0})},Qe=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of ft(t))!Et.call(e,o)&&o!==r&&Te(e,o,{get:()=>t[o],enumerable:!(n=pt(t,o))||n.enumerable});return e};var v=(e,t,r)=>(r=e!=null?mt(Ct(e)):{},Qe(t||!e||!e.__esModule?Te(r,"default",{value:e,enumerable:!0}):r,e)),xt=e=>Qe(Te({},"__esModule",{value:!0}),e);var Zt={};gt(Zt,{ATTRIBUTE_CAN_REDO:()=>lt,ATTRIBUTE_CAN_UNDO:()=>it,AreaChartComponent:()=>Ut,BackgroundComponent:()=>Ge,BarChartComponent:()=>kt,BrowserUIReactModel:()=>ce,BubbleChartComponent:()=>Ht,CLASS_REACT_GROUP:()=>Ae,CLASS_REACT_NODE:()=>Ne,CLASS_REACT_OVERLAY:()=>Je,CLASS_SELECTED_MODE:()=>je,ColorPickerComponent:()=>Vt,ColumnChartComponent:()=>jt,ControlsComponent:()=>Nt,DEFAULT_SHAPE_HEIGHT:()=>ct,DEFAULT_SHAPE_WIDTH:()=>st,DecoratorComponent:()=>Ke,DiagramComponent:()=>_t,DiagramContext:()=>w,DiagramPaletteComponent:()=>Bt,DiagramProvider:()=>bt,EdgeTypePickerComponent:()=>Pt,ExportControlsComponent:()=>At,GaugeChartComponent:()=>Wt,GridBackgroundComponent:()=>$t,ImageBackgroundComponent:()=>Xt,InspectorComponent:()=>Tt,InspectorContext:()=>he,JSXWrapper:()=>we,LineChartComponent:()=>Lt,MiniviewComponent:()=>vt,PaletteComponent:()=>It,PieChartComponent:()=>Ft,SankeyChartComponent:()=>Jt,ScatterChartComponent:()=>zt,ShapeComponent:()=>Mt,ShapePaletteComponent:()=>wt,SurfaceComponent:()=>yt,SurfaceContext:()=>g,SurfaceProvider:()=>Ot,TiledImageBackgroundComponent:()=>Yt,VisuallyJsContext:()=>ye,VisuallyJsProvider:()=>ht,XYChartComponent:()=>Gt,createDiagramRef:()=>qe,createInspectorRef:()=>Ye,createRefHandler:()=>de,createSurfaceRef:()=>ue,getSurfaceComponent:()=>Pe,newInstance:()=>$e,registerSurface:()=>We,useDiagram:()=>Dt,useInspector:()=>Re,useSurface:()=>Xe,useVisuallyJsModel:()=>Rt});module.exports=xt(Zt);var He=require("@visuallyjs/browser-ui"),et=new Map,Oe={};function We(e,t){et.set(e,t),St(e,t)}function St(e,t){(Oe[e]||[]).forEach(n=>{try{n(t)}catch(o){(0,He.log)("WARN: an error was reported invoking a SurfaceComponentRefCallback "+o)}}),delete Oe[e]}function Pe(e,t){let r=et.get(e);if(r)try{t(r)}catch(n){(0,He.log)("WARN: an error was reported invoking a SurfaceComponentRefCallback "+n)}else Oe[e]=Oe[e]||[],Oe[e].push(t)}var Ne="vjs-react-node",Ae="vjs-react-group",Je="vjs-react-overlay";var oe=v(require("react"));function we(e){let t=(0,oe.useRef)(!1);return(0,oe.useEffect)(()=>{t.current||(t.current=!0,e.cb(e.ns))}),oe.default.createElement(oe.default.Fragment,null,e.ns.def.jsx({obj:e.ns.obj,model:e.model,ui:e.ui,data:e.ns.obj.data,props:e.childProps||{}}))}var Me=require("@visuallyjs/browser-ui"),ce=class extends Me.BrowserUIModel{render(t,r){return(0,Me.log)("render called directly on BrowserUIReactModel class: should not happen. UI components should use internal render."),null}};function $e(e){return e=e||{},new ce(e)}var K=v(require("react")),g=(0,K.createContext)(null);function Ot(e){let t=(0,K.useRef)(null),r=ue(t);return K.default.createElement(g.Provider,{value:r},e.children||[])}function ue(e){return de(e)}function de(e){let t=[];return{set:r=>{e.current=r,t.forEach(n=>n(r))},listen:r=>{e.current==null?t.push(r):r(e.current)},Ri:()=>e}}function Xe(){let e=(0,K.useContext)(g);return new Promise((t,r)=>{e!=null?e.listen(n=>t(n)):r()})}var Ie=require("react"),he=(0,Ie.createContext)(null);function Ye(e){return de(e)}function Re(){let e=(0,Ie.useContext)(he);return e==null?null:e.Ri().current}var Q=v(require("react")),Ve=require("@visuallyjs/browser-ui");function Pt(e){let t=(0,Q.useRef)(!1),r=(0,Q.useRef)(null),n=(0,Q.useRef)(null),o=Re(),{propertyName:u}=e,a=()=>o.getFromContext(Ve.INSPECTOR_CONTEXT_EDGE_PROPERTY_MAPPINGS)||o.$ui.$getEdgePropertyMappings();return(0,Q.useEffect)(()=>{t.current||(t.current=!0,n.current=new Ve.EdgeTypePicker(o.$ui,r.current,a(),o.getValue(u),(d,m)=>{o.setValue(u,m)}),n.current.render(u,o.Qe),o.onChange(()=>{n.current.select(u,o.getValue(u))}))}),Q.default.createElement("div",{ref:r})}var ne=v(require("react")),ye=(0,ne.createContext)(void 0);function ht(e){let t=$e(e.modelOptions||{});return ne.default.createElement(ye.Provider,{value:t},e.children||[])}function Rt(){let e=(0,ne.useContext)(ye);return new Promise((t,r)=>{if(e==null){let n=(0,ne.useContext)(g);n!=null?n.listen(o=>t(o.model)):r()}else t(e)})}var x=v(require("react")),Ze=v(require("react-dom")),l=require("@visuallyjs/browser-ui"),yt=(0,x.forwardRef)((e,t)=>{let r=(0,x.useRef)(!1),n=(0,x.useContext)(ye),o=(0,x.useRef)(null),u=(0,x.useRef)(null),a=(0,x.useRef)(null),d,m=(0,x.useContext)(g);m==null?(d=(0,x.useRef)(null),m=ue(d)):d=m.Ri();let[S,h]=(0,x.useState)([]),[j,c]=(0,x.useState)([]),y=[],L=[];function M(f){return x.default.createElement(we,{ns:f,model:a.current,ui:d.current,childProps:e.childProps,cb:_=>{ee(_)}})}function ee(f){if(f.hydrated!==!0){let _=(0,l.isGroup)(f.obj)?Ae:Ne;f.domElement.firstElementChild&&((0,l.addClass)(f.domElement.firstElementChild,_),f.domElement.firstElementChild.getAttribute(l.ATTRIBUTE_NOT_DRAGGABLE)===l.TRUE&&f.domElement.setAttribute(l.ATTRIBUTE_NOT_DRAGGABLE,l.TRUE)),d.current.$vertexRendered(f.obj,f.domElement,f.def,f.payload.eventInfo),f.hydrated=!0}else d.current.$revalidateElement(f.domElement)}function F(){h(y.slice())}function te(f){return x.default.createElement(we,{ns:f,model:a.current,ui:d.current,childProps:e.childProps,cb:_=>{A(_)}})}function A(f){if(f.hydrated!==!0){let _=(0,l.isGroup)(f.obj)?Ae:Ne;f.domElement.firstElementChild&&(0,l.addClass)(f.domElement.firstElementChild,_),f.hydrated=!0}else d.current.$revalidateElement(f.domElement)}function $(){c(L.slice())}let X={getSurface:()=>d.current,getModel:()=>a.current};(0,x.useImperativeHandle)(t,()=>X),(0,x.useEffect)(()=>{var f;if(!r.current){r.current=!0,e.model!=null?a.current=e.model:n==null?a.current=new ce(e.modelOptions||{}):a.current=n,typeof document!="undefined"&&(u.current=document.createElement("div"),u.current.style.position="fixed",u.current.style.left="10000px",u.current.style.top="10000px",u.current.style.width="100px",u.current.style.height="100px",u.current.style.opacity="0",o.current.appendChild(u.current));let _=(C,E,k,V,T,p,b,re)=>{let[Se,B]=p.component||p.jsx?[p,null]:(0,l.isGroup)(b)?[Object.assign(Object.assign({},p),{jsx:ze=>x.default.createElement(x.default.Fragment,null,ze.obj.data.label)}),l.CLASS_DEFAULT_GROUP]:[Object.assign(Object.assign({},p),{jsx:ze=>x.default.createElement(x.default.Fragment,null,ze.obj.data.label)}),l.CLASS_DEFAULT_NODE],se=T.containerType===l.ElementTypes.HTML?document.createElement(l.ELEMENT_DIV):(0,l.$svgNode)(l.ELEMENT_SVG);u.current.appendChild(se),B!=null&&T.$addClassToElement(se,B);let dt={data:E,model:k,surface:T,componentId:b.getFullId(),obj:b,props:e.childProps,element:se,eventInfo:re};y.push({data:E,def:Se,payload:dt,domElement:se,key:b.id,obj:b,hydrated:!1}),F()},ae=(C,E)=>{E.parentNode&&E.parentNode.removeChild(E)},xe={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(C,E,k,V)=>{},render:_,rerender:(C,E,k,V,T,p,b,re,Se)=>{let B=(0,l.partition)(y,se=>se.obj!==b);y=B.left,F(),_(C,E,k,V,T,p,b,re),B.right.length>0&&setTimeout(()=>{ae(null,B.right[0].domElement)})},cleanupVertex:ae,cleanupPort:(C,E)=>{}},ie=((f=e.viewOptions)==null?void 0:f.edges)||{};for(let C in ie){let E=ie[C];E.overlays!=null&&(E.overlays=E.overlays.map(k=>{if(k.jsx!=null){let V=(0,l.uuid)();return{type:l.CustomOverlay.type,options:{create:p=>{let b=document.createElement(l.ELEMENT_DIV);b.className=Je;let re={data:p.edge.data,model:a.current,surface:le,componentId:p.edge.getFullId(),obj:p.edge,props:e.childProps,element:b};return L.push({def:{jsx:k.jsx},data:p.edge.data,obj:p.edge,payload:re,domElement:b,key:V,hydrated:!1}),$(),b}}}}else return k}))}let Le=Object.assign(e.renderOptions||{},{view:e.viewOptions}),le=(0,l.renderSurface)(a.current,o.current,xe,Le);m.set(le),e.surfaceId!=null&&We(e.surfaceId,X);let _e=(C,E)=>{let k=()=>{let T={};return(E.originalData||E.updates)&&(T=(0,l.extend)(E.originalData,E.updates)),T},V=y.find(T=>T.key===C);V!=null&&(V.data=k(),F())},ve=C=>{y=y.filter(E=>E.payload.componentId!==C),F()},Ue=(C,E)=>{let k=()=>{let T={};return(E.originalData||E.updates)&&(T=(0,l.extend)(E.originalData,E.updates)),T},V=L.find(T=>T.obj.id===C);V!=null&&(V.data=k(),$())},Fe=C=>{L=L.filter(E=>E.payload.obj.id!==C),$()};a.current.bind(l.EVENT_NODE_UPDATED,C=>{_e(C.vertex.getFullId(),C)}),a.current.bind(l.EVENT_GROUP_UPDATED,C=>{_e(C.vertex.getFullId(),C)}),a.current.bind(l.EVENT_NODE_REMOVED,C=>{ve(C.node.id)}),a.current.bind(l.EVENT_GROUP_REMOVED,C=>{ve(C.group.id)}),a.current.bind(l.EVENT_EDGE_REMOVED,C=>{Fe(C.edge.id)}),a.current.bind(l.EVENT_EDGE_UPDATED,C=>{Ue(C.edge.id,C)}),a.current.bind(l.EVENT_GRAPH_CLEARED,()=>{y=[],F(),L=[],$()}),e.data?a.current.load({data:e.data,onload:()=>setTimeout(()=>le.repaintEverything(),250)}):e.url&&a.current.load({url:e.url,onload:()=>setTimeout(()=>le.repaintEverything(),250)})}});let Ee=`${e.className||""} vjs-react-surface`,ge=e.style||{};return x.default.createElement("div",{ref:o,className:Ee,style:ge},S.map(f=>Ze.createPortal(M(f),f.domElement,f.key)),j.map(f=>Ze.createPortal(te(f),f.domElement,f.key)),x.default.createElement(g.Provider,{value:m},e.children))});var R=v(require("react")),tt=require("@visuallyjs/browser-ui"),w=(0,R.createContext)(null);function qe(e){return de(e)}function bt(e){let t=(0,R.useRef)(null),r=qe(t);return R.default.createElement(w.Provider,{value:r},e.children||[])}function Dt(){let e=(0,R.useContext)(w);return new Promise((t,r)=>{e!=null?e.listen(n=>t(n)):r()})}var _t=(0,R.forwardRef)((e,t)=>{let r=(0,R.useRef)(null),n=(0,R.useRef)(!1),o,u,a=(0,R.useContext)(w);a==null?(o=(0,R.useRef)(null),a=qe(o)):o=a.Ri();let d=(0,R.useContext)(g);d==null?(u=(0,R.useRef)(null),d=ue(u)):u=d.Ri();let m={getDiagram:()=>o.current};(0,R.useImperativeHandle)(t,()=>m),(0,R.useEffect)(()=>{n.current||(n.current=!0,o.current=(0,tt.createDiagram)(r.current,e.options,e.modelOptions),u.current=o.current.$ui,e.data?o.current.load({data:e.data}):e.url&&o.current.load({url:e.url}),a.set(o.current),d.set(u.current))});let S=`${e.className||""} vjs-react-diagram`,h=e.style||{};return R.default.createElement("div",{ref:r,className:S,style:h},R.default.createElement(g.Provider,{value:d},R.default.createElement(w.Provider,{value:a},e.children)))});var Be=require("@visuallyjs/browser-ui"),G=v(require("react")),vt=(0,G.forwardRef)((e,t)=>{let r=(0,G.useContext)(g),n=(0,G.useContext)(w),o=(0,G.useRef)(!1),u=(0,G.useRef)(null),a;(0,G.useImperativeHandle)(t,()=>({toggleCollapsed:()=>a==null?void 0:a.toggleCollapsed()}));function d(m){m.addPlugin({type:Be.MiniviewPlugin.type,options:{container:u.current,elementFilter:e.elementFilter,typeFunction:e.typeFunction,activeTracking:e.activeTracking,clickToCenter:e.clickToCenter}})}return(0,G.useEffect)(()=>{o.current||(o.current=!0,r!=null?r.listen(d):n!=null&&n.listen(m=>{m.$ui instanceof Be.Surface&&d(m.$ui)}))}),G.default.createElement("div",{ref:u,className:`${e.className||""}`})});var me=require("@visuallyjs/browser-ui"),O=v(require("react")),Tt=(0,O.forwardRef)((e,t)=>{let r=(0,O.useContext)(g),n=(0,O.useContext)(w),o,u=(0,O.useContext)(he);u==null&&(o=(0,O.useRef)(null),u=Ye(o));let[a,d]=(0,O.useState)(null),[m,S]=(0,O.useState)(0),[h,j]=(0,O.useState)(null),c=(0,O.useRef)(!1),y=(0,O.useRef)(null),L=e.className||"";(0,O.useEffect)(()=>{var A;(A=o==null?void 0:o.current)==null||A.$refresh()},[m]);let M=e.onSelectionCleared||(()=>d(null)),ee=(A,$)=>{d(A),e.refresh&&e.refresh(A),S(X=>X+1)};function F(A){o.current=new me.Inspector({container:y.current,ui:A,renderEmptyContainer:M,refresh:ee,autoCommit:e.autoCommit,multipleSelections:e.multipleSelections,filter:e.filter,showCloseButton:e.showCloseButton,afterUpdate:()=>e.afterUpdate?e.afterUpdate(A):null}),j(o.current)}let te={getInspector:()=>h};return(0,O.useImperativeHandle)(t,()=>te),(0,O.useEffect)(()=>{c.current||(c.current=!0,r!=null?r.listen(F):n!=null?n.listen(A=>{A.$ui instanceof me.Surface&&F(A.$ui)}):(0,me.log)("WARN: InspectorComponent cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))}),O.default.createElement("div",{ref:y,className:L},O.default.createElement(he.Provider,{value:u},a!=null&&O.default.createElement(O.default.Fragment,null,typeof e.children=="function"?e.children(a,o.current.$ui.model):e.children||[]),a==null&&O.default.createElement(O.default.Fragment,null,e.renderEmptyContent&&e.renderEmptyContent())))});var An="group:added",wn="group:member:added",Mn="group:member:removed",In="group:removed",Vn="dataLoadStart",Bn="dataAppendStart",jn="dataLoadEnd",kn="dataAppendEnd",Gn="dataUpdated",Ln="graphClearStart",Un="graphCleared",Fn="graphChanged",zn="group:updated",Hn="node:updated",Wn="port:updated",Jn="edge:updated",$n="edge:added",Xn="node:added",Yn="edge:removed",Zn="node:removed",qn="port:added",Kn="port:removed",Qn="edge:target",ea="edge:source",rt="select",ot="deselect",nt="selection:cleared",ta="edge:geometry",ra="edge:pathEdited",oa="edge:typeChanged",na="node:typeChanged",aa="port:typeChanged",ia="group:typeChanged",la="group:move:start",sa="group:move",ca="group:move:end",ua="internal:group:sizeChanged",da="internal:group:sizeChangedRedo",ma="internal:group:sizeChangedUndo",pa="renderer:added",fa="node:move:start",Ca="node:move",Ea="node:move:end",ga="undoredo:update",xa="undo",Sa="redo",Oa="destroy";var s=v(require("react")),i=require("@visuallyjs/browser-ui"),it="can-undo",lt="can-redo",je="vjs-selected-mode",at="vjs-controls-has-selection";function Nt(e){let t="Clear selection",[r,n]=(0,s.useState)("row"),[o,u]=(0,s.useState)(!1),[a,d]=(0,s.useState)(!1),m=(0,s.useContext)(g),S=(0,s.useContext)(w),h=(0,s.useRef)(null),j=(0,s.useRef)(!1),c=(0,s.useRef)(null),[y,L]=(0,s.useState)("Clear dataset?"),M=(0,s.useRef)(null),[ee,F]=(0,s.useState)(!0),[te,A]=(0,s.useState)(!1),[$,X]=(0,s.useState)(!0),[Ee,ge]=(0,s.useState)(!0),[f,_]=(0,s.useState)([]),[ae,xe]=(0,s.useState)([]);function ie(p){c.current=p,e.clearMessage&&L(e.clearMessage),e.onMaybeClear&&(M.current=e.onMaybeClear),e.orientation&&n(e.orientation),e.undoRedo===!1&&X(!1),e.zoomToExtents===!1&&F(!1),e.zoomButtons===!0&&A(!0),e.clear===!1&&ge(!1);let b=(e.buttons||[]).filter(B=>B.mode!=null);_(b);let re=(e.buttons||[]).filter(B=>B.mode==null);xe(re),p.bind(i.EVENT_SURFACE_MODE_CHANGED,B=>{p.removeClass(p.$getSelector(h.current,"[data-mode]"),je),p.addClass(p.$getSelector(h.current,"[data-mode='"+B+"']"),je)}),p.model.bind(i.EVENT_UNDOREDO_UPDATE,B=>{h.current.setAttribute(it,B.undoCount>0?i.TRUE:i.FALSE),h.current.setAttribute(lt,B.redoCount>0?i.TRUE:i.FALSE)}),p.model.bind(rt,V),p.model.bind(ot,V),p.model.bind(nt,V);let Se=p.getPlugin(i.LassoPlugin.type);u(Se!=null),d(Se!=null||b.length>0)}function Le(){c.current.model.clearSelection(),c.current.zoomToFit()}function le(){c.current.zoomIn()}function _e(){c.current.zoomOut()}function ve(){c.current.setMode(i.SURFACE_MODE_PAN)}function Ue(){c.current.setMode(i.SURFACE_MODE_SELECT)}function Fe(){c.current.model.clearSelection(),(0,i.supportsPathEditing)(c.current)&&c.current.stopEditingPath()}function C(){M.current!=null?M.current(()=>c.current.model.clear()):window.confirm(y)&&c.current.model.clear()}function E(){c.current.model.undo()}function k(){c.current.model.redo()}let V=()=>{c.current.model.getSelection().isEmpty()?h.current.removeAttribute(at):h.current.setAttribute(at,"true")};(0,s.useEffect)(()=>{j.current===!1&&(j.current=!0,e.surfaceId!=null?Pe(e.surfaceId,p=>ie(p.getSurface())):m!=null?m.listen(ie):S!=null?S.listen(p=>{p.$ui instanceof i.Surface&&ie(p.$ui)}):(0,i.log)("WARN: controls component cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))});let T=e.style||{};return s.default.createElement("div",{style:T,ref:h,className:`vjs-controls ${e.className||""}`,"data-vjs-orientation":r},a&&s.default.createElement("i",{className:"vjs-pan-mode "+je,"data-mode":i.SURFACE_MODE_PAN,title:"Pan Mode",onClick:()=>ve()},s.default.createElement("svg",{fill:"none",viewBox:i.PAN_VIEW_BOX,stroke:"currentColor"},s.default.createElement("path",{d:i.PAN_PATH}))),o&&s.default.createElement("i",{className:"vjs-select-mode","data-mode":i.SURFACE_MODE_SELECT,title:"Select Mode",onClick:()=>Ue()},s.default.createElement("svg",{fill:"currentColor",viewBox:i.LASSO_VIEW_BOX,stroke:"currentColor"},s.default.createElement("path",{d:i.LASSO_PATH}))),f.map(p=>s.default.createElement("i",{className:p.class,title:p.title,onClick:b=>p.handler(b,p.id)})),ee&&s.default.createElement("i",{className:"vjs-zoom-to-fit","data-reset":"true",title:"Zoom To Fit",onClick:()=>Le()},s.default.createElement("svg",{viewBox:i.ZOOM_TO_FIT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},s.default.createElement("path",{d:i.ZOOM_TO_FIT_PATH}))),te&&s.default.createElement(s.default.Fragment,null,s.default.createElement("i",{className:"vjs-zoom-in","data-zoom-in":"true",title:"Zoom In",onClick:()=>le()},s.default.createElement("svg",{viewBox:i.ZOOM_IN_OUT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},s.default.createElement("path",{d:i.ZOOM_IN_PATH}))),s.default.createElement("i",{className:"vjs-zoom-out","data-zoom-out":"true",title:"Zoom Out",onClick:()=>_e()},s.default.createElement("svg",{viewBox:i.ZOOM_IN_OUT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},s.default.createElement("path",{d:i.ZOOM_OUT_PATH})))),$&&s.default.createElement("i",{className:"vjs-undo","data-undo":"true",title:"Undo last action",onClick:()=>E()}),$&&s.default.createElement("i",{className:"vjs-redo","data-redo":"true",title:"Redo last action",onClick:()=>k()}),s.default.createElement("i",{className:i.CLASS_CONTROLS_RESET_SELECTION,title:t,onClick:()=>Fe()},s.default.createElement("svg",{viewBox:i.RESET_SELECTION_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},s.default.createElement("path",{d:i.RESET_SELECTION_PATH}))),Ee&&s.default.createElement("i",{className:"vjs-clear-dataset",title:y,onClick:()=>C()},s.default.createElement("svg",{viewBox:i.CLEAR_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},s.default.createElement("path",{d:i.CLEAR_PATH}))),ae.map(p=>s.default.createElement("i",{className:p.class,title:p.title,onClick:b=>p.handler(b,p.id)})))}var P=v(require("react")),U=require("@visuallyjs/browser-ui");function At(e){let t=(0,P.useRef)(!1),r=(0,P.useRef)(null),n=(0,P.useContext)(g),o=(0,P.useContext)(w),[u,a]=(0,P.useState)(!0),[d,m]=(0,P.useState)("Export :"),[S,h]=(0,P.useState)(null),[j,c]=(0,P.useState)(null),[y,L]=(0,P.useState)(null),[M,ee]=(0,P.useState)(!0),[F,te]=(0,P.useState)(!0),[A,$]=(0,P.useState)(!0);function X(_){r.current=_,e.label&&m(d),e.showLabel!=null&&a(e.showLabel),e.margins&&h(e.margins);let ae=e.svgOptions||{};c(ae);let xe=e.imageOptions||{};L(xe),e.allowJpgExport!=null&&$(e.allowJpgExport),e.allowPngExport!=null&&te(e.allowPngExport),e.allowSvgExport!=null&&ee(e.allowSvgExport)}function Ee(){new U.SvgExportUI(r.current).export(j)}function ge(){new U.ImageExportUI(r.current).export(y)}function f(){new U.ImageExportUI(r.current).export(Object.assign(y||{},{type:"image/jpeg"}))}return(0,P.useEffect)(()=>{t.current===!1&&(t.current=!0,e.surfaceId!=null?Pe(e.surfaceId,_=>X(_.getSurface())):n!=null?n.listen(X):o!=null?o.listen(_=>{_.$ui instanceof U.Surface&&X(_.$ui)}):(0,U.log)("WARN: export controls component cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))}),P.default.createElement("div",{className:`${U.CLASS_CONTROLS} ${U.CLASS_EXPORT_CONTROLS}`},u&&P.default.createElement("span",null,d),M&&P.default.createElement("i",null,P.default.createElement("a",{href:"#",id:"exportSvg",onClick:()=>Ee()},"SVG")),F&&P.default.createElement("i",null,P.default.createElement("a",{href:"#",id:"exportPng",onClick:()=>ge()},"PNG")),A&&P.default.createElement("i",null,P.default.createElement("a",{href:"#",id:"exportJpg",onClick:()=>f()},"JPG")))}var z=v(require("react")),be=require("@visuallyjs/browser-ui"),wt=(0,z.forwardRef)((e,t)=>{let r=(0,z.useRef)(!1),n=(0,z.useRef)(null),o=(0,z.useContext)(g),u=(0,z.useRef)(null),a=e.className||"";function d(m){m.getShapeLibrary()!=null?u.current=new be.ShapePalette(m,{container:n.current,dataGenerator:e.dataGenerator,dragSize:e.dragSize,iconSize:e.iconSize,fill:e.fill,outline:e.outline,showAllMessage:e.showAllMessage,selectAfterDrop:e.selectAfterDrop,paletteStrokeWidth:e.paletteStrokeWidth,initialSet:e.initialSet,mode:e.mode,allowClickToAdd:e.allowClickToAdd,onVertexAdded:e.onVertexAdded,showLabels:e.showLabels,inspector:e.inspector!==!1,preparedShapes:e.preparedShapes}):(0,be.log)("WARN: no shapeLibrary provided in props and UI has no shape library. Cannot instantiate ShapePaletteComponent")}return(0,z.useEffect)(()=>{r.current||(r.current=!0,o!=null?o.listen(m=>d(m)):e.surface!=null?d(e.surface):(0,be.log)("ShapePaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),z.default.createElement("div",{ref:n,className:a})});var pe=v(require("react")),fe=require("@visuallyjs/browser-ui"),st=120,ct=90;function Mt(e){let t=(0,pe.useRef)(null);function r(){return e.ctx.obj.data.outlineWidth||2}function n(){return e.ctx.obj.data.fill||"#FFFFFF"}function o(){return e.ctx.obj.data.outline||"#000000"}function u(){return e.ctx.obj.data.width||st}function a(){return e.ctx.obj.data.height||ct}function d(){return e.ctx.obj.data.color||e.ctx.obj.data.outline||"#000000"}function m(){return e.labelProperty||"label"}return(0,pe.useEffect)(()=>{let S=e.ctx.obj.data,h=e.ctx.ui.getShapeLibrary(),j=h.renderCompiledShape(S);if(t.current.replaceChildren(j),e.showLabels){let c=h.renderShapeLabel(S,m(),e.labelStrokeWidth,null,d(),d(),e.font);t.current.appendChild(c),e.multilineLabels!=!1&&(0,fe.convertToMultilineText)(c,S[m()]||"",u()*(e.labelFillRatio||fe.DEFAULT_LABEL_FILL_RATIO))}}),pe.default.createElement("svg",{className:fe.CLASS_SHAPE,ref:t,strokeWidth:r(),fill:n(),stroke:o(),preserveAspectRatio:"none",viewBox:"0 0 "+u()+" "+a()})}var H=v(require("react")),Ce=require("@visuallyjs/browser-ui"),It=(0,H.forwardRef)((e,t)=>{let r=(0,H.useRef)(!1),n=(0,H.useRef)(null),o=(0,H.useContext)(g),u=(0,H.useRef)(null),a=e.className||"";function d(m){let S={selector:e.selector,source:n.current,dataGenerator:h=>e.dataGenerator?e.dataGenerator(h):(0,Ce.defaultDataGenerator)(h),allowDropOnEdge:e.allowDropOnEdge===!0,allowDropOnGroup:e.allowDropOnGroup!==!1,allowDropOnCanvas:e.allowDropOnCanvas!==!1,allowDropOnNode:e.allowDropOnNode===!0,ignoreDropOnNode:e.ignoreDropOnNode===!0,typeGenerator:e.typeGenerator,groupIdentifier:e.groupIdentifier,dragSize:e.dragSize,canvasDropFilter:e.canvasDropFilter,mode:e.mode,onVertexAdded:e.onVertexAdded,selectAfterAdd:e.selectAfterAdd,allowClickToAdd:e.allowClickToAdd,clickToAddOnly:e.clickToAddOnly};u.current=new Ce.Palette(m,S)}return(0,H.useEffect)(()=>{r.current||(r.current=!0,o!=null?o.listen(m=>d(m)):e.surface!=null?d(e.surface):(0,Ce.log)("PaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),H.default.createElement("div",{className:a,ref:n},e.children)});var W=v(require("react")),N=require("@visuallyjs/browser-ui");function Vt(e){let t=e.maxColors||10,r=(0,W.useRef)(null),n=(0,W.useRef)(!1),o=Re(),[u,a]=(0,W.useState)(o.ensureContext(N.INSPECTOR_CONTEXT_RECENT_COLORS,()=>[]));function d(c){let y=o.ensureContext(N.INSPECTOR_CONTEXT_RECENT_COLORS,()=>[]);if(c=c.toUpperCase(),!(y.find(M=>M.toUpperCase()===c)!=null)){let M=y.slice();M.unshift(c),M.length>t&&(M.length=t),o.updateContext(N.INSPECTOR_CONTEXT_RECENT_COLORS,M)}}function m(){let c=r.current.value;o.setValue(e.propertyName,c),d(c)}function S(c){o.setValue(e.propertyName,c),r.current.value=c}let h=c=>{c.key===N.INSPECTOR_CONTEXT_RECENT_COLORS&&a(c.value.slice())};function j(){let c=o.getValue(e.propertyName);c!=null&&r.current&&d(c)}return(0,W.useEffect)(()=>(o.bind(N.EVENT_CONTEXT_UPDATE,h),o.bind(N.EVENT_CHANGE,j),n.current||(n.current=!0,r.current.addEventListener(N.EVENT_CHANGE,m)),setTimeout(j),()=>{o.unbind(N.EVENT_CONTEXT_UPDATE,h),o.unbind(N.EVENT_CHANGE,j)})),W.default.createElement("div",{className:N.CLASS_COLOR_PICKER},W.default.createElement("input",{type:"color",ref:r,"vjs-att":e.propertyName}),W.default.createElement("div",{className:N.CLASS_COLOR_PICKER_SWATCHES},u.map(c=>W.default.createElement("div",{key:c,title:c,className:N.CLASS_COLOR_PICKER_SWATCH,style:{backgroundColor:c},"data-color":c,onClick:()=>S(c)}))))}var J=v(require("react")),ke=require("@visuallyjs/browser-ui"),Bt=(0,J.forwardRef)((e,t)=>{let r=(0,J.useRef)(!1),n=(0,J.useRef)(null),o=(0,J.useContext)(w),u=(0,J.useRef)(null),a=e.className||"";function d(S){u.current=new ke.DiagramPalette(n.current,S,{fill:e.fill,outline:e.outline,dragSize:e.dragSize,inspector:e.inspector,iconSize:e.iconSize,showLabels:e.showLabels,paletteStrokeWidth:e.paletteStrokeWidth,showAllMessage:e.showAllMessage,onCellAdded:e.onCellAdded,mode:e.mode,allowClickToAdd:e.allowClickToAdd,autoExitDrawMode:e.autoExitDrawMode,selectAfterAdd:e.selectAfterAdd,onVertexAdded:e.onVertexAdded,preparedShapes:e.preparedShapes})}(0,J.useEffect)(()=>{r.current||(r.current=!0,o!=null?o.listen(S=>d(S)):e.diagram!=null?d(e.diagram):(0,ke.log)("DiagramPaletteComponent cannot start: no DiagramContext from a provider found, and no Diagram provided in props"))});let m=e.style||{};return J.default.createElement("div",{ref:n,className:a,style:m})});var I=v(require("react")),D=require("@visuallyjs/browser-ui");function Y(e){let t=(0,I.useRef)(null),r=(0,I.useRef)(!1),n=(0,I.useRef)(!1),o=(0,I.useRef)(null),u=e.style||{},a=(0,I.useContext)(g),d=(0,I.useContext)(w);return(0,I.useEffect)(()=>{if(!r.current)if(r.current=!0,a!=null)a.listen(m=>{let S=Object.assign({dataSource:m.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(t.current,S),n.current=!0});else if(d!=null)d.listen(m=>{let S=Object.assign({dataSource:m.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(t.current,S),n.current=!0});else{let m=Object.assign({dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(t.current,m),e.data?o.current.load({data:e.data},()=>n.current=!0):e.url?o.current.load({url:e.url},()=>n.current=!0):n.current=!0}}),e.reactive!==!1&&((0,I.useEffect)(()=>{n.current&&e.data!=null&&o.current&&o.current.load({data:e.data})},[e.data]),(0,I.useEffect)(()=>{n.current&&e.url!=null&&o.current&&o.current.load({url:e.url})},[e.url]),(0,I.useEffect)(()=>{n.current&&e.pivot!=null&&o.current&&o.current.pivot&&o.current.pivot(e.pivot)},[e.pivot]),(0,I.useEffect)(()=>{n.current&&e.dataSourceFilter!=null&&o.current&&o.current.setDataSourceFilter&&o.current.setDataSourceFilter(e.dataSourceFilter)},[e.dataSourceFilter])),I.default.createElement("div",{ref:t,style:u,className:`${e.className||""}`})}function jt(e){let t=Object.assign({createChart:(r,n)=>new D.ColumnChart(r,n)},e);return Y(t)}function kt(e){let t=Object.assign({createChart:(r,n)=>new D.BarChart(r,n)},e);return Y(t)}function Gt(e){let t=Object.assign({createChart:(r,n)=>new D.CategoryValueChart(r,n)},e);return Y(t)}function Lt(e){let t=Object.assign({createChart:(r,n)=>new D.LineChart(r,n)},e);return Y(t)}function Ut(e){let t=Object.assign({createChart:(r,n)=>new D.AreaChart(r,n)},e);return Y(t)}function Ft(e){let t=Object.assign({createChart:(r,n)=>new D.PieChart(r,n)},e);return Y(t)}function zt(e){let t=Object.assign({createChart:(r,n)=>new D.ScatterChart(r,n)},e);return Y(t)}function Ht(e){let t=Object.assign({createChart:(r,n)=>new D.BubbleChart(r,n)},e);return Y(t)}function Wt(e){let t=Object.assign({createChart:(r,n)=>new D.GaugeChart(r,n)},e);return Y(t)}function Jt(e){let t=Object.assign({createChart:(r,n)=>new D.SankeyChart(r,n)},e);return e.interactive!=null&&(t.options.interactive=e.interactive),e.pivot!=null&&(t.options.pivot=e.pivot),e.csvData&&(t.options.csvData=e.csvData),e.jsonData&&(t.options.jsonData=e.jsonData),Y(t)}var ut=require("@visuallyjs/browser-ui"),q=v(require("react"));function Ke(e){let t=(0,q.useRef)(!1),r=(0,q.useRef)(null),n=(0,q.useContext)(g),o=e.position||{x:0,y:0};function u(a){e.placement==="fixed"?a.fixElement(r.current,o,e.constraints):a.floatElement(r.current,o)}return(0,q.useEffect)(()=>{t.current||(t.current=!0,n!=null?n.listen(a=>u(a)):(0,ut.log)("Decorator cannot mount: no SurfaceContext from a provider found"))}),q.default.createElement("div",{ref:r},e.children)}var Z=require("@visuallyjs/browser-ui"),De=v(require("react"));function Ge(e){let t=(0,De.useRef)(!1);function r(n){if(!t.current){t.current=!0;try{n&&n.addPlugin({type:Z.BackgroundPlugin.type,options:e})}catch(o){(0,Z.log)(`WARN: BackgroundComponent could not mount background ${o}`)}}}return Xe().then(r),De.default.createElement(De.default.Fragment,null)}function $t(e){return Ge(Object.assign({type:Z.GeneratedGridBackground.type},e))}function Xt(e){return Ge(Object.assign({type:Z.SimpleBackground.type},e))}function Yt(e){return Ge(Object.assign({type:Z.TiledBackground.type},e))}

package/visuallyjs.browser-ui-react.es.js

@@ -0,0 +1 @@
+import{log as Ie}from"@visuallyjs/browser-ui";var Ve=new Map,Z={};function Be(e,t){Ve.set(e,t),Pt(e,t)}function Pt(e,t){(Z[e]||[]).forEach(n=>{try{n(t)}catch(o){Ie("WARN: an error was reported invoking a SurfaceComponentRefCallback "+o)}}),delete Z[e]}function ae(e,t){let r=Ve.get(e);if(r)try{t(r)}catch(n){Ie("WARN: an error was reported invoking a SurfaceComponentRefCallback "+n)}else Z[e]=Z[e]||[],Z[e].push(t)}var xe="vjs-react-node",Se="vjs-react-group",je="vjs-react-overlay";import ke,{useEffect as ht,useRef as Rt}from"react";function Oe(e){let t=Rt(!1);return ht(()=>{t.current||(t.current=!0,e.cb(e.ns))}),ke.createElement(ke.Fragment,null,e.ns.def.jsx({obj:e.ns.obj,model:e.model,ui:e.ui,data:e.ns.obj.data,props:e.childProps||{}}))}import{BrowserUIModel as yt,log as bt}from"@visuallyjs/browser-ui";var q=class extends yt{render(t,r){return bt("render called directly on BrowserUIReactModel class: should not happen. UI components should use internal render."),null}};function Ge(e){return e=e||{},new q(e)}import{createContext as Dt,default as _t,useRef as vt,useContext as Tt}from"react";var E=Dt(null);function Kn(e){let t=vt(null),r=K(t);return _t.createElement(E.Provider,{value:r},e.children||[])}function K(e){return Q(e)}function Q(e){let t=[];return{set:r=>{e.current=r,t.forEach(n=>n(r))},listen:r=>{e.current==null?t.push(r):r(e.current)},Ri:()=>e}}function Le(){let e=Tt(E);return new Promise((t,r)=>{e!=null?e.listen(n=>t(n)):r()})}import{createContext as Nt,useContext as At}from"react";var ie=Nt(null);function Ue(e){return Q(e)}function le(){let e=At(ie);return e==null?null:e.Ri().current}import wt,{useRef as Pe,useEffect as Mt}from"react";import{INSPECTOR_CONTEXT_EDGE_PROPERTY_MAPPINGS as It,EdgeTypePicker as Vt}from"@visuallyjs/browser-ui";function Ca(e){let t=Pe(!1),r=Pe(null),n=Pe(null),o=le(),{propertyName:l}=e,a=()=>o.getFromContext(It)||o.$ui.$getEdgePropertyMappings();return Mt(()=>{t.current||(t.current=!0,n.current=new Vt(o.$ui,r.current,a(),o.getValue(l),(s,c)=>{o.setValue(l,c)}),n.current.render(l,o.Qe),o.onChange(()=>{n.current.select(l,o.getValue(l))}))}),wt.createElement("div",{ref:r})}import Bt,{createContext as jt,useContext as Fe}from"react";var se=jt(void 0);function Da(e){let t=Ge(e.modelOptions||{});return Bt.createElement(se.Provider,{value:t},e.children||[])}function _a(){let e=Fe(se);return new Promise((t,r)=>{if(e==null){let n=Fe(E);n!=null?n.listen(o=>t(o.model)):r()}else t(e)})}import V,{forwardRef as kt,useContext as ze,useEffect as Gt,useImperativeHandle as Lt,useRef as ee,useState as He}from"react";import*as Re from"react-dom";import{addClass as We,ELEMENT_DIV as Je,ELEMENT_SVG as Ut,ElementTypes as Ft,EVENT_GRAPH_CLEARED as zt,EVENT_GROUP_REMOVED as Ht,EVENT_GROUP_UPDATED as Wt,EVENT_NODE_REMOVED as Jt,EVENT_NODE_UPDATED as $t,extend as $e,isGroup as he,renderSurface as Xt,CLASS_DEFAULT_NODE as Yt,CLASS_DEFAULT_GROUP as Zt,CustomOverlay as qt,EVENT_EDGE_REMOVED as Kt,EVENT_EDGE_UPDATED as Qt,uuid as er,partition as tr,$svgNode as rr,ATTRIBUTE_NOT_DRAGGABLE as Xe,TRUE as Ye}from"@visuallyjs/browser-ui";var ii=kt((e,t)=>{let r=ee(!1),n=ze(se),o=ee(null),l=ee(null),a=ee(null),s,c=ze(E);c==null?(s=ee(null),c=K(s)):s=c.Ri();let[C,g]=He([]),[_,i]=He([]),x=[],T=[];function R(d){return V.createElement(Oe,{ns:d,model:a.current,ui:s.current,childProps:e.childProps,cb:O=>{k(O)}})}function k(d){if(d.hydrated!==!0){let O=he(d.obj)?Se:xe;d.domElement.firstElementChild&&(We(d.domElement.firstElementChild,O),d.domElement.firstElementChild.getAttribute(Xe)===Ye&&d.domElement.setAttribute(Xe,Ye)),s.current.$vertexRendered(d.obj,d.domElement,d.def,d.payload.eventInfo),d.hydrated=!0}else s.current.$revalidateElement(d.domElement)}function N(){g(x.slice())}function G(d){return V.createElement(Oe,{ns:d,model:a.current,ui:s.current,childProps:e.childProps,cb:O=>{h(O)}})}function h(d){if(d.hydrated!==!0){let O=he(d.obj)?Se:xe;d.domElement.firstElementChild&&We(d.domElement.firstElementChild,O),d.hydrated=!0}else s.current.$revalidateElement(d.domElement)}function A(){i(T.slice())}let w={getSurface:()=>s.current,getModel:()=>a.current};Lt(t,()=>w),Gt(()=>{var d;if(!r.current){r.current=!0,e.model!=null?a.current=e.model:n==null?a.current=new q(e.modelOptions||{}):a.current=n,typeof document!="undefined"&&(l.current=document.createElement("div"),l.current.style.position="fixed",l.current.style.left="10000px",l.current.style.top="10000px",l.current.style.width="100px",l.current.style.height="100px",l.current.style.opacity="0",o.current.appendChild(l.current));let O=(m,p,v,b,P,u,S,L)=>{let[Y,D]=u.component||u.jsx?[u,null]:he(S)?[Object.assign(Object.assign({},u),{jsx:ge=>V.createElement(V.Fragment,null,ge.obj.data.label)}),Zt]:[Object.assign(Object.assign({},u),{jsx:ge=>V.createElement(V.Fragment,null,ge.obj.data.label)}),Yt],H=P.containerType===Ft.HTML?document.createElement(Je):rr(Ut);l.current.appendChild(H),D!=null&&P.$addClassToElement(H,D);let Ot={data:p,model:v,surface:P,componentId:S.getFullId(),obj:S,props:e.childProps,element:H,eventInfo:L};x.push({data:p,def:Y,payload:Ot,domElement:H,key:S.id,obj:S,hydrated:!1}),N()},U=(m,p)=>{p.parentNode&&p.parentNode.removeChild(p)},X={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(m,p,v,b)=>{},render:O,rerender:(m,p,v,b,P,u,S,L,Y)=>{let D=tr(x,H=>H.obj!==S);x=D.left,N(),O(m,p,v,b,P,u,S,L),D.right.length>0&&setTimeout(()=>{U(null,D.right[0].domElement)})},cleanupVertex:U,cleanupPort:(m,p)=>{}},F=((d=e.viewOptions)==null?void 0:d.edges)||{};for(let m in F){let p=F[m];p.overlays!=null&&(p.overlays=p.overlays.map(v=>{if(v.jsx!=null){let b=er();return{type:qt.type,options:{create:u=>{let S=document.createElement(Je);S.className=je;let L={data:u.edge.data,model:a.current,surface:z,componentId:u.edge.getFullId(),obj:u.edge,props:e.childProps,element:S};return T.push({def:{jsx:v.jsx},data:u.edge.data,obj:u.edge,payload:L,domElement:S,key:b,hydrated:!1}),A(),S}}}}else return v}))}let fe=Object.assign(e.renderOptions||{},{view:e.viewOptions}),z=Xt(a.current,o.current,X,fe);c.set(z),e.surfaceId!=null&&Be(e.surfaceId,w);let oe=(m,p)=>{let v=()=>{let P={};return(p.originalData||p.updates)&&(P=$e(p.originalData,p.updates)),P},b=x.find(P=>P.key===m);b!=null&&(b.data=v(),N())},ne=m=>{x=x.filter(p=>p.payload.componentId!==m),N()},Ce=(m,p)=>{let v=()=>{let P={};return(p.originalData||p.updates)&&(P=$e(p.originalData,p.updates)),P},b=T.find(P=>P.obj.id===m);b!=null&&(b.data=v(),A())},Ee=m=>{T=T.filter(p=>p.payload.obj.id!==m),A()};a.current.bind($t,m=>{oe(m.vertex.getFullId(),m)}),a.current.bind(Wt,m=>{oe(m.vertex.getFullId(),m)}),a.current.bind(Jt,m=>{ne(m.node.id)}),a.current.bind(Ht,m=>{ne(m.group.id)}),a.current.bind(Kt,m=>{Ee(m.edge.id)}),a.current.bind(Qt,m=>{Ce(m.edge.id,m)}),a.current.bind(zt,()=>{x=[],N(),T=[],A()}),e.data?a.current.load({data:e.data,onload:()=>setTimeout(()=>z.repaintEverything(),250)}):e.url&&a.current.load({url:e.url,onload:()=>setTimeout(()=>z.repaintEverything(),250)})}});let J=`${e.className||""} vjs-react-surface`,$=e.style||{};return V.createElement("div",{ref:o,className:J,style:$},C.map(d=>Re.createPortal(R(d),d.domElement,d.key)),_.map(d=>Re.createPortal(G(d),d.domElement,d.key)),V.createElement(E.Provider,{value:c},e.children))});import ce,{createContext as or,forwardRef as nr,useContext as ye,useEffect as ar,useImperativeHandle as ir,useRef as te}from"react";import{createDiagram as lr}from"@visuallyjs/browser-ui";var y=or(null);function Ze(e){return Q(e)}function Ri(e){let t=te(null),r=Ze(t);return ce.createElement(y.Provider,{value:r},e.children||[])}function yi(){let e=ye(y);return new Promise((t,r)=>{e!=null?e.listen(n=>t(n)):r()})}var bi=nr((e,t)=>{let r=te(null),n=te(!1),o,l,a=ye(y);a==null?(o=te(null),a=Ze(o)):o=a.Ri();let s=ye(E);s==null?(l=te(null),s=K(l)):l=s.Ri();let c={getDiagram:()=>o.current};ir(t,()=>c),ar(()=>{n.current||(n.current=!0,o.current=lr(r.current,e.options,e.modelOptions),l.current=o.current.$ui,e.data?o.current.load({data:e.data}):e.url&&o.current.load({url:e.url}),a.set(o.current),s.set(l.current))});let C=`${e.className||""} vjs-react-diagram`,g=e.style||{};return ce.createElement("div",{ref:r,className:C,style:g},ce.createElement(E.Provider,{value:s},ce.createElement(y.Provider,{value:a},e.children)))});import{MiniviewPlugin as sr,Surface as cr}from"@visuallyjs/browser-ui";import ur,{forwardRef as dr,useContext as qe,useEffect as mr,useImperativeHandle as pr,useRef as Ke}from"react";var Vi=dr((e,t)=>{let r=qe(E),n=qe(y),o=Ke(!1),l=Ke(null),a;pr(t,()=>({toggleCollapsed:()=>a==null?void 0:a.toggleCollapsed()}));function s(c){c.addPlugin({type:sr.type,options:{container:l.current,elementFilter:e.elementFilter,typeFunction:e.typeFunction,activeTracking:e.activeTracking,clickToCenter:e.clickToCenter}})}return mr(()=>{o.current||(o.current=!0,r!=null?r.listen(s):n!=null&&n.listen(c=>{c.$ui instanceof cr&&s(c.$ui)}))}),ur.createElement("div",{ref:l,className:`${e.className||""}`})});import{Inspector as fr,log as Cr,Surface as Er}from"@visuallyjs/browser-ui";import W,{forwardRef as gr,useContext as be,useEffect as Qe,useImperativeHandle as xr,useRef as De,useState as _e}from"react";var Xi=gr((e,t)=>{let r=be(E),n=be(y),o,l=be(ie);l==null&&(o=De(null),l=Ue(o));let[a,s]=_e(null),[c,C]=_e(0),[g,_]=_e(null),i=De(!1),x=De(null),T=e.className||"";Qe(()=>{var h;(h=o==null?void 0:o.current)==null||h.$refresh()},[c]);let R=e.onSelectionCleared||(()=>s(null)),k=(h,A)=>{s(h),e.refresh&&e.refresh(h),C(w=>w+1)};function N(h){o.current=new fr({container:x.current,ui:h,renderEmptyContainer:R,refresh:k,autoCommit:e.autoCommit,multipleSelections:e.multipleSelections,filter:e.filter,showCloseButton:e.showCloseButton,afterUpdate:()=>e.afterUpdate?e.afterUpdate(h):null}),_(o.current)}let G={getInspector:()=>g};return xr(t,()=>G),Qe(()=>{i.current||(i.current=!0,r!=null?r.listen(N):n!=null?n.listen(h=>{h.$ui instanceof Er&&N(h.$ui)}):Cr("WARN: InspectorComponent cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))}),W.createElement("div",{ref:x,className:T},W.createElement(ie.Provider,{value:l},a!=null&&W.createElement(W.Fragment,null,typeof e.children=="function"?e.children(a,o.current.$ui.model):e.children||[]),a==null&&W.createElement(W.Fragment,null,e.renderEmptyContent&&e.renderEmptyContent())))});var Zi="group:added",qi="group:member:added",Ki="group:member:removed",Qi="group:removed",el="dataLoadStart",tl="dataAppendStart",rl="dataLoadEnd",ol="dataAppendEnd",nl="dataUpdated",al="graphClearStart",il="graphCleared",ll="graphChanged",sl="group:updated",cl="node:updated",ul="port:updated",dl="edge:updated",ml="edge:added",pl="node:added",fl="edge:removed",Cl="node:removed",El="port:added",gl="port:removed",xl="edge:target",Sl="edge:source",et="select",tt="deselect",rt="selection:cleared",Ol="edge:geometry",Pl="edge:pathEdited",hl="edge:typeChanged",Rl="node:typeChanged",yl="port:typeChanged",bl="group:typeChanged",Dl="group:move:start",_l="group:move",vl="group:move:end",Tl="internal:group:sizeChanged",Nl="internal:group:sizeChangedRedo",Al="internal:group:sizeChangedUndo",wl="renderer:added",Ml="node:move:start",Il="node:move",Vl="node:move:end",Bl="undoredo:update",jl="undo",kl="redo",Gl="destroy";import f,{useContext as ot,useEffect as Sr,useRef as ue,useState as M}from"react";import{EVENT_UNDOREDO_UPDATE as Or,FALSE as nt,LASSO_PATH as Pr,LASSO_VIEW_BOX as hr,LassoPlugin as Rr,log as yr,PAN_PATH as br,PAN_VIEW_BOX as Dr,Surface as _r,SURFACE_MODE_PAN as at,SURFACE_MODE_SELECT as it,TRUE as lt,ZOOM_TO_FIT_PATH as vr,ZOOM_TO_FIT_VIEW_BOX as Tr,EVENT_SURFACE_MODE_CHANGED as Nr,ZOOM_IN_OUT_VIEW_BOX as st,ZOOM_IN_PATH as Ar,ZOOM_OUT_PATH as wr,RESET_SELECTION_PATH as Mr,RESET_SELECTION_VIEW_BOX as Ir,CLEAR_PATH as Vr,CLEAR_VIEW_BOX as Br,CLASS_CONTROLS_RESET_SELECTION as jr,supportsPathEditing as kr}from"@visuallyjs/browser-ui";var Gr="can-undo",Lr="can-redo",ve="vjs-selected-mode",ct="vjs-controls-has-selection";function Kl(e){let t="Clear selection",[r,n]=M("row"),[o,l]=M(!1),[a,s]=M(!1),c=ot(E),C=ot(y),g=ue(null),_=ue(!1),i=ue(null),[x,T]=M("Clear dataset?"),R=ue(null),[k,N]=M(!0),[G,h]=M(!1),[A,w]=M(!0),[J,$]=M(!0),[d,O]=M([]),[U,X]=M([]);function F(u){i.current=u,e.clearMessage&&T(e.clearMessage),e.onMaybeClear&&(R.current=e.onMaybeClear),e.orientation&&n(e.orientation),e.undoRedo===!1&&w(!1),e.zoomToExtents===!1&&N(!1),e.zoomButtons===!0&&h(!0),e.clear===!1&&$(!1);let S=(e.buttons||[]).filter(D=>D.mode!=null);O(S);let L=(e.buttons||[]).filter(D=>D.mode==null);X(L),u.bind(Nr,D=>{u.removeClass(u.$getSelector(g.current,"[data-mode]"),ve),u.addClass(u.$getSelector(g.current,"[data-mode='"+D+"']"),ve)}),u.model.bind(Or,D=>{g.current.setAttribute(Gr,D.undoCount>0?lt:nt),g.current.setAttribute(Lr,D.redoCount>0?lt:nt)}),u.model.bind(et,b),u.model.bind(tt,b),u.model.bind(rt,b);let Y=u.getPlugin(Rr.type);l(Y!=null),s(Y!=null||S.length>0)}function fe(){i.current.model.clearSelection(),i.current.zoomToFit()}function z(){i.current.zoomIn()}function oe(){i.current.zoomOut()}function ne(){i.current.setMode(at)}function Ce(){i.current.setMode(it)}function Ee(){i.current.model.clearSelection(),kr(i.current)&&i.current.stopEditingPath()}function m(){R.current!=null?R.current(()=>i.current.model.clear()):window.confirm(x)&&i.current.model.clear()}function p(){i.current.model.undo()}function v(){i.current.model.redo()}let b=()=>{i.current.model.getSelection().isEmpty()?g.current.removeAttribute(ct):g.current.setAttribute(ct,"true")};Sr(()=>{_.current===!1&&(_.current=!0,e.surfaceId!=null?ae(e.surfaceId,u=>F(u.getSurface())):c!=null?c.listen(F):C!=null?C.listen(u=>{u.$ui instanceof _r&&F(u.$ui)}):yr("WARN: controls component cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))});let P=e.style||{};return f.createElement("div",{style:P,ref:g,className:`vjs-controls ${e.className||""}`,"data-vjs-orientation":r},a&&f.createElement("i",{className:"vjs-pan-mode "+ve,"data-mode":at,title:"Pan Mode",onClick:()=>ne()},f.createElement("svg",{fill:"none",viewBox:Dr,stroke:"currentColor"},f.createElement("path",{d:br}))),o&&f.createElement("i",{className:"vjs-select-mode","data-mode":it,title:"Select Mode",onClick:()=>Ce()},f.createElement("svg",{fill:"currentColor",viewBox:hr,stroke:"currentColor"},f.createElement("path",{d:Pr}))),d.map(u=>f.createElement("i",{className:u.class,title:u.title,onClick:S=>u.handler(S,u.id)})),k&&f.createElement("i",{className:"vjs-zoom-to-fit","data-reset":"true",title:"Zoom To Fit",onClick:()=>fe()},f.createElement("svg",{viewBox:Tr,stroke:"currentColor",fill:"currentColor"},f.createElement("path",{d:vr}))),G&&f.createElement(f.Fragment,null,f.createElement("i",{className:"vjs-zoom-in","data-zoom-in":"true",title:"Zoom In",onClick:()=>z()},f.createElement("svg",{viewBox:st,stroke:"currentColor",fill:"currentColor"},f.createElement("path",{d:Ar}))),f.createElement("i",{className:"vjs-zoom-out","data-zoom-out":"true",title:"Zoom Out",onClick:()=>oe()},f.createElement("svg",{viewBox:st,stroke:"currentColor",fill:"currentColor"},f.createElement("path",{d:wr})))),A&&f.createElement("i",{className:"vjs-undo","data-undo":"true",title:"Undo last action",onClick:()=>p()}),A&&f.createElement("i",{className:"vjs-redo","data-redo":"true",title:"Redo last action",onClick:()=>v()}),f.createElement("i",{className:jr,title:t,onClick:()=>Ee()},f.createElement("svg",{viewBox:Ir,stroke:"currentColor",fill:"currentColor"},f.createElement("path",{d:Mr}))),J&&f.createElement("i",{className:"vjs-clear-dataset",title:x,onClick:()=>m()},f.createElement("svg",{viewBox:Br,stroke:"currentColor",fill:"currentColor"},f.createElement("path",{d:Vr}))),U.map(u=>f.createElement("i",{className:u.class,title:u.title,onClick:S=>u.handler(S,u.id)})))}import B,{useContext as ut,useEffect as Ur,useRef as dt,useState as j}from"react";import{SvgExportUI as Fr,ImageExportUI as mt,Surface as zr,CLASS_CONTROLS as Hr,CLASS_EXPORT_CONTROLS as Wr,log as Jr}from"@visuallyjs/browser-ui";function ds(e){let t=dt(!1),r=dt(null),n=ut(E),o=ut(y),[l,a]=j(!0),[s,c]=j("Export :"),[C,g]=j(null),[_,i]=j(null),[x,T]=j(null),[R,k]=j(!0),[N,G]=j(!0),[h,A]=j(!0);function w(O){r.current=O,e.label&&c(s),e.showLabel!=null&&a(e.showLabel),e.margins&&g(e.margins);let U=e.svgOptions||{};i(U);let X=e.imageOptions||{};T(X),e.allowJpgExport!=null&&A(e.allowJpgExport),e.allowPngExport!=null&&G(e.allowPngExport),e.allowSvgExport!=null&&k(e.allowSvgExport)}function J(){new Fr(r.current).export(_)}function $(){new mt(r.current).export(x)}function d(){new mt(r.current).export(Object.assign(x||{},{type:"image/jpeg"}))}return Ur(()=>{t.current===!1&&(t.current=!0,e.surfaceId!=null?ae(e.surfaceId,O=>w(O.getSurface())):n!=null?n.listen(w):o!=null?o.listen(O=>{O.$ui instanceof zr&&w(O.$ui)}):Jr("WARN: export controls component cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))}),B.createElement("div",{className:`${Hr} ${Wr}`},l&&B.createElement("span",null,s),R&&B.createElement("i",null,B.createElement("a",{href:"#",id:"exportSvg",onClick:()=>J()},"SVG")),N&&B.createElement("i",null,B.createElement("a",{href:"#",id:"exportPng",onClick:()=>$()},"PNG")),h&&B.createElement("i",null,B.createElement("a",{href:"#",id:"exportJpg",onClick:()=>d()},"JPG")))}import $r,{forwardRef as Xr,useContext as Yr,useEffect as Zr,useRef as Te}from"react";import{log as pt,ShapePalette as qr}from"@visuallyjs/browser-ui";var hs=Xr((e,t)=>{let r=Te(!1),n=Te(null),o=Yr(E),l=Te(null),a=e.className||"";function s(c){c.getShapeLibrary()!=null?l.current=new qr(c,{container:n.current,dataGenerator:e.dataGenerator,dragSize:e.dragSize,iconSize:e.iconSize,fill:e.fill,outline:e.outline,showAllMessage:e.showAllMessage,selectAfterDrop:e.selectAfterDrop,paletteStrokeWidth:e.paletteStrokeWidth,initialSet:e.initialSet,mode:e.mode,allowClickToAdd:e.allowClickToAdd,onVertexAdded:e.onVertexAdded,showLabels:e.showLabels,inspector:e.inspector!==!1,preparedShapes:e.preparedShapes}):pt("WARN: no shapeLibrary provided in props and UI has no shape library. Cannot instantiate ShapePaletteComponent")}return Zr(()=>{r.current||(r.current=!0,o!=null?o.listen(c=>s(c)):e.surface!=null?s(e.surface):pt("ShapePaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),$r.createElement("div",{ref:n,className:a})});import Kr,{useEffect as Qr,useRef as eo}from"react";import{CLASS_SHAPE as to,convertToMultilineText as ro,DEFAULT_LABEL_FILL_RATIO as oo}from"@visuallyjs/browser-ui";var no=120,ao=90;function Ns(e){let t=eo(null);function r(){return e.ctx.obj.data.outlineWidth||2}function n(){return e.ctx.obj.data.fill||"#FFFFFF"}function o(){return e.ctx.obj.data.outline||"#000000"}function l(){return e.ctx.obj.data.width||no}function a(){return e.ctx.obj.data.height||ao}function s(){return e.ctx.obj.data.color||e.ctx.obj.data.outline||"#000000"}function c(){return e.labelProperty||"label"}return Qr(()=>{let C=e.ctx.obj.data,g=e.ctx.ui.getShapeLibrary(),_=g.renderCompiledShape(C);if(t.current.replaceChildren(_),e.showLabels){let i=g.renderShapeLabel(C,c(),e.labelStrokeWidth,null,s(),s(),e.font);t.current.appendChild(i),e.multilineLabels!=!1&&ro(i,C[c()]||"",l()*(e.labelFillRatio||oo))}}),Kr.createElement("svg",{className:to,ref:t,strokeWidth:r(),fill:n(),stroke:o(),preserveAspectRatio:"none",viewBox:"0 0 "+l()+" "+a()})}import io,{forwardRef as lo,useContext as so,useEffect as co,useRef as Ne}from"react";import{log as uo,Palette as mo,defaultDataGenerator as po}from"@visuallyjs/browser-ui";var Js=lo((e,t)=>{let r=Ne(!1),n=Ne(null),o=so(E),l=Ne(null),a=e.className||"";function s(c){let C={selector:e.selector,source:n.current,dataGenerator:g=>e.dataGenerator?e.dataGenerator(g):po(g),allowDropOnEdge:e.allowDropOnEdge===!0,allowDropOnGroup:e.allowDropOnGroup!==!1,allowDropOnCanvas:e.allowDropOnCanvas!==!1,allowDropOnNode:e.allowDropOnNode===!0,ignoreDropOnNode:e.ignoreDropOnNode===!0,typeGenerator:e.typeGenerator,groupIdentifier:e.groupIdentifier,dragSize:e.dragSize,canvasDropFilter:e.canvasDropFilter,mode:e.mode,onVertexAdded:e.onVertexAdded,selectAfterAdd:e.selectAfterAdd,allowClickToAdd:e.allowClickToAdd,clickToAddOnly:e.clickToAddOnly};l.current=new mo(c,C)}return co(()=>{r.current||(r.current=!0,o!=null?o.listen(c=>s(c)):e.surface!=null?s(e.surface):uo("PaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),io.createElement("div",{className:a,ref:n},e.children)});import de,{useEffect as fo,useState as Co,useRef as ft}from"react";import{CLASS_COLOR_PICKER as Eo,CLASS_COLOR_PICKER_SWATCH as go,CLASS_COLOR_PICKER_SWATCHES as xo,EVENT_CONTEXT_UPDATE as Ct,EVENT_CHANGE as Ae,INSPECTOR_CONTEXT_RECENT_COLORS as me}from"@visuallyjs/browser-ui";function qs(e){let t=e.maxColors||10,r=ft(null),n=ft(!1),o=le(),[l,a]=Co(o.ensureContext(me,()=>[]));function s(i){let x=o.ensureContext(me,()=>[]);if(i=i.toUpperCase(),!(x.find(R=>R.toUpperCase()===i)!=null)){let R=x.slice();R.unshift(i),R.length>t&&(R.length=t),o.updateContext(me,R)}}function c(){let i=r.current.value;o.setValue(e.propertyName,i),s(i)}function C(i){o.setValue(e.propertyName,i),r.current.value=i}let g=i=>{i.key===me&&a(i.value.slice())};function _(){let i=o.getValue(e.propertyName);i!=null&&r.current&&s(i)}return fo(()=>(o.bind(Ct,g),o.bind(Ae,_),n.current||(n.current=!0,r.current.addEventListener(Ae,c)),setTimeout(_),()=>{o.unbind(Ct,g),o.unbind(Ae,_)})),de.createElement("div",{className:Eo},de.createElement("input",{type:"color",ref:r,"vjs-att":e.propertyName}),de.createElement("div",{className:xo},l.map(i=>de.createElement("div",{key:i,title:i,className:go,style:{backgroundColor:i},"data-color":i,onClick:()=>C(i)}))))}import So,{forwardRef as Oo,useContext as Po,useEffect as ho,useRef as we}from"react";import{log as Ro,DiagramPalette as yo}from"@visuallyjs/browser-ui";var cc=Oo((e,t)=>{let r=we(!1),n=we(null),o=Po(y),l=we(null),a=e.className||"";function s(C){l.current=new yo(n.current,C,{fill:e.fill,outline:e.outline,dragSize:e.dragSize,inspector:e.inspector,iconSize:e.iconSize,showLabels:e.showLabels,paletteStrokeWidth:e.paletteStrokeWidth,showAllMessage:e.showAllMessage,onCellAdded:e.onCellAdded,mode:e.mode,allowClickToAdd:e.allowClickToAdd,autoExitDrawMode:e.autoExitDrawMode,selectAfterAdd:e.selectAfterAdd,onVertexAdded:e.onVertexAdded,preparedShapes:e.preparedShapes})}ho(()=>{r.current||(r.current=!0,o!=null?o.listen(C=>s(C)):e.diagram!=null?s(e.diagram):Ro("DiagramPaletteComponent cannot start: no DiagramContext from a provider found, and no Diagram provided in props"))});let c=e.style||{};return So.createElement("div",{ref:n,className:a,style:c})});import bo,{useContext as Et,useEffect as re,useRef as pe}from"react";import{ColumnChart as Do,BarChart as _o,CategoryValueChart as vo,LineChart as To,AreaChart as No,PieChart as Ao,ScatterChart as wo,BubbleChart as Mo,GaugeChart as Io,SankeyChart as Vo}from"@visuallyjs/browser-ui";function I(e){let t=pe(null),r=pe(!1),n=pe(!1),o=pe(null),l=e.style||{},a=Et(E),s=Et(y);return re(()=>{if(!r.current)if(r.current=!0,a!=null)a.listen(c=>{let C=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(t.current,C),n.current=!0});else if(s!=null)s.listen(c=>{let C=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(t.current,C),n.current=!0});else{let c=Object.assign({dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(t.current,c),e.data?o.current.load({data:e.data},()=>n.current=!0):e.url?o.current.load({url:e.url},()=>n.current=!0):n.current=!0}}),e.reactive!==!1&&(re(()=>{n.current&&e.data!=null&&o.current&&o.current.load({data:e.data})},[e.data]),re(()=>{n.current&&e.url!=null&&o.current&&o.current.load({url:e.url})},[e.url]),re(()=>{n.current&&e.pivot!=null&&o.current&&o.current.pivot&&o.current.pivot(e.pivot)},[e.pivot]),re(()=>{n.current&&e.dataSourceFilter!=null&&o.current&&o.current.setDataSourceFilter&&o.current.setDataSourceFilter(e.dataSourceFilter)},[e.dataSourceFilter])),bo.createElement("div",{ref:t,style:l,className:`${e.className||""}`})}function Ac(e){let t=Object.assign({createChart:(r,n)=>new Do(r,n)},e);return I(t)}function wc(e){let t=Object.assign({createChart:(r,n)=>new _o(r,n)},e);return I(t)}function Mc(e){let t=Object.assign({createChart:(r,n)=>new vo(r,n)},e);return I(t)}function Ic(e){let t=Object.assign({createChart:(r,n)=>new To(r,n)},e);return I(t)}function Vc(e){let t=Object.assign({createChart:(r,n)=>new No(r,n)},e);return I(t)}function Bc(e){let t=Object.assign({createChart:(r,n)=>new Ao(r,n)},e);return I(t)}function jc(e){let t=Object.assign({createChart:(r,n)=>new wo(r,n)},e);return I(t)}function kc(e){let t=Object.assign({createChart:(r,n)=>new Mo(r,n)},e);return I(t)}function Gc(e){let t=Object.assign({createChart:(r,n)=>new Io(r,n)},e);return I(t)}function Lc(e){let t=Object.assign({createChart:(r,n)=>new Vo(r,n)},e);return e.interactive!=null&&(t.options.interactive=e.interactive),e.pivot!=null&&(t.options.pivot=e.pivot),e.csvData&&(t.options.csvData=e.csvData),e.jsonData&&(t.options.jsonData=e.jsonData),I(t)}import{log as Bo}from"@visuallyjs/browser-ui";import jo,{useContext as ko,useEffect as Go,useRef as gt}from"react";function xt(e){let t=gt(!1),r=gt(null),n=ko(E),o=e.position||{x:0,y:0};function l(a){e.placement==="fixed"?a.fixElement(r.current,o,e.constraints):a.floatElement(r.current,o)}return Go(()=>{t.current||(t.current=!0,n!=null?n.listen(a=>l(a)):Bo("Decorator cannot mount: no SurfaceContext from a provider found"))}),jo.createElement("div",{ref:r},e.children)}import{log as Lo,BackgroundPlugin as Uo,GeneratedGridBackground as Fo,TiledBackground as zo,SimpleBackground as Ho}from"@visuallyjs/browser-ui";import St,{useRef as Wo}from"react";function Me(e){let t=Wo(!1);function r(n){if(!t.current){t.current=!0;try{n&&n.addPlugin({type:Uo.type,options:e})}catch(o){Lo(`WARN: BackgroundComponent could not mount background ${o}`)}}}return Le().then(r),St.createElement(St.Fragment,null)}function tu(e){return Me(Object.assign({type:Fo.type},e))}function ru(e){return Me(Object.assign({type:Ho.type},e))}function ou(e){return Me(Object.assign({type:zo.type},e))}export{Lr as ATTRIBUTE_CAN_REDO,Gr as ATTRIBUTE_CAN_UNDO,Vc as AreaChartComponent,Me as BackgroundComponent,wc as BarChartComponent,q as BrowserUIReactModel,kc as BubbleChartComponent,Se as CLASS_REACT_GROUP,xe as CLASS_REACT_NODE,je as CLASS_REACT_OVERLAY,ve as CLASS_SELECTED_MODE,qs as ColorPickerComponent,Ac as ColumnChartComponent,Kl as ControlsComponent,ao as DEFAULT_SHAPE_HEIGHT,no as DEFAULT_SHAPE_WIDTH,xt as DecoratorComponent,bi as DiagramComponent,y as DiagramContext,cc as DiagramPaletteComponent,Ri as DiagramProvider,Ca as EdgeTypePickerComponent,ds as ExportControlsComponent,Gc as GaugeChartComponent,tu as GridBackgroundComponent,ru as ImageBackgroundComponent,Xi as InspectorComponent,ie as InspectorContext,Oe as JSXWrapper,Ic as LineChartComponent,Vi as MiniviewComponent,Js as PaletteComponent,Bc as PieChartComponent,Lc as SankeyChartComponent,jc as ScatterChartComponent,Ns as ShapeComponent,hs as ShapePaletteComponent,ii as SurfaceComponent,E as SurfaceContext,Kn as SurfaceProvider,ou as TiledImageBackgroundComponent,se as VisuallyJsContext,Da as VisuallyJsProvider,Mc as XYChartComponent,Ze as createDiagramRef,Ue as createInspectorRef,Q as createRefHandler,K as createSurfaceRef,ae as getSurfaceComponent,Ge as newInstance,Be as registerSurface,yi as useDiagram,le as useInspector,Le as useSurface,_a as useVisuallyJsModel};