@react-sigma/core - npm Package Compare versions

Comparing version 2.0.2 to 3.0.0

lib/react-sigma_core.esm.min.js

@@ -1,2 +0,2 @@
-import*as e from"react";import t,{createContext as n,useContext as a,useState as r,useEffect as s,useCallback as c,useRef as l,useMemo as o}from"react";import{isEqual as i}from"lodash";import u from"graphology";import{Sigma as d}from"sigma";const g=n(null),m=g.Provider;function h(){const e=a(g);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 f(){const{sigma:e,container:t}=h(),[n,a]=r({});return s((()=>{if(!e||!n)return;const a={};return Object.keys(n).forEach((t=>{a[t]=n[t],e.setSetting(t,n[t])})),()=>{e&&t&&t.offsetWidth>0&&t.offsetHeight>0&&Object.keys(a).forEach((t=>{e.setSetting(t,a[t])}))}}),[e,n,t]),a}const p=["clickNode","rightClickNode","downNode","enterNode","leaveNode","doubleClickNode","wheelNode","clickEdge","rightClickEdge","downEdge","enterEdge","leaveEdge","doubleClickEdge","wheelEdge","clickStage","rightClickStage","downStage","doubleClickStage","wheelStage","kill"],E=["click","rightClick","mouseup","mousedown","mousemove","doubleClick","wheel"],b=["mouseup","mousedown","mousemove"],w=["cameraUpdated"];function C(){const e=v(),t=f(),[n,a]=r({});return s((()=>{if(!e||!n)return;const a=Object.keys(n),r={},s={},c=e.getSettings();return a.some((e=>["clickEdge","rightClickEdge","doubleClickEdge","downEdge"].includes(e)))&&!1===c.enableEdgeClickEvents&&(r.enableEdgeClickEvents=!0,s.enableEdgeClickEvents=!1),a.some((e=>["enterEdge","leaveEdge"].includes(e)))&&!1===c.enableEdgeHoverEvents&&(r.enableEdgeHoverEvents=!0,s.enableEdgeHoverEvents=!1),a.some((e=>["wheelEdge"].includes(e)))&&!1===c.enableEdgeWheelEvents&&(r.enableEdgeWheelEvents=!0,s.enableEdgeWheelEvents=!1),Object.keys(r).length>0&&t(r),a.forEach((t=>{const a=n[t];p.includes(t)&&e.on(t,a),E.includes(t)&&e.getMouseCaptor().on(t,a),b.includes(t)&&e.getTouchCaptor().on(t,a),w.includes(t)&&e.getCamera().on("updated",a)})),()=>{let a;if(Object.keys(s).length>0&&t(s),e)for(a in n){const t=n[a];p.includes(a)&&e.removeListener(a,t),E.includes(a)&&e.getMouseCaptor().removeListener(a,t),b.includes(a)&&e.getTouchCaptor().removeListener(a,t),w.includes(a)&&e.getCamera().removeListener("updated",t)}}}),[e,n,t]),a}function _(){const e=v();return c(((t,n=!0)=>{e&&t&&(n&&e.getGraph().order>0&&e.getGraph().clear(),e.getGraph().import(t),e.refresh())}),[e])}function y(e){const t=v(),n=l();i(n.current,e)||(n.current=e);const a=c((e=>{t.getCamera().animatedZoom(Object.assign(Object.assign({},n.current),e))}),[t,n]),r=c((e=>{t.getCamera().animatedUnzoom(Object.assign(Object.assign({},n.current),e))}),[t,n]),s=c((e=>{t.getCamera().animatedReset(Object.assign(Object.assign({},n.current),e))}),[t,n]),o=c(((e,a)=>{t.getCamera().animate(e,Object.assign(Object.assign({},n.current),a))}),[t,n]),u=c(((e,a)=>{const r=t.getNodeDisplayData(e);r?t.getCamera().animate(r,Object.assign(Object.assign({},n.current),a)):console.log(`Node ${e} not found`)}),[t,n]);return{zoomIn:a,zoomOut:r,reset:s,goto:o,gotoNode:u}}function O(){const{container:e}=h(),[t,n]=r(!1),a=()=>n((e=>!e));return s((()=>(document.addEventListener("fullscreenchange",a),()=>document.removeEventListener("fullscreenchange",a))),[a]),{toggle:c((()=>{var t;t=e,document.fullscreenElement!==t?t.requestFullscreen():document.exitFullscreen&&document.exitFullscreen()}),[e]),isFullScreen:t}}const j=({graph:e,id:n,className:a,style:c,initialSettings:g,children:h})=>{const v=l(null),f=l(null),p={className:`react-sigma ${a||""}`,id:n,style:c},[E,b]=r(null),w=l();i(w.current,g)||(w.current=g),s((()=>{let t=null;if(null!==f.current){const n=e?"function"==typeof e?new e:e:new u;t=new d(n,f.current,w.current)}return b(t),()=>{t&&t.kill(),b(null)}}),[f,e,w]);const C=o((()=>E&&v.current?{sigma:E,container:v.current}:null),[E,v.current]),_=null!==C?t.createElement(m,{value:C},h):null;return t.createElement("div",Object.assign({},p,{ref:v}),t.createElement("div",{className:"sigma-container",ref:f}),_)},k=({id:e,className:n,style:a,children:r,position:s="bottom-left"})=>{const c={className:`react-sigma-controls ${n||""} ${s}`,id:e,style:a};return t.createElement("div",Object.assign({},c),r)};var x;function N(){return N=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},N.apply(this,arguments)}var S,z=function(t){return e.createElement("svg",N({"aria-hidden":"true","data-prefix":"fas","data-icon":"plus",className:"plus-solid_svg__svg-inline--fa plus-solid_svg__fa-plus plus-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),x||(x=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-32z"})))};function H(){return H=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},H.apply(this,arguments)}var M,$=function(t){return e.createElement("svg",H({"aria-hidden":"true","data-prefix":"fas","data-icon":"minus",className:"minus-solid_svg__svg-inline--fa minus-solid_svg__fa-minus minus-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),S||(S=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-32z"})))};function F(){return F=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},F.apply(this,arguments)}var L=function(t){return e.createElement("svg",F({"aria-hidden":"true","data-prefix":"far","data-icon":"dot-circle",className:"dot-circle-regular_svg__svg-inline--fa dot-circle-regular_svg__fa-dot-circle dot-circle-regular_svg__fa-w-16",xmlns:"http://www.w3.org/2000/svg",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 8zm0 168c-44.183 0-80 35.817-80 80s35.817 80 80 80 80-35.817 80-80-35.817-80-80-80z"})))};const V=({className:e,style:n,animationDuration:a=200,children:r})=>{const{zoomIn:s,zoomOut:c,reset:l}=y({duration:a,factor:1.5}),o={style:n,className:`react-sigma-control ${e||""}`};return t.createElement(t.Fragment,null,t.createElement("div",Object.assign({},o),t.createElement("button",{onClick:()=>s(),title:"Zoom In"},r?r[0]:t.createElement(z,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},o),t.createElement("button",{onClick:()=>c(),title:"Zoom Out"},r?r[1]:t.createElement($,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},o),t.createElement("button",{onClick:()=>l(),title:"See whole graph"},r?r[2]:t.createElement(L,{style:{width:"1em"}}))))};var G;function P(){return P=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},P.apply(this,arguments)}var B,W=function(t){return e.createElement("svg",P({"aria-hidden":"true","data-prefix":"fas","data-icon":"expand",className:"expand-solid_svg__svg-inline--fa expand-solid_svg__fa-expand expand-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),G||(G=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-12zM288 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 12zm148 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-12zM160 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-12z"})))};function Z(){return Z=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},Z.apply(this,arguments)}var D=function(t){return e.createElement("svg",Z({"aria-hidden":"true","data-prefix":"fas","data-icon":"compress",className:"compress-solid_svg__svg-inline--fa compress-solid_svg__fa-compress compress-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),B||(B=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 12zm-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-24zm0 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-12zm192 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-12z"})))};const I=({id:e,className:n,style:a,children:r})=>{const{isFullScreen:s,toggle:c}=O(),l={className:`react-sigma-control ${n||""}`,id:e,style:a};return document.fullscreenEnabled?t.createElement("div",Object.assign({},l),t.createElement("button",{onClick:c,title:s?"Exit fullscreen":"Enter fullscreen"},r&&!s&&r[0],r&&s&&r[1],!r&&!s&&t.createElement(W,{style:{width:"1em"}}),!r&&s&&t.createElement(D,{style:{width:"1em"}}))):null},R=({id:e,className:n,style:a})=>{const c=v(),{gotoNode:l}=y(),[o,i]=r(""),[u,d]=r([]),[g,m]=r(null),[h,f]=r("");s((()=>{f(`search-${Math.random().toString(36).slice(2)}`)}),[]),s((()=>{const e=[];!g&&o.length>1&&c.getGraph().forEachNode(((t,n)=>{n.label&&n.label.toLowerCase().includes(o.toLowerCase())&&e.push({id:t,label:n.label})})),d(e)}),[o]),s((()=>{if(g)return c.getGraph().setNodeAttribute(g,"highlighted",!0),l(g),()=>{c.getGraph().setNodeAttribute(g,"highlighted",!1)}}),[g]);const p={className:`react-sigma-search ${n||""}`,id:e,style:a};return t.createElement("div",Object.assign({},p),t.createElement("label",{htmlFor:h,style:{display:"none"}},"Search a node"),t.createElement("input",{id:h,type:"text",placeholder:"Search...",list:`${h}-datalist`,value:o,onChange:e=>{const t=e.target.value,n=u.find((e=>e.label===t));n?(i(n.label),d([]),m(n.id)):(m(null),i(t))}}),t.createElement("datalist",{id:`${h}-datalist`},u.map((e=>t.createElement("option",{key:e.id,value:e.label},e.label)))))};export{k as ControlsContainer,I as FullScreenControl,R as SearchControl,j as SigmaContainer,g as SigmaContext,m as SigmaProvider,V as ZoomControl,y as useCamera,O as useFullScreen,_ as useLoadGraph,C as useRegisterEvents,f as useSetSettings,v as useSigma,h as useSigmaContext};
+import*as e from"react";import t,{createContext as n,useContext as a,useState as r,useEffect as s,useCallback as c,useRef as l,useMemo as o}from"react";import{isEqual as i}from"lodash";import u from"graphology";import{Sigma as d}from"sigma";const g=n(null),m=g.Provider;function h(){const e=a(g);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 f(){const{sigma:e,container:t}=h(),[n,a]=r({});return s((()=>{if(!e||!n)return;const a={};return Object.keys(n).forEach((t=>{a[t]=n[t],e.setSetting(t,n[t])})),()=>{e&&t&&t.offsetWidth>0&&t.offsetHeight>0&&Object.keys(a).forEach((t=>{e.setSetting(t,a[t])}))}}),[e,n,t]),a}const p=["clickNode","rightClickNode","downNode","enterNode","leaveNode","doubleClickNode","wheelNode","clickEdge","rightClickEdge","downEdge","enterEdge","leaveEdge","doubleClickEdge","wheelEdge","clickStage","rightClickStage","downStage","doubleClickStage","wheelStage","kill"],E=["click","rightClick","mouseup","mousedown","mousemove","doubleClick","wheel"],b=["touchup","touchdown","touchmove"],w=["updated"];function C(){const e=v(),t=f(),[n,a]=r({});return s((()=>{if(!e||!n)return;const a=Object.keys(n),r={},s={},c=e.getSettings();return a.some((e=>["clickEdge","rightClickEdge","doubleClickEdge","downEdge"].includes(e)))&&!1===c.enableEdgeClickEvents&&(r.enableEdgeClickEvents=!0,s.enableEdgeClickEvents=!1),a.some((e=>["enterEdge","leaveEdge"].includes(e)))&&!1===c.enableEdgeHoverEvents&&(r.enableEdgeHoverEvents=!0,s.enableEdgeHoverEvents=!1),a.some((e=>["wheelEdge"].includes(e)))&&!1===c.enableEdgeWheelEvents&&(r.enableEdgeWheelEvents=!0,s.enableEdgeWheelEvents=!1),Object.keys(r).length>0&&t(r),a.forEach((t=>{const a=n[t];p.find((e=>e===t))&&e.on(t,a),E.find((e=>e===t))&&e.getMouseCaptor().on(t,a),b.find((e=>e===t))&&e.getTouchCaptor().on(t,a),w.find((e=>e===t))&&e.getCamera().on(t,a)})),()=>{let a;if(Object.keys(s).length>0&&t(s),e)for(a in n){const t=n[a];a in p&&e.removeListener(a,t),a in E&&e.getMouseCaptor().removeListener(a,t),a in b&&e.getTouchCaptor().removeListener(a,t),a in w&&e.getCamera().removeListener(a,t)}}}),[e,n,t]),a}function O(){const e=v();return c(((t,n=!0)=>{e&&t&&(n&&e.getGraph().order>0&&e.getGraph().clear(),e.getGraph().import(t),e.refresh())}),[e])}function _(e){const t=v(),n=l();i(n.current,e)||(n.current=e);const a=c((e=>{t.getCamera().animatedZoom(Object.assign(Object.assign({},n.current),e))}),[t,n]),r=c((e=>{t.getCamera().animatedUnzoom(Object.assign(Object.assign({},n.current),e))}),[t,n]),s=c((e=>{t.getCamera().animatedReset(Object.assign(Object.assign({},n.current),e))}),[t,n]),o=c(((e,a)=>{t.getCamera().animate(e,Object.assign(Object.assign({},n.current),a))}),[t,n]),u=c(((e,a)=>{const r=t.getNodeDisplayData(e);r?t.getCamera().animate(r,Object.assign(Object.assign({},n.current),a)):console.log(`Node ${e} not found`)}),[t,n]);return{zoomIn:a,zoomOut:r,reset:s,goto:o,gotoNode:u}}function y(){const{container:e}=h(),[t,n]=r(!1),a=()=>n((e=>!e));return s((()=>(document.addEventListener("fullscreenchange",a),()=>document.removeEventListener("fullscreenchange",a))),[a]),{toggle:c((()=>{var t;t=e,document.fullscreenElement!==t?t.requestFullscreen():document.exitFullscreen&&document.exitFullscreen()}),[e]),isFullScreen:t}}const j=({graph:e,id:n,className:a,style:c,settings:g,children:h})=>{const v=l(null),f=l(null),p={className:`react-sigma ${a||""}`,id:n,style:c},[E,b]=r(null),w=l({});i(w.current,g)||(w.current=g||{}),s((()=>{let t=null;if(null!==f.current){const n=e?"function"==typeof e?new e:e:new u;t=new d(n,f.current,Object.assign({allowInvalidContainer:!0},w.current))}return b(t),()=>{t&&t.kill(),b(null)}}),[f,e,w]);const C=o((()=>E&&v.current?{sigma:E,container:v.current}:null),[E,v.current]),O=null!==C?t.createElement(m,{value:C},h):null;return t.createElement("div",Object.assign({},p,{ref:v}),t.createElement("div",{className:"sigma-container",ref:f}),O)},k=({id:e,className:n,style:a,children:r,position:s="bottom-left"})=>{const c={className:`react-sigma-controls ${n||""} ${s}`,id:e,style:a};return t.createElement("div",Object.assign({},c),r)};var x;function N(){return N=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},N.apply(this,arguments)}var S,z=function(t){return e.createElement("svg",N({"aria-hidden":"true","data-prefix":"fas","data-icon":"plus",className:"plus-solid_svg__svg-inline--fa plus-solid_svg__fa-plus plus-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),x||(x=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-32z"})))};function H(){return H=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},H.apply(this,arguments)}var M,$=function(t){return e.createElement("svg",H({"aria-hidden":"true","data-prefix":"fas","data-icon":"minus",className:"minus-solid_svg__svg-inline--fa minus-solid_svg__fa-minus minus-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),S||(S=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-32z"})))};function F(){return F=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},F.apply(this,arguments)}var L=function(t){return e.createElement("svg",F({"aria-hidden":"true","data-prefix":"far","data-icon":"dot-circle",className:"dot-circle-regular_svg__svg-inline--fa dot-circle-regular_svg__fa-dot-circle dot-circle-regular_svg__fa-w-16",xmlns:"http://www.w3.org/2000/svg",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 8zm0 168c-44.183 0-80 35.817-80 80s35.817 80 80 80 80-35.817 80-80-35.817-80-80-80z"})))};const V=({className:e,style:n,animationDuration:a=200,children:r})=>{const{zoomIn:s,zoomOut:c,reset:l}=_({duration:a,factor:1.5}),o={style:n,className:`react-sigma-control ${e||""}`};return t.createElement(t.Fragment,null,t.createElement("div",Object.assign({},o),t.createElement("button",{onClick:()=>s(),title:"Zoom In"},r?r[0]:t.createElement(z,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},o),t.createElement("button",{onClick:()=>c(),title:"Zoom Out"},r?r[1]:t.createElement($,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},o),t.createElement("button",{onClick:()=>l(),title:"See whole graph"},r?r[2]:t.createElement(L,{style:{width:"1em"}}))))};var G;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 a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},P.apply(this,arguments)}var B,I=function(t){return e.createElement("svg",P({"aria-hidden":"true","data-prefix":"fas","data-icon":"expand",className:"expand-solid_svg__svg-inline--fa expand-solid_svg__fa-expand expand-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),G||(G=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-12zM288 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 12zm148 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-12zM160 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-12z"})))};function W(){return W=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},W.apply(this,arguments)}var Z=function(t){return e.createElement("svg",W({"aria-hidden":"true","data-prefix":"fas","data-icon":"compress",className:"compress-solid_svg__svg-inline--fa compress-solid_svg__fa-compress compress-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},t),B||(B=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 12zm-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-24zm0 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-12zm192 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-12z"})))};const D=({id:e,className:n,style:a,children:r})=>{const{isFullScreen:s,toggle:c}=y(),l={className:`react-sigma-control ${n||""}`,id:e,style:a};return document.fullscreenEnabled?t.createElement("div",Object.assign({},l),t.createElement("button",{onClick:c,title:s?"Exit fullscreen":"Enter fullscreen"},r&&!s&&r[0],r&&s&&r[1],!r&&!s&&t.createElement(I,{style:{width:"1em"}}),!r&&s&&t.createElement(Z,{style:{width:"1em"}}))):null},R=({id:e,className:n,style:a})=>{const c=v(),l=C(),{gotoNode:o}=_(),[i,u]=r(""),[d,g]=r([]),[m,h]=r(null),[f,p]=r("");s((()=>{p(`search-${Math.random().toString(36).slice(2)}`)}),[]),s((()=>{const e=[];!m&&i.length>1&&c.getGraph().forEachNode(((t,n)=>{n.label&&n.label.toLowerCase().includes(i.toLowerCase())&&e.push({id:t,label:n.label})})),g(e)}),[i]),s((()=>{l({clickStage:()=>{h(null),u("")}})}),[l]),s((()=>{if(m)return c.getGraph().setNodeAttribute(m,"highlighted",!0),o(m),()=>{c.getGraph().setNodeAttribute(m,"highlighted",!1)}}),[m]);const E={className:`react-sigma-search ${n||""}`,id:e,style:a};return t.createElement("div",Object.assign({},E),t.createElement("label",{htmlFor:f,style:{display:"none"}},"Search a node"),t.createElement("input",{id:f,type:"text",placeholder:"Search...",list:`${f}-datalist`,value:i,onChange:e=>{const t=e.target.value,n=d.find((e=>e.label===t));n?(u(n.label),g([]),h(n.id)):(h(null),u(t))}}),t.createElement("datalist",{id:`${f}-datalist`},d.map((e=>t.createElement("option",{key:e.id,value:e.label},e.label)))))};export{k as ControlsContainer,D as FullScreenControl,R as SearchControl,j as SigmaContainer,g as SigmaContext,m as SigmaProvider,V as ZoomControl,_ as useCamera,y as useFullScreen,O as useLoadGraph,C as useRegisterEvents,f as useSetSettings,v as useSigma,h as useSigmaContext};
 //# sourceMappingURL=react-sigma_core.esm.min.js.map

lib/react-sigma_core.umd.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("lodash"),require("graphology"),require("sigma")):"function"==typeof define&&define.amd?define(["exports","react","lodash","graphology","sigma"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@react-sigma/core"]={},e.React,e.lodash,e.Graph,e.sigma)}(this,(function(e,t,n,a,r){"use strict";function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=l(t),s=function(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var a=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,a.get?a:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}(t),o=l(a);const i=t.createContext(null),u=i.Provider;function d(){const e=t.useContext(i);if(null==e)throw new Error("No context provided: useSigmaContext() can only be used in a descendant of <SigmaContainer>");return e}function g(){return d().sigma}function f(){const{sigma:e,container:n}=d(),[a,r]=t.useState({});return t.useEffect((()=>{if(!e||!a)return;const t={};return Object.keys(a).forEach((n=>{t[n]=a[n],e.setSetting(n,a[n])})),()=>{e&&n&&n.offsetWidth>0&&n.offsetHeight>0&&Object.keys(t).forEach((n=>{e.setSetting(n,t[n])}))}}),[e,a,n]),r}const m=["clickNode","rightClickNode","downNode","enterNode","leaveNode","doubleClickNode","wheelNode","clickEdge","rightClickEdge","downEdge","enterEdge","leaveEdge","doubleClickEdge","wheelEdge","clickStage","rightClickStage","downStage","doubleClickStage","wheelStage","kill"],h=["click","rightClick","mouseup","mousedown","mousemove","doubleClick","wheel"],v=["mouseup","mousedown","mousemove"],p=["cameraUpdated"];function E(e){const a=g(),r=t.useRef();n.isEqual(r.current,e)||(r.current=e);const l=t.useCallback((e=>{a.getCamera().animatedZoom(Object.assign(Object.assign({},r.current),e))}),[a,r]),c=t.useCallback((e=>{a.getCamera().animatedUnzoom(Object.assign(Object.assign({},r.current),e))}),[a,r]),s=t.useCallback((e=>{a.getCamera().animatedReset(Object.assign(Object.assign({},r.current),e))}),[a,r]),o=t.useCallback(((e,t)=>{a.getCamera().animate(e,Object.assign(Object.assign({},r.current),t))}),[a,r]),i=t.useCallback(((e,t)=>{const n=a.getNodeDisplayData(e);n?a.getCamera().animate(n,Object.assign(Object.assign({},r.current),t)):console.log(`Node ${e} not found`)}),[a,r]);return{zoomIn:l,zoomOut:c,reset:s,goto:o,gotoNode:i}}function b(){const{container:e}=d(),[n,a]=t.useState(!1),r=()=>a((e=>!e));return t.useEffect((()=>(document.addEventListener("fullscreenchange",r),()=>document.removeEventListener("fullscreenchange",r))),[r]),{toggle:t.useCallback((()=>{var t;t=e,document.fullscreenElement!==t?t.requestFullscreen():document.exitFullscreen&&document.exitFullscreen()}),[e]),isFullScreen:n}}var w;function C(){return C=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},C.apply(this,arguments)}var y,_=function(e){return s.createElement("svg",C({"aria-hidden":"true","data-prefix":"fas","data-icon":"plus",className:"plus-solid_svg__svg-inline--fa plus-solid_svg__fa-plus plus-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},e),w||(w=s.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-32z"})))};function O(){return O=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},O.apply(this,arguments)}var j,k=function(e){return s.createElement("svg",O({"aria-hidden":"true","data-prefix":"fas","data-icon":"minus",className:"minus-solid_svg__svg-inline--fa minus-solid_svg__fa-minus minus-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},e),y||(y=s.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-32z"})))};function S(){return S=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},S.apply(this,arguments)}var x,N=function(e){return s.createElement("svg",S({"aria-hidden":"true","data-prefix":"far","data-icon":"dot-circle",className:"dot-circle-regular_svg__svg-inline--fa dot-circle-regular_svg__fa-dot-circle dot-circle-regular_svg__fa-w-16",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",width:"1em",height:"1em"},e),j||(j=s.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 8zm0 168c-44.183 0-80 35.817-80 80s35.817 80 80 80 80-35.817 80-80-35.817-80-80-80z"})))};function z(){return z=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},z.apply(this,arguments)}var H,M=function(e){return s.createElement("svg",z({"aria-hidden":"true","data-prefix":"fas","data-icon":"expand",className:"expand-solid_svg__svg-inline--fa expand-solid_svg__fa-expand expand-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},e),x||(x=s.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-12zM288 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 12zm148 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-12zM160 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-12z"})))};function P(){return P=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},P.apply(this,arguments)}var $=function(e){return s.createElement("svg",P({"aria-hidden":"true","data-prefix":"fas","data-icon":"compress",className:"compress-solid_svg__svg-inline--fa compress-solid_svg__fa-compress compress-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},e),H||(H=s.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 12zm-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-24zm0 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-12zm192 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-12z"})))};e.ControlsContainer=({id:e,className:t,style:n,children:a,position:r="bottom-left"})=>{const l={className:`react-sigma-controls ${t||""} ${r}`,id:e,style:n};return c.default.createElement("div",Object.assign({},l),a)},e.FullScreenControl=({id:e,className:t,style:n,children:a})=>{const{isFullScreen:r,toggle:l}=b(),s={className:`react-sigma-control ${t||""}`,id:e,style:n};return document.fullscreenEnabled?c.default.createElement("div",Object.assign({},s),c.default.createElement("button",{onClick:l,title:r?"Exit fullscreen":"Enter fullscreen"},a&&!r&&a[0],a&&r&&a[1],!a&&!r&&c.default.createElement(M,{style:{width:"1em"}}),!a&&r&&c.default.createElement($,{style:{width:"1em"}}))):null},e.SearchControl=({id:e,className:n,style:a})=>{const r=g(),{gotoNode:l}=E(),[s,o]=t.useState(""),[i,u]=t.useState([]),[d,f]=t.useState(null),[m,h]=t.useState("");t.useEffect((()=>{h(`search-${Math.random().toString(36).slice(2)}`)}),[]),t.useEffect((()=>{const e=[];!d&&s.length>1&&r.getGraph().forEachNode(((t,n)=>{n.label&&n.label.toLowerCase().includes(s.toLowerCase())&&e.push({id:t,label:n.label})})),u(e)}),[s]),t.useEffect((()=>{if(d)return r.getGraph().setNodeAttribute(d,"highlighted",!0),l(d),()=>{r.getGraph().setNodeAttribute(d,"highlighted",!1)}}),[d]);const v={className:`react-sigma-search ${n||""}`,id:e,style:a};return c.default.createElement("div",Object.assign({},v),c.default.createElement("label",{htmlFor:m,style:{display:"none"}},"Search a node"),c.default.createElement("input",{id:m,type:"text",placeholder:"Search...",list:`${m}-datalist`,value:s,onChange:e=>{const t=e.target.value,n=i.find((e=>e.label===t));n?(o(n.label),u([]),f(n.id)):(f(null),o(t))}}),c.default.createElement("datalist",{id:`${m}-datalist`},i.map((e=>c.default.createElement("option",{key:e.id,value:e.label},e.label)))))},e.SigmaContainer=({graph:e,id:a,className:l,style:s,initialSettings:i,children:d})=>{const g=t.useRef(null),f=t.useRef(null),m={className:`react-sigma ${l||""}`,id:a,style:s},[h,v]=t.useState(null),p=t.useRef();n.isEqual(p.current,i)||(p.current=i),t.useEffect((()=>{let t=null;if(null!==f.current){const n=e?"function"==typeof e?new e:e:new o.default;t=new r.Sigma(n,f.current,p.current)}return v(t),()=>{t&&t.kill(),v(null)}}),[f,e,p]);const E=t.useMemo((()=>h&&g.current?{sigma:h,container:g.current}:null),[h,g.current]),b=null!==E?c.default.createElement(u,{value:E},d):null;return c.default.createElement("div",Object.assign({},m,{ref:g}),c.default.createElement("div",{className:"sigma-container",ref:f}),b)},e.SigmaContext=i,e.SigmaProvider=u,e.ZoomControl=({className:e,style:t,animationDuration:n=200,children:a})=>{const{zoomIn:r,zoomOut:l,reset:s}=E({duration:n,factor:1.5}),o={style:t,className:`react-sigma-control ${e||""}`};return c.default.createElement(c.default.Fragment,null,c.default.createElement("div",Object.assign({},o),c.default.createElement("button",{onClick:()=>r(),title:"Zoom In"},a?a[0]:c.default.createElement(_,{style:{width:"1em"}}))),c.default.createElement("div",Object.assign({},o),c.default.createElement("button",{onClick:()=>l(),title:"Zoom Out"},a?a[1]:c.default.createElement(k,{style:{width:"1em"}}))),c.default.createElement("div",Object.assign({},o),c.default.createElement("button",{onClick:()=>s(),title:"See whole graph"},a?a[2]:c.default.createElement(N,{style:{width:"1em"}}))))},e.useCamera=E,e.useFullScreen=b,e.useLoadGraph=function(){const e=g();return t.useCallback(((t,n=!0)=>{e&&t&&(n&&e.getGraph().order>0&&e.getGraph().clear(),e.getGraph().import(t),e.refresh())}),[e])},e.useRegisterEvents=function(){const e=g(),n=f(),[a,r]=t.useState({});return t.useEffect((()=>{if(!e||!a)return;const t=Object.keys(a),r={},l={},c=e.getSettings();return t.some((e=>["clickEdge","rightClickEdge","doubleClickEdge","downEdge"].includes(e)))&&!1===c.enableEdgeClickEvents&&(r.enableEdgeClickEvents=!0,l.enableEdgeClickEvents=!1),t.some((e=>["enterEdge","leaveEdge"].includes(e)))&&!1===c.enableEdgeHoverEvents&&(r.enableEdgeHoverEvents=!0,l.enableEdgeHoverEvents=!1),t.some((e=>["wheelEdge"].includes(e)))&&!1===c.enableEdgeWheelEvents&&(r.enableEdgeWheelEvents=!0,l.enableEdgeWheelEvents=!1),Object.keys(r).length>0&&n(r),t.forEach((t=>{const n=a[t];m.includes(t)&&e.on(t,n),h.includes(t)&&e.getMouseCaptor().on(t,n),v.includes(t)&&e.getTouchCaptor().on(t,n),p.includes(t)&&e.getCamera().on("updated",n)})),()=>{let t;if(Object.keys(l).length>0&&n(l),e)for(t in a){const n=a[t];m.includes(t)&&e.removeListener(t,n),h.includes(t)&&e.getMouseCaptor().removeListener(t,n),v.includes(t)&&e.getTouchCaptor().removeListener(t,n),p.includes(t)&&e.getCamera().removeListener("updated",n)}}}),[e,a,n]),r},e.useSetSettings=f,e.useSigma=g,e.useSigmaContext=d,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("lodash"),require("graphology"),require("sigma")):"function"==typeof define&&define.amd?define(["exports","react","lodash","graphology","sigma"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@react-sigma/core"]={},e.React,e.lodash,e.Graph,e.sigma)}(this,(function(e,t,n,a,r){"use strict";function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=l(t),s=function(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var a=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,a.get?a:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}(t),i=l(a);const o=t.createContext(null),u=o.Provider;function d(){const e=t.useContext(o);if(null==e)throw new Error("No context provided: useSigmaContext() can only be used in a descendant of <SigmaContainer>");return e}function g(){return d().sigma}function f(){const{sigma:e,container:n}=d(),[a,r]=t.useState({});return t.useEffect((()=>{if(!e||!a)return;const t={};return Object.keys(a).forEach((n=>{t[n]=a[n],e.setSetting(n,a[n])})),()=>{e&&n&&n.offsetWidth>0&&n.offsetHeight>0&&Object.keys(t).forEach((n=>{e.setSetting(n,t[n])}))}}),[e,a,n]),r}const m=["clickNode","rightClickNode","downNode","enterNode","leaveNode","doubleClickNode","wheelNode","clickEdge","rightClickEdge","downEdge","enterEdge","leaveEdge","doubleClickEdge","wheelEdge","clickStage","rightClickStage","downStage","doubleClickStage","wheelStage","kill"],h=["click","rightClick","mouseup","mousedown","mousemove","doubleClick","wheel"],v=["touchup","touchdown","touchmove"],p=["updated"];function b(){const e=g(),n=f(),[a,r]=t.useState({});return t.useEffect((()=>{if(!e||!a)return;const t=Object.keys(a),r={},l={},c=e.getSettings();return t.some((e=>["clickEdge","rightClickEdge","doubleClickEdge","downEdge"].includes(e)))&&!1===c.enableEdgeClickEvents&&(r.enableEdgeClickEvents=!0,l.enableEdgeClickEvents=!1),t.some((e=>["enterEdge","leaveEdge"].includes(e)))&&!1===c.enableEdgeHoverEvents&&(r.enableEdgeHoverEvents=!0,l.enableEdgeHoverEvents=!1),t.some((e=>["wheelEdge"].includes(e)))&&!1===c.enableEdgeWheelEvents&&(r.enableEdgeWheelEvents=!0,l.enableEdgeWheelEvents=!1),Object.keys(r).length>0&&n(r),t.forEach((t=>{const n=a[t];m.find((e=>e===t))&&e.on(t,n),h.find((e=>e===t))&&e.getMouseCaptor().on(t,n),v.find((e=>e===t))&&e.getTouchCaptor().on(t,n),p.find((e=>e===t))&&e.getCamera().on(t,n)})),()=>{let t;if(Object.keys(l).length>0&&n(l),e)for(t in a){const n=a[t];t in m&&e.removeListener(t,n),t in h&&e.getMouseCaptor().removeListener(t,n),t in v&&e.getTouchCaptor().removeListener(t,n),t in p&&e.getCamera().removeListener(t,n)}}}),[e,a,n]),r}function E(e){const a=g(),r=t.useRef();n.isEqual(r.current,e)||(r.current=e);const l=t.useCallback((e=>{a.getCamera().animatedZoom(Object.assign(Object.assign({},r.current),e))}),[a,r]),c=t.useCallback((e=>{a.getCamera().animatedUnzoom(Object.assign(Object.assign({},r.current),e))}),[a,r]),s=t.useCallback((e=>{a.getCamera().animatedReset(Object.assign(Object.assign({},r.current),e))}),[a,r]),i=t.useCallback(((e,t)=>{a.getCamera().animate(e,Object.assign(Object.assign({},r.current),t))}),[a,r]),o=t.useCallback(((e,t)=>{const n=a.getNodeDisplayData(e);n?a.getCamera().animate(n,Object.assign(Object.assign({},r.current),t)):console.log(`Node ${e} not found`)}),[a,r]);return{zoomIn:l,zoomOut:c,reset:s,goto:i,gotoNode:o}}function w(){const{container:e}=d(),[n,a]=t.useState(!1),r=()=>a((e=>!e));return t.useEffect((()=>(document.addEventListener("fullscreenchange",r),()=>document.removeEventListener("fullscreenchange",r))),[r]),{toggle:t.useCallback((()=>{var t;t=e,document.fullscreenElement!==t?t.requestFullscreen():document.exitFullscreen&&document.exitFullscreen()}),[e]),isFullScreen:n}}var C;function y(){return y=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},y.apply(this,arguments)}var O,_=function(e){return s.createElement("svg",y({"aria-hidden":"true","data-prefix":"fas","data-icon":"plus",className:"plus-solid_svg__svg-inline--fa plus-solid_svg__fa-plus plus-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},e),C||(C=s.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-32z"})))};function j(){return j=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},j.apply(this,arguments)}var k,S=function(e){return s.createElement("svg",j({"aria-hidden":"true","data-prefix":"fas","data-icon":"minus",className:"minus-solid_svg__svg-inline--fa minus-solid_svg__fa-minus minus-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},e),O||(O=s.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-32z"})))};function x(){return x=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},x.apply(this,arguments)}var N,z=function(e){return s.createElement("svg",x({"aria-hidden":"true","data-prefix":"far","data-icon":"dot-circle",className:"dot-circle-regular_svg__svg-inline--fa dot-circle-regular_svg__fa-dot-circle dot-circle-regular_svg__fa-w-16",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",width:"1em",height:"1em"},e),k||(k=s.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 8zm0 168c-44.183 0-80 35.817-80 80s35.817 80 80 80 80-35.817 80-80-35.817-80-80-80z"})))};function H(){return H=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},H.apply(this,arguments)}var M,P=function(e){return s.createElement("svg",H({"aria-hidden":"true","data-prefix":"fas","data-icon":"expand",className:"expand-solid_svg__svg-inline--fa expand-solid_svg__fa-expand expand-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},e),N||(N=s.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-12zM288 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 12zm148 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-12zM160 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-12z"})))};function $(){return $=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},$.apply(this,arguments)}var F=function(e){return s.createElement("svg",$({"aria-hidden":"true","data-prefix":"fas","data-icon":"compress",className:"compress-solid_svg__svg-inline--fa compress-solid_svg__fa-compress compress-solid_svg__fa-w-14",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:"1em",height:"1em"},e),M||(M=s.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 12zm-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-24zm0 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-12zm192 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-12z"})))};e.ControlsContainer=({id:e,className:t,style:n,children:a,position:r="bottom-left"})=>{const l={className:`react-sigma-controls ${t||""} ${r}`,id:e,style:n};return c.default.createElement("div",Object.assign({},l),a)},e.FullScreenControl=({id:e,className:t,style:n,children:a})=>{const{isFullScreen:r,toggle:l}=w(),s={className:`react-sigma-control ${t||""}`,id:e,style:n};return document.fullscreenEnabled?c.default.createElement("div",Object.assign({},s),c.default.createElement("button",{onClick:l,title:r?"Exit fullscreen":"Enter fullscreen"},a&&!r&&a[0],a&&r&&a[1],!a&&!r&&c.default.createElement(P,{style:{width:"1em"}}),!a&&r&&c.default.createElement(F,{style:{width:"1em"}}))):null},e.SearchControl=({id:e,className:n,style:a})=>{const r=g(),l=b(),{gotoNode:s}=E(),[i,o]=t.useState(""),[u,d]=t.useState([]),[f,m]=t.useState(null),[h,v]=t.useState("");t.useEffect((()=>{v(`search-${Math.random().toString(36).slice(2)}`)}),[]),t.useEffect((()=>{const e=[];!f&&i.length>1&&r.getGraph().forEachNode(((t,n)=>{n.label&&n.label.toLowerCase().includes(i.toLowerCase())&&e.push({id:t,label:n.label})})),d(e)}),[i]),t.useEffect((()=>{l({clickStage:()=>{m(null),o("")}})}),[l]),t.useEffect((()=>{if(f)return r.getGraph().setNodeAttribute(f,"highlighted",!0),s(f),()=>{r.getGraph().setNodeAttribute(f,"highlighted",!1)}}),[f]);const p={className:`react-sigma-search ${n||""}`,id:e,style:a};return c.default.createElement("div",Object.assign({},p),c.default.createElement("label",{htmlFor:h,style:{display:"none"}},"Search a node"),c.default.createElement("input",{id:h,type:"text",placeholder:"Search...",list:`${h}-datalist`,value:i,onChange:e=>{const t=e.target.value,n=u.find((e=>e.label===t));n?(o(n.label),d([]),m(n.id)):(m(null),o(t))}}),c.default.createElement("datalist",{id:`${h}-datalist`},u.map((e=>c.default.createElement("option",{key:e.id,value:e.label},e.label)))))},e.SigmaContainer=({graph:e,id:a,className:l,style:s,settings:o,children:d})=>{const g=t.useRef(null),f=t.useRef(null),m={className:`react-sigma ${l||""}`,id:a,style:s},[h,v]=t.useState(null),p=t.useRef({});n.isEqual(p.current,o)||(p.current=o||{}),t.useEffect((()=>{let t=null;if(null!==f.current){const n=e?"function"==typeof e?new e:e:new i.default;t=new r.Sigma(n,f.current,Object.assign({allowInvalidContainer:!0},p.current))}return v(t),()=>{t&&t.kill(),v(null)}}),[f,e,p]);const b=t.useMemo((()=>h&&g.current?{sigma:h,container:g.current}:null),[h,g.current]),E=null!==b?c.default.createElement(u,{value:b},d):null;return c.default.createElement("div",Object.assign({},m,{ref:g}),c.default.createElement("div",{className:"sigma-container",ref:f}),E)},e.SigmaContext=o,e.SigmaProvider=u,e.ZoomControl=({className:e,style:t,animationDuration:n=200,children:a})=>{const{zoomIn:r,zoomOut:l,reset:s}=E({duration:n,factor:1.5}),i={style:t,className:`react-sigma-control ${e||""}`};return c.default.createElement(c.default.Fragment,null,c.default.createElement("div",Object.assign({},i),c.default.createElement("button",{onClick:()=>r(),title:"Zoom In"},a?a[0]:c.default.createElement(_,{style:{width:"1em"}}))),c.default.createElement("div",Object.assign({},i),c.default.createElement("button",{onClick:()=>l(),title:"Zoom Out"},a?a[1]:c.default.createElement(S,{style:{width:"1em"}}))),c.default.createElement("div",Object.assign({},i),c.default.createElement("button",{onClick:()=>s(),title:"See whole graph"},a?a[2]:c.default.createElement(z,{style:{width:"1em"}}))))},e.useCamera=E,e.useFullScreen=w,e.useLoadGraph=function(){const e=g();return t.useCallback(((t,n=!0)=>{e&&t&&(n&&e.getGraph().order>0&&e.getGraph().clear(),e.getGraph().import(t),e.refresh())}),[e])},e.useRegisterEvents=b,e.useSetSettings=f,e.useSigma=g,e.useSigmaContext=d,Object.defineProperty(e,"__esModule",{value:!0})}));
 //# sourceMappingURL=react-sigma_core.umd.min.js.map

package.json

 {
   "name": "@react-sigma/core",
-  "version": "2.0.2",
+  "version": "3.0.0",
   "private": false,
@@ -23,3 +23,3 @@ "description": "React Sigma",
   "module": "./lib/react-sigma_core.esm.min.js",
-  "typings": "./lib/types",
+  "typings": "./lib/index.d.ts",
   "exports": {
@@ -30,6 +30,8 @@ ".": "./lib/react-sigma_core.esm.min.js",
   "scripts": {
-    "clean": "rimraf lib/* tsconfig.tsbuildinfo .rollup.cache",
-    "compile": "rollup -c",
-    "build": "npm run clean && npm run compile",
-    "start": "rollup -c -w"
+    "clean": "rimraf lib tsconfig.tsbuildinfo .rollup.cache",
+    "lint": "esw --ext .ts ./src",
+    "compile": "tsc -b",
+    "assets": "copyfiles -u 1 src/assets/** src/assets/**/* lib/",
+    "build": "npm run lint && npm run compile && npm run assets && rollup -c",
+    "start": "nodemon --watch src -e ts,tsx,css --exec npm run build"
   },
@@ -41,15 +43,16 @@ "publishConfig": {
   "devDependencies": {
-    "@types/node": "^16.11.25",
-    "@types/react": "^17.0.39",
-    "@types/react-dom": "^17.0.11",
+    "@types/node": "^18.7.18",
+    "@types/react": "^18.0.9",
+    "@types/react-dom": "^18.0.5",
     "copyfiles": "^2.4.1",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
   },
   "peerDependencies": {
-    "graphology": "^0.24.1",
+    "graphology": "^0.25.0",
     "lodash": "^4.17.21",
-    "sigma": "^2.2.0"
+    "react": "^17.0.0 || ^18.0.0",
+    "sigma": "^2.3.1"
   },
-  "gitHead": "96417cef53be0e99199a59615e9e9ed6723ddf7d"
+  "gitHead": "5b4c6d2ab9c4d5dbf70b5108f678ee3f6f22ed17"
 }

README.md

@@ -23,2 +23,3 @@ # React Sigma - core module
    Example : `import "@react-sigma/core/lib/react-sigma.min.css"`
+
 3. Create the following components into your app and check it displays correctly:
@@ -25,0 +26,0 @@

src/hooks/useRegisterEvents.ts

 import { useEffect, useState } from "react";
 import { Settings } from "sigma/settings";
+import { SigmaEvents } from "sigma/sigma";
+import { TouchCaptorEvents } from "sigma/core/captors/touch";
+import { MouseCaptorEvents } from "sigma/core/captors/mouse";
+import { CameraEvents } from "sigma/core/camera";
 
@@ -10,3 +14,3 @@ import { useSigma } from "./useSigma";
 
-const sigmaEvents: Array<EventType> = [
+const sigmaEvents: Array<keyof SigmaEvents> = [
   "clickNode",
@@ -33,3 +37,3 @@ "rightClickNode",
 ];
-const mouseEvents: Array<EventType> = [
+const mouseEvents: Array<keyof MouseCaptorEvents> = [
   "click",
@@ -43,4 +47,4 @@ "rightClick",
 ];
-const touchEvents: Array<EventType> = ["mouseup", "mousedown", "mousemove"];
-const cameraEvents: Array<EventType> = ["cameraUpdated"];
+const touchEvents: Array<keyof TouchCaptorEvents> = ["touchup", "touchdown", "touchmove"];
+const cameraEvents: Array<keyof CameraEvents> = ["updated"];
 
@@ -101,17 +105,15 @@ /**
       const eventHandler = eventHandlers[event] as (...args: unknown[]) => void;
-      if (sigmaEvents.includes(event)) {
-        //eslint-disable-next-line @typescript-eslint/no-explicit-any
-        sigma.on(event as any, eventHandler);
+      if (sigmaEvents.find((e) => e === event)) {
+        sigma.on(event as keyof SigmaEvents, eventHandler);
       }
-      if (mouseEvents.includes(event)) {
+      if (mouseEvents.find((e) => e === event)) {
         //eslint-disable-next-line @typescript-eslint/no-explicit-any
-        sigma.getMouseCaptor().on(event as any, eventHandler);
+        sigma.getMouseCaptor().on(event as keyof MouseCaptorEvents, eventHandler);
       }
-      if (touchEvents.includes(event)) {
+      if (touchEvents.find((e) => e === event)) {
         //eslint-disable-next-line @typescript-eslint/no-explicit-any
-        sigma.getTouchCaptor().on(event as any, eventHandler);
+        sigma.getTouchCaptor().on(event as keyof TouchCaptorEvents, eventHandler);
       }
-      if (cameraEvents.includes(event)) {
-        // For now there is only one event on the camera
-        sigma.getCamera().on("updated", eventHandler);
+      if (cameraEvents.find((e) => e === event)) {
+        sigma.getCamera().on(event as keyof CameraEvents, eventHandler);
       }
@@ -133,14 +135,13 @@ });
           const eventHandler = eventHandlers[event] as (...args: unknown[]) => void;
-          if (sigmaEvents.includes(event)) {
-            sigma.removeListener(event as any, eventHandler);
+          if (event in sigmaEvents) {
+            sigma.removeListener(event as keyof SigmaEvents, eventHandler);
           }
-          if (mouseEvents.includes(event)) {
-            sigma.getMouseCaptor().removeListener(event as any, eventHandler);
+          if (event in mouseEvents) {
+            sigma.getMouseCaptor().removeListener(event as keyof MouseCaptorEvents, eventHandler);
           }
-          if (touchEvents.includes(event)) {
-            sigma.getTouchCaptor().removeListener(event as any, eventHandler);
+          if (event in touchEvents) {
+            sigma.getTouchCaptor().removeListener(event as keyof TouchCaptorEvents, eventHandler);
           }
-          if (cameraEvents.includes(event)) {
-            // For now there is only one event on the camera
-            sigma.getCamera().removeListener("updated", eventHandler);
+          if (event in cameraEvents) {
+            sigma.getCamera().removeListener(event as keyof CameraEvents, eventHandler);
           }
@@ -147,0 +148,0 @@ }

src/index.ts

@@ -6,3 +6,5 @@ /**
  */
+
 import "./assets/index.css";
+
 export * from "./hooks/context";
@@ -9,0 +11,0 @@ export * from "./hooks/useSigma";

src/types.ts

@@ -1,165 +0,9 @@
-import { CameraState, MouseCoords, TouchCoords, WheelCoords } from "sigma/types";
+import { SigmaEvents } from "sigma/sigma";
+import { TouchCaptorEvents } from "sigma/core/captors/touch";
+import { MouseCaptorEvents } from "sigma/core/captors/mouse";
+import { CameraEvents } from "sigma/core/camera";
 
-export interface MouseEvent {
-  event: MouseCoords;
-  preventSigmaDefault: () => void;
-}
-
-export interface TouchEvent {
-  event: TouchCoords;
-}
-
-export interface NodeEvent {
-  node: string;
-}
-
-export interface WheelEvent {
-  event: WheelCoords;
-  preventSigmaDefault: () => void;
-}
-
-export interface EdgeEvent {
-  edge: string;
-}
-
-export type MouseNodeEvent = MouseEvent & NodeEvent;
-export type WheelNodeEvent = WheelEvent & NodeEvent;
-
-export type MouseEdgeEvent = MouseEvent & EdgeEvent;
-export type WheelEdgeEvent = WheelEvent & EdgeEvent;
-
 /**
  * Sigma's events
  */
-export interface EventHandlers {
-  /**
-   * Trigger when the user click on a node
-   */
-  clickNode: (e: MouseNodeEvent) => void;
-  /**
-   * Trigger when the user right click on a node
-   */
-  rightClickNode: (e: MouseNodeEvent) => void;
-  /**
-   * Trigger when the user click/tap on a node
-   */
-  downNode: (e: MouseNodeEvent) => void;
-  /**
-   * Trigger when the user double click node a node.with the mouse
-   */
-  doubleClickNode: (e: MouseNodeEvent) => void;
-  /**
-   * Trigger when the user wheel node a node.with the mouse
-   */
-  wheelNode: (e: WheelNodeEvent) => void;
-  /**
-   * Trigger when the user enter a node with the mouse
-   */
-  enterNode: (e: NodeEvent) => void;
-  /**
-   * Trigger when the user leave a node.with the mouse
-   */
-  leaveNode: (e: NodeEvent) => void;
-
-  /**
-   * Trigger when the user click on a edge
-   */
-  clickEdge: (e: MouseEdgeEvent) => void;
-  /**
-   * Trigger when the user right click on a edge
-   */
-  rightClickEdge: (e: MouseEdgeEvent) => void;
-  /**
-   * Trigger when the user click/tap on a edge
-   */
-  downEdge: (e: MouseEdgeEvent) => void;
-  /**
-   * Trigger when the user double click edge a edge.with the mouse
-   */
-  doubleClickEdge: (e: MouseEdgeEvent) => void;
-  /**
-   * Trigger when the user wheel edge a edge.with the mouse
-   */
-  wheelEdge: (e: WheelEdgeEvent) => void;
-  /**
-   * Trigger when the user enter a edge with the mouse
-   */
-  enterEdge: (e: EdgeEvent) => void;
-  /**
-   * Trigger when the user leave a edge.with the mouse
-   */
-  leaveEdge: (e: EdgeEvent) => void;
-
-  /**
-   * Trigger when the user click on the background
-   */
-  clickStage: (e: MouseEvent) => void;
-  /**
-   * Trigger when the user right click on the background
-   */
-  rightClickStage: (e: MouseEvent) => void;
-  /**
-   * Trigger when the user double click on the background
-   */
-  doubleClickStage: (e: MouseEvent) => void;
-  /**
-   * Trigger when the user do a mouse wheel on the background
-   */
-  wheelStage: (e: WheelEvent) => void;
-  /**
-   * Trigger when the user click/tap on the background
-   */
-  downStage: (e: MouseEvent) => void;
-
-  /**
-   * Trigger on mouse click
-   */
-  click: (e: MouseCoords) => void;
-  /**
-   * Trigger on mouse double click
-   */
-  doubleClick: (e: MouseCoords) => void;
-  /**
-   * Trigger on mouse wheel
-   */
-  wheel: (e: WheelCoords) => void;
-  /**
-   * Trigger on mouse right click
-   */
-  rightClick: (e: MouseCoords) => void;
-  /**
-   * Trigger on mouse up
-   */
-  mouseup: (e: MouseCoords) => void;
-  /**
-   * Trigger on mouse down
-   */
-  mousedown: (e: MouseCoords) => void;
-  /**
-   * Trigger on mouse move
-   */
-  mousemove: (e: MouseCoords) => void;
-
-  /**
-   * Trigger on touch up
-   */
-  touchup: (e: TouchCoords) => void;
-  /**
-   * Trigger on touch down
-   */
-  touchdown: (e: TouchCoords) => void;
-  /**
-   * Trigger on touch move
-   */
-  touchmove: (e: TouchCoords) => void;
-
-  /**
-   * Trigger when sigma is killed
-   */
-  kill: () => void;
-
-  /**
-   * Trigger when the sigma's camera changes
-   */
-  cameraUpdated: (e: CameraState) => void;
-}
+export type EventHandlers = SigmaEvents & TouchCaptorEvents & MouseCaptorEvents & CameraEvents;

tsconfig.json

 {
-  "extends": "./../../tsconfig.base.json",
-  "include": ["./src"],
+  "extends": "../../tsconfig.json",
+  "compileOnSave": true,
+  "include": ["./src/**/*.ts"],
   "compilerOptions": {
-    "composite": true,
-    "declarationDir": "./types",
+    "rootDir": "./src",
     "outDir": "./lib",
-    "rootDir": "./src"
+    "declarationDir": "./lib"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

45

increased by2.27%

Worsened metrics

Total package byte prevSize

140632

decreased by-36.35%

Dependency count

4

increased by33.33%

Number of package files

82

decreased by-12.77%

Lines of code

1719

decreased by-7.38%

No dependency changes