@xyo-network/react-node-renderer 2.64.3 → 2.64.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/browser/Cytoscape/CytoscapeElements.cjs +5 -5
- package/dist/browser/Cytoscape/CytoscapeElements.cjs.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeElements.d.cts +3 -1
- package/dist/browser/Cytoscape/CytoscapeElements.d.cts.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeElements.d.mts +3 -1
- package/dist/browser/Cytoscape/CytoscapeElements.d.mts.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeElements.d.ts +3 -1
- package/dist/browser/Cytoscape/CytoscapeElements.d.ts.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeElements.js +5 -5
- package/dist/browser/Cytoscape/CytoscapeElements.js.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeStyles.cjs +2 -0
- package/dist/browser/Cytoscape/CytoscapeStyles.cjs.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeStyles.d.cts +1 -0
- package/dist/browser/Cytoscape/CytoscapeStyles.d.cts.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeStyles.d.mts +1 -0
- package/dist/browser/Cytoscape/CytoscapeStyles.d.mts.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeStyles.d.ts +1 -0
- package/dist/browser/Cytoscape/CytoscapeStyles.d.ts.map +1 -1
- package/dist/browser/Cytoscape/CytoscapeStyles.js +2 -0
- package/dist/browser/Cytoscape/CytoscapeStyles.js.map +1 -1
- package/dist/browser/Cytoscape/index.cjs +7 -5
- package/dist/browser/Cytoscape/index.cjs.map +1 -1
- package/dist/browser/Cytoscape/index.js +7 -5
- package/dist/browser/Cytoscape/index.js.map +1 -1
- package/dist/browser/components/ProvidedNodeRenderer.cjs +13 -11
- package/dist/browser/components/ProvidedNodeRenderer.cjs.map +1 -1
- package/dist/browser/components/ProvidedNodeRenderer.js +14 -12
- package/dist/browser/components/ProvidedNodeRenderer.js.map +1 -1
- package/dist/browser/components/RelationalGraph.cjs +3 -3
- package/dist/browser/components/RelationalGraph.cjs.map +1 -1
- package/dist/browser/components/RelationalGraph.d.cts.map +1 -1
- package/dist/browser/components/RelationalGraph.d.mts.map +1 -1
- package/dist/browser/components/RelationalGraph.d.ts.map +1 -1
- package/dist/browser/components/RelationalGraph.js +4 -4
- package/dist/browser/components/RelationalGraph.js.map +1 -1
- package/dist/browser/components/index.cjs +119 -81
- package/dist/browser/components/index.cjs.map +1 -1
- package/dist/browser/components/index.js +119 -81
- package/dist/browser/components/index.js.map +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.cjs +118 -80
- package/dist/browser/components/module/graph/GraphFlexBox.cjs.map +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.cts +1 -0
- package/dist/browser/components/module/graph/GraphFlexBox.d.cts.map +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.mts +1 -0
- package/dist/browser/components/module/graph/GraphFlexBox.d.mts.map +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.d.ts +1 -0
- package/dist/browser/components/module/graph/GraphFlexBox.d.ts.map +1 -1
- package/dist/browser/components/module/graph/GraphFlexBox.js +118 -80
- package/dist/browser/components/module/graph/GraphFlexBox.js.map +1 -1
- package/dist/browser/components/module/graph/NodeHover.cjs +17 -10
- package/dist/browser/components/module/graph/NodeHover.cjs.map +1 -1
- package/dist/browser/components/module/graph/NodeHover.d.cts.map +1 -1
- package/dist/browser/components/module/graph/NodeHover.d.mts.map +1 -1
- package/dist/browser/components/module/graph/NodeHover.d.ts.map +1 -1
- package/dist/browser/components/module/graph/NodeHover.js +20 -13
- package/dist/browser/components/module/graph/NodeHover.js.map +1 -1
- package/dist/browser/components/module/graph/Popper.cjs +2 -2
- package/dist/browser/components/module/graph/Popper.cjs.map +1 -1
- package/dist/browser/components/module/graph/Popper.d.cts +1 -1
- package/dist/browser/components/module/graph/Popper.d.cts.map +1 -1
- package/dist/browser/components/module/graph/Popper.d.mts +1 -1
- package/dist/browser/components/module/graph/Popper.d.mts.map +1 -1
- package/dist/browser/components/module/graph/Popper.d.ts +1 -1
- package/dist/browser/components/module/graph/Popper.d.ts.map +1 -1
- package/dist/browser/components/module/graph/Popper.js +3 -3
- package/dist/browser/components/module/graph/Popper.js.map +1 -1
- package/dist/browser/components/module/graph/index.cjs +118 -80
- package/dist/browser/components/module/graph/index.cjs.map +1 -1
- package/dist/browser/components/module/graph/index.js +118 -80
- package/dist/browser/components/module/graph/index.js.map +1 -1
- package/dist/browser/components/module/index.cjs +118 -80
- package/dist/browser/components/module/index.cjs.map +1 -1
- package/dist/browser/components/module/index.js +118 -80
- package/dist/browser/components/module/index.js.map +1 -1
- package/dist/browser/hooks/cytoscape/index.cjs +46 -28
- package/dist/browser/hooks/cytoscape/index.cjs.map +1 -1
- package/dist/browser/hooks/cytoscape/index.js +42 -24
- package/dist/browser/hooks/cytoscape/index.js.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeElements.cjs +5 -5
- package/dist/browser/hooks/cytoscape/useCytoscapeElements.cjs.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeElements.js +5 -5
- package/dist/browser/hooks/cytoscape/useCytoscapeElements.js.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeOptions.cjs +5 -3
- package/dist/browser/hooks/cytoscape/useCytoscapeOptions.cjs.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeOptions.d.cts.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeOptions.d.mts.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeOptions.d.ts.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeOptions.js +5 -3
- package/dist/browser/hooks/cytoscape/useCytoscapeOptions.js.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeStyle.cjs.map +1 -1
- package/dist/browser/hooks/cytoscape/useCytoscapeStyle.js.map +1 -1
- package/dist/browser/hooks/cytoscape/useNewElements.cjs +5 -22
- package/dist/browser/hooks/cytoscape/useNewElements.cjs.map +1 -1
- package/dist/browser/hooks/cytoscape/useNewElements.d.cts.map +1 -1
- package/dist/browser/hooks/cytoscape/useNewElements.d.mts.map +1 -1
- package/dist/browser/hooks/cytoscape/useNewElements.d.ts.map +1 -1
- package/dist/browser/hooks/cytoscape/useNewElements.js +5 -22
- package/dist/browser/hooks/cytoscape/useNewElements.js.map +1 -1
- package/dist/browser/hooks/cytoscape/useRelationalGraphOptions.cjs +10 -8
- package/dist/browser/hooks/cytoscape/useRelationalGraphOptions.cjs.map +1 -1
- package/dist/browser/hooks/cytoscape/useRelationalGraphOptions.js +10 -8
- package/dist/browser/hooks/cytoscape/useRelationalGraphOptions.js.map +1 -1
- package/dist/browser/hooks/cytoscape/useSelectedElement.cjs +30 -3
- package/dist/browser/hooks/cytoscape/useSelectedElement.cjs.map +1 -1
- package/dist/browser/hooks/cytoscape/useSelectedElement.d.cts.map +1 -1
- package/dist/browser/hooks/cytoscape/useSelectedElement.d.mts.map +1 -1
- package/dist/browser/hooks/cytoscape/useSelectedElement.d.ts.map +1 -1
- package/dist/browser/hooks/cytoscape/useSelectedElement.js +30 -3
- package/dist/browser/hooks/cytoscape/useSelectedElement.js.map +1 -1
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.cjs +57 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.cjs.map +1 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.d.cts +4 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.d.cts.map +1 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.d.mts +4 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.d.mts.map +1 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.d.ts +4 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.d.ts.map +1 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.js +36 -0
- package/dist/browser/hooks/cytoscape/useToggleSelectedElement.js.map +1 -0
- package/dist/browser/hooks/index.cjs +46 -28
- package/dist/browser/hooks/index.cjs.map +1 -1
- package/dist/browser/hooks/index.js +42 -24
- package/dist/browser/hooks/index.js.map +1 -1
- package/dist/browser/index.cjs +123 -81
- package/dist/browser/index.cjs.map +1 -1
- package/dist/browser/index.d.cts +1 -0
- package/dist/browser/index.d.cts.map +1 -1
- package/dist/browser/index.d.mts +1 -0
- package/dist/browser/index.d.mts.map +1 -1
- package/dist/browser/index.d.ts +1 -0
- package/dist/browser/index.d.ts.map +1 -1
- package/dist/browser/index.js +123 -81
- package/dist/browser/index.js.map +1 -1
- package/dist/docs.json +2026 -1305
- package/dist/node/Cytoscape/CytoscapeElements.cjs +5 -5
- package/dist/node/Cytoscape/CytoscapeElements.cjs.map +1 -1
- package/dist/node/Cytoscape/CytoscapeElements.d.cts +3 -1
- package/dist/node/Cytoscape/CytoscapeElements.d.cts.map +1 -1
- package/dist/node/Cytoscape/CytoscapeElements.d.mts +3 -1
- package/dist/node/Cytoscape/CytoscapeElements.d.mts.map +1 -1
- package/dist/node/Cytoscape/CytoscapeElements.d.ts +3 -1
- package/dist/node/Cytoscape/CytoscapeElements.d.ts.map +1 -1
- package/dist/node/Cytoscape/CytoscapeElements.js +5 -5
- package/dist/node/Cytoscape/CytoscapeElements.js.map +1 -1
- package/dist/node/Cytoscape/CytoscapeStyles.cjs +3 -0
- package/dist/node/Cytoscape/CytoscapeStyles.cjs.map +1 -1
- package/dist/node/Cytoscape/CytoscapeStyles.d.cts +1 -0
- package/dist/node/Cytoscape/CytoscapeStyles.d.cts.map +1 -1
- package/dist/node/Cytoscape/CytoscapeStyles.d.mts +1 -0
- package/dist/node/Cytoscape/CytoscapeStyles.d.mts.map +1 -1
- package/dist/node/Cytoscape/CytoscapeStyles.d.ts +1 -0
- package/dist/node/Cytoscape/CytoscapeStyles.d.ts.map +1 -1
- package/dist/node/Cytoscape/CytoscapeStyles.js +2 -0
- package/dist/node/Cytoscape/CytoscapeStyles.js.map +1 -1
- package/dist/node/Cytoscape/index.cjs +8 -5
- package/dist/node/Cytoscape/index.cjs.map +1 -1
- package/dist/node/Cytoscape/index.js +7 -5
- package/dist/node/Cytoscape/index.js.map +1 -1
- package/dist/node/components/ProvidedNodeRenderer.cjs +13 -11
- package/dist/node/components/ProvidedNodeRenderer.cjs.map +1 -1
- package/dist/node/components/ProvidedNodeRenderer.js +14 -12
- package/dist/node/components/ProvidedNodeRenderer.js.map +1 -1
- package/dist/node/components/RelationalGraph.cjs +3 -3
- package/dist/node/components/RelationalGraph.cjs.map +1 -1
- package/dist/node/components/RelationalGraph.d.cts.map +1 -1
- package/dist/node/components/RelationalGraph.d.mts.map +1 -1
- package/dist/node/components/RelationalGraph.d.ts.map +1 -1
- package/dist/node/components/RelationalGraph.js +4 -4
- package/dist/node/components/RelationalGraph.js.map +1 -1
- package/dist/node/components/index.cjs +120 -81
- package/dist/node/components/index.cjs.map +1 -1
- package/dist/node/components/index.js +119 -81
- package/dist/node/components/index.js.map +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.cjs +120 -81
- package/dist/node/components/module/graph/GraphFlexBox.cjs.map +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.cts +1 -0
- package/dist/node/components/module/graph/GraphFlexBox.d.cts.map +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.mts +1 -0
- package/dist/node/components/module/graph/GraphFlexBox.d.mts.map +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.d.ts +1 -0
- package/dist/node/components/module/graph/GraphFlexBox.d.ts.map +1 -1
- package/dist/node/components/module/graph/GraphFlexBox.js +118 -80
- package/dist/node/components/module/graph/GraphFlexBox.js.map +1 -1
- package/dist/node/components/module/graph/NodeHover.cjs +17 -10
- package/dist/node/components/module/graph/NodeHover.cjs.map +1 -1
- package/dist/node/components/module/graph/NodeHover.d.cts.map +1 -1
- package/dist/node/components/module/graph/NodeHover.d.mts.map +1 -1
- package/dist/node/components/module/graph/NodeHover.d.ts.map +1 -1
- package/dist/node/components/module/graph/NodeHover.js +20 -13
- package/dist/node/components/module/graph/NodeHover.js.map +1 -1
- package/dist/node/components/module/graph/Popper.cjs +2 -2
- package/dist/node/components/module/graph/Popper.cjs.map +1 -1
- package/dist/node/components/module/graph/Popper.d.cts +1 -1
- package/dist/node/components/module/graph/Popper.d.cts.map +1 -1
- package/dist/node/components/module/graph/Popper.d.mts +1 -1
- package/dist/node/components/module/graph/Popper.d.mts.map +1 -1
- package/dist/node/components/module/graph/Popper.d.ts +1 -1
- package/dist/node/components/module/graph/Popper.d.ts.map +1 -1
- package/dist/node/components/module/graph/Popper.js +3 -3
- package/dist/node/components/module/graph/Popper.js.map +1 -1
- package/dist/node/components/module/graph/index.cjs +120 -81
- package/dist/node/components/module/graph/index.cjs.map +1 -1
- package/dist/node/components/module/graph/index.js +118 -80
- package/dist/node/components/module/graph/index.js.map +1 -1
- package/dist/node/components/module/index.cjs +120 -81
- package/dist/node/components/module/index.cjs.map +1 -1
- package/dist/node/components/module/index.js +118 -80
- package/dist/node/components/module/index.js.map +1 -1
- package/dist/node/hooks/cytoscape/index.cjs +46 -28
- package/dist/node/hooks/cytoscape/index.cjs.map +1 -1
- package/dist/node/hooks/cytoscape/index.js +42 -24
- package/dist/node/hooks/cytoscape/index.js.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeElements.cjs +5 -5
- package/dist/node/hooks/cytoscape/useCytoscapeElements.cjs.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeElements.js +5 -5
- package/dist/node/hooks/cytoscape/useCytoscapeElements.js.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeOptions.cjs +5 -3
- package/dist/node/hooks/cytoscape/useCytoscapeOptions.cjs.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeOptions.d.cts.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeOptions.d.mts.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeOptions.d.ts.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeOptions.js +5 -3
- package/dist/node/hooks/cytoscape/useCytoscapeOptions.js.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeStyle.cjs.map +1 -1
- package/dist/node/hooks/cytoscape/useCytoscapeStyle.js.map +1 -1
- package/dist/node/hooks/cytoscape/useNewElements.cjs +5 -22
- package/dist/node/hooks/cytoscape/useNewElements.cjs.map +1 -1
- package/dist/node/hooks/cytoscape/useNewElements.d.cts.map +1 -1
- package/dist/node/hooks/cytoscape/useNewElements.d.mts.map +1 -1
- package/dist/node/hooks/cytoscape/useNewElements.d.ts.map +1 -1
- package/dist/node/hooks/cytoscape/useNewElements.js +5 -22
- package/dist/node/hooks/cytoscape/useNewElements.js.map +1 -1
- package/dist/node/hooks/cytoscape/useRelationalGraphOptions.cjs +10 -8
- package/dist/node/hooks/cytoscape/useRelationalGraphOptions.cjs.map +1 -1
- package/dist/node/hooks/cytoscape/useRelationalGraphOptions.js +10 -8
- package/dist/node/hooks/cytoscape/useRelationalGraphOptions.js.map +1 -1
- package/dist/node/hooks/cytoscape/useSelectedElement.cjs +30 -3
- package/dist/node/hooks/cytoscape/useSelectedElement.cjs.map +1 -1
- package/dist/node/hooks/cytoscape/useSelectedElement.d.cts.map +1 -1
- package/dist/node/hooks/cytoscape/useSelectedElement.d.mts.map +1 -1
- package/dist/node/hooks/cytoscape/useSelectedElement.d.ts.map +1 -1
- package/dist/node/hooks/cytoscape/useSelectedElement.js +30 -3
- package/dist/node/hooks/cytoscape/useSelectedElement.js.map +1 -1
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.cjs +61 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.cjs.map +1 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.d.cts +4 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.d.cts.map +1 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.d.mts +4 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.d.mts.map +1 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.d.ts +4 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.d.ts.map +1 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.js +36 -0
- package/dist/node/hooks/cytoscape/useToggleSelectedElement.js.map +1 -0
- package/dist/node/hooks/index.cjs +46 -28
- package/dist/node/hooks/index.cjs.map +1 -1
- package/dist/node/hooks/index.js +42 -24
- package/dist/node/hooks/index.js.map +1 -1
- package/dist/node/index.cjs +128 -81
- package/dist/node/index.cjs.map +1 -1
- package/dist/node/index.d.cts +1 -0
- package/dist/node/index.d.cts.map +1 -1
- package/dist/node/index.d.mts +1 -0
- package/dist/node/index.d.mts.map +1 -1
- package/dist/node/index.d.ts +1 -0
- package/dist/node/index.d.ts.map +1 -1
- package/dist/node/index.js +123 -81
- package/dist/node/index.js.map +1 -1
- package/package.json +27 -27
- package/src/Cytoscape/CytoscapeElements.ts +4 -4
- package/src/Cytoscape/CytoscapeStyles.ts +2 -0
- package/src/components/RelationalGraph.stories.tsx +4 -1
- package/src/components/RelationalGraph.tsx +14 -6
- package/src/components/module/graph/GraphFlexBox.stories.tsx +7 -10
- package/src/components/module/graph/GraphFlexBox.tsx +9 -0
- package/src/components/module/graph/NodeHover.tsx +32 -20
- package/src/components/module/graph/Popper.tsx +14 -10
- package/src/hooks/cytoscape/useCytoscapeOptions.ts +6 -3
- package/src/hooks/cytoscape/useNewElements.tsx +0 -10
- package/src/hooks/cytoscape/useSelectedElement.tsx +8 -3
- package/src/hooks/cytoscape/useToggleSelectedElement.tsx +30 -0
- package/src/index.ts +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeElements.ts","../../../../src/Cytoscape/CytoscapeElements.ts","../../../../src/Cytoscape/lib/parseModuleType.ts"],"sourcesContent":["import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction, ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../Cytoscape'\n\nexport const useCytoscapeElements = (module?: ModuleInstance | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async () => {\n if (module) {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n }\n },\n [module],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined = undefined\n let detachedListener: EventUnsubscribeFunction | undefined = undefined\n\n if (module && isNodeInstance(module)) {\n attachedListener = module.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n detachedListener = module.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [module])\n\n return elements\n}\n","import { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib'\n\nexport class CytoscapeElements {\n static MaxNameLength = 20\n\n static buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition) {\n return {\n data: {\n id: `${rootNode.data.id}/${newNode.data.id}`,\n source: rootNode.data.id,\n target: newNode.data.id,\n },\n }\n }\n\n static async buildElements(module: ModuleInstance): Promise<ElementDefinition[]> {\n const newRootNode = CytoscapeElements.buildRootNode(module)\n const newElements: ElementDefinition[] = [newRootNode]\n\n try {\n const childElements = await CytoscapeElements.recurseNodes(module)\n childElements?.forEach((module) => {\n const newNode = CytoscapeElements.buildNode(module, newRootNode.data.id)\n newElements.push(newNode)\n\n const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode)\n newElements.push(newEdge)\n })\n\n return newElements\n } catch (e) {\n console.error('error resolving modules', e)\n return []\n }\n }\n\n static buildNode(module: ModuleInstance,
|
|
1
|
+
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeElements.ts","../../../../src/Cytoscape/CytoscapeElements.ts","../../../../src/Cytoscape/lib/parseModuleType.ts"],"sourcesContent":["import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction, ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../Cytoscape'\n\nexport const useCytoscapeElements = (module?: ModuleInstance | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async () => {\n if (module) {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n }\n },\n [module],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined = undefined\n let detachedListener: EventUnsubscribeFunction | undefined = undefined\n\n if (module && isNodeInstance(module)) {\n attachedListener = module.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n detachedListener = module.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [module])\n\n return elements\n}\n","import { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib'\n\nexport class CytoscapeElements {\n static MaxNameLength = 20\n\n static buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition) {\n return {\n data: {\n id: `${rootNode.data.id}/${newNode.data.id}`,\n source: rootNode.data.id,\n target: newNode.data.id,\n },\n }\n }\n\n static async buildElements(module: ModuleInstance): Promise<ElementDefinition[]> {\n const newRootNode = CytoscapeElements.buildRootNode(module)\n const newElements: ElementDefinition[] = [newRootNode]\n\n try {\n const childElements = await CytoscapeElements.recurseNodes(module)\n childElements?.forEach((module) => {\n const newNode = CytoscapeElements.buildNode(module, { rootNodeId: newRootNode.data.id })\n newElements.push(newNode)\n\n const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode)\n newElements.push(newEdge)\n })\n\n return newElements\n } catch (e) {\n console.error('error resolving modules', e)\n return []\n }\n }\n\n static buildNode(module: ModuleInstance, properties?: { [key: string]: unknown }): ElementDefinition {\n const { address, config } = module\n const normalizedName = config.name ?? address.substring(0, 8)\n return {\n data: {\n address,\n id: address,\n name: normalizedName,\n type: parseModuleType(module),\n ...properties,\n },\n }\n }\n\n static buildRootNode = (module: ModuleInstance): ElementDefinition => {\n return CytoscapeElements.buildNode(module, { root: true })\n }\n\n static normalizeName(name?: string) {\n if (!name) return\n if (name.length > this.MaxNameLength) return `${name.substring(0, 20)}...`\n return name\n }\n\n static async recurseNodes(module: ModuleInstance, maxTraversals = 1): Promise<ModuleInstance[]> {\n let localDepth = 0\n const childModules: ModuleInstance[] = []\n\n const traverse = async (nestedNode: ModuleInstance) => {\n if (localDepth < maxTraversals) {\n const modules = await nestedNode.resolve(undefined, { direction: 'down', maxDepth: 2 })\n await Promise.all(\n modules.map(async (child) => {\n if (child !== nestedNode && isNodeInstance(child)) {\n localDepth++\n await traverse(child)\n // don't re add the root module that was passed in\n } else if (child !== module) {\n childModules.push(child)\n }\n }),\n )\n }\n }\n\n await traverse(module)\n\n return childModules\n }\n}\n","import { isArchivistInstance } from '@xyo-network/archivist-model'\nimport { isBridgeInstance } from '@xyo-network/bridge-model'\nimport { isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { isSentinelInstance } from '@xyo-network/sentinel'\nimport { isWitnessModule } from '@xyo-network/witness'\n\nimport { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const parseModuleType = (module?: ModuleInstance): CyNodeModuleTypes => {\n let type: CyNodeModuleTypes = 'module'\n if (module) {\n if (isArchivistInstance(module)) {\n type = 'archivist'\n } else if (isBridgeInstance(module)) {\n type = 'bridge'\n } else if (isDivinerInstance(module)) {\n type = 'diviner'\n } else if (isNodeInstance(module)) {\n type = 'node'\n } else if (isSentinelInstance(module)) {\n type = 'sentinel'\n } else if (isWitnessModule(module)) {\n type = 'witness'\n } else {\n type = 'module'\n }\n }\n return type\n}\n"],"mappings":"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","names":["import_node_model","import_node_model","module","module","module"]}
|
|
@@ -53,7 +53,7 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
53
53
|
try {
|
|
54
54
|
const childElements = await _CytoscapeElements.recurseNodes(module);
|
|
55
55
|
childElements?.forEach((module2) => {
|
|
56
|
-
const newNode = _CytoscapeElements.buildNode(module2, newRootNode.data.id);
|
|
56
|
+
const newNode = _CytoscapeElements.buildNode(module2, { rootNodeId: newRootNode.data.id });
|
|
57
57
|
newElements.push(newNode);
|
|
58
58
|
const newEdge = _CytoscapeElements.buildEdge(newRootNode, newNode);
|
|
59
59
|
newElements.push(newEdge);
|
|
@@ -64,7 +64,7 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
64
64
|
return [];
|
|
65
65
|
}
|
|
66
66
|
}
|
|
67
|
-
static buildNode(module,
|
|
67
|
+
static buildNode(module, properties) {
|
|
68
68
|
const { address, config } = module;
|
|
69
69
|
const normalizedName = config.name ?? address.substring(0, 8);
|
|
70
70
|
return {
|
|
@@ -72,13 +72,13 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
72
72
|
address,
|
|
73
73
|
id: address,
|
|
74
74
|
name: normalizedName,
|
|
75
|
-
|
|
76
|
-
|
|
75
|
+
type: parseModuleType(module),
|
|
76
|
+
...properties
|
|
77
77
|
}
|
|
78
78
|
};
|
|
79
79
|
}
|
|
80
80
|
static buildRootNode = (module) => {
|
|
81
|
-
return _CytoscapeElements.buildNode(module);
|
|
81
|
+
return _CytoscapeElements.buildNode(module, { root: true });
|
|
82
82
|
};
|
|
83
83
|
static normalizeName(name) {
|
|
84
84
|
if (!name)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeElements.ts","../../../../src/Cytoscape/CytoscapeElements.ts","../../../../src/Cytoscape/lib/parseModuleType.ts"],"sourcesContent":["import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction, ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../Cytoscape'\n\nexport const useCytoscapeElements = (module?: ModuleInstance | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async () => {\n if (module) {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n }\n },\n [module],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined = undefined\n let detachedListener: EventUnsubscribeFunction | undefined = undefined\n\n if (module && isNodeInstance(module)) {\n attachedListener = module.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n detachedListener = module.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [module])\n\n return elements\n}\n","import { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib'\n\nexport class CytoscapeElements {\n static MaxNameLength = 20\n\n static buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition) {\n return {\n data: {\n id: `${rootNode.data.id}/${newNode.data.id}`,\n source: rootNode.data.id,\n target: newNode.data.id,\n },\n }\n }\n\n static async buildElements(module: ModuleInstance): Promise<ElementDefinition[]> {\n const newRootNode = CytoscapeElements.buildRootNode(module)\n const newElements: ElementDefinition[] = [newRootNode]\n\n try {\n const childElements = await CytoscapeElements.recurseNodes(module)\n childElements?.forEach((module) => {\n const newNode = CytoscapeElements.buildNode(module, newRootNode.data.id)\n newElements.push(newNode)\n\n const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode)\n newElements.push(newEdge)\n })\n\n return newElements\n } catch (e) {\n console.error('error resolving modules', e)\n return []\n }\n }\n\n static buildNode(module: ModuleInstance,
|
|
1
|
+
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeElements.ts","../../../../src/Cytoscape/CytoscapeElements.ts","../../../../src/Cytoscape/lib/parseModuleType.ts"],"sourcesContent":["import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction, ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../Cytoscape'\n\nexport const useCytoscapeElements = (module?: ModuleInstance | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async () => {\n if (module) {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n }\n },\n [module],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined = undefined\n let detachedListener: EventUnsubscribeFunction | undefined = undefined\n\n if (module && isNodeInstance(module)) {\n attachedListener = module.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n detachedListener = module.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [module])\n\n return elements\n}\n","import { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib'\n\nexport class CytoscapeElements {\n static MaxNameLength = 20\n\n static buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition) {\n return {\n data: {\n id: `${rootNode.data.id}/${newNode.data.id}`,\n source: rootNode.data.id,\n target: newNode.data.id,\n },\n }\n }\n\n static async buildElements(module: ModuleInstance): Promise<ElementDefinition[]> {\n const newRootNode = CytoscapeElements.buildRootNode(module)\n const newElements: ElementDefinition[] = [newRootNode]\n\n try {\n const childElements = await CytoscapeElements.recurseNodes(module)\n childElements?.forEach((module) => {\n const newNode = CytoscapeElements.buildNode(module, { rootNodeId: newRootNode.data.id })\n newElements.push(newNode)\n\n const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode)\n newElements.push(newEdge)\n })\n\n return newElements\n } catch (e) {\n console.error('error resolving modules', e)\n return []\n }\n }\n\n static buildNode(module: ModuleInstance, properties?: { [key: string]: unknown }): ElementDefinition {\n const { address, config } = module\n const normalizedName = config.name ?? address.substring(0, 8)\n return {\n data: {\n address,\n id: address,\n name: normalizedName,\n type: parseModuleType(module),\n ...properties,\n },\n }\n }\n\n static buildRootNode = (module: ModuleInstance): ElementDefinition => {\n return CytoscapeElements.buildNode(module, { root: true })\n }\n\n static normalizeName(name?: string) {\n if (!name) return\n if (name.length > this.MaxNameLength) return `${name.substring(0, 20)}...`\n return name\n }\n\n static async recurseNodes(module: ModuleInstance, maxTraversals = 1): Promise<ModuleInstance[]> {\n let localDepth = 0\n const childModules: ModuleInstance[] = []\n\n const traverse = async (nestedNode: ModuleInstance) => {\n if (localDepth < maxTraversals) {\n const modules = await nestedNode.resolve(undefined, { direction: 'down', maxDepth: 2 })\n await Promise.all(\n modules.map(async (child) => {\n if (child !== nestedNode && isNodeInstance(child)) {\n localDepth++\n await traverse(child)\n // don't re add the root module that was passed in\n } else if (child !== module) {\n childModules.push(child)\n }\n }),\n )\n }\n }\n\n await traverse(module)\n\n return childModules\n }\n}\n","import { isArchivistInstance } from '@xyo-network/archivist-model'\nimport { isBridgeInstance } from '@xyo-network/bridge-model'\nimport { isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { isSentinelInstance } from '@xyo-network/sentinel'\nimport { isWitnessModule } from '@xyo-network/witness'\n\nimport { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const parseModuleType = (module?: ModuleInstance): CyNodeModuleTypes => {\n let type: CyNodeModuleTypes = 'module'\n if (module) {\n if (isArchivistInstance(module)) {\n type = 'archivist'\n } else if (isBridgeInstance(module)) {\n type = 'bridge'\n } else if (isDivinerInstance(module)) {\n type = 'diviner'\n } else if (isNodeInstance(module)) {\n type = 'node'\n } else if (isSentinelInstance(module)) {\n type = 'sentinel'\n } else if (isWitnessModule(module)) {\n type = 'witness'\n } else {\n type = 'module'\n }\n }\n return type\n}\n"],"mappings":";AAAA,SAAS,sBAAsB;AAE/B,SAAS,kBAAAA,uBAAsB;AAE/B,SAAS,WAAW,gBAAgB;;;ACHpC,SAAS,kBAAAC,uBAAsB;;;ACD/B,SAAS,2BAA2B;AACpC,SAAS,wBAAwB;AACjC,SAAS,yBAAyB;AAElC,SAAS,sBAAsB;AAC/B,SAAS,0BAA0B;AACnC,SAAS,uBAAuB;AAIzB,IAAM,kBAAkB,CAAC,WAA+C;AAC7E,MAAI,OAA0B;AAC9B,MAAI,QAAQ;AACV,QAAI,oBAAoB,MAAM,GAAG;AAC/B,aAAO;AAAA,IACT,WAAW,iBAAiB,MAAM,GAAG;AACnC,aAAO;AAAA,IACT,WAAW,kBAAkB,MAAM,GAAG;AACpC,aAAO;AAAA,IACT,WAAW,eAAe,MAAM,GAAG;AACjC,aAAO;AAAA,IACT,WAAW,mBAAmB,MAAM,GAAG;AACrC,aAAO;AAAA,IACT,WAAW,gBAAgB,MAAM,GAAG;AAClC,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF;AACA,SAAO;AACT;;;ADxBO,IAAM,oBAAN,MAAM,mBAAkB;AAAA,EAC7B,OAAO,gBAAgB;AAAA,EAEvB,OAAO,UAAU,UAA6B,SAA4B;AACxE,WAAO;AAAA,MACL,MAAM;AAAA,QACJ,IAAI,GAAG,SAAS,KAAK,EAAE,IAAI,QAAQ,KAAK,EAAE;AAAA,QAC1C,QAAQ,SAAS,KAAK;AAAA,QACtB,QAAQ,QAAQ,KAAK;AAAA,MACvB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,aAAa,cAAc,QAAsD;AAC/E,UAAM,cAAc,mBAAkB,cAAc,MAAM;AAC1D,UAAM,cAAmC,CAAC,WAAW;AAErD,QAAI;AACF,YAAM,gBAAgB,MAAM,mBAAkB,aAAa,MAAM;AACjE,qBAAe,QAAQ,CAACC,YAAW;AACjC,cAAM,UAAU,mBAAkB,UAAUA,SAAQ,EAAE,YAAY,YAAY,KAAK,GAAG,CAAC;AACvF,oBAAY,KAAK,OAAO;AAExB,cAAM,UAAU,mBAAkB,UAAU,aAAa,OAAO;AAChE,oBAAY,KAAK,OAAO;AAAA,MAC1B,CAAC;AAED,aAAO;AAAA,IACT,SAAS,GAAG;AACV,cAAQ,MAAM,2BAA2B,CAAC;AAC1C,aAAO,CAAC;AAAA,IACV;AAAA,EACF;AAAA,EAEA,OAAO,UAAU,QAAwB,YAA4D;AACnG,UAAM,EAAE,SAAS,OAAO,IAAI;AAC5B,UAAM,iBAAiB,OAAO,QAAQ,QAAQ,UAAU,GAAG,CAAC;AAC5D,WAAO;AAAA,MACL,MAAM;AAAA,QACJ;AAAA,QACA,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,MAAM,gBAAgB,MAAM;AAAA,QAC5B,GAAG;AAAA,MACL;AAAA,IACF;AAAA,EACF;AAAA,EAEA,OAAO,gBAAgB,CAAC,WAA8C;AACpE,WAAO,mBAAkB,UAAU,QAAQ,EAAE,MAAM,KAAK,CAAC;AAAA,EAC3D;AAAA,EAEA,OAAO,cAAc,MAAe;AAClC,QAAI,CAAC;AAAM;AACX,QAAI,KAAK,SAAS,KAAK;AAAe,aAAO,GAAG,KAAK,UAAU,GAAG,EAAE,CAAC;AACrE,WAAO;AAAA,EACT;AAAA,EAEA,aAAa,aAAa,QAAwB,gBAAgB,GAA8B;AAC9F,QAAI,aAAa;AACjB,UAAM,eAAiC,CAAC;AAExC,UAAM,WAAW,OAAO,eAA+B;AACrD,UAAI,aAAa,eAAe;AAC9B,cAAM,UAAU,MAAM,WAAW,QAAQ,QAAW,EAAE,WAAW,QAAQ,UAAU,EAAE,CAAC;AACtF,cAAM,QAAQ;AAAA,UACZ,QAAQ,IAAI,OAAO,UAAU;AAC3B,gBAAI,UAAU,cAAcC,gBAAe,KAAK,GAAG;AACjD;AACA,oBAAM,SAAS,KAAK;AAAA,YAEtB,WAAW,UAAU,QAAQ;AAC3B,2BAAa,KAAK,KAAK;AAAA,YACzB;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAEA,UAAM,SAAS,MAAM;AAErB,WAAO;AAAA,EACT;AACF;;;ADjFO,IAAM,uBAAuB,CAAC,WAAmC;AACtE,QAAM,CAAC,UAAU,WAAW,IAAI,SAA8B,CAAC,CAAC;AAEhE;AAAA;AAAA,IAEE,YAAY;AACV,UAAI,QAAQ;AACV,cAAM,cAAe,MAAM,kBAAkB,cAAc,MAAM,KAAM,CAAC;AACxE,oBAAY,WAAW;AAAA,MACzB;AAAA,IACF;AAAA,IACA,CAAC,MAAM;AAAA,EACT;AAEA,YAAU,MAAM;AACd,QAAI,mBAAyD;AAC7D,QAAI,mBAAyD;AAE7D,QAAI,UAAUC,gBAAe,MAAM,GAAG;AACpC,yBAAmB,OAAO,GAAG,kBAAkB,YAAY;AACzD,cAAM,cAAe,MAAM,kBAAkB,cAAc,MAAM,KAAM,CAAC;AACxE,oBAAY,WAAW;AAAA,MACzB,CAAC;AACD,yBAAmB,OAAO,GAAG,kBAAkB,YAAY;AACzD,cAAM,cAAe,MAAM,kBAAkB,cAAc,MAAM,KAAM,CAAC;AACxE,oBAAY,WAAW;AAAA,MACzB,CAAC;AAAA,IACH;AAEA,WAAO,MAAM;AACX,yBAAmB;AACnB,yBAAmB;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,MAAM,CAAC;AAEX,SAAO;AACT;","names":["isNodeInstance","isNodeInstance","module","isNodeInstance","isNodeInstance"]}
|
|
@@ -151,12 +151,14 @@ var useCytoscapeStyle = (hideLabels = false) => {
|
|
|
151
151
|
// src/hooks/cytoscape/useCytoscapeOptions.ts
|
|
152
152
|
var useCytoscapeOptions = (elements, style, layout) => {
|
|
153
153
|
const defaultStyle = useCytoscapeStyle();
|
|
154
|
+
const resolvedLayout = layout ?? ConcentricLayout;
|
|
155
|
+
const resolvedStyle = style ?? defaultStyle;
|
|
154
156
|
const options = (0, import_react3.useMemo)(() => {
|
|
155
|
-
if (elements &&
|
|
157
|
+
if (elements && resolvedLayout && resolvedStyle) {
|
|
156
158
|
return {
|
|
157
159
|
elements,
|
|
158
|
-
layout:
|
|
159
|
-
style:
|
|
160
|
+
layout: resolvedLayout,
|
|
161
|
+
style: resolvedStyle
|
|
160
162
|
};
|
|
161
163
|
}
|
|
162
164
|
}, [elements, layout, style]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts","../../../../src/Cytoscape/lib/encodeSvg.ts","../../../../src/Cytoscape/lib/iconMap.ts","../../../../src/Cytoscape/lib/layout/ConcentricLayout.ts","../../../../src/Cytoscape/CytoscapeIcons.tsx","../../../../src/Cytoscape/CytoscapeStyles.ts","../../../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../../../src/hooks/cytoscape/useIcons.tsx"],"sourcesContent":["import { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useCytoscapeOptions = (\n elements: CytoscapeOptions['elements'],\n style?: CytoscapeOptions['style'],\n layout?: CytoscapeOptions['layout'],\n) => {\n const defaultStyle = useCytoscapeStyle()\n\n const options = useMemo<CytoscapeOptions | undefined>(() => {\n if (elements &&
|
|
1
|
+
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts","../../../../src/Cytoscape/lib/encodeSvg.ts","../../../../src/Cytoscape/lib/iconMap.ts","../../../../src/Cytoscape/lib/layout/ConcentricLayout.ts","../../../../src/Cytoscape/CytoscapeIcons.tsx","../../../../src/Cytoscape/CytoscapeStyles.ts","../../../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../../../src/hooks/cytoscape/useIcons.tsx"],"sourcesContent":["import { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useCytoscapeOptions = (\n elements: CytoscapeOptions['elements'],\n style?: CytoscapeOptions['style'],\n layout?: CytoscapeOptions['layout'],\n) => {\n const defaultStyle = useCytoscapeStyle()\n\n const resolvedLayout = layout ?? ConcentricLayout\n const resolvedStyle = style ?? defaultStyle\n\n const options = useMemo<CytoscapeOptions | undefined>(() => {\n if (elements && resolvedLayout && resolvedStyle) {\n return {\n elements,\n layout: resolvedLayout,\n style: resolvedStyle,\n }\n }\n }, [elements, layout, style])\n\n return options\n}\n","import { ReactElement } from 'react'\n// eslint-disable-next-line import/no-internal-modules\nimport { renderToStaticMarkup } from 'react-dom/server'\n\nconst dataUri = 'data:image/svg+xml,'\n\nexport const encodeSvg = (reactElement: ReactElement, color?: string) => {\n const svgString = renderToStaticMarkup(reactElement)\n\n const doc = new DOMParser().parseFromString(svgString, 'text/html')\n const svgElement = doc.getElementsByTagName('svg')[0]\n if (svgElement) {\n svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg')\n svgElement.setAttribute('height', '100')\n svgElement.style.fill = color ?? 'black'\n }\n\n return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`\n}\n","import { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n module: '',\n node: '',\n sentinel: '',\n witness: '',\n})\n","import { LayoutOptions } from 'cytoscape'\n\nexport const ConcentricLayout: LayoutOptions = {\n concentric: function (node) {\n return node.degree()\n },\n levelWidth: function () {\n return 2\n },\n minNodeSpacing: 75,\n name: 'concentric',\n}\n","import {\n BubbleChartRounded as BubbleChartRoundedIcon,\n Hub as HubIcon,\n InsertLinkRounded as InsertLinkRoundedIcon,\n Inventory2Rounded as Inventory2RoundedIcon,\n QuestionMarkRounded as QuestionMarkRoundedIcon,\n TimerRounded as TimerRoundedIcon,\n VisibilityRounded as VisibilityRoundedIcon,\n} from '@mui/icons-material'\nimport { SvgIconTypeMap } from '@mui/material'\nimport { OverridableComponent } from '@mui/material/OverridableComponent'\n\nimport { CyNodeModuleTypes } from './lib'\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import { Stylesheet } from 'cytoscape'\n\nimport { CyNodeModuleTypes } from './lib'\n\nexport const NodeIdStyles = (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 NodeStyled = (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 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\nexport const NodeBgStyles = (bgColor: string): [string, string] => ['background-color', bgColor]\n","import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, NodeIdStyles, NodeStyled } from '../../Cytoscape'\nimport { useIcons } from './useIcons'\n\nexport const useCytoscapeStyle = (hideLabels = false) => {\n const theme = useTheme()\n const icons = useIcons()\n\n const style: CytoscapeOptions['style'] = useMemo(\n () => [\n NodeIdStyles(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),\n NodeStyled(icons, theme.palette.primary.main, hideLabels),\n EdgeStyled(theme.palette.divider, theme.palette.divider),\n ],\n [icons, hideLabels, theme],\n )\n\n return style\n}\n","import { useTheme } from '@mui/material'\nimport { useMemo } from 'react'\n\nimport { CyIconSet, CyNodeModuleTypes, encodeSvg, generateIconMap } from '../../Cytoscape'\n\nexport const useIcons = () => {\n const theme = useTheme()\n const icons = useMemo(() => {\n const iconMap = generateIconMap()\n 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"],"mappings":"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","names":["import_react","Inventory2RoundedIcon","InsertLinkRoundedIcon","BubbleChartRoundedIcon","QuestionMarkRoundedIcon","HubIcon","TimerRoundedIcon","VisibilityRoundedIcon","import_material","import_react"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCytoscapeOptions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAM5C,eAAO,MAAM,mBAAmB,aACpB,gBAAgB,CAAC,UAAU,CAAC,UAC9B,gBAAgB,CAAC,OAAO,CAAC,WACxB,gBAAgB,CAAC,QAAQ,CAAC,
|
|
1
|
+
{"version":3,"file":"useCytoscapeOptions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAM5C,eAAO,MAAM,mBAAmB,aACpB,gBAAgB,CAAC,UAAU,CAAC,UAC9B,gBAAgB,CAAC,OAAO,CAAC,WACxB,gBAAgB,CAAC,QAAQ,CAAC,iCAkBpC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCytoscapeOptions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAM5C,eAAO,MAAM,mBAAmB,aACpB,gBAAgB,CAAC,UAAU,CAAC,UAC9B,gBAAgB,CAAC,OAAO,CAAC,WACxB,gBAAgB,CAAC,QAAQ,CAAC,
|
|
1
|
+
{"version":3,"file":"useCytoscapeOptions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAM5C,eAAO,MAAM,mBAAmB,aACpB,gBAAgB,CAAC,UAAU,CAAC,UAC9B,gBAAgB,CAAC,OAAO,CAAC,WACxB,gBAAgB,CAAC,QAAQ,CAAC,iCAkBpC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCytoscapeOptions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAM5C,eAAO,MAAM,mBAAmB,aACpB,gBAAgB,CAAC,UAAU,CAAC,UAC9B,gBAAgB,CAAC,OAAO,CAAC,WACxB,gBAAgB,CAAC,QAAQ,CAAC,
|
|
1
|
+
{"version":3,"file":"useCytoscapeOptions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAM5C,eAAO,MAAM,mBAAmB,aACpB,gBAAgB,CAAC,UAAU,CAAC,UAC9B,gBAAgB,CAAC,OAAO,CAAC,WACxB,gBAAgB,CAAC,QAAQ,CAAC,iCAkBpC,CAAA"}
|
|
@@ -135,12 +135,14 @@ var useCytoscapeStyle = (hideLabels = false) => {
|
|
|
135
135
|
// src/hooks/cytoscape/useCytoscapeOptions.ts
|
|
136
136
|
var useCytoscapeOptions = (elements, style, layout) => {
|
|
137
137
|
const defaultStyle = useCytoscapeStyle();
|
|
138
|
+
const resolvedLayout = layout ?? ConcentricLayout;
|
|
139
|
+
const resolvedStyle = style ?? defaultStyle;
|
|
138
140
|
const options = useMemo3(() => {
|
|
139
|
-
if (elements &&
|
|
141
|
+
if (elements && resolvedLayout && resolvedStyle) {
|
|
140
142
|
return {
|
|
141
143
|
elements,
|
|
142
|
-
layout:
|
|
143
|
-
style:
|
|
144
|
+
layout: resolvedLayout,
|
|
145
|
+
style: resolvedStyle
|
|
144
146
|
};
|
|
145
147
|
}
|
|
146
148
|
}, [elements, layout, style]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts","../../../../src/Cytoscape/lib/encodeSvg.ts","../../../../src/Cytoscape/lib/iconMap.ts","../../../../src/Cytoscape/lib/layout/ConcentricLayout.ts","../../../../src/Cytoscape/CytoscapeIcons.tsx","../../../../src/Cytoscape/CytoscapeStyles.ts","../../../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../../../src/hooks/cytoscape/useIcons.tsx"],"sourcesContent":["import { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useCytoscapeOptions = (\n elements: CytoscapeOptions['elements'],\n style?: CytoscapeOptions['style'],\n layout?: CytoscapeOptions['layout'],\n) => {\n const defaultStyle = useCytoscapeStyle()\n\n const options = useMemo<CytoscapeOptions | undefined>(() => {\n if (elements &&
|
|
1
|
+
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeOptions.ts","../../../../src/Cytoscape/lib/encodeSvg.ts","../../../../src/Cytoscape/lib/iconMap.ts","../../../../src/Cytoscape/lib/layout/ConcentricLayout.ts","../../../../src/Cytoscape/CytoscapeIcons.tsx","../../../../src/Cytoscape/CytoscapeStyles.ts","../../../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../../../src/hooks/cytoscape/useIcons.tsx"],"sourcesContent":["import { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useCytoscapeOptions = (\n elements: CytoscapeOptions['elements'],\n style?: CytoscapeOptions['style'],\n layout?: CytoscapeOptions['layout'],\n) => {\n const defaultStyle = useCytoscapeStyle()\n\n const resolvedLayout = layout ?? ConcentricLayout\n const resolvedStyle = style ?? defaultStyle\n\n const options = useMemo<CytoscapeOptions | undefined>(() => {\n if (elements && resolvedLayout && resolvedStyle) {\n return {\n elements,\n layout: resolvedLayout,\n style: resolvedStyle,\n }\n }\n }, [elements, layout, style])\n\n return options\n}\n","import { ReactElement } from 'react'\n// eslint-disable-next-line import/no-internal-modules\nimport { renderToStaticMarkup } from 'react-dom/server'\n\nconst dataUri = 'data:image/svg+xml,'\n\nexport const encodeSvg = (reactElement: ReactElement, color?: string) => {\n const svgString = renderToStaticMarkup(reactElement)\n\n const doc = new DOMParser().parseFromString(svgString, 'text/html')\n const svgElement = doc.getElementsByTagName('svg')[0]\n if (svgElement) {\n svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg')\n svgElement.setAttribute('height', '100')\n svgElement.style.fill = color ?? 'black'\n }\n\n return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`\n}\n","import { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n module: '',\n node: '',\n sentinel: '',\n witness: '',\n})\n","import { LayoutOptions } from 'cytoscape'\n\nexport const ConcentricLayout: LayoutOptions = {\n concentric: function (node) {\n return node.degree()\n },\n levelWidth: function () {\n return 2\n },\n minNodeSpacing: 75,\n name: 'concentric',\n}\n","import {\n BubbleChartRounded as BubbleChartRoundedIcon,\n Hub as HubIcon,\n InsertLinkRounded as InsertLinkRoundedIcon,\n Inventory2Rounded as Inventory2RoundedIcon,\n QuestionMarkRounded as QuestionMarkRoundedIcon,\n TimerRounded as TimerRoundedIcon,\n VisibilityRounded as VisibilityRoundedIcon,\n} from '@mui/icons-material'\nimport { SvgIconTypeMap } from '@mui/material'\nimport { OverridableComponent } from '@mui/material/OverridableComponent'\n\nimport { CyNodeModuleTypes } from './lib'\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import { Stylesheet } from 'cytoscape'\n\nimport { CyNodeModuleTypes } from './lib'\n\nexport const NodeIdStyles = (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 NodeStyled = (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 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\nexport const NodeBgStyles = (bgColor: string): [string, string] => ['background-color', bgColor]\n","import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, NodeIdStyles, NodeStyled } from '../../Cytoscape'\nimport { useIcons } from './useIcons'\n\nexport const useCytoscapeStyle = (hideLabels = false) => {\n const theme = useTheme()\n const icons = useIcons()\n\n const style: CytoscapeOptions['style'] = useMemo(\n () => [\n NodeIdStyles(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),\n NodeStyled(icons, theme.palette.primary.main, hideLabels),\n EdgeStyled(theme.palette.divider, theme.palette.divider),\n ],\n [icons, hideLabels, theme],\n )\n\n return style\n}\n","import { useTheme } from '@mui/material'\nimport { useMemo } from 'react'\n\nimport { CyIconSet, CyNodeModuleTypes, encodeSvg, generateIconMap } from '../../Cytoscape'\n\nexport const useIcons = () => {\n const theme = useTheme()\n const icons = useMemo(() => {\n const iconMap = generateIconMap()\n 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"],"mappings":"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","names":["useMemo","useTheme","useMemo","useTheme","useMemo","useMemo"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../../../src/Cytoscape/lib/encodeSvg.ts","../../../../src/Cytoscape/lib/iconMap.ts","../../../../src/Cytoscape/CytoscapeIcons.tsx","../../../../src/Cytoscape/CytoscapeStyles.ts","../../../../src/hooks/cytoscape/useIcons.tsx"],"sourcesContent":["import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, NodeIdStyles, NodeStyled } from '../../Cytoscape'\nimport { useIcons } from './useIcons'\n\nexport const useCytoscapeStyle = (hideLabels = false) => {\n const theme = useTheme()\n const icons = useIcons()\n\n const style: CytoscapeOptions['style'] = useMemo(\n () => [\n NodeIdStyles(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),\n NodeStyled(icons, theme.palette.primary.main, hideLabels),\n EdgeStyled(theme.palette.divider, theme.palette.divider),\n ],\n [icons, hideLabels, theme],\n )\n\n return style\n}\n","import { ReactElement } from 'react'\n// eslint-disable-next-line import/no-internal-modules\nimport { renderToStaticMarkup } from 'react-dom/server'\n\nconst dataUri = 'data:image/svg+xml,'\n\nexport const encodeSvg = (reactElement: ReactElement, color?: string) => {\n const svgString = renderToStaticMarkup(reactElement)\n\n const doc = new DOMParser().parseFromString(svgString, 'text/html')\n const svgElement = doc.getElementsByTagName('svg')[0]\n if (svgElement) {\n svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg')\n svgElement.setAttribute('height', '100')\n svgElement.style.fill = color ?? 'black'\n }\n\n return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`\n}\n","import { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n module: '',\n node: '',\n sentinel: '',\n witness: '',\n})\n","import {\n BubbleChartRounded as BubbleChartRoundedIcon,\n Hub as HubIcon,\n InsertLinkRounded as InsertLinkRoundedIcon,\n Inventory2Rounded as Inventory2RoundedIcon,\n QuestionMarkRounded as QuestionMarkRoundedIcon,\n TimerRounded as TimerRoundedIcon,\n VisibilityRounded as VisibilityRoundedIcon,\n} from '@mui/icons-material'\nimport { SvgIconTypeMap } from '@mui/material'\nimport { OverridableComponent } from '@mui/material/OverridableComponent'\n\nimport { CyNodeModuleTypes } from './lib'\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import { Stylesheet } from 'cytoscape'\n\nimport { CyNodeModuleTypes } from './lib'\n\nexport const NodeIdStyles = (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 NodeStyled = (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 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 { useTheme } from '@mui/material'\nimport { useMemo } from 'react'\n\nimport { CyIconSet, CyNodeModuleTypes, encodeSvg, generateIconMap } from '../../Cytoscape'\n\nexport const useIcons = () => {\n const theme = useTheme()\n const icons = useMemo(() => {\n const iconMap = generateIconMap()\n 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"],"mappings":"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","names":["import_material","import_react","Inventory2RoundedIcon","InsertLinkRoundedIcon","BubbleChartRoundedIcon","QuestionMarkRoundedIcon","HubIcon","TimerRoundedIcon","VisibilityRoundedIcon"]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../../../src/Cytoscape/lib/encodeSvg.ts","../../../../src/Cytoscape/lib/iconMap.ts","../../../../src/Cytoscape/CytoscapeIcons.tsx","../../../../src/Cytoscape/CytoscapeStyles.ts","../../../../src/hooks/cytoscape/useIcons.tsx"],"sourcesContent":["import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, NodeIdStyles, NodeStyled } from '../../Cytoscape'\nimport { useIcons } from './useIcons'\n\nexport const useCytoscapeStyle = (hideLabels = false) => {\n const theme = useTheme()\n const icons = useIcons()\n\n const style: CytoscapeOptions['style'] = useMemo(\n () => [\n NodeIdStyles(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),\n NodeStyled(icons, theme.palette.primary.main, hideLabels),\n EdgeStyled(theme.palette.divider, theme.palette.divider),\n ],\n [icons, hideLabels, theme],\n )\n\n return style\n}\n","import { ReactElement } from 'react'\n// eslint-disable-next-line import/no-internal-modules\nimport { renderToStaticMarkup } from 'react-dom/server'\n\nconst dataUri = 'data:image/svg+xml,'\n\nexport const encodeSvg = (reactElement: ReactElement, color?: string) => {\n const svgString = renderToStaticMarkup(reactElement)\n\n const doc = new DOMParser().parseFromString(svgString, 'text/html')\n const svgElement = doc.getElementsByTagName('svg')[0]\n if (svgElement) {\n svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg')\n svgElement.setAttribute('height', '100')\n svgElement.style.fill = color ?? 'black'\n }\n\n return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`\n}\n","import { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n module: '',\n node: '',\n sentinel: '',\n witness: '',\n})\n","import {\n BubbleChartRounded as BubbleChartRoundedIcon,\n Hub as HubIcon,\n InsertLinkRounded as InsertLinkRoundedIcon,\n Inventory2Rounded as Inventory2RoundedIcon,\n QuestionMarkRounded as QuestionMarkRoundedIcon,\n TimerRounded as TimerRoundedIcon,\n VisibilityRounded as VisibilityRoundedIcon,\n} from '@mui/icons-material'\nimport { SvgIconTypeMap } from '@mui/material'\nimport { OverridableComponent } from '@mui/material/OverridableComponent'\n\nimport { CyNodeModuleTypes } from './lib'\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import { Stylesheet } from 'cytoscape'\n\nimport { CyNodeModuleTypes } from './lib'\n\nexport const NodeIdStyles = (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 NodeStyled = (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 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\nexport const NodeBgStyles = (bgColor: string): [string, string] => ['background-color', bgColor]\n","import { useTheme } from '@mui/material'\nimport { useMemo } from 'react'\n\nimport { CyIconSet, CyNodeModuleTypes, encodeSvg, generateIconMap } from '../../Cytoscape'\n\nexport const useIcons = () => {\n const theme = useTheme()\n const icons = useMemo(() => {\n const iconMap = generateIconMap()\n 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"],"mappings":"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","names":["import_material","import_react","Inventory2RoundedIcon","InsertLinkRoundedIcon","BubbleChartRoundedIcon","QuestionMarkRoundedIcon","HubIcon","TimerRoundedIcon","VisibilityRoundedIcon"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../../../src/Cytoscape/lib/encodeSvg.ts","../../../../src/Cytoscape/lib/iconMap.ts","../../../../src/Cytoscape/CytoscapeIcons.tsx","../../../../src/Cytoscape/CytoscapeStyles.ts","../../../../src/hooks/cytoscape/useIcons.tsx"],"sourcesContent":["import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, NodeIdStyles, NodeStyled } from '../../Cytoscape'\nimport { useIcons } from './useIcons'\n\nexport const useCytoscapeStyle = (hideLabels = false) => {\n const theme = useTheme()\n const icons = useIcons()\n\n const style: CytoscapeOptions['style'] = useMemo(\n () => [\n NodeIdStyles(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),\n NodeStyled(icons, theme.palette.primary.main, hideLabels),\n EdgeStyled(theme.palette.divider, theme.palette.divider),\n ],\n [icons, hideLabels, theme],\n )\n\n return style\n}\n","import { ReactElement } from 'react'\n// eslint-disable-next-line import/no-internal-modules\nimport { renderToStaticMarkup } from 'react-dom/server'\n\nconst dataUri = 'data:image/svg+xml,'\n\nexport const encodeSvg = (reactElement: ReactElement, color?: string) => {\n const svgString = renderToStaticMarkup(reactElement)\n\n const doc = new DOMParser().parseFromString(svgString, 'text/html')\n const svgElement = doc.getElementsByTagName('svg')[0]\n if (svgElement) {\n svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg')\n svgElement.setAttribute('height', '100')\n svgElement.style.fill = color ?? 'black'\n }\n\n return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`\n}\n","import { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n module: '',\n node: '',\n sentinel: '',\n witness: '',\n})\n","import {\n BubbleChartRounded as BubbleChartRoundedIcon,\n Hub as HubIcon,\n InsertLinkRounded as InsertLinkRoundedIcon,\n Inventory2Rounded as Inventory2RoundedIcon,\n QuestionMarkRounded as QuestionMarkRoundedIcon,\n TimerRounded as TimerRoundedIcon,\n VisibilityRounded as VisibilityRoundedIcon,\n} from '@mui/icons-material'\nimport { SvgIconTypeMap } from '@mui/material'\nimport { OverridableComponent } from '@mui/material/OverridableComponent'\n\nimport { CyNodeModuleTypes } from './lib'\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import { Stylesheet } from 'cytoscape'\n\nimport { CyNodeModuleTypes } from './lib'\n\nexport const NodeIdStyles = (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 NodeStyled = (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 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 { useTheme } from '@mui/material'\nimport { useMemo } from 'react'\n\nimport { CyIconSet, CyNodeModuleTypes, encodeSvg, generateIconMap } from '../../Cytoscape'\n\nexport const useIcons = () => {\n const theme = useTheme()\n const icons = useMemo(() => {\n const iconMap = generateIconMap()\n 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"],"mappings":";AAAA,SAAS,YAAAA,iBAAgB;AAEzB,SAAS,WAAAC,gBAAe;;;ACAxB,SAAS,4BAA4B;AAErC,IAAM,UAAU;AAET,IAAM,YAAY,CAAC,cAA4B,UAAmB;AACvE,QAAM,YAAY,qBAAqB,YAAY;AAEnD,QAAM,MAAM,IAAI,UAAU,EAAE,gBAAgB,WAAW,WAAW;AAClE,QAAM,aAAa,IAAI,qBAAqB,KAAK,EAAE,CAAC;AACpD,MAAI,YAAY;AACd,eAAW,aAAa,SAAS,4BAA4B;AAC7D,eAAW,aAAa,UAAU,KAAK;AACvC,eAAW,MAAM,OAAO,SAAS;AAAA,EACnC;AAEA,SAAO,GAAG,OAAO,GAAG,OAAO,mBAAmB,WAAW,SAAS,CAAC;AACrE;;;AChBO,IAAM,kBAA2D,OAAO;AAAA,EAC7E,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,UAAU;AAAA,EACV,SAAS;AACX;;;ACVA;AAAA,EACE,sBAAsB;AAAA,EACtB,OAAO;AAAA,EACP,qBAAqB;AAAA,EACrB,qBAAqB;AAAA,EACrB,uBAAuB;AAAA,EACvB,gBAAgB;AAAA,EAChB,qBAAqB;AAAA,OAChB;AAOA,IAAM,YAAwF;AAAA,EACnG,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,UAAU;AAAA,EACV,SAAS;AACX;;;ACnBO,IAAM,eAAe,CAAC,OAAgB,kBAAuC;AAAA,EAClF,UAAU;AAAA,EACV,OAAO;AAAA,IACL;AAAA,IACA,eAAe;AAAA,IACf,aAAa;AAAA,IACb,mBAAmB;AAAA,IACnB,eAAe;AAAA,IACf,sBAAsB;AAAA,IACtB,sBAAsB;AAAA,IACtB,eAAe;AAAA,EACjB;AACF;AAEO,IAAM,aAAa,CAAC,OAA0C,SAAkB,aAAa,WAAuB;AAAA,EACzH,UAAU;AAAA,EACV,OAAO;AAAA,IACL,oBAAoB;AAAA,IACpB,qBAAqB;AAAA,IACrB,oBAAoB,CAAC,SAAS,MAAM,KAAK,KAAK,MAAM,CAAsB;AAAA,IAC1E,oBAAoB;AAAA,IACpB,OAAO,aAAa,SAAY;AAAA,IAChC,OAAO;AAAA,EACT;AACF;AAEO,IAAM,aAAa,CAAC,WAAoB,sBAA+B;AAAA,EAC5E,UAAU;AAAA,EACV,OAAO;AAAA,IACL,eAAe;AAAA,IACf,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,sBAAsB;AAAA,IACtB,sBAAsB;AAAA,IACtB,OAAO;AAAA,EACT;AACF;;;ACxCA,SAAS,gBAAgB;AACzB,SAAS,eAAe;AASL;AALZ,IAAM,WAAW,MAAM;AAC5B,QAAM,QAAQ,SAAS;AACvB,QAAM,QAAQ,QAAQ,MAAM;AAC1B,UAAM,UAAU,gBAAgB;AAChC,WAAO,OAAO,QAAQ,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,aAAa,MAAM;AACtE,YAAM,OAAO,oBAAC,iBAAc,UAAS,SAAQ;AAC7C,UAAI,IAAyB,IAAI,UAAU,MAAM,MAAM,QAAQ,gBAAgB,MAAM,QAAQ,KAAK,OAAO,CAAC;AAC1G,aAAO;AAAA,IACT,GAAG,OAAO;AAAA,EACZ,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,SAAO;AACT;;;ALVO,IAAM,oBAAoB,CAAC,aAAa,UAAU;AACvD,QAAM,QAAQC,UAAS;AACvB,QAAM,QAAQ,SAAS;AAEvB,QAAM,QAAmCC;AAAA,IACvC,MAAM;AAAA,MACJ,aAAa,MAAM,QAAQ,KAAK,SAAS,MAAM,QAAQ,gBAAgB,MAAM,QAAQ,KAAK,OAAO,CAAC;AAAA,MAClG,WAAW,OAAO,MAAM,QAAQ,QAAQ,MAAM,UAAU;AAAA,MACxD,WAAW,MAAM,QAAQ,SAAS,MAAM,QAAQ,OAAO;AAAA,IACzD;AAAA,IACA,CAAC,OAAO,YAAY,KAAK;AAAA,EAC3B;AAEA,SAAO;AACT;","names":["useTheme","useMemo","useTheme","useMemo"]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../../../src/Cytoscape/lib/encodeSvg.ts","../../../../src/Cytoscape/lib/iconMap.ts","../../../../src/Cytoscape/CytoscapeIcons.tsx","../../../../src/Cytoscape/CytoscapeStyles.ts","../../../../src/hooks/cytoscape/useIcons.tsx"],"sourcesContent":["import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, NodeIdStyles, NodeStyled } from '../../Cytoscape'\nimport { useIcons } from './useIcons'\n\nexport const useCytoscapeStyle = (hideLabels = false) => {\n const theme = useTheme()\n const icons = useIcons()\n\n const style: CytoscapeOptions['style'] = useMemo(\n () => [\n NodeIdStyles(theme.palette.text.primary, theme.palette.getContrastText(theme.palette.text.primary)),\n NodeStyled(icons, theme.palette.primary.main, hideLabels),\n EdgeStyled(theme.palette.divider, theme.palette.divider),\n ],\n [icons, hideLabels, theme],\n )\n\n return style\n}\n","import { ReactElement } from 'react'\n// eslint-disable-next-line import/no-internal-modules\nimport { renderToStaticMarkup } from 'react-dom/server'\n\nconst dataUri = 'data:image/svg+xml,'\n\nexport const encodeSvg = (reactElement: ReactElement, color?: string) => {\n const svgString = renderToStaticMarkup(reactElement)\n\n const doc = new DOMParser().parseFromString(svgString, 'text/html')\n const svgElement = doc.getElementsByTagName('svg')[0]\n if (svgElement) {\n svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg')\n svgElement.setAttribute('height', '100')\n svgElement.style.fill = color ?? 'black'\n }\n\n return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`\n}\n","import { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const generateIconMap: () => Record<CyNodeModuleTypes, string> = () => ({\n archivist: '',\n bridge: '',\n diviner: '',\n module: '',\n node: '',\n sentinel: '',\n witness: '',\n})\n","import {\n BubbleChartRounded as BubbleChartRoundedIcon,\n Hub as HubIcon,\n InsertLinkRounded as InsertLinkRoundedIcon,\n Inventory2Rounded as Inventory2RoundedIcon,\n QuestionMarkRounded as QuestionMarkRoundedIcon,\n TimerRounded as TimerRoundedIcon,\n VisibilityRounded as VisibilityRoundedIcon,\n} from '@mui/icons-material'\nimport { SvgIconTypeMap } from '@mui/material'\nimport { OverridableComponent } from '@mui/material/OverridableComponent'\n\nimport { CyNodeModuleTypes } from './lib'\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const CyIconSet: Record<CyNodeModuleTypes, OverridableComponent<SvgIconTypeMap<{}, 'svg'>>> = {\n archivist: Inventory2RoundedIcon,\n bridge: InsertLinkRoundedIcon,\n diviner: BubbleChartRoundedIcon,\n module: QuestionMarkRoundedIcon,\n node: HubIcon,\n sentinel: TimerRoundedIcon,\n witness: VisibilityRoundedIcon,\n}\n","import { Stylesheet } from 'cytoscape'\n\nimport { CyNodeModuleTypes } from './lib'\n\nexport const NodeIdStyles = (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 NodeStyled = (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 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\nexport const NodeBgStyles = (bgColor: string): [string, string] => ['background-color', bgColor]\n","import { useTheme } from '@mui/material'\nimport { useMemo } from 'react'\n\nimport { CyIconSet, CyNodeModuleTypes, encodeSvg, generateIconMap } from '../../Cytoscape'\n\nexport const useIcons = () => {\n const theme = useTheme()\n const icons = useMemo(() => {\n const iconMap = generateIconMap()\n 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"],"mappings":"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","names":["useTheme","useMemo","useTheme","useMemo"]}
|
|
@@ -24,15 +24,6 @@ __export(useNewElements_exports, {
|
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(useNewElements_exports);
|
|
26
26
|
var import_react_node = require("@xyo-network/react-node");
|
|
27
|
-
var import_react2 = require("react");
|
|
28
|
-
|
|
29
|
-
// src/contexts/CytoscapeInstance/Context.ts
|
|
30
|
-
var import_react_shared = require("@xyo-network/react-shared");
|
|
31
|
-
var CytoscapeInstanceContext = (0, import_react_shared.createContextEx)();
|
|
32
|
-
|
|
33
|
-
// src/contexts/CytoscapeInstance/use.ts
|
|
34
|
-
var import_react_shared2 = require("@xyo-network/react-shared");
|
|
35
|
-
var useCytoscapeInstance = (required = false) => (0, import_react_shared2.useContextEx)(CytoscapeInstanceContext, "CytoscapeInstance", required);
|
|
36
27
|
|
|
37
28
|
// src/hooks/cytoscape/useCytoscapeElements.ts
|
|
38
29
|
var import_react_async_effect = require("@xylabs/react-async-effect");
|
|
@@ -89,7 +80,7 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
89
80
|
try {
|
|
90
81
|
const childElements = await _CytoscapeElements.recurseNodes(module2);
|
|
91
82
|
childElements?.forEach((module3) => {
|
|
92
|
-
const newNode = _CytoscapeElements.buildNode(module3, newRootNode.data.id);
|
|
83
|
+
const newNode = _CytoscapeElements.buildNode(module3, { rootNodeId: newRootNode.data.id });
|
|
93
84
|
newElements.push(newNode);
|
|
94
85
|
const newEdge = _CytoscapeElements.buildEdge(newRootNode, newNode);
|
|
95
86
|
newElements.push(newEdge);
|
|
@@ -100,7 +91,7 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
100
91
|
return [];
|
|
101
92
|
}
|
|
102
93
|
}
|
|
103
|
-
static buildNode(module2,
|
|
94
|
+
static buildNode(module2, properties) {
|
|
104
95
|
const { address, config } = module2;
|
|
105
96
|
const normalizedName = config.name ?? address.substring(0, 8);
|
|
106
97
|
return {
|
|
@@ -108,13 +99,13 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
108
99
|
address,
|
|
109
100
|
id: address,
|
|
110
101
|
name: normalizedName,
|
|
111
|
-
|
|
112
|
-
|
|
102
|
+
type: parseModuleType(module2),
|
|
103
|
+
...properties
|
|
113
104
|
}
|
|
114
105
|
};
|
|
115
106
|
}
|
|
116
107
|
static buildRootNode = (module2) => {
|
|
117
|
-
return _CytoscapeElements.buildNode(module2);
|
|
108
|
+
return _CytoscapeElements.buildNode(module2, { root: true });
|
|
118
109
|
};
|
|
119
110
|
static normalizeName(name) {
|
|
120
111
|
if (!name)
|
|
@@ -182,17 +173,9 @@ var useCytoscapeElements = (module2) => {
|
|
|
182
173
|
|
|
183
174
|
// src/hooks/cytoscape/useNewElements.tsx
|
|
184
175
|
var useNewElements = (selectedElement) => {
|
|
185
|
-
const { cy } = useCytoscapeInstance(true);
|
|
186
176
|
const { address: selectedAddress } = selectedElement?.data() ?? {};
|
|
187
177
|
const [module2] = (0, import_react_node.useModuleFromNode)(selectedAddress);
|
|
188
178
|
const newElements = useCytoscapeElements(module2);
|
|
189
|
-
(0, import_react2.useEffect)(() => {
|
|
190
|
-
if (selectedAddress) {
|
|
191
|
-
const element = cy?.$(`node[id="${selectedAddress}"]`);
|
|
192
|
-
if (element?.length)
|
|
193
|
-
cy?.center(element);
|
|
194
|
-
}
|
|
195
|
-
}, [cy, selectedAddress]);
|
|
196
179
|
return newElements;
|
|
197
180
|
};
|
|
198
181
|
//# sourceMappingURL=useNewElements.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/hooks/cytoscape/useNewElements.tsx","../../../../src/contexts/CytoscapeInstance/Context.ts","../../../../src/contexts/CytoscapeInstance/use.ts","../../../../src/hooks/cytoscape/useCytoscapeElements.ts","../../../../src/Cytoscape/CytoscapeElements.ts","../../../../src/Cytoscape/lib/parseModuleType.ts"],"sourcesContent":["import { useModuleFromNode } from '@xyo-network/react-node'\nimport { NodeSingular } from 'cytoscape'\nimport { useEffect } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts'\nimport { useCytoscapeElements } from './useCytoscapeElements'\n\nexport const useNewElements = (selectedElement?: NodeSingular) => {\n const { cy } = useCytoscapeInstance(true)\n const { address: selectedAddress } = selectedElement?.data() ?? {}\n const [module] = useModuleFromNode(selectedAddress)\n const newElements = useCytoscapeElements(module)\n\n useEffect(() => {\n if (selectedAddress) {\n const element = cy?.$(`node[id=\"${selectedAddress}\"]`)\n if (element?.length) cy?.center(element)\n }\n }, [cy, selectedAddress])\n\n return newElements\n}\n","import { createContextEx } from '@xyo-network/react-shared'\n\nimport { CytoscapeInstanceState } from './State'\n\nexport const CytoscapeInstanceContext = createContextEx<CytoscapeInstanceState>()\n","import { useContextEx } from '@xyo-network/react-shared'\n\nimport { CytoscapeInstanceContext } from './Context'\n\nexport const useCytoscapeInstance = (required = false) => useContextEx(CytoscapeInstanceContext, 'CytoscapeInstance', required)\n","import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction, ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../Cytoscape'\n\nexport const useCytoscapeElements = (module?: ModuleInstance | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async () => {\n if (module) {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n }\n },\n [module],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined = undefined\n let detachedListener: EventUnsubscribeFunction | undefined = undefined\n\n if (module && isNodeInstance(module)) {\n attachedListener = module.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n detachedListener = module.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [module])\n\n return elements\n}\n","import { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib'\n\nexport class CytoscapeElements {\n static MaxNameLength = 20\n\n static buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition) {\n return {\n data: {\n id: `${rootNode.data.id}/${newNode.data.id}`,\n source: rootNode.data.id,\n target: newNode.data.id,\n },\n }\n }\n\n static async buildElements(module: ModuleInstance): Promise<ElementDefinition[]> {\n const newRootNode = CytoscapeElements.buildRootNode(module)\n const newElements: ElementDefinition[] = [newRootNode]\n\n try {\n const childElements = await CytoscapeElements.recurseNodes(module)\n childElements?.forEach((module) => {\n const newNode = CytoscapeElements.buildNode(module, newRootNode.data.id)\n newElements.push(newNode)\n\n const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode)\n newElements.push(newEdge)\n })\n\n return newElements\n } catch (e) {\n console.error('error resolving modules', e)\n return []\n }\n }\n\n static buildNode(module: ModuleInstance, rootNodeId?: string): ElementDefinition {\n const { address, config } = module\n const normalizedName = config.name ?? address.substring(0, 8)\n return {\n data: {\n address,\n id: address,\n name: normalizedName,\n rootNodeId,\n type: parseModuleType(module),\n },\n }\n }\n\n static buildRootNode = (module: ModuleInstance): ElementDefinition => {\n return CytoscapeElements.buildNode(module)\n }\n\n static normalizeName(name?: string) {\n if (!name) return\n if (name.length > this.MaxNameLength) return `${name.substring(0, 20)}...`\n return name\n }\n\n static async recurseNodes(module: ModuleInstance, maxTraversals = 1): Promise<ModuleInstance[]> {\n let localDepth = 0\n const childModules: ModuleInstance[] = []\n\n const traverse = async (nestedNode: ModuleInstance) => {\n if (localDepth < maxTraversals) {\n const modules = await nestedNode.resolve(undefined, { direction: 'down', maxDepth: 2 })\n await Promise.all(\n modules.map(async (child) => {\n if (child !== nestedNode && isNodeInstance(child)) {\n localDepth++\n await traverse(child)\n // don't re add the root module that was passed in\n } else if (child !== module) {\n childModules.push(child)\n }\n }),\n )\n }\n }\n\n await traverse(module)\n\n return childModules\n }\n}\n","import { isArchivistInstance } from '@xyo-network/archivist-model'\nimport { isBridgeInstance } from '@xyo-network/bridge-model'\nimport { isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { isSentinelInstance } from '@xyo-network/sentinel'\nimport { isWitnessModule } from '@xyo-network/witness'\n\nimport { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const parseModuleType = (module?: ModuleInstance): CyNodeModuleTypes => {\n let type: CyNodeModuleTypes = 'module'\n if (module) {\n if (isArchivistInstance(module)) {\n type = 'archivist'\n } else if (isBridgeInstance(module)) {\n type = 'bridge'\n } else if (isDivinerInstance(module)) {\n type = 'diviner'\n } else if (isNodeInstance(module)) {\n type = 'node'\n } else if (isSentinelInstance(module)) {\n type = 'sentinel'\n } else if (isWitnessModule(module)) {\n type = 'witness'\n } else {\n type = 'module'\n }\n }\n return type\n}\n"],"mappings":"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","names":["import_react","import_react_shared","import_node_model","import_node_model","module","module","module","module"]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/hooks/cytoscape/useNewElements.tsx","../../../../src/hooks/cytoscape/useCytoscapeElements.ts","../../../../src/Cytoscape/CytoscapeElements.ts","../../../../src/Cytoscape/lib/parseModuleType.ts"],"sourcesContent":["import { useModuleFromNode } from '@xyo-network/react-node'\nimport { NodeSingular } from 'cytoscape'\n\nimport { useCytoscapeElements } from './useCytoscapeElements'\n\nexport const useNewElements = (selectedElement?: NodeSingular) => {\n const { address: selectedAddress } = selectedElement?.data() ?? {}\n const [module] = useModuleFromNode(selectedAddress)\n const newElements = useCytoscapeElements(module)\n\n return newElements\n}\n","import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction, ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../Cytoscape'\n\nexport const useCytoscapeElements = (module?: ModuleInstance | null) => {\n const [elements, setElements] = useState<ElementDefinition[]>([])\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async () => {\n if (module) {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n }\n },\n [module],\n )\n\n useEffect(() => {\n let attachedListener: EventUnsubscribeFunction | undefined = undefined\n let detachedListener: EventUnsubscribeFunction | undefined = undefined\n\n if (module && isNodeInstance(module)) {\n attachedListener = module.on('moduleAttached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n detachedListener = module.on('moduleDetached', async () => {\n const newElements = (await CytoscapeElements.buildElements(module)) ?? []\n setElements(newElements)\n })\n }\n\n return () => {\n attachedListener?.()\n detachedListener?.()\n }\n }, [module])\n\n return elements\n}\n","import { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\n\nimport { parseModuleType } from './lib'\n\nexport class CytoscapeElements {\n static MaxNameLength = 20\n\n static buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition) {\n return {\n data: {\n id: `${rootNode.data.id}/${newNode.data.id}`,\n source: rootNode.data.id,\n target: newNode.data.id,\n },\n }\n }\n\n static async buildElements(module: ModuleInstance): Promise<ElementDefinition[]> {\n const newRootNode = CytoscapeElements.buildRootNode(module)\n const newElements: ElementDefinition[] = [newRootNode]\n\n try {\n const childElements = await CytoscapeElements.recurseNodes(module)\n childElements?.forEach((module) => {\n const newNode = CytoscapeElements.buildNode(module, { rootNodeId: newRootNode.data.id })\n newElements.push(newNode)\n\n const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode)\n newElements.push(newEdge)\n })\n\n return newElements\n } catch (e) {\n console.error('error resolving modules', e)\n return []\n }\n }\n\n static buildNode(module: ModuleInstance, properties?: { [key: string]: unknown }): ElementDefinition {\n const { address, config } = module\n const normalizedName = config.name ?? address.substring(0, 8)\n return {\n data: {\n address,\n id: address,\n name: normalizedName,\n type: parseModuleType(module),\n ...properties,\n },\n }\n }\n\n static buildRootNode = (module: ModuleInstance): ElementDefinition => {\n return CytoscapeElements.buildNode(module, { root: true })\n }\n\n static normalizeName(name?: string) {\n if (!name) return\n if (name.length > this.MaxNameLength) return `${name.substring(0, 20)}...`\n return name\n }\n\n static async recurseNodes(module: ModuleInstance, maxTraversals = 1): Promise<ModuleInstance[]> {\n let localDepth = 0\n const childModules: ModuleInstance[] = []\n\n const traverse = async (nestedNode: ModuleInstance) => {\n if (localDepth < maxTraversals) {\n const modules = await nestedNode.resolve(undefined, { direction: 'down', maxDepth: 2 })\n await Promise.all(\n modules.map(async (child) => {\n if (child !== nestedNode && isNodeInstance(child)) {\n localDepth++\n await traverse(child)\n // don't re add the root module that was passed in\n } else if (child !== module) {\n childModules.push(child)\n }\n }),\n )\n }\n }\n\n await traverse(module)\n\n return childModules\n }\n}\n","import { isArchivistInstance } from '@xyo-network/archivist-model'\nimport { isBridgeInstance } from '@xyo-network/bridge-model'\nimport { isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module'\nimport { isNodeInstance } from '@xyo-network/node-model'\nimport { isSentinelInstance } from '@xyo-network/sentinel'\nimport { isWitnessModule } from '@xyo-network/witness'\n\nimport { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const parseModuleType = (module?: ModuleInstance): CyNodeModuleTypes => {\n let type: CyNodeModuleTypes = 'module'\n if (module) {\n if (isArchivistInstance(module)) {\n type = 'archivist'\n } else if (isBridgeInstance(module)) {\n type = 'bridge'\n } else if (isDivinerInstance(module)) {\n type = 'diviner'\n } else if (isNodeInstance(module)) {\n type = 'node'\n } else if (isSentinelInstance(module)) {\n type = 'sentinel'\n } else if (isWitnessModule(module)) {\n type = 'witness'\n } else {\n type = 'module'\n }\n }\n return type\n}\n"],"mappings":"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","names":["import_node_model","import_node_model","module","module","module","module"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useNewElements.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useNewElements.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"useNewElements.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useNewElements.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAIxC,eAAO,MAAM,cAAc,qBAAsB,YAAY,4CAM5D,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useNewElements.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useNewElements.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"useNewElements.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useNewElements.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAIxC,eAAO,MAAM,cAAc,qBAAsB,YAAY,4CAM5D,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useNewElements.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useNewElements.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"useNewElements.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useNewElements.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAIxC,eAAO,MAAM,cAAc,qBAAsB,YAAY,4CAM5D,CAAA"}
|
|
@@ -1,14 +1,5 @@
|
|
|
1
1
|
// src/hooks/cytoscape/useNewElements.tsx
|
|
2
2
|
import { useModuleFromNode } from "@xyo-network/react-node";
|
|
3
|
-
import { useEffect as useEffect2 } from "react";
|
|
4
|
-
|
|
5
|
-
// src/contexts/CytoscapeInstance/Context.ts
|
|
6
|
-
import { createContextEx } from "@xyo-network/react-shared";
|
|
7
|
-
var CytoscapeInstanceContext = createContextEx();
|
|
8
|
-
|
|
9
|
-
// src/contexts/CytoscapeInstance/use.ts
|
|
10
|
-
import { useContextEx } from "@xyo-network/react-shared";
|
|
11
|
-
var useCytoscapeInstance = (required = false) => useContextEx(CytoscapeInstanceContext, "CytoscapeInstance", required);
|
|
12
3
|
|
|
13
4
|
// src/hooks/cytoscape/useCytoscapeElements.ts
|
|
14
5
|
import { useAsyncEffect } from "@xylabs/react-async-effect";
|
|
@@ -65,7 +56,7 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
65
56
|
try {
|
|
66
57
|
const childElements = await _CytoscapeElements.recurseNodes(module);
|
|
67
58
|
childElements?.forEach((module2) => {
|
|
68
|
-
const newNode = _CytoscapeElements.buildNode(module2, newRootNode.data.id);
|
|
59
|
+
const newNode = _CytoscapeElements.buildNode(module2, { rootNodeId: newRootNode.data.id });
|
|
69
60
|
newElements.push(newNode);
|
|
70
61
|
const newEdge = _CytoscapeElements.buildEdge(newRootNode, newNode);
|
|
71
62
|
newElements.push(newEdge);
|
|
@@ -76,7 +67,7 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
76
67
|
return [];
|
|
77
68
|
}
|
|
78
69
|
}
|
|
79
|
-
static buildNode(module,
|
|
70
|
+
static buildNode(module, properties) {
|
|
80
71
|
const { address, config } = module;
|
|
81
72
|
const normalizedName = config.name ?? address.substring(0, 8);
|
|
82
73
|
return {
|
|
@@ -84,13 +75,13 @@ var CytoscapeElements = class _CytoscapeElements {
|
|
|
84
75
|
address,
|
|
85
76
|
id: address,
|
|
86
77
|
name: normalizedName,
|
|
87
|
-
|
|
88
|
-
|
|
78
|
+
type: parseModuleType(module),
|
|
79
|
+
...properties
|
|
89
80
|
}
|
|
90
81
|
};
|
|
91
82
|
}
|
|
92
83
|
static buildRootNode = (module) => {
|
|
93
|
-
return _CytoscapeElements.buildNode(module);
|
|
84
|
+
return _CytoscapeElements.buildNode(module, { root: true });
|
|
94
85
|
};
|
|
95
86
|
static normalizeName(name) {
|
|
96
87
|
if (!name)
|
|
@@ -158,17 +149,9 @@ var useCytoscapeElements = (module) => {
|
|
|
158
149
|
|
|
159
150
|
// src/hooks/cytoscape/useNewElements.tsx
|
|
160
151
|
var useNewElements = (selectedElement) => {
|
|
161
|
-
const { cy } = useCytoscapeInstance(true);
|
|
162
152
|
const { address: selectedAddress } = selectedElement?.data() ?? {};
|
|
163
153
|
const [module] = useModuleFromNode(selectedAddress);
|
|
164
154
|
const newElements = useCytoscapeElements(module);
|
|
165
|
-
useEffect2(() => {
|
|
166
|
-
if (selectedAddress) {
|
|
167
|
-
const element = cy?.$(`node[id="${selectedAddress}"]`);
|
|
168
|
-
if (element?.length)
|
|
169
|
-
cy?.center(element);
|
|
170
|
-
}
|
|
171
|
-
}, [cy, selectedAddress]);
|
|
172
155
|
return newElements;
|
|
173
156
|
};
|
|
174
157
|
export {
|