@xyo-network/react-node-renderer 2.72.1 → 2.72.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/browser/components/cytoscape-extensions/WithExtensions.d.cts.map +1 -1
- package/dist/browser/components/cytoscape-extensions/WithExtensions.d.mts.map +1 -1
- package/dist/browser/components/cytoscape-extensions/WithExtensions.d.ts.map +1 -1
- package/dist/browser/components/lib/RelationalGraphProps.d.cts +1 -1
- package/dist/browser/components/lib/RelationalGraphProps.d.cts.map +1 -1
- package/dist/browser/components/lib/RelationalGraphProps.d.mts +1 -1
- package/dist/browser/components/lib/RelationalGraphProps.d.mts.map +1 -1
- package/dist/browser/components/lib/RelationalGraphProps.d.ts +1 -1
- package/dist/browser/components/lib/RelationalGraphProps.d.ts.map +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.cts +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.cts.map +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.mts +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.mts.map +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.ts +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.ts.map +1 -1
- package/dist/browser/components/relational/graph/Graph.d.cts.map +1 -1
- package/dist/browser/components/relational/graph/Graph.d.mts.map +1 -1
- package/dist/browser/components/relational/graph/Graph.d.ts.map +1 -1
- package/dist/browser/components/relational/graph/ProvidedNodeRenderer.d.cts +1 -1
- package/dist/browser/components/relational/graph/ProvidedNodeRenderer.d.cts.map +1 -1
- package/dist/browser/components/relational/graph/ProvidedNodeRenderer.d.mts +1 -1
- package/dist/browser/components/relational/graph/ProvidedNodeRenderer.d.mts.map +1 -1
- package/dist/browser/components/relational/graph/ProvidedNodeRenderer.d.ts +1 -1
- package/dist/browser/components/relational/graph/ProvidedNodeRenderer.d.ts.map +1 -1
- package/dist/browser/contexts/CytoscapeInstance/Provider.d.cts +1 -1
- package/dist/browser/contexts/CytoscapeInstance/Provider.d.cts.map +1 -1
- package/dist/browser/contexts/CytoscapeInstance/Provider.d.mts +1 -1
- package/dist/browser/contexts/CytoscapeInstance/Provider.d.mts.map +1 -1
- package/dist/browser/contexts/CytoscapeInstance/Provider.d.ts +1 -1
- package/dist/browser/contexts/CytoscapeInstance/Provider.d.ts.map +1 -1
- package/dist/browser/contexts/CytoscapeInstance/State.d.cts +2 -2
- package/dist/browser/contexts/CytoscapeInstance/State.d.cts.map +1 -1
- package/dist/browser/contexts/CytoscapeInstance/State.d.mts +2 -2
- package/dist/browser/contexts/CytoscapeInstance/State.d.mts.map +1 -1
- package/dist/browser/contexts/CytoscapeInstance/State.d.ts +2 -2
- package/dist/browser/contexts/CytoscapeInstance/State.d.ts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useHoveredNode.d.cts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useHoveredNode.d.mts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useHoveredNode.d.ts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useRenderNewElements.d.cts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useRenderNewElements.d.mts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useRenderNewElements.d.ts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useSelectedElement.d.cts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useSelectedElement.d.mts.map +1 -1
- package/dist/browser/hooks/cytoscape/elements/useSelectedElement.d.ts.map +1 -1
- package/dist/browser/hooks/cytoscape/useModuleDetails.d.cts +1 -0
- package/dist/browser/hooks/cytoscape/useModuleDetails.d.cts.map +1 -1
- package/dist/browser/hooks/cytoscape/useModuleDetails.d.mts +1 -0
- package/dist/browser/hooks/cytoscape/useModuleDetails.d.mts.map +1 -1
- package/dist/browser/hooks/cytoscape/useModuleDetails.d.ts +1 -0
- package/dist/browser/hooks/cytoscape/useModuleDetails.d.ts.map +1 -1
- package/dist/browser/index.cjs +29 -29
- package/dist/browser/index.cjs.map +1 -1
- package/dist/browser/index.js +34 -34
- package/dist/browser/index.js.map +1 -1
- package/dist/node/components/cytoscape-extensions/WithExtensions.d.cts.map +1 -1
- package/dist/node/components/cytoscape-extensions/WithExtensions.d.mts.map +1 -1
- package/dist/node/components/cytoscape-extensions/WithExtensions.d.ts.map +1 -1
- package/dist/node/components/lib/RelationalGraphProps.d.cts +1 -1
- package/dist/node/components/lib/RelationalGraphProps.d.cts.map +1 -1
- package/dist/node/components/lib/RelationalGraphProps.d.mts +1 -1
- package/dist/node/components/lib/RelationalGraphProps.d.mts.map +1 -1
- package/dist/node/components/lib/RelationalGraphProps.d.ts +1 -1
- package/dist/node/components/lib/RelationalGraphProps.d.ts.map +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.cts +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.cts.map +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.mts +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.mts.map +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.ts +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.ts.map +1 -1
- package/dist/node/components/relational/graph/Graph.d.cts.map +1 -1
- package/dist/node/components/relational/graph/Graph.d.mts.map +1 -1
- package/dist/node/components/relational/graph/Graph.d.ts.map +1 -1
- package/dist/node/components/relational/graph/ProvidedNodeRenderer.d.cts +1 -1
- package/dist/node/components/relational/graph/ProvidedNodeRenderer.d.cts.map +1 -1
- package/dist/node/components/relational/graph/ProvidedNodeRenderer.d.mts +1 -1
- package/dist/node/components/relational/graph/ProvidedNodeRenderer.d.mts.map +1 -1
- package/dist/node/components/relational/graph/ProvidedNodeRenderer.d.ts +1 -1
- package/dist/node/components/relational/graph/ProvidedNodeRenderer.d.ts.map +1 -1
- package/dist/node/contexts/CytoscapeInstance/Provider.d.cts +1 -1
- package/dist/node/contexts/CytoscapeInstance/Provider.d.cts.map +1 -1
- package/dist/node/contexts/CytoscapeInstance/Provider.d.mts +1 -1
- package/dist/node/contexts/CytoscapeInstance/Provider.d.mts.map +1 -1
- package/dist/node/contexts/CytoscapeInstance/Provider.d.ts +1 -1
- package/dist/node/contexts/CytoscapeInstance/Provider.d.ts.map +1 -1
- package/dist/node/contexts/CytoscapeInstance/State.d.cts +2 -2
- package/dist/node/contexts/CytoscapeInstance/State.d.cts.map +1 -1
- package/dist/node/contexts/CytoscapeInstance/State.d.mts +2 -2
- package/dist/node/contexts/CytoscapeInstance/State.d.mts.map +1 -1
- package/dist/node/contexts/CytoscapeInstance/State.d.ts +2 -2
- package/dist/node/contexts/CytoscapeInstance/State.d.ts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useHoveredNode.d.cts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useHoveredNode.d.mts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useHoveredNode.d.ts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useRenderNewElements.d.cts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useRenderNewElements.d.mts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useRenderNewElements.d.ts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useSelectedElement.d.cts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useSelectedElement.d.mts.map +1 -1
- package/dist/node/hooks/cytoscape/elements/useSelectedElement.d.ts.map +1 -1
- package/dist/node/hooks/cytoscape/useModuleDetails.d.cts +1 -0
- package/dist/node/hooks/cytoscape/useModuleDetails.d.cts.map +1 -1
- package/dist/node/hooks/cytoscape/useModuleDetails.d.mts +1 -0
- package/dist/node/hooks/cytoscape/useModuleDetails.d.mts.map +1 -1
- package/dist/node/hooks/cytoscape/useModuleDetails.d.ts +1 -0
- package/dist/node/hooks/cytoscape/useModuleDetails.d.ts.map +1 -1
- package/dist/node/index.cjs +29 -29
- package/dist/node/index.cjs.map +1 -1
- package/dist/node/index.js +34 -34
- package/dist/node/index.js.map +1 -1
- package/package.json +26 -28
- package/src/Cytoscape/CytoscapeElements.ts +1 -1
- package/src/components/cytoscape-extensions/WithExtensions.tsx +0 -2
- package/src/components/lib/RelationalGraphProps.ts +1 -1
- package/src/components/module/graph/GraphFlexBox.tsx +1 -1
- package/src/components/relational/graph/Graph.tsx +9 -14
- package/src/components/relational/graph/GraphEvents.stories.tsx +4 -3
- package/src/components/relational/graph/ProvidedNodeRenderer.tsx +1 -1
- package/src/contexts/CytoscapeInstance/Provider.tsx +2 -2
- package/src/contexts/CytoscapeInstance/State.ts +2 -2
- package/src/hooks/cytoscape/elements/useHoveredNode.tsx +3 -2
- package/src/hooks/cytoscape/elements/useRenderNewElements.tsx +3 -2
- package/src/hooks/cytoscape/elements/useSelectedElement.tsx +4 -2
- package/src/hooks/cytoscape/useModuleDetails.tsx +11 -8
- package/src/components/relational/graph/GraphFCose.stories.tsx +0 -173
package/dist/node/index.js
CHANGED
|
@@ -20,7 +20,7 @@ var ModuleCardParser = ({ module }) => {
|
|
|
20
20
|
|
|
21
21
|
// src/components/module/graph/GraphFlexBox.tsx
|
|
22
22
|
import { Button as Button3 } from "@mui/material";
|
|
23
|
-
import { useRef as
|
|
23
|
+
import { useRef as useRef3 } from "react";
|
|
24
24
|
|
|
25
25
|
// src/contexts/CytoscapeInstance/Context.ts
|
|
26
26
|
import { createContextEx } from "@xyo-network/react-shared";
|
|
@@ -305,8 +305,9 @@ var useHoveredNode = (renderedElements) => {
|
|
|
305
305
|
}
|
|
306
306
|
}, [nodeListener, renderedElements]);
|
|
307
307
|
useEffect3(() => {
|
|
308
|
-
cy == null ? void 0 : cy.
|
|
309
|
-
|
|
308
|
+
const cyInstance = cy == null ? void 0 : cy.deref();
|
|
309
|
+
cyInstance == null ? void 0 : cyInstance.ready(() => {
|
|
310
|
+
cyInstance.nodes().forEach(nodeListener);
|
|
310
311
|
});
|
|
311
312
|
}, [cy, nodeListener]);
|
|
312
313
|
return [hoveredNode, setHoveredNode];
|
|
@@ -331,10 +332,11 @@ var useRenderNewElements = (newElements = [], hideLabels) => {
|
|
|
331
332
|
const { cy } = useCytoscapeInstance(true);
|
|
332
333
|
const [renderedElements, setRenderedElements] = useState4();
|
|
333
334
|
useEffect4(() => {
|
|
335
|
+
const cyInstance = cy == null ? void 0 : cy.deref();
|
|
334
336
|
if (newElements.length > 1) {
|
|
335
|
-
const renderedElements2 =
|
|
337
|
+
const renderedElements2 = cyInstance == null ? void 0 : cyInstance.add(newElements);
|
|
336
338
|
setRenderedElements(renderedElements2);
|
|
337
|
-
|
|
339
|
+
cyInstance == null ? void 0 : cyInstance.layout(ColaLayout).run();
|
|
338
340
|
}
|
|
339
341
|
}, [cy, hideLabels, newElements]);
|
|
340
342
|
return renderedElements;
|
|
@@ -346,13 +348,15 @@ var useSelectedElement = () => {
|
|
|
346
348
|
const [selectedElement, setSelectedElement] = useState5();
|
|
347
349
|
const { cy } = useCytoscapeInstance(true);
|
|
348
350
|
const updateStyles = (element) => {
|
|
349
|
-
const
|
|
351
|
+
const cyInstance = cy == null ? void 0 : cy.deref();
|
|
352
|
+
const nodes = cyInstance == null ? void 0 : cyInstance.nodes();
|
|
350
353
|
nodes == null ? void 0 : nodes.toggleClass("activeNode", false);
|
|
351
354
|
element.toggleClass("activeNode", true);
|
|
352
355
|
};
|
|
353
356
|
const toggleSelectedElement = (address) => {
|
|
354
357
|
var _a;
|
|
355
|
-
const
|
|
358
|
+
const cyInstance = cy == null ? void 0 : cy.deref();
|
|
359
|
+
const selectedNode = (_a = cyInstance == null ? void 0 : cyInstance.nodes(`[id="${address}"]`)) == null ? void 0 : _a[0];
|
|
356
360
|
if (selectedNode) {
|
|
357
361
|
setSelectedElement(selectedNode);
|
|
358
362
|
updateStyles(selectedNode);
|
|
@@ -444,14 +448,16 @@ var useModuleDetails = (rootModule, onFoundModule) => {
|
|
|
444
448
|
useEffect5(() => {
|
|
445
449
|
const resizeObserver = new ResizeObserver(() => {
|
|
446
450
|
var _a;
|
|
451
|
+
const cyInstance2 = cy == null ? void 0 : cy.deref();
|
|
447
452
|
if (moduleAddress === null) {
|
|
448
|
-
setTimeout(() =>
|
|
453
|
+
setTimeout(() => cyInstance2 == null ? void 0 : cyInstance2.center(), 100);
|
|
449
454
|
} else if (foundModule && cy) {
|
|
450
|
-
const node = (_a =
|
|
451
|
-
setTimeout(() =>
|
|
455
|
+
const node = (_a = cyInstance2 == null ? void 0 : cyInstance2.nodes(`[id="${moduleAddress}"]`)) == null ? void 0 : _a[0];
|
|
456
|
+
setTimeout(() => cyInstance2 == null ? void 0 : cyInstance2.center(node), 100);
|
|
452
457
|
}
|
|
453
458
|
});
|
|
454
|
-
const
|
|
459
|
+
const cyInstance = cy == null ? void 0 : cy.deref();
|
|
460
|
+
const container = cyInstance == null ? void 0 : cyInstance.container();
|
|
455
461
|
if (container) {
|
|
456
462
|
resizeObserver.observe(container);
|
|
457
463
|
}
|
|
@@ -466,10 +472,11 @@ var useModuleDetails = (rootModule, onFoundModule) => {
|
|
|
466
472
|
}
|
|
467
473
|
}, [cy, moduleAddress, foundModule, onFoundModule]);
|
|
468
474
|
const onModuleDetails = (address) => {
|
|
469
|
-
const
|
|
470
|
-
const
|
|
471
|
-
const
|
|
472
|
-
const
|
|
475
|
+
const cyInstance = cy == null ? void 0 : cy.deref();
|
|
476
|
+
const moduleNode = cyInstance == null ? void 0 : cyInstance.nodes(`[id="${address}"]`);
|
|
477
|
+
const rootModuleNode = cyInstance == null ? void 0 : cyInstance.nodes(`[id="${rootModule == null ? void 0 : rootModule.address}"]`);
|
|
478
|
+
const foundModuleNode = cyInstance == null ? void 0 : cyInstance.nodes(`[id="${foundModule == null ? void 0 : foundModule.address}"]`);
|
|
479
|
+
const notModuleNode = cyInstance == null ? void 0 : cyInstance.nodes(`[id != "${address}"]`);
|
|
473
480
|
if (address) {
|
|
474
481
|
moduleNode == null ? void 0 : moduleNode.toggleClass("activeNode", true);
|
|
475
482
|
notModuleNode == null ? void 0 : notModuleNode.toggleClass("activeNode", false);
|
|
@@ -502,14 +509,12 @@ import cola from "cytoscape-cola";
|
|
|
502
509
|
import coseBilkent from "cytoscape-cose-bilkent";
|
|
503
510
|
import dagre from "cytoscape-dagre";
|
|
504
511
|
import euler from "cytoscape-euler";
|
|
505
|
-
import fcose from "cytoscape-fcose";
|
|
506
512
|
import { useEffect as useEffect6, useState as useState8 } from "react";
|
|
507
513
|
import { Fragment, jsx as jsx4 } from "react/jsx-runtime";
|
|
508
514
|
var WithExtensions = ({ children }) => {
|
|
509
515
|
const [initialized, setInitialized] = useState8(false);
|
|
510
516
|
useEffect6(() => {
|
|
511
517
|
use(cola);
|
|
512
|
-
use(fcose);
|
|
513
518
|
use(dagre);
|
|
514
519
|
use(coseBilkent);
|
|
515
520
|
use(euler);
|
|
@@ -521,14 +526,12 @@ var WithExtensions = ({ children }) => {
|
|
|
521
526
|
// src/components/relational/graph/Graph.tsx
|
|
522
527
|
import { Button, ButtonGroup, useTheme as useTheme3 } from "@mui/material";
|
|
523
528
|
import { FlexCol, FlexGrowRow, FlexRow } from "@xylabs/react-flexbox";
|
|
524
|
-
import { useShareForwardedRef } from "@xyo-network/react-shared";
|
|
525
529
|
import cytoscape from "cytoscape";
|
|
526
530
|
import cola2 from "cytoscape-cola";
|
|
527
531
|
import coseBilkentLayout from "cytoscape-cose-bilkent";
|
|
528
532
|
import dagre2 from "cytoscape-dagre";
|
|
529
533
|
import eulerLayout from "cytoscape-euler";
|
|
530
|
-
import
|
|
531
|
-
import { forwardRef, useEffect as useEffect7, useState as useState9 } from "react";
|
|
534
|
+
import { forwardRef, useEffect as useEffect7, useRef, useState as useState9 } from "react";
|
|
532
535
|
import { jsx as jsx5, jsxs } from "react/jsx-runtime";
|
|
533
536
|
var applyLayout = (cy, name = "cola", options) => {
|
|
534
537
|
cy == null ? void 0 : cy.layout({ name, ...options }).run();
|
|
@@ -547,10 +550,6 @@ var loadLayout = (layout = "cola") => {
|
|
|
547
550
|
cytoscape.use(coseBilkentLayout);
|
|
548
551
|
break;
|
|
549
552
|
}
|
|
550
|
-
case "fcose": {
|
|
551
|
-
cytoscape.use(fcose2);
|
|
552
|
-
break;
|
|
553
|
-
}
|
|
554
553
|
case "cola": {
|
|
555
554
|
cytoscape.use(cola2);
|
|
556
555
|
break;
|
|
@@ -562,17 +561,18 @@ var NodeRelationalGraphFlexBox = forwardRef(
|
|
|
562
561
|
const theme = useTheme3();
|
|
563
562
|
const [cy, setCy] = useState9();
|
|
564
563
|
const { setCy: setCyContext } = useCytoscapeInstance();
|
|
565
|
-
const
|
|
564
|
+
const cytoscapeRef = useRef();
|
|
566
565
|
const handleReset = () => {
|
|
567
566
|
cy == null ? void 0 : cy.reset();
|
|
568
567
|
applyLayout(cy, layout ?? "euler", layoutOptions);
|
|
569
568
|
};
|
|
570
569
|
useEffect7(() => {
|
|
571
570
|
let newCy;
|
|
572
|
-
|
|
571
|
+
const container = cytoscapeRef.current;
|
|
572
|
+
if (container) {
|
|
573
573
|
loadLayout(layout);
|
|
574
574
|
newCy = cytoscape({
|
|
575
|
-
container
|
|
575
|
+
container,
|
|
576
576
|
...options
|
|
577
577
|
});
|
|
578
578
|
applyLayout(newCy, layout ?? "euler", layoutOptions);
|
|
@@ -582,11 +582,11 @@ var NodeRelationalGraphFlexBox = forwardRef(
|
|
|
582
582
|
newCy == null ? void 0 : newCy.destroy();
|
|
583
583
|
setCy(void 0);
|
|
584
584
|
};
|
|
585
|
-
}, [options,
|
|
585
|
+
}, [options, cytoscapeRef, layoutOptions, layout]);
|
|
586
586
|
useEffect7(() => {
|
|
587
|
-
setCyContext == null ? void 0 : setCyContext(cy);
|
|
587
|
+
setCyContext == null ? void 0 : setCyContext(cy ? new WeakRef(cy) : void 0);
|
|
588
588
|
}, [cy, setCyContext]);
|
|
589
|
-
return /* @__PURE__ */ jsxs(FlexCol, { id: "relational-graph-wrapper", ...props, children: [
|
|
589
|
+
return /* @__PURE__ */ jsxs(FlexCol, { id: "relational-graph-wrapper", ref, ...props, children: [
|
|
590
590
|
/* @__PURE__ */ jsx5(FlexRow, { justifyContent: "start", width: "100%", children: actions === null ? null : actions ? /* @__PURE__ */ jsxs(ButtonGroup, { children: [
|
|
591
591
|
actions,
|
|
592
592
|
/* @__PURE__ */ jsx5(Button, { size: "small", variant: "contained", onClick: handleReset, children: "Reset View" })
|
|
@@ -602,7 +602,7 @@ var NodeRelationalGraphFlexBox = forwardRef(
|
|
|
602
602
|
height: showDetails ? "50%" : "100%",
|
|
603
603
|
border: showDetails ? `1px solid ${theme.palette.divider}` : void 0,
|
|
604
604
|
children: [
|
|
605
|
-
/* @__PURE__ */ jsx5(FlexCol, { alignItems: "stretch", position: "absolute", width: "100%", height: "100%", ref:
|
|
605
|
+
/* @__PURE__ */ jsx5(FlexCol, { alignItems: "stretch", position: "absolute", width: "100%", height: "100%", ref: cytoscapeRef }),
|
|
606
606
|
children
|
|
607
607
|
]
|
|
608
608
|
}
|
|
@@ -641,9 +641,9 @@ import { styled } from "@mui/material";
|
|
|
641
641
|
import { FlexCol as FlexCol2 } from "@xylabs/react-flexbox";
|
|
642
642
|
|
|
643
643
|
// src/components/module/graph/node/hooks/useNodeElement.tsx
|
|
644
|
-
import { useEffect as useEffect8, useRef, useState as useState10 } from "react";
|
|
644
|
+
import { useEffect as useEffect8, useRef as useRef2, useState as useState10 } from "react";
|
|
645
645
|
var useNodeElement = (node) => {
|
|
646
|
-
const ref =
|
|
646
|
+
const ref = useRef2(null);
|
|
647
647
|
const [currentElement, setCurrentElement] = useState10(null);
|
|
648
648
|
const [boundingBox, setBoundingBox] = useState10(node == null ? void 0 : node.renderedBoundingBox());
|
|
649
649
|
useEffect8(() => {
|
|
@@ -720,7 +720,7 @@ var StyledCardActions = styled2(CardActions, { name: "StyledCardActions" })(() =
|
|
|
720
720
|
// src/components/module/graph/GraphFlexBox.tsx
|
|
721
721
|
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
722
722
|
var ModuleGraphFlexBox = ({ rootModule, disableModuleDetails, ...props }) => {
|
|
723
|
-
const cytoscapeRef =
|
|
723
|
+
const cytoscapeRef = useRef3(null);
|
|
724
724
|
const { handleToggleLabels, hideLabels, options } = useRelationalGraphOptions(rootModule ?? void 0);
|
|
725
725
|
const { hoveredNode, setHoveredNode, toggleSelectedElement } = useElements(hideLabels);
|
|
726
726
|
const { module, onModuleDetails } = useModuleDetails(rootModule, () => setHoveredNode(void 0));
|
package/dist/node/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/module/CardParser.tsx","../../src/components/module/graph/GraphFlexBox.tsx","../../src/contexts/CytoscapeInstance/Context.ts","../../src/contexts/CytoscapeInstance/Provider.tsx","../../src/contexts/CytoscapeInstance/use.ts","../../src/hooks/cytoscape/elements/useCytoscapeElements.ts","../../src/Cytoscape/CytoscapeElements.ts","../../src/Cytoscape/lib/encodeSvg.ts","../../src/Cytoscape/lib/iconMap.ts","../../src/Cytoscape/lib/layout/ColaLayout.ts","../../src/Cytoscape/lib/layout/ConcentricLayout.ts","../../src/Cytoscape/lib/parseModuleType.ts","../../src/Cytoscape/CytoscapeIcons.tsx","../../src/Cytoscape/CytoscapeStyles.ts","../../src/hooks/cytoscape/elements/useHoveredNode.tsx","../../src/hooks/cytoscape/elements/useNewElements.tsx","../../src/hooks/cytoscape/elements/useRenderNewElements.tsx","../../src/hooks/cytoscape/elements/useSelectedElement.tsx","../../src/hooks/cytoscape/elements/useElements.tsx","../../src/hooks/cytoscape/useCytoscapeOptions.ts","../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../src/hooks/cytoscape/useIcons.tsx","../../src/hooks/cytoscape/useModuleDetails.tsx","../../src/hooks/cytoscape/useRelationalGraphOptions.tsx","../../src/components/cytoscape-extensions/WithExtensions.tsx","../../src/components/relational/graph/Graph.tsx","../../src/components/relational/graph/ProvidedNodeRenderer.tsx","../../src/components/module/graph/DetailsFlexbox.tsx","../../src/components/module/graph/node/Hover.tsx","../../src/components/module/graph/node/hooks/useNodeElement.tsx","../../src/components/module/graph/Popper.tsx"],"sourcesContent":["import { asArchivistInstance, isArchivistInstance } from '@xyo-network/archivist-model'\nimport { asDivinerInstance, isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { ArchivistCard } from '@xyo-network/react-archivist'\nimport { DivinerCard, ModuleCard } from '@xyo-network/react-module'\n\nexport interface ModuleCardParserProps {\n module?: ModuleInstance\n}\n\nexport const ModuleCardParser: React.FC<ModuleCardParserProps> = ({ module }) => {\n switch (true) {\n case isArchivistInstance(module): {\n return <ArchivistCard module={asArchivistInstance(module)} />\n }\n case isDivinerInstance(module): {\n return <DivinerCard module={asDivinerInstance(module)} />\n }\n default: {\n return <ModuleCard module={module} />\n }\n }\n}\n","import { Button } from '@mui/material'\nimport { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { useRef } from 'react'\n\nimport { CytoscapeInstanceProvider } from '../../../contexts'\nimport { useElements, useModuleDetails, useRelationalGraphOptions } from '../../../hooks'\nimport { WithExtensions } from '../../cytoscape-extensions'\nimport { NodeRelationalGraphFlexBox } from '../../relational'\nimport { DetailsFlexbox } from './DetailsFlexbox'\nimport { ModuleGraphNodeHover } from './node'\nimport { StyledModuleHoverPopper } from './Popper'\n\nexport interface ModuleGraphFlexBoxProps extends FlexBoxProps {\n disableModuleDetails?: boolean\n layout?: 'dagre' | 'euler' | 'fcose' | 'cose-bilkent' | 'cola'\n layoutOptions?: object\n rootModule?: ModuleInstance | null\n}\n\nexport const ModuleGraphFlexBox: React.FC<ModuleGraphFlexBoxProps> = ({ rootModule, disableModuleDetails, ...props }) => {\n const cytoscapeRef = useRef<HTMLDivElement>(null)\n const { handleToggleLabels, hideLabels, options } = useRelationalGraphOptions(rootModule ?? undefined)\n const { hoveredNode, setHoveredNode, toggleSelectedElement } = useElements(hideLabels)\n\n const { module, onModuleDetails } = useModuleDetails(rootModule, () => setHoveredNode(undefined))\n\n return (\n <WithExtensions>\n <NodeRelationalGraphFlexBox\n actions={\n module ? null : (\n <Button size={'small'} onClick={handleToggleLabels} variant=\"contained\">\n Toggle Labels\n </Button>\n )\n }\n showDetails={!!module}\n detail={<DetailsFlexbox onClose={() => onModuleDetails(null)} />}\n options={options}\n ref={cytoscapeRef}\n width=\"100%\"\n {...props}\n >\n <ModuleGraphNodeHover node={hoveredNode}>\n {(element) => (\n <StyledModuleHoverPopper\n anchorEl={element}\n container={cytoscapeRef.current}\n node={hoveredNode}\n onClose={() => setHoveredNode(undefined)}\n onModuleExplore={toggleSelectedElement}\n onModuleDetails={disableModuleDetails ? undefined : onModuleDetails}\n placement={'top'}\n open\n />\n )}\n </ModuleGraphNodeHover>\n </NodeRelationalGraphFlexBox>\n </WithExtensions>\n )\n}\n\nexport const ModuleGraphFlexBoxWithProvider: React.FC<ModuleGraphFlexBoxProps> = (props) => {\n return (\n <CytoscapeInstanceProvider>\n <ModuleGraphFlexBox {...props} />\n </CytoscapeInstanceProvider>\n )\n}\n","import { createContextEx } from '@xyo-network/react-shared'\n\nimport { CytoscapeInstanceState } from './State'\n\nexport const CytoscapeInstanceContext = createContextEx<CytoscapeInstanceState>()\n","import type { WithChildren } from '@xylabs/react-shared'\nimport { Core } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeInstanceContext } from './Context'\n\nexport interface CytoscapeInstanceProviderProps extends WithChildren {\n defaultInstance?: Core\n}\n\nexport const CytoscapeInstanceProvider: React.FC<CytoscapeInstanceProviderProps> = ({ children, defaultInstance }) => {\n const [cy, setCy] = useState<Core | undefined>(defaultInstance)\n useEffect(() => {\n setCy(defaultInstance)\n }, [defaultInstance])\n\n return <CytoscapeInstanceContext.Provider value={{ cy, provided: true, setCy }}>{children}</CytoscapeInstanceContext.Provider>\n}\n","import { useContextEx } from '@xyo-network/react-shared'\n\nimport { CytoscapeInstanceContext } from './Context'\n\nexport const useCytoscapeInstance = (required = false) => useContextEx(CytoscapeInstanceContext, 'CytoscapeInstance', required)\n","import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction } from '@xyo-network/module-events'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../../Cytoscape'\n\nexport const useCytoscapeElements = (module?: ModuleInstance | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async () => {\n if (module) {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n }\n },\n [module],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined\n let detachedListener: EventUnsubscribeFunction | undefined\n\n if (module && isNodeInstance(module)) {\n attachedListener = module.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n detachedListener = module.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [module])\n\n return elements\n}\n","import { exists } from '@xylabs/exists'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib'\n\ninterface ModuleInfo {\n children: ModuleInfo[]\n depth: number\n module: ModuleInstance\n}\n\nexport const CytoscapeElements = {\n MaxNameLength: 20,\n\n buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition, properties?: { [key: string]: unknown }) {\n return {\n data: {\n id: `${rootNode.data.id}/${newNode.data.id}`,\n source: rootNode.data.id,\n target: newNode.data.id,\n ...properties,\n },\n }\n },\n\n async buildElements(module: ModuleInstance): Promise<ElementDefinition[]> {\n const info = await CytoscapeElements.recurseNodes(module)\n const newElements: ElementDefinition[] = await this.buildElementsFromInfo(info, undefined, ['activeNode'])\n\n return newElements\n },\n\n async buildElementsFromInfo(info: ModuleInfo, root?: ElementDefinition, classes: string[] = []): Promise<ElementDefinition[]> {\n const newNode = CytoscapeElements.buildNode(info.module, { childCount: info.children.length, depth: info.depth }, classes)\n const newEdge = root ? CytoscapeElements.buildEdge(root, newNode, { depth: info.depth, siblingCount: info.children.length }) : undefined\n const newElements: ElementDefinition[] = [newNode]\n if (newEdge) {\n newElements.push(newEdge)\n }\n\n for (const childInfo of info.children) {\n newElements.push(...(await this.buildElementsFromInfo(childInfo, newNode)))\n }\n\n return newElements\n },\n\n buildNode(module: ModuleInstance, properties?: { [key: string]: unknown }, classes?: string[]): ElementDefinition {\n const { address, id } = module\n return {\n classes,\n data: {\n address,\n id: address,\n name: id,\n type: parseModuleType(module),\n ...properties,\n },\n }\n },\n\n buildRootNode: (module: ModuleInstance): ElementDefinition => {\n return CytoscapeElements.buildNode(module, {}, ['activeNode'])\n },\n\n normalizeName(name?: string) {\n if (!name) return\n if (name.length > this.MaxNameLength) return `${name.slice(0, 20)}...`\n return name\n },\n\n async recurseNodes(root: ModuleInstance, maxDepth = 10, depth = 1): Promise<ModuleInfo> {\n const info: ModuleInfo = { children: [], depth, module: root }\n\n if (maxDepth > 0) {\n const children = await root.resolve('*', { direction: 'down', maxDepth: 1 })\n info.children = (\n await Promise.all(\n children.map(async (child) => {\n if (child.address !== root.address) {\n return await this.recurseNodes(child, maxDepth - 1, depth + 1)\n // don't re add the root module that was passed in\n }\n }),\n )\n ).filter(exists)\n }\n\n return info\n },\n}\n","import { ReactElement } from 'react'\n// eslint-disable-next-line import/no-internal-modules\nimport { renderToStaticMarkup } from 'react-dom/server'\n\nconst dataUri = 'data:image/svg+xml,'\n\nexport const encodeSvg = (reactElement: ReactElement, color?: string) => {\n const svgString = renderToStaticMarkup(reactElement)\n\n const doc = new DOMParser().parseFromString(svgString, 'text/html')\n const svgElement = doc.querySelectorAll('svg')[0]\n if (svgElement) {\n svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg')\n svgElement.setAttribute('height', '100')\n svgElement.style.fill = color ?? 'black'\n }\n\n return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`\n}\n","import { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n module: '',\n node: '',\n sentinel: '',\n witness: '',\n})\n","export const ColaLayout = {\n centerGraph: false,\n convergenceThreshold: 0.01,\n name: 'cola',\n}\n","import { LayoutOptions } from 'cytoscape'\n\nexport const ConcentricLayout: LayoutOptions = {\n concentric: function (node) {\n return node.degree()\n },\n levelWidth: function () {\n return 2\n },\n minNodeSpacing: 75,\n name: 'concentric',\n}\n","import { isArchivistInstance } from '@xyo-network/archivist-model'\nimport { isBridgeInstance } from '@xyo-network/bridge-model'\nimport { isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { isSentinelInstance } from '@xyo-network/sentinel-model'\nimport { isWitnessModule } from '@xyo-network/witness-model'\n\nimport { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const parseModuleType = (module?: ModuleInstance): CyNodeModuleTypes => {\n let type: CyNodeModuleTypes = 'module'\n if (module) {\n if (isArchivistInstance(module)) {\n type = 'archivist'\n } else if (isBridgeInstance(module)) {\n type = 'bridge'\n } else if (isDivinerInstance(module)) {\n type = 'diviner'\n } else if (isNodeInstance(module)) {\n type = 'node'\n } else if (isSentinelInstance(module)) {\n type = 'sentinel'\n } else if (isWitnessModule(module)) {\n type = 'witness'\n } else {\n type = 'module'\n }\n }\n return type\n}\n","import {\n BubbleChartRounded as BubbleChartRoundedIcon,\n Hub as HubIcon,\n InsertLinkRounded as InsertLinkRoundedIcon,\n Inventory2Rounded as Inventory2RoundedIcon,\n QuestionMarkRounded as QuestionMarkRoundedIcon,\n TimerRounded as TimerRoundedIcon,\n VisibilityRounded as VisibilityRoundedIcon,\n} from '@mui/icons-material'\nimport { SvgIconTypeMap } from '@mui/material'\n// eslint-disable-next-line import/no-internal-modules\nimport { OverridableComponent } from '@mui/material/OverridableComponent'\n\nimport { CyNodeModuleTypes } from './lib'\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import { Stylesheet } from 'cytoscape'\n\nimport { CyNodeModuleTypes } from './lib'\n\nexport const NodeWithName = (color?: string, outlineColor?: string): Stylesheet => ({\n selector: 'node[name]',\n style: {\n color,\n 'font-family': 'Lexend Deca, Helvetica, sans-serif',\n 'font-size': 12,\n 'overlay-padding': '6px',\n 'text-halign': 'center',\n 'text-outline-color': outlineColor,\n 'text-outline-width': '1px',\n 'text-valign': 'top',\n },\n})\n\nexport const Node = (icons: Record<CyNodeModuleTypes, string>, bgColor?: string, hideLabels = false): Stylesheet => ({\n selector: 'node',\n style: {\n 'background-color': bgColor,\n 'background-height': '75%',\n 'background-image': (elem) => icons[elem.data('type') as CyNodeModuleTypes],\n 'background-width': '24',\n label: hideLabels ? undefined : 'data(name)',\n shape: 'round-rectangle',\n },\n})\n\nexport const NodeAsRoot = (bgColor?: string) => ({\n selector: '.activeNode',\n style: {\n 'background-color': bgColor,\n },\n})\n\nexport const EdgeStyled = (lineColor?: string, targetArrowColor?: string) => ({\n selector: 'edge',\n style: {\n 'curve-style': 'bezier',\n 'line-color': lineColor,\n 'line-opacity': 0.1,\n 'target-arrow-color': targetArrowColor,\n 'target-arrow-shape': 'triangle',\n width: 3,\n },\n})\n","import { NodeCollection, NodeSingular } from 'cytoscape'\nimport { Dispatch, SetStateAction, useCallback, useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts'\n\nexport const useHoveredNode = (renderedElements?: NodeCollection): [NodeSingular | undefined, Dispatch<SetStateAction<NodeSingular | undefined>>] => {\n const { cy } = useCytoscapeInstance(true)\n const [hoveredNode, setHoveredNode] = useState<NodeSingular>()\n\n const nodeListener = useCallback((node: NodeSingular) => {\n node.on('mouseover tap', () => {\n setHoveredNode(node)\n })\n }, [])\n\n useEffect(() => {\n if (renderedElements) {\n // eslint-disable-next-line unicorn/no-array-for-each\n renderedElements.nodes().forEach(nodeListener)\n }\n }, [nodeListener, renderedElements])\n\n useEffect(() => {\n cy?.ready(() => {\n // eslint-disable-next-line unicorn/no-array-for-each\n cy.nodes().forEach(nodeListener)\n })\n }, [cy, nodeListener])\n\n return [hoveredNode, setHoveredNode]\n}\n","import { useModuleFromNode } from '@xyo-network/react-node'\nimport { NodeSingular } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { useCytoscapeElements } from './useCytoscapeElements'\n\nexport const useNewElements = (selectedElement?: NodeSingular) => {\n const selectedAddress = useMemo(() => {\n const { address: selectedAddress } = selectedElement?.data() ?? {}\n return selectedAddress\n }, [selectedElement])\n\n const [module] = useModuleFromNode(selectedAddress)\n const newElements = useCytoscapeElements(module)\n\n return newElements\n}\n","import { CollectionReturnValue, ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts'\nimport { ColaLayout } from '../../../Cytoscape'\n\nexport const useRenderNewElements = (newElements: ElementDefinition[] = [], hideLabels?: boolean) => {\n const { cy } = useCytoscapeInstance(true)\n const [renderedElements, setRenderedElements] = useState<CollectionReturnValue>()\n\n useEffect(() => {\n if (newElements.length > 1) {\n const renderedElements = cy?.add(newElements)\n setRenderedElements(renderedElements)\n cy?.layout(ColaLayout).run()\n }\n }, [cy, hideLabels, newElements])\n\n return renderedElements\n}\n","import { NodeSingular } from 'cytoscape'\nimport { useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts'\n\nexport const useSelectedElement = () => {\n const [selectedElement, setSelectedElement] = useState<NodeSingular>()\n const { cy } = useCytoscapeInstance(true)\n\n const updateStyles = (element: NodeSingular) => {\n const nodes = cy?.nodes()\n nodes?.toggleClass('activeNode', false)\n element.toggleClass('activeNode', true)\n }\n\n const toggleSelectedElement = (address?: string) => {\n const selectedNode = cy?.nodes(`[id=\"${address}\"]`)?.[0]\n if (selectedNode) {\n setSelectedElement(selectedNode)\n updateStyles(selectedNode)\n }\n }\n\n return { selectedElement, toggleSelectedElement }\n}\n","import { useHoveredNode } from './useHoveredNode'\nimport { useNewElements } from './useNewElements'\nimport { useRenderNewElements } from './useRenderNewElements'\nimport { useSelectedElement } from './useSelectedElement'\n\nexport const useElements = (hideLabels: boolean) => {\n const { selectedElement, toggleSelectedElement } = useSelectedElement()\n const newElements = useNewElements(selectedElement)\n const renderedElements = useRenderNewElements(newElements, hideLabels)\n const [hoveredNode, setHoveredNode] = useHoveredNode(renderedElements)\n\n return { hoveredNode, setHoveredNode, toggleSelectedElement }\n}\n","import { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useCytoscapeOptions = (\n elements: CytoscapeOptions['elements'],\n style?: CytoscapeOptions['style'],\n layout?: CytoscapeOptions['layout'],\n) => {\n const defaultStyle = useCytoscapeStyle()\n\n const resolvedLayout = layout ?? ConcentricLayout\n const resolvedStyle = style ?? defaultStyle\n\n const options = useMemo<CytoscapeOptions | undefined>(() => {\n if (elements && resolvedLayout && resolvedStyle) {\n return {\n elements,\n layout: resolvedLayout,\n style: resolvedStyle,\n }\n }\n }, [elements, layout, style])\n\n return options\n}\n","import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, Node, NodeAsRoot, NodeWithName } from '../../Cytoscape'\nimport { useIcons } from './useIcons'\n\nexport const useCytoscapeStyle = (hideLabels = false) => {\n const theme = useTheme()\n const icons = useIcons()\n\n const style: CytoscapeOptions['style'] = useMemo(\n () => [\n Node(icons, theme.palette.primary.main, hideLabels),\n NodeWithName(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),\n NodeAsRoot(theme.palette.secondary.main),\n EdgeStyled(theme.palette.divider, theme.palette.divider),\n ],\n [icons, hideLabels, theme],\n )\n\n return style\n}\n","import { useTheme } from '@mui/material'\nimport { useMemo } from 'react'\n\nimport { CyIconSet, CyNodeModuleTypes, encodeSvg, generateIconMap } from '../../Cytoscape'\n\nexport const useIcons = () => {\n const theme = useTheme()\n const icons = useMemo(() => {\n const iconMap = generateIconMap()\n // eslint-disable-next-line unicorn/no-array-reduce\n return Object.entries(CyIconSet).reduce((acc, [name, IconComponent]) => {\n const icon = <IconComponent fontSize=\"small\" />\n acc[name as CyNodeModuleTypes] = encodeSvg(icon, theme.palette.getContrastText(theme.palette.text.primary))\n return acc\n }, iconMap)\n }, [theme.palette])\n\n return icons\n}\n","import { usePromise } from '@xylabs/react-promise'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts'\n\nexport const useModuleDetails = (rootModule?: ModuleInstance | null, onFoundModule?: () => void) => {\n const { cy } = useCytoscapeInstance()\n const [moduleAddress, setModuleAddress] = useState<string | null>()\n\n const [foundModule] = usePromise(async () => {\n if (moduleAddress === null) return null\n if (moduleAddress && rootModule) {\n const foundModule = await rootModule.resolve(moduleAddress)\n return foundModule ?? null\n }\n }, [moduleAddress, rootModule])\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver(() => {\n if (moduleAddress === null) {\n // cytoscape tries to center prematurely without it :(\n setTimeout(() => cy?.center(), 100)\n } else if (foundModule && cy) {\n const node = cy.nodes(`[id=\"${moduleAddress}\"]`)?.[0]\n // cy.pan(newPan)\n // cytoscape tries to center prematurely without it :(\n setTimeout(() => cy.center(node), 100)\n }\n })\n\n const container = cy?.container()\n if (container) {\n resizeObserver.observe(container)\n }\n\n return () => {\n if (container) resizeObserver.unobserve(container)\n }\n }, [cy, moduleAddress, foundModule, rootModule?.address])\n\n useEffect(() => {\n if (foundModule) {\n onFoundModule?.()\n }\n }, [cy, moduleAddress, foundModule, onFoundModule])\n\n const onModuleDetails = (address?: string | null) => {\n const moduleNode = cy?.nodes(`[id=\"${address}\"]`)\n const rootModuleNode = cy?.nodes(`[id=\"${rootModule?.address}\"]`)\n const foundModuleNode = cy?.nodes(`[id=\"${foundModule?.address}\"]`)\n const notModuleNode = cy?.nodes(`[id != \"${address}\"]`)\n\n if (address) {\n // address was passed so we set the node to active styles\n moduleNode?.toggleClass('activeNode', true)\n notModuleNode?.toggleClass('activeNode', false)\n } else {\n // no address was passes so we reset the state\n notModuleNode?.toggleClass('activeNode', false)\n const activeNode = foundModuleNode?.length ? foundModuleNode : rootModuleNode\n activeNode?.toggleClass('activeNode', true)\n }\n setModuleAddress(address)\n }\n\n return { module: foundModule, onModuleDetails }\n}\n","import { ModuleInstance } from '@xyo-network/module-model'\nimport { useState } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeElements } from './elements'\nimport { useCytoscapeOptions } from './useCytoscapeOptions'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useRelationalGraphOptions = (module?: ModuleInstance) => {\n const [hideLabels, setHideLabels] = useState(true)\n\n const handleToggleLabels = () => {\n setHideLabels((oldValue) => !oldValue)\n }\n\n const elements = useCytoscapeElements(module)\n const style = useCytoscapeStyle(hideLabels)\n const options = useCytoscapeOptions(elements, style, ConcentricLayout)\n\n return { handleToggleLabels, hideLabels, options }\n}\n","import { use } from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport coseBilkent from 'cytoscape-cose-bilkent'\nimport dagre from 'cytoscape-dagre'\nimport euler from 'cytoscape-euler'\nimport fcose from 'cytoscape-fcose'\nimport { PropsWithChildren, useEffect, useState } from 'react'\n\nexport const WithExtensions: React.FC<PropsWithChildren> = ({ children }) => {\n const [initialized, setInitialized] = useState(false)\n useEffect(() => {\n use(cola)\n use(fcose)\n use(dagre)\n use(coseBilkent)\n use(euler)\n setInitialized(true)\n }, [])\n\n return <>{initialized ? children : undefined}</>\n}\n","import { Button, ButtonGroup, useTheme } from '@mui/material'\nimport { FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport cytoscape, { Core } from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport coseBilkentLayout from 'cytoscape-cose-bilkent'\nimport dagre from 'cytoscape-dagre'\nimport eulerLayout from 'cytoscape-euler'\nimport fcose from 'cytoscape-fcose'\nimport { forwardRef, useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts'\nimport { NodeRelationalGraphProps } from '../../lib'\n\nconst applyLayout = (cy?: cytoscape.Core, name = 'cola', options?: object) => {\n cy?.layout({ name, ...options }).run()\n}\n\nconst loadLayout = (layout = 'cola') => {\n switch (layout) {\n case 'dagre': {\n cytoscape.use(dagre)\n break\n }\n case 'euler': {\n cytoscape.use(eulerLayout)\n break\n }\n case 'cose-bilkent': {\n cytoscape.use(coseBilkentLayout)\n break\n }\n case 'fcose': {\n cytoscape.use(fcose)\n break\n }\n case 'cola': {\n cytoscape.use(cola)\n break\n }\n }\n}\n\nexport const NodeRelationalGraphFlexBox = forwardRef<HTMLDivElement, NodeRelationalGraphProps>(\n ({ actions, children, layout, layoutOptions, showDetails, detail, options, ...props }, ref) => {\n const theme = useTheme()\n const [cy, setCy] = useState<Core>()\n const { setCy: setCyContext } = useCytoscapeInstance()\n const sharedRef = useShareForwardedRef(ref)\n\n const handleReset = () => {\n cy?.reset()\n applyLayout(cy, layout ?? 'euler', layoutOptions)\n }\n\n useEffect(() => {\n let newCy: Core | undefined\n if (sharedRef) {\n loadLayout(layout)\n newCy = cytoscape({\n container: sharedRef.current,\n ...options,\n })\n applyLayout(newCy, layout ?? 'euler', layoutOptions)\n setCy(newCy)\n }\n return () => {\n newCy?.destroy()\n setCy(undefined)\n }\n }, [options, sharedRef, layoutOptions, layout])\n\n useEffect(() => {\n setCyContext?.(cy)\n }, [cy, setCyContext])\n\n return (\n <FlexCol id=\"relational-graph-wrapper\" {...props}>\n <FlexRow justifyContent=\"start\" width=\"100%\">\n {actions === null ?\n null\n : actions ?\n <ButtonGroup>\n {actions}\n <Button size={'small'} variant={'contained'} onClick={handleReset}>\n Reset View\n </Button>\n </ButtonGroup>\n : <Button size={'small'} variant={'contained'} onClick={handleReset}>\n Reset\n </Button>\n }\n </FlexRow>\n <FlexGrowRow width=\"100%\" alignItems=\"start\">\n {showDetails ?\n <FlexCol height=\"100%\" width={'85%'}>\n {detail}\n </FlexCol>\n : null}\n <FlexCol\n justifyContent=\"start\"\n classes=\"cytoscape-wrap\"\n width={showDetails ? '15%' : '100%'}\n height={showDetails ? '50%' : '100%'}\n border={showDetails ? `1px solid ${theme.palette.divider}` : undefined}\n >\n {/* Cytoscape Element */}\n <FlexCol alignItems=\"stretch\" position=\"absolute\" width=\"100%\" height=\"100%\" ref={sharedRef} />\n {children}\n </FlexCol>\n </FlexGrowRow>\n </FlexCol>\n )\n },\n)\n\nNodeRelationalGraphFlexBox.displayName = 'NodeRelationalGraph'\n\n/** @deprecated */\nexport const NodeRelationalGraph = NodeRelationalGraphFlexBox\n","import { AccountInstance } from '@xyo-network/account-model'\nimport { NodeInstance } from '@xyo-network/node-model'\nimport { useProvidedNode } from '@xyo-network/react-node'\n\nimport { useCytoscapeElements, useCytoscapeOptions } from '../../../hooks'\nimport { NodeRelationalGraphProps } from '../../lib'\nimport { NodeRelationalGraphFlexBox } from './Graph'\n\nexport interface ProvidedNodeRendererProps extends NodeRelationalGraphProps {\n account?: AccountInstance\n layout?: 'dagre' | 'euler' | 'fcose' | 'cose-bilkent' | 'cola'\n layoutOptions?: object\n node?: NodeInstance\n}\n\nexport const ProvidedNodeRenderer: React.FC<ProvidedNodeRendererProps> = ({ node, ...props }) => {\n const [providedNode] = useProvidedNode()\n const elements = useCytoscapeElements(node ?? providedNode)\n const options = useCytoscapeOptions(elements)\n\n return <NodeRelationalGraphFlexBox alignItems=\"stretch\" flexGrow={1} height=\"100%\" options={options} {...props} />\n}\n","import { CancelRounded } from '@mui/icons-material'\nimport { IconButton } from '@mui/material'\nimport { FlexBoxProps, FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\n\nexport interface DetailsFlexboxProps extends FlexBoxProps {\n onClose?: () => void\n}\n\nexport const DetailsFlexbox: React.FC<DetailsFlexboxProps> = ({ children, onClose }) => {\n return (\n <FlexGrowCol alignItems=\"end\" justifyContent=\"start\" id=\"module-detail\" width=\"100%\" p={2} gap={2}>\n <FlexRow justifyContent=\"end\">\n <IconButton onClick={onClose} size={'small'}>\n <CancelRounded />\n </IconButton>\n </FlexRow>\n {children}\n </FlexGrowCol>\n )\n}\n","import { PopperProps, styled } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { NodeSingular } from 'cytoscape'\nimport { ReactElement } from 'react'\n\nimport { useNodeElement } from './hooks'\n\nexport interface ModuleHoverProps {\n children?: (anchorElement?: PopperProps['anchorEl'], container?: PopperProps['container']) => ReactElement\n node?: NodeSingular\n}\n\nexport const ModuleGraphNodeHover: React.FC<ModuleHoverProps> = ({ children, node }) => {\n const { boundingBox, ref, currentElement } = useNodeElement(node)\n\n return (\n <>\n <StyledNodeGhostElementFlexCol ref={ref} left={boundingBox?.x1} height={boundingBox?.h} top={boundingBox?.y1} width={boundingBox?.w} />\n {node ?\n <>{children?.(currentElement)}</>\n : null}\n </>\n )\n}\n\nconst StyledNodeGhostElementFlexCol = styled(FlexCol, { name: 'StyledNodeGhostElementFlexCol' })(() => ({\n // For easier debugging of the 'ghost' element that matches the hovered cytoscape node\n // backgroundColor: '#fff',\n // opacity: 0.25,\n\n // eslint-disable-next-line sort-keys-fix/sort-keys-fix\n cursor: 'pointer',\n pointerEvents: 'none',\n position: 'absolute',\n}))\n","import { PopperProps } from '@mui/material'\nimport { NodeSingular } from 'cytoscape'\nimport { useEffect, useRef, useState } from 'react'\n\nexport const useNodeElement = (node?: NodeSingular) => {\n const ref = useRef<HTMLDivElement>(null)\n const [currentElement, setCurrentElement] = useState<PopperProps['anchorEl'] | null>(null)\n const [boundingBox, setBoundingBox] = useState(node?.renderedBoundingBox())\n\n // Ensure first render clears the previous element when node changes to avoid flicker\n useEffect(() => {\n setCurrentElement(null)\n }, [node])\n\n useEffect(() => {\n if (node) {\n setBoundingBox(node.renderedBoundingBox())\n }\n\n const listener = () => {\n setBoundingBox(node?.renderedBoundingBox())\n }\n\n node?.on('position', listener)\n\n return () => {\n node?.off('position', undefined, listener)\n }\n }, [node])\n\n // Once boundingBox state is set and applied to the layout, update the ref\n useEffect(() => {\n setCurrentElement(ref.current)\n }, [boundingBox])\n\n return { boundingBox, currentElement, ref }\n}\n","import { CancelRounded } from '@mui/icons-material'\nimport { Button, Card, CardActions, CardHeader, IconButton, Paper, Popper, PopperProps, styled } from '@mui/material'\nimport { Identicon } from '@xylabs/react-identicon'\nimport { NodeSingular } from 'cytoscape'\n\nexport interface ModuleHoverPopperProps extends PopperProps {\n node?: NodeSingular\n onClose?: () => void\n onModuleDetails?: (address?: string) => void\n onModuleExplore?: (address?: string) => void\n}\n\nexport const ModuleHoverPopper: React.FC<ModuleHoverPopperProps> = ({ anchorEl, onClose, onModuleDetails, onModuleExplore, node, ...props }) => {\n const { address, name } = node?.data() ?? {}\n return (\n <>\n {anchorEl ?\n <Popper anchorEl={anchorEl} {...props}>\n <Card elevation={3}>\n <CardHeader\n action={\n onClose ?\n <IconButton size=\"small\" onClick={onClose}>\n <CancelRounded />\n </IconButton>\n : null\n }\n avatar={\n <Paper elevation={6} sx={{ bgcolor: '#fff', p: 1 }}>\n <Identicon value={address} size={24} />\n </Paper>\n }\n title={name}\n subheader={address}\n />\n <StyledCardActions>\n {onModuleDetails ?\n <Button onClick={() => onModuleDetails?.(address)} size=\"small\" variant=\"contained\">\n Details\n </Button>\n : null}\n {onModuleExplore ?\n <Button onClick={() => onModuleExplore?.(address)} size=\"small\" variant=\"contained\">\n Explore\n </Button>\n : null}\n </StyledCardActions>\n </Card>\n </Popper>\n : null}\n </>\n )\n}\n\nexport const StyledModuleHoverPopper = styled(ModuleHoverPopper, { name: 'StyledComponents' })(() => ({\n zIndex: 2,\n}))\n\nexport const StyledCardActions = styled(CardActions, { name: 'StyledCardActions' })(() => ({\n display: 'flex',\n justifyContent: 'center',\n}))\n"],"mappings":"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","names":["Button","useRef","jsx","isNodeInstance","useEffect","useState","isArchivistInstance","isDivinerInstance","useState","useEffect","isNodeInstance","useEffect","useState","useState","useEffect","selectedAddress","useEffect","useState","useState","useEffect","renderedElements","useState","useState","useMemo","useTheme","useMemo","useMemo","jsx","useMemo","useTheme","useMemo","useMemo","useEffect","useState","useState","foundModule","useEffect","useState","useState","useEffect","useState","jsx","useTheme","cola","dagre","fcose","useEffect","useState","jsx","dagre","fcose","cola","useTheme","useState","useEffect","jsx","FlexRow","jsx","jsxs","FlexCol","useEffect","useState","Fragment","jsx","jsxs","FlexCol","CancelRounded","Button","IconButton","styled","Fragment","jsx","jsxs","jsx","useRef","Button"]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/module/CardParser.tsx","../../src/components/module/graph/GraphFlexBox.tsx","../../src/contexts/CytoscapeInstance/Context.ts","../../src/contexts/CytoscapeInstance/Provider.tsx","../../src/contexts/CytoscapeInstance/use.ts","../../src/hooks/cytoscape/elements/useCytoscapeElements.ts","../../src/Cytoscape/CytoscapeElements.ts","../../src/Cytoscape/lib/encodeSvg.ts","../../src/Cytoscape/lib/iconMap.ts","../../src/Cytoscape/lib/layout/ColaLayout.ts","../../src/Cytoscape/lib/layout/ConcentricLayout.ts","../../src/Cytoscape/lib/parseModuleType.ts","../../src/Cytoscape/CytoscapeIcons.tsx","../../src/Cytoscape/CytoscapeStyles.ts","../../src/hooks/cytoscape/elements/useHoveredNode.tsx","../../src/hooks/cytoscape/elements/useNewElements.tsx","../../src/hooks/cytoscape/elements/useRenderNewElements.tsx","../../src/hooks/cytoscape/elements/useSelectedElement.tsx","../../src/hooks/cytoscape/elements/useElements.tsx","../../src/hooks/cytoscape/useCytoscapeOptions.ts","../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../src/hooks/cytoscape/useIcons.tsx","../../src/hooks/cytoscape/useModuleDetails.tsx","../../src/hooks/cytoscape/useRelationalGraphOptions.tsx","../../src/components/cytoscape-extensions/WithExtensions.tsx","../../src/components/relational/graph/Graph.tsx","../../src/components/relational/graph/ProvidedNodeRenderer.tsx","../../src/components/module/graph/DetailsFlexbox.tsx","../../src/components/module/graph/node/Hover.tsx","../../src/components/module/graph/node/hooks/useNodeElement.tsx","../../src/components/module/graph/Popper.tsx"],"sourcesContent":["import { asArchivistInstance, isArchivistInstance } from '@xyo-network/archivist-model'\nimport { asDivinerInstance, isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { ArchivistCard } from '@xyo-network/react-archivist'\nimport { DivinerCard, ModuleCard } from '@xyo-network/react-module'\n\nexport interface ModuleCardParserProps {\n module?: ModuleInstance\n}\n\nexport const ModuleCardParser: React.FC<ModuleCardParserProps> = ({ module }) => {\n switch (true) {\n case isArchivistInstance(module): {\n return <ArchivistCard module={asArchivistInstance(module)} />\n }\n case isDivinerInstance(module): {\n return <DivinerCard module={asDivinerInstance(module)} />\n }\n default: {\n return <ModuleCard module={module} />\n }\n }\n}\n","import { Button } from '@mui/material'\nimport { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { useRef } from 'react'\n\nimport { CytoscapeInstanceProvider } from '../../../contexts'\nimport { useElements, useModuleDetails, useRelationalGraphOptions } from '../../../hooks'\nimport { WithExtensions } from '../../cytoscape-extensions'\nimport { NodeRelationalGraphFlexBox } from '../../relational'\nimport { DetailsFlexbox } from './DetailsFlexbox'\nimport { ModuleGraphNodeHover } from './node'\nimport { StyledModuleHoverPopper } from './Popper'\n\nexport interface ModuleGraphFlexBoxProps extends FlexBoxProps {\n disableModuleDetails?: boolean\n layout?: 'dagre' | 'euler' | 'cose-bilkent' | 'cola'\n layoutOptions?: object\n rootModule?: ModuleInstance | null\n}\n\nexport const ModuleGraphFlexBox: React.FC<ModuleGraphFlexBoxProps> = ({ rootModule, disableModuleDetails, ...props }) => {\n const cytoscapeRef = useRef<HTMLDivElement>(null)\n const { handleToggleLabels, hideLabels, options } = useRelationalGraphOptions(rootModule ?? undefined)\n const { hoveredNode, setHoveredNode, toggleSelectedElement } = useElements(hideLabels)\n\n const { module, onModuleDetails } = useModuleDetails(rootModule, () => setHoveredNode(undefined))\n\n return (\n <WithExtensions>\n <NodeRelationalGraphFlexBox\n actions={\n module ? null : (\n <Button size={'small'} onClick={handleToggleLabels} variant=\"contained\">\n Toggle Labels\n </Button>\n )\n }\n showDetails={!!module}\n detail={<DetailsFlexbox onClose={() => onModuleDetails(null)} />}\n options={options}\n ref={cytoscapeRef}\n width=\"100%\"\n {...props}\n >\n <ModuleGraphNodeHover node={hoveredNode}>\n {(element) => (\n <StyledModuleHoverPopper\n anchorEl={element}\n container={cytoscapeRef.current}\n node={hoveredNode}\n onClose={() => setHoveredNode(undefined)}\n onModuleExplore={toggleSelectedElement}\n onModuleDetails={disableModuleDetails ? undefined : onModuleDetails}\n placement={'top'}\n open\n />\n )}\n </ModuleGraphNodeHover>\n </NodeRelationalGraphFlexBox>\n </WithExtensions>\n )\n}\n\nexport const ModuleGraphFlexBoxWithProvider: React.FC<ModuleGraphFlexBoxProps> = (props) => {\n return (\n <CytoscapeInstanceProvider>\n <ModuleGraphFlexBox {...props} />\n </CytoscapeInstanceProvider>\n )\n}\n","import { createContextEx } from '@xyo-network/react-shared'\n\nimport { CytoscapeInstanceState } from './State'\n\nexport const CytoscapeInstanceContext = createContextEx<CytoscapeInstanceState>()\n","import type { WithChildren } from '@xylabs/react-shared'\nimport { Core } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeInstanceContext } from './Context'\n\nexport interface CytoscapeInstanceProviderProps extends WithChildren {\n defaultInstance?: WeakRef<Core>\n}\n\nexport const CytoscapeInstanceProvider: React.FC<CytoscapeInstanceProviderProps> = ({ children, defaultInstance }) => {\n const [cy, setCy] = useState<WeakRef<Core> | undefined>(defaultInstance)\n useEffect(() => {\n setCy(defaultInstance)\n }, [defaultInstance])\n\n return <CytoscapeInstanceContext.Provider value={{ cy, provided: true, setCy }}>{children}</CytoscapeInstanceContext.Provider>\n}\n","import { useContextEx } from '@xyo-network/react-shared'\n\nimport { CytoscapeInstanceContext } from './Context'\n\nexport const useCytoscapeInstance = (required = false) => useContextEx(CytoscapeInstanceContext, 'CytoscapeInstance', required)\n","import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction } from '@xyo-network/module-events'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../../Cytoscape'\n\nexport const useCytoscapeElements = (module?: ModuleInstance | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async () => {\n if (module) {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n }\n },\n [module],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined\n let detachedListener: EventUnsubscribeFunction | undefined\n\n if (module && isNodeInstance(module)) {\n attachedListener = module.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n detachedListener = module.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [module])\n\n return elements\n}\n","import { exists } from '@xylabs/exists'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib'\n\ninterface ModuleInfo {\n children: ModuleInfo[]\n depth: number\n module: ModuleInstance\n}\n\nexport const CytoscapeElements = {\n MaxNameLength: 20,\n\n buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition, properties?: { [key: string]: unknown }) {\n return {\n data: {\n id: `${rootNode.data.id}/${newNode.data.id}`,\n source: rootNode.data.id,\n target: newNode.data.id,\n ...properties,\n },\n }\n },\n\n async buildElements(module: ModuleInstance): Promise<ElementDefinition[]> {\n const info = await CytoscapeElements.recurseNodes(module)\n const newElements: ElementDefinition[] = await this.buildElementsFromInfo(info, undefined, ['activeNode'])\n\n return newElements\n },\n\n async buildElementsFromInfo(info: ModuleInfo, root?: ElementDefinition, classes: string[] = []): Promise<ElementDefinition[]> {\n const newNode = CytoscapeElements.buildNode(info.module, { childCount: info.children.length, depth: info.depth }, classes)\n const newEdge = root ? CytoscapeElements.buildEdge(root, newNode, { depth: info.depth, siblingCount: info.children.length }) : undefined\n const newElements: ElementDefinition[] = [newNode]\n if (newEdge) {\n newElements.push(newEdge)\n }\n\n for (const childInfo of info.children) {\n newElements.push(...(await this.buildElementsFromInfo(childInfo, newNode)))\n }\n\n return newElements\n },\n\n buildNode(module: ModuleInstance, properties?: { [key: string]: unknown }, classes?: string[]): ElementDefinition {\n const { address, id } = module\n return {\n classes,\n data: {\n address,\n id: address,\n name: id,\n type: parseModuleType(module),\n ...properties,\n },\n }\n },\n\n buildRootNode: (module: ModuleInstance): ElementDefinition => {\n return CytoscapeElements.buildNode(module, {}, ['activeNode'])\n },\n\n normalizeName(name?: string) {\n if (!name) return\n if (name.length > this.MaxNameLength) return `${name.slice(0, 20)}...`\n return name\n },\n\n async recurseNodes(root: ModuleInstance, maxDepth = 10, depth = 1): Promise<ModuleInfo> {\n const info: ModuleInfo = { children: [], depth, module: root }\n\n if (maxDepth > 0) {\n const children = await root.resolve('*', { direction: 'down', maxDepth: 1 })\n info.children = (\n await Promise.all(\n children.map(async (child) => {\n // don't re add the root module that was passed in\n if (child.address !== root.address) {\n return await this.recurseNodes(child, maxDepth - 1, depth + 1)\n }\n }),\n )\n ).filter(exists)\n }\n\n return info\n },\n}\n","import { ReactElement } from 'react'\n// eslint-disable-next-line import/no-internal-modules\nimport { renderToStaticMarkup } from 'react-dom/server'\n\nconst dataUri = 'data:image/svg+xml,'\n\nexport const encodeSvg = (reactElement: ReactElement, color?: string) => {\n const svgString = renderToStaticMarkup(reactElement)\n\n const doc = new DOMParser().parseFromString(svgString, 'text/html')\n const svgElement = doc.querySelectorAll('svg')[0]\n if (svgElement) {\n svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg')\n svgElement.setAttribute('height', '100')\n svgElement.style.fill = color ?? 'black'\n }\n\n return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`\n}\n","import { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n module: '',\n node: '',\n sentinel: '',\n witness: '',\n})\n","export const ColaLayout = {\n centerGraph: false,\n convergenceThreshold: 0.01,\n name: 'cola',\n}\n","import { LayoutOptions } from 'cytoscape'\n\nexport const ConcentricLayout: LayoutOptions = {\n concentric: function (node) {\n return node.degree()\n },\n levelWidth: function () {\n return 2\n },\n minNodeSpacing: 75,\n name: 'concentric',\n}\n","import { isArchivistInstance } from '@xyo-network/archivist-model'\nimport { isBridgeInstance } from '@xyo-network/bridge-model'\nimport { isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { isSentinelInstance } from '@xyo-network/sentinel-model'\nimport { isWitnessModule } from '@xyo-network/witness-model'\n\nimport { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const parseModuleType = (module?: ModuleInstance): CyNodeModuleTypes => {\n let type: CyNodeModuleTypes = 'module'\n if (module) {\n if (isArchivistInstance(module)) {\n type = 'archivist'\n } else if (isBridgeInstance(module)) {\n type = 'bridge'\n } else if (isDivinerInstance(module)) {\n type = 'diviner'\n } else if (isNodeInstance(module)) {\n type = 'node'\n } else if (isSentinelInstance(module)) {\n type = 'sentinel'\n } else if (isWitnessModule(module)) {\n type = 'witness'\n } else {\n type = 'module'\n }\n }\n return type\n}\n","import {\n BubbleChartRounded as BubbleChartRoundedIcon,\n Hub as HubIcon,\n InsertLinkRounded as InsertLinkRoundedIcon,\n Inventory2Rounded as Inventory2RoundedIcon,\n QuestionMarkRounded as QuestionMarkRoundedIcon,\n TimerRounded as TimerRoundedIcon,\n VisibilityRounded as VisibilityRoundedIcon,\n} from '@mui/icons-material'\nimport { SvgIconTypeMap } from '@mui/material'\n// eslint-disable-next-line import/no-internal-modules\nimport { OverridableComponent } from '@mui/material/OverridableComponent'\n\nimport { CyNodeModuleTypes } from './lib'\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import { Stylesheet } from 'cytoscape'\n\nimport { CyNodeModuleTypes } from './lib'\n\nexport const NodeWithName = (color?: string, outlineColor?: string): Stylesheet => ({\n selector: 'node[name]',\n style: {\n color,\n 'font-family': 'Lexend Deca, Helvetica, sans-serif',\n 'font-size': 12,\n 'overlay-padding': '6px',\n 'text-halign': 'center',\n 'text-outline-color': outlineColor,\n 'text-outline-width': '1px',\n 'text-valign': 'top',\n },\n})\n\nexport const Node = (icons: Record<CyNodeModuleTypes, string>, bgColor?: string, hideLabels = false): Stylesheet => ({\n selector: 'node',\n style: {\n 'background-color': bgColor,\n 'background-height': '75%',\n 'background-image': (elem) => icons[elem.data('type') as CyNodeModuleTypes],\n 'background-width': '24',\n label: hideLabels ? undefined : 'data(name)',\n shape: 'round-rectangle',\n },\n})\n\nexport const NodeAsRoot = (bgColor?: string) => ({\n selector: '.activeNode',\n style: {\n 'background-color': bgColor,\n },\n})\n\nexport const EdgeStyled = (lineColor?: string, targetArrowColor?: string) => ({\n selector: 'edge',\n style: {\n 'curve-style': 'bezier',\n 'line-color': lineColor,\n 'line-opacity': 0.1,\n 'target-arrow-color': targetArrowColor,\n 'target-arrow-shape': 'triangle',\n width: 3,\n },\n})\n","import { NodeCollection, NodeSingular } from 'cytoscape'\nimport { Dispatch, SetStateAction, useCallback, useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts'\n\nexport const useHoveredNode = (renderedElements?: NodeCollection): [NodeSingular | undefined, Dispatch<SetStateAction<NodeSingular | undefined>>] => {\n const { cy } = useCytoscapeInstance(true)\n const [hoveredNode, setHoveredNode] = useState<NodeSingular>()\n\n const nodeListener = useCallback((node: NodeSingular) => {\n node.on('mouseover tap', () => {\n setHoveredNode(node)\n })\n }, [])\n\n useEffect(() => {\n if (renderedElements) {\n // eslint-disable-next-line unicorn/no-array-for-each\n renderedElements.nodes().forEach(nodeListener)\n }\n }, [nodeListener, renderedElements])\n\n useEffect(() => {\n const cyInstance = cy?.deref()\n cyInstance?.ready(() => {\n // eslint-disable-next-line unicorn/no-array-for-each\n cyInstance.nodes().forEach(nodeListener)\n })\n }, [cy, nodeListener])\n\n return [hoveredNode, setHoveredNode]\n}\n","import { useModuleFromNode } from '@xyo-network/react-node'\nimport { NodeSingular } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { useCytoscapeElements } from './useCytoscapeElements'\n\nexport const useNewElements = (selectedElement?: NodeSingular) => {\n const selectedAddress = useMemo(() => {\n const { address: selectedAddress } = selectedElement?.data() ?? {}\n return selectedAddress\n }, [selectedElement])\n\n const [module] = useModuleFromNode(selectedAddress)\n const newElements = useCytoscapeElements(module)\n\n return newElements\n}\n","import { CollectionReturnValue, ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts'\nimport { ColaLayout } from '../../../Cytoscape'\n\nexport const useRenderNewElements = (newElements: ElementDefinition[] = [], hideLabels?: boolean) => {\n const { cy } = useCytoscapeInstance(true)\n const [renderedElements, setRenderedElements] = useState<CollectionReturnValue>()\n\n useEffect(() => {\n const cyInstance = cy?.deref()\n if (newElements.length > 1) {\n const renderedElements = cyInstance?.add(newElements)\n setRenderedElements(renderedElements)\n cyInstance?.layout(ColaLayout).run()\n }\n }, [cy, hideLabels, newElements])\n\n return renderedElements\n}\n","import { NodeSingular } from 'cytoscape'\nimport { useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts'\n\nexport const useSelectedElement = () => {\n const [selectedElement, setSelectedElement] = useState<NodeSingular>()\n const { cy } = useCytoscapeInstance(true)\n\n const updateStyles = (element: NodeSingular) => {\n const cyInstance = cy?.deref()\n const nodes = cyInstance?.nodes()\n nodes?.toggleClass('activeNode', false)\n element.toggleClass('activeNode', true)\n }\n\n const toggleSelectedElement = (address?: string) => {\n const cyInstance = cy?.deref()\n const selectedNode = cyInstance?.nodes(`[id=\"${address}\"]`)?.[0]\n if (selectedNode) {\n setSelectedElement(selectedNode)\n updateStyles(selectedNode)\n }\n }\n\n return { selectedElement, toggleSelectedElement }\n}\n","import { useHoveredNode } from './useHoveredNode'\nimport { useNewElements } from './useNewElements'\nimport { useRenderNewElements } from './useRenderNewElements'\nimport { useSelectedElement } from './useSelectedElement'\n\nexport const useElements = (hideLabels: boolean) => {\n const { selectedElement, toggleSelectedElement } = useSelectedElement()\n const newElements = useNewElements(selectedElement)\n const renderedElements = useRenderNewElements(newElements, hideLabels)\n const [hoveredNode, setHoveredNode] = useHoveredNode(renderedElements)\n\n return { hoveredNode, setHoveredNode, toggleSelectedElement }\n}\n","import { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useCytoscapeOptions = (\n elements: CytoscapeOptions['elements'],\n style?: CytoscapeOptions['style'],\n layout?: CytoscapeOptions['layout'],\n) => {\n const defaultStyle = useCytoscapeStyle()\n\n const resolvedLayout = layout ?? ConcentricLayout\n const resolvedStyle = style ?? defaultStyle\n\n const options = useMemo<CytoscapeOptions | undefined>(() => {\n if (elements && resolvedLayout && resolvedStyle) {\n return {\n elements,\n layout: resolvedLayout,\n style: resolvedStyle,\n }\n }\n }, [elements, layout, style])\n\n return options\n}\n","import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, Node, NodeAsRoot, NodeWithName } from '../../Cytoscape'\nimport { useIcons } from './useIcons'\n\nexport const useCytoscapeStyle = (hideLabels = false) => {\n const theme = useTheme()\n const icons = useIcons()\n\n const style: CytoscapeOptions['style'] = useMemo(\n () => [\n Node(icons, theme.palette.primary.main, hideLabels),\n NodeWithName(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),\n NodeAsRoot(theme.palette.secondary.main),\n EdgeStyled(theme.palette.divider, theme.palette.divider),\n ],\n [icons, hideLabels, theme],\n )\n\n return style\n}\n","import { useTheme } from '@mui/material'\nimport { useMemo } from 'react'\n\nimport { CyIconSet, CyNodeModuleTypes, encodeSvg, generateIconMap } from '../../Cytoscape'\n\nexport const useIcons = () => {\n const theme = useTheme()\n const icons = useMemo(() => {\n const iconMap = generateIconMap()\n // eslint-disable-next-line unicorn/no-array-reduce\n return Object.entries(CyIconSet).reduce((acc, [name, IconComponent]) => {\n const icon = <IconComponent fontSize=\"small\" />\n acc[name as CyNodeModuleTypes] = encodeSvg(icon, theme.palette.getContrastText(theme.palette.text.primary))\n return acc\n }, iconMap)\n }, [theme.palette])\n\n return icons\n}\n","import { usePromise } from '@xylabs/react-promise'\nimport { ModuleInstance } from '@xyo-network/module-model'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts'\n\nexport const useModuleDetails = (rootModule?: ModuleInstance | null, onFoundModule?: () => void) => {\n const { cy } = useCytoscapeInstance()\n const [moduleAddress, setModuleAddress] = useState<string | null>()\n\n const [foundModule] = usePromise(async () => {\n if (moduleAddress === null) return null\n if (moduleAddress && rootModule) {\n const foundModule = await rootModule.resolve(moduleAddress)\n return foundModule ?? null\n }\n }, [moduleAddress, rootModule])\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver(() => {\n const cyInstance = cy?.deref()\n if (moduleAddress === null) {\n // cytoscape tries to center prematurely without it :(\n setTimeout(() => cyInstance?.center(), 100)\n } else if (foundModule && cy) {\n const node = cyInstance?.nodes(`[id=\"${moduleAddress}\"]`)?.[0]\n // cy.pan(newPan)\n // cytoscape tries to center prematurely without it :(\n setTimeout(() => cyInstance?.center(node), 100)\n }\n })\n\n const cyInstance = cy?.deref()\n const container = cyInstance?.container()\n if (container) {\n resizeObserver.observe(container)\n }\n\n return () => {\n if (container) resizeObserver.unobserve(container)\n }\n }, [cy, moduleAddress, foundModule, rootModule?.address])\n\n useEffect(() => {\n if (foundModule) {\n onFoundModule?.()\n }\n }, [cy, moduleAddress, foundModule, onFoundModule])\n\n const onModuleDetails = (address?: string | null) => {\n const cyInstance = cy?.deref()\n const moduleNode = cyInstance?.nodes(`[id=\"${address}\"]`)\n const rootModuleNode = cyInstance?.nodes(`[id=\"${rootModule?.address}\"]`)\n const foundModuleNode = cyInstance?.nodes(`[id=\"${foundModule?.address}\"]`)\n const notModuleNode = cyInstance?.nodes(`[id != \"${address}\"]`)\n\n if (address) {\n // address was passed so we set the node to active styles\n moduleNode?.toggleClass('activeNode', true)\n notModuleNode?.toggleClass('activeNode', false)\n } else {\n // no address was passes so we reset the state\n notModuleNode?.toggleClass('activeNode', false)\n const activeNode = foundModuleNode?.length ? foundModuleNode : rootModuleNode\n activeNode?.toggleClass('activeNode', true)\n }\n setModuleAddress(address)\n }\n\n return { module: foundModule, onModuleDetails }\n}\n","import { ModuleInstance } from '@xyo-network/module-model'\nimport { useState } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeElements } from './elements'\nimport { useCytoscapeOptions } from './useCytoscapeOptions'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useRelationalGraphOptions = (module?: ModuleInstance) => {\n const [hideLabels, setHideLabels] = useState(true)\n\n const handleToggleLabels = () => {\n setHideLabels((oldValue) => !oldValue)\n }\n\n const elements = useCytoscapeElements(module)\n const style = useCytoscapeStyle(hideLabels)\n const options = useCytoscapeOptions(elements, style, ConcentricLayout)\n\n return { handleToggleLabels, hideLabels, options }\n}\n","import { use } from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport coseBilkent from 'cytoscape-cose-bilkent'\nimport dagre from 'cytoscape-dagre'\nimport euler from 'cytoscape-euler'\nimport { PropsWithChildren, useEffect, useState } from 'react'\n\nexport const WithExtensions: React.FC<PropsWithChildren> = ({ children }) => {\n const [initialized, setInitialized] = useState(false)\n useEffect(() => {\n use(cola)\n use(dagre)\n use(coseBilkent)\n use(euler)\n setInitialized(true)\n }, [])\n\n return <>{initialized ? children : undefined}</>\n}\n","import { Button, ButtonGroup, useTheme } from '@mui/material'\nimport { FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport cytoscape, { Core } from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport coseBilkentLayout from 'cytoscape-cose-bilkent'\nimport dagre from 'cytoscape-dagre'\nimport eulerLayout from 'cytoscape-euler'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts'\nimport { NodeRelationalGraphProps } from '../../lib'\n\nconst applyLayout = (cy?: cytoscape.Core, name = 'cola', options?: object) => {\n cy?.layout({ name, ...options }).run()\n}\n\nconst loadLayout = (layout = 'cola') => {\n switch (layout) {\n case 'dagre': {\n cytoscape.use(dagre)\n break\n }\n case 'euler': {\n cytoscape.use(eulerLayout)\n break\n }\n case 'cose-bilkent': {\n cytoscape.use(coseBilkentLayout)\n break\n }\n case 'cola': {\n cytoscape.use(cola)\n break\n }\n }\n}\n\nexport const NodeRelationalGraphFlexBox = forwardRef<HTMLDivElement, NodeRelationalGraphProps>(\n ({ actions, children, layout, layoutOptions, showDetails, detail, options, ...props }, ref) => {\n const theme = useTheme()\n const [cy, setCy] = useState<Core>()\n const { setCy: setCyContext } = useCytoscapeInstance()\n const cytoscapeRef = useRef<HTMLDivElement>()\n\n const handleReset = () => {\n cy?.reset()\n applyLayout(cy, layout ?? 'euler', layoutOptions)\n }\n\n useEffect(() => {\n let newCy: Core | undefined\n const container = cytoscapeRef.current\n if (container) {\n loadLayout(layout)\n newCy = cytoscape({\n container,\n ...options,\n })\n applyLayout(newCy, layout ?? 'euler', layoutOptions)\n setCy(newCy)\n }\n return () => {\n newCy?.destroy()\n setCy(undefined)\n }\n }, [options, cytoscapeRef, layoutOptions, layout])\n\n useEffect(() => {\n setCyContext?.(cy ? new WeakRef(cy) : undefined)\n }, [cy, setCyContext])\n\n return (\n <FlexCol id=\"relational-graph-wrapper\" ref={ref} {...props}>\n <FlexRow justifyContent=\"start\" width=\"100%\">\n {actions === null ?\n null\n : actions ?\n <ButtonGroup>\n {actions}\n <Button size={'small'} variant={'contained'} onClick={handleReset}>\n Reset View\n </Button>\n </ButtonGroup>\n : <Button size={'small'} variant={'contained'} onClick={handleReset}>\n Reset\n </Button>\n }\n </FlexRow>\n <FlexGrowRow width=\"100%\" alignItems=\"start\">\n {showDetails ?\n <FlexCol height=\"100%\" width={'85%'}>\n {detail}\n </FlexCol>\n : null}\n <FlexCol\n justifyContent=\"start\"\n classes=\"cytoscape-wrap\"\n width={showDetails ? '15%' : '100%'}\n height={showDetails ? '50%' : '100%'}\n border={showDetails ? `1px solid ${theme.palette.divider}` : undefined}\n >\n {/* Cytoscape Element */}\n <FlexCol alignItems=\"stretch\" position=\"absolute\" width=\"100%\" height=\"100%\" ref={cytoscapeRef} />\n {children}\n </FlexCol>\n </FlexGrowRow>\n </FlexCol>\n )\n },\n)\n\nNodeRelationalGraphFlexBox.displayName = 'NodeRelationalGraph'\n\n/** @deprecated */\nexport const NodeRelationalGraph = NodeRelationalGraphFlexBox\n","import { AccountInstance } from '@xyo-network/account-model'\nimport { NodeInstance } from '@xyo-network/node-model'\nimport { useProvidedNode } from '@xyo-network/react-node'\n\nimport { useCytoscapeElements, useCytoscapeOptions } from '../../../hooks'\nimport { NodeRelationalGraphProps } from '../../lib'\nimport { NodeRelationalGraphFlexBox } from './Graph'\n\nexport interface ProvidedNodeRendererProps extends NodeRelationalGraphProps {\n account?: AccountInstance\n layout?: 'dagre' | 'euler' | 'cose-bilkent' | 'cola'\n layoutOptions?: object\n node?: NodeInstance\n}\n\nexport const ProvidedNodeRenderer: React.FC<ProvidedNodeRendererProps> = ({ node, ...props }) => {\n const [providedNode] = useProvidedNode()\n const elements = useCytoscapeElements(node ?? providedNode)\n const options = useCytoscapeOptions(elements)\n\n return <NodeRelationalGraphFlexBox alignItems=\"stretch\" flexGrow={1} height=\"100%\" options={options} {...props} />\n}\n","import { CancelRounded } from '@mui/icons-material'\nimport { IconButton } from '@mui/material'\nimport { FlexBoxProps, FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\n\nexport interface DetailsFlexboxProps extends FlexBoxProps {\n onClose?: () => void\n}\n\nexport const DetailsFlexbox: React.FC<DetailsFlexboxProps> = ({ children, onClose }) => {\n return (\n <FlexGrowCol alignItems=\"end\" justifyContent=\"start\" id=\"module-detail\" width=\"100%\" p={2} gap={2}>\n <FlexRow justifyContent=\"end\">\n <IconButton onClick={onClose} size={'small'}>\n <CancelRounded />\n </IconButton>\n </FlexRow>\n {children}\n </FlexGrowCol>\n )\n}\n","import { PopperProps, styled } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { NodeSingular } from 'cytoscape'\nimport { ReactElement } from 'react'\n\nimport { useNodeElement } from './hooks'\n\nexport interface ModuleHoverProps {\n children?: (anchorElement?: PopperProps['anchorEl'], container?: PopperProps['container']) => ReactElement\n node?: NodeSingular\n}\n\nexport const ModuleGraphNodeHover: React.FC<ModuleHoverProps> = ({ children, node }) => {\n const { boundingBox, ref, currentElement } = useNodeElement(node)\n\n return (\n <>\n <StyledNodeGhostElementFlexCol ref={ref} left={boundingBox?.x1} height={boundingBox?.h} top={boundingBox?.y1} width={boundingBox?.w} />\n {node ?\n <>{children?.(currentElement)}</>\n : null}\n </>\n )\n}\n\nconst StyledNodeGhostElementFlexCol = styled(FlexCol, { name: 'StyledNodeGhostElementFlexCol' })(() => ({\n // For easier debugging of the 'ghost' element that matches the hovered cytoscape node\n // backgroundColor: '#fff',\n // opacity: 0.25,\n\n // eslint-disable-next-line sort-keys-fix/sort-keys-fix\n cursor: 'pointer',\n pointerEvents: 'none',\n position: 'absolute',\n}))\n","import { PopperProps } from '@mui/material'\nimport { NodeSingular } from 'cytoscape'\nimport { useEffect, useRef, useState } from 'react'\n\nexport const useNodeElement = (node?: NodeSingular) => {\n const ref = useRef<HTMLDivElement>(null)\n const [currentElement, setCurrentElement] = useState<PopperProps['anchorEl'] | null>(null)\n const [boundingBox, setBoundingBox] = useState(node?.renderedBoundingBox())\n\n // Ensure first render clears the previous element when node changes to avoid flicker\n useEffect(() => {\n setCurrentElement(null)\n }, [node])\n\n useEffect(() => {\n if (node) {\n setBoundingBox(node.renderedBoundingBox())\n }\n\n const listener = () => {\n setBoundingBox(node?.renderedBoundingBox())\n }\n\n node?.on('position', listener)\n\n return () => {\n node?.off('position', undefined, listener)\n }\n }, [node])\n\n // Once boundingBox state is set and applied to the layout, update the ref\n useEffect(() => {\n setCurrentElement(ref.current)\n }, [boundingBox])\n\n return { boundingBox, currentElement, ref }\n}\n","import { CancelRounded } from '@mui/icons-material'\nimport { Button, Card, CardActions, CardHeader, IconButton, Paper, Popper, PopperProps, styled } from '@mui/material'\nimport { Identicon } from '@xylabs/react-identicon'\nimport { NodeSingular } from 'cytoscape'\n\nexport interface ModuleHoverPopperProps extends PopperProps {\n node?: NodeSingular\n onClose?: () => void\n onModuleDetails?: (address?: string) => void\n onModuleExplore?: (address?: string) => void\n}\n\nexport const ModuleHoverPopper: React.FC<ModuleHoverPopperProps> = ({ anchorEl, onClose, onModuleDetails, onModuleExplore, node, ...props }) => {\n const { address, name } = node?.data() ?? {}\n return (\n <>\n {anchorEl ?\n <Popper anchorEl={anchorEl} {...props}>\n <Card elevation={3}>\n <CardHeader\n action={\n onClose ?\n <IconButton size=\"small\" onClick={onClose}>\n <CancelRounded />\n </IconButton>\n : null\n }\n avatar={\n <Paper elevation={6} sx={{ bgcolor: '#fff', p: 1 }}>\n <Identicon value={address} size={24} />\n </Paper>\n }\n title={name}\n subheader={address}\n />\n <StyledCardActions>\n {onModuleDetails ?\n <Button onClick={() => onModuleDetails?.(address)} size=\"small\" variant=\"contained\">\n Details\n </Button>\n : null}\n {onModuleExplore ?\n <Button onClick={() => onModuleExplore?.(address)} size=\"small\" variant=\"contained\">\n Explore\n </Button>\n : null}\n </StyledCardActions>\n </Card>\n </Popper>\n : null}\n </>\n )\n}\n\nexport const StyledModuleHoverPopper = styled(ModuleHoverPopper, { name: 'StyledComponents' })(() => ({\n zIndex: 2,\n}))\n\nexport const StyledCardActions = styled(CardActions, { name: 'StyledCardActions' })(() => ({\n display: 'flex',\n justifyContent: 'center',\n}))\n"],"mappings":"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","names":["Button","useRef","jsx","isNodeInstance","useEffect","useState","isArchivistInstance","isDivinerInstance","useState","useEffect","isNodeInstance","useEffect","useState","useState","useEffect","selectedAddress","useEffect","useState","useState","useEffect","renderedElements","useState","useState","useMemo","useTheme","useMemo","useMemo","jsx","useMemo","useTheme","useMemo","useMemo","useEffect","useState","useState","foundModule","useEffect","cyInstance","useState","useState","useEffect","useState","jsx","useTheme","cola","dagre","useEffect","useState","jsx","dagre","cola","useTheme","useState","useEffect","jsx","FlexRow","jsx","jsxs","FlexCol","useEffect","useRef","useState","Fragment","jsx","jsxs","FlexCol","CancelRounded","Button","IconButton","styled","Fragment","jsx","jsxs","jsx","useRef","Button"]}
|
package/package.json
CHANGED
|
@@ -10,31 +10,30 @@
|
|
|
10
10
|
"url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
|
|
11
11
|
},
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"@xylabs/exists": "^3.
|
|
13
|
+
"@xylabs/exists": "^3.1.7",
|
|
14
14
|
"@xylabs/react-async-effect": "^3.1.6",
|
|
15
15
|
"@xylabs/react-flexbox": "^3.1.6",
|
|
16
16
|
"@xylabs/react-identicon": "^3.1.6",
|
|
17
17
|
"@xylabs/react-promise": "^3.1.6",
|
|
18
18
|
"@xylabs/react-shared": "^3.1.6",
|
|
19
|
-
"@xyo-network/account-model": "^2.94.
|
|
20
|
-
"@xyo-network/archivist-model": "^2.94.
|
|
21
|
-
"@xyo-network/bridge-model": "^2.94.
|
|
22
|
-
"@xyo-network/diviner-model": "^2.94.
|
|
23
|
-
"@xyo-network/module-events": "^2.94.
|
|
24
|
-
"@xyo-network/module-model": "^2.94.
|
|
25
|
-
"@xyo-network/node-model": "^2.94.
|
|
26
|
-
"@xyo-network/react-archivist": "~2.72.
|
|
27
|
-
"@xyo-network/react-module": "~2.72.
|
|
28
|
-
"@xyo-network/react-node": "~2.72.
|
|
29
|
-
"@xyo-network/react-shared": "~2.72.
|
|
30
|
-
"@xyo-network/sentinel-model": "^2.94.
|
|
31
|
-
"@xyo-network/witness-model": "^2.94.
|
|
19
|
+
"@xyo-network/account-model": "^2.94.40",
|
|
20
|
+
"@xyo-network/archivist-model": "^2.94.40",
|
|
21
|
+
"@xyo-network/bridge-model": "^2.94.40",
|
|
22
|
+
"@xyo-network/diviner-model": "^2.94.40",
|
|
23
|
+
"@xyo-network/module-events": "^2.94.40",
|
|
24
|
+
"@xyo-network/module-model": "^2.94.40",
|
|
25
|
+
"@xyo-network/node-model": "^2.94.40",
|
|
26
|
+
"@xyo-network/react-archivist": "~2.72.3",
|
|
27
|
+
"@xyo-network/react-module": "~2.72.3",
|
|
28
|
+
"@xyo-network/react-node": "~2.72.3",
|
|
29
|
+
"@xyo-network/react-shared": "~2.72.3",
|
|
30
|
+
"@xyo-network/sentinel-model": "^2.94.40",
|
|
31
|
+
"@xyo-network/witness-model": "^2.94.40",
|
|
32
32
|
"cytoscape": "^3.28.1",
|
|
33
33
|
"cytoscape-cola": "^2.5.1",
|
|
34
34
|
"cytoscape-cose-bilkent": "^4.1.0",
|
|
35
35
|
"cytoscape-dagre": "^2.5.0",
|
|
36
|
-
"cytoscape-euler": "^1.2.2"
|
|
37
|
-
"cytoscape-fcose": "^2.2.0"
|
|
36
|
+
"cytoscape-euler": "^1.2.2"
|
|
38
37
|
},
|
|
39
38
|
"peerDependencies": {
|
|
40
39
|
"@mui/icons-material": "^5",
|
|
@@ -48,19 +47,18 @@
|
|
|
48
47
|
"@types/cytoscape": "^3.21.0",
|
|
49
48
|
"@types/cytoscape-dagre": "^2.3.3",
|
|
50
49
|
"@types/cytoscape-euler": "^1.2.3",
|
|
51
|
-
"@types/
|
|
52
|
-
"@types/react-dom": "^18.2.24",
|
|
50
|
+
"@types/react-dom": "^18.2.25",
|
|
53
51
|
"@xylabs/ts-scripts-yarn3": "^3.9.0",
|
|
54
52
|
"@xylabs/tsconfig-react": "^3.9.0",
|
|
55
|
-
"@xyo-network/archivist": "^2.94.
|
|
56
|
-
"@xyo-network/bridge-model": "^2.94.
|
|
57
|
-
"@xyo-network/http-bridge": "^2.94.
|
|
58
|
-
"@xyo-network/id-plugin": "^2.91.
|
|
59
|
-
"@xyo-network/node-memory": "^2.94.
|
|
60
|
-
"@xyo-network/react-storybook": "~2.72.
|
|
61
|
-
"@xyo-network/react-wallet": "~2.72.
|
|
62
|
-
"@xyo-network/sentinel": "^2.94.
|
|
63
|
-
"typescript": "^5.4.
|
|
53
|
+
"@xyo-network/archivist": "^2.94.40",
|
|
54
|
+
"@xyo-network/bridge-model": "^2.94.40",
|
|
55
|
+
"@xyo-network/http-bridge": "^2.94.40",
|
|
56
|
+
"@xyo-network/id-plugin": "^2.91.11",
|
|
57
|
+
"@xyo-network/node-memory": "^2.94.40",
|
|
58
|
+
"@xyo-network/react-storybook": "~2.72.3",
|
|
59
|
+
"@xyo-network/react-wallet": "~2.72.3",
|
|
60
|
+
"@xyo-network/sentinel": "^2.94.40",
|
|
61
|
+
"typescript": "^5.4.5"
|
|
64
62
|
},
|
|
65
63
|
"description": "Common React library for all XYO projects that use React",
|
|
66
64
|
"docs": "dist/docs.json",
|
|
@@ -113,6 +111,6 @@
|
|
|
113
111
|
},
|
|
114
112
|
"sideEffects": false,
|
|
115
113
|
"types": "dist/browser/index.d.ts",
|
|
116
|
-
"version": "2.72.
|
|
114
|
+
"version": "2.72.3",
|
|
117
115
|
"type": "module"
|
|
118
116
|
}
|
|
@@ -78,9 +78,9 @@ export const CytoscapeElements = {
|
|
|
78
78
|
info.children = (
|
|
79
79
|
await Promise.all(
|
|
80
80
|
children.map(async (child) => {
|
|
81
|
+
// don't re add the root module that was passed in
|
|
81
82
|
if (child.address !== root.address) {
|
|
82
83
|
return await this.recurseNodes(child, maxDepth - 1, depth + 1)
|
|
83
|
-
// don't re add the root module that was passed in
|
|
84
84
|
}
|
|
85
85
|
}),
|
|
86
86
|
)
|
|
@@ -3,14 +3,12 @@ import cola from 'cytoscape-cola'
|
|
|
3
3
|
import coseBilkent from 'cytoscape-cose-bilkent'
|
|
4
4
|
import dagre from 'cytoscape-dagre'
|
|
5
5
|
import euler from 'cytoscape-euler'
|
|
6
|
-
import fcose from 'cytoscape-fcose'
|
|
7
6
|
import { PropsWithChildren, useEffect, useState } from 'react'
|
|
8
7
|
|
|
9
8
|
export const WithExtensions: React.FC<PropsWithChildren> = ({ children }) => {
|
|
10
9
|
const [initialized, setInitialized] = useState(false)
|
|
11
10
|
useEffect(() => {
|
|
12
11
|
use(cola)
|
|
13
|
-
use(fcose)
|
|
14
12
|
use(dagre)
|
|
15
13
|
use(coseBilkent)
|
|
16
14
|
use(euler)
|
|
@@ -5,7 +5,7 @@ import { PropsWithChildren, ReactNode } from 'react'
|
|
|
5
5
|
export interface NodeRelationalGraphProps extends PropsWithChildren<FlexBoxProps> {
|
|
6
6
|
actions?: ReactNode
|
|
7
7
|
detail?: ReactNode
|
|
8
|
-
layout?: 'dagre' | 'euler' | '
|
|
8
|
+
layout?: 'dagre' | 'euler' | 'cose-bilkent' | 'cola'
|
|
9
9
|
layoutOptions?: object
|
|
10
10
|
options?: CytoscapeOptions
|
|
11
11
|
showDetails?: boolean
|
|
@@ -13,7 +13,7 @@ import { StyledModuleHoverPopper } from './Popper'
|
|
|
13
13
|
|
|
14
14
|
export interface ModuleGraphFlexBoxProps extends FlexBoxProps {
|
|
15
15
|
disableModuleDetails?: boolean
|
|
16
|
-
layout?: 'dagre' | 'euler' | '
|
|
16
|
+
layout?: 'dagre' | 'euler' | 'cose-bilkent' | 'cola'
|
|
17
17
|
layoutOptions?: object
|
|
18
18
|
rootModule?: ModuleInstance | null
|
|
19
19
|
}
|