@react-sigma/core - npm Package Compare versions

Comparing version 3.2.0 to 3.3.0

lib/components/controls/FullScreenControl.d.ts

@@ -1,2 +0,2 @@
-import React, { CSSProperties } from "react";
+import React, { CSSProperties, RefObject } from "react";
 declare type FullScreenLabelKeys = "enter" | "exit";
@@ -7,2 +7,3 @@ export interface FullScreenControlProps {
     style?: CSSProperties;
+    container?: RefObject<HTMLElement>;
     children?: [JSX.Element, JSX.Element];
@@ -9,0 +10,0 @@ labels?: {

lib/components/controls/FullScreenControl.js

@@ -9,4 +9,4 @@ "use strict";
 const useFullScreen_1 = require("../../hooks/useFullScreen");
-const FullScreenControl = ({ id, className, style, children, labels = {}, }) => {
-    const { isFullScreen, toggle } = (0, useFullScreen_1.useFullScreen)();
+const FullScreenControl = ({ id, className, style, container, children, labels = {}, }) => {
+    const { isFullScreen, toggle } = (0, useFullScreen_1.useFullScreen)(container === null || container === void 0 ? void 0 : container.current);
     const htmlProps = {
@@ -13,0 +13,0 @@ className: `react-sigma-control ${className || ""}`,

lib/hooks/useFullScreen.d.ts

@@ -1,4 +0,4 @@
-export declare function useFullScreen(): {
+export declare function useFullScreen(container?: HTMLElement | null): {
     toggle: () => void;
     isFullScreen: boolean;
 };

lib/hooks/useFullScreen.js

@@ -16,6 +16,7 @@ "use strict";
 }
-function useFullScreen() {
-    const { container } = (0, context_1.useSigmaContext)();
+function useFullScreen(container) {
+    const context = (0, context_1.useSigmaContext)();
     const [isFullScreen, setFullScreen] = (0, react_1.useState)(false);
-    const toggleState = () => setFullScreen(v => !v);
+    const [element, setElement] = (0, react_1.useState)(container ? container : context.container);
+    const toggleState = () => setFullScreen((v) => !v);
     (0, react_1.useEffect)(() => {
@@ -25,5 +26,8 @@ document.addEventListener("fullscreenchange", toggleState);
     }, [toggleState]);
+    (0, react_1.useEffect)(() => {
+        setElement(container || context.container);
+    }, [container, context.container]);
     const toggle = (0, react_1.useCallback)(() => {
-        toggleFullScreen(container);
-    }, [container]);
+        toggleFullScreen(element);
+    }, [element]);
     return {
@@ -30,0 +34,0 @@ toggle,

lib/hooks/useRegisterEvents.js

@@ -27,2 +27,4 @@ "use strict";
     "wheelStage",
+    "beforeRender",
+    "afterRender",
     "kill",
@@ -29,0 +31,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,forwardRef as o,useImperativeHandle as i,useMemo as d}from"react";import{isEqual as u}from"lodash";import g from"graphology";import{Sigma as m}from"sigma";const h=n(null),v=h.Provider;function f(){const e=a(h);if(null==e)throw new Error("No context provided: useSigmaContext() can only be used in a descendant of <SigmaContainer>");return e}function p(){return f().sigma}function b(){const{sigma:e,container:t}=f(),[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 E=["clickNode","rightClickNode","downNode","enterNode","leaveNode","doubleClickNode","wheelNode","clickEdge","rightClickEdge","downEdge","enterEdge","leaveEdge","doubleClickEdge","wheelEdge","clickStage","rightClickStage","downStage","doubleClickStage","wheelStage","kill"],w=["click","rightClick","mouseup","mousedown","mousemove","mousemovebody","doubleClick","wheel"],C=["touchup","touchdown","touchmove"],O=["updated"];function _(){const e=p(),t=b(),[n,a]=r({});return s((()=>{if(!e||!n)return;const a=n,r=Object.keys(a),s={},c={},l=e.getSettings();return r.some((e=>["clickEdge","rightClickEdge","doubleClickEdge","downEdge"].includes(e)))&&!1===l.enableEdgeClickEvents&&(s.enableEdgeClickEvents=!0,c.enableEdgeClickEvents=!1),r.some((e=>["enterEdge","leaveEdge"].includes(e)))&&!1===l.enableEdgeHoverEvents&&(s.enableEdgeHoverEvents=!0,c.enableEdgeHoverEvents=!1),r.some((e=>["wheelEdge"].includes(e)))&&!1===l.enableEdgeWheelEvents&&(s.enableEdgeWheelEvents=!0,c.enableEdgeWheelEvents=!1),Object.keys(s).length>0&&t(s),r.forEach((t=>{const n=a[t];E.find((e=>e===t))&&e.on(t,n),w.find((e=>e===t))&&e.getMouseCaptor().on(t,n),C.find((e=>e===t))&&e.getTouchCaptor().on(t,n),O.find((e=>e===t))&&e.getCamera().on(t,n)})),()=>{Object.keys(c).length>0&&t(c),e&&r.forEach((t=>{const n=a[t];E.find((e=>e===t))&&e.off(t,n),w.find((e=>e===t))&&e.getMouseCaptor().off(t,n),C.find((e=>e===t))&&e.getTouchCaptor().off(t,n),O.find((e=>e===t))&&e.getCamera().off(t,n)}))}}),[e,n,t]),a}function y(){const e=p();return c(((t,n=!0)=>{e&&t&&(n&&e.getGraph().order>0&&e.getGraph().clear(),e.getGraph().import(t),e.refresh())}),[e])}function j(e){const t=p(),n=l();u(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]),i=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:i}}function x(){const{container:e}=f(),[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 k=o((({graph:e,id:n,className:a,style:c,settings:o,children:h},f)=>{const p=l(null),b=l(null),E={className:`react-sigma ${a||""}`,id:n,style:c},[w,C]=r(null),O=l({});u(O.current,o)||(O.current=o||{}),s((()=>{let t=null;if(null!==b.current){const n=e?"function"==typeof e?new e:e:new g;t=new m(n,b.current,Object.assign({allowInvalidContainer:!0},O.current))}return C(t),()=>{t&&t.kill(),C(null)}}),[b,e,O]),i(f,(()=>w),[w]);const _=d((()=>w&&p.current?{sigma:w,container:p.current}:null),[w,p.current]),y=null!==_?t.createElement(v,{value:_},h):null;return t.createElement("div",Object.assign({},E,{ref:p}),t.createElement("div",{className:"sigma-container",ref:b}),y)})),N=({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 S;function z(){return z=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},z.apply(this,arguments)}var H,M=function(t){return e.createElement("svg",z({"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),S||(S=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 $(){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,V=function(t){return e.createElement("svg",$({"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),H||(H=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 G(){return G=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},G.apply(this,arguments)}var P=function(t){return e.createElement("svg",G({"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),F||(F=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 I=({className:e,style:n,animationDuration:a=200,children:r,labels:s={}})=>{const{zoomIn:c,zoomOut:l,reset:o}=j({duration:a,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:()=>c(),title:s.zoomIn||"Zoom In"},r?r[0]:t.createElement(M,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:()=>l(),title:s.zoomOut||"Zoom Out"},r?r[1]:t.createElement(V,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:()=>o(),title:s.reset||"See whole graph"},r?r[2]:t.createElement(P,{style:{width:"1em"}}))))};var B;function L(){return L=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},L.apply(this,arguments)}var R,W=function(t){return e.createElement("svg",L({"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),B||(B=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?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},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),R||(R=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 q=({id:e,className:n,style:a,children:r,labels:s={}})=>{const{isFullScreen:c,toggle:l}=x(),o={className:`react-sigma-control ${n||""}`,id:e,style:a};return document.fullscreenEnabled?t.createElement("div",Object.assign({},o),t.createElement("button",{onClick:l,title:c?s.exit||"Exit fullscreen":s.enter||"Enter fullscreen"},r&&!c&&r[0],r&&c&&r[1],!r&&!c&&t.createElement(W,{style:{width:"1em"}}),!r&&c&&t.createElement(D,{style:{width:"1em"}}))):null},A=({id:e,className:n,style:a,labels:c={}})=>{const l=p(),o=_(),{gotoNode:i}=j(),[d,u]=r(""),[g,m]=r([]),[h,v]=r(null),[f,b]=r("");s((()=>{b(`search-${Math.random().toString(36).slice(2)}`)}),[]),s((()=>{const e=[];!h&&d.length>1&&l.getGraph().forEachNode(((t,n)=>{n.label&&n.label.toLowerCase().includes(d.toLowerCase())&&e.push({id:t,label:n.label})})),m(e)}),[d]),s((()=>{o({clickStage:()=>{v(null),u("")}})}),[o]),s((()=>{if(h)return l.getGraph().setNodeAttribute(h,"highlighted",!0),i(h),()=>{l.getGraph().setNodeAttribute(h,"highlighted",!1)}}),[h]);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"}},c.text||"Search a node"),t.createElement("input",{id:f,type:"text",placeholder:c.placeholder||"Search...",list:`${f}-datalist`,value:d,onChange:e=>{const t=e.target.value,n=g.find((e=>e.label===t));n?(u(n.label),m([]),v(n.id)):(v(null),u(t))}}),t.createElement("datalist",{id:`${f}-datalist`},g.map((e=>t.createElement("option",{key:e.id,value:e.label},e.label)))))};export{N as ControlsContainer,q as FullScreenControl,A as SearchControl,k as SigmaContainer,h as SigmaContext,v as SigmaProvider,I as ZoomControl,j as useCamera,x as useFullScreen,y as useLoadGraph,_ as useRegisterEvents,b as useSetSettings,p as useSigma,f 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,forwardRef as o,useImperativeHandle as i,useMemo as d}from"react";import{isEqual as u}from"lodash";import g from"graphology";import{Sigma as m}from"sigma";const h=n(null),v=h.Provider;function f(){const e=a(h);if(null==e)throw new Error("No context provided: useSigmaContext() can only be used in a descendant of <SigmaContainer>");return e}function p(){return f().sigma}function b(){const{sigma:e,container:t}=f(),[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 E=["clickNode","rightClickNode","downNode","enterNode","leaveNode","doubleClickNode","wheelNode","clickEdge","rightClickEdge","downEdge","enterEdge","leaveEdge","doubleClickEdge","wheelEdge","clickStage","rightClickStage","downStage","doubleClickStage","wheelStage","beforeRender","afterRender","kill"],w=["click","rightClick","mouseup","mousedown","mousemove","mousemovebody","doubleClick","wheel"],C=["touchup","touchdown","touchmove"],O=["updated"];function _(){const e=p(),t=b(),[n,a]=r({});return s((()=>{if(!e||!n)return;const a=n,r=Object.keys(a),s={},c={},l=e.getSettings();return r.some((e=>["clickEdge","rightClickEdge","doubleClickEdge","downEdge"].includes(e)))&&!1===l.enableEdgeClickEvents&&(s.enableEdgeClickEvents=!0,c.enableEdgeClickEvents=!1),r.some((e=>["enterEdge","leaveEdge"].includes(e)))&&!1===l.enableEdgeHoverEvents&&(s.enableEdgeHoverEvents=!0,c.enableEdgeHoverEvents=!1),r.some((e=>["wheelEdge"].includes(e)))&&!1===l.enableEdgeWheelEvents&&(s.enableEdgeWheelEvents=!0,c.enableEdgeWheelEvents=!1),Object.keys(s).length>0&&t(s),r.forEach((t=>{const n=a[t];E.find((e=>e===t))&&e.on(t,n),w.find((e=>e===t))&&e.getMouseCaptor().on(t,n),C.find((e=>e===t))&&e.getTouchCaptor().on(t,n),O.find((e=>e===t))&&e.getCamera().on(t,n)})),()=>{Object.keys(c).length>0&&t(c),e&&r.forEach((t=>{const n=a[t];E.find((e=>e===t))&&e.off(t,n),w.find((e=>e===t))&&e.getMouseCaptor().off(t,n),C.find((e=>e===t))&&e.getTouchCaptor().off(t,n),O.find((e=>e===t))&&e.getCamera().off(t,n)}))}}),[e,n,t]),a}function y(){const e=p();return c(((t,n=!0)=>{e&&t&&(n&&e.getGraph().order>0&&e.getGraph().clear(),e.getGraph().import(t),e.refresh())}),[e])}function j(e){const t=p(),n=l();u(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]),i=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:i}}function x(e){const t=f(),[n,a]=r(!1),[l,o]=r(e||t.container),i=()=>a((e=>!e));return s((()=>(document.addEventListener("fullscreenchange",i),()=>document.removeEventListener("fullscreenchange",i))),[i]),s((()=>{o(e||t.container)}),[e,t.container]),{toggle:c((()=>{var e;e=l,document.fullscreenElement!==e?e.requestFullscreen():document.exitFullscreen&&document.exitFullscreen()}),[l]),isFullScreen:n}}const k=o((({graph:e,id:n,className:a,style:c,settings:o,children:h},f)=>{const p=l(null),b=l(null),E={className:`react-sigma ${a||""}`,id:n,style:c},[w,C]=r(null),O=l({});u(O.current,o)||(O.current=o||{}),s((()=>{let t=null;if(null!==b.current){const n=e?"function"==typeof e?new e:e:new g;t=new m(n,b.current,Object.assign({allowInvalidContainer:!0},O.current))}return C(t),()=>{t&&t.kill(),C(null)}}),[b,e,O]),i(f,(()=>w),[w]);const _=d((()=>w&&p.current?{sigma:w,container:p.current}:null),[w,p.current]),y=null!==_?t.createElement(v,{value:_},h):null;return t.createElement("div",Object.assign({},E,{ref:p}),t.createElement("div",{className:"sigma-container",ref:b}),y)})),N=({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 S;function z(){return z=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},z.apply(this,arguments)}var H,M=function(t){return e.createElement("svg",z({"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),S||(S=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 $(){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,V=function(t){return e.createElement("svg",$({"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),H||(H=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 G(){return G=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},G.apply(this,arguments)}var P=function(t){return e.createElement("svg",G({"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),F||(F=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 I=({className:e,style:n,animationDuration:a=200,children:r,labels:s={}})=>{const{zoomIn:c,zoomOut:l,reset:o}=j({duration:a,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:()=>c(),title:s.zoomIn||"Zoom In"},r?r[0]:t.createElement(M,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:()=>l(),title:s.zoomOut||"Zoom Out"},r?r[1]:t.createElement(V,{style:{width:"1em"}}))),t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:()=>o(),title:s.reset||"See whole graph"},r?r[2]:t.createElement(P,{style:{width:"1em"}}))))};var R;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 a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},B.apply(this,arguments)}var L,W=function(t){return e.createElement("svg",B({"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),R||(R=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?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},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),L||(L=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 q=({id:e,className:n,style:a,container:r,children:s,labels:c={}})=>{const{isFullScreen:l,toggle:o}=x(null==r?void 0:r.current),i={className:`react-sigma-control ${n||""}`,id:e,style:a};return document.fullscreenEnabled?t.createElement("div",Object.assign({},i),t.createElement("button",{onClick:o,title:l?c.exit||"Exit fullscreen":c.enter||"Enter fullscreen"},s&&!l&&s[0],s&&l&&s[1],!s&&!l&&t.createElement(W,{style:{width:"1em"}}),!s&&l&&t.createElement(D,{style:{width:"1em"}}))):null},A=({id:e,className:n,style:a,labels:c={}})=>{const l=p(),o=_(),{gotoNode:i}=j(),[d,u]=r(""),[g,m]=r([]),[h,v]=r(null),[f,b]=r("");s((()=>{b(`search-${Math.random().toString(36).slice(2)}`)}),[]),s((()=>{const e=[];!h&&d.length>1&&l.getGraph().forEachNode(((t,n)=>{n.label&&n.label.toLowerCase().includes(d.toLowerCase())&&e.push({id:t,label:n.label})})),m(e)}),[d]),s((()=>{o({clickStage:()=>{v(null),u("")}})}),[o]),s((()=>{if(h)return l.getGraph().setNodeAttribute(h,"highlighted",!0),i(h),()=>{l.getGraph().setNodeAttribute(h,"highlighted",!1)}}),[h]);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"}},c.text||"Search a node"),t.createElement("input",{id:f,type:"text",placeholder:c.placeholder||"Search...",list:`${f}-datalist`,value:d,onChange:e=>{const t=e.target.value,n=g.find((e=>e.label===t));n?(u(n.label),m([]),v(n.id)):(v(null),u(t))}}),t.createElement("datalist",{id:`${f}-datalist`},g.map((e=>t.createElement("option",{key:e.id,value:e.label},e.label)))))};export{N as ControlsContainer,q as FullScreenControl,A as SearchControl,k as SigmaContainer,h as SigmaContext,v as SigmaProvider,I as ZoomControl,j as useCamera,x as useFullScreen,y as useLoadGraph,_ as useRegisterEvents,b as useSetSettings,p as useSigma,f 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","mousemovebody","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=a,r=Object.keys(t),l={},c={},s=e.getSettings();return r.some((e=>["clickEdge","rightClickEdge","doubleClickEdge","downEdge"].includes(e)))&&!1===s.enableEdgeClickEvents&&(l.enableEdgeClickEvents=!0,c.enableEdgeClickEvents=!1),r.some((e=>["enterEdge","leaveEdge"].includes(e)))&&!1===s.enableEdgeHoverEvents&&(l.enableEdgeHoverEvents=!0,c.enableEdgeHoverEvents=!1),r.some((e=>["wheelEdge"].includes(e)))&&!1===s.enableEdgeWheelEvents&&(l.enableEdgeWheelEvents=!0,c.enableEdgeWheelEvents=!1),Object.keys(l).length>0&&n(l),r.forEach((n=>{const a=t[n];m.find((e=>e===n))&&e.on(n,a),h.find((e=>e===n))&&e.getMouseCaptor().on(n,a),v.find((e=>e===n))&&e.getTouchCaptor().on(n,a),p.find((e=>e===n))&&e.getCamera().on(n,a)})),()=>{Object.keys(c).length>0&&n(c),e&&r.forEach((n=>{const a=t[n];m.find((e=>e===n))&&e.off(n,a),h.find((e=>e===n))&&e.getMouseCaptor().off(n,a),v.find((e=>e===n))&&e.getTouchCaptor().off(n,a),p.find((e=>e===n))&&e.getCamera().off(n,a)}))}}),[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]),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 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}}const C=t.forwardRef((({graph:e,id:a,className:l,style:s,settings:i,children:d},g)=>{const f=t.useRef(null),m=t.useRef(null),h={className:`react-sigma ${l||""}`,id:a,style:s},[v,p]=t.useState(null),b=t.useRef({});n.isEqual(b.current,i)||(b.current=i||{}),t.useEffect((()=>{let t=null;if(null!==m.current){const n=e?"function"==typeof e?new e:e:new o.default;t=new r.Sigma(n,m.current,Object.assign({allowInvalidContainer:!0},b.current))}return p(t),()=>{t&&t.kill(),p(null)}}),[m,e,b]),t.useImperativeHandle(g,(()=>v),[v]);const E=t.useMemo((()=>v&&f.current?{sigma:v,container:f.current}:null),[v,f.current]),w=null!==E?c.default.createElement(u,{value:E},d):null;return c.default.createElement("div",Object.assign({},h,{ref:f}),c.default.createElement("div",{className:"sigma-container",ref:m}),w)}));var y;function O(){return O=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},O.apply(this,arguments)}var _,j=function(e){return s.createElement("svg",O({"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),y||(y=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 k(){return k=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},k.apply(this,arguments)}var S,x=function(e){return s.createElement("svg",k({"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),_||(_=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 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 z,H=function(e){return s.createElement("svg",N({"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),S||(S=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 M(){return M=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},M.apply(this,arguments)}var P,$=function(e){return s.createElement("svg",M({"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),z||(z=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 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 G=function(e){return s.createElement("svg",F({"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),P||(P=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,labels:r={}})=>{const{isFullScreen:l,toggle:s}=w(),o={className:`react-sigma-control ${t||""}`,id:e,style:n};return document.fullscreenEnabled?c.default.createElement("div",Object.assign({},o),c.default.createElement("button",{onClick:s,title:l?r.exit||"Exit fullscreen":r.enter||"Enter fullscreen"},a&&!l&&a[0],a&&l&&a[1],!a&&!l&&c.default.createElement($,{style:{width:"1em"}}),!a&&l&&c.default.createElement(G,{style:{width:"1em"}}))):null},e.SearchControl=({id:e,className:n,style:a,labels:r={}})=>{const l=g(),s=b(),{gotoNode:o}=E(),[i,u]=t.useState(""),[d,f]=t.useState([]),[m,h]=t.useState(null),[v,p]=t.useState("");t.useEffect((()=>{p(`search-${Math.random().toString(36).slice(2)}`)}),[]),t.useEffect((()=>{const e=[];!m&&i.length>1&&l.getGraph().forEachNode(((t,n)=>{n.label&&n.label.toLowerCase().includes(i.toLowerCase())&&e.push({id:t,label:n.label})})),f(e)}),[i]),t.useEffect((()=>{s({clickStage:()=>{h(null),u("")}})}),[s]),t.useEffect((()=>{if(m)return l.getGraph().setNodeAttribute(m,"highlighted",!0),o(m),()=>{l.getGraph().setNodeAttribute(m,"highlighted",!1)}}),[m]);const w={className:`react-sigma-search ${n||""}`,id:e,style:a};return c.default.createElement("div",Object.assign({},w),c.default.createElement("label",{htmlFor:v,style:{display:"none"}},r.text||"Search a node"),c.default.createElement("input",{id:v,type:"text",placeholder:r.placeholder||"Search...",list:`${v}-datalist`,value:i,onChange:e=>{const t=e.target.value,n=d.find((e=>e.label===t));n?(u(n.label),f([]),h(n.id)):(h(null),u(t))}}),c.default.createElement("datalist",{id:`${v}-datalist`},d.map((e=>c.default.createElement("option",{key:e.id,value:e.label},e.label)))))},e.SigmaContainer=C,e.SigmaContext=i,e.SigmaProvider=u,e.ZoomControl=({className:e,style:t,animationDuration:n=200,children:a,labels:r={}})=>{const{zoomIn:l,zoomOut:s,reset:o}=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:()=>l(),title:r.zoomIn||"Zoom In"},a?a[0]:c.default.createElement(j,{style:{width:"1em"}}))),c.default.createElement("div",Object.assign({},i),c.default.createElement("button",{onClick:()=>s(),title:r.zoomOut||"Zoom Out"},a?a[1]:c.default.createElement(x,{style:{width:"1em"}}))),c.default.createElement("div",Object.assign({},i),c.default.createElement("button",{onClick:()=>o(),title:r.reset||"See whole graph"},a?a[2]:c.default.createElement(H,{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})}));
+!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","beforeRender","afterRender","kill"],h=["click","rightClick","mouseup","mousedown","mousemove","mousemovebody","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=a,r=Object.keys(t),l={},c={},s=e.getSettings();return r.some((e=>["clickEdge","rightClickEdge","doubleClickEdge","downEdge"].includes(e)))&&!1===s.enableEdgeClickEvents&&(l.enableEdgeClickEvents=!0,c.enableEdgeClickEvents=!1),r.some((e=>["enterEdge","leaveEdge"].includes(e)))&&!1===s.enableEdgeHoverEvents&&(l.enableEdgeHoverEvents=!0,c.enableEdgeHoverEvents=!1),r.some((e=>["wheelEdge"].includes(e)))&&!1===s.enableEdgeWheelEvents&&(l.enableEdgeWheelEvents=!0,c.enableEdgeWheelEvents=!1),Object.keys(l).length>0&&n(l),r.forEach((n=>{const a=t[n];m.find((e=>e===n))&&e.on(n,a),h.find((e=>e===n))&&e.getMouseCaptor().on(n,a),v.find((e=>e===n))&&e.getTouchCaptor().on(n,a),p.find((e=>e===n))&&e.getCamera().on(n,a)})),()=>{Object.keys(c).length>0&&n(c),e&&r.forEach((n=>{const a=t[n];m.find((e=>e===n))&&e.off(n,a),h.find((e=>e===n))&&e.getMouseCaptor().off(n,a),v.find((e=>e===n))&&e.getTouchCaptor().off(n,a),p.find((e=>e===n))&&e.getCamera().off(n,a)}))}}),[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]),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 w(e){const n=d(),[a,r]=t.useState(!1),[l,c]=t.useState(e||n.container),s=()=>r((e=>!e));return t.useEffect((()=>(document.addEventListener("fullscreenchange",s),()=>document.removeEventListener("fullscreenchange",s))),[s]),t.useEffect((()=>{c(e||n.container)}),[e,n.container]),{toggle:t.useCallback((()=>{var e;e=l,document.fullscreenElement!==e?e.requestFullscreen():document.exitFullscreen&&document.exitFullscreen()}),[l]),isFullScreen:a}}const C=t.forwardRef((({graph:e,id:a,className:l,style:s,settings:i,children:d},g)=>{const f=t.useRef(null),m=t.useRef(null),h={className:`react-sigma ${l||""}`,id:a,style:s},[v,p]=t.useState(null),b=t.useRef({});n.isEqual(b.current,i)||(b.current=i||{}),t.useEffect((()=>{let t=null;if(null!==m.current){const n=e?"function"==typeof e?new e:e:new o.default;t=new r.Sigma(n,m.current,Object.assign({allowInvalidContainer:!0},b.current))}return p(t),()=>{t&&t.kill(),p(null)}}),[m,e,b]),t.useImperativeHandle(g,(()=>v),[v]);const E=t.useMemo((()=>v&&f.current?{sigma:v,container:f.current}:null),[v,f.current]),w=null!==E?c.default.createElement(u,{value:E},d):null;return c.default.createElement("div",Object.assign({},h,{ref:f}),c.default.createElement("div",{className:"sigma-container",ref:m}),w)}));var y;function O(){return O=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},O.apply(this,arguments)}var _,j=function(e){return s.createElement("svg",O({"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),y||(y=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 k(){return k=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},k.apply(this,arguments)}var S,x=function(e){return s.createElement("svg",k({"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),_||(_=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 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 z,H=function(e){return s.createElement("svg",N({"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),S||(S=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 M(){return M=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},M.apply(this,arguments)}var P,R=function(e){return s.createElement("svg",M({"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),z||(z=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),P||(P=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,container:a,children:r,labels:l={}})=>{const{isFullScreen:s,toggle:o}=w(null==a?void 0:a.current),i={className:`react-sigma-control ${t||""}`,id:e,style:n};return document.fullscreenEnabled?c.default.createElement("div",Object.assign({},i),c.default.createElement("button",{onClick:o,title:s?l.exit||"Exit fullscreen":l.enter||"Enter fullscreen"},r&&!s&&r[0],r&&s&&r[1],!r&&!s&&c.default.createElement(R,{style:{width:"1em"}}),!r&&s&&c.default.createElement(F,{style:{width:"1em"}}))):null},e.SearchControl=({id:e,className:n,style:a,labels:r={}})=>{const l=g(),s=b(),{gotoNode:o}=E(),[i,u]=t.useState(""),[d,f]=t.useState([]),[m,h]=t.useState(null),[v,p]=t.useState("");t.useEffect((()=>{p(`search-${Math.random().toString(36).slice(2)}`)}),[]),t.useEffect((()=>{const e=[];!m&&i.length>1&&l.getGraph().forEachNode(((t,n)=>{n.label&&n.label.toLowerCase().includes(i.toLowerCase())&&e.push({id:t,label:n.label})})),f(e)}),[i]),t.useEffect((()=>{s({clickStage:()=>{h(null),u("")}})}),[s]),t.useEffect((()=>{if(m)return l.getGraph().setNodeAttribute(m,"highlighted",!0),o(m),()=>{l.getGraph().setNodeAttribute(m,"highlighted",!1)}}),[m]);const w={className:`react-sigma-search ${n||""}`,id:e,style:a};return c.default.createElement("div",Object.assign({},w),c.default.createElement("label",{htmlFor:v,style:{display:"none"}},r.text||"Search a node"),c.default.createElement("input",{id:v,type:"text",placeholder:r.placeholder||"Search...",list:`${v}-datalist`,value:i,onChange:e=>{const t=e.target.value,n=d.find((e=>e.label===t));n?(u(n.label),f([]),h(n.id)):(h(null),u(t))}}),c.default.createElement("datalist",{id:`${v}-datalist`},d.map((e=>c.default.createElement("option",{key:e.id,value:e.label},e.label)))))},e.SigmaContainer=C,e.SigmaContext=i,e.SigmaProvider=u,e.ZoomControl=({className:e,style:t,animationDuration:n=200,children:a,labels:r={}})=>{const{zoomIn:l,zoomOut:s,reset:o}=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:()=>l(),title:r.zoomIn||"Zoom In"},a?a[0]:c.default.createElement(j,{style:{width:"1em"}}))),c.default.createElement("div",Object.assign({},i),c.default.createElement("button",{onClick:()=>s(),title:r.zoomOut||"Zoom Out"},a?a[1]:c.default.createElement(x,{style:{width:"1em"}}))),c.default.createElement("div",Object.assign({},i),c.default.createElement("button",{onClick:()=>o(),title:r.reset||"See whole graph"},a?a[2]:c.default.createElement(H,{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": "3.2.0",
+  "version": "3.3.0",
   "private": false,
@@ -54,3 +54,3 @@ "description": "React Sigma",
   },
-  "gitHead": "367a392c5867f050104ab2992b262c301a5459da"
+  "gitHead": "620d971c1607859135415c33b107990add1d1e48"
 }

src/hooks/useFullScreen.ts

@@ -22,6 +22,12 @@ import { useEffect, useState, useCallback } from "react";
  */
-export function useFullScreen(): { toggle: () => void; isFullScreen: boolean } {
-  const { container } = useSigmaContext();
+export function useFullScreen(
+  container?: HTMLElement | null,
+): {
+  toggle: () => void;
+  isFullScreen: boolean;
+} {
+  const context = useSigmaContext();
   const [isFullScreen, setFullScreen] = useState<boolean>(false);
-  const toggleState = () => setFullScreen(v => !v);
+  const [element, setElement] = useState<HTMLElement>(container ? container : context.container);
+  const toggleState = () => setFullScreen((v) => !v);
 
@@ -33,5 +39,9 @@ useEffect(() => {
 
+  useEffect(() => {
+    setElement(container || context.container);
+  }, [container, context.container]);
+
   const toggle = useCallback(() => {
-    toggleFullScreen(container);
-  }, [container]);
+    toggleFullScreen(element);
+  }, [element]);
 
@@ -38,0 +48,0 @@ return {

src/hooks/useRegisterEvents.ts

@@ -34,2 +34,4 @@ import { useEffect, useState } from "react";
   "wheelStage",
+  "beforeRender",
+  "afterRender",
   "kill",
@@ -36,0 +38,0 @@ ];

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

Total package byte prevSize

146506

increased by1.33%

Lines of code

1803

increased by1.29%

No dependency changes