npm - @visuallyjs/browser-ui-react - Versions diffs - 1.2.2 → 1.2.3 - Mend

@visuallyjs/browser-ui-react 1.2.2 → 1.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/package.json +1 -1
package/visuallyjs.browser-ui-react.cjs.js +1 -1
package/visuallyjs.browser-ui-react.es.js +1 -1

package/package.json CHANGED Viewed

	@@ -1 +1 @@
1	- {"name":"@visuallyjs/browser-ui-react","version":"1.2.2","description":"VisuallyJs React","module":"visuallyjs.browser-ui-react.es.js","main":"visuallyjs.browser-ui-react.cjs.js","types":"index.d.ts","files":["visuallyjs.browser-ui-react.es.js","visuallyjs.browser-ui-react.cjs.js","*/.d.ts","README.md"],"author":"VisuallyJs <hello@visuallyjs.com> (https://visuallyjs.com)","license":"Commercial","dependencies":{"@visuallyjs/browser-ui":"1.2.2"},"homepage":"https://visuallyjs.com/react","bugs":"https://github.com/visuallyjs/visuallyjs/issues"}
1	+ {"name":"@visuallyjs/browser-ui-react","version":"1.2.3","description":"VisuallyJs React","module":"visuallyjs.browser-ui-react.es.js","main":"visuallyjs.browser-ui-react.cjs.js","types":"index.d.ts","files":["visuallyjs.browser-ui-react.es.js","visuallyjs.browser-ui-react.cjs.js","*/.d.ts","README.md"],"author":"VisuallyJs <hello@visuallyjs.com> (https://visuallyjs.com)","license":"Commercial","dependencies":{"@visuallyjs/browser-ui":"1.2.3"},"homepage":"https://visuallyjs.com/react","bugs":"https://github.com/visuallyjs/visuallyjs/issues"}

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

	@@ -1 +1 @@
