@react-sigma/core
Version:
React Sigma
3 lines (2 loc) • 10.3 kB
JavaScript
import*as e from"react";import t,{createContext as n,useContext as r,useCallback as a,useState as c,useEffect as o,forwardRef as s,useRef as l,useImperativeHandle as i,useMemo as u}from"react";import m from"graphology";import{Sigma as g}from"sigma";const d=n(null),f=d.Provider;function h(){const e=r(d);if(null==e)throw new Error("No context provided: useSigmaContext() can only be used in a descendant of <SigmaContainer>");return e}function v(){return h().sigma}function p(){const{sigma:e}=h();return a((t=>{e&&Object.keys(t).forEach((n=>{e.setSetting(n,t[n])}))}),[e])}function w(e){return new Set(Object.keys(e))}const b=w({clickNode:!0,rightClickNode:!0,downNode:!0,enterNode:!0,leaveNode:!0,doubleClickNode:!0,wheelNode:!0,clickEdge:!0,rightClickEdge:!0,downEdge:!0,enterEdge:!0,leaveEdge:!0,doubleClickEdge:!0,wheelEdge:!0,clickStage:!0,rightClickStage:!0,downStage:!0,doubleClickStage:!0,wheelStage:!0,beforeRender:!0,afterRender:!0,kill:!0,upStage:!0,upEdge:!0,upNode:!0,enterStage:!0,leaveStage:!0,resize:!0,afterClear:!0,afterProcess:!0,beforeClear:!0,beforeProcess:!0,moveBody:!0}),E=w({click:!0,rightClick:!0,doubleClick:!0,mouseup:!0,mousedown:!0,mousemove:!0,mousemovebody:!0,mouseleave:!0,mouseenter:!0,wheel:!0}),_=w({touchup:!0,touchdown:!0,touchmove:!0,touchmovebody:!0,tap:!0,doubletap:!0}),O=w({updated:!0});function y(){const e=v(),t=p(),[n,r]=c({});return o((()=>{if(!e||!n)return;const t=n,r=Object.keys(t);return r.forEach((n=>{const r=t[n];b.has(n)&&e.on(n,r),E.has(n)&&e.getMouseCaptor().on(n,r),_.has(n)&&e.getTouchCaptor().on(n,r),O.has(n)&&e.getCamera().on(n,r)})),()=>{e&&r.forEach((n=>{const r=t[n];b.has(n)&&e.off(n,r),E.has(n)&&e.getMouseCaptor().off(n,r),_.has(n)&&e.getTouchCaptor().off(n,r),O.has(n)&&e.getCamera().off(n,r)}))}}),[e,n,t]),r}function C(){const e=v();return a(((t,n=!0)=>{e&&t&&(n&&e.getGraph().order>0&&e.getGraph().clear(),e.getGraph().import(t),e.refresh())}),[e])}function j(e,t){if(e===t)return!0;if("object"==typeof e&&null!=e&&"object"==typeof t&&null!=t){if(Object.keys(e).length!=Object.keys(t).length)return!1;for(const n in e){if(!Object.hasOwn(t,n))return!1;if(!j(e[n],t[n]))return!1}return!0}return!1}function x(e,t){let n;return r=>new Promise((a=>{n&&clearTimeout(n),n=setTimeout((()=>{a(e(r))}),t)}))}function N(e){const t=v(),[n,r]=c(e||{});o((()=>{r((t=>j(t,e||{})?t:e||{}))}),[e]);const s=a((e=>{t.getCamera().animatedZoom(Object.assign(Object.assign({},n),e))}),[t,n]),l=a((e=>{t.getCamera().animatedUnzoom(Object.assign(Object.assign({},n),e))}),[t,n]),i=a((e=>{t.getCamera().animatedReset(Object.assign(Object.assign({},n),e))}),[t,n]),u=a(((e,r)=>{t.getCamera().animate(e,Object.assign(Object.assign({},n),r))}),[t,n]),m=a(((e,r)=>{const a=t.getNodeDisplayData(e);a?t.getCamera().animate(a,Object.assign(Object.assign({},n),r)):console.warn(`Node ${e} not found`)}),[t,n]);return{zoomIn:s,zoomOut:l,reset:i,goto:u,gotoNode:m}}function k(e){const t=h(),[n,r]=c(!1),[s,l]=c(e||t.container),i=a((()=>r((e=>!e))),[]);o((()=>(document.addEventListener("fullscreenchange",i),()=>document.removeEventListener("fullscreenchange",i))),[i]),o((()=>{l(e||t.container)}),[e,t.container]);return{toggle:a((()=>{var e;e=s,document.fullscreenElement!==e?e.requestFullscreen():document.exitFullscreen&&document.exitFullscreen()}),[s]),isFullScreen:n}}const S=s((({graph:e,id:n,className:r,style:a,settings:s={},children:d},h)=>{const v=l(null),p=l(null),w={className:`react-sigma ${r||""}`,id:n,style:a},[b,E]=c(null),[_,O]=c(s);o((()=>{O((e=>j(e,s)?e:s))}),[s]),o((()=>{E((t=>{let n=null;if(null!==p.current){let r=new m;e&&(r="function"==typeof e?new e:e);let a=null;t&&(a=t.getCamera().getState(),t.kill()),n=new g(r,p.current,_),a&&n.getCamera().setState(a)}return n}))}),[p,e,_]),i(h,(()=>b),[b]);const y=u((()=>b&&v.current?{sigma:b,container:v.current}:null),[b,v]),C=null!==y?t.createElement(f,{value:y},d):null;return t.createElement("div",Object.assign({},w,{ref:v}),t.createElement("div",{className:"sigma-container",ref:p}),C)}));const H=({id:e,className:n,style:r,children:a,position:c="bottom-left"})=>{const o={className:`react-sigma-controls ${n||""} ${c}`,id:e,style:r};return t.createElement("div",Object.assign({},o),a)};var M;function P(){return P=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},P.apply(null,arguments)}var z,V=function(t){return e.createElement("svg",P({xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",className:"dot-circle-regular_svg__svg-inline--fa dot-circle-regular_svg__fa-dot-circle dot-circle-regular_svg__fa-w-16","data-icon":"dot-circle","data-prefix":"far",viewBox:"0 0 512 512",width:"1em",height:"1em"},t),M||(M=e.createElement("path",{fill:"currentColor",d:"M256 56c110.532 0 200 89.451 200 200 0 110.532-89.451 200-200 200-110.532 0-200-89.451-200-200 0-110.532 89.451-200 200-200m0-48C119.033 8 8 119.033 8 256s111.033 248 248 248 248-111.033 248-248S392.967 8 256 8m0 168c-44.183 0-80 35.817-80 80s35.817 80 80 80 80-35.817 80-80-35.817-80-80-80"})))};function B(){return B=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},B.apply(null,arguments)}var F,$=function(t){return e.createElement("svg",B({xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",className:"minus-solid_svg__svg-inline--fa minus-solid_svg__fa-minus minus-solid_svg__fa-w-14","data-icon":"minus","data-prefix":"fas",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),z||(z=e.createElement("path",{fill:"currentColor",d:"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32"})))};function I(){return I=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},I.apply(null,arguments)}var T=function(t){return e.createElement("svg",I({xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",className:"plus-solid_svg__svg-inline--fa plus-solid_svg__fa-plus plus-solid_svg__fa-w-14","data-icon":"plus","data-prefix":"fas",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),F||(F=e.createElement("path",{fill:"currentColor",d:"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32"})))};const D=({className:e,style:n,animationDuration:r=200,children:a,labels:c={}})=>{const{zoomIn:o,zoomOut:s,reset:l}=N({duration:r,factor:1.5}),i={style:n,className:`react-sigma-control ${e||""}`};return t.createElement(t.Fragment,null,t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:()=>o(),title:c.zoomIn||"Zoom In"},a?a[0]:t.createElement(T,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:()=>s(),title:c.zoomOut||"Zoom Out"},a?a[1]:t.createElement($,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:()=>l(),title:c.reset||"See whole graph"},a?a[2]:t.createElement(V,{style:{width:"1em"}}))))};var G;function R(){return R=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},R.apply(null,arguments)}var Z,L=function(t){return e.createElement("svg",R({xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",className:"compress-solid_svg__svg-inline--fa compress-solid_svg__fa-compress compress-solid_svg__fa-w-14","data-icon":"compress","data-prefix":"fas",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),G||(G=e.createElement("path",{fill:"currentColor",d:"M436 192H312c-13.3 0-24-10.7-24-24V44c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v84h84c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12m-276-24V44c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v84H12c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24m0 300V344c0-13.3-10.7-24-24-24H12c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12m192 0v-84h84c6.6 0 12-5.4 12-12v-40c0-6.6-5.4-12-12-12H312c-13.3 0-24 10.7-24 24v124c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12"})))};function q(){return q=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},q.apply(null,arguments)}var U=function(t){return e.createElement("svg",q({xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",className:"expand-solid_svg__svg-inline--fa expand-solid_svg__fa-expand expand-solid_svg__fa-w-14","data-icon":"expand","data-prefix":"fas",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),Z||(Z=e.createElement("path",{fill:"currentColor",d:"M0 180V56c0-13.3 10.7-24 24-24h124c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H64v84c0 6.6-5.4 12-12 12H12c-6.6 0-12-5.4-12-12M288 44v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12V56c0-13.3-10.7-24-24-24H300c-6.6 0-12 5.4-12 12m148 276h-40c-6.6 0-12 5.4-12 12v84h-84c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24V332c0-6.6-5.4-12-12-12M160 468v-40c0-6.6-5.4-12-12-12H64v-84c0-6.6-5.4-12-12-12H12c-6.6 0-12 5.4-12 12v124c0 13.3 10.7 24 24 24h124c6.6 0 12-5.4 12-12"})))};const A=({id:e,className:n,style:r,container:a,children:c,labels:o={}})=>{const{isFullScreen:s,toggle:l}=k(null==a?void 0:a.current),i={className:`react-sigma-control ${n||""}`,id:e,style:r};return document.fullscreenEnabled?t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:l,title:s?o.exit||"Exit fullscreen":o.enter||"Enter fullscreen"},c&&!s&&c[0],c&&s&&c[1],!c&&!s&&t.createElement(U,{style:{width:"1em"}}),!c&&s&&t.createElement(L,{style:{width:"1em"}}))):null};export{H as ControlsContainer,A as FullScreenControl,S as SigmaContainer,d as SigmaContext,f as SigmaProvider,D as ZoomControl,x as debounce,j as isEqual,N as useCamera,k as useFullScreen,C as useLoadGraph,y as useRegisterEvents,p as useSetSettings,v as useSigma,h as useSigmaContext};
//# sourceMappingURL=react-sigma_core.esm.min.js.map