@xyo-network/react-node-renderer 3.0.15 → 3.0.17

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.
@@ -1 +1 @@
1
- {"version":3,"file":"WithExtensions.d.ts","sourceRoot":"","sources":["../../../../src/components/cytoscape-extensions/WithExtensions.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAC9C,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAWtD,CAAA"}
1
+ {"version":3,"file":"WithExtensions.d.ts","sourceRoot":"","sources":["../../../../src/components/cytoscape-extensions/WithExtensions.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAC9C,OAAO,KAAkB,MAAM,OAAO,CAAA;AAEtC,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAUtD,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"Graph.d.ts","sourceRoot":"","sources":["../../../../../src/components/relational/graph/Graph.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAEN,MAAM,OAAO,CAAA;AAEd,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAA;AAqDlE,eAAO,MAAM,0BAA0B,iGA4GtC,CAAA;AAKD,eAAO,MAAM,mBAAmB,iGAA6B,CAAA"}
1
+ {"version":3,"file":"Graph.d.ts","sourceRoot":"","sources":["../../../../../src/components/relational/graph/Graph.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAEN,MAAM,OAAO,CAAA;AAEd,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAA;AAqDlE,eAAO,MAAM,0BAA0B,iGAiHtC,CAAA;AAKD,eAAO,MAAM,mBAAmB,iGAA6B,CAAA"}
@@ -1,3 +1,3 @@
1
- import type { CollectionReturnValue, ElementDefinition } from 'cytoscape';
2
- export declare const useRenderNewElements: (newElements?: ElementDefinition[], hideLabels?: boolean) => CollectionReturnValue | undefined;
1
+ import type { ElementDefinition } from 'cytoscape';
2
+ export declare const useRenderNewElements: (newElements?: ElementDefinition[], hideLabels?: boolean) => import("cytoscape").CollectionReturnValue | undefined;
3
3
  //# sourceMappingURL=useRenderNewElements.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"useRenderNewElements.d.ts","sourceRoot":"","sources":["../../../../../src/hooks/cytoscape/elements/useRenderNewElements.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAMzE,eAAO,MAAM,oBAAoB,iBAAiB,iBAAiB,EAAE,eAAoB,OAAO,sCAa/F,CAAA"}
1
+ {"version":3,"file":"useRenderNewElements.d.ts","sourceRoot":"","sources":["../../../../../src/hooks/cytoscape/elements/useRenderNewElements.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAMlD,eAAO,MAAM,oBAAoB,iBAAiB,iBAAiB,EAAE,eAAoB,OAAO,0DAU/F,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"useModuleDetails.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useModuleDetails.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAK/D,eAAO,MAAM,gBAAgB,gBAAiB,OAAO,CAAC,cAAc,CAAC,GAAG,IAAI,kBAAkB,MAAM,IAAI;;;;;;;;;;;;;;gCA+CnE,MAAM,GAAG,IAAI;CAoBjD,CAAA"}
1
+ {"version":3,"file":"useModuleDetails.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useModuleDetails.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAO/D,eAAO,MAAM,gBAAgB,gBAAiB,OAAO,CAAC,cAAc,CAAC,GAAG,IAAI,kBAAkB,MAAM,IAAI;;;;;;;;;;;;;;gCAmDnE,MAAM,GAAG,IAAI;CAoBjD,CAAA"}
@@ -360,28 +360,26 @@ var useNewElements = /* @__PURE__ */ __name((selectedElement) => {
360
360
  }, "useNewElements");
361
361
 
362
362
  // src/hooks/cytoscape/elements/useRenderNewElements.tsx
363
- import { useEffect as useEffect3, useState as useState4 } from "react";
363
+ import { useMemo as useMemo3 } from "react";
364
364
  var useRenderNewElements = /* @__PURE__ */ __name((newElements = [], hideLabels) => {
365
365
  const { cy } = useCytoscapeInstance(true);
366
- const [renderedElements, setRenderedElements] = useState4();
367
- useEffect3(() => {
366
+ return useMemo3(() => {
368
367
  if (newElements.length > 1) {
369
- const renderedElements2 = cy?.deref()?.add(newElements);
370
- setRenderedElements(renderedElements2);
368
+ const renderedElements = cy?.deref()?.add(newElements);
371
369
  cy?.deref()?.layout(ColaLayout).run();
370
+ return renderedElements;
372
371
  }
373
372
  }, [
374
373
  cy,
375
374
  hideLabels,
376
375
  newElements
377
376
  ]);
378
- return renderedElements;
379
377
  }, "useRenderNewElements");
380
378
 
381
379
  // src/hooks/cytoscape/elements/useSelectedElement.tsx
382
- import { useState as useState5 } from "react";
380
+ import { useState as useState4 } from "react";
383
381
  var useSelectedElement = /* @__PURE__ */ __name(() => {
384
- const [selectedElement, setSelectedElement] = useState5();
382
+ const [selectedElement, setSelectedElement] = useState4();
385
383
  const { cy } = useCytoscapeInstance(true);
386
384
  const updateStyles = /* @__PURE__ */ __name((element) => {
387
385
  const nodes = cy?.deref()?.nodes();
@@ -415,18 +413,18 @@ var useElements = /* @__PURE__ */ __name((hideLabels) => {
415
413
  }, "useElements");
416
414
 
417
415
  // src/hooks/cytoscape/useCytoscapeOptions.ts
418
- import { useMemo as useMemo5 } from "react";
416
+ import { useMemo as useMemo6 } from "react";
419
417
 
420
418
  // src/hooks/cytoscape/useCytoscapeStyle.tsx
421
419
  import { useTheme as useTheme2 } from "@mui/material";
422
- import { useMemo as useMemo4 } from "react";
420
+ import { useMemo as useMemo5 } from "react";
423
421
 
424
422
  // src/hooks/cytoscape/useIcons.tsx
425
423
  import { useTheme } from "@mui/material";
426
- import React3, { useMemo as useMemo3 } from "react";
424
+ import React3, { useMemo as useMemo4 } from "react";
427
425
  var useIcons = /* @__PURE__ */ __name(() => {
428
426
  const theme = useTheme();
429
- const icons = useMemo3(() => {
427
+ const icons = useMemo4(() => {
430
428
  const iconMap = generateIconMap();
431
429
  return Object.entries(CyIconSet).reduce((acc, [name, IconComponent]) => {
432
430
  const icon = /* @__PURE__ */ React3.createElement(IconComponent, {
@@ -445,7 +443,7 @@ var useIcons = /* @__PURE__ */ __name(() => {
445
443
  var useCytoscapeStyle = /* @__PURE__ */ __name((hideLabels = false) => {
446
444
  const theme = useTheme2();
447
445
  const icons = useIcons();
448
- const style = useMemo4(() => [
446
+ const style = useMemo5(() => [
449
447
  Node(icons, theme.palette.primary.main, hideLabels),
450
448
  NodeWithName(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),
451
449
  NodeAsRoot(theme.palette.secondary.main),
@@ -463,7 +461,7 @@ var useCytoscapeOptions = /* @__PURE__ */ __name((elements, style, layout) => {
463
461
  const defaultStyle = useCytoscapeStyle();
464
462
  const resolvedLayout = layout ?? ConcentricLayout;
465
463
  const resolvedStyle = style ?? defaultStyle;
466
- const options = useMemo5(() => {
464
+ const options = useMemo6(() => {
467
465
  if (elements && resolvedLayout && resolvedStyle) {
468
466
  return {
469
467
  elements,
@@ -481,10 +479,10 @@ var useCytoscapeOptions = /* @__PURE__ */ __name((elements, style, layout) => {
481
479
 
482
480
  // src/hooks/cytoscape/useModuleDetails.tsx
483
481
  import { usePromise } from "@xylabs/react-promise";
484
- import { useEffect as useEffect4, useState as useState6 } from "react";
482
+ import { useCallback as useCallback2, useEffect as useEffect3, useState as useState5 } from "react";
485
483
  var useModuleDetails = /* @__PURE__ */ __name((rootModule, onFoundModule) => {
486
484
  const { cy } = useCytoscapeInstance();
487
- const [moduleAddress, setModuleAddress] = useState6();
485
+ const [moduleAddress, setModuleAddress] = useState5();
488
486
  const [foundModule] = usePromise(async () => {
489
487
  if (moduleAddress === null) return null;
490
488
  const rootModuleInstance = rootModule?.deref();
@@ -496,8 +494,8 @@ var useModuleDetails = /* @__PURE__ */ __name((rootModule, onFoundModule) => {
496
494
  moduleAddress,
497
495
  rootModule
498
496
  ]);
499
- useEffect4(() => {
500
- const resizeObserver = new ResizeObserver(() => {
497
+ const createObserver = useCallback2(() => {
498
+ return new ResizeObserver(() => {
501
499
  if (moduleAddress === null) {
502
500
  setTimeout(() => {
503
501
  cy?.deref()?.center();
@@ -509,6 +507,13 @@ var useModuleDetails = /* @__PURE__ */ __name((rootModule, onFoundModule) => {
509
507
  }, 100);
510
508
  }
511
509
  });
510
+ }, [
511
+ cy,
512
+ moduleAddress,
513
+ foundModule
514
+ ]);
515
+ useEffect3(() => {
516
+ const resizeObserver = createObserver();
512
517
  const container = cy?.deref()?.container();
513
518
  if (container) {
514
519
  resizeObserver.observe(container);
@@ -522,7 +527,7 @@ var useModuleDetails = /* @__PURE__ */ __name((rootModule, onFoundModule) => {
522
527
  foundModule,
523
528
  rootModule
524
529
  ]);
525
- useEffect4(() => {
530
+ useEffect3(() => {
526
531
  if (foundModule) {
527
532
  onFoundModule?.();
528
533
  }
@@ -530,7 +535,8 @@ var useModuleDetails = /* @__PURE__ */ __name((rootModule, onFoundModule) => {
530
535
  cy,
531
536
  moduleAddress,
532
537
  foundModule,
533
- onFoundModule
538
+ onFoundModule,
539
+ createObserver
534
540
  ]);
535
541
  const onModuleDetails = /* @__PURE__ */ __name((address) => {
536
542
  const moduleNode = cy?.deref()?.nodes(`[id="${address}"]`);
@@ -554,9 +560,9 @@ var useModuleDetails = /* @__PURE__ */ __name((rootModule, onFoundModule) => {
554
560
  }, "useModuleDetails");
555
561
 
556
562
  // src/hooks/cytoscape/useRelationalGraphOptions.tsx
557
- import { useState as useState7 } from "react";
563
+ import { useState as useState6 } from "react";
558
564
  var useRelationalGraphOptions = /* @__PURE__ */ __name((mod) => {
559
- const [hideLabels, setHideLabels] = useState7(true);
565
+ const [hideLabels, setHideLabels] = useState6(true);
560
566
  const handleToggleLabels = /* @__PURE__ */ __name(() => {
561
567
  setHideLabels((oldValue) => !oldValue);
562
568
  }, "handleToggleLabels");
@@ -576,15 +582,14 @@ import cola from "cytoscape-cola";
576
582
  import coseBilkent from "cytoscape-cose-bilkent";
577
583
  import dagre from "cytoscape-dagre";
578
584
  import euler from "cytoscape-euler";
579
- import React4, { useEffect as useEffect5, useState as useState8 } from "react";
585
+ import React4, { useMemo as useMemo7 } from "react";
580
586
  var WithExtensions = /* @__PURE__ */ __name(({ children }) => {
581
- const [initialized, setInitialized] = useState8(false);
582
- useEffect5(() => {
587
+ const initialized = useMemo7(() => {
583
588
  cytoscape.use(cola);
584
589
  cytoscape.use(dagre);
585
590
  cytoscape.use(coseBilkent);
586
591
  cytoscape.use(euler);
587
- setInitialized(true);
592
+ return true;
588
593
  }, []);
589
594
  return /* @__PURE__ */ React4.createElement(React4.Fragment, null, initialized ? children : void 0);
590
595
  }, "WithExtensions");
@@ -600,7 +605,7 @@ import cola2 from "cytoscape-cola";
600
605
  import coseBilkentLayout from "cytoscape-cose-bilkent";
601
606
  import dagre2 from "cytoscape-dagre";
602
607
  import eulerLayout from "cytoscape-euler";
603
- import React5, { forwardRef, useEffect as useEffect6, useRef, useState as useState9 } from "react";
608
+ import React5, { forwardRef, useEffect as useEffect4, useRef, useState as useState7 } from "react";
604
609
  var applyLayout = /* @__PURE__ */ __name((cy, name = "cola", options) => {
605
610
  cy?.layout({
606
611
  name,
@@ -648,14 +653,14 @@ var ModuleHoverDetails = /* @__PURE__ */ __name(({ name, address, ...props }) =>
648
653
  }, "ModuleHoverDetails");
649
654
  var NodeRelationalGraphFlexBox = /* @__PURE__ */ forwardRef(({ actions, children, node, layout, layoutOptions, showDetails, detail, options, onHover, ...props }, ref) => {
650
655
  const theme = useTheme3();
651
- const [cy, setCy] = useState9();
656
+ const [cy, setCy] = useState7();
652
657
  const cytoscapeRef = useRef();
653
- const [hoverPosition, setHoverBoundingBox] = useState9();
654
- const [hoverAddress, setHoverAddress] = useState9();
658
+ const [hoverPosition, setHoverBoundingBox] = useState7();
659
+ const [hoverAddress, setHoverAddress] = useState7();
655
660
  const [moduleInstance] = useWeakModuleFromNode2(hoverAddress, {
656
661
  node
657
662
  });
658
- useEffect6(() => {
663
+ useEffect4(() => {
659
664
  cy?.on("mouseover tap", ({ target }) => {
660
665
  const cyNode = target;
661
666
  const bb = cyNode?.renderedBoundingBox?.();
@@ -679,7 +684,7 @@ var NodeRelationalGraphFlexBox = /* @__PURE__ */ forwardRef(({ actions, children
679
684
  cy?.reset();
680
685
  applyLayout(cy, layout ?? "euler", layoutOptions);
681
686
  }, "handleReset");
682
- useEffect6(() => {
687
+ useEffect4(() => {
683
688
  let newCy;
684
689
  const container = cytoscapeRef.current;
685
690
  if (container) {
@@ -688,6 +693,9 @@ var NodeRelationalGraphFlexBox = /* @__PURE__ */ forwardRef(({ actions, children
688
693
  ...options
689
694
  });
690
695
  setCy(newCy);
696
+ } else {
697
+ newCy?.destroy();
698
+ setCy(void 0);
691
699
  }
692
700
  return () => {
693
701
  newCy?.destroy();
@@ -698,7 +706,7 @@ var NodeRelationalGraphFlexBox = /* @__PURE__ */ forwardRef(({ actions, children
698
706
  cytoscapeRef,
699
707
  layoutOptions
700
708
  ]);
701
- useEffect6(() => {
709
+ useEffect4(() => {
702
710
  if (cy) {
703
711
  loadLayout(layout);
704
712
  applyLayout(cy, layout ?? "euler", layoutOptions);
@@ -797,17 +805,17 @@ import { FlexCol as FlexCol2 } from "@xylabs/react-flexbox";
797
805
  import React8 from "react";
798
806
 
799
807
  // src/components/module/graph/node/hooks/useNodeElement.tsx
800
- import { useEffect as useEffect7, useRef as useRef2, useState as useState10 } from "react";
808
+ import { useEffect as useEffect5, useRef as useRef2, useState as useState8 } from "react";
801
809
  var useNodeElement = /* @__PURE__ */ __name((node) => {
802
810
  const ref = useRef2(null);
803
- const [currentElement, setCurrentElement] = useState10(null);
804
- const [boundingBox, setBoundingBox] = useState10(node?.renderedBoundingBox());
805
- useEffect7(() => {
811
+ const [currentElement, setCurrentElement] = useState8(null);
812
+ const [boundingBox, setBoundingBox] = useState8(node?.renderedBoundingBox());
813
+ useEffect5(() => {
806
814
  setCurrentElement(null);
807
815
  }, [
808
816
  node
809
817
  ]);
810
- useEffect7(() => {
818
+ useEffect5(() => {
811
819
  if (node) {
812
820
  setBoundingBox(node.renderedBoundingBox());
813
821
  }
@@ -821,7 +829,7 @@ var useNodeElement = /* @__PURE__ */ __name((node) => {
821
829
  }, [
822
830
  node
823
831
  ]);
824
- useEffect7(() => {
832
+ useEffect5(() => {
825
833
  setCurrentElement(ref.current);
826
834
  }, [
827
835
  boundingBox
@@ -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 type { ModuleInstance } from '@xyo-network/module-model'\nimport { ArchivistCard } from '@xyo-network/react-archivist'\nimport { DivinerCard, ModuleCard } from '@xyo-network/react-module'\nimport React from 'react'\n\nexport interface ModuleCardParserProps {\n mod?: ModuleInstance\n}\n\nexport const ModuleCardParser: React.FC<ModuleCardParserProps> = ({ mod }) => {\n switch (true) {\n case isArchivistInstance(mod): {\n return <ArchivistCard mod={asArchivistInstance(mod)} />\n }\n case isDivinerInstance(mod): {\n return <DivinerCard mod={asDivinerInstance(mod)} />\n }\n default: {\n return <ModuleCard mod={mod} />\n }\n }\n}\n","import { Button } from '@mui/material'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport type { ModuleInstance } from '@xyo-network/module-model'\nimport React, { useRef } from 'react'\n\nimport { CytoscapeInstanceProvider } from '../../../contexts/index.ts'\nimport {\n useElements, useModuleDetails, useRelationalGraphOptions,\n} from '../../../hooks/index.ts'\nimport { WithExtensions } from '../../cytoscape-extensions/index.ts'\nimport { NodeRelationalGraphFlexBox } from '../../relational/index.ts'\nimport { DetailsFlexbox } from './DetailsFlexbox.tsx'\nimport { ModuleGraphNodeHover } from './node/index.ts'\nimport { StyledModuleHoverPopper } from './Popper.tsx'\n\nexport interface ModuleGraphFlexBoxProps extends FlexBoxProps {\n disableModuleDetails?: boolean\n hideActions?: boolean\n layout?: 'dagre' | 'euler' | 'cose-bilkent' | 'cola'\n layoutOptions?: object\n rootModule?: WeakRef<ModuleInstance> | null\n}\n\nexport const ModuleGraphFlexBox: React.FC<ModuleGraphFlexBoxProps> = ({\n hideActions, rootModule, disableModuleDetails, ...props\n}) => {\n const cytoscapeRef = useRef<HTMLDivElement>(null)\n const {\n handleToggleLabels, hideLabels, options,\n } = useRelationalGraphOptions(rootModule ?? undefined)\n const {\n hoveredNode, setHoveredNode, toggleSelectedElement,\n } = useElements(hideLabels)\n\n const { mod, onModuleDetails } = useModuleDetails(rootModule, () => setHoveredNode(undefined))\n\n return (\n <WithExtensions>\n <NodeRelationalGraphFlexBox\n actions={\n mod\n ? null\n : hideActions\n ? null\n : (\n <Button size=\"small\" onClick={handleToggleLabels} variant=\"contained\">\n Toggle Labels\n </Button>\n )\n\n }\n showDetails={!!mod}\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 type { CytoscapeInstanceState } from './State.ts'\n\nexport const CytoscapeInstanceContext = createContextEx<CytoscapeInstanceState>()\n","import type { WithChildren } from '@xylabs/react-shared'\nimport type { Core } from 'cytoscape'\nimport React, { useMemo, useState } from 'react'\n\nimport { CytoscapeInstanceContext } from './Context.ts'\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\n const value = useMemo(() => ({\n cy, provided: true, setCy,\n }), [cy, setCy])\n\n return (\n <CytoscapeInstanceContext.Provider value={value}>\n {children}\n </CytoscapeInstanceContext.Provider>\n )\n}\n","import { useContextEx } from '@xyo-network/react-shared'\n\nimport { CytoscapeInstanceContext } from './Context.ts'\n\nexport const useCytoscapeInstance = (required = false) => useContextEx(CytoscapeInstanceContext, 'CytoscapeInstance', required)\n","import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport type { EventUnsubscribeFunction } from '@xyo-network/module-events'\nimport type { ModuleInstance } from '@xyo-network/module-model'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport type { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../../Cytoscape/index.ts'\n\nexport const useCytoscapeElements = (mod?: WeakRef<ModuleInstance> | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n\n async () => {\n const moduleInstance = mod?.deref()\n if (moduleInstance) {\n const newElements = (await CytoscapeElements.buildElements(moduleInstance)) ?? []\n setElements(newElements)\n }\n },\n [mod],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined\n let detachedListener: EventUnsubscribeFunction | undefined\n\n if (mod && isNodeInstance(mod)) {\n attachedListener = mod.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(mod)) ?? []\n setElements(newElements)\n })\n detachedListener = mod.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(mod)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [mod])\n\n return elements\n}\n","import { exists } from '@xylabs/exists'\nimport type { ModuleInstance } from '@xyo-network/module-model'\nimport type { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib/index.ts'\n\ninterface ModuleInfo {\n children: ModuleInfo[]\n depth: number\n mod: 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(mod: ModuleInstance): Promise<ElementDefinition[]> {\n const info = await CytoscapeElements.recurseNodes(mod)\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.mod, { childCount: info.children.length, depth: info.depth }, classes)\n const newEdge = root\n ? CytoscapeElements.buildEdge(root, newNode, { depth: info.depth, siblingCount: info.children.length })\n : 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(mod: ModuleInstance, properties?: { [key: string]: unknown }, classes?: string[]): ElementDefinition {\n const { address, id } = mod\n return {\n classes,\n data: {\n address,\n id: address,\n name: id,\n type: parseModuleType(mod),\n ...properties,\n },\n }\n },\n\n buildRootNode: (mod: ModuleInstance): ElementDefinition => {\n return CytoscapeElements.buildNode(mod, {}, ['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 = {\n children: [], depth, mod: root,\n }\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 type { ReactElement } from 'react'\n// eslint-disable-next-line import-x/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 type { CyNodeModuleTypes } from './CyNodeModuleTypes.ts'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n\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 type { LayoutOptions } from 'cytoscape'\n\nexport const ConcentricLayout: LayoutOptions = {\n concentric: function (node) {\n return node.degree(false)\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 type { 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 type { CyNodeModuleTypes } from './CyNodeModuleTypes.ts'\n\nexport const parseModuleType = (mod?: ModuleInstance): CyNodeModuleTypes => {\n let type: CyNodeModuleTypes = 'module'\n if (mod) {\n if (isArchivistInstance(mod)) {\n type = 'archivist'\n } else if (isBridgeInstance(mod)) {\n type = 'bridge'\n } else if (isDivinerInstance(mod)) {\n type = 'diviner'\n } else if (isNodeInstance(mod)) {\n type = 'node'\n } else if (isSentinelInstance(mod)) {\n type = 'sentinel'\n } else if (isWitnessModule(mod)) {\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 type { SvgIconTypeMap } from '@mui/material'\n// eslint-disable-next-line import-x/no-internal-modules\nimport type { OverridableComponent } from '@mui/material/OverridableComponent.js'\n\nimport type { CyNodeModuleTypes } from './lib/index.ts'\n\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import type { Stylesheet } from 'cytoscape'\n\nimport type { CyNodeModuleTypes } from './lib/index.ts'\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: { 'background-color': bgColor },\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 type { NodeCollection, NodeSingular } from 'cytoscape'\nimport type { Dispatch, SetStateAction } from 'react'\nimport {\n useCallback, useEffect, useState,\n} from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts/index.ts'\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?.deref()?.ready(() => {\n // eslint-disable-next-line unicorn/no-array-for-each\n cy?.deref()?.nodes().forEach(nodeListener)\n })\n }, [cy, nodeListener])\n\n return [hoveredNode, setHoveredNode]\n}\n","import { useWeakModuleFromNode } from '@xyo-network/react-node'\nimport type { NodeSingular } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { useCytoscapeElements } from './useCytoscapeElements.ts'\n\nexport const useNewElements = (selectedElement?: NodeSingular) => {\n const selectedAddress = useMemo(() => {\n const { address: selectedAddress } = selectedElement?.data() ?? {}\n return selectedAddress\n }, [selectedElement])\n\n const [mod] = useWeakModuleFromNode(selectedAddress)\n const newElements = useCytoscapeElements(mod)\n\n return newElements\n}\n","import type { CollectionReturnValue, ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts/index.ts'\nimport { ColaLayout } from '../../../Cytoscape/index.ts'\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?.deref()?.add(newElements)\n setRenderedElements(renderedElements)\n cy?.deref()?.layout(ColaLayout).run()\n }\n }, [cy, hideLabels, newElements])\n\n return renderedElements\n}\n","import type { NodeSingular } from 'cytoscape'\nimport { useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts/index.ts'\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?.deref()?.nodes()\n nodes?.toggleClass('activeNode', false)\n element.toggleClass('activeNode', true)\n }\n\n const toggleSelectedElement = (address?: string) => {\n const selectedNode = cy?.deref()?.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.tsx'\nimport { useNewElements } from './useNewElements.tsx'\nimport { useRenderNewElements } from './useRenderNewElements.tsx'\nimport { useSelectedElement } from './useSelectedElement.tsx'\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 {\n hoveredNode, setHoveredNode, toggleSelectedElement,\n }\n}\n","import type { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape/index.ts'\nimport { useCytoscapeStyle } from './useCytoscapeStyle.tsx'\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 type { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport {\n EdgeStyled, Node, NodeAsRoot, NodeWithName,\n} from '../../Cytoscape/index.ts'\nimport { useIcons } from './useIcons.tsx'\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 React, { useMemo } from 'react'\n\nimport type { CyNodeModuleTypes } from '../../Cytoscape/index.ts'\nimport {\n CyIconSet, encodeSvg, generateIconMap,\n} from '../../Cytoscape/index.ts'\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 type { ModuleInstance } from '@xyo-network/module-model'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts/index.ts'\n\nexport const useModuleDetails = (rootModule?: WeakRef<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 const rootModuleInstance = rootModule?.deref()\n if (moduleAddress && rootModuleInstance) {\n const foundModule = await rootModuleInstance.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(() => {\n cy?.deref()?.center()\n }, 100)\n } else if (foundModule && cy) {\n const node = cy?.deref()?.nodes(`[id=\"${moduleAddress}\"]`)?.[0]\n // cy.pan(newPan)\n // cytoscape tries to center prematurely without it :(\n setTimeout(() => {\n cy?.deref()?.center(node)\n }, 100)\n }\n })\n\n const container = cy?.deref()?.container()\n if (container) {\n resizeObserver.observe(container)\n }\n\n return () => {\n if (container) resizeObserver.unobserve(container)\n }\n }, [cy, moduleAddress, foundModule, rootModule])\n\n useEffect(() => {\n if (foundModule) {\n onFoundModule?.()\n }\n }, [cy, moduleAddress, foundModule, onFoundModule])\n\n // eslint-disable-next-line complexity\n const onModuleDetails = (address?: string | null) => {\n const moduleNode = cy?.deref()?.nodes(`[id=\"${address}\"]`)\n const rootModuleNode = cy?.deref()?.nodes(`[id=\"${rootModule?.deref()?.address}\"]`)\n const foundModuleNode = cy?.deref()?.nodes(`[id=\"${foundModule?.address}\"]`)\n const notModuleNode = cy?.deref()?.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 { mod: foundModule, onModuleDetails }\n}\n","import type { ModuleInstance } from '@xyo-network/module-model'\nimport { useState } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape/index.ts'\nimport { useCytoscapeElements } from './elements/index.ts'\nimport { useCytoscapeOptions } from './useCytoscapeOptions.ts'\nimport { useCytoscapeStyle } from './useCytoscapeStyle.tsx'\n\nexport const useRelationalGraphOptions = (mod?: WeakRef<ModuleInstance>) => {\n const [hideLabels, setHideLabels] = useState(true)\n\n const handleToggleLabels = () => {\n setHideLabels(oldValue => !oldValue)\n }\n\n const elements = useCytoscapeElements(mod)\n const style = useCytoscapeStyle(hideLabels)\n const options = useCytoscapeOptions(elements, style, ConcentricLayout)\n\n return {\n handleToggleLabels, hideLabels, options,\n }\n}\n","import cytoscape from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport coseBilkent from 'cytoscape-cose-bilkent'\nimport dagre from 'cytoscape-dagre'\nimport euler from 'cytoscape-euler'\nimport type { PropsWithChildren } from 'react'\nimport React, { useEffect, useState } from 'react'\n\nexport const WithExtensions: React.FC<PropsWithChildren> = ({ children }) => {\n const [initialized, setInitialized] = useState(false)\n useEffect(() => {\n cytoscape.use(cola)\n cytoscape.use(dagre)\n cytoscape.use(coseBilkent)\n cytoscape.use(euler)\n setInitialized(true)\n }, [])\n\n return <>{initialized ? children : undefined}</>\n}\n","import type { CardProps } from '@mui/material'\nimport {\n Box, Button, ButtonGroup, Card, CardHeader, Paper, useTheme,\n} from '@mui/material'\nimport type { Address } from '@xylabs/hex'\nimport { asAddress } from '@xylabs/hex'\nimport {\n FlexCol, FlexGrowRow, FlexRow,\n} from '@xylabs/react-flexbox'\nimport { Identicon } from '@xylabs/react-identicon'\nimport { useWeakModuleFromNode } from '@xyo-network/react-node'\nimport type { Core, NodeSingular } from 'cytoscape'\nimport cytoscape from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport coseBilkentLayout from 'cytoscape-cose-bilkent'\nimport dagre from 'cytoscape-dagre'\nimport eulerLayout from 'cytoscape-euler'\nimport React, {\n forwardRef, useEffect, useRef, useState,\n} from 'react'\n\nimport type { NodeRelationalGraphProps } from '../../lib/index.ts'\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\ntype ModuleHoverDetailsProps = CardProps & {\n address: Address\n name: string\n}\n\nconst ModuleHoverDetails: React.FC<ModuleHoverDetailsProps> = ({\n name, address, ...props\n}) => {\n return (\n <Card elevation={3} {...props}>\n <CardHeader\n avatar={(\n <Paper\n elevation={6}\n sx={{ bgcolor: '#fff', p: 1 }}\n >\n <Identicon value={address} size={24} />\n </Paper>\n )}\n title={name}\n subheader={address}\n />\n </Card>\n )\n}\n\nexport const NodeRelationalGraphFlexBox = forwardRef<HTMLDivElement, NodeRelationalGraphProps>(\n ({\n actions, children, node, layout, layoutOptions, showDetails, detail, options, onHover, ...props\n }, ref) => {\n const theme = useTheme()\n const [cy, setCy] = useState<Core>()\n const cytoscapeRef = useRef<HTMLDivElement>()\n const [hoverPosition, setHoverBoundingBox] = useState<{ x1: number; x2: number; y1: number; y2: number }>()\n const [hoverAddress, setHoverAddress] = useState<Address>()\n\n const [moduleInstance] = useWeakModuleFromNode(hoverAddress, { node })\n\n useEffect(() => {\n cy?.on('mouseover tap', ({ target }) => {\n const cyNode = target as NodeSingular\n const bb = cyNode?.renderedBoundingBox?.()\n setHoverBoundingBox(bb)\n const id = cyNode.id?.()\n if (id) {\n if (id.includes('/')) {\n setHoverAddress(undefined)\n onHover?.()\n } else {\n setHoverAddress(asAddress(id))\n onHover?.(asAddress(id))\n }\n }\n })\n }, [onHover, cy])\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 newCy = cytoscape({\n container,\n ...options,\n })\n setCy(newCy)\n }\n return () => {\n newCy?.destroy()\n setCy(undefined)\n }\n }, [options, cytoscapeRef, layoutOptions])\n\n useEffect(() => {\n if (cy) {\n loadLayout(layout)\n applyLayout(cy, layout ?? 'euler', layoutOptions)\n }\n }, [cy, layoutOptions, layout])\n\n return (\n <FlexCol id=\"relational-graph-wrapper\" ref={ref} {...props}>\n {hoverAddress && hoverPosition\n ? (\n <Box position=\"absolute\" top={hoverPosition.y1} left={hoverPosition.x1} zIndex={100}>\n <ModuleHoverDetails address={hoverAddress} name={moduleInstance?.deref()?.id ?? 'Unknown'} />\n </Box>\n )\n : null}\n <FlexRow justifyContent=\"start\" width=\"100%\">\n {actions === null\n ? null\n : actions\n ? (\n <ButtonGroup>\n {actions}\n <Button size=\"small\" variant=\"contained\" onClick={handleReset}>\n Reset View\n </Button>\n </ButtonGroup>\n )\n : (\n <Button size=\"small\" variant=\"contained\" onClick={handleReset}>\n Reset\n </Button>\n )}\n </FlexRow>\n <FlexGrowRow width=\"100%\" alignItems=\"start\">\n {showDetails\n ? (\n <FlexCol height=\"100%\" width=\"85%\">\n {detail}\n </FlexCol>\n )\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 type { AccountInstance } from '@xyo-network/account-model'\nimport type { NodeInstance } from '@xyo-network/node-model'\nimport { useWeakProvidedNode } from '@xyo-network/react-node'\nimport React from 'react'\n\nimport { useCytoscapeElements, useCytoscapeOptions } from '../../../hooks/index.ts'\nimport type { NodeRelationalGraphProps } from '../../lib/index.ts'\nimport { NodeRelationalGraphFlexBox } from './Graph.tsx'\n\nexport interface ProvidedNodeRendererProps extends NodeRelationalGraphProps {\n account?: AccountInstance\n layout?: 'dagre' | 'euler' | 'cose-bilkent' | 'cola'\n layoutOptions?: object\n node?: WeakRef<NodeInstance>\n}\n\nexport const ProvidedNodeRenderer: React.FC<ProvidedNodeRendererProps> = ({ node, ...props }) => {\n const [providedNode] = useWeakProvidedNode()\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 type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport React from 'react'\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 type { PopperProps } from '@mui/material'\nimport { styled } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport type { NodeSingular } from 'cytoscape'\nimport type { ReactElement } from 'react'\nimport React from 'react'\n\nimport { useNodeElement } from './hooks/index.ts'\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 {\n boundingBox, ref, currentElement,\n } = 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 cursor: 'pointer',\n pointerEvents: 'none',\n position: 'absolute',\n}))\n","import type { PopperProps } from '@mui/material'\nimport type { NodeSingular } from 'cytoscape'\nimport {\n useEffect, useRef, useState,\n} 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 {\n boundingBox, currentElement, ref,\n }\n}\n","import { CancelRounded } from '@mui/icons-material'\nimport type { PopperProps } from '@mui/material'\nimport {\n Button, Card, CardActions, CardHeader, IconButton, Paper, Popper, styled,\n} from '@mui/material'\nimport { Identicon } from '@xylabs/react-identicon'\nimport type { NodeSingular } from 'cytoscape'\nimport React from 'react'\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> = ({\n anchorEl, onClose, onModuleDetails, onModuleExplore, node, ...props\n}) => {\n const { address, name } = node?.data() ?? {}\n return (\n <>\n {anchorEl\n ? (\n <Popper anchorEl={anchorEl} {...props}>\n <Card elevation={3}>\n <CardHeader\n action={\n onClose\n ? (\n <IconButton size=\"small\" onClick={onClose}>\n <CancelRounded />\n </IconButton>\n )\n : null\n }\n avatar={(\n <Paper\n elevation={6}\n sx={{ bgcolor: '#fff', p: 1 }}\n >\n <Identicon value={address} size={24} />\n </Paper>\n )}\n title={name}\n subheader={address}\n />\n <StyledCardActions>\n {onModuleDetails\n ? (\n <Button onClick={() => onModuleDetails?.(address)} size=\"small\" variant=\"contained\">\n Details\n </Button>\n )\n : null}\n {onModuleExplore\n ? (\n <Button onClick={() => onModuleExplore?.(address)} size=\"small\" variant=\"contained\">\n Explore\n </Button>\n )\n : null}\n </StyledCardActions>\n </Card>\n </Popper>\n )\n : null}\n </>\n )\n}\n\nexport const StyledModuleHoverPopper = styled(ModuleHoverPopper, { name: 'StyledComponents' })(() => ({ zIndex: 2 }))\n\nexport const StyledCardActions = styled(CardActions, { name: 'StyledCardActions' })(() => ({\n display: 'flex',\n justifyContent: 'center',\n}))\n"],"mappings":"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","names":["asArchivistInstance","isArchivistInstance","asDivinerInstance","isDivinerInstance","ArchivistCard","DivinerCard","ModuleCard","React","ModuleCardParser","mod","isArchivistInstance","ArchivistCard","asArchivistInstance","isDivinerInstance","DivinerCard","asDivinerInstance","ModuleCard","Button","React","useRef","createContextEx","CytoscapeInstanceContext","React","useMemo","useState","CytoscapeInstanceProvider","children","defaultInstance","cy","setCy","useState","value","useMemo","provided","React","CytoscapeInstanceContext","Provider","useContextEx","useCytoscapeInstance","required","useContextEx","CytoscapeInstanceContext","useAsyncEffect","isNodeInstance","useEffect","useState","exists","renderToStaticMarkup","dataUri","encodeSvg","reactElement","color","svgString","renderToStaticMarkup","doc","DOMParser","parseFromString","svgElement","querySelectorAll","setAttribute","style","fill","window","encodeURIComponent","outerHTML","generateIconMap","archivist","bridge","diviner","module","node","sentinel","witness","ColaLayout","centerGraph","convergenceThreshold","name","ConcentricLayout","concentric","node","degree","levelWidth","minNodeSpacing","name","isArchivistInstance","isBridgeInstance","isDivinerInstance","isNodeInstance","isSentinelInstance","isWitnessModule","parseModuleType","mod","type","isArchivistInstance","isBridgeInstance","isDivinerInstance","isNodeInstance","isSentinelInstance","isWitnessModule","CytoscapeElements","MaxNameLength","buildEdge","rootNode","newNode","properties","data","id","source","target","buildElements","mod","info","recurseNodes","newElements","buildElementsFromInfo","undefined","root","classes","buildNode","childCount","children","length","depth","newEdge","siblingCount","push","childInfo","address","name","type","parseModuleType","buildRootNode","normalizeName","slice","maxDepth","resolve","direction","Promise","all","map","child","filter","exists","BubbleChartRounded","BubbleChartRoundedIcon","Hub","HubIcon","InsertLinkRounded","InsertLinkRoundedIcon","Inventory2Rounded","Inventory2RoundedIcon","QuestionMarkRounded","QuestionMarkRoundedIcon","TimerRounded","TimerRoundedIcon","VisibilityRounded","VisibilityRoundedIcon","CyIconSet","archivist","bridge","diviner","module","node","sentinel","witness","NodeWithName","color","outlineColor","selector","style","Node","icons","bgColor","hideLabels","elem","data","undefined","NodeAsRoot","EdgeStyled","lineColor","targetArrowColor","useCytoscapeElements","mod","elements","setElements","useState","useAsyncEffect","moduleInstance","deref","newElements","CytoscapeElements","buildElements","useEffect","attachedListener","detachedListener","isNodeInstance","on","useCallback","useEffect","useState","useHoveredNode","renderedElements","cy","useCytoscapeInstance","hoveredNode","setHoveredNode","useState","nodeListener","useCallback","node","on","useEffect","nodes","forEach","deref","ready","useWeakModuleFromNode","useMemo","useNewElements","selectedElement","selectedAddress","useMemo","address","data","mod","useWeakModuleFromNode","newElements","useCytoscapeElements","useEffect","useState","useRenderNewElements","newElements","hideLabels","cy","useCytoscapeInstance","renderedElements","setRenderedElements","useState","useEffect","length","deref","add","layout","ColaLayout","run","useState","useSelectedElement","selectedElement","setSelectedElement","useState","cy","useCytoscapeInstance","updateStyles","element","nodes","deref","toggleClass","toggleSelectedElement","address","selectedNode","useElements","hideLabels","selectedElement","toggleSelectedElement","useSelectedElement","newElements","useNewElements","renderedElements","useRenderNewElements","hoveredNode","setHoveredNode","useHoveredNode","useMemo","useTheme","useMemo","useTheme","React","useMemo","useIcons","theme","useTheme","icons","useMemo","iconMap","generateIconMap","Object","entries","CyIconSet","reduce","acc","name","IconComponent","icon","React","fontSize","encodeSvg","palette","getContrastText","text","primary","useCytoscapeStyle","hideLabels","theme","useTheme","icons","useIcons","style","useMemo","Node","palette","primary","main","NodeWithName","text","getContrastText","NodeAsRoot","secondary","EdgeStyled","divider","useCytoscapeOptions","elements","style","layout","defaultStyle","useCytoscapeStyle","resolvedLayout","ConcentricLayout","resolvedStyle","options","useMemo","usePromise","useEffect","useState","useModuleDetails","rootModule","onFoundModule","cy","useCytoscapeInstance","moduleAddress","setModuleAddress","useState","foundModule","usePromise","rootModuleInstance","deref","resolve","useEffect","resizeObserver","ResizeObserver","setTimeout","center","node","nodes","container","observe","unobserve","onModuleDetails","address","moduleNode","rootModuleNode","foundModuleNode","notModuleNode","toggleClass","activeNode","length","mod","useState","useRelationalGraphOptions","mod","hideLabels","setHideLabels","useState","handleToggleLabels","oldValue","elements","useCytoscapeElements","style","useCytoscapeStyle","options","useCytoscapeOptions","ConcentricLayout","cytoscape","cola","coseBilkent","dagre","euler","React","useEffect","useState","WithExtensions","children","initialized","setInitialized","useState","useEffect","cytoscape","use","cola","dagre","coseBilkent","euler","React","undefined","Box","Button","ButtonGroup","Card","CardHeader","Paper","useTheme","asAddress","FlexCol","FlexGrowRow","FlexRow","Identicon","useWeakModuleFromNode","cytoscape","cola","coseBilkentLayout","dagre","eulerLayout","React","forwardRef","useEffect","useRef","useState","applyLayout","cy","name","options","layout","run","loadLayout","cytoscape","use","dagre","eulerLayout","coseBilkentLayout","cola","ModuleHoverDetails","address","props","React","Card","elevation","CardHeader","avatar","Paper","sx","bgcolor","p","Identicon","value","size","title","subheader","NodeRelationalGraphFlexBox","forwardRef","actions","children","node","layoutOptions","showDetails","detail","onHover","ref","theme","useTheme","setCy","useState","cytoscapeRef","useRef","hoverPosition","setHoverBoundingBox","hoverAddress","setHoverAddress","moduleInstance","useWeakModuleFromNode","useEffect","on","target","cyNode","bb","renderedBoundingBox","id","includes","undefined","asAddress","handleReset","reset","newCy","container","current","destroy","FlexCol","Box","position","top","y1","left","x1","zIndex","deref","FlexRow","justifyContent","width","ButtonGroup","Button","variant","onClick","FlexGrowRow","alignItems","height","classes","border","palette","divider","displayName","NodeRelationalGraph","useWeakProvidedNode","React","ProvidedNodeRenderer","node","props","providedNode","useWeakProvidedNode","elements","useCytoscapeElements","options","useCytoscapeOptions","React","NodeRelationalGraphFlexBox","alignItems","flexGrow","height","CancelRounded","IconButton","FlexGrowCol","FlexRow","React","DetailsFlexbox","children","onClose","React","FlexGrowCol","alignItems","justifyContent","id","width","p","gap","FlexRow","IconButton","onClick","size","CancelRounded","styled","FlexCol","React","useEffect","useRef","useState","useNodeElement","node","ref","useRef","currentElement","setCurrentElement","useState","boundingBox","setBoundingBox","renderedBoundingBox","useEffect","listener","on","off","undefined","current","ModuleGraphNodeHover","children","node","boundingBox","ref","currentElement","useNodeElement","React","StyledNodeGhostElementFlexCol","left","x1","height","h","top","y1","width","w","styled","FlexCol","name","cursor","pointerEvents","position","CancelRounded","Button","Card","CardActions","CardHeader","IconButton","Paper","Popper","styled","Identicon","React","ModuleHoverPopper","anchorEl","onClose","onModuleDetails","onModuleExplore","node","props","address","name","data","React","Popper","Card","elevation","CardHeader","action","IconButton","size","onClick","CancelRounded","avatar","Paper","sx","bgcolor","p","Identicon","value","title","subheader","StyledCardActions","Button","variant","StyledModuleHoverPopper","styled","zIndex","CardActions","display","justifyContent","ModuleGraphFlexBox","hideActions","rootModule","disableModuleDetails","props","cytoscapeRef","useRef","handleToggleLabels","hideLabels","options","useRelationalGraphOptions","undefined","hoveredNode","setHoveredNode","toggleSelectedElement","useElements","mod","onModuleDetails","useModuleDetails","React","WithExtensions","NodeRelationalGraphFlexBox","actions","Button","size","onClick","variant","showDetails","detail","DetailsFlexbox","onClose","ref","width","ModuleGraphNodeHover","node","element","StyledModuleHoverPopper","anchorEl","container","current","onModuleExplore","placement","open","ModuleGraphFlexBoxWithProvider","CytoscapeInstanceProvider"]}
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 type { ModuleInstance } from '@xyo-network/module-model'\nimport { ArchivistCard } from '@xyo-network/react-archivist'\nimport { DivinerCard, ModuleCard } from '@xyo-network/react-module'\nimport React from 'react'\n\nexport interface ModuleCardParserProps {\n mod?: ModuleInstance\n}\n\nexport const ModuleCardParser: React.FC<ModuleCardParserProps> = ({ mod }) => {\n switch (true) {\n case isArchivistInstance(mod): {\n return <ArchivistCard mod={asArchivistInstance(mod)} />\n }\n case isDivinerInstance(mod): {\n return <DivinerCard mod={asDivinerInstance(mod)} />\n }\n default: {\n return <ModuleCard mod={mod} />\n }\n }\n}\n","import { Button } from '@mui/material'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport type { ModuleInstance } from '@xyo-network/module-model'\nimport React, { useRef } from 'react'\n\nimport { CytoscapeInstanceProvider } from '../../../contexts/index.ts'\nimport {\n useElements, useModuleDetails, useRelationalGraphOptions,\n} from '../../../hooks/index.ts'\nimport { WithExtensions } from '../../cytoscape-extensions/index.ts'\nimport { NodeRelationalGraphFlexBox } from '../../relational/index.ts'\nimport { DetailsFlexbox } from './DetailsFlexbox.tsx'\nimport { ModuleGraphNodeHover } from './node/index.ts'\nimport { StyledModuleHoverPopper } from './Popper.tsx'\n\nexport interface ModuleGraphFlexBoxProps extends FlexBoxProps {\n disableModuleDetails?: boolean\n hideActions?: boolean\n layout?: 'dagre' | 'euler' | 'cose-bilkent' | 'cola'\n layoutOptions?: object\n rootModule?: WeakRef<ModuleInstance> | null\n}\n\nexport const ModuleGraphFlexBox: React.FC<ModuleGraphFlexBoxProps> = ({\n hideActions, rootModule, disableModuleDetails, ...props\n}) => {\n const cytoscapeRef = useRef<HTMLDivElement>(null)\n const {\n handleToggleLabels, hideLabels, options,\n } = useRelationalGraphOptions(rootModule ?? undefined)\n const {\n hoveredNode, setHoveredNode, toggleSelectedElement,\n } = useElements(hideLabels)\n\n const { mod, onModuleDetails } = useModuleDetails(rootModule, () => setHoveredNode(undefined))\n\n return (\n <WithExtensions>\n <NodeRelationalGraphFlexBox\n actions={\n mod\n ? null\n : hideActions\n ? null\n : (\n <Button size=\"small\" onClick={handleToggleLabels} variant=\"contained\">\n Toggle Labels\n </Button>\n )\n\n }\n showDetails={!!mod}\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 type { CytoscapeInstanceState } from './State.ts'\n\nexport const CytoscapeInstanceContext = createContextEx<CytoscapeInstanceState>()\n","import type { WithChildren } from '@xylabs/react-shared'\nimport type { Core } from 'cytoscape'\nimport React, { useMemo, useState } from 'react'\n\nimport { CytoscapeInstanceContext } from './Context.ts'\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\n const value = useMemo(() => ({\n cy, provided: true, setCy,\n }), [cy, setCy])\n\n return (\n <CytoscapeInstanceContext.Provider value={value}>\n {children}\n </CytoscapeInstanceContext.Provider>\n )\n}\n","import { useContextEx } from '@xyo-network/react-shared'\n\nimport { CytoscapeInstanceContext } from './Context.ts'\n\nexport const useCytoscapeInstance = (required = false) => useContextEx(CytoscapeInstanceContext, 'CytoscapeInstance', required)\n","import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport type { EventUnsubscribeFunction } from '@xyo-network/module-events'\nimport type { ModuleInstance } from '@xyo-network/module-model'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport type { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../../Cytoscape/index.ts'\n\nexport const useCytoscapeElements = (mod?: WeakRef<ModuleInstance> | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n\n async () => {\n const moduleInstance = mod?.deref()\n if (moduleInstance) {\n const newElements = (await CytoscapeElements.buildElements(moduleInstance)) ?? []\n setElements(newElements)\n }\n },\n [mod],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined\n let detachedListener: EventUnsubscribeFunction | undefined\n\n if (mod && isNodeInstance(mod)) {\n attachedListener = mod.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(mod)) ?? []\n setElements(newElements)\n })\n detachedListener = mod.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(mod)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [mod])\n\n return elements\n}\n","import { exists } from '@xylabs/exists'\nimport type { ModuleInstance } from '@xyo-network/module-model'\nimport type { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib/index.ts'\n\ninterface ModuleInfo {\n children: ModuleInfo[]\n depth: number\n mod: 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(mod: ModuleInstance): Promise<ElementDefinition[]> {\n const info = await CytoscapeElements.recurseNodes(mod)\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.mod, { childCount: info.children.length, depth: info.depth }, classes)\n const newEdge = root\n ? CytoscapeElements.buildEdge(root, newNode, { depth: info.depth, siblingCount: info.children.length })\n : 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(mod: ModuleInstance, properties?: { [key: string]: unknown }, classes?: string[]): ElementDefinition {\n const { address, id } = mod\n return {\n classes,\n data: {\n address,\n id: address,\n name: id,\n type: parseModuleType(mod),\n ...properties,\n },\n }\n },\n\n buildRootNode: (mod: ModuleInstance): ElementDefinition => {\n return CytoscapeElements.buildNode(mod, {}, ['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 = {\n children: [], depth, mod: root,\n }\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 type { ReactElement } from 'react'\n// eslint-disable-next-line import-x/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 type { CyNodeModuleTypes } from './CyNodeModuleTypes.ts'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n\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 type { LayoutOptions } from 'cytoscape'\n\nexport const ConcentricLayout: LayoutOptions = {\n concentric: function (node) {\n return node.degree(false)\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 type { 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 type { CyNodeModuleTypes } from './CyNodeModuleTypes.ts'\n\nexport const parseModuleType = (mod?: ModuleInstance): CyNodeModuleTypes => {\n let type: CyNodeModuleTypes = 'module'\n if (mod) {\n if (isArchivistInstance(mod)) {\n type = 'archivist'\n } else if (isBridgeInstance(mod)) {\n type = 'bridge'\n } else if (isDivinerInstance(mod)) {\n type = 'diviner'\n } else if (isNodeInstance(mod)) {\n type = 'node'\n } else if (isSentinelInstance(mod)) {\n type = 'sentinel'\n } else if (isWitnessModule(mod)) {\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 type { SvgIconTypeMap } from '@mui/material'\n// eslint-disable-next-line import-x/no-internal-modules\nimport type { OverridableComponent } from '@mui/material/OverridableComponent.js'\n\nimport type { CyNodeModuleTypes } from './lib/index.ts'\n\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import type { Stylesheet } from 'cytoscape'\n\nimport type { CyNodeModuleTypes } from './lib/index.ts'\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: { 'background-color': bgColor },\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 type { NodeCollection, NodeSingular } from 'cytoscape'\nimport type { Dispatch, SetStateAction } from 'react'\nimport {\n useCallback, useEffect, useState,\n} from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts/index.ts'\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?.deref()?.ready(() => {\n // eslint-disable-next-line unicorn/no-array-for-each\n cy?.deref()?.nodes().forEach(nodeListener)\n })\n }, [cy, nodeListener])\n\n return [hoveredNode, setHoveredNode]\n}\n","import { useWeakModuleFromNode } from '@xyo-network/react-node'\nimport type { NodeSingular } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { useCytoscapeElements } from './useCytoscapeElements.ts'\n\nexport const useNewElements = (selectedElement?: NodeSingular) => {\n const selectedAddress = useMemo(() => {\n const { address: selectedAddress } = selectedElement?.data() ?? {}\n return selectedAddress\n }, [selectedElement])\n\n const [mod] = useWeakModuleFromNode(selectedAddress)\n const newElements = useCytoscapeElements(mod)\n\n return newElements\n}\n","import type { ElementDefinition } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts/index.ts'\nimport { ColaLayout } from '../../../Cytoscape/index.ts'\n\nexport const useRenderNewElements = (newElements: ElementDefinition[] = [], hideLabels?: boolean) => {\n const { cy } = useCytoscapeInstance(true)\n\n return useMemo(() => {\n if (newElements.length > 1) {\n const renderedElements = cy?.deref()?.add(newElements)\n cy?.deref()?.layout(ColaLayout).run()\n return renderedElements\n }\n }, [cy, hideLabels, newElements])\n}\n","import type { NodeSingular } from 'cytoscape'\nimport { useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../../contexts/index.ts'\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?.deref()?.nodes()\n nodes?.toggleClass('activeNode', false)\n element.toggleClass('activeNode', true)\n }\n\n const toggleSelectedElement = (address?: string) => {\n const selectedNode = cy?.deref()?.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.tsx'\nimport { useNewElements } from './useNewElements.tsx'\nimport { useRenderNewElements } from './useRenderNewElements.tsx'\nimport { useSelectedElement } from './useSelectedElement.tsx'\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 {\n hoveredNode, setHoveredNode, toggleSelectedElement,\n }\n}\n","import type { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape/index.ts'\nimport { useCytoscapeStyle } from './useCytoscapeStyle.tsx'\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 type { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport {\n EdgeStyled, Node, NodeAsRoot, NodeWithName,\n} from '../../Cytoscape/index.ts'\nimport { useIcons } from './useIcons.tsx'\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 React, { useMemo } from 'react'\n\nimport type { CyNodeModuleTypes } from '../../Cytoscape/index.ts'\nimport {\n CyIconSet, encodeSvg, generateIconMap,\n} from '../../Cytoscape/index.ts'\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 type { ModuleInstance } from '@xyo-network/module-model'\nimport {\n useCallback, useEffect, useState,\n} from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts/index.ts'\n\nexport const useModuleDetails = (rootModule?: WeakRef<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 const rootModuleInstance = rootModule?.deref()\n if (moduleAddress && rootModuleInstance) {\n const foundModule = await rootModuleInstance.resolve(moduleAddress)\n return foundModule ?? null\n }\n }, [moduleAddress, rootModule])\n\n const createObserver = useCallback(() => {\n return new ResizeObserver(() => {\n if (moduleAddress === null) {\n // cytoscape tries to center prematurely without it :(\n setTimeout(() => {\n cy?.deref()?.center()\n }, 100)\n } else if (foundModule && cy) {\n const node = cy?.deref()?.nodes(`[id=\"${moduleAddress}\"]`)?.[0]\n // cy.pan(newPan)\n // cytoscape tries to center prematurely without it :(\n setTimeout(() => {\n cy?.deref()?.center(node)\n }, 100)\n }\n })\n }, [cy, moduleAddress, foundModule])\n\n useEffect(() => {\n const resizeObserver = createObserver()\n\n const container = cy?.deref()?.container()\n if (container) {\n resizeObserver.observe(container)\n }\n\n return () => {\n if (container) resizeObserver.unobserve(container)\n }\n }, [cy, moduleAddress, foundModule, rootModule])\n\n useEffect(() => {\n if (foundModule) {\n onFoundModule?.()\n }\n }, [cy, moduleAddress, foundModule, onFoundModule, createObserver])\n\n // eslint-disable-next-line complexity\n const onModuleDetails = (address?: string | null) => {\n const moduleNode = cy?.deref()?.nodes(`[id=\"${address}\"]`)\n const rootModuleNode = cy?.deref()?.nodes(`[id=\"${rootModule?.deref()?.address}\"]`)\n const foundModuleNode = cy?.deref()?.nodes(`[id=\"${foundModule?.address}\"]`)\n const notModuleNode = cy?.deref()?.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 { mod: foundModule, onModuleDetails }\n}\n","import type { ModuleInstance } from '@xyo-network/module-model'\nimport { useState } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape/index.ts'\nimport { useCytoscapeElements } from './elements/index.ts'\nimport { useCytoscapeOptions } from './useCytoscapeOptions.ts'\nimport { useCytoscapeStyle } from './useCytoscapeStyle.tsx'\n\nexport const useRelationalGraphOptions = (mod?: WeakRef<ModuleInstance>) => {\n const [hideLabels, setHideLabels] = useState(true)\n\n const handleToggleLabels = () => {\n setHideLabels(oldValue => !oldValue)\n }\n\n const elements = useCytoscapeElements(mod)\n const style = useCytoscapeStyle(hideLabels)\n const options = useCytoscapeOptions(elements, style, ConcentricLayout)\n\n return {\n handleToggleLabels, hideLabels, options,\n }\n}\n","import cytoscape from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport coseBilkent from 'cytoscape-cose-bilkent'\nimport dagre from 'cytoscape-dagre'\nimport euler from 'cytoscape-euler'\nimport type { PropsWithChildren } from 'react'\nimport React, { useMemo } from 'react'\n\nexport const WithExtensions: React.FC<PropsWithChildren> = ({ children }) => {\n const initialized = useMemo(() => {\n cytoscape.use(cola)\n cytoscape.use(dagre)\n cytoscape.use(coseBilkent)\n cytoscape.use(euler)\n return true\n }, [])\n\n return <>{initialized ? children : undefined}</>\n}\n","import type { CardProps } from '@mui/material'\nimport {\n Box, Button, ButtonGroup, Card, CardHeader, Paper, useTheme,\n} from '@mui/material'\nimport type { Address } from '@xylabs/hex'\nimport { asAddress } from '@xylabs/hex'\nimport {\n FlexCol, FlexGrowRow, FlexRow,\n} from '@xylabs/react-flexbox'\nimport { Identicon } from '@xylabs/react-identicon'\nimport { useWeakModuleFromNode } from '@xyo-network/react-node'\nimport type { Core, NodeSingular } from 'cytoscape'\nimport cytoscape from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport coseBilkentLayout from 'cytoscape-cose-bilkent'\nimport dagre from 'cytoscape-dagre'\nimport eulerLayout from 'cytoscape-euler'\nimport React, {\n forwardRef, useEffect, useRef, useState,\n} from 'react'\n\nimport type { NodeRelationalGraphProps } from '../../lib/index.ts'\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\ntype ModuleHoverDetailsProps = CardProps & {\n address: Address\n name: string\n}\n\nconst ModuleHoverDetails: React.FC<ModuleHoverDetailsProps> = ({\n name, address, ...props\n}) => {\n return (\n <Card elevation={3} {...props}>\n <CardHeader\n avatar={(\n <Paper\n elevation={6}\n sx={{ bgcolor: '#fff', p: 1 }}\n >\n <Identicon value={address} size={24} />\n </Paper>\n )}\n title={name}\n subheader={address}\n />\n </Card>\n )\n}\n\nexport const NodeRelationalGraphFlexBox = forwardRef<HTMLDivElement, NodeRelationalGraphProps>(\n ({\n actions, children, node, layout, layoutOptions, showDetails, detail, options, onHover, ...props\n }, ref) => {\n const theme = useTheme()\n const [cy, setCy] = useState<Core>()\n const cytoscapeRef = useRef<HTMLDivElement>()\n const [hoverPosition, setHoverBoundingBox] = useState<{ x1: number; x2: number; y1: number; y2: number }>()\n const [hoverAddress, setHoverAddress] = useState<Address>()\n\n const [moduleInstance] = useWeakModuleFromNode(hoverAddress, { node })\n\n useEffect(() => {\n cy?.on('mouseover tap', ({ target }) => {\n const cyNode = target as NodeSingular\n const bb = cyNode?.renderedBoundingBox?.()\n setHoverBoundingBox(bb)\n const id = cyNode.id?.()\n if (id) {\n if (id.includes('/')) {\n setHoverAddress(undefined)\n onHover?.()\n } else {\n setHoverAddress(asAddress(id))\n onHover?.(asAddress(id))\n }\n }\n })\n }, [onHover, cy])\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 newCy = cytoscape({\n container,\n ...options,\n })\n // eslint-disable-next-line @eslint-react/hooks-extra/no-direct-set-state-in-use-effect\n setCy(newCy)\n } else {\n newCy?.destroy()\n // eslint-disable-next-line @eslint-react/hooks-extra/no-direct-set-state-in-use-effect\n setCy(undefined)\n }\n return () => {\n newCy?.destroy()\n setCy(undefined)\n }\n }, [options, cytoscapeRef, layoutOptions])\n\n useEffect(() => {\n if (cy) {\n loadLayout(layout)\n applyLayout(cy, layout ?? 'euler', layoutOptions)\n }\n }, [cy, layoutOptions, layout])\n\n return (\n <FlexCol id=\"relational-graph-wrapper\" ref={ref} {...props}>\n {hoverAddress && hoverPosition\n ? (\n <Box position=\"absolute\" top={hoverPosition.y1} left={hoverPosition.x1} zIndex={100}>\n <ModuleHoverDetails address={hoverAddress} name={moduleInstance?.deref()?.id ?? 'Unknown'} />\n </Box>\n )\n : null}\n <FlexRow justifyContent=\"start\" width=\"100%\">\n {actions === null\n ? null\n : actions\n ? (\n <ButtonGroup>\n {actions}\n <Button size=\"small\" variant=\"contained\" onClick={handleReset}>\n Reset View\n </Button>\n </ButtonGroup>\n )\n : (\n <Button size=\"small\" variant=\"contained\" onClick={handleReset}>\n Reset\n </Button>\n )}\n </FlexRow>\n <FlexGrowRow width=\"100%\" alignItems=\"start\">\n {showDetails\n ? (\n <FlexCol height=\"100%\" width=\"85%\">\n {detail}\n </FlexCol>\n )\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 type { AccountInstance } from '@xyo-network/account-model'\nimport type { NodeInstance } from '@xyo-network/node-model'\nimport { useWeakProvidedNode } from '@xyo-network/react-node'\nimport React from 'react'\n\nimport { useCytoscapeElements, useCytoscapeOptions } from '../../../hooks/index.ts'\nimport type { NodeRelationalGraphProps } from '../../lib/index.ts'\nimport { NodeRelationalGraphFlexBox } from './Graph.tsx'\n\nexport interface ProvidedNodeRendererProps extends NodeRelationalGraphProps {\n account?: AccountInstance\n layout?: 'dagre' | 'euler' | 'cose-bilkent' | 'cola'\n layoutOptions?: object\n node?: WeakRef<NodeInstance>\n}\n\nexport const ProvidedNodeRenderer: React.FC<ProvidedNodeRendererProps> = ({ node, ...props }) => {\n const [providedNode] = useWeakProvidedNode()\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 type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport React from 'react'\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 type { PopperProps } from '@mui/material'\nimport { styled } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport type { NodeSingular } from 'cytoscape'\nimport type { ReactElement } from 'react'\nimport React from 'react'\n\nimport { useNodeElement } from './hooks/index.ts'\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 {\n boundingBox, ref, currentElement,\n } = 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 cursor: 'pointer',\n pointerEvents: 'none',\n position: 'absolute',\n}))\n","import type { PopperProps } from '@mui/material'\nimport type { NodeSingular } from 'cytoscape'\nimport {\n useEffect, useRef, useState,\n} 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 {\n boundingBox, currentElement, ref,\n }\n}\n","import { CancelRounded } from '@mui/icons-material'\nimport type { PopperProps } from '@mui/material'\nimport {\n Button, Card, CardActions, CardHeader, IconButton, Paper, Popper, styled,\n} from '@mui/material'\nimport { Identicon } from '@xylabs/react-identicon'\nimport type { NodeSingular } from 'cytoscape'\nimport React from 'react'\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> = ({\n anchorEl, onClose, onModuleDetails, onModuleExplore, node, ...props\n}) => {\n const { address, name } = node?.data() ?? {}\n return (\n <>\n {anchorEl\n ? (\n <Popper anchorEl={anchorEl} {...props}>\n <Card elevation={3}>\n <CardHeader\n action={\n onClose\n ? (\n <IconButton size=\"small\" onClick={onClose}>\n <CancelRounded />\n </IconButton>\n )\n : null\n }\n avatar={(\n <Paper\n elevation={6}\n sx={{ bgcolor: '#fff', p: 1 }}\n >\n <Identicon value={address} size={24} />\n </Paper>\n )}\n title={name}\n subheader={address}\n />\n <StyledCardActions>\n {onModuleDetails\n ? (\n <Button onClick={() => onModuleDetails?.(address)} size=\"small\" variant=\"contained\">\n Details\n </Button>\n )\n : null}\n {onModuleExplore\n ? (\n <Button onClick={() => onModuleExplore?.(address)} size=\"small\" variant=\"contained\">\n Explore\n </Button>\n )\n : null}\n </StyledCardActions>\n </Card>\n </Popper>\n )\n : null}\n </>\n )\n}\n\nexport const StyledModuleHoverPopper = styled(ModuleHoverPopper, { name: 'StyledComponents' })(() => ({ zIndex: 2 }))\n\nexport const StyledCardActions = styled(CardActions, { name: 'StyledCardActions' })(() => ({\n display: 'flex',\n justifyContent: 'center',\n}))\n"],"mappings":"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","names":["asArchivistInstance","isArchivistInstance","asDivinerInstance","isDivinerInstance","ArchivistCard","DivinerCard","ModuleCard","React","ModuleCardParser","mod","isArchivistInstance","ArchivistCard","asArchivistInstance","isDivinerInstance","DivinerCard","asDivinerInstance","ModuleCard","Button","React","useRef","createContextEx","CytoscapeInstanceContext","React","useMemo","useState","CytoscapeInstanceProvider","children","defaultInstance","cy","setCy","useState","value","useMemo","provided","React","CytoscapeInstanceContext","Provider","useContextEx","useCytoscapeInstance","required","useContextEx","CytoscapeInstanceContext","useAsyncEffect","isNodeInstance","useEffect","useState","exists","renderToStaticMarkup","dataUri","encodeSvg","reactElement","color","svgString","renderToStaticMarkup","doc","DOMParser","parseFromString","svgElement","querySelectorAll","setAttribute","style","fill","window","encodeURIComponent","outerHTML","generateIconMap","archivist","bridge","diviner","module","node","sentinel","witness","ColaLayout","centerGraph","convergenceThreshold","name","ConcentricLayout","concentric","node","degree","levelWidth","minNodeSpacing","name","isArchivistInstance","isBridgeInstance","isDivinerInstance","isNodeInstance","isSentinelInstance","isWitnessModule","parseModuleType","mod","type","isArchivistInstance","isBridgeInstance","isDivinerInstance","isNodeInstance","isSentinelInstance","isWitnessModule","CytoscapeElements","MaxNameLength","buildEdge","rootNode","newNode","properties","data","id","source","target","buildElements","mod","info","recurseNodes","newElements","buildElementsFromInfo","undefined","root","classes","buildNode","childCount","children","length","depth","newEdge","siblingCount","push","childInfo","address","name","type","parseModuleType","buildRootNode","normalizeName","slice","maxDepth","resolve","direction","Promise","all","map","child","filter","exists","BubbleChartRounded","BubbleChartRoundedIcon","Hub","HubIcon","InsertLinkRounded","InsertLinkRoundedIcon","Inventory2Rounded","Inventory2RoundedIcon","QuestionMarkRounded","QuestionMarkRoundedIcon","TimerRounded","TimerRoundedIcon","VisibilityRounded","VisibilityRoundedIcon","CyIconSet","archivist","bridge","diviner","module","node","sentinel","witness","NodeWithName","color","outlineColor","selector","style","Node","icons","bgColor","hideLabels","elem","data","undefined","NodeAsRoot","EdgeStyled","lineColor","targetArrowColor","useCytoscapeElements","mod","elements","setElements","useState","useAsyncEffect","moduleInstance","deref","newElements","CytoscapeElements","buildElements","useEffect","attachedListener","detachedListener","isNodeInstance","on","useCallback","useEffect","useState","useHoveredNode","renderedElements","cy","useCytoscapeInstance","hoveredNode","setHoveredNode","useState","nodeListener","useCallback","node","on","useEffect","nodes","forEach","deref","ready","useWeakModuleFromNode","useMemo","useNewElements","selectedElement","selectedAddress","useMemo","address","data","mod","useWeakModuleFromNode","newElements","useCytoscapeElements","useMemo","useRenderNewElements","newElements","hideLabels","cy","useCytoscapeInstance","useMemo","length","renderedElements","deref","add","layout","ColaLayout","run","useState","useSelectedElement","selectedElement","setSelectedElement","useState","cy","useCytoscapeInstance","updateStyles","element","nodes","deref","toggleClass","toggleSelectedElement","address","selectedNode","useElements","hideLabels","selectedElement","toggleSelectedElement","useSelectedElement","newElements","useNewElements","renderedElements","useRenderNewElements","hoveredNode","setHoveredNode","useHoveredNode","useMemo","useTheme","useMemo","useTheme","React","useMemo","useIcons","theme","useTheme","icons","useMemo","iconMap","generateIconMap","Object","entries","CyIconSet","reduce","acc","name","IconComponent","icon","React","fontSize","encodeSvg","palette","getContrastText","text","primary","useCytoscapeStyle","hideLabels","theme","useTheme","icons","useIcons","style","useMemo","Node","palette","primary","main","NodeWithName","text","getContrastText","NodeAsRoot","secondary","EdgeStyled","divider","useCytoscapeOptions","elements","style","layout","defaultStyle","useCytoscapeStyle","resolvedLayout","ConcentricLayout","resolvedStyle","options","useMemo","usePromise","useCallback","useEffect","useState","useModuleDetails","rootModule","onFoundModule","cy","useCytoscapeInstance","moduleAddress","setModuleAddress","useState","foundModule","usePromise","rootModuleInstance","deref","resolve","createObserver","useCallback","ResizeObserver","setTimeout","center","node","nodes","useEffect","resizeObserver","container","observe","unobserve","onModuleDetails","address","moduleNode","rootModuleNode","foundModuleNode","notModuleNode","toggleClass","activeNode","length","mod","useState","useRelationalGraphOptions","mod","hideLabels","setHideLabels","useState","handleToggleLabels","oldValue","elements","useCytoscapeElements","style","useCytoscapeStyle","options","useCytoscapeOptions","ConcentricLayout","cytoscape","cola","coseBilkent","dagre","euler","React","useMemo","WithExtensions","children","initialized","useMemo","cytoscape","use","cola","dagre","coseBilkent","euler","React","undefined","Box","Button","ButtonGroup","Card","CardHeader","Paper","useTheme","asAddress","FlexCol","FlexGrowRow","FlexRow","Identicon","useWeakModuleFromNode","cytoscape","cola","coseBilkentLayout","dagre","eulerLayout","React","forwardRef","useEffect","useRef","useState","applyLayout","cy","name","options","layout","run","loadLayout","cytoscape","use","dagre","eulerLayout","coseBilkentLayout","cola","ModuleHoverDetails","address","props","React","Card","elevation","CardHeader","avatar","Paper","sx","bgcolor","p","Identicon","value","size","title","subheader","NodeRelationalGraphFlexBox","forwardRef","actions","children","node","layoutOptions","showDetails","detail","onHover","ref","theme","useTheme","setCy","useState","cytoscapeRef","useRef","hoverPosition","setHoverBoundingBox","hoverAddress","setHoverAddress","moduleInstance","useWeakModuleFromNode","useEffect","on","target","cyNode","bb","renderedBoundingBox","id","includes","undefined","asAddress","handleReset","reset","newCy","container","current","destroy","FlexCol","Box","position","top","y1","left","x1","zIndex","deref","FlexRow","justifyContent","width","ButtonGroup","Button","variant","onClick","FlexGrowRow","alignItems","height","classes","border","palette","divider","displayName","NodeRelationalGraph","useWeakProvidedNode","React","ProvidedNodeRenderer","node","props","providedNode","useWeakProvidedNode","elements","useCytoscapeElements","options","useCytoscapeOptions","React","NodeRelationalGraphFlexBox","alignItems","flexGrow","height","CancelRounded","IconButton","FlexGrowCol","FlexRow","React","DetailsFlexbox","children","onClose","React","FlexGrowCol","alignItems","justifyContent","id","width","p","gap","FlexRow","IconButton","onClick","size","CancelRounded","styled","FlexCol","React","useEffect","useRef","useState","useNodeElement","node","ref","useRef","currentElement","setCurrentElement","useState","boundingBox","setBoundingBox","renderedBoundingBox","useEffect","listener","on","off","undefined","current","ModuleGraphNodeHover","children","node","boundingBox","ref","currentElement","useNodeElement","React","StyledNodeGhostElementFlexCol","left","x1","height","h","top","y1","width","w","styled","FlexCol","name","cursor","pointerEvents","position","CancelRounded","Button","Card","CardActions","CardHeader","IconButton","Paper","Popper","styled","Identicon","React","ModuleHoverPopper","anchorEl","onClose","onModuleDetails","onModuleExplore","node","props","address","name","data","React","Popper","Card","elevation","CardHeader","action","IconButton","size","onClick","CancelRounded","avatar","Paper","sx","bgcolor","p","Identicon","value","title","subheader","StyledCardActions","Button","variant","StyledModuleHoverPopper","styled","zIndex","CardActions","display","justifyContent","ModuleGraphFlexBox","hideActions","rootModule","disableModuleDetails","props","cytoscapeRef","useRef","handleToggleLabels","hideLabels","options","useRelationalGraphOptions","undefined","hoveredNode","setHoveredNode","toggleSelectedElement","useElements","mod","onModuleDetails","useModuleDetails","React","WithExtensions","NodeRelationalGraphFlexBox","actions","Button","size","onClick","variant","showDetails","detail","DetailsFlexbox","onClose","ref","width","ModuleGraphNodeHover","node","element","StyledModuleHoverPopper","anchorEl","container","current","onModuleExplore","placement","open","ModuleGraphFlexBoxWithProvider","CytoscapeInstanceProvider"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xyo-network/react-node-renderer",
3
- "version": "3.0.15",
3
+ "version": "3.0.17",
4
4
  "description": "Common React library for all XYO projects that use React",
5
5
  "keywords": [
6
6
  "xyo",
@@ -43,13 +43,13 @@
43
43
  "lint-pkg": "npmPkgJsonLint ."
44
44
  },
45
45
  "dependencies": {
46
- "@xylabs/exists": "^4.0.9",
47
- "@xylabs/hex": "^4.0.9",
48
- "@xylabs/react-async-effect": "^4.2.5",
49
- "@xylabs/react-flexbox": "^4.2.5",
50
- "@xylabs/react-identicon": "^4.2.5",
51
- "@xylabs/react-promise": "^4.2.5",
52
- "@xylabs/react-shared": "^4.2.5",
46
+ "@xylabs/exists": "^4.0.10",
47
+ "@xylabs/hex": "^4.0.10",
48
+ "@xylabs/react-async-effect": "^4.2.12",
49
+ "@xylabs/react-flexbox": "^4.2.12",
50
+ "@xylabs/react-identicon": "^4.2.12",
51
+ "@xylabs/react-promise": "^4.2.12",
52
+ "@xylabs/react-shared": "^4.2.12",
53
53
  "@xyo-network/account-model": "^3.1.9",
54
54
  "@xyo-network/archivist-model": "^3.1.9",
55
55
  "@xyo-network/bridge-model": "^3.1.9",
@@ -57,10 +57,10 @@
57
57
  "@xyo-network/module-events": "^3.1.9",
58
58
  "@xyo-network/module-model": "^3.1.9",
59
59
  "@xyo-network/node-model": "^3.1.9",
60
- "@xyo-network/react-archivist": "^3.0.15",
61
- "@xyo-network/react-module": "^3.0.15",
62
- "@xyo-network/react-node": "^3.0.15",
63
- "@xyo-network/react-shared": "^3.0.15",
60
+ "@xyo-network/react-archivist": "^3.0.17",
61
+ "@xyo-network/react-module": "^3.0.17",
62
+ "@xyo-network/react-node": "^3.0.17",
63
+ "@xyo-network/react-shared": "^3.0.17",
64
64
  "@xyo-network/sentinel-model": "^3.1.9",
65
65
  "@xyo-network/witness-model": "^3.1.9",
66
66
  "cytoscape": "^3.30.2",
@@ -85,13 +85,13 @@
85
85
  "@xyo-network/bridge-model": "^3.1.9",
86
86
  "@xyo-network/id-plugin": "^3.0.17",
87
87
  "@xyo-network/node-memory": "^3.1.9",
88
- "@xyo-network/react-storybook": "^3.0.15",
89
- "@xyo-network/react-wallet": "^3.0.15",
88
+ "@xyo-network/react-storybook": "^3.0.17",
89
+ "@xyo-network/react-wallet": "^3.0.17",
90
90
  "@xyo-network/sentinel": "^3.1.9",
91
91
  "react": "^18.3.1",
92
92
  "react-dom": "^18.3.1",
93
93
  "storybook": "^8.2.9",
94
- "typescript": "^5.5.4"
94
+ "typescript": "^5.6.2"
95
95
  },
96
96
  "peerDependencies": {
97
97
  "@mui/icons-material": "^5",
@@ -4,16 +4,15 @@ import coseBilkent from 'cytoscape-cose-bilkent'
4
4
  import dagre from 'cytoscape-dagre'
5
5
  import euler from 'cytoscape-euler'
6
6
  import type { PropsWithChildren } from 'react'
7
- import React, { useEffect, useState } from 'react'
7
+ import React, { useMemo } from 'react'
8
8
 
9
9
  export const WithExtensions: React.FC<PropsWithChildren> = ({ children }) => {
10
- const [initialized, setInitialized] = useState(false)
11
- useEffect(() => {
10
+ const initialized = useMemo(() => {
12
11
  cytoscape.use(cola)
13
12
  cytoscape.use(dagre)
14
13
  cytoscape.use(coseBilkent)
15
14
  cytoscape.use(euler)
16
- setInitialized(true)
15
+ return true
17
16
  }, [])
18
17
 
19
18
  return <>{initialized ? children : undefined}</>
@@ -115,7 +115,12 @@ export const NodeRelationalGraphFlexBox = forwardRef<HTMLDivElement, NodeRelatio
115
115
  container,
116
116
  ...options,
117
117
  })
118
+ // eslint-disable-next-line @eslint-react/hooks-extra/no-direct-set-state-in-use-effect
118
119
  setCy(newCy)
120
+ } else {
121
+ newCy?.destroy()
122
+ // eslint-disable-next-line @eslint-react/hooks-extra/no-direct-set-state-in-use-effect
123
+ setCy(undefined)
119
124
  }
120
125
  return () => {
121
126
  newCy?.destroy()
@@ -1,20 +1,17 @@
1
- import type { CollectionReturnValue, ElementDefinition } from 'cytoscape'
2
- import { useEffect, useState } from 'react'
1
+ import type { ElementDefinition } from 'cytoscape'
2
+ import { useMemo } from 'react'
3
3
 
4
4
  import { useCytoscapeInstance } from '../../../contexts/index.ts'
5
5
  import { ColaLayout } from '../../../Cytoscape/index.ts'
6
6
 
7
7
  export const useRenderNewElements = (newElements: ElementDefinition[] = [], hideLabels?: boolean) => {
8
8
  const { cy } = useCytoscapeInstance(true)
9
- const [renderedElements, setRenderedElements] = useState<CollectionReturnValue>()
10
9
 
11
- useEffect(() => {
10
+ return useMemo(() => {
12
11
  if (newElements.length > 1) {
13
12
  const renderedElements = cy?.deref()?.add(newElements)
14
- setRenderedElements(renderedElements)
15
13
  cy?.deref()?.layout(ColaLayout).run()
14
+ return renderedElements
16
15
  }
17
16
  }, [cy, hideLabels, newElements])
18
-
19
- return renderedElements
20
17
  }
@@ -1,6 +1,8 @@
1
1
  import { usePromise } from '@xylabs/react-promise'
2
2
  import type { ModuleInstance } from '@xyo-network/module-model'
3
- import { useEffect, useState } from 'react'
3
+ import {
4
+ useCallback, useEffect, useState,
5
+ } from 'react'
4
6
 
5
7
  import { useCytoscapeInstance } from '../../contexts/index.ts'
6
8
 
@@ -17,8 +19,8 @@ export const useModuleDetails = (rootModule?: WeakRef<ModuleInstance> | null, on
17
19
  }
18
20
  }, [moduleAddress, rootModule])
19
21
 
20
- useEffect(() => {
21
- const resizeObserver = new ResizeObserver(() => {
22
+ const createObserver = useCallback(() => {
23
+ return new ResizeObserver(() => {
22
24
  if (moduleAddress === null) {
23
25
  // cytoscape tries to center prematurely without it :(
24
26
  setTimeout(() => {
@@ -33,6 +35,10 @@ export const useModuleDetails = (rootModule?: WeakRef<ModuleInstance> | null, on
33
35
  }, 100)
34
36
  }
35
37
  })
38
+ }, [cy, moduleAddress, foundModule])
39
+
40
+ useEffect(() => {
41
+ const resizeObserver = createObserver()
36
42
 
37
43
  const container = cy?.deref()?.container()
38
44
  if (container) {
@@ -48,7 +54,7 @@ export const useModuleDetails = (rootModule?: WeakRef<ModuleInstance> | null, on
48
54
  if (foundModule) {
49
55
  onFoundModule?.()
50
56
  }
51
- }, [cy, moduleAddress, foundModule, onFoundModule])
57
+ }, [cy, moduleAddress, foundModule, onFoundModule, createObserver])
52
58
 
53
59
  // eslint-disable-next-line complexity
54
60
  const onModuleDetails = (address?: string | null) => {