1	- var wt=Object.create;var Be=Object.defineProperty;var Vt=Object.getOwnPropertyDescriptor;var Mt=Object.getOwnPropertyNames,Et=Object.getOwnPropertySymbols,It=Object.getPrototypeOf,gt=Object.prototype.hasOwnProperty,Bt=Object.prototype.propertyIsEnumerable;var Ct=(e,r,t)=>r in e?Be(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,rt=(e,r)=>{for(var t in r\|\|(r={}))gt.call(r,t)&&Ct(e,t,r[t]);if(Et)for(var t of Et(r))Bt.call(r,t)&&Ct(e,t,r[t]);return e};var Ut=(e,r)=>{for(var t in r)Be(e,t,{get:r[t],enumerable:!0})},xt=(e,r,t,n)=>{if(r&&typeof r=="object"\|\|typeof r=="function")for(let o of Mt(r))!gt.call(e,o)&&o!==t&&Be(e,o,{get:()=>r[o],enumerable:!(n=Vt(r,o))\|\|n.enumerable});return e};var N=(e,r,t)=>(t=e!=null?wt(It(e)):{},xt(r\|\|!e\|\|!e.__esModule?Be(t,"default",{value:e,enumerable:!0}):t,e)),jt=e=>xt(Be({},"__esModule",{value:!0}),e);var Rr={};Ut(Rr,{ATTRIBUTE_CAN_REDO:()=>vt,ATTRIBUTE_CAN_UNDO:()=>Dt,AreaChartComponent:()=>ur,BackgroundComponent:()=>tt,BarChartComponent:()=>ir,BrowserUIReactModel:()=>Ce,BubbleChartComponent:()=>mr,CLASS_REACT_GROUP:()=>ze,CLASS_REACT_NODE:()=>Fe,CLASS_REACT_OVERLAY:()=>je,CLASS_SELECTED_MODE:()=>Qe,ColorPickerComponent:()=>or,ColumnChartComponent:()=>lr,ControlsComponent:()=>Qt,DEFAULT_SHAPE_HEIGHT:()=>_t,DEFAULT_SHAPE_WIDTH:()=>Tt,DecoratorComponent:()=>mt,DiagramComponent:()=>Wt,DiagramContext:()=>$,DiagramPaletteComponent:()=>ar,DiagramProvider:()=>Ht,EdgeTypePickerComponent:()=>Ft,ExportControlsComponent:()=>er,GaugeChartComponent:()=>fr,GridBackgroundComponent:()=>Cr,ImageBackgroundComponent:()=>gr,InspectorComponent:()=>Kt,InspectorContext:()=>Ge,JSXWrapper:()=>He,LineChartComponent:()=>cr,MiniviewComponent:()=>qt,PaletteComponent:()=>nr,PaperComponent:()=>Xt,PaperContext:()=>le,PaperProvider:()=>zt,PieChartComponent:()=>dr,SankeyChartComponent:()=>Er,ScatterChartComponent:()=>pr,ShapeComponent:()=>rr,ShapePaletteComponent:()=>tr,SurfaceComponent:()=>Zt,SurfaceContext:()=>V,SurfacePopup:()=>Rt,SurfaceProvider:()=>Lt,TiledImageBackgroundComponent:()=>xr,VisuallyJsContext:()=>he,VisuallyJsProvider:()=>Jt,XYChartComponent:()=>sr,createDiagramRef:()=>st,createInspectorRef:()=>lt,createPaperRef:()=>Ye,createRefHandler:()=>ge,createSurfaceRef:()=>ve,getSurfaceComponent:()=>kt,newInstance:()=>at,registerSurface:()=>ot,useDiagram:()=>Se,useInspector:()=>ke,usePaper:()=>it,useSurface:()=>J,useVisuallyJsModel:()=>ct,useVisuallyJsUpdate:()=>Pr,useZoom:()=>Or});module.exports=jt(Rr);var nt=require("@visuallyjs/browser-ui"),Pt=new Map,Ue={};function ot(e,r){Pt.set(e,r),Gt(e,r)}function Gt(e,r){(Ue[e]\|\|[]).forEach(n=>{try{n(r)}catch(o){(0,nt.log)("WARN: an error was reported invoking a SurfaceComponentRefCallback "+o)}}),delete Ue[e]}function kt(e,r){let t=Pt.get(e);if(t)try{r(t)}catch(n){(0,nt.log)("WARN: an error was reported invoking a SurfaceComponentRefCallback "+n)}else Ue[e]=Ue[e]\|\|[],Ue[e].push(r)}var Fe="vjs-react-node",ze="vjs-react-group",je="vjs-react-overlay";var ye=N(require("react"));function He(e){let r=(0,ye.useRef)(!1);return(0,ye.useEffect)(()=>{r.current\|\|(r.current=!0,e.cb(e.ns))}),ye.default.createElement(ye.default.Fragment,null,e.ns.def.jsx({obj:e.ns.obj,vertex:e.ns.obj,model:e.model,ui:e.ui,data:e.ns.obj.data,props:e.childProps\|\|{}}))}var We=require("@visuallyjs/browser-ui"),Ce=class extends We.BrowserUIModel{render(r,t){return(0,We.log)("render called directly on BrowserUIReactModel class: should not happen. UI components should use internal render."),null}};function at(e){return e=e\|\|{},new Ce(e)}var X=N(require("react")),V=(0,X.createContext)(null);function Lt(e){let r=(0,X.useRef)(null),t=ve(r);return X.default.createElement(V.Provider,{value:t},e.children\|\|[])}function ve(e){return ge(e)}function ge(e){let r=[];return{set:t=>{e.current=t,r.forEach(n=>n(t))},listen:t=>{e.current==null?r.push(t):t(e.current)},ref:()=>e}}function J(){let e=(0,X.useContext)(V),[r,t]=(0,X.useState)(null);return(0,X.useEffect)(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}var Je=require("react"),Ge=(0,Je.createContext)(null);function lt(e){return ge(e)}function ke(){let e=(0,Je.useContext)(Ge);return e==null?null:e.ref().current}var xe=N(require("react")),$e=require("@visuallyjs/browser-ui");function Ft(e){let r=(0,xe.useRef)(!1),t=(0,xe.useRef)(null),n=(0,xe.useRef)(null),o=ke(),{propertyName:l}=e,i=()=>o.getFromContext($e.INSPECTOR_CONTEXT_EDGE_PROPERTY_MAPPINGS)\|\|o.$ui.$getEdgePropertyMappings();return(0,xe.useEffect)(()=>{r.current\|\|(r.current=!0,n.current=new $e.EdgeTypePicker(o.$ui,t.current,i(),o.getValue(l),(a,c)=>{o.setValue(l,c,null)}),n.current.render(l,o.Qe),o.onChange(()=>{n.current.select(l,o.getValue(l))}))}),xe.default.createElement("div",{ref:t})}var q=N(require("react")),le=(0,q.createContext)(null);function zt(e){let r=(0,q.useRef)(null),t=Ye(r);return q.default.createElement(le.Provider,{value:t},e.children\|\|[])}function Ye(e){return ge(e)}function it(){let e=(0,q.useContext)(le),[r,t]=(0,q.useState)(null);return(0,q.useEffect)(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}var v=N(require("react")),Ot=require("@visuallyjs/browser-ui"),$=(0,v.createContext)(null);function st(e){return ge(e)}function Ht(e){let r=(0,v.useRef)(null),t=st(r);return v.default.createElement($.Provider,{value:t},e.children\|\|[])}function Se(){let e=(0,v.useContext)($),[r,t]=(0,v.useState)(null);return(0,v.useEffect)(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}var Wt=(0,v.forwardRef)((e,r)=>{let t=(0,v.useRef)(null),n=(0,v.useRef)(!1),o,l,i=(0,v.useContext)($);i==null?(o=(0,v.useRef)(null),i=st(o)):o=i.ref();let a=(0,v.useContext)(V);a==null?(l=(0,v.useRef)(null),a=ve(l)):l=a.ref();let c={getDiagram:()=>o.current};(0,v.useImperativeHandle)(r,()=>c),(0,v.useEffect)(()=>{n.current\|\|(n.current=!0,o.current=(0,Ot.createDiagram)(t.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}),i.set(o.current),a.set(l.current))});let E=`${e.className\|\|""} vjs-react-diagram`,x=e.style\|\|{};return v.default.createElement("div",{ref:t,className:E,style:x},v.default.createElement(V.Provider,{value:a},v.default.createElement($.Provider,{value:i},e.children)))});var L=N(require("react")),he=(0,L.createContext)(void 0);function Jt(e){let r=(0,L.useMemo)(()=>at(e.modelOptions\|\|{}),[]);function t(o,l){r.clear(),r.load({data:o,dataType:l})}function n(o,l){r.clear(),r.load({url:o,dataType:l})}return e.data!=null&&t(e.data,e.dataType),e.url!=null&&t(e.url,e.dataType),(0,L.useEffect)(()=>{e.data!=null&&t(e.data,e.dataType)},[e.data]),(0,L.useEffect)(()=>{e.url!=null&&n(e.url,e.dataType)},[e.url]),L.default.createElement(he.Provider,{value:r},e.children\|\|[])}function ct(){let e=(0,L.useContext)(he),r=(0,L.useContext)(V),t=(0,L.useContext)(le),n=(0,L.useContext)($),[o,l]=(0,L.useState)(e);return(0,L.useEffect)(()=>{if(e){l(e);return}let i;r!=null&&(r.ref().current?l(r.ref().current.model):(i=E=>{l(E.model)},r.listen(i)));let a;t!=null&&(t.ref().current?o==null&&l(t.ref().current.model):(a=E=>{o==null&&l(E.model)},t.listen(a)));let c;n!=null&&(n.ref().current?o==null&&l(n.ref().current.model):(c=E=>{o==null&&l(E.model)},n.listen(c)))}),o}var ut=N(require("react")),K=require("@visuallyjs/browser-ui");function $t(e,r){if(e.hydrated!==!0){let t=(0,K.isGroup)(e.obj)?ze:Fe;e.domElement.firstElementChild&&(0,K.addClass)(e.domElement.firstElementChild,t),e.hydrated=!0}else r.current.$revalidateElement(e.domElement)}function Ze(e,r,t,n){return ut.default.createElement(He,{ns:e,model:r,ui:t.current,childProps:n,cb:o=>{$t(o,t)}})}function Xe(e,r,t,n){return ut.default.createElement(He,{ns:e,model:r,ui:t.current,childProps:n,cb:o=>{Yt(o,t)}})}function Yt(e,r){if(e.hydrated!==!0){let t=(0,K.isGroup)(e.obj)?ze:Fe;e.domElement.firstElementChild&&((0,K.addClass)(e.domElement.firstElementChild,t),e.domElement.firstElementChild.getAttribute(K.ATTRIBUTE_NOT_DRAGGABLE)===K.TRUE&&e.domElement.setAttribute(K.ATTRIBUTE_NOT_DRAGGABLE,K.TRUE)),r.current.$vertexRendered(e.obj,e.domElement,e.def,e.payload.eventInfo),e.hydrated=!0}else r.current.$revalidateElement(e.domElement)}var h=N(require("react")),dt=N(require("react-dom")),C=require("@visuallyjs/browser-ui"),Zt=(0,h.forwardRef)((e,r)=>{let t=(0,h.useRef)(!1),n=(0,h.useRef)(!1),o=(0,h.useContext)(he),l=(0,h.useRef)(null),i=(0,h.useRef)(null),a=(0,h.useRef)(o),c,E=(0,h.useContext)(V);E==null?(c=(0,h.useRef)(null),E=ve(c)):c=E.ref();let[x,U]=(0,h.useState)([]),[d,G]=(0,h.useState)([]),T=[],P=[];function k(){U(T.slice())}function H(){G(P.slice())}let Z={getSurface:()=>c.current,getModel:()=>a.current};(0,h.useImperativeHandle)(r,()=>Z),(0,h.useEffect)(()=>{var O;if(!n.current){n.current=!0,e.model!=null?a.current=e.model:o==null?a.current=new Ce(e.modelOptions\|\|{}):a.current=o,typeof document!="undefined"&&(i.current=document.createElement("div"),i.current.style.position="fixed",i.current.style.left="10000px",i.current.style.top="10000px",i.current.style.width="100px",i.current.style.height="100px",i.current.style.opacity="0",l.current.appendChild(i.current));let ne=(s,u,R,A,f,y,_,me)=>{let[S,I]=y.component\|\|y.jsx?[y,null]:(0,C.isGroup)(_)?[Object.assign(Object.assign({},y),{jsx:F=>h.default.createElement(h.default.Fragment,null,F.obj.data.label)}),C.CLASS_DEFAULT_GROUP]:[Object.assign(Object.assign({},y),{jsx:F=>h.default.createElement(h.default.Fragment,null,F.obj.data.label)}),C.CLASS_DEFAULT_NODE],W=f.containerType===C.ElementTypes.HTML?document.createElement(C.ELEMENT_DIV):(0,C.$svgNode)(C.ELEMENT_SVG);i.current.appendChild(W),I!=null&&f.$addClassToElement(W,I);let De={data:u,model:R,ui:f,componentId:_.getFullId(),obj:_,props:e.childProps,element:W,eventInfo:me};T.push({data:u,def:S,payload:De,domElement:W,key:_.id,obj:_,hydrated:!1}),k()},ue=(s,u)=>{u.parentNode&&u.parentNode.removeChild(u)},Pe={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(s,u,R,A)=>{},render:ne,rerender:(s,u,R,A,f,y,_,me,S)=>{let I=(0,C.partition)(T,W=>W.obj!==_);T=I.left,k(),ne(s,u,R,A,f,y,_,me),I.right.length>0&&setTimeout(()=>{ue(null,I.right[0].domElement)})},cleanupVertex:ue,cleanupPort:(s,u)=>{}},de=((O=e.viewOptions)==null?void 0:O.edges)\|\|{};for(let s in de){let u=de[s];u.overlays!=null&&(u.overlays=u.overlays.map(R=>R.jsx!=null?{type:C.OVERLAY_TYPE_CUSTOM,options:{create:f=>{let y=document.createElement(C.ELEMENT_DIV);y.className=je;let _={data:f.edge.data,model:a.current,ui:pe,componentId:f.edge.getFullId(),obj:f.edge,props:e.childProps,element:y};return P.push({def:{jsx:R.jsx},data:f.edge.data,obj:f.edge,payload:_,domElement:y,key:(0,C.uuid)(),hydrated:!1}),H(),y}}}:R))}let Oe=Object.assign(e.renderOptions\|\|{},{view:e.viewOptions,selection:e.selection}),pe=(0,C.renderSurface)(a.current,l.current,Pe,Oe);E.set(pe),e.surfaceId!=null&&ot(e.surfaceId,Z);let Ee=(s,u)=>{let R=()=>{let f={};return(u.originalData\|\|u.updates)&&(f=(0,C.extend)(u.originalData,u.updates)),f},A=T.find(f=>f.key===s);A!=null&&(A.data=R(),k())},Re=s=>{T=T.filter(u=>u.payload.componentId!==s),k()},Me=(s,u)=>{let R=()=>{let f={};return(u.originalData\|\|u.updates)&&(f=(0,C.extend)(u.originalData,u.updates)),f},A=P.find(f=>f.obj.id===s);A!=null&&(A.data=R(),H())},Ie=s=>{P=P.filter(u=>u.payload.obj.id!==s),H()};a.current.bind(C.EVENT_NODE_UPDATED,s=>{Ee(s.vertex.getFullId(),s)}),a.current.bind(C.EVENT_GROUP_UPDATED,s=>{Ee(s.vertex.getFullId(),s)}),a.current.bind(C.EVENT_NODE_REMOVED,s=>{Re(s.node.id)}),a.current.bind(C.EVENT_GROUP_REMOVED,s=>{Re(s.group.id)}),a.current.bind(C.EVENT_EDGE_REMOVED,s=>{Ie(s.edge.id)}),a.current.bind(C.EVENT_EDGE_UPDATED,s=>{Me(s.edge.id,s)}),a.current.bind(C.EVENT_GRAPH_CLEARED,()=>{T=[],k(),P=[],H()})}}),(0,h.useEffect)(()=>{n.current&&a.current!=null&&c.current!=null&&t.current===!1&&(e.data!=null\|\|e.url!=null)&&(t.current=!0,a.current.clear(),a.current.load({data:e.data,url:e.url,onload:()=>{t.current=!1,setTimeout(()=>c.current.repaintEverything(),250)}}))},[e.data,e.url]);let ce=`${e.className\|\|""} vjs-react-surface`,M=e.style\|\|{};return h.default.createElement("div",{ref:l,className:ce,style:M},x.map(O=>dt.createPortal(Xe(O,a.current,c,e.childProps),O.domElement,O.key)),d.map(O=>dt.createPortal(Ze(O,a.current,c,e.childProps),O.domElement,O.key)),h.default.createElement(V.Provider,{value:E},e.children))});var Y=N(require("react")),qe=require("@visuallyjs/browser-ui");function Rt(e){let r=J(),t=(0,Y.useRef)(null),n=(0,Y.useRef)(!1),o=(0,Y.useRef)(null),[l,i]=(0,Y.useState)(null),[a,c]=(0,Y.useState)(0),E=(0,Y.useMemo)(()=>l==null?"none":"block",[l]);function x(d){i(d),c(G=>G+1)}(0,Y.useEffect)(()=>{!n.current&&r&&(n.current=!0,o.current=new qe.PopupHandler(e.selector,t.current,r,d=>x(d),e.anchor))});function U(){o.current&&o.current.$hide()}return Y.default.createElement("div",{ref:t,className:qe.CLASS_SURFACE_POPUP,style:{display:E,position:"absolute"}},l!=null&&e.children(l,r.model,r,()=>U()))}var b=N(require("react")),pt=N(require("react-dom")),g=require("@visuallyjs/browser-ui"),Xt=(0,b.forwardRef)((e,r)=>{let t=(0,b.useRef)(!1),n=(0,b.useRef)(!1),o=(0,b.useContext)(he),l=(0,b.useRef)(null),i=(0,b.useRef)(null),a=(0,b.useRef)(null),c,E=(0,b.useContext)(le);E==null?(c=(0,b.useRef)(null),E=Ye(c)):c=E.ref();let[x,U]=(0,b.useState)([]),[d,G]=(0,b.useState)([]),T=[],P=[];function k(){U(T.slice())}function H(){G(P.slice())}let Z={getPaper:()=>c.current,getModel:()=>a.current};(0,b.useImperativeHandle)(r,()=>Z),(0,b.useEffect)(()=>{var O;if(!n.current){n.current=!0,e.model!=null?a.current=e.model:o==null?a.current=new Ce(e.modelOptions\|\|{}):a.current=o,typeof document!="undefined"&&(i.current=document.createElement("div"),i.current.style.position="fixed",i.current.style.left="10000px",i.current.style.top="10000px",i.current.style.width="100px",i.current.style.height="100px",i.current.style.opacity="0",l.current.appendChild(i.current));let ne=(s,u,R,A,f,y,_,me)=>{let[S,I]=y.component\|\|y.jsx?[y,null]:(0,g.isGroup)(_)?[Object.assign(Object.assign({},y),{jsx:F=>b.default.createElement(b.default.Fragment,null,F.obj.data.label)}),g.CLASS_DEFAULT_GROUP]:[Object.assign(Object.assign({},y),{jsx:F=>b.default.createElement(b.default.Fragment,null,F.obj.data.label)}),g.CLASS_DEFAULT_NODE],W=f.containerType===g.ElementTypes.HTML?document.createElement(g.ELEMENT_DIV):(0,g.$svgNode)(g.ELEMENT_SVG);i.current.appendChild(W),I!=null&&f.$addClassToElement(W,I);let De={data:u,model:R,ui:f,componentId:_.getFullId(),obj:_,props:e.childProps,element:W,eventInfo:me};T.push({data:u,def:S,payload:De,domElement:W,key:_.id,obj:_,hydrated:!1}),k()},ue=(s,u)=>{u.parentNode&&u.parentNode.removeChild(u)},Pe={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(s,u,R,A)=>{},render:ne,rerender:(s,u,R,A,f,y,_,me,S)=>{let I=(0,g.partition)(T,W=>W.obj!==_);T=I.left,k(),ne(s,u,R,A,f,y,_,me),I.right.length>0&&setTimeout(()=>{ue(null,I.right[0].domElement)})},cleanupVertex:ue,cleanupPort:(s,u)=>{}},de=((O=e.viewOptions)==null?void 0:O.edges)\|\|{};for(let s in de){let u=de[s];u.overlays!=null&&(u.overlays=u.overlays.map(R=>R.jsx!=null?{type:g.OVERLAY_TYPE_CUSTOM,options:{create:f=>{let y=document.createElement(g.ELEMENT_DIV);y.className=je;let _={data:f.edge.data,model:a.current,ui:pe,componentId:f.edge.getFullId(),obj:f.edge,props:e.childProps,element:y};return P.push({def:{jsx:R.jsx},data:f.edge.data,obj:f.edge,payload:_,domElement:y,key:(0,g.uuid)(),hydrated:!1}),H(),y}}}:R))}let Oe=Object.assign(e.renderOptions\|\|{},{view:e.viewOptions}),pe=(0,g.renderPaper)(a.current,l.current,Pe,Oe);E.set(pe);let Ee=(s,u)=>{let R=()=>{let f={};return(u.originalData\|\|u.updates)&&(f=(0,g.extend)(u.originalData,u.updates)),f},A=T.find(f=>f.key===s);A!=null&&(A.data=R(),k())},Re=s=>{T=T.filter(u=>u.payload.componentId!==s),k()},Me=(s,u)=>{let R=()=>{let f={};return(u.originalData\|\|u.updates)&&(f=(0,g.extend)(u.originalData,u.updates)),f},A=P.find(f=>f.obj.id===s);A!=null&&(A.data=R(),H())},Ie=s=>{P=P.filter(u=>u.payload.obj.id!==s),H()};a.current.bind(g.EVENT_NODE_UPDATED,s=>{Ee(s.vertex.getFullId(),s)}),a.current.bind(g.EVENT_GROUP_UPDATED,s=>{Ee(s.vertex.getFullId(),s)}),a.current.bind(g.EVENT_NODE_REMOVED,s=>{Re(s.node.id)}),a.current.bind(g.EVENT_GROUP_REMOVED,s=>{Re(s.group.id)}),a.current.bind(g.EVENT_EDGE_REMOVED,s=>{Ie(s.edge.id)}),a.current.bind(g.EVENT_EDGE_UPDATED,s=>{Me(s.edge.id,s)}),a.current.bind(g.EVENT_GRAPH_CLEARED,()=>{T=[],k(),P=[],H()})}}),(0,b.useEffect)(()=>{n.current&&a.current!=null&&c.current!=null&&t.current===!1&&(e.data!=null\|\|e.url!=null)&&(t.current=!0,a.current.clear(),a.current.load({data:e.data,url:e.url,onload:()=>{t.current=!1,setTimeout(()=>c.current.repaintEverything(),250)}}))},[e.data,e.url]);let ce=`${e.className\|\|""} vjs-react-paper`,M=e.style\|\|{};return b.default.createElement("div",{ref:l,className:ce,style:M},x.map(O=>pt.createPortal(Xe(O,a.current,c,e.childProps),O.domElement,O.key)),d.map(O=>pt.createPortal(Ze(O,a.current,c,e.childProps),O.domElement,O.key)),b.default.createElement(le.Provider,{value:E},e.children))});var Ke=require("@visuallyjs/browser-ui"),oe=N(require("react")),qt=(0,oe.forwardRef)((e,r)=>{let t=J(),n=Se(),o=(0,oe.useRef)(!1),l=(0,oe.useRef)(null),i;(0,oe.useImperativeHandle)(r,()=>({toggleCollapsed:()=>i==null?void 0:i.toggleCollapsed()}));function a(c){c.addPlugin({type:Ke.MiniviewPlugin.type,options:{container:l.current,elementFilter:e.elementFilter,typeFunction:e.typeFunction,activeTracking:e.activeTracking,clickToCenter:e.clickToCenter,showLasso:e.showLasso,trackSelection:e.trackSelection}})}return(0,oe.useEffect)(()=>{o.current\|\|(t!=null?(o.current=!0,a(t)):n!=null&&n.$ui instanceof Ke.Surface&&(o.current=!0,a(n.$ui)))},[t,n]),oe.default.createElement("div",{ref:l,className:`${e.className\|\|""}`})});var Te=require("@visuallyjs/browser-ui"),D=N(require("react")),Kt=(0,D.forwardRef)((e,r)=>{let t=(0,D.useContext)(V),n=(0,D.useContext)($),o=(0,D.useContext)(le),l,i=(0,D.useContext)(Ge);i==null&&(l=(0,D.useRef)(null),i=lt(l));let[a,c]=(0,D.useState)(null),[E,x]=(0,D.useState)(0),[U,d]=(0,D.useState)(null),G=(0,D.useRef)(!1),T=(0,D.useRef)(null),P=e.className\|\|"";(0,D.useEffect)(()=>{var M;(M=l==null?void 0:l.current)==null\|\|M.$refresh()},[E]);let k=e.onSelectionCleared\|\|(()=>c(null)),H=(M,O)=>{c(M),e.refresh&&e.refresh(M),x(ne=>ne+1)};function Z(M){l.current=new Te.Inspector({container:T.current,ui:M,renderEmptyContainer:k,refresh:H,autoCommit:e.autoCommit,multipleSelections:e.multipleSelections,filter:e.filter,showCloseButton:e.showCloseButton,afterUpdate:()=>e.afterUpdate?e.afterUpdate(M):null}),d(l.current)}let ce={getInspector:()=>U};return(0,D.useImperativeHandle)(r,()=>ce),(0,D.useEffect)(()=>{G.current\|\|(G.current=!0,t!=null?t.listen(Z):o!=null?o.listen(Z):n!=null?n.listen(M=>{M.$ui instanceof Te.Surface&&Z(M.$ui)}):(0,Te.log)("WARN: InspectorComponent cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))}),D.default.createElement("div",{ref:T,className:P},D.default.createElement(Ge.Provider,{value:i},a!=null&&D.default.createElement(D.default.Fragment,null,typeof e.children=="function"?e.children(a,l.current.$ui.model):e.children\|\|[]),a==null&&D.default.createElement(D.default.Fragment,null,e.renderEmptyContent&&e.renderEmptyContent())))});var Tl="group:added",_l="group:member:added",Nl="group:member:removed",Al="group:removed",wl="dataLoadStart",Vl="dataAppendStart",Ml="dataLoadEnd",Il="dataAppendEnd",Bl="dataUpdated",Ul="graphClearStart",jl="graphCleared",Gl="graphChanged",kl="group:updated",Ll="node:updated",Fl="port:updated",zl="edge:updated",Hl="edge:added",Wl="node:added",Jl="edge:removed",$l="node:removed",Yl="port:added",Zl="port:removed",Xl="edge:target",ql="edge:source",yt="select",St="deselect",ht="selection:cleared",Kl="edge:geometry",Ql="edge:pathEdited",ei="edge:dragStart",ti="edge:drag",ri="edge:dragEnd",ni="edge:dragAbort",oi="edge:typeChanged",ai="node:typeChanged",li="port:typeChanged",ii="group:typeChanged",si="group:move:start",ci="group:move",ui="group:move:end",di="internal:group:sizeChanged",pi="internal:group:sizeChangedRedo",mi="internal:group:sizeChangedUndo",fi="internal:edge:redraw",Ei="renderer:added",Ci="node:move:start",gi="node:move",xi="node:move:end",Pi="node:move:abort",Oi="undoredo:update",Ri="undo",yi="redo",Si="destroy";var m=N(require("react")),p=require("@visuallyjs/browser-ui"),Dt="can-undo",vt="can-redo",Qe="vjs-selected-mode",bt="vjs-controls-has-selection";function Qt(e){let r="Clear selection",t=J(),n=Se(),[o,l]=(0,m.useState)("row"),[i,a]=(0,m.useState)(!1),[c,E]=(0,m.useState)(!1),x=(0,m.useRef)(null),U=(0,m.useRef)(!1),d=(0,m.useRef)(null),[G,T]=(0,m.useState)("Clear dataset?"),P=(0,m.useRef)(null),[k,H]=(0,m.useState)(!0),[Z,ce]=(0,m.useState)(!1),[M,O]=(0,m.useState)(!0),[ne,ue]=(0,m.useState)(!0),[Pe,de]=(0,m.useState)([]),[Oe,pe]=(0,m.useState)([]);function Ee(S){d.current=S,e.clearMessage&&T(e.clearMessage),e.onMaybeClear&&(P.current=e.onMaybeClear),e.orientation&&l(e.orientation),e.undoRedo===!1&&O(!1),e.zoomToExtents===!1&&H(!1),e.zoomButtons===!0&&ce(!0),e.clear===!1&&ue(!1);let I=(e.buttons\|\|[]).filter(F=>F.mode!=null);de(I);let W=(e.buttons\|\|[]).filter(F=>F.mode==null);pe(W),S.bind(p.EVENT_SURFACE_MODE_CHANGED,F=>{S.removeClass(S.$getSelector(x.current,"[data-mode]"),Qe),S.addClass(S.$getSelector(x.current,"[data-mode='"+F+"']"),Qe)}),S.model.bind(p.EVENT_UNDOREDO_UPDATE,F=>{x.current.setAttribute(Dt,F.undoCount>0?p.TRUE:p.FALSE),x.current.setAttribute(vt,F.redoCount>0?p.TRUE:p.FALSE)}),S.model.bind(yt,_),S.model.bind(St,_),S.model.bind(ht,_);let De=S.getPlugin(p.LassoPlugin.type);a(De!=null),E(De!=null\|\|I.length>0)}function Re(){d.current.model.clearSelection(),d.current.zoomToFit()}function Me(){d.current.zoomIn()}function Ie(){d.current.zoomOut()}function s(){d.current.setMode(p.SURFACE_MODE_PAN)}function u(){d.current.setMode(p.SURFACE_MODE_SELECT)}function R(){d.current.model.clearSelection(),(0,p.supportsPathEditing)(d.current)&&d.current.stopEditingPath()}function A(){P.current!=null?P.current(()=>d.current.model.clear()):window.confirm(G)&&d.current.model.clear()}function f(){d.current.model.undo()}function y(){d.current.model.redo()}let _=()=>{d.current.model.getSelection().isEmpty()?x.current.removeAttribute(bt):x.current.setAttribute(bt,"true")};(0,m.useEffect)(()=>{U.current===!1&&(t!=null?(U.current=!0,Ee(t)):n!=null&&n.$ui instanceof p.Surface&&(U.current=!0,Ee(n.$ui)))},[t,n]);let me=e.style\|\|{};return m.default.createElement("div",{style:me,ref:x,className:`vjs-controls ${e.className\|\|""}`,"data-vjs-orientation":o},c&&m.default.createElement("i",{className:"vjs-pan-mode "+Qe,"data-mode":p.SURFACE_MODE_PAN,title:"Pan Mode",onClick:()=>s()},m.default.createElement("svg",{fill:"none",viewBox:p.PAN_VIEW_BOX,stroke:"currentColor"},m.default.createElement("path",{d:p.PAN_PATH}))),i&&m.default.createElement("i",{className:"vjs-select-mode","data-mode":p.SURFACE_MODE_SELECT,title:"Select Mode",onClick:()=>u()},m.default.createElement("svg",{fill:"currentColor",viewBox:p.LASSO_VIEW_BOX,stroke:"currentColor"},m.default.createElement("path",{d:p.LASSO_PATH}))),Pe.map(S=>m.default.createElement("i",{className:S.class,title:S.title,onClick:I=>S.handler(I,S.id)})),k&&m.default.createElement("i",{className:"vjs-zoom-to-fit","data-reset":"true",title:"Zoom To Fit",onClick:()=>Re()},m.default.createElement("svg",{viewBox:p.ZOOM_TO_FIT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.ZOOM_TO_FIT_PATH}))),Z&&m.default.createElement(m.default.Fragment,null,m.default.createElement("i",{className:"vjs-zoom-in","data-zoom-in":"true",title:"Zoom In",onClick:()=>Me()},m.default.createElement("svg",{viewBox:p.ZOOM_IN_OUT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.ZOOM_IN_PATH}))),m.default.createElement("i",{className:"vjs-zoom-out","data-zoom-out":"true",title:"Zoom Out",onClick:()=>Ie()},m.default.createElement("svg",{viewBox:p.ZOOM_IN_OUT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.ZOOM_OUT_PATH})))),M&&m.default.createElement("i",{className:"vjs-undo","data-undo":"true",title:"Undo last action",onClick:()=>f()}),M&&m.default.createElement("i",{className:"vjs-redo","data-redo":"true",title:"Redo last action",onClick:()=>y()}),m.default.createElement("i",{className:p.CLASS_CONTROLS_RESET_SELECTION,title:r,onClick:()=>R()},m.default.createElement("svg",{viewBox:p.RESET_SELECTION_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.RESET_SELECTION_PATH}))),ne&&m.default.createElement("i",{className:"vjs-clear-dataset",title:G,onClick:()=>A()},m.default.createElement("svg",{viewBox:p.CLEAR_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.CLEAR_PATH}))),Oe.map(S=>m.default.createElement("i",{className:S.class,title:S.title,onClick:I=>S.handler(I,S.id)})))}var w=N(require("react")),ae=require("@visuallyjs/browser-ui");function er(e){let r=(0,w.useRef)(!1),t=(0,w.useRef)(null),n=J(),o=Se(),[l,i]=(0,w.useState)(!0),[a,c]=(0,w.useState)("Export :"),[E,x]=(0,w.useState)(null),[U,d]=(0,w.useState)(null),[G,T]=(0,w.useState)(null),[P,k]=(0,w.useState)(!0),[H,Z]=(0,w.useState)(!0),[ce,M]=(0,w.useState)(!0);function O(de){t.current=de,e.label&&c(a),e.showLabel!=null&&i(e.showLabel),e.margins&&x(e.margins);let Oe=e.svgOptions\|\|{};d(Oe);let pe=e.imageOptions\|\|{};T(pe),e.allowJpgExport!=null&&M(e.allowJpgExport),e.allowPngExport!=null&&Z(e.allowPngExport),e.allowSvgExport!=null&&k(e.allowSvgExport)}function ne(){new ae.SvgExportUI(t.current).export(U)}function ue(){new ae.ImageExportUI(t.current).export(G)}function Pe(){new ae.ImageExportUI(t.current).export(Object.assign(G\|\|{},{type:"image/jpeg"}))}return(0,w.useEffect)(()=>{r.current===!1&&(n!=null?(r.current=!0,O(n)):o!=null&&o.$ui instanceof ae.Surface&&(r.current=!0,O(o.$ui)))},[n,o]),w.default.createElement("div",{className:`${ae.CLASS_CONTROLS} ${ae.CLASS_EXPORT_CONTROLS}`},l&&w.default.createElement("span",null,a),P&&w.default.createElement("i",null,w.default.createElement("a",{href:"#",id:"exportSvg",onClick:()=>ne()},"SVG")),H&&w.default.createElement("i",null,w.default.createElement("a",{href:"#",id:"exportPng",onClick:()=>ue()},"PNG")),ce&&w.default.createElement("i",null,w.default.createElement("a",{href:"#",id:"exportJpg",onClick:()=>Pe()},"JPG")))}var Q=N(require("react")),Le=require("@visuallyjs/browser-ui"),tr=(0,Q.forwardRef)((e,r)=>{let t=(0,Q.useRef)(!1),n=(0,Q.useRef)(null),o=(0,Q.useContext)(V),l=(0,Q.useRef)(null),i=e.className\|\|"";function a(c){c.getShapeLibrary()!=null?l.current=new Le.ShapePalette(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}):(0,Le.log)("WARN: no shapeLibrary provided in props and UI has no shape library. Cannot instantiate ShapePaletteComponent")}return(0,Q.useEffect)(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(c=>a(c)):e.surface!=null?a(e.surface):(0,Le.log)("ShapePaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),Q.default.createElement("div",{ref:n,className:i})});var _e=N(require("react")),Ne=require("@visuallyjs/browser-ui"),Tt=120,_t=90;function rr(e){let r=(0,_e.useRef)(null);function t(){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\|\|Tt}function i(){return e.ctx.obj.data.height\|\|_t}function a(){return e.ctx.obj.data.color\|\|e.ctx.obj.data.outline\|\|"#000000"}function c(){return e.labelProperty\|\|"label"}return(0,_e.useEffect)(()=>{let E=e.ctx.obj.data,x=e.ctx.ui.getShapeLibrary(),U=x.renderCompiledShape(E);if(r.current.replaceChildren(U),e.showLabels){let d=x.renderShapeLabel(E,c(),e.labelStrokeWidth,null,a(),a(),e.font);r.current.appendChild(d),e.multilineLabels!=!1&&(0,Ne.convertToMultilineText)(d,E[c()]\|\|"",l()*(e.labelFillRatio\|\|Ne.DEFAULT_LABEL_FILL_RATIO))}}),_e.default.createElement("svg",{className:Ne.CLASS_SHAPE,ref:r,strokeWidth:t(),fill:n(),stroke:o(),preserveAspectRatio:"none",viewBox:"0 0 "+l()+" "+i()})}var ee=N(require("react")),Ae=require("@visuallyjs/browser-ui"),nr=(0,ee.forwardRef)((e,r)=>{let t=(0,ee.useRef)(!1),n=(0,ee.useRef)(null),o=(0,ee.useContext)(V),l=(0,ee.useRef)(null),i=e.className\|\|"";function a(c){let E={selector:e.selector,source:n.current,dataGenerator:x=>e.dataGenerator?e.dataGenerator(x):(0,Ae.defaultDataGenerator)(x),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 Ae.Palette(c,E)}return(0,ee.useEffect)(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(c=>a(c)):e.surface!=null?a(e.surface):(0,Ae.log)("PaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),ee.default.createElement("div",{className:i,ref:n},e.children)});var te=N(require("react")),j=require("@visuallyjs/browser-ui");function or(e){let r=e.maxColors\|\|10,t=(0,te.useRef)(null),n=(0,te.useRef)(!1),o=ke(),[l,i]=(0,te.useState)(o.ensureContext(j.INSPECTOR_CONTEXT_RECENT_COLORS,()=>[]));function a(d){let G=o.ensureContext(j.INSPECTOR_CONTEXT_RECENT_COLORS,()=>[]);if(d=d.toUpperCase(),!(G.find(P=>P.toUpperCase()===d)!=null)){let P=G.slice();P.unshift(d),P.length>r&&(P.length=r),o.updateContext(j.INSPECTOR_CONTEXT_RECENT_COLORS,P)}}function c(){let d=t.current.value;o.setValue(e.propertyName,d,null),a(d)}function E(d){o.setValue(e.propertyName,d,null),t.current.value=d}let x=d=>{d.key===j.INSPECTOR_CONTEXT_RECENT_COLORS&&i(d.value.slice())};function U(){let d=o.getValue(e.propertyName);d!=null&&t.current&&a(d)}return(0,te.useEffect)(()=>(o.bind(j.EVENT_CONTEXT_UPDATE,x),o.bind(j.EVENT_CHANGE,U),n.current\|\|(n.current=!0,t.current.addEventListener(j.EVENT_CHANGE,c)),setTimeout(U),()=>{o.unbind(j.EVENT_CONTEXT_UPDATE,x),o.unbind(j.EVENT_CHANGE,U)})),te.default.createElement("div",{className:j.CLASS_COLOR_PICKER},te.default.createElement("input",{type:"color",ref:t,"vjs-att":e.propertyName}),te.default.createElement("div",{className:j.CLASS_COLOR_PICKER_SWATCHES},l.map(d=>te.default.createElement("div",{key:d,title:d,className:j.CLASS_COLOR_PICKER_SWATCH,style:{backgroundColor:d},"data-color":d,onClick:()=>E(d)}))))}var re=N(require("react")),et=require("@visuallyjs/browser-ui"),ar=(0,re.forwardRef)((e,r)=>{let t=(0,re.useRef)(!1),n=(0,re.useRef)(null),o=(0,re.useContext)($),l=(0,re.useRef)(null),i=e.className\|\|"";function a(E){l.current=new et.DiagramPalette(n.current,E,{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,re.useEffect)(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(E=>a(E)):e.diagram!=null?a(e.diagram):(0,et.log)("DiagramPaletteComponent cannot start: no DiagramContext from a provider found, and no Diagram provided in props"))});let c=e.style\|\|{};return re.default.createElement("div",{ref:n,className:i,style:c})});var z=N(require("react")),B=require("@visuallyjs/browser-ui");function ie(e){let r=(0,z.useRef)(null),t=(0,z.useRef)(!1),n=(0,z.useRef)(!1),o=(0,z.useRef)(null),l=e.style\|\|{},i=(0,z.useContext)(V),a=(0,z.useContext)($);return(0,z.useEffect)(()=>{if(!t.current)if(t.current=!0,i!=null)i.listen(c=>{let E=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.current,E),n.current=!0});else if(a!=null)a.listen(c=>{let E=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.current,E),n.current=!0});else{let c=Object.assign({dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.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&&((0,z.useEffect)(()=>{n.current&&e.data!=null&&o.current&&o.current.load({data:e.data})},[e.data]),(0,z.useEffect)(()=>{n.current&&e.url!=null&&o.current&&o.current.load({url:e.url})},[e.url]),(0,z.useEffect)(()=>{n.current&&e.pivot!=null&&o.current&&o.current.pivot&&o.current.pivot(e.pivot)},[e.pivot]),(0,z.useEffect)(()=>{n.current&&e.dataSourceFilter!=null&&o.current&&o.current.setDataSourceFilter&&o.current.setDataSourceFilter(e.dataSourceFilter)},[e.dataSourceFilter])),z.default.createElement("div",{ref:r,style:l,className:`${e.className\|\|""}`})}function lr(e){let r=Object.assign({createChart:(t,n)=>new B.ColumnChart(t,n)},e);return ie(r)}function ir(e){let r=Object.assign({createChart:(t,n)=>new B.BarChart(t,n)},e);return ie(r)}function sr(e){let r=Object.assign({createChart:(t,n)=>new B.CategoryValueChart(t,n)},e);return ie(r)}function cr(e){let r=Object.assign({createChart:(t,n)=>new B.LineChart(t,n)},e);return ie(r)}function ur(e){let r=Object.assign({createChart:(t,n)=>new B.AreaChart(t,n)},e);return ie(r)}function dr(e){let r=Object.assign({createChart:(t,n)=>new B.PieChart(t,n)},e);return ie(r)}function pr(e){let r=Object.assign({createChart:(t,n)=>new B.ScatterChart(t,n)},e);return ie(r)}function mr(e){let r=Object.assign({createChart:(t,n)=>new B.BubbleChart(t,n)},e);return ie(r)}function fr(e){let r=Object.assign({createChart:(t,n)=>new B.GaugeChart(t,n)},e);return ie(r)}function Er(e){let r=Object.assign({createChart:(t,n)=>new B.SankeyChart(t,n)},e);return e.interactive!=null&&(r.options.interactive=e.interactive),e.pivot!=null&&(r.options.pivot=e.pivot),e.csvData&&(r.options.csvData=e.csvData),e.jsonData&&(r.options.jsonData=e.jsonData),ie(r)}var Nt=require("@visuallyjs/browser-ui"),fe=N(require("react"));function mt(e){let r=(0,fe.useRef)(!1),t=(0,fe.useRef)(null),n=(0,fe.useContext)(V),o=e.position\|\|{x:0,y:0};function l(i){e.placement==="fixed"?i.fixElement(t.current,o,e.constraints):i.floatElement(t.current,o)}return(0,fe.useEffect)(()=>{r.current\|\|(r.current=!0,n!=null?n.listen(i=>l(i)):(0,Nt.log)("Decorator cannot mount: no SurfaceContext from a provider found"))}),fe.default.createElement("div",{ref:t},e.children)}var se=require("@visuallyjs/browser-ui"),be=N(require("react"));function tt(e){let r=(0,be.useRef)(!1),t=J();return(0,be.useEffect)(()=>{if(t!=null&&!r.current){r.current=!0;try{t.addPlugin({type:se.BackgroundPlugin.type,options:e})}catch(n){(0,se.log)(`WARN: BackgroundComponent could not mount background ${n}`)}}},[t]),be.default.createElement(be.default.Fragment,null)}function Cr(e){return tt(rt({type:se.GeneratedGridBackground.type},e))}function gr(e){return tt({type:se.SimpleBackground.type,url:e.url})}function xr(e){return tt(rt({type:se.TiledBackground.type},e))}var At=require("react"),we=require("@visuallyjs/browser-ui");function Pr(e){let r=ct();(0,At.useEffect)(()=>{if(r!=null){let t=()=>e(r);return r.bind(we.EVENT_DATA_UPDATED,t),r.bind(we.EVENT_GRAPH_CLEARED,t),t(),()=>{r.unbind(we.EVENT_DATA_UPDATED,t),r.unbind(we.EVENT_GRAPH_CLEARED,t)}}},[r])}var Ve=require("react"),ft=require("@visuallyjs/browser-ui");function Or(e){let r=J(),t=it(),[n,o]=(0,Ve.useState)(e),[l,i]=(0,Ve.useState)(()=>(n==null?void 0:n.getZoom())\|\|1);return(0,Ve.useEffect)(()=>{if(n!=null){let a=c=>{i(c.zoom)};return n.bind(ft.EVENT_ZOOM,a),i(n.getZoom()),()=>{n.unbind(ft.EVENT_ZOOM,a)}}},[n]),(0,Ve.useEffect)(()=>{r!=null&&o(r),t!=null&&o(t)},[r,t]),l}
1	+ var wt=Object.create;var Be=Object.defineProperty;var Vt=Object.getOwnPropertyDescriptor;var Mt=Object.getOwnPropertyNames,Et=Object.getOwnPropertySymbols,It=Object.getPrototypeOf,gt=Object.prototype.hasOwnProperty,Bt=Object.prototype.propertyIsEnumerable;var Ct=(e,r,t)=>r in e?Be(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,rt=(e,r)=>{for(var t in r\|\|(r={}))gt.call(r,t)&&Ct(e,t,r[t]);if(Et)for(var t of Et(r))Bt.call(r,t)&&Ct(e,t,r[t]);return e};var Ut=(e,r)=>{for(var t in r)Be(e,t,{get:r[t],enumerable:!0})},xt=(e,r,t,n)=>{if(r&&typeof r=="object"\|\|typeof r=="function")for(let o of Mt(r))!gt.call(e,o)&&o!==t&&Be(e,o,{get:()=>r[o],enumerable:!(n=Vt(r,o))\|\|n.enumerable});return e};var N=(e,r,t)=>(t=e!=null?wt(It(e)):{},xt(r\|\|!e\|\|!e.__esModule?Be(t,"default",{value:e,enumerable:!0}):t,e)),jt=e=>xt(Be({},"__esModule",{value:!0}),e);var Rr={};Ut(Rr,{ATTRIBUTE_CAN_REDO:()=>vt,ATTRIBUTE_CAN_UNDO:()=>Dt,AreaChartComponent:()=>ur,BackgroundComponent:()=>tt,BarChartComponent:()=>ir,BrowserUIReactModel:()=>Ce,BubbleChartComponent:()=>mr,CLASS_REACT_GROUP:()=>ze,CLASS_REACT_NODE:()=>Fe,CLASS_REACT_OVERLAY:()=>je,CLASS_SELECTED_MODE:()=>Qe,ColorPickerComponent:()=>or,ColumnChartComponent:()=>lr,ControlsComponent:()=>Qt,DEFAULT_SHAPE_HEIGHT:()=>_t,DEFAULT_SHAPE_WIDTH:()=>Tt,DecoratorComponent:()=>mt,DiagramComponent:()=>Wt,DiagramContext:()=>$,DiagramPaletteComponent:()=>ar,DiagramProvider:()=>Ht,EdgeTypePickerComponent:()=>Ft,ExportControlsComponent:()=>er,GaugeChartComponent:()=>fr,GridBackgroundComponent:()=>Cr,ImageBackgroundComponent:()=>gr,InspectorComponent:()=>Kt,InspectorContext:()=>Ge,JSXWrapper:()=>He,LineChartComponent:()=>cr,MiniviewComponent:()=>qt,PaletteComponent:()=>nr,PaperComponent:()=>Xt,PaperContext:()=>le,PaperProvider:()=>zt,PieChartComponent:()=>dr,SankeyChartComponent:()=>Er,ScatterChartComponent:()=>pr,ShapeComponent:()=>rr,ShapePaletteComponent:()=>tr,SurfaceComponent:()=>Zt,SurfaceContext:()=>V,SurfacePopup:()=>Rt,SurfaceProvider:()=>Lt,TiledImageBackgroundComponent:()=>xr,VisuallyJsContext:()=>he,VisuallyJsProvider:()=>Jt,XYChartComponent:()=>sr,createDiagramRef:()=>st,createInspectorRef:()=>lt,createPaperRef:()=>Ye,createRefHandler:()=>ge,createSurfaceRef:()=>ve,getSurfaceComponent:()=>kt,newInstance:()=>at,registerSurface:()=>ot,useDiagram:()=>Se,useInspector:()=>ke,usePaper:()=>it,useSurface:()=>J,useVisuallyJsModel:()=>ct,useVisuallyJsUpdate:()=>Pr,useZoom:()=>Or});module.exports=jt(Rr);var nt=require("@visuallyjs/browser-ui"),Pt=new Map,Ue={};function ot(e,r){Pt.set(e,r),Gt(e,r)}function Gt(e,r){(Ue[e]\|\|[]).forEach(n=>{try{n(r)}catch(o){(0,nt.log)("WARN: an error was reported invoking a SurfaceComponentRefCallback "+o)}}),delete Ue[e]}function kt(e,r){let t=Pt.get(e);if(t)try{r(t)}catch(n){(0,nt.log)("WARN: an error was reported invoking a SurfaceComponentRefCallback "+n)}else Ue[e]=Ue[e]\|\|[],Ue[e].push(r)}var Fe="vjs-react-node",ze="vjs-react-group",je="vjs-react-overlay";var ye=N(require("react"));function He(e){let r=(0,ye.useRef)(!1);return(0,ye.useEffect)(()=>{r.current\|\|(r.current=!0,e.cb(e.ns))}),ye.default.createElement(ye.default.Fragment,null,e.ns.def.jsx({obj:e.ns.obj,vertex:e.ns.obj,model:e.model,ui:e.ui,data:e.ns.obj.data,props:e.childProps\|\|{}}))}var We=require("@visuallyjs/browser-ui"),Ce=class extends We.BrowserUIModel{render(r,t){return(0,We.log)("render called directly on BrowserUIReactModel class: should not happen. UI components should use internal render."),null}};function at(e){return e=e\|\|{},new Ce(e)}var X=N(require("react")),V=(0,X.createContext)(null);function Lt(e){let r=(0,X.useRef)(null),t=ve(r);return X.default.createElement(V.Provider,{value:t},e.children\|\|[])}function ve(e){return ge(e)}function ge(e){let r=[];return{set:t=>{e.current=t,r.forEach(n=>n(t))},listen:t=>{e.current==null?r.push(t):t(e.current)},ref:()=>e}}function J(){let e=(0,X.useContext)(V),[r,t]=(0,X.useState)(null);return(0,X.useEffect)(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}var Je=require("react"),Ge=(0,Je.createContext)(null);function lt(e){return ge(e)}function ke(){let e=(0,Je.useContext)(Ge);return e==null?null:e.ref().current}var xe=N(require("react")),$e=require("@visuallyjs/browser-ui");function Ft(e){let r=(0,xe.useRef)(!1),t=(0,xe.useRef)(null),n=(0,xe.useRef)(null),o=ke(),{propertyName:l}=e,i=()=>o.getFromContext($e.INSPECTOR_CONTEXT_EDGE_PROPERTY_MAPPINGS)\|\|o.$ui.$getEdgePropertyMappings();return(0,xe.useEffect)(()=>{r.current\|\|(r.current=!0,n.current=new $e.EdgeTypePicker(o.$ui,t.current,i(),o.getValue(l),(a,c)=>{o.setValue(l,c,null)}),n.current.render(l,o.et),o.onChange(()=>{n.current.select(l,o.getValue(l))}))}),xe.default.createElement("div",{ref:t})}var q=N(require("react")),le=(0,q.createContext)(null);function zt(e){let r=(0,q.useRef)(null),t=Ye(r);return q.default.createElement(le.Provider,{value:t},e.children\|\|[])}function Ye(e){return ge(e)}function it(){let e=(0,q.useContext)(le),[r,t]=(0,q.useState)(null);return(0,q.useEffect)(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}var v=N(require("react")),Ot=require("@visuallyjs/browser-ui"),$=(0,v.createContext)(null);function st(e){return ge(e)}function Ht(e){let r=(0,v.useRef)(null),t=st(r);return v.default.createElement($.Provider,{value:t},e.children\|\|[])}function Se(){let e=(0,v.useContext)($),[r,t]=(0,v.useState)(null);return(0,v.useEffect)(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}var Wt=(0,v.forwardRef)((e,r)=>{let t=(0,v.useRef)(null),n=(0,v.useRef)(!1),o,l,i=(0,v.useContext)($);i==null?(o=(0,v.useRef)(null),i=st(o)):o=i.ref();let a=(0,v.useContext)(V);a==null?(l=(0,v.useRef)(null),a=ve(l)):l=a.ref();let c={getDiagram:()=>o.current};(0,v.useImperativeHandle)(r,()=>c),(0,v.useEffect)(()=>{n.current\|\|(n.current=!0,o.current=(0,Ot.createDiagram)(t.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}),i.set(o.current),a.set(l.current))});let E=`${e.className\|\|""} vjs-react-diagram`,x=e.style\|\|{};return v.default.createElement("div",{ref:t,className:E,style:x},v.default.createElement(V.Provider,{value:a},v.default.createElement($.Provider,{value:i},e.children)))});var L=N(require("react")),he=(0,L.createContext)(void 0);function Jt(e){let r=(0,L.useMemo)(()=>at(e.modelOptions\|\|{}),[]);function t(o,l){r.clear(),r.load({data:o,dataType:l})}function n(o,l){r.clear(),r.load({url:o,dataType:l})}return e.data!=null&&t(e.data,e.dataType),e.url!=null&&t(e.url,e.dataType),(0,L.useEffect)(()=>{e.data!=null&&t(e.data,e.dataType)},[e.data]),(0,L.useEffect)(()=>{e.url!=null&&n(e.url,e.dataType)},[e.url]),L.default.createElement(he.Provider,{value:r},e.children\|\|[])}function ct(){let e=(0,L.useContext)(he),r=(0,L.useContext)(V),t=(0,L.useContext)(le),n=(0,L.useContext)($),[o,l]=(0,L.useState)(e);return(0,L.useEffect)(()=>{if(e){l(e);return}let i;r!=null&&(r.ref().current?l(r.ref().current.model):(i=E=>{l(E.model)},r.listen(i)));let a;t!=null&&(t.ref().current?o==null&&l(t.ref().current.model):(a=E=>{o==null&&l(E.model)},t.listen(a)));let c;n!=null&&(n.ref().current?o==null&&l(n.ref().current.model):(c=E=>{o==null&&l(E.model)},n.listen(c)))}),o}var ut=N(require("react")),K=require("@visuallyjs/browser-ui");function $t(e,r){if(e.hydrated!==!0){let t=(0,K.isGroup)(e.obj)?ze:Fe;e.domElement.firstElementChild&&(0,K.addClass)(e.domElement.firstElementChild,t),e.hydrated=!0}else r.current.$revalidateElement(e.domElement)}function Ze(e,r,t,n){return ut.default.createElement(He,{ns:e,model:r,ui:t.current,childProps:n,cb:o=>{$t(o,t)}})}function Xe(e,r,t,n){return ut.default.createElement(He,{ns:e,model:r,ui:t.current,childProps:n,cb:o=>{Yt(o,t)}})}function Yt(e,r){if(e.hydrated!==!0){let t=(0,K.isGroup)(e.obj)?ze:Fe;e.domElement.firstElementChild&&((0,K.addClass)(e.domElement.firstElementChild,t),e.domElement.firstElementChild.getAttribute(K.ATTRIBUTE_NOT_DRAGGABLE)===K.TRUE&&e.domElement.setAttribute(K.ATTRIBUTE_NOT_DRAGGABLE,K.TRUE)),r.current.$vertexRendered(e.obj,e.domElement,e.def,e.payload.eventInfo),e.hydrated=!0}else r.current.$revalidateElement(e.domElement)}var h=N(require("react")),dt=N(require("react-dom")),C=require("@visuallyjs/browser-ui"),Zt=(0,h.forwardRef)((e,r)=>{let t=(0,h.useRef)(!1),n=(0,h.useRef)(!1),o=(0,h.useContext)(he),l=(0,h.useRef)(null),i=(0,h.useRef)(null),a=(0,h.useRef)(o),c,E=(0,h.useContext)(V);E==null?(c=(0,h.useRef)(null),E=ve(c)):c=E.ref();let[x,U]=(0,h.useState)([]),[d,G]=(0,h.useState)([]),T=[],P=[];function k(){U(T.slice())}function H(){G(P.slice())}let Z={getSurface:()=>c.current,getModel:()=>a.current};(0,h.useImperativeHandle)(r,()=>Z),(0,h.useEffect)(()=>{var O;if(!n.current){n.current=!0,e.model!=null?a.current=e.model:o==null?a.current=new Ce(e.modelOptions\|\|{}):a.current=o,typeof document!="undefined"&&(i.current=document.createElement("div"),i.current.style.position="fixed",i.current.style.left="10000px",i.current.style.top="10000px",i.current.style.width="100px",i.current.style.height="100px",i.current.style.opacity="0",l.current.appendChild(i.current));let ne=(s,u,R,A,f,y,_,me)=>{let[S,I]=y.component\|\|y.jsx?[y,null]:(0,C.isGroup)(_)?[Object.assign(Object.assign({},y),{jsx:F=>h.default.createElement(h.default.Fragment,null,F.obj.data.label)}),C.CLASS_DEFAULT_GROUP]:[Object.assign(Object.assign({},y),{jsx:F=>h.default.createElement(h.default.Fragment,null,F.obj.data.label)}),C.CLASS_DEFAULT_NODE],W=f.containerType===C.ElementTypes.HTML?document.createElement(C.ELEMENT_DIV):(0,C.$svgNode)(C.ELEMENT_SVG);i.current.appendChild(W),I!=null&&f.$addClassToElement(W,I);let De={data:u,model:R,ui:f,componentId:_.getFullId(),obj:_,props:e.childProps,element:W,eventInfo:me};T.push({data:u,def:S,payload:De,domElement:W,key:_.id,obj:_,hydrated:!1}),k()},ue=(s,u)=>{u.parentNode&&u.parentNode.removeChild(u)},Pe={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(s,u,R,A)=>{},render:ne,rerender:(s,u,R,A,f,y,_,me,S)=>{let I=(0,C.partition)(T,W=>W.obj!==_);T=I.left,k(),ne(s,u,R,A,f,y,_,me),I.right.length>0&&setTimeout(()=>{ue(null,I.right[0].domElement)})},cleanupVertex:ue,cleanupPort:(s,u)=>{}},de=((O=e.viewOptions)==null?void 0:O.edges)\|\|{};for(let s in de){let u=de[s];u.overlays!=null&&(u.overlays=u.overlays.map(R=>R.jsx!=null?{type:C.OVERLAY_TYPE_CUSTOM,options:{create:f=>{let y=document.createElement(C.ELEMENT_DIV);y.className=je;let _={data:f.edge.data,model:a.current,ui:pe,componentId:f.edge.getFullId(),obj:f.edge,props:e.childProps,element:y};return P.push({def:{jsx:R.jsx},data:f.edge.data,obj:f.edge,payload:_,domElement:y,key:(0,C.uuid)(),hydrated:!1}),H(),y}}}:R))}let Oe=Object.assign(e.renderOptions\|\|{},{view:e.viewOptions,selection:e.selection}),pe=(0,C.renderSurface)(a.current,l.current,Pe,Oe);E.set(pe),e.surfaceId!=null&&ot(e.surfaceId,Z);let Ee=(s,u)=>{let R=()=>{let f={};return(u.originalData\|\|u.updates)&&(f=(0,C.extend)(u.originalData,u.updates)),f},A=T.find(f=>f.key===s);A!=null&&(A.data=R(),k())},Re=s=>{T=T.filter(u=>u.payload.componentId!==s),k()},Me=(s,u)=>{let R=()=>{let f={};return(u.originalData\|\|u.updates)&&(f=(0,C.extend)(u.originalData,u.updates)),f},A=P.find(f=>f.obj.id===s);A!=null&&(A.data=R(),H())},Ie=s=>{P=P.filter(u=>u.payload.obj.id!==s),H()};a.current.bind(C.EVENT_NODE_UPDATED,s=>{Ee(s.vertex.getFullId(),s)}),a.current.bind(C.EVENT_GROUP_UPDATED,s=>{Ee(s.vertex.getFullId(),s)}),a.current.bind(C.EVENT_NODE_REMOVED,s=>{Re(s.node.id)}),a.current.bind(C.EVENT_GROUP_REMOVED,s=>{Re(s.group.id)}),a.current.bind(C.EVENT_EDGE_REMOVED,s=>{Ie(s.edge.id)}),a.current.bind(C.EVENT_EDGE_UPDATED,s=>{Me(s.edge.id,s)}),a.current.bind(C.EVENT_GRAPH_CLEARED,()=>{T=[],k(),P=[],H()})}}),(0,h.useEffect)(()=>{n.current&&a.current!=null&&c.current!=null&&t.current===!1&&(e.data!=null\|\|e.url!=null)&&(t.current=!0,a.current.clear(),a.current.load({data:e.data,url:e.url,onload:()=>{t.current=!1,setTimeout(()=>c.current.repaintEverything(),250)}}))},[e.data,e.url]);let ce=`${e.className\|\|""} vjs-react-surface`,M=e.style\|\|{};return h.default.createElement("div",{ref:l,className:ce,style:M},x.map(O=>dt.createPortal(Xe(O,a.current,c,e.childProps),O.domElement,O.key)),d.map(O=>dt.createPortal(Ze(O,a.current,c,e.childProps),O.domElement,O.key)),h.default.createElement(V.Provider,{value:E},e.children))});var Y=N(require("react")),qe=require("@visuallyjs/browser-ui");function Rt(e){let r=J(),t=(0,Y.useRef)(null),n=(0,Y.useRef)(!1),o=(0,Y.useRef)(null),[l,i]=(0,Y.useState)(null),[a,c]=(0,Y.useState)(0),E=(0,Y.useMemo)(()=>l==null?"none":"block",[l]);function x(d){i(d),c(G=>G+1)}(0,Y.useEffect)(()=>{!n.current&&r&&(n.current=!0,o.current=new qe.PopupHandler(e.selector,t.current,r,d=>x(d),e.anchor))});function U(){o.current&&o.current.$hide()}return Y.default.createElement("div",{ref:t,className:qe.CLASS_SURFACE_POPUP,style:{display:E,position:"absolute"}},l!=null&&e.children(l,r.model,r,()=>U()))}var b=N(require("react")),pt=N(require("react-dom")),g=require("@visuallyjs/browser-ui"),Xt=(0,b.forwardRef)((e,r)=>{let t=(0,b.useRef)(!1),n=(0,b.useRef)(!1),o=(0,b.useContext)(he),l=(0,b.useRef)(null),i=(0,b.useRef)(null),a=(0,b.useRef)(null),c,E=(0,b.useContext)(le);E==null?(c=(0,b.useRef)(null),E=Ye(c)):c=E.ref();let[x,U]=(0,b.useState)([]),[d,G]=(0,b.useState)([]),T=[],P=[];function k(){U(T.slice())}function H(){G(P.slice())}let Z={getPaper:()=>c.current,getModel:()=>a.current};(0,b.useImperativeHandle)(r,()=>Z),(0,b.useEffect)(()=>{var O;if(!n.current){n.current=!0,e.model!=null?a.current=e.model:o==null?a.current=new Ce(e.modelOptions\|\|{}):a.current=o,typeof document!="undefined"&&(i.current=document.createElement("div"),i.current.style.position="fixed",i.current.style.left="10000px",i.current.style.top="10000px",i.current.style.width="100px",i.current.style.height="100px",i.current.style.opacity="0",l.current.appendChild(i.current));let ne=(s,u,R,A,f,y,_,me)=>{let[S,I]=y.component\|\|y.jsx?[y,null]:(0,g.isGroup)(_)?[Object.assign(Object.assign({},y),{jsx:F=>b.default.createElement(b.default.Fragment,null,F.obj.data.label)}),g.CLASS_DEFAULT_GROUP]:[Object.assign(Object.assign({},y),{jsx:F=>b.default.createElement(b.default.Fragment,null,F.obj.data.label)}),g.CLASS_DEFAULT_NODE],W=f.containerType===g.ElementTypes.HTML?document.createElement(g.ELEMENT_DIV):(0,g.$svgNode)(g.ELEMENT_SVG);i.current.appendChild(W),I!=null&&f.$addClassToElement(W,I);let De={data:u,model:R,ui:f,componentId:_.getFullId(),obj:_,props:e.childProps,element:W,eventInfo:me};T.push({data:u,def:S,payload:De,domElement:W,key:_.id,obj:_,hydrated:!1}),k()},ue=(s,u)=>{u.parentNode&&u.parentNode.removeChild(u)},Pe={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(s,u,R,A)=>{},render:ne,rerender:(s,u,R,A,f,y,_,me,S)=>{let I=(0,g.partition)(T,W=>W.obj!==_);T=I.left,k(),ne(s,u,R,A,f,y,_,me),I.right.length>0&&setTimeout(()=>{ue(null,I.right[0].domElement)})},cleanupVertex:ue,cleanupPort:(s,u)=>{}},de=((O=e.viewOptions)==null?void 0:O.edges)\|\|{};for(let s in de){let u=de[s];u.overlays!=null&&(u.overlays=u.overlays.map(R=>R.jsx!=null?{type:g.OVERLAY_TYPE_CUSTOM,options:{create:f=>{let y=document.createElement(g.ELEMENT_DIV);y.className=je;let _={data:f.edge.data,model:a.current,ui:pe,componentId:f.edge.getFullId(),obj:f.edge,props:e.childProps,element:y};return P.push({def:{jsx:R.jsx},data:f.edge.data,obj:f.edge,payload:_,domElement:y,key:(0,g.uuid)(),hydrated:!1}),H(),y}}}:R))}let Oe=Object.assign(e.renderOptions\|\|{},{view:e.viewOptions}),pe=(0,g.renderPaper)(a.current,l.current,Pe,Oe);E.set(pe);let Ee=(s,u)=>{let R=()=>{let f={};return(u.originalData\|\|u.updates)&&(f=(0,g.extend)(u.originalData,u.updates)),f},A=T.find(f=>f.key===s);A!=null&&(A.data=R(),k())},Re=s=>{T=T.filter(u=>u.payload.componentId!==s),k()},Me=(s,u)=>{let R=()=>{let f={};return(u.originalData\|\|u.updates)&&(f=(0,g.extend)(u.originalData,u.updates)),f},A=P.find(f=>f.obj.id===s);A!=null&&(A.data=R(),H())},Ie=s=>{P=P.filter(u=>u.payload.obj.id!==s),H()};a.current.bind(g.EVENT_NODE_UPDATED,s=>{Ee(s.vertex.getFullId(),s)}),a.current.bind(g.EVENT_GROUP_UPDATED,s=>{Ee(s.vertex.getFullId(),s)}),a.current.bind(g.EVENT_NODE_REMOVED,s=>{Re(s.node.id)}),a.current.bind(g.EVENT_GROUP_REMOVED,s=>{Re(s.group.id)}),a.current.bind(g.EVENT_EDGE_REMOVED,s=>{Ie(s.edge.id)}),a.current.bind(g.EVENT_EDGE_UPDATED,s=>{Me(s.edge.id,s)}),a.current.bind(g.EVENT_GRAPH_CLEARED,()=>{T=[],k(),P=[],H()})}}),(0,b.useEffect)(()=>{n.current&&a.current!=null&&c.current!=null&&t.current===!1&&(e.data!=null\|\|e.url!=null)&&(t.current=!0,a.current.clear(),a.current.load({data:e.data,url:e.url,onload:()=>{t.current=!1,setTimeout(()=>c.current.repaintEverything(),250)}}))},[e.data,e.url]);let ce=`${e.className\|\|""} vjs-react-paper`,M=e.style\|\|{};return b.default.createElement("div",{ref:l,className:ce,style:M},x.map(O=>pt.createPortal(Xe(O,a.current,c,e.childProps),O.domElement,O.key)),d.map(O=>pt.createPortal(Ze(O,a.current,c,e.childProps),O.domElement,O.key)),b.default.createElement(le.Provider,{value:E},e.children))});var Ke=require("@visuallyjs/browser-ui"),oe=N(require("react")),qt=(0,oe.forwardRef)((e,r)=>{let t=J(),n=Se(),o=(0,oe.useRef)(!1),l=(0,oe.useRef)(null),i;(0,oe.useImperativeHandle)(r,()=>({toggleCollapsed:()=>i==null?void 0:i.toggleCollapsed()}));function a(c){c.addPlugin({type:Ke.MiniviewPlugin.type,options:{container:l.current,elementFilter:e.elementFilter,typeFunction:e.typeFunction,activeTracking:e.activeTracking,clickToCenter:e.clickToCenter,showLasso:e.showLasso,trackSelection:e.trackSelection}})}return(0,oe.useEffect)(()=>{o.current\|\|(t!=null?(o.current=!0,a(t)):n!=null&&n.$ui instanceof Ke.Surface&&(o.current=!0,a(n.$ui)))},[t,n]),oe.default.createElement("div",{ref:l,className:`${e.className\|\|""}`})});var Te=require("@visuallyjs/browser-ui"),D=N(require("react")),Kt=(0,D.forwardRef)((e,r)=>{let t=(0,D.useContext)(V),n=(0,D.useContext)($),o=(0,D.useContext)(le),l,i=(0,D.useContext)(Ge);i==null&&(l=(0,D.useRef)(null),i=lt(l));let[a,c]=(0,D.useState)(null),[E,x]=(0,D.useState)(0),[U,d]=(0,D.useState)(null),G=(0,D.useRef)(!1),T=(0,D.useRef)(null),P=e.className\|\|"";(0,D.useEffect)(()=>{var M;(M=l==null?void 0:l.current)==null\|\|M.$refresh()},[E]);let k=e.onSelectionCleared\|\|(()=>c(null)),H=(M,O)=>{c(M),e.refresh&&e.refresh(M),x(ne=>ne+1)};function Z(M){l.current=new Te.Inspector({container:T.current,ui:M,renderEmptyContainer:k,refresh:H,autoCommit:e.autoCommit,multipleSelections:e.multipleSelections,filter:e.filter,showCloseButton:e.showCloseButton,afterUpdate:()=>e.afterUpdate?e.afterUpdate(M):null}),d(l.current)}let ce={getInspector:()=>U};return(0,D.useImperativeHandle)(r,()=>ce),(0,D.useEffect)(()=>{G.current\|\|(G.current=!0,t!=null?t.listen(Z):o!=null?o.listen(Z):n!=null?n.listen(M=>{M.$ui instanceof Te.Surface&&Z(M.$ui)}):(0,Te.log)("WARN: InspectorComponent cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))}),D.default.createElement("div",{ref:T,className:P},D.default.createElement(Ge.Provider,{value:i},a!=null&&D.default.createElement(D.default.Fragment,null,typeof e.children=="function"?e.children(a,l.current.$ui.model):e.children\|\|[]),a==null&&D.default.createElement(D.default.Fragment,null,e.renderEmptyContent&&e.renderEmptyContent())))});var Tl="group:added",_l="group:member:added",Nl="group:member:removed",Al="group:removed",wl="dataLoadStart",Vl="dataAppendStart",Ml="dataLoadEnd",Il="dataAppendEnd",Bl="dataUpdated",Ul="graphClearStart",jl="graphCleared",Gl="graphChanged",kl="group:updated",Ll="node:updated",Fl="port:updated",zl="edge:updated",Hl="edge:added",Wl="node:added",Jl="edge:removed",$l="node:removed",Yl="port:added",Zl="port:removed",Xl="edge:target",ql="edge:source",yt="select",St="deselect",ht="selection:cleared",Kl="edge:geometry",Ql="edge:pathEdited",ei="edge:dragStart",ti="edge:drag",ri="edge:dragEnd",ni="edge:dragAbort",oi="edge:typeChanged",ai="node:typeChanged",li="port:typeChanged",ii="group:typeChanged",si="group:move:start",ci="group:move",ui="group:move:end",di="internal:group:sizeChanged",pi="internal:group:sizeChangedRedo",mi="internal:group:sizeChangedUndo",fi="internal:edge:redraw",Ei="renderer:added",Ci="node:move:start",gi="node:move",xi="node:move:end",Pi="node:move:abort",Oi="undoredo:update",Ri="undo",yi="redo",Si="destroy";var m=N(require("react")),p=require("@visuallyjs/browser-ui"),Dt="can-undo",vt="can-redo",Qe="vjs-selected-mode",bt="vjs-controls-has-selection";function Qt(e){let r="Clear selection",t=J(),n=Se(),[o,l]=(0,m.useState)("row"),[i,a]=(0,m.useState)(!1),[c,E]=(0,m.useState)(!1),x=(0,m.useRef)(null),U=(0,m.useRef)(!1),d=(0,m.useRef)(null),[G,T]=(0,m.useState)("Clear dataset?"),P=(0,m.useRef)(null),[k,H]=(0,m.useState)(!0),[Z,ce]=(0,m.useState)(!1),[M,O]=(0,m.useState)(!0),[ne,ue]=(0,m.useState)(!0),[Pe,de]=(0,m.useState)([]),[Oe,pe]=(0,m.useState)([]);function Ee(S){d.current=S,e.clearMessage&&T(e.clearMessage),e.onMaybeClear&&(P.current=e.onMaybeClear),e.orientation&&l(e.orientation),e.undoRedo===!1&&O(!1),e.zoomToExtents===!1&&H(!1),e.zoomButtons===!0&&ce(!0),e.clear===!1&&ue(!1);let I=(e.buttons\|\|[]).filter(F=>F.mode!=null);de(I);let W=(e.buttons\|\|[]).filter(F=>F.mode==null);pe(W),S.bind(p.EVENT_SURFACE_MODE_CHANGED,F=>{S.removeClass(S.$getSelector(x.current,"[data-mode]"),Qe),S.addClass(S.$getSelector(x.current,"[data-mode='"+F+"']"),Qe)}),S.model.bind(p.EVENT_UNDOREDO_UPDATE,F=>{x.current.setAttribute(Dt,F.undoCount>0?p.TRUE:p.FALSE),x.current.setAttribute(vt,F.redoCount>0?p.TRUE:p.FALSE)}),S.model.bind(yt,_),S.model.bind(St,_),S.model.bind(ht,_);let De=S.getPlugin(p.LassoPlugin.type);a(De!=null),E(De!=null\|\|I.length>0)}function Re(){d.current.model.clearSelection(),d.current.zoomToFit()}function Me(){d.current.zoomIn()}function Ie(){d.current.zoomOut()}function s(){d.current.setMode(p.SURFACE_MODE_PAN)}function u(){d.current.setMode(p.SURFACE_MODE_SELECT)}function R(){d.current.model.clearSelection(),(0,p.supportsPathEditing)(d.current)&&d.current.stopEditingPath()}function A(){P.current!=null?P.current(()=>d.current.model.clear()):window.confirm(G)&&d.current.model.clear()}function f(){d.current.model.undo()}function y(){d.current.model.redo()}let _=()=>{d.current.model.getSelection().isEmpty()?x.current.removeAttribute(bt):x.current.setAttribute(bt,"true")};(0,m.useEffect)(()=>{U.current===!1&&(t!=null?(U.current=!0,Ee(t)):n!=null&&n.$ui instanceof p.Surface&&(U.current=!0,Ee(n.$ui)))},[t,n]);let me=e.style\|\|{};return m.default.createElement("div",{style:me,ref:x,className:`vjs-controls ${e.className\|\|""}`,"data-vjs-orientation":o},c&&m.default.createElement("i",{className:"vjs-pan-mode "+Qe,"data-mode":p.SURFACE_MODE_PAN,title:"Pan Mode",onClick:()=>s()},m.default.createElement("svg",{fill:"none",viewBox:p.PAN_VIEW_BOX,stroke:"currentColor"},m.default.createElement("path",{d:p.PAN_PATH}))),i&&m.default.createElement("i",{className:"vjs-select-mode","data-mode":p.SURFACE_MODE_SELECT,title:"Select Mode",onClick:()=>u()},m.default.createElement("svg",{fill:"currentColor",viewBox:p.LASSO_VIEW_BOX,stroke:"currentColor"},m.default.createElement("path",{d:p.LASSO_PATH}))),Pe.map(S=>m.default.createElement("i",{className:S.class,title:S.title,onClick:I=>S.handler(I,S.id)})),k&&m.default.createElement("i",{className:"vjs-zoom-to-fit","data-reset":"true",title:"Zoom To Fit",onClick:()=>Re()},m.default.createElement("svg",{viewBox:p.ZOOM_TO_FIT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.ZOOM_TO_FIT_PATH}))),Z&&m.default.createElement(m.default.Fragment,null,m.default.createElement("i",{className:"vjs-zoom-in","data-zoom-in":"true",title:"Zoom In",onClick:()=>Me()},m.default.createElement("svg",{viewBox:p.ZOOM_IN_OUT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.ZOOM_IN_PATH}))),m.default.createElement("i",{className:"vjs-zoom-out","data-zoom-out":"true",title:"Zoom Out",onClick:()=>Ie()},m.default.createElement("svg",{viewBox:p.ZOOM_IN_OUT_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.ZOOM_OUT_PATH})))),M&&m.default.createElement("i",{className:"vjs-undo","data-undo":"true",title:"Undo last action",onClick:()=>f()}),M&&m.default.createElement("i",{className:"vjs-redo","data-redo":"true",title:"Redo last action",onClick:()=>y()}),m.default.createElement("i",{className:p.CLASS_CONTROLS_RESET_SELECTION,title:r,onClick:()=>R()},m.default.createElement("svg",{viewBox:p.RESET_SELECTION_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.RESET_SELECTION_PATH}))),ne&&m.default.createElement("i",{className:"vjs-clear-dataset",title:G,onClick:()=>A()},m.default.createElement("svg",{viewBox:p.CLEAR_VIEW_BOX,stroke:"currentColor",fill:"currentColor"},m.default.createElement("path",{d:p.CLEAR_PATH}))),Oe.map(S=>m.default.createElement("i",{className:S.class,title:S.title,onClick:I=>S.handler(I,S.id)})))}var w=N(require("react")),ae=require("@visuallyjs/browser-ui");function er(e){let r=(0,w.useRef)(!1),t=(0,w.useRef)(null),n=J(),o=Se(),[l,i]=(0,w.useState)(!0),[a,c]=(0,w.useState)("Export :"),[E,x]=(0,w.useState)(null),[U,d]=(0,w.useState)(null),[G,T]=(0,w.useState)(null),[P,k]=(0,w.useState)(!0),[H,Z]=(0,w.useState)(!0),[ce,M]=(0,w.useState)(!0);function O(de){t.current=de,e.label&&c(a),e.showLabel!=null&&i(e.showLabel),e.margins&&x(e.margins);let Oe=e.svgOptions\|\|{};d(Oe);let pe=e.imageOptions\|\|{};T(pe),e.allowJpgExport!=null&&M(e.allowJpgExport),e.allowPngExport!=null&&Z(e.allowPngExport),e.allowSvgExport!=null&&k(e.allowSvgExport)}function ne(){new ae.SvgExportUI(t.current).export(U)}function ue(){new ae.ImageExportUI(t.current).export(G)}function Pe(){new ae.ImageExportUI(t.current).export(Object.assign(G\|\|{},{type:"image/jpeg"}))}return(0,w.useEffect)(()=>{r.current===!1&&(n!=null?(r.current=!0,O(n)):o!=null&&o.$ui instanceof ae.Surface&&(r.current=!0,O(o.$ui)))},[n,o]),w.default.createElement("div",{className:`${ae.CLASS_CONTROLS} ${ae.CLASS_EXPORT_CONTROLS}`},l&&w.default.createElement("span",null,a),P&&w.default.createElement("i",null,w.default.createElement("a",{href:"#",id:"exportSvg",onClick:()=>ne()},"SVG")),H&&w.default.createElement("i",null,w.default.createElement("a",{href:"#",id:"exportPng",onClick:()=>ue()},"PNG")),ce&&w.default.createElement("i",null,w.default.createElement("a",{href:"#",id:"exportJpg",onClick:()=>Pe()},"JPG")))}var Q=N(require("react")),Le=require("@visuallyjs/browser-ui"),tr=(0,Q.forwardRef)((e,r)=>{let t=(0,Q.useRef)(!1),n=(0,Q.useRef)(null),o=(0,Q.useContext)(V),l=(0,Q.useRef)(null),i=e.className\|\|"";function a(c){c.getShapeLibrary()!=null?l.current=new Le.ShapePalette(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}):(0,Le.log)("WARN: no shapeLibrary provided in props and UI has no shape library. Cannot instantiate ShapePaletteComponent")}return(0,Q.useEffect)(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(c=>a(c)):e.surface!=null?a(e.surface):(0,Le.log)("ShapePaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),Q.default.createElement("div",{ref:n,className:i})});var _e=N(require("react")),Ne=require("@visuallyjs/browser-ui"),Tt=120,_t=90;function rr(e){let r=(0,_e.useRef)(null);function t(){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\|\|Tt}function i(){return e.ctx.obj.data.height\|\|_t}function a(){return e.ctx.obj.data.color\|\|e.ctx.obj.data.outline\|\|"#000000"}function c(){return e.labelProperty\|\|"label"}return(0,_e.useEffect)(()=>{let E=e.ctx.obj.data,x=e.ctx.ui.getShapeLibrary(),U=x.renderCompiledShape(E);if(r.current.replaceChildren(U),e.showLabels){let d=x.renderShapeLabel(E,c(),e.labelStrokeWidth,null,a(),a(),e.font);r.current.appendChild(d),e.multilineLabels!=!1&&(0,Ne.convertToMultilineText)(d,E[c()]\|\|"",l()*(e.labelFillRatio\|\|Ne.DEFAULT_LABEL_FILL_RATIO))}}),_e.default.createElement("svg",{className:Ne.CLASS_SHAPE,ref:r,strokeWidth:t(),fill:n(),stroke:o(),preserveAspectRatio:"none",viewBox:"0 0 "+l()+" "+i()})}var ee=N(require("react")),Ae=require("@visuallyjs/browser-ui"),nr=(0,ee.forwardRef)((e,r)=>{let t=(0,ee.useRef)(!1),n=(0,ee.useRef)(null),o=(0,ee.useContext)(V),l=(0,ee.useRef)(null),i=e.className\|\|"";function a(c){let E={selector:e.selector,source:n.current,dataGenerator:x=>e.dataGenerator?e.dataGenerator(x):(0,Ae.defaultDataGenerator)(x),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 Ae.Palette(c,E)}return(0,ee.useEffect)(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(c=>a(c)):e.surface!=null?a(e.surface):(0,Ae.log)("PaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),ee.default.createElement("div",{className:i,ref:n},e.children)});var te=N(require("react")),j=require("@visuallyjs/browser-ui");function or(e){let r=e.maxColors\|\|10,t=(0,te.useRef)(null),n=(0,te.useRef)(!1),o=ke(),[l,i]=(0,te.useState)(o.ensureContext(j.INSPECTOR_CONTEXT_RECENT_COLORS,()=>[]));function a(d){let G=o.ensureContext(j.INSPECTOR_CONTEXT_RECENT_COLORS,()=>[]);if(d=d.toUpperCase(),!(G.find(P=>P.toUpperCase()===d)!=null)){let P=G.slice();P.unshift(d),P.length>r&&(P.length=r),o.updateContext(j.INSPECTOR_CONTEXT_RECENT_COLORS,P)}}function c(){let d=t.current.value;o.setValue(e.propertyName,d,null),a(d)}function E(d){o.setValue(e.propertyName,d,null),t.current.value=d}let x=d=>{d.key===j.INSPECTOR_CONTEXT_RECENT_COLORS&&i(d.value.slice())};function U(){let d=o.getValue(e.propertyName);d!=null&&t.current&&a(d)}return(0,te.useEffect)(()=>(o.bind(j.EVENT_CONTEXT_UPDATE,x),o.bind(j.EVENT_CHANGE,U),n.current\|\|(n.current=!0,t.current.addEventListener(j.EVENT_CHANGE,c)),setTimeout(U),()=>{o.unbind(j.EVENT_CONTEXT_UPDATE,x),o.unbind(j.EVENT_CHANGE,U)})),te.default.createElement("div",{className:j.CLASS_COLOR_PICKER},te.default.createElement("input",{type:"color",ref:t,"vjs-att":e.propertyName}),te.default.createElement("div",{className:j.CLASS_COLOR_PICKER_SWATCHES},l.map(d=>te.default.createElement("div",{key:d,title:d,className:j.CLASS_COLOR_PICKER_SWATCH,style:{backgroundColor:d},"data-color":d,onClick:()=>E(d)}))))}var re=N(require("react")),et=require("@visuallyjs/browser-ui"),ar=(0,re.forwardRef)((e,r)=>{let t=(0,re.useRef)(!1),n=(0,re.useRef)(null),o=(0,re.useContext)($),l=(0,re.useRef)(null),i=e.className\|\|"";function a(E){l.current=new et.DiagramPalette(n.current,E,{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,re.useEffect)(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(E=>a(E)):e.diagram!=null?a(e.diagram):(0,et.log)("DiagramPaletteComponent cannot start: no DiagramContext from a provider found, and no Diagram provided in props"))});let c=e.style\|\|{};return re.default.createElement("div",{ref:n,className:i,style:c})});var z=N(require("react")),B=require("@visuallyjs/browser-ui");function ie(e){let r=(0,z.useRef)(null),t=(0,z.useRef)(!1),n=(0,z.useRef)(!1),o=(0,z.useRef)(null),l=e.style\|\|{},i=(0,z.useContext)(V),a=(0,z.useContext)($);return(0,z.useEffect)(()=>{if(!t.current)if(t.current=!0,i!=null)i.listen(c=>{let E=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.current,E),n.current=!0});else if(a!=null)a.listen(c=>{let E=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.current,E),n.current=!0});else{let c=Object.assign({dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.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&&((0,z.useEffect)(()=>{n.current&&e.data!=null&&o.current&&o.current.load({data:e.data})},[e.data]),(0,z.useEffect)(()=>{n.current&&e.url!=null&&o.current&&o.current.load({url:e.url})},[e.url]),(0,z.useEffect)(()=>{n.current&&e.pivot!=null&&o.current&&o.current.pivot&&o.current.pivot(e.pivot)},[e.pivot]),(0,z.useEffect)(()=>{n.current&&e.dataSourceFilter!=null&&o.current&&o.current.setDataSourceFilter&&o.current.setDataSourceFilter(e.dataSourceFilter)},[e.dataSourceFilter])),z.default.createElement("div",{ref:r,style:l,className:`${e.className\|\|""}`})}function lr(e){let r=Object.assign({createChart:(t,n)=>new B.ColumnChart(t,n)},e);return ie(r)}function ir(e){let r=Object.assign({createChart:(t,n)=>new B.BarChart(t,n)},e);return ie(r)}function sr(e){let r=Object.assign({createChart:(t,n)=>new B.CategoryValueChart(t,n)},e);return ie(r)}function cr(e){let r=Object.assign({createChart:(t,n)=>new B.LineChart(t,n)},e);return ie(r)}function ur(e){let r=Object.assign({createChart:(t,n)=>new B.AreaChart(t,n)},e);return ie(r)}function dr(e){let r=Object.assign({createChart:(t,n)=>new B.PieChart(t,n)},e);return ie(r)}function pr(e){let r=Object.assign({createChart:(t,n)=>new B.ScatterChart(t,n)},e);return ie(r)}function mr(e){let r=Object.assign({createChart:(t,n)=>new B.BubbleChart(t,n)},e);return ie(r)}function fr(e){let r=Object.assign({createChart:(t,n)=>new B.GaugeChart(t,n)},e);return ie(r)}function Er(e){let r=Object.assign({createChart:(t,n)=>new B.SankeyChart(t,n)},e);return e.interactive!=null&&(r.options.interactive=e.interactive),e.pivot!=null&&(r.options.pivot=e.pivot),e.csvData&&(r.options.csvData=e.csvData),e.jsonData&&(r.options.jsonData=e.jsonData),ie(r)}var Nt=require("@visuallyjs/browser-ui"),fe=N(require("react"));function mt(e){let r=(0,fe.useRef)(!1),t=(0,fe.useRef)(null),n=(0,fe.useContext)(V),o=e.position\|\|{x:0,y:0};function l(i){e.placement==="fixed"?i.fixElement(t.current,o,e.constraints):i.floatElement(t.current,o)}return(0,fe.useEffect)(()=>{r.current\|\|(r.current=!0,n!=null?n.listen(i=>l(i)):(0,Nt.log)("Decorator cannot mount: no SurfaceContext from a provider found"))}),fe.default.createElement("div",{ref:t},e.children)}var se=require("@visuallyjs/browser-ui"),be=N(require("react"));function tt(e){let r=(0,be.useRef)(!1),t=J();return(0,be.useEffect)(()=>{if(t!=null&&!r.current){r.current=!0;try{t.addPlugin({type:se.BackgroundPlugin.type,options:e})}catch(n){(0,se.log)(`WARN: BackgroundComponent could not mount background ${n}`)}}},[t]),be.default.createElement(be.default.Fragment,null)}function Cr(e){return tt(rt({type:se.GeneratedGridBackground.type},e))}function gr(e){return tt({type:se.SimpleBackground.type,url:e.url})}function xr(e){return tt(rt({type:se.TiledBackground.type},e))}var At=require("react"),we=require("@visuallyjs/browser-ui");function Pr(e){let r=ct();(0,At.useEffect)(()=>{if(r!=null){let t=()=>e(r);return r.bind(we.EVENT_DATA_UPDATED,t),r.bind(we.EVENT_GRAPH_CLEARED,t),t(),()=>{r.unbind(we.EVENT_DATA_UPDATED,t),r.unbind(we.EVENT_GRAPH_CLEARED,t)}}},[r])}var Ve=require("react"),ft=require("@visuallyjs/browser-ui");function Or(e){let r=J(),t=it(),[n,o]=(0,Ve.useState)(e),[l,i]=(0,Ve.useState)(()=>(n==null?void 0:n.getZoom())\|\|1);return(0,Ve.useEffect)(()=>{if(n!=null){let a=c=>{i(c.zoom)};return n.bind(ft.EVENT_ZOOM,a),i(n.getZoom()),()=>{n.unbind(ft.EVENT_ZOOM,a)}}},[n]),(0,Ve.useEffect)(()=>{r!=null&&o(r),t!=null&&o(t)},[r,t]),l}

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

	@@ -1 +1 @@
1	- var zt=Object.defineProperty;var He=Object.getOwnPropertySymbols;var Ht=Object.prototype.hasOwnProperty,Wt=Object.prototype.propertyIsEnumerable;var We=(e,r,t)=>r in e?zt(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,be=(e,r)=>{for(var t in r\|\|(r={}))Ht.call(r,t)&&We(e,t,r[t]);if(He)for(var t of He(r))Wt.call(r,t)&&We(e,t,r[t]);return e};import{log as Je}from"@visuallyjs/browser-ui";var $e=new Map,ce={};function Ye(e,r){$e.set(e,r),Jt(e,r)}function Jt(e,r){(ce[e]\|\|[]).forEach(n=>{try{n(r)}catch(o){Je("WARN: an error was reported invoking a SurfaceComponentRefCallback "+o)}}),delete ce[e]}function aa(e,r){let t=$e.get(e);if(t)try{r(t)}catch(n){Je("WARN: an error was reported invoking a SurfaceComponentRefCallback "+n)}else ce[e]=ce[e]\|\|[],ce[e].push(r)}var De="vjs-react-node",ve="vjs-react-group",me="vjs-react-overlay";import Ze,{useEffect as $t,useRef as Yt}from"react";function Te(e){let r=Yt(!1);return $t(()=>{r.current\|\|(r.current=!0,e.cb(e.ns))}),Ze.createElement(Ze.Fragment,null,e.ns.def.jsx({obj:e.ns.obj,vertex:e.ns.obj,model:e.model,ui:e.ui,data:e.ns.obj.data,props:e.childProps\|\|{}}))}import{BrowserUIModel as Zt,log as Xt}from"@visuallyjs/browser-ui";var q=class extends Zt{render(r,t){return Xt("render called directly on BrowserUIReactModel class: should not happen. UI components should use internal render."),null}};function Xe(e){return e=e\|\|{},new q(e)}import{createContext as qt,default as Kt,useRef as Qt,useContext as er,useState as tr,useEffect as rr}from"react";var D=qt(null);function El(e){let r=Qt(null),t=ue(r);return Kt.createElement(D.Provider,{value:t},e.children\|\|[])}function ue(e){return K(e)}function K(e){let r=[];return{set:t=>{e.current=t,r.forEach(n=>n(t))},listen:t=>{e.current==null?r.push(t):t(e.current)},ref:()=>e}}function M(){let e=er(D),[r,t]=tr(null);return rr(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}import{createContext as nr,useContext as or}from"react";var fe=nr(null);function qe(e){return K(e)}function Ee(){let e=or(fe);return e==null?null:e.ref().current}import ar,{useRef as _e,useEffect as lr}from"react";import{INSPECTOR_CONTEXT_EDGE_PROPERTY_MAPPINGS as ir,EdgeTypePicker as sr}from"@visuallyjs/browser-ui";function wl(e){let r=_e(!1),t=_e(null),n=_e(null),o=Ee(),{propertyName:l}=e,i=()=>o.getFromContext(ir)\|\|o.$ui.$getEdgePropertyMappings();return lr(()=>{r.current\|\|(r.current=!0,n.current=new sr(o.$ui,t.current,i(),o.getValue(l),(a,c)=>{o.setValue(l,c,null)}),n.current.render(l,o.Qe),o.onChange(()=>{n.current.select(l,o.getValue(l))}))}),ar.createElement("div",{ref:t})}import{createContext as cr,default as ur,useRef as dr,useContext as pr,useState as mr,useEffect as fr}from"react";var H=cr(null);function Hl(e){let r=dr(null),t=Ne(r);return ur.createElement(H.Provider,{value:t},e.children\|\|[])}function Ne(e){return K(e)}function Ke(){let e=pr(H),[r,t]=mr(null);return fr(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}import Ce,{createContext as Er,forwardRef as Cr,useContext as Ae,useEffect as Qe,useImperativeHandle as gr,useRef as de,useState as xr}from"react";import{createDiagram as Pr}from"@visuallyjs/browser-ui";var I=Er(null);function et(e){return K(e)}function ii(e){let r=de(null),t=et(r);return Ce.createElement(I.Provider,{value:t},e.children\|\|[])}function ee(){let e=Ae(I),[r,t]=xr(null);return Qe(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}var si=Cr((e,r)=>{let t=de(null),n=de(!1),o,l,i=Ae(I);i==null?(o=de(null),i=et(o)):o=i.ref();let a=Ae(D);a==null?(l=de(null),a=ue(l)):l=a.ref();let c={getDiagram:()=>o.current};gr(r,()=>c),Qe(()=>{n.current\|\|(n.current=!0,o.current=Pr(t.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}),i.set(o.current),a.set(l.current))});let m=`${e.className\|\|""} vjs-react-diagram`,f=e.style\|\|{};return Ce.createElement("div",{ref:t,className:m,style:f},Ce.createElement(D.Provider,{value:a},Ce.createElement(I.Provider,{value:i},e.children)))});import Or,{createContext as Rr,useContext as ge,useEffect as we,useMemo as yr,useState as Sr}from"react";var te=Rr(void 0);function bi(e){let r=yr(()=>Xe(e.modelOptions\|\|{}),[]);function t(o,l){r.clear(),r.load({data:o,dataType:l})}function n(o,l){r.clear(),r.load({url:o,dataType:l})}return e.data!=null&&t(e.data,e.dataType),e.url!=null&&t(e.url,e.dataType),we(()=>{e.data!=null&&t(e.data,e.dataType)},[e.data]),we(()=>{e.url!=null&&n(e.url,e.dataType)},[e.url]),Or.createElement(te.Provider,{value:r},e.children\|\|[])}function tt(){let e=ge(te),r=ge(D),t=ge(H),n=ge(I),[o,l]=Sr(e);return we(()=>{if(e){l(e);return}let i;r!=null&&(r.ref().current?l(r.ref().current.model):(i=m=>{l(m.model)},r.listen(i)));let a;t!=null&&(t.ref().current?o==null&&l(t.ref().current.model):(a=m=>{o==null&&l(m.model)},t.listen(a)));let c;n!=null&&(n.ref().current?o==null&&l(n.ref().current.model):(c=m=>{o==null&&l(m.model)},n.listen(c)))}),o}import rt from"react";import{addClass as nt,isGroup as ot,ATTRIBUTE_NOT_DRAGGABLE as at,TRUE as lt}from"@visuallyjs/browser-ui";function hr(e,r){if(e.hydrated!==!0){let t=ot(e.obj)?ve:De;e.domElement.firstElementChild&&nt(e.domElement.firstElementChild,t),e.hydrated=!0}else r.current.$revalidateElement(e.domElement)}function xe(e,r,t,n){return rt.createElement(Te,{ns:e,model:r,ui:t.current,childProps:n,cb:o=>{hr(o,t)}})}function Pe(e,r,t,n){return rt.createElement(Te,{ns:e,model:r,ui:t.current,childProps:n,cb:o=>{br(o,t)}})}function br(e,r){if(e.hydrated!==!0){let t=ot(e.obj)?ve:De;e.domElement.firstElementChild&&(nt(e.domElement.firstElementChild,t),e.domElement.firstElementChild.getAttribute(at)===lt&&e.domElement.setAttribute(at,lt)),r.current.$vertexRendered(e.obj,e.domElement,e.def,e.payload.eventInfo),e.hydrated=!0}else r.current.$revalidateElement(e.domElement)}import re,{forwardRef as Dr,useContext as it,useEffect as st,useImperativeHandle as vr,useRef as ne,useState as ct}from"react";importas Ve from"react-dom";import{ELEMENT_DIV as ut,ELEMENT_SVG as Tr,ElementTypes as _r,EVENT_GRAPH_CLEARED as Nr,EVENT_GROUP_REMOVED as Ar,EVENT_GROUP_UPDATED as wr,EVENT_NODE_REMOVED as Vr,EVENT_NODE_UPDATED as Mr,extend as dt,isGroup as Ir,renderSurface as Br,CLASS_DEFAULT_NODE as Ur,CLASS_DEFAULT_GROUP as jr,OVERLAY_TYPE_CUSTOM as Gr,EVENT_EDGE_REMOVED as kr,EVENT_EDGE_UPDATED as Lr,uuid as Fr,partition as zr,$svgNode as Hr}from"@visuallyjs/browser-ui";var ys=Dr((e,r)=>{let t=ne(!1),n=ne(!1),o=it(te),l=ne(null),i=ne(null),a=ne(o),c,m=it(D);m==null?(c=ne(null),m=ue(c)):c=m.ref();let[f,v]=ct([]),[d,T]=ct([]),R=[],E=[];function _(){v(R.slice())}function A(){T(E.slice())}let V={getSurface:()=>c.current,getModel:()=>a.current};vr(r,()=>V),st(()=>{var g;if(!n.current){n.current=!0,e.model!=null?a.current=e.model:o==null?a.current=new q(e.modelOptions\|\|{}):a.current=o,typeof document!="undefined"&&(i.current=document.createElement("div"),i.current.style.position="fixed",i.current.style.left="10000px",i.current.style.top="10000px",i.current.style.width="100px",i.current.style.height="100px",i.current.style.opacity="0",l.current.appendChild(i.current));let B=(s,u,x,S,p,P,y,z)=>{let[O,b]=P.component\|\|P.jsx?[P,null]:Ir(y)?[Object.assign(Object.assign({},P),{jsx:N=>re.createElement(re.Fragment,null,N.obj.data.label)}),jr]:[Object.assign(Object.assign({},P),{jsx:N=>re.createElement(re.Fragment,null,N.obj.data.label)}),Ur],w=p.containerType===_r.HTML?document.createElement(ut):Hr(Tr);i.current.appendChild(w),b!=null&&p.$addClassToElement(w,b);let Q={data:u,model:x,ui:p,componentId:y.getFullId(),obj:y,props:e.childProps,element:w,eventInfo:z};R.push({data:u,def:O,payload:Q,domElement:w,key:y.id,obj:y,hydrated:!1}),_()},k=(s,u)=>{u.parentNode&&u.parentNode.removeChild(u)},Y={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(s,u,x,S)=>{},render:B,rerender:(s,u,x,S,p,P,y,z,O)=>{let b=zr(R,w=>w.obj!==y);R=b.left,_(),B(s,u,x,S,p,P,y,z),b.right.length>0&&setTimeout(()=>{k(null,b.right[0].domElement)})},cleanupVertex:k,cleanupPort:(s,u)=>{}},L=((g=e.viewOptions)==null?void 0:g.edges)\|\|{};for(let s in L){let u=L[s];u.overlays!=null&&(u.overlays=u.overlays.map(x=>x.jsx!=null?{type:Gr,options:{create:p=>{let P=document.createElement(ut);P.className=me;let y={data:p.edge.data,model:a.current,ui:F,componentId:p.edge.getFullId(),obj:p.edge,props:e.childProps,element:P};return E.push({def:{jsx:x.jsx},data:p.edge.data,obj:p.edge,payload:y,domElement:P,key:Fr(),hydrated:!1}),A(),P}}}:x))}let Z=Object.assign(e.renderOptions\|\|{},{view:e.viewOptions,selection:e.selection}),F=Br(a.current,l.current,Y,Z);m.set(F),e.surfaceId!=null&&Ye(e.surfaceId,V);let W=(s,u)=>{let x=()=>{let p={};return(u.originalData\|\|u.updates)&&(p=dt(u.originalData,u.updates)),p},S=R.find(p=>p.key===s);S!=null&&(S.data=x(),_())},X=s=>{R=R.filter(u=>u.payload.componentId!==s),_()},ie=(s,u)=>{let x=()=>{let p={};return(u.originalData\|\|u.updates)&&(p=dt(u.originalData,u.updates)),p},S=E.find(p=>p.obj.id===s);S!=null&&(S.data=x(),A())},se=s=>{E=E.filter(u=>u.payload.obj.id!==s),A()};a.current.bind(Mr,s=>{W(s.vertex.getFullId(),s)}),a.current.bind(wr,s=>{W(s.vertex.getFullId(),s)}),a.current.bind(Vr,s=>{X(s.node.id)}),a.current.bind(Ar,s=>{X(s.group.id)}),a.current.bind(kr,s=>{se(s.edge.id)}),a.current.bind(Lr,s=>{ie(s.edge.id,s)}),a.current.bind(Nr,()=>{R=[],_(),E=[],A()})}}),st(()=>{n.current&&a.current!=null&&c.current!=null&&t.current===!1&&(e.data!=null\|\|e.url!=null)&&(t.current=!0,a.current.clear(),a.current.load({data:e.data,url:e.url,onload:()=>{t.current=!1,setTimeout(()=>c.current.repaintEverything(),250)}}))},[e.data,e.url]);let G=`${e.className\|\|""} vjs-react-surface`,h=e.style\|\|{};return re.createElement("div",{ref:l,className:G,style:h},f.map(g=>Ve.createPortal(Pe(g,a.current,c,e.childProps),g.domElement,g.key)),d.map(g=>Ve.createPortal(xe(g,a.current,c,e.childProps),g.domElement,g.key)),re.createElement(D.Provider,{value:m},e.children))});import Wr,{useEffect as Jr,useMemo as $r,useRef as Me,useState as pt}from"react";import{PopupHandler as Yr,CLASS_SURFACE_POPUP as Zr}from"@visuallyjs/browser-ui";function Xr(e){let r=M(),t=Me(null),n=Me(!1),o=Me(null),[l,i]=pt(null),[a,c]=pt(0),m=$r(()=>l==null?"none":"block",[l]);function f(d){i(d),c(T=>T+1)}Jr(()=>{!n.current&&r&&(n.current=!0,o.current=new Yr(e.selector,t.current,r,d=>f(d),e.anchor))});function v(){o.current&&o.current.$hide()}return Wr.createElement("div",{ref:t,className:Zr,style:{display:m,position:"absolute"}},l!=null&&e.children(l,r.model,r,()=>v()))}import oe,{forwardRef as qr,useContext as mt,useEffect as ft,useImperativeHandle as Kr,useRef as ae,useState as Et}from"react";importas Ie from"react-dom";import{ELEMENT_DIV as Ct,ELEMENT_SVG as Qr,ElementTypes as en,EVENT_GRAPH_CLEARED as tn,EVENT_GROUP_REMOVED as rn,EVENT_GROUP_UPDATED as nn,EVENT_NODE_REMOVED as on,EVENT_NODE_UPDATED as an,extend as gt,isGroup as ln,renderPaper as sn,CLASS_DEFAULT_NODE as cn,CLASS_DEFAULT_GROUP as un,OVERLAY_TYPE_CUSTOM as dn,EVENT_EDGE_REMOVED as pn,EVENT_EDGE_UPDATED as mn,uuid as fn,partition as En,$svgNode as Cn}from"@visuallyjs/browser-ui";var mc=qr((e,r)=>{let t=ae(!1),n=ae(!1),o=mt(te),l=ae(null),i=ae(null),a=ae(null),c,m=mt(H);m==null?(c=ae(null),m=Ne(c)):c=m.ref();let[f,v]=Et([]),[d,T]=Et([]),R=[],E=[];function _(){v(R.slice())}function A(){T(E.slice())}let V={getPaper:()=>c.current,getModel:()=>a.current};Kr(r,()=>V),ft(()=>{var g;if(!n.current){n.current=!0,e.model!=null?a.current=e.model:o==null?a.current=new q(e.modelOptions\|\|{}):a.current=o,typeof document!="undefined"&&(i.current=document.createElement("div"),i.current.style.position="fixed",i.current.style.left="10000px",i.current.style.top="10000px",i.current.style.width="100px",i.current.style.height="100px",i.current.style.opacity="0",l.current.appendChild(i.current));let B=(s,u,x,S,p,P,y,z)=>{let[O,b]=P.component\|\|P.jsx?[P,null]:ln(y)?[Object.assign(Object.assign({},P),{jsx:N=>oe.createElement(oe.Fragment,null,N.obj.data.label)}),un]:[Object.assign(Object.assign({},P),{jsx:N=>oe.createElement(oe.Fragment,null,N.obj.data.label)}),cn],w=p.containerType===en.HTML?document.createElement(Ct):Cn(Qr);i.current.appendChild(w),b!=null&&p.$addClassToElement(w,b);let Q={data:u,model:x,ui:p,componentId:y.getFullId(),obj:y,props:e.childProps,element:w,eventInfo:z};R.push({data:u,def:O,payload:Q,domElement:w,key:y.id,obj:y,hydrated:!1}),_()},k=(s,u)=>{u.parentNode&&u.parentNode.removeChild(u)},Y={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(s,u,x,S)=>{},render:B,rerender:(s,u,x,S,p,P,y,z,O)=>{let b=En(R,w=>w.obj!==y);R=b.left,_(),B(s,u,x,S,p,P,y,z),b.right.length>0&&setTimeout(()=>{k(null,b.right[0].domElement)})},cleanupVertex:k,cleanupPort:(s,u)=>{}},L=((g=e.viewOptions)==null?void 0:g.edges)\|\|{};for(let s in L){let u=L[s];u.overlays!=null&&(u.overlays=u.overlays.map(x=>x.jsx!=null?{type:dn,options:{create:p=>{let P=document.createElement(Ct);P.className=me;let y={data:p.edge.data,model:a.current,ui:F,componentId:p.edge.getFullId(),obj:p.edge,props:e.childProps,element:P};return E.push({def:{jsx:x.jsx},data:p.edge.data,obj:p.edge,payload:y,domElement:P,key:fn(),hydrated:!1}),A(),P}}}:x))}let Z=Object.assign(e.renderOptions\|\|{},{view:e.viewOptions}),F=sn(a.current,l.current,Y,Z);m.set(F);let W=(s,u)=>{let x=()=>{let p={};return(u.originalData\|\|u.updates)&&(p=gt(u.originalData,u.updates)),p},S=R.find(p=>p.key===s);S!=null&&(S.data=x(),_())},X=s=>{R=R.filter(u=>u.payload.componentId!==s),_()},ie=(s,u)=>{let x=()=>{let p={};return(u.originalData\|\|u.updates)&&(p=gt(u.originalData,u.updates)),p},S=E.find(p=>p.obj.id===s);S!=null&&(S.data=x(),A())},se=s=>{E=E.filter(u=>u.payload.obj.id!==s),A()};a.current.bind(an,s=>{W(s.vertex.getFullId(),s)}),a.current.bind(nn,s=>{W(s.vertex.getFullId(),s)}),a.current.bind(on,s=>{X(s.node.id)}),a.current.bind(rn,s=>{X(s.group.id)}),a.current.bind(pn,s=>{se(s.edge.id)}),a.current.bind(mn,s=>{ie(s.edge.id,s)}),a.current.bind(tn,()=>{R=[],_(),E=[],A()})}}),ft(()=>{n.current&&a.current!=null&&c.current!=null&&t.current===!1&&(e.data!=null\|\|e.url!=null)&&(t.current=!0,a.current.clear(),a.current.load({data:e.data,url:e.url,onload:()=>{t.current=!1,setTimeout(()=>c.current.repaintEverything(),250)}}))},[e.data,e.url]);let G=`${e.className\|\|""} vjs-react-paper`,h=e.style\|\|{};return oe.createElement("div",{ref:l,className:G,style:h},f.map(g=>Ie.createPortal(Pe(g,a.current,c,e.childProps),g.domElement,g.key)),d.map(g=>Ie.createPortal(xe(g,a.current,c,e.childProps),g.domElement,g.key)),oe.createElement(H.Provider,{value:m},e.children))});import{MiniviewPlugin as gn,Surface as xn}from"@visuallyjs/browser-ui";import Pn,{forwardRef as On,useEffect as Rn,useImperativeHandle as yn,useRef as xt}from"react";var yc=On((e,r)=>{let t=M(),n=ee(),o=xt(!1),l=xt(null),i;yn(r,()=>({toggleCollapsed:()=>i==null?void 0:i.toggleCollapsed()}));function a(c){c.addPlugin({type:gn.type,options:{container:l.current,elementFilter:e.elementFilter,typeFunction:e.typeFunction,activeTracking:e.activeTracking,clickToCenter:e.clickToCenter,showLasso:e.showLasso,trackSelection:e.trackSelection}})}return Rn(()=>{o.current\|\|(t!=null?(o.current=!0,a(t)):n!=null&&n.$ui instanceof xn&&(o.current=!0,a(n.$ui)))},[t,n]),Pn.createElement("div",{ref:l,className:`${e.className\|\|""}`})});import{Inspector as Sn,log as hn,Surface as bn}from"@visuallyjs/browser-ui";import le,{forwardRef as Dn,useContext as Oe,useEffect as Pt,useImperativeHandle as vn,useRef as Be,useState as Ue}from"react";var Uc=Dn((e,r)=>{let t=Oe(D),n=Oe(I),o=Oe(H),l,i=Oe(fe);i==null&&(l=Be(null),i=qe(l));let[a,c]=Ue(null),[m,f]=Ue(0),[v,d]=Ue(null),T=Be(!1),R=Be(null),E=e.className\|\|"";Pt(()=>{var h;(h=l==null?void 0:l.current)==null\|\|h.$refresh()},[m]);let _=e.onSelectionCleared\|\|(()=>c(null)),A=(h,g)=>{c(h),e.refresh&&e.refresh(h),f(B=>B+1)};function V(h){l.current=new Sn({container:R.current,ui:h,renderEmptyContainer:_,refresh:A,autoCommit:e.autoCommit,multipleSelections:e.multipleSelections,filter:e.filter,showCloseButton:e.showCloseButton,afterUpdate:()=>e.afterUpdate?e.afterUpdate(h):null}),d(l.current)}let G={getInspector:()=>v};return vn(r,()=>G),Pt(()=>{T.current\|\|(T.current=!0,t!=null?t.listen(V):o!=null?o.listen(V):n!=null?n.listen(h=>{h.$ui instanceof bn&&V(h.$ui)}):hn("WARN: InspectorComponent cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))}),le.createElement("div",{ref:R,className:E},le.createElement(fe.Provider,{value:i},a!=null&&le.createElement(le.Fragment,null,typeof e.children=="function"?e.children(a,l.current.$ui.model):e.children\|\|[]),a==null&&le.createElement(le.Fragment,null,e.renderEmptyContent&&e.renderEmptyContent())))});var Gc="group:added",kc="group:member:added",Lc="group:member:removed",Fc="group:removed",zc="dataLoadStart",Hc="dataAppendStart",Wc="dataLoadEnd",Jc="dataAppendEnd",$c="dataUpdated",Yc="graphClearStart",Zc="graphCleared",Xc="graphChanged",qc="group:updated",Kc="node:updated",Qc="port:updated",eu="edge:updated",tu="edge:added",ru="node:added",nu="edge:removed",ou="node:removed",au="port:added",lu="port:removed",iu="edge:target",su="edge:source",Ot="select",Rt="deselect",yt="selection:cleared",cu="edge:geometry",uu="edge:pathEdited",du="edge:dragStart",pu="edge:drag",mu="edge:dragEnd",fu="edge:dragAbort",Eu="edge:typeChanged",Cu="node:typeChanged",gu="port:typeChanged",xu="group:typeChanged",Pu="group:move:start",Ou="group:move",Ru="group:move:end",yu="internal:group:sizeChanged",Su="internal:group:sizeChangedRedo",hu="internal:group:sizeChangedUndo",bu="internal:edge:redraw",Du="renderer:added",vu="node:move:start",Tu="node:move",_u="node:move:end",Nu="node:move:abort",Au="undoredo:update",wu="undo",Vu="redo",Mu="destroy";import C,{useEffect as Tn,useRef as Re,useState as U}from"react";import{EVENT_UNDOREDO_UPDATE as _n,FALSE as St,LASSO_PATH as Nn,LASSO_VIEW_BOX as An,LassoPlugin as wn,PAN_PATH as Vn,PAN_VIEW_BOX as Mn,Surface as In,SURFACE_MODE_PAN as ht,SURFACE_MODE_SELECT as bt,TRUE as Dt,ZOOM_TO_FIT_PATH as Bn,ZOOM_TO_FIT_VIEW_BOX as Un,EVENT_SURFACE_MODE_CHANGED as jn,ZOOM_IN_OUT_VIEW_BOX as vt,ZOOM_IN_PATH as Gn,ZOOM_OUT_PATH as kn,RESET_SELECTION_PATH as Ln,RESET_SELECTION_VIEW_BOX as Fn,CLEAR_PATH as zn,CLEAR_VIEW_BOX as Hn,CLASS_CONTROLS_RESET_SELECTION as Wn,supportsPathEditing as Jn}from"@visuallyjs/browser-ui";var $n="can-undo",Yn="can-redo",je="vjs-selected-mode",Tt="vjs-controls-has-selection";function Yu(e){let r="Clear selection",t=M(),n=ee(),[o,l]=U("row"),[i,a]=U(!1),[c,m]=U(!1),f=Re(null),v=Re(!1),d=Re(null),[T,R]=U("Clear dataset?"),E=Re(null),[_,A]=U(!0),[V,G]=U(!1),[h,g]=U(!0),[B,k]=U(!0),[Y,L]=U([]),[Z,F]=U([]);function W(O){d.current=O,e.clearMessage&&R(e.clearMessage),e.onMaybeClear&&(E.current=e.onMaybeClear),e.orientation&&l(e.orientation),e.undoRedo===!1&&g(!1),e.zoomToExtents===!1&&A(!1),e.zoomButtons===!0&&G(!0),e.clear===!1&&k(!1);let b=(e.buttons\|\|[]).filter(N=>N.mode!=null);L(b);let w=(e.buttons\|\|[]).filter(N=>N.mode==null);F(w),O.bind(jn,N=>{O.removeClass(O.$getSelector(f.current,"[data-mode]"),je),O.addClass(O.$getSelector(f.current,"[data-mode='"+N+"']"),je)}),O.model.bind(_n,N=>{f.current.setAttribute($n,N.undoCount>0?Dt:St),f.current.setAttribute(Yn,N.redoCount>0?Dt:St)}),O.model.bind(Ot,y),O.model.bind(Rt,y),O.model.bind(yt,y);let Q=O.getPlugin(wn.type);a(Q!=null),m(Q!=null\|\|b.length>0)}function X(){d.current.model.clearSelection(),d.current.zoomToFit()}function ie(){d.current.zoomIn()}function se(){d.current.zoomOut()}function s(){d.current.setMode(ht)}function u(){d.current.setMode(bt)}function x(){d.current.model.clearSelection(),Jn(d.current)&&d.current.stopEditingPath()}function S(){E.current!=null?E.current(()=>d.current.model.clear()):window.confirm(T)&&d.current.model.clear()}function p(){d.current.model.undo()}function P(){d.current.model.redo()}let y=()=>{d.current.model.getSelection().isEmpty()?f.current.removeAttribute(Tt):f.current.setAttribute(Tt,"true")};Tn(()=>{v.current===!1&&(t!=null?(v.current=!0,W(t)):n!=null&&n.$ui instanceof In&&(v.current=!0,W(n.$ui)))},[t,n]);let z=e.style\|\|{};return C.createElement("div",{style:z,ref:f,className:`vjs-controls ${e.className\|\|""}`,"data-vjs-orientation":o},c&&C.createElement("i",{className:"vjs-pan-mode "+je,"data-mode":ht,title:"Pan Mode",onClick:()=>s()},C.createElement("svg",{fill:"none",viewBox:Mn,stroke:"currentColor"},C.createElement("path",{d:Vn}))),i&&C.createElement("i",{className:"vjs-select-mode","data-mode":bt,title:"Select Mode",onClick:()=>u()},C.createElement("svg",{fill:"currentColor",viewBox:An,stroke:"currentColor"},C.createElement("path",{d:Nn}))),Y.map(O=>C.createElement("i",{className:O.class,title:O.title,onClick:b=>O.handler(b,O.id)})),_&&C.createElement("i",{className:"vjs-zoom-to-fit","data-reset":"true",title:"Zoom To Fit",onClick:()=>X()},C.createElement("svg",{viewBox:Un,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:Bn}))),V&&C.createElement(C.Fragment,null,C.createElement("i",{className:"vjs-zoom-in","data-zoom-in":"true",title:"Zoom In",onClick:()=>ie()},C.createElement("svg",{viewBox:vt,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:Gn}))),C.createElement("i",{className:"vjs-zoom-out","data-zoom-out":"true",title:"Zoom Out",onClick:()=>se()},C.createElement("svg",{viewBox:vt,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:kn})))),h&&C.createElement("i",{className:"vjs-undo","data-undo":"true",title:"Undo last action",onClick:()=>p()}),h&&C.createElement("i",{className:"vjs-redo","data-redo":"true",title:"Redo last action",onClick:()=>P()}),C.createElement("i",{className:Wn,title:r,onClick:()=>x()},C.createElement("svg",{viewBox:Fn,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:Ln}))),B&&C.createElement("i",{className:"vjs-clear-dataset",title:T,onClick:()=>S()},C.createElement("svg",{viewBox:Hn,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:zn}))),Z.map(O=>C.createElement("i",{className:O.class,title:O.title,onClick:b=>O.handler(b,O.id)})))}import J,{useEffect as Zn,useRef as _t,useState as $}from"react";import{SvgExportUI as Xn,ImageExportUI as Nt,Surface as qn,CLASS_CONTROLS as Kn,CLASS_EXPORT_CONTROLS as Qn}from"@visuallyjs/browser-ui";function pd(e){let r=_t(!1),t=_t(null),n=M(),o=ee(),[l,i]=$(!0),[a,c]=$("Export :"),[m,f]=$(null),[v,d]=$(null),[T,R]=$(null),[E,_]=$(!0),[A,V]=$(!0),[G,h]=$(!0);function g(L){t.current=L,e.label&&c(a),e.showLabel!=null&&i(e.showLabel),e.margins&&f(e.margins);let Z=e.svgOptions\|\|{};d(Z);let F=e.imageOptions\|\|{};R(F),e.allowJpgExport!=null&&h(e.allowJpgExport),e.allowPngExport!=null&&V(e.allowPngExport),e.allowSvgExport!=null&&_(e.allowSvgExport)}function B(){new Xn(t.current).export(v)}function k(){new Nt(t.current).export(T)}function Y(){new Nt(t.current).export(Object.assign(T\|\|{},{type:"image/jpeg"}))}return Zn(()=>{r.current===!1&&(n!=null?(r.current=!0,g(n)):o!=null&&o.$ui instanceof qn&&(r.current=!0,g(o.$ui)))},[n,o]),J.createElement("div",{className:`${Kn} ${Qn}`},l&&J.createElement("span",null,a),E&&J.createElement("i",null,J.createElement("a",{href:"#",id:"exportSvg",onClick:()=>B()},"SVG")),A&&J.createElement("i",null,J.createElement("a",{href:"#",id:"exportPng",onClick:()=>k()},"PNG")),G&&J.createElement("i",null,J.createElement("a",{href:"#",id:"exportJpg",onClick:()=>Y()},"JPG")))}import eo,{forwardRef as to,useContext as ro,useEffect as no,useRef as Ge}from"react";import{log as At,ShapePalette as oo}from"@visuallyjs/browser-ui";var Sd=to((e,r)=>{let t=Ge(!1),n=Ge(null),o=ro(D),l=Ge(null),i=e.className\|\|"";function a(c){c.getShapeLibrary()!=null?l.current=new oo(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}):At("WARN: no shapeLibrary provided in props and UI has no shape library. Cannot instantiate ShapePaletteComponent")}return no(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(c=>a(c)):e.surface!=null?a(e.surface):At("ShapePaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),eo.createElement("div",{ref:n,className:i})});import ao,{useEffect as lo,useRef as io}from"react";import{CLASS_SHAPE as so,convertToMultilineText as co,DEFAULT_LABEL_FILL_RATIO as uo}from"@visuallyjs/browser-ui";var po=120,mo=90;function Ad(e){let r=io(null);function t(){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\|\|po}function i(){return e.ctx.obj.data.height\|\|mo}function a(){return e.ctx.obj.data.color\|\|e.ctx.obj.data.outline\|\|"#000000"}function c(){return e.labelProperty\|\|"label"}return lo(()=>{let m=e.ctx.obj.data,f=e.ctx.ui.getShapeLibrary(),v=f.renderCompiledShape(m);if(r.current.replaceChildren(v),e.showLabels){let d=f.renderShapeLabel(m,c(),e.labelStrokeWidth,null,a(),a(),e.font);r.current.appendChild(d),e.multilineLabels!=!1&&co(d,m[c()]\|\|"",l()*(e.labelFillRatio\|\|uo))}}),ao.createElement("svg",{className:so,ref:r,strokeWidth:t(),fill:n(),stroke:o(),preserveAspectRatio:"none",viewBox:"0 0 "+l()+" "+i()})}import fo,{forwardRef as Eo,useContext as Co,useEffect as go,useRef as ke}from"react";import{log as xo,Palette as Po,defaultDataGenerator as Oo}from"@visuallyjs/browser-ui";var $d=Eo((e,r)=>{let t=ke(!1),n=ke(null),o=Co(D),l=ke(null),i=e.className\|\|"";function a(c){let m={selector:e.selector,source:n.current,dataGenerator:f=>e.dataGenerator?e.dataGenerator(f):Oo(f),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 Po(c,m)}return go(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(c=>a(c)):e.surface!=null?a(e.surface):xo("PaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),fo.createElement("div",{className:i,ref:n},e.children)});import ye,{useEffect as Ro,useState as yo,useRef as wt}from"react";import{CLASS_COLOR_PICKER as So,CLASS_COLOR_PICKER_SWATCH as ho,CLASS_COLOR_PICKER_SWATCHES as bo,EVENT_CONTEXT_UPDATE as Vt,EVENT_CHANGE as Le,INSPECTOR_CONTEXT_RECENT_COLORS as Se}from"@visuallyjs/browser-ui";function Kd(e){let r=e.maxColors\|\|10,t=wt(null),n=wt(!1),o=Ee(),[l,i]=yo(o.ensureContext(Se,()=>[]));function a(d){let T=o.ensureContext(Se,()=>[]);if(d=d.toUpperCase(),!(T.find(E=>E.toUpperCase()===d)!=null)){let E=T.slice();E.unshift(d),E.length>r&&(E.length=r),o.updateContext(Se,E)}}function c(){let d=t.current.value;o.setValue(e.propertyName,d,null),a(d)}function m(d){o.setValue(e.propertyName,d,null),t.current.value=d}let f=d=>{d.key===Se&&i(d.value.slice())};function v(){let d=o.getValue(e.propertyName);d!=null&&t.current&&a(d)}return Ro(()=>(o.bind(Vt,f),o.bind(Le,v),n.current\|\|(n.current=!0,t.current.addEventListener(Le,c)),setTimeout(v),()=>{o.unbind(Vt,f),o.unbind(Le,v)})),ye.createElement("div",{className:So},ye.createElement("input",{type:"color",ref:t,"vjs-att":e.propertyName}),ye.createElement("div",{className:bo},l.map(d=>ye.createElement("div",{key:d,title:d,className:ho,style:{backgroundColor:d},"data-color":d,onClick:()=>m(d)}))))}import Do,{forwardRef as vo,useContext as To,useEffect as _o,useRef as Fe}from"react";import{log as No,DiagramPalette as Ao}from"@visuallyjs/browser-ui";var up=vo((e,r)=>{let t=Fe(!1),n=Fe(null),o=To(I),l=Fe(null),i=e.className\|\|"";function a(m){l.current=new Ao(n.current,m,{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})}_o(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(m=>a(m)):e.diagram!=null?a(e.diagram):No("DiagramPaletteComponent cannot start: no DiagramContext from a provider found, and no Diagram provided in props"))});let c=e.style\|\|{};return Do.createElement("div",{ref:n,className:i,style:c})});import wo,{useContext as Mt,useEffect as pe,useRef as he}from"react";import{ColumnChart as Vo,BarChart as Mo,CategoryValueChart as Io,LineChart as Bo,AreaChart as Uo,PieChart as jo,ScatterChart as Go,BubbleChart as ko,GaugeChart as Lo,SankeyChart as Fo}from"@visuallyjs/browser-ui";function j(e){let r=he(null),t=he(!1),n=he(!1),o=he(null),l=e.style\|\|{},i=Mt(D),a=Mt(I);return pe(()=>{if(!t.current)if(t.current=!0,i!=null)i.listen(c=>{let m=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.current,m),n.current=!0});else if(a!=null)a.listen(c=>{let m=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.current,m),n.current=!0});else{let c=Object.assign({dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.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&&(pe(()=>{n.current&&e.data!=null&&o.current&&o.current.load({data:e.data})},[e.data]),pe(()=>{n.current&&e.url!=null&&o.current&&o.current.load({url:e.url})},[e.url]),pe(()=>{n.current&&e.pivot!=null&&o.current&&o.current.pivot&&o.current.pivot(e.pivot)},[e.pivot]),pe(()=>{n.current&&e.dataSourceFilter!=null&&o.current&&o.current.setDataSourceFilter&&o.current.setDataSourceFilter(e.dataSourceFilter)},[e.dataSourceFilter])),wo.createElement("div",{ref:r,style:l,className:`${e.className\|\|""}`})}function Ap(e){let r=Object.assign({createChart:(t,n)=>new Vo(t,n)},e);return j(r)}function wp(e){let r=Object.assign({createChart:(t,n)=>new Mo(t,n)},e);return j(r)}function Vp(e){let r=Object.assign({createChart:(t,n)=>new Io(t,n)},e);return j(r)}function Mp(e){let r=Object.assign({createChart:(t,n)=>new Bo(t,n)},e);return j(r)}function Ip(e){let r=Object.assign({createChart:(t,n)=>new Uo(t,n)},e);return j(r)}function Bp(e){let r=Object.assign({createChart:(t,n)=>new jo(t,n)},e);return j(r)}function Up(e){let r=Object.assign({createChart:(t,n)=>new Go(t,n)},e);return j(r)}function jp(e){let r=Object.assign({createChart:(t,n)=>new ko(t,n)},e);return j(r)}function Gp(e){let r=Object.assign({createChart:(t,n)=>new Lo(t,n)},e);return j(r)}function kp(e){let r=Object.assign({createChart:(t,n)=>new Fo(t,n)},e);return e.interactive!=null&&(r.options.interactive=e.interactive),e.pivot!=null&&(r.options.pivot=e.pivot),e.csvData&&(r.options.csvData=e.csvData),e.jsonData&&(r.options.jsonData=e.jsonData),j(r)}import{log as zo}from"@visuallyjs/browser-ui";import Ho,{useContext as Wo,useEffect as Jo,useRef as It}from"react";function Bt(e){let r=It(!1),t=It(null),n=Wo(D),o=e.position\|\|{x:0,y:0};function l(i){e.placement==="fixed"?i.fixElement(t.current,o,e.constraints):i.floatElement(t.current,o)}return Jo(()=>{r.current\|\|(r.current=!0,n!=null?n.listen(i=>l(i)):zo("Decorator cannot mount: no SurfaceContext from a provider found"))}),Ho.createElement("div",{ref:t},e.children)}import{log as $o,BackgroundPlugin as Yo,GeneratedGridBackground as Zo,TiledBackground as Xo,SimpleBackground as qo}from"@visuallyjs/browser-ui";import Ut,{useEffect as Ko,useRef as Qo}from"react";function ze(e){let r=Qo(!1),t=M();return Ko(()=>{if(t!=null&&!r.current){r.current=!0;try{t.addPlugin({type:Yo.type,options:e})}catch(n){$o(`WARN: BackgroundComponent could not mount background ${n}`)}}},[t]),Ut.createElement(Ut.Fragment,null)}function am(e){return ze(be({type:Zo.type},e))}function lm(e){return ze({type:qo.type,url:e.url})}function im(e){return ze(be({type:Xo.type},e))}import{useEffect as ea}from"react";import{EVENT_DATA_UPDATED as jt,EVENT_GRAPH_CLEARED as Gt}from"@visuallyjs/browser-ui";function Em(e){let r=tt();ea(()=>{if(r!=null){let t=()=>e(r);return r.bind(jt,t),r.bind(Gt,t),t(),()=>{r.unbind(jt,t),r.unbind(Gt,t)}}},[r])}import{useState as kt,useEffect as Lt}from"react";import{EVENT_ZOOM as Ft}from"@visuallyjs/browser-ui";function Sm(e){let r=M(),t=Ke(),[n,o]=kt(e),[l,i]=kt(()=>(n==null?void 0:n.getZoom())\|\|1);return Lt(()=>{if(n!=null){let a=c=>{i(c.zoom)};return n.bind(Ft,a),i(n.getZoom()),()=>{n.unbind(Ft,a)}}},[n]),Lt(()=>{r!=null&&o(r),t!=null&&o(t)},[r,t]),l}export{Yn as ATTRIBUTE_CAN_REDO,$n as ATTRIBUTE_CAN_UNDO,Ip as AreaChartComponent,ze as BackgroundComponent,wp as BarChartComponent,q as BrowserUIReactModel,jp as BubbleChartComponent,ve as CLASS_REACT_GROUP,De as CLASS_REACT_NODE,me as CLASS_REACT_OVERLAY,je as CLASS_SELECTED_MODE,Kd as ColorPickerComponent,Ap as ColumnChartComponent,Yu as ControlsComponent,mo as DEFAULT_SHAPE_HEIGHT,po as DEFAULT_SHAPE_WIDTH,Bt as DecoratorComponent,si as DiagramComponent,I as DiagramContext,up as DiagramPaletteComponent,ii as DiagramProvider,wl as EdgeTypePickerComponent,pd as ExportControlsComponent,Gp as GaugeChartComponent,am as GridBackgroundComponent,lm as ImageBackgroundComponent,Uc as InspectorComponent,fe as InspectorContext,Te as JSXWrapper,Mp as LineChartComponent,yc as MiniviewComponent,$d as PaletteComponent,mc as PaperComponent,H as PaperContext,Hl as PaperProvider,Bp as PieChartComponent,kp as SankeyChartComponent,Up as ScatterChartComponent,Ad as ShapeComponent,Sd as ShapePaletteComponent,ys as SurfaceComponent,D as SurfaceContext,Xr as SurfacePopup,El as SurfaceProvider,im as TiledImageBackgroundComponent,te as VisuallyJsContext,bi as VisuallyJsProvider,Vp as XYChartComponent,et as createDiagramRef,qe as createInspectorRef,Ne as createPaperRef,K as createRefHandler,ue as createSurfaceRef,aa as getSurfaceComponent,Xe as newInstance,Ye as registerSurface,ee as useDiagram,Ee as useInspector,Ke as usePaper,M as useSurface,tt as useVisuallyJsModel,Em as useVisuallyJsUpdate,Sm as useZoom};
1	+ var zt=Object.defineProperty;var He=Object.getOwnPropertySymbols;var Ht=Object.prototype.hasOwnProperty,Wt=Object.prototype.propertyIsEnumerable;var We=(e,r,t)=>r in e?zt(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,be=(e,r)=>{for(var t in r\|\|(r={}))Ht.call(r,t)&&We(e,t,r[t]);if(He)for(var t of He(r))Wt.call(r,t)&&We(e,t,r[t]);return e};import{log as Je}from"@visuallyjs/browser-ui";var $e=new Map,ce={};function Ye(e,r){$e.set(e,r),Jt(e,r)}function Jt(e,r){(ce[e]\|\|[]).forEach(n=>{try{n(r)}catch(o){Je("WARN: an error was reported invoking a SurfaceComponentRefCallback "+o)}}),delete ce[e]}function aa(e,r){let t=$e.get(e);if(t)try{r(t)}catch(n){Je("WARN: an error was reported invoking a SurfaceComponentRefCallback "+n)}else ce[e]=ce[e]\|\|[],ce[e].push(r)}var De="vjs-react-node",ve="vjs-react-group",me="vjs-react-overlay";import Ze,{useEffect as $t,useRef as Yt}from"react";function Te(e){let r=Yt(!1);return $t(()=>{r.current\|\|(r.current=!0,e.cb(e.ns))}),Ze.createElement(Ze.Fragment,null,e.ns.def.jsx({obj:e.ns.obj,vertex:e.ns.obj,model:e.model,ui:e.ui,data:e.ns.obj.data,props:e.childProps\|\|{}}))}import{BrowserUIModel as Zt,log as Xt}from"@visuallyjs/browser-ui";var q=class extends Zt{render(r,t){return Xt("render called directly on BrowserUIReactModel class: should not happen. UI components should use internal render."),null}};function Xe(e){return e=e\|\|{},new q(e)}import{createContext as qt,default as Kt,useRef as Qt,useContext as er,useState as tr,useEffect as rr}from"react";var D=qt(null);function El(e){let r=Qt(null),t=ue(r);return Kt.createElement(D.Provider,{value:t},e.children\|\|[])}function ue(e){return K(e)}function K(e){let r=[];return{set:t=>{e.current=t,r.forEach(n=>n(t))},listen:t=>{e.current==null?r.push(t):t(e.current)},ref:()=>e}}function M(){let e=er(D),[r,t]=tr(null);return rr(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}import{createContext as nr,useContext as or}from"react";var fe=nr(null);function qe(e){return K(e)}function Ee(){let e=or(fe);return e==null?null:e.ref().current}import ar,{useRef as _e,useEffect as lr}from"react";import{INSPECTOR_CONTEXT_EDGE_PROPERTY_MAPPINGS as ir,EdgeTypePicker as sr}from"@visuallyjs/browser-ui";function wl(e){let r=_e(!1),t=_e(null),n=_e(null),o=Ee(),{propertyName:l}=e,i=()=>o.getFromContext(ir)\|\|o.$ui.$getEdgePropertyMappings();return lr(()=>{r.current\|\|(r.current=!0,n.current=new sr(o.$ui,t.current,i(),o.getValue(l),(a,c)=>{o.setValue(l,c,null)}),n.current.render(l,o.et),o.onChange(()=>{n.current.select(l,o.getValue(l))}))}),ar.createElement("div",{ref:t})}import{createContext as cr,default as ur,useRef as dr,useContext as pr,useState as mr,useEffect as fr}from"react";var H=cr(null);function Hl(e){let r=dr(null),t=Ne(r);return ur.createElement(H.Provider,{value:t},e.children\|\|[])}function Ne(e){return K(e)}function Ke(){let e=pr(H),[r,t]=mr(null);return fr(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}import Ce,{createContext as Er,forwardRef as Cr,useContext as Ae,useEffect as Qe,useImperativeHandle as gr,useRef as de,useState as xr}from"react";import{createDiagram as Pr}from"@visuallyjs/browser-ui";var I=Er(null);function et(e){return K(e)}function ii(e){let r=de(null),t=et(r);return Ce.createElement(I.Provider,{value:t},e.children\|\|[])}function ee(){let e=Ae(I),[r,t]=xr(null);return Qe(()=>{if(e){let n=o=>{t(o)};e.ref().current?t(e.ref().current):e.listen(n)}},[e]),r}var si=Cr((e,r)=>{let t=de(null),n=de(!1),o,l,i=Ae(I);i==null?(o=de(null),i=et(o)):o=i.ref();let a=Ae(D);a==null?(l=de(null),a=ue(l)):l=a.ref();let c={getDiagram:()=>o.current};gr(r,()=>c),Qe(()=>{n.current\|\|(n.current=!0,o.current=Pr(t.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}),i.set(o.current),a.set(l.current))});let m=`${e.className\|\|""} vjs-react-diagram`,f=e.style\|\|{};return Ce.createElement("div",{ref:t,className:m,style:f},Ce.createElement(D.Provider,{value:a},Ce.createElement(I.Provider,{value:i},e.children)))});import Or,{createContext as Rr,useContext as ge,useEffect as we,useMemo as yr,useState as Sr}from"react";var te=Rr(void 0);function bi(e){let r=yr(()=>Xe(e.modelOptions\|\|{}),[]);function t(o,l){r.clear(),r.load({data:o,dataType:l})}function n(o,l){r.clear(),r.load({url:o,dataType:l})}return e.data!=null&&t(e.data,e.dataType),e.url!=null&&t(e.url,e.dataType),we(()=>{e.data!=null&&t(e.data,e.dataType)},[e.data]),we(()=>{e.url!=null&&n(e.url,e.dataType)},[e.url]),Or.createElement(te.Provider,{value:r},e.children\|\|[])}function tt(){let e=ge(te),r=ge(D),t=ge(H),n=ge(I),[o,l]=Sr(e);return we(()=>{if(e){l(e);return}let i;r!=null&&(r.ref().current?l(r.ref().current.model):(i=m=>{l(m.model)},r.listen(i)));let a;t!=null&&(t.ref().current?o==null&&l(t.ref().current.model):(a=m=>{o==null&&l(m.model)},t.listen(a)));let c;n!=null&&(n.ref().current?o==null&&l(n.ref().current.model):(c=m=>{o==null&&l(m.model)},n.listen(c)))}),o}import rt from"react";import{addClass as nt,isGroup as ot,ATTRIBUTE_NOT_DRAGGABLE as at,TRUE as lt}from"@visuallyjs/browser-ui";function hr(e,r){if(e.hydrated!==!0){let t=ot(e.obj)?ve:De;e.domElement.firstElementChild&&nt(e.domElement.firstElementChild,t),e.hydrated=!0}else r.current.$revalidateElement(e.domElement)}function xe(e,r,t,n){return rt.createElement(Te,{ns:e,model:r,ui:t.current,childProps:n,cb:o=>{hr(o,t)}})}function Pe(e,r,t,n){return rt.createElement(Te,{ns:e,model:r,ui:t.current,childProps:n,cb:o=>{br(o,t)}})}function br(e,r){if(e.hydrated!==!0){let t=ot(e.obj)?ve:De;e.domElement.firstElementChild&&(nt(e.domElement.firstElementChild,t),e.domElement.firstElementChild.getAttribute(at)===lt&&e.domElement.setAttribute(at,lt)),r.current.$vertexRendered(e.obj,e.domElement,e.def,e.payload.eventInfo),e.hydrated=!0}else r.current.$revalidateElement(e.domElement)}import re,{forwardRef as Dr,useContext as it,useEffect as st,useImperativeHandle as vr,useRef as ne,useState as ct}from"react";importas Ve from"react-dom";import{ELEMENT_DIV as ut,ELEMENT_SVG as Tr,ElementTypes as _r,EVENT_GRAPH_CLEARED as Nr,EVENT_GROUP_REMOVED as Ar,EVENT_GROUP_UPDATED as wr,EVENT_NODE_REMOVED as Vr,EVENT_NODE_UPDATED as Mr,extend as dt,isGroup as Ir,renderSurface as Br,CLASS_DEFAULT_NODE as Ur,CLASS_DEFAULT_GROUP as jr,OVERLAY_TYPE_CUSTOM as Gr,EVENT_EDGE_REMOVED as kr,EVENT_EDGE_UPDATED as Lr,uuid as Fr,partition as zr,$svgNode as Hr}from"@visuallyjs/browser-ui";var ys=Dr((e,r)=>{let t=ne(!1),n=ne(!1),o=it(te),l=ne(null),i=ne(null),a=ne(o),c,m=it(D);m==null?(c=ne(null),m=ue(c)):c=m.ref();let[f,v]=ct([]),[d,T]=ct([]),R=[],E=[];function _(){v(R.slice())}function A(){T(E.slice())}let V={getSurface:()=>c.current,getModel:()=>a.current};vr(r,()=>V),st(()=>{var g;if(!n.current){n.current=!0,e.model!=null?a.current=e.model:o==null?a.current=new q(e.modelOptions\|\|{}):a.current=o,typeof document!="undefined"&&(i.current=document.createElement("div"),i.current.style.position="fixed",i.current.style.left="10000px",i.current.style.top="10000px",i.current.style.width="100px",i.current.style.height="100px",i.current.style.opacity="0",l.current.appendChild(i.current));let B=(s,u,x,S,p,P,y,z)=>{let[O,b]=P.component\|\|P.jsx?[P,null]:Ir(y)?[Object.assign(Object.assign({},P),{jsx:N=>re.createElement(re.Fragment,null,N.obj.data.label)}),jr]:[Object.assign(Object.assign({},P),{jsx:N=>re.createElement(re.Fragment,null,N.obj.data.label)}),Ur],w=p.containerType===_r.HTML?document.createElement(ut):Hr(Tr);i.current.appendChild(w),b!=null&&p.$addClassToElement(w,b);let Q={data:u,model:x,ui:p,componentId:y.getFullId(),obj:y,props:e.childProps,element:w,eventInfo:z};R.push({data:u,def:O,payload:Q,domElement:w,key:y.id,obj:y,hydrated:!1}),_()},k=(s,u)=>{u.parentNode&&u.parentNode.removeChild(u)},Y={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(s,u,x,S)=>{},render:B,rerender:(s,u,x,S,p,P,y,z,O)=>{let b=zr(R,w=>w.obj!==y);R=b.left,_(),B(s,u,x,S,p,P,y,z),b.right.length>0&&setTimeout(()=>{k(null,b.right[0].domElement)})},cleanupVertex:k,cleanupPort:(s,u)=>{}},L=((g=e.viewOptions)==null?void 0:g.edges)\|\|{};for(let s in L){let u=L[s];u.overlays!=null&&(u.overlays=u.overlays.map(x=>x.jsx!=null?{type:Gr,options:{create:p=>{let P=document.createElement(ut);P.className=me;let y={data:p.edge.data,model:a.current,ui:F,componentId:p.edge.getFullId(),obj:p.edge,props:e.childProps,element:P};return E.push({def:{jsx:x.jsx},data:p.edge.data,obj:p.edge,payload:y,domElement:P,key:Fr(),hydrated:!1}),A(),P}}}:x))}let Z=Object.assign(e.renderOptions\|\|{},{view:e.viewOptions,selection:e.selection}),F=Br(a.current,l.current,Y,Z);m.set(F),e.surfaceId!=null&&Ye(e.surfaceId,V);let W=(s,u)=>{let x=()=>{let p={};return(u.originalData\|\|u.updates)&&(p=dt(u.originalData,u.updates)),p},S=R.find(p=>p.key===s);S!=null&&(S.data=x(),_())},X=s=>{R=R.filter(u=>u.payload.componentId!==s),_()},ie=(s,u)=>{let x=()=>{let p={};return(u.originalData\|\|u.updates)&&(p=dt(u.originalData,u.updates)),p},S=E.find(p=>p.obj.id===s);S!=null&&(S.data=x(),A())},se=s=>{E=E.filter(u=>u.payload.obj.id!==s),A()};a.current.bind(Mr,s=>{W(s.vertex.getFullId(),s)}),a.current.bind(wr,s=>{W(s.vertex.getFullId(),s)}),a.current.bind(Vr,s=>{X(s.node.id)}),a.current.bind(Ar,s=>{X(s.group.id)}),a.current.bind(kr,s=>{se(s.edge.id)}),a.current.bind(Lr,s=>{ie(s.edge.id,s)}),a.current.bind(Nr,()=>{R=[],_(),E=[],A()})}}),st(()=>{n.current&&a.current!=null&&c.current!=null&&t.current===!1&&(e.data!=null\|\|e.url!=null)&&(t.current=!0,a.current.clear(),a.current.load({data:e.data,url:e.url,onload:()=>{t.current=!1,setTimeout(()=>c.current.repaintEverything(),250)}}))},[e.data,e.url]);let G=`${e.className\|\|""} vjs-react-surface`,h=e.style\|\|{};return re.createElement("div",{ref:l,className:G,style:h},f.map(g=>Ve.createPortal(Pe(g,a.current,c,e.childProps),g.domElement,g.key)),d.map(g=>Ve.createPortal(xe(g,a.current,c,e.childProps),g.domElement,g.key)),re.createElement(D.Provider,{value:m},e.children))});import Wr,{useEffect as Jr,useMemo as $r,useRef as Me,useState as pt}from"react";import{PopupHandler as Yr,CLASS_SURFACE_POPUP as Zr}from"@visuallyjs/browser-ui";function Xr(e){let r=M(),t=Me(null),n=Me(!1),o=Me(null),[l,i]=pt(null),[a,c]=pt(0),m=$r(()=>l==null?"none":"block",[l]);function f(d){i(d),c(T=>T+1)}Jr(()=>{!n.current&&r&&(n.current=!0,o.current=new Yr(e.selector,t.current,r,d=>f(d),e.anchor))});function v(){o.current&&o.current.$hide()}return Wr.createElement("div",{ref:t,className:Zr,style:{display:m,position:"absolute"}},l!=null&&e.children(l,r.model,r,()=>v()))}import oe,{forwardRef as qr,useContext as mt,useEffect as ft,useImperativeHandle as Kr,useRef as ae,useState as Et}from"react";importas Ie from"react-dom";import{ELEMENT_DIV as Ct,ELEMENT_SVG as Qr,ElementTypes as en,EVENT_GRAPH_CLEARED as tn,EVENT_GROUP_REMOVED as rn,EVENT_GROUP_UPDATED as nn,EVENT_NODE_REMOVED as on,EVENT_NODE_UPDATED as an,extend as gt,isGroup as ln,renderPaper as sn,CLASS_DEFAULT_NODE as cn,CLASS_DEFAULT_GROUP as un,OVERLAY_TYPE_CUSTOM as dn,EVENT_EDGE_REMOVED as pn,EVENT_EDGE_UPDATED as mn,uuid as fn,partition as En,$svgNode as Cn}from"@visuallyjs/browser-ui";var mc=qr((e,r)=>{let t=ae(!1),n=ae(!1),o=mt(te),l=ae(null),i=ae(null),a=ae(null),c,m=mt(H);m==null?(c=ae(null),m=Ne(c)):c=m.ref();let[f,v]=Et([]),[d,T]=Et([]),R=[],E=[];function _(){v(R.slice())}function A(){T(E.slice())}let V={getPaper:()=>c.current,getModel:()=>a.current};Kr(r,()=>V),ft(()=>{var g;if(!n.current){n.current=!0,e.model!=null?a.current=e.model:o==null?a.current=new q(e.modelOptions\|\|{}):a.current=o,typeof document!="undefined"&&(i.current=document.createElement("div"),i.current.style.position="fixed",i.current.style.left="10000px",i.current.style.top="10000px",i.current.style.width="100px",i.current.style.height="100px",i.current.style.opacity="0",l.current.appendChild(i.current));let B=(s,u,x,S,p,P,y,z)=>{let[O,b]=P.component\|\|P.jsx?[P,null]:ln(y)?[Object.assign(Object.assign({},P),{jsx:N=>oe.createElement(oe.Fragment,null,N.obj.data.label)}),un]:[Object.assign(Object.assign({},P),{jsx:N=>oe.createElement(oe.Fragment,null,N.obj.data.label)}),cn],w=p.containerType===en.HTML?document.createElement(Ct):Cn(Qr);i.current.appendChild(w),b!=null&&p.$addClassToElement(w,b);let Q={data:u,model:x,ui:p,componentId:y.getFullId(),obj:y,props:e.childProps,element:w,eventInfo:z};R.push({data:u,def:O,payload:Q,domElement:w,key:y.id,obj:y,hydrated:!1}),_()},k=(s,u)=>{u.parentNode&&u.parentNode.removeChild(u)},Y={asynchronous:!0,reactive:!0,usesWrapperElement:!0,update:(s,u,x,S)=>{},render:B,rerender:(s,u,x,S,p,P,y,z,O)=>{let b=En(R,w=>w.obj!==y);R=b.left,_(),B(s,u,x,S,p,P,y,z),b.right.length>0&&setTimeout(()=>{k(null,b.right[0].domElement)})},cleanupVertex:k,cleanupPort:(s,u)=>{}},L=((g=e.viewOptions)==null?void 0:g.edges)\|\|{};for(let s in L){let u=L[s];u.overlays!=null&&(u.overlays=u.overlays.map(x=>x.jsx!=null?{type:dn,options:{create:p=>{let P=document.createElement(Ct);P.className=me;let y={data:p.edge.data,model:a.current,ui:F,componentId:p.edge.getFullId(),obj:p.edge,props:e.childProps,element:P};return E.push({def:{jsx:x.jsx},data:p.edge.data,obj:p.edge,payload:y,domElement:P,key:fn(),hydrated:!1}),A(),P}}}:x))}let Z=Object.assign(e.renderOptions\|\|{},{view:e.viewOptions}),F=sn(a.current,l.current,Y,Z);m.set(F);let W=(s,u)=>{let x=()=>{let p={};return(u.originalData\|\|u.updates)&&(p=gt(u.originalData,u.updates)),p},S=R.find(p=>p.key===s);S!=null&&(S.data=x(),_())},X=s=>{R=R.filter(u=>u.payload.componentId!==s),_()},ie=(s,u)=>{let x=()=>{let p={};return(u.originalData\|\|u.updates)&&(p=gt(u.originalData,u.updates)),p},S=E.find(p=>p.obj.id===s);S!=null&&(S.data=x(),A())},se=s=>{E=E.filter(u=>u.payload.obj.id!==s),A()};a.current.bind(an,s=>{W(s.vertex.getFullId(),s)}),a.current.bind(nn,s=>{W(s.vertex.getFullId(),s)}),a.current.bind(on,s=>{X(s.node.id)}),a.current.bind(rn,s=>{X(s.group.id)}),a.current.bind(pn,s=>{se(s.edge.id)}),a.current.bind(mn,s=>{ie(s.edge.id,s)}),a.current.bind(tn,()=>{R=[],_(),E=[],A()})}}),ft(()=>{n.current&&a.current!=null&&c.current!=null&&t.current===!1&&(e.data!=null\|\|e.url!=null)&&(t.current=!0,a.current.clear(),a.current.load({data:e.data,url:e.url,onload:()=>{t.current=!1,setTimeout(()=>c.current.repaintEverything(),250)}}))},[e.data,e.url]);let G=`${e.className\|\|""} vjs-react-paper`,h=e.style\|\|{};return oe.createElement("div",{ref:l,className:G,style:h},f.map(g=>Ie.createPortal(Pe(g,a.current,c,e.childProps),g.domElement,g.key)),d.map(g=>Ie.createPortal(xe(g,a.current,c,e.childProps),g.domElement,g.key)),oe.createElement(H.Provider,{value:m},e.children))});import{MiniviewPlugin as gn,Surface as xn}from"@visuallyjs/browser-ui";import Pn,{forwardRef as On,useEffect as Rn,useImperativeHandle as yn,useRef as xt}from"react";var yc=On((e,r)=>{let t=M(),n=ee(),o=xt(!1),l=xt(null),i;yn(r,()=>({toggleCollapsed:()=>i==null?void 0:i.toggleCollapsed()}));function a(c){c.addPlugin({type:gn.type,options:{container:l.current,elementFilter:e.elementFilter,typeFunction:e.typeFunction,activeTracking:e.activeTracking,clickToCenter:e.clickToCenter,showLasso:e.showLasso,trackSelection:e.trackSelection}})}return Rn(()=>{o.current\|\|(t!=null?(o.current=!0,a(t)):n!=null&&n.$ui instanceof xn&&(o.current=!0,a(n.$ui)))},[t,n]),Pn.createElement("div",{ref:l,className:`${e.className\|\|""}`})});import{Inspector as Sn,log as hn,Surface as bn}from"@visuallyjs/browser-ui";import le,{forwardRef as Dn,useContext as Oe,useEffect as Pt,useImperativeHandle as vn,useRef as Be,useState as Ue}from"react";var Uc=Dn((e,r)=>{let t=Oe(D),n=Oe(I),o=Oe(H),l,i=Oe(fe);i==null&&(l=Be(null),i=qe(l));let[a,c]=Ue(null),[m,f]=Ue(0),[v,d]=Ue(null),T=Be(!1),R=Be(null),E=e.className\|\|"";Pt(()=>{var h;(h=l==null?void 0:l.current)==null\|\|h.$refresh()},[m]);let _=e.onSelectionCleared\|\|(()=>c(null)),A=(h,g)=>{c(h),e.refresh&&e.refresh(h),f(B=>B+1)};function V(h){l.current=new Sn({container:R.current,ui:h,renderEmptyContainer:_,refresh:A,autoCommit:e.autoCommit,multipleSelections:e.multipleSelections,filter:e.filter,showCloseButton:e.showCloseButton,afterUpdate:()=>e.afterUpdate?e.afterUpdate(h):null}),d(l.current)}let G={getInspector:()=>v};return vn(r,()=>G),Pt(()=>{T.current\|\|(T.current=!0,t!=null?t.listen(V):o!=null?o.listen(V):n!=null?n.listen(h=>{h.$ui instanceof bn&&V(h.$ui)}):hn("WARN: InspectorComponent cannot resolve a surface to attach to. Either provide surfaceId or ensure there is an ancestor SurfaceComponent, DiagramComponent, SurfaceProvider or DiagramProvider"))}),le.createElement("div",{ref:R,className:E},le.createElement(fe.Provider,{value:i},a!=null&&le.createElement(le.Fragment,null,typeof e.children=="function"?e.children(a,l.current.$ui.model):e.children\|\|[]),a==null&&le.createElement(le.Fragment,null,e.renderEmptyContent&&e.renderEmptyContent())))});var Gc="group:added",kc="group:member:added",Lc="group:member:removed",Fc="group:removed",zc="dataLoadStart",Hc="dataAppendStart",Wc="dataLoadEnd",Jc="dataAppendEnd",$c="dataUpdated",Yc="graphClearStart",Zc="graphCleared",Xc="graphChanged",qc="group:updated",Kc="node:updated",Qc="port:updated",eu="edge:updated",tu="edge:added",ru="node:added",nu="edge:removed",ou="node:removed",au="port:added",lu="port:removed",iu="edge:target",su="edge:source",Ot="select",Rt="deselect",yt="selection:cleared",cu="edge:geometry",uu="edge:pathEdited",du="edge:dragStart",pu="edge:drag",mu="edge:dragEnd",fu="edge:dragAbort",Eu="edge:typeChanged",Cu="node:typeChanged",gu="port:typeChanged",xu="group:typeChanged",Pu="group:move:start",Ou="group:move",Ru="group:move:end",yu="internal:group:sizeChanged",Su="internal:group:sizeChangedRedo",hu="internal:group:sizeChangedUndo",bu="internal:edge:redraw",Du="renderer:added",vu="node:move:start",Tu="node:move",_u="node:move:end",Nu="node:move:abort",Au="undoredo:update",wu="undo",Vu="redo",Mu="destroy";import C,{useEffect as Tn,useRef as Re,useState as U}from"react";import{EVENT_UNDOREDO_UPDATE as _n,FALSE as St,LASSO_PATH as Nn,LASSO_VIEW_BOX as An,LassoPlugin as wn,PAN_PATH as Vn,PAN_VIEW_BOX as Mn,Surface as In,SURFACE_MODE_PAN as ht,SURFACE_MODE_SELECT as bt,TRUE as Dt,ZOOM_TO_FIT_PATH as Bn,ZOOM_TO_FIT_VIEW_BOX as Un,EVENT_SURFACE_MODE_CHANGED as jn,ZOOM_IN_OUT_VIEW_BOX as vt,ZOOM_IN_PATH as Gn,ZOOM_OUT_PATH as kn,RESET_SELECTION_PATH as Ln,RESET_SELECTION_VIEW_BOX as Fn,CLEAR_PATH as zn,CLEAR_VIEW_BOX as Hn,CLASS_CONTROLS_RESET_SELECTION as Wn,supportsPathEditing as Jn}from"@visuallyjs/browser-ui";var $n="can-undo",Yn="can-redo",je="vjs-selected-mode",Tt="vjs-controls-has-selection";function Yu(e){let r="Clear selection",t=M(),n=ee(),[o,l]=U("row"),[i,a]=U(!1),[c,m]=U(!1),f=Re(null),v=Re(!1),d=Re(null),[T,R]=U("Clear dataset?"),E=Re(null),[_,A]=U(!0),[V,G]=U(!1),[h,g]=U(!0),[B,k]=U(!0),[Y,L]=U([]),[Z,F]=U([]);function W(O){d.current=O,e.clearMessage&&R(e.clearMessage),e.onMaybeClear&&(E.current=e.onMaybeClear),e.orientation&&l(e.orientation),e.undoRedo===!1&&g(!1),e.zoomToExtents===!1&&A(!1),e.zoomButtons===!0&&G(!0),e.clear===!1&&k(!1);let b=(e.buttons\|\|[]).filter(N=>N.mode!=null);L(b);let w=(e.buttons\|\|[]).filter(N=>N.mode==null);F(w),O.bind(jn,N=>{O.removeClass(O.$getSelector(f.current,"[data-mode]"),je),O.addClass(O.$getSelector(f.current,"[data-mode='"+N+"']"),je)}),O.model.bind(_n,N=>{f.current.setAttribute($n,N.undoCount>0?Dt:St),f.current.setAttribute(Yn,N.redoCount>0?Dt:St)}),O.model.bind(Ot,y),O.model.bind(Rt,y),O.model.bind(yt,y);let Q=O.getPlugin(wn.type);a(Q!=null),m(Q!=null\|\|b.length>0)}function X(){d.current.model.clearSelection(),d.current.zoomToFit()}function ie(){d.current.zoomIn()}function se(){d.current.zoomOut()}function s(){d.current.setMode(ht)}function u(){d.current.setMode(bt)}function x(){d.current.model.clearSelection(),Jn(d.current)&&d.current.stopEditingPath()}function S(){E.current!=null?E.current(()=>d.current.model.clear()):window.confirm(T)&&d.current.model.clear()}function p(){d.current.model.undo()}function P(){d.current.model.redo()}let y=()=>{d.current.model.getSelection().isEmpty()?f.current.removeAttribute(Tt):f.current.setAttribute(Tt,"true")};Tn(()=>{v.current===!1&&(t!=null?(v.current=!0,W(t)):n!=null&&n.$ui instanceof In&&(v.current=!0,W(n.$ui)))},[t,n]);let z=e.style\|\|{};return C.createElement("div",{style:z,ref:f,className:`vjs-controls ${e.className\|\|""}`,"data-vjs-orientation":o},c&&C.createElement("i",{className:"vjs-pan-mode "+je,"data-mode":ht,title:"Pan Mode",onClick:()=>s()},C.createElement("svg",{fill:"none",viewBox:Mn,stroke:"currentColor"},C.createElement("path",{d:Vn}))),i&&C.createElement("i",{className:"vjs-select-mode","data-mode":bt,title:"Select Mode",onClick:()=>u()},C.createElement("svg",{fill:"currentColor",viewBox:An,stroke:"currentColor"},C.createElement("path",{d:Nn}))),Y.map(O=>C.createElement("i",{className:O.class,title:O.title,onClick:b=>O.handler(b,O.id)})),_&&C.createElement("i",{className:"vjs-zoom-to-fit","data-reset":"true",title:"Zoom To Fit",onClick:()=>X()},C.createElement("svg",{viewBox:Un,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:Bn}))),V&&C.createElement(C.Fragment,null,C.createElement("i",{className:"vjs-zoom-in","data-zoom-in":"true",title:"Zoom In",onClick:()=>ie()},C.createElement("svg",{viewBox:vt,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:Gn}))),C.createElement("i",{className:"vjs-zoom-out","data-zoom-out":"true",title:"Zoom Out",onClick:()=>se()},C.createElement("svg",{viewBox:vt,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:kn})))),h&&C.createElement("i",{className:"vjs-undo","data-undo":"true",title:"Undo last action",onClick:()=>p()}),h&&C.createElement("i",{className:"vjs-redo","data-redo":"true",title:"Redo last action",onClick:()=>P()}),C.createElement("i",{className:Wn,title:r,onClick:()=>x()},C.createElement("svg",{viewBox:Fn,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:Ln}))),B&&C.createElement("i",{className:"vjs-clear-dataset",title:T,onClick:()=>S()},C.createElement("svg",{viewBox:Hn,stroke:"currentColor",fill:"currentColor"},C.createElement("path",{d:zn}))),Z.map(O=>C.createElement("i",{className:O.class,title:O.title,onClick:b=>O.handler(b,O.id)})))}import J,{useEffect as Zn,useRef as _t,useState as $}from"react";import{SvgExportUI as Xn,ImageExportUI as Nt,Surface as qn,CLASS_CONTROLS as Kn,CLASS_EXPORT_CONTROLS as Qn}from"@visuallyjs/browser-ui";function pd(e){let r=_t(!1),t=_t(null),n=M(),o=ee(),[l,i]=$(!0),[a,c]=$("Export :"),[m,f]=$(null),[v,d]=$(null),[T,R]=$(null),[E,_]=$(!0),[A,V]=$(!0),[G,h]=$(!0);function g(L){t.current=L,e.label&&c(a),e.showLabel!=null&&i(e.showLabel),e.margins&&f(e.margins);let Z=e.svgOptions\|\|{};d(Z);let F=e.imageOptions\|\|{};R(F),e.allowJpgExport!=null&&h(e.allowJpgExport),e.allowPngExport!=null&&V(e.allowPngExport),e.allowSvgExport!=null&&_(e.allowSvgExport)}function B(){new Xn(t.current).export(v)}function k(){new Nt(t.current).export(T)}function Y(){new Nt(t.current).export(Object.assign(T\|\|{},{type:"image/jpeg"}))}return Zn(()=>{r.current===!1&&(n!=null?(r.current=!0,g(n)):o!=null&&o.$ui instanceof qn&&(r.current=!0,g(o.$ui)))},[n,o]),J.createElement("div",{className:`${Kn} ${Qn}`},l&&J.createElement("span",null,a),E&&J.createElement("i",null,J.createElement("a",{href:"#",id:"exportSvg",onClick:()=>B()},"SVG")),A&&J.createElement("i",null,J.createElement("a",{href:"#",id:"exportPng",onClick:()=>k()},"PNG")),G&&J.createElement("i",null,J.createElement("a",{href:"#",id:"exportJpg",onClick:()=>Y()},"JPG")))}import eo,{forwardRef as to,useContext as ro,useEffect as no,useRef as Ge}from"react";import{log as At,ShapePalette as oo}from"@visuallyjs/browser-ui";var Sd=to((e,r)=>{let t=Ge(!1),n=Ge(null),o=ro(D),l=Ge(null),i=e.className\|\|"";function a(c){c.getShapeLibrary()!=null?l.current=new oo(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}):At("WARN: no shapeLibrary provided in props and UI has no shape library. Cannot instantiate ShapePaletteComponent")}return no(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(c=>a(c)):e.surface!=null?a(e.surface):At("ShapePaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),eo.createElement("div",{ref:n,className:i})});import ao,{useEffect as lo,useRef as io}from"react";import{CLASS_SHAPE as so,convertToMultilineText as co,DEFAULT_LABEL_FILL_RATIO as uo}from"@visuallyjs/browser-ui";var po=120,mo=90;function Ad(e){let r=io(null);function t(){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\|\|po}function i(){return e.ctx.obj.data.height\|\|mo}function a(){return e.ctx.obj.data.color\|\|e.ctx.obj.data.outline\|\|"#000000"}function c(){return e.labelProperty\|\|"label"}return lo(()=>{let m=e.ctx.obj.data,f=e.ctx.ui.getShapeLibrary(),v=f.renderCompiledShape(m);if(r.current.replaceChildren(v),e.showLabels){let d=f.renderShapeLabel(m,c(),e.labelStrokeWidth,null,a(),a(),e.font);r.current.appendChild(d),e.multilineLabels!=!1&&co(d,m[c()]\|\|"",l()*(e.labelFillRatio\|\|uo))}}),ao.createElement("svg",{className:so,ref:r,strokeWidth:t(),fill:n(),stroke:o(),preserveAspectRatio:"none",viewBox:"0 0 "+l()+" "+i()})}import fo,{forwardRef as Eo,useContext as Co,useEffect as go,useRef as ke}from"react";import{log as xo,Palette as Po,defaultDataGenerator as Oo}from"@visuallyjs/browser-ui";var $d=Eo((e,r)=>{let t=ke(!1),n=ke(null),o=Co(D),l=ke(null),i=e.className\|\|"";function a(c){let m={selector:e.selector,source:n.current,dataGenerator:f=>e.dataGenerator?e.dataGenerator(f):Oo(f),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 Po(c,m)}return go(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(c=>a(c)):e.surface!=null?a(e.surface):xo("PaletteComponent cannot start: no SurfaceContext from a provider found, and no Surface provided in props"))}),fo.createElement("div",{className:i,ref:n},e.children)});import ye,{useEffect as Ro,useState as yo,useRef as wt}from"react";import{CLASS_COLOR_PICKER as So,CLASS_COLOR_PICKER_SWATCH as ho,CLASS_COLOR_PICKER_SWATCHES as bo,EVENT_CONTEXT_UPDATE as Vt,EVENT_CHANGE as Le,INSPECTOR_CONTEXT_RECENT_COLORS as Se}from"@visuallyjs/browser-ui";function Kd(e){let r=e.maxColors\|\|10,t=wt(null),n=wt(!1),o=Ee(),[l,i]=yo(o.ensureContext(Se,()=>[]));function a(d){let T=o.ensureContext(Se,()=>[]);if(d=d.toUpperCase(),!(T.find(E=>E.toUpperCase()===d)!=null)){let E=T.slice();E.unshift(d),E.length>r&&(E.length=r),o.updateContext(Se,E)}}function c(){let d=t.current.value;o.setValue(e.propertyName,d,null),a(d)}function m(d){o.setValue(e.propertyName,d,null),t.current.value=d}let f=d=>{d.key===Se&&i(d.value.slice())};function v(){let d=o.getValue(e.propertyName);d!=null&&t.current&&a(d)}return Ro(()=>(o.bind(Vt,f),o.bind(Le,v),n.current\|\|(n.current=!0,t.current.addEventListener(Le,c)),setTimeout(v),()=>{o.unbind(Vt,f),o.unbind(Le,v)})),ye.createElement("div",{className:So},ye.createElement("input",{type:"color",ref:t,"vjs-att":e.propertyName}),ye.createElement("div",{className:bo},l.map(d=>ye.createElement("div",{key:d,title:d,className:ho,style:{backgroundColor:d},"data-color":d,onClick:()=>m(d)}))))}import Do,{forwardRef as vo,useContext as To,useEffect as _o,useRef as Fe}from"react";import{log as No,DiagramPalette as Ao}from"@visuallyjs/browser-ui";var up=vo((e,r)=>{let t=Fe(!1),n=Fe(null),o=To(I),l=Fe(null),i=e.className\|\|"";function a(m){l.current=new Ao(n.current,m,{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})}_o(()=>{t.current\|\|(t.current=!0,o!=null?o.listen(m=>a(m)):e.diagram!=null?a(e.diagram):No("DiagramPaletteComponent cannot start: no DiagramContext from a provider found, and no Diagram provided in props"))});let c=e.style\|\|{};return Do.createElement("div",{ref:n,className:i,style:c})});import wo,{useContext as Mt,useEffect as pe,useRef as he}from"react";import{ColumnChart as Vo,BarChart as Mo,CategoryValueChart as Io,LineChart as Bo,AreaChart as Uo,PieChart as jo,ScatterChart as Go,BubbleChart as ko,GaugeChart as Lo,SankeyChart as Fo}from"@visuallyjs/browser-ui";function j(e){let r=he(null),t=he(!1),n=he(!1),o=he(null),l=e.style\|\|{},i=Mt(D),a=Mt(I);return pe(()=>{if(!t.current)if(t.current=!0,i!=null)i.listen(c=>{let m=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.current,m),n.current=!0});else if(a!=null)a.listen(c=>{let m=Object.assign({dataSource:c.model,dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.current,m),n.current=!0});else{let c=Object.assign({dataSourceFilter:e.dataSourceFilter},e.options);o.current=e.createChart(r.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&&(pe(()=>{n.current&&e.data!=null&&o.current&&o.current.load({data:e.data})},[e.data]),pe(()=>{n.current&&e.url!=null&&o.current&&o.current.load({url:e.url})},[e.url]),pe(()=>{n.current&&e.pivot!=null&&o.current&&o.current.pivot&&o.current.pivot(e.pivot)},[e.pivot]),pe(()=>{n.current&&e.dataSourceFilter!=null&&o.current&&o.current.setDataSourceFilter&&o.current.setDataSourceFilter(e.dataSourceFilter)},[e.dataSourceFilter])),wo.createElement("div",{ref:r,style:l,className:`${e.className\|\|""}`})}function Ap(e){let r=Object.assign({createChart:(t,n)=>new Vo(t,n)},e);return j(r)}function wp(e){let r=Object.assign({createChart:(t,n)=>new Mo(t,n)},e);return j(r)}function Vp(e){let r=Object.assign({createChart:(t,n)=>new Io(t,n)},e);return j(r)}function Mp(e){let r=Object.assign({createChart:(t,n)=>new Bo(t,n)},e);return j(r)}function Ip(e){let r=Object.assign({createChart:(t,n)=>new Uo(t,n)},e);return j(r)}function Bp(e){let r=Object.assign({createChart:(t,n)=>new jo(t,n)},e);return j(r)}function Up(e){let r=Object.assign({createChart:(t,n)=>new Go(t,n)},e);return j(r)}function jp(e){let r=Object.assign({createChart:(t,n)=>new ko(t,n)},e);return j(r)}function Gp(e){let r=Object.assign({createChart:(t,n)=>new Lo(t,n)},e);return j(r)}function kp(e){let r=Object.assign({createChart:(t,n)=>new Fo(t,n)},e);return e.interactive!=null&&(r.options.interactive=e.interactive),e.pivot!=null&&(r.options.pivot=e.pivot),e.csvData&&(r.options.csvData=e.csvData),e.jsonData&&(r.options.jsonData=e.jsonData),j(r)}import{log as zo}from"@visuallyjs/browser-ui";import Ho,{useContext as Wo,useEffect as Jo,useRef as It}from"react";function Bt(e){let r=It(!1),t=It(null),n=Wo(D),o=e.position\|\|{x:0,y:0};function l(i){e.placement==="fixed"?i.fixElement(t.current,o,e.constraints):i.floatElement(t.current,o)}return Jo(()=>{r.current\|\|(r.current=!0,n!=null?n.listen(i=>l(i)):zo("Decorator cannot mount: no SurfaceContext from a provider found"))}),Ho.createElement("div",{ref:t},e.children)}import{log as $o,BackgroundPlugin as Yo,GeneratedGridBackground as Zo,TiledBackground as Xo,SimpleBackground as qo}from"@visuallyjs/browser-ui";import Ut,{useEffect as Ko,useRef as Qo}from"react";function ze(e){let r=Qo(!1),t=M();return Ko(()=>{if(t!=null&&!r.current){r.current=!0;try{t.addPlugin({type:Yo.type,options:e})}catch(n){$o(`WARN: BackgroundComponent could not mount background ${n}`)}}},[t]),Ut.createElement(Ut.Fragment,null)}function am(e){return ze(be({type:Zo.type},e))}function lm(e){return ze({type:qo.type,url:e.url})}function im(e){return ze(be({type:Xo.type},e))}import{useEffect as ea}from"react";import{EVENT_DATA_UPDATED as jt,EVENT_GRAPH_CLEARED as Gt}from"@visuallyjs/browser-ui";function Em(e){let r=tt();ea(()=>{if(r!=null){let t=()=>e(r);return r.bind(jt,t),r.bind(Gt,t),t(),()=>{r.unbind(jt,t),r.unbind(Gt,t)}}},[r])}import{useState as kt,useEffect as Lt}from"react";import{EVENT_ZOOM as Ft}from"@visuallyjs/browser-ui";function Sm(e){let r=M(),t=Ke(),[n,o]=kt(e),[l,i]=kt(()=>(n==null?void 0:n.getZoom())\|\|1);return Lt(()=>{if(n!=null){let a=c=>{i(c.zoom)};return n.bind(Ft,a),i(n.getZoom()),()=>{n.unbind(Ft,a)}}},[n]),Lt(()=>{r!=null&&o(r),t!=null&&o(t)},[r,t]),l}export{Yn as ATTRIBUTE_CAN_REDO,$n as ATTRIBUTE_CAN_UNDO,Ip as AreaChartComponent,ze as BackgroundComponent,wp as BarChartComponent,q as BrowserUIReactModel,jp as BubbleChartComponent,ve as CLASS_REACT_GROUP,De as CLASS_REACT_NODE,me as CLASS_REACT_OVERLAY,je as CLASS_SELECTED_MODE,Kd as ColorPickerComponent,Ap as ColumnChartComponent,Yu as ControlsComponent,mo as DEFAULT_SHAPE_HEIGHT,po as DEFAULT_SHAPE_WIDTH,Bt as DecoratorComponent,si as DiagramComponent,I as DiagramContext,up as DiagramPaletteComponent,ii as DiagramProvider,wl as EdgeTypePickerComponent,pd as ExportControlsComponent,Gp as GaugeChartComponent,am as GridBackgroundComponent,lm as ImageBackgroundComponent,Uc as InspectorComponent,fe as InspectorContext,Te as JSXWrapper,Mp as LineChartComponent,yc as MiniviewComponent,$d as PaletteComponent,mc as PaperComponent,H as PaperContext,Hl as PaperProvider,Bp as PieChartComponent,kp as SankeyChartComponent,Up as ScatterChartComponent,Ad as ShapeComponent,Sd as ShapePaletteComponent,ys as SurfaceComponent,D as SurfaceContext,Xr as SurfacePopup,El as SurfaceProvider,im as TiledImageBackgroundComponent,te as VisuallyJsContext,bi as VisuallyJsProvider,Vp as XYChartComponent,et as createDiagramRef,qe as createInspectorRef,Ne as createPaperRef,K as createRefHandler,ue as createSurfaceRef,aa as getSurfaceComponent,Xe as newInstance,Ye as registerSurface,ee as useDiagram,Ee as useInspector,Ke as usePaper,M as useSurface,tt as useVisuallyJsModel,Em as useVisuallyJsUpdate,Sm as useZoom};