npm - @xyo-network/react-node-renderer - Versions diffs - 2.64.0 → 2.64.3 - Mend

@xyo-network/react-node-renderer 2.64.0 → 2.64.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (524) hide show

package/dist/node/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/index.ts","../../src/components/ModuleCardParser.tsx","../../src/components/ProvidedNodeRenderer.tsx","../../src/hooks/cytoscape/useAddNewElements.tsx","../../src/contexts/CytoscapeInstance/Context.ts","../../src/contexts/CytoscapeInstance/use.ts","../../src/Cytoscape/CytoscapeElements.ts","../../src/Cytoscape/lib/encodeSvg.ts","../../src/Cytoscape/lib/iconMap.ts","../../src/Cytoscape/lib/layout/ColaLayout.ts","../../src/Cytoscape/lib/layout/ConcentricLayout.ts","../../src/Cytoscape/lib/parseModuleType.ts","../../src/Cytoscape/CytoscapeIcons.tsx","../../src/Cytoscape/CytoscapeStyles.ts","../../src/hooks/cytoscape/usePopperListener.tsx","../../src/hooks/cytoscape/useCytoscapeElements.ts","../../src/hooks/cytoscape/useCytoscapeOptions.ts","../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../src/hooks/cytoscape/useIcons.tsx","../../src/hooks/cytoscape/useNewElements.tsx","../../src/hooks/cytoscape/useRelationalGraphOptions.tsx","../../src/components/RelationalGraph.tsx"],"sourcesContent":["export * from './components'\nexport * from './Cytoscape'\nexport * from './hooks'\n","import { asArchivistInstance } from '@xyo-network/archivist-model'\nimport { asDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module'\nimport { ArchivistCard } from '@xyo-network/react-archivist'\nimport { DivinerCard, ModuleCard } from '@xyo-network/react-module'\n\nexport interface ModuleCardParserProps {\n module?: ModuleInstance\n}\n\nexport const ModuleCardParser: React.FC<ModuleCardParserProps> = ({ module }) => {\n switch (true) {\n case module?.config.schema.includes('archivist'):\n return <ArchivistCard module={asArchivistInstance(module)} />\n case module?.config.schema.includes('diviner'):\n return <DivinerCard module={asDivinerInstance(module)} />\n default:\n return <ModuleCard module={module} />\n }\n}\n","import { AccountInstance } from '@xyo-network/account-model'\nimport { NodeInstance } from '@xyo-network/node-model'\nimport { useProvidedNode } from '@xyo-network/react-node'\n\nimport { useCytoscapeElements, useCytoscapeOptions } from '../hooks'\nimport { NodeRelationalGraphProps } from './lib'\nimport { NodeRelationalGraphFlexBox } from './RelationalGraph'\n\nexport interface ProvidedNodeRendererProps extends NodeRelationalGraphProps {\n account?: AccountInstance\n node?: NodeInstance\n}\n\nexport const ProvidedNodeRenderer: React.FC<ProvidedNodeRendererProps> = ({ node, ...props }) => {\n const [providedNode] = useProvidedNode()\n const elements = useCytoscapeElements(node ?? providedNode)\n const options = useCytoscapeOptions(elements)\n\n return <NodeRelationalGraphFlexBox alignItems=\"stretch\" flexGrow={1} height=\"100%\" options={options} {...props} />\n}\n","import { ElementDefinition } from 'cytoscape'\nimport { useEffect } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts'\nimport { ColaLayout } from '../../Cytoscape'\nimport { usePopperListener } from './usePopperListener'\n\nexport const useAddNewElements = (newElements: ElementDefinition[] = [], hideLabels?: boolean) => {\n const { cy } = useCytoscapeInstance(true)\n const popperListener = usePopperListener()\n\n useEffect(() => {\n if (newElements.length > 1) {\n const renderedElements = cy?.add(newElements)\n renderedElements?.nodes().forEach((node) => popperListener(node, hideLabels, cy))\n cy?.layout(ColaLayout).run()\n }\n }, [cy, hideLabels, newElements, popperListener])\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 { 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 { 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","export const ColaLayout = {\n centerGraph: false,\n convergenceThreshold: 0.01,\n name: 'cola',\n}\n","import { CytoscapeOptions } from 'cytoscape'\n\nexport const ConcentricLayout: CytoscapeOptions['layout'] = {\n concentric: function (node) {\n return node.degree()\n },\n levelWidth: function () {\n return 2\n },\n minNodeSpacing: 75,\n name: 'concentric',\n}\n","import { isArchivistInstance } from '@xyo-network/archivist-model'\nimport { isBridgeInstance } from '@xyo-network/bridge-model'\nimport { isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module'\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","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 { Core, NodeSingular } from 'cytoscape'\nimport { useCallback } from 'react'\n\nexport const usePopperListener = () => {\n const theme = useTheme()\n\n const popperListener = useCallback(\n (node: NodeSingular, hideLabels?: boolean, cy?: Core) => {\n const div = document.createElement('div')\n const shadowColor = theme.palette.getContrastText(theme.palette.text.primary)\n\n const popper = node.popper({\n content: () => {\n div.innerHTML = node.data().name\n div.style.opacity = '0'\n div.style.transition = 'opacity .25s'\n div.style.textShadow = `0 0 3px ${shadowColor}`\n\n document.body.appendChild(div)\n\n return div\n },\n })\n\n const update = async () => {\n await popper.update()\n }\n\n node.on('position', update)\n node.on('mouseover', () => (hideLabels ? (div.style.opacity = '1') : undefined))\n node.on('mouseout', () => (hideLabels ? (div.style.opacity = '0') : undefined))\n\n cy?.on('pan zoom resize', update)\n },\n [theme],\n )\n\n return popperListener\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 { 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 && layout && style) {\n return {\n elements,\n layout: layout ?? ConcentricLayout,\n style: style ?? defaultStyle,\n }\n }\n }, [elements, layout, style])\n\n return options\n}\n","import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, 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","import { useModuleFromNode } from '@xyo-network/react-node'\nimport { NodeDataDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts'\nimport { useCytoscapeElements } from './useCytoscapeElements'\n\nexport const useNewElements = () => {\n const { cy } = useCytoscapeInstance(true)\n const [selectedElement, setSelectedElement] = useState<NodeDataDefinition>()\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, setSelectedElement }\n}\n","import { ModuleInstance } from '@xyo-network/module'\nimport { useState } from 'react'\n\nimport { ColaLayout } from '../../Cytoscape'\nimport { useCytoscapeElements } from './useCytoscapeElements'\nimport { useCytoscapeOptions } from './useCytoscapeOptions'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useRelationalGraphOptions = (module?: ModuleInstance) => {\n const [hideLabels, setHideLabels] = useState(false)\n\n const handleToggleLabels = () => {\n setHideLabels((oldValue) => !oldValue)\n }\n\n const elements = useCytoscapeElements(module)\n const style = useCytoscapeStyle(hideLabels)\n const options = useCytoscapeOptions(elements, style, ColaLayout)\n\n return { handleToggleLabels, hideLabels, options }\n}\n","import { Button, ButtonGroup, styled } from '@mui/material'\nimport { FlexCol, FlexRow } from '@xylabs/react-flexbox'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport cytoscape, { Core } from 'cytoscape'\nimport { forwardRef, useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../contexts'\nimport { NodeRelationalGraphProps } from './lib'\n\nexport const NodeRelationalGraphFlexBox = forwardRef<HTMLDivElement, NodeRelationalGraphProps>(({ actions, options, ...props }, ref) => {\n const [cy, setCy] = useState<Core>()\n const { setCy: setCyContext } = useCytoscapeInstance()\n const sharedRef = useShareForwardedRef(ref)\n\n const handleReset = () => {\n cy?.reset()\n cy?.fit(undefined, 20)\n }\n\n useEffect(() => {\n if (sharedRef) {\n const newCy = cytoscape({\n container: sharedRef.current,\n ...options,\n })\n setCy(newCy)\n }\n }, [options, sharedRef])\n\n useEffect(() => {\n setCyContext?.(cy)\n }, [cy, setCyContext])\n\n return (\n <FlexCol {...props}>\n <ActionsContainer>\n <ButtonGroup>\n {actions}\n <Button size={'small'} variant={'contained'} onClick={handleReset}>\n Reset\n </Button>\n </ButtonGroup>\n </ActionsContainer>\n {/* Cytoscape Element /}\n <FlexCol alignItems=\"stretch\" height=\"100%\" position=\"absolute\" ref={sharedRef} width=\"100%\"></FlexCol>\n </FlexCol>\n )\n})\n\nNodeRelationalGraphFlexBox.displayName = 'NodeRelationalGraph'\n\nconst ActionsContainer = styled(FlexRow, { name: 'ActionsContainer' })(({ theme }) => ({\n flexWrap: 'wrap',\n gap: theme.spacing(1),\n position: 'absolute',\n right: '10px',\n top: '10px',\n zIndex: 2,\n}))\n\n/* @deprecated */\nexport const NodeRelationalGraph = NodeRelationalGraphFlexBox\n"],"mappings":"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","names":["module","import_react_node","import_react","import_react_shared","import_node_model","import_archivist_model","import_diviner_model","module","module","Inventory2RoundedIcon","InsertLinkRoundedIcon","BubbleChartRoundedIcon","QuestionMarkRoundedIcon","HubIcon","TimerRoundedIcon","VisibilityRoundedIcon","import_node_model","import_react","module","import_react","import_material","import_react","import_material","import_react","import_jsx_runtime","import_react","module","import_react","module","import_material","import_react_shared","import_react","import_jsx_runtime","cytoscape","import_jsx_runtime"]}
1	+ {"version":3,"sources":["../../src/index.ts","../../src/components/module/CardParser.tsx","../../src/components/module/graph/GraphFlexBox.tsx","../../src/hooks/cytoscape/useCytoscapeElements.ts","../../src/Cytoscape/CytoscapeElements.ts","../../src/Cytoscape/lib/encodeSvg.ts","../../src/Cytoscape/lib/iconMap.ts","../../src/Cytoscape/lib/layout/ColaLayout.ts","../../src/Cytoscape/lib/layout/ConcentricLayout.ts","../../src/Cytoscape/lib/parseModuleType.ts","../../src/Cytoscape/CytoscapeIcons.tsx","../../src/Cytoscape/CytoscapeStyles.ts","../../src/hooks/cytoscape/useCytoscapeOptions.ts","../../src/hooks/cytoscape/useCytoscapeStyle.tsx","../../src/hooks/cytoscape/useIcons.tsx","../../src/hooks/cytoscape/useHoveredNode.tsx","../../src/contexts/CytoscapeInstance/Context.ts","../../src/contexts/CytoscapeInstance/use.ts","../../src/hooks/cytoscape/useNewElements.tsx","../../src/hooks/cytoscape/useRelationalGraphOptions.tsx","../../src/hooks/cytoscape/useRenderNewElements.tsx","../../src/hooks/cytoscape/useSelectedElement.tsx","../../src/components/cytoscape-extensions/WithExtensions.tsx","../../src/components/RelationalGraph.tsx","../../src/components/module/graph/NodeHover.tsx","../../src/components/module/graph/Popper.tsx","../../src/components/ProvidedNodeRenderer.tsx"],"sourcesContent":["export * from './components'\nexport * from './Cytoscape'\nexport * from './hooks'\n","import { asArchivistInstance, isArchivistInstance } from '@xyo-network/archivist-model'\nimport { asDivinerInstance, isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module'\nimport { ArchivistCard } from '@xyo-network/react-archivist'\nimport { DivinerCard, ModuleCard } from '@xyo-network/react-module'\n\nexport interface ModuleCardParserProps {\n module?: ModuleInstance\n}\n\nexport const ModuleCardParser: React.FC<ModuleCardParserProps> = ({ module }) => {\n switch (true) {\n case isArchivistInstance(module):\n return <ArchivistCard module={asArchivistInstance(module)} />\n case isDivinerInstance(module):\n return <DivinerCard module={asDivinerInstance(module)} />\n default:\n return <ModuleCard module={module} />\n }\n}\n","import { Button } from '@mui/material'\nimport { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { ModuleInstance } from '@xyo-network/module'\n\nimport { useHoveredNode, useNewElements, useRelationalGraphOptions, useRenderNewElements, useSelectedElement } from '../../../hooks'\nimport { WithExtensions } from '../../cytoscape-extensions'\nimport { NodeRelationalGraphFlexBox } from '../../RelationalGraph'\nimport { ModuleGraphNodeHover } from './NodeHover'\n\nexport interface ModuleGraphFlexBoxProps extends FlexBoxProps {\n rootModule?: ModuleInstance \| null\n}\n\nexport const ModuleGraphFlexBox: React.FC<ModuleGraphFlexBoxProps> = ({ rootModule, ...props }) => {\n const { handleToggleLabels, hideLabels, options } = useRelationalGraphOptions(rootModule ?? undefined)\n const selectedElement = useSelectedElement()\n const newElements = useNewElements(selectedElement)\n const renderedElements = useRenderNewElements(newElements, hideLabels)\n const hoveredNode = useHoveredNode(renderedElements)\n\n return (\n <WithExtensions>\n <NodeRelationalGraphFlexBox\n actions={\n <Button size={'small'} onClick={handleToggleLabels} variant=\"contained\">\n Toggle Labels\n </Button>\n }\n options={options}\n {...props}\n >\n <ModuleGraphNodeHover node={hoveredNode} />\n </NodeRelationalGraphFlexBox>\n </WithExtensions>\n )\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, 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 { 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","export const ColaLayout = {\n centerGraph: false,\n convergenceThreshold: 0.01,\n name: 'cola',\n}\n","import { LayoutOptions } from 'cytoscape'\n\nexport const ConcentricLayout: LayoutOptions = {\n concentric: function (node) {\n return node.degree()\n },\n levelWidth: function () {\n return 2\n },\n minNodeSpacing: 75,\n name: 'concentric',\n}\n","import { isArchivistInstance } from '@xyo-network/archivist-model'\nimport { isBridgeInstance } from '@xyo-network/bridge-model'\nimport { isDivinerInstance } from '@xyo-network/diviner-model'\nimport { ModuleInstance } from '@xyo-network/module'\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","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 { 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 && layout && style) {\n return {\n elements,\n layout: layout ?? ConcentricLayout,\n style: style ?? defaultStyle,\n }\n }\n }, [elements, layout, style])\n\n return options\n}\n","import { useTheme } from '@mui/material'\nimport { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nimport { EdgeStyled, 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","import { NodeCollection, NodeSingular } from 'cytoscape'\nimport { useCallback, useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts'\n\nexport const useHoveredNode = (renderedElements?: NodeCollection) => {\n const { cy } = useCytoscapeInstance(true)\n const [hoveredNode, setHoveredNode] = useState<NodeSingular>()\n\n const nodeListener = useCallback((node: NodeSingular) => {\n node.on('mouseover tap', () => {\n setHoveredNode(node)\n })\n node.on('mouseout', () => {\n setHoveredNode(undefined)\n })\n }, [])\n\n useEffect(() => {\n if (renderedElements) {\n renderedElements.nodes().forEach(nodeListener)\n }\n }, [nodeListener, renderedElements])\n\n useEffect(() => {\n cy?.ready(() => {\n cy.nodes().forEach(nodeListener)\n })\n }, [cy, nodeListener])\n\n return hoveredNode\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 { 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 { ModuleInstance } from '@xyo-network/module'\nimport { useState } from 'react'\n\nimport { ConcentricLayout } from '../../Cytoscape'\nimport { useCytoscapeElements } from './useCytoscapeElements'\nimport { useCytoscapeOptions } from './useCytoscapeOptions'\nimport { useCytoscapeStyle } from './useCytoscapeStyle'\n\nexport const useRelationalGraphOptions = (module?: ModuleInstance) => {\n const [hideLabels, setHideLabels] = useState(true)\n\n const handleToggleLabels = () => {\n setHideLabels((oldValue) => !oldValue)\n }\n\n const elements = useCytoscapeElements(module)\n const style = useCytoscapeStyle(hideLabels)\n const options = useCytoscapeOptions(elements, style, ConcentricLayout)\n\n return { handleToggleLabels, hideLabels, options }\n}\n","import { CollectionReturnValue, ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts'\nimport { ColaLayout } from '../../Cytoscape'\n\nexport const useRenderNewElements = (newElements: ElementDefinition[] = [], hideLabels?: boolean) => {\n const { cy } = useCytoscapeInstance(true)\n const [renderedElements, setRenderedElements] = useState<CollectionReturnValue>()\n\n useEffect(() => {\n if (newElements.length > 1) {\n const renderedElements = cy?.add(newElements)\n setRenderedElements(renderedElements)\n cy?.layout(ColaLayout).run()\n }\n }, [cy, hideLabels, newElements])\n\n return renderedElements\n}\n","import { EventObject, NodeSingular } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../../contexts'\n\nexport const useSelectedElement = () => {\n const { cy } = useCytoscapeInstance(true)\n const [selectedElement, setSelectedElement] = useState<NodeSingular>()\n\n useEffect(() => {\n const listener = (event: EventObject) => {\n const element = event.target[0]\n if (element.isNode()) setSelectedElement(element)\n }\n cy?.on('select', listener)\n\n return () => {\n cy?.off('select', listener)\n }\n }, [cy, setSelectedElement])\n\n return selectedElement\n}\n","import { use } from 'cytoscape'\nimport cola from 'cytoscape-cola'\nimport { PropsWithChildren, useEffect, useState } from 'react'\n\nexport const WithExtensions: React.FC<PropsWithChildren> = ({ children }) => {\n const [initialized, setInitialized] = useState(false)\n useEffect(() => {\n use(cola)\n setInitialized(true)\n }, [])\n\n return <>{initialized ? children : undefined}</>\n}\n","import { Button, ButtonGroup, styled } from '@mui/material'\nimport { FlexCol, FlexRow } from '@xylabs/react-flexbox'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport cytoscape, { Core } from 'cytoscape'\nimport { forwardRef, useEffect, useState } from 'react'\n\nimport { useCytoscapeInstance } from '../contexts'\nimport { NodeRelationalGraphProps } from './lib'\n\nexport const NodeRelationalGraphFlexBox = forwardRef<HTMLDivElement, NodeRelationalGraphProps>(({ actions, children, options, ...props }, ref) => {\n const [cy, setCy] = useState<Core>()\n const { setCy: setCyContext } = useCytoscapeInstance()\n const sharedRef = useShareForwardedRef(ref)\n\n const handleReset = () => {\n cy?.reset()\n cy?.fit(undefined, 20)\n }\n\n useEffect(() => {\n if (sharedRef) {\n const newCy = cytoscape({\n container: sharedRef.current,\n ...options,\n })\n setCy(newCy)\n }\n }, [options, sharedRef])\n\n useEffect(() => {\n setCyContext?.(cy)\n }, [cy, setCyContext])\n\n return (\n <FlexCol {...props}>\n <ActionsContainer>\n <ButtonGroup>\n {actions}\n <Button size={'small'} variant={'contained'} onClick={handleReset}>\n Reset\n </Button>\n </ButtonGroup>\n </ActionsContainer>\n {/* Cytoscape Element /}\n <FlexCol alignItems=\"stretch\" height=\"100%\" position=\"absolute\" ref={sharedRef} width=\"100%\"></FlexCol>\n {children}\n </FlexCol>\n )\n})\n\nNodeRelationalGraphFlexBox.displayName = 'NodeRelationalGraph'\n\nconst ActionsContainer = styled(FlexRow, { name: 'ActionsContainer' })(({ theme }) => ({\n flexWrap: 'wrap',\n gap: theme.spacing(1),\n position: 'absolute',\n right: '10px',\n top: '10px',\n zIndex: 2,\n}))\n\n/* @deprecated */\nexport const NodeRelationalGraph = NodeRelationalGraphFlexBox\n","import { NodeSingular } from 'cytoscape'\nimport { useLayoutEffect, useRef, useState } from 'react'\n\nimport { ModuleHoverPopper } from './Popper'\n\nexport interface ModuleHoverProps {\n node?: NodeSingular\n}\n\nexport const ModuleGraphNodeHover: React.FC<ModuleHoverProps> = ({ node }) => {\n const { address, name } = node?.data() ?? {}\n const [boundingBox, setBoundingBox] = useState(node?.renderedBoundingBox())\n const ref = useRef<HTMLDivElement>(null)\n const [currentEl, setCurrentEl] = useState<HTMLDivElement \| null>(null)\n\n useLayoutEffect(() => {\n if (node && ref.current) {\n setBoundingBox(node.renderedBoundingBox())\n setCurrentEl(ref.current)\n }\n\n const listener = () => {\n setBoundingBox(node?.renderedBoundingBox())\n }\n\n node?.on('position', listener)\n\n return () => {\n node?.off('position', undefined, listener)\n }\n }, [node])\n\n return (\n <>\n {node ? (\n <>\n <div\n ref={ref}\n style={{\n // backgroundColor: '#fff',\n // opacity: 0.25,\n cursor: 'pointer',\n height: boundingBox?.h,\n left: boundingBox?.x1,\n pointerEvents: 'none',\n position: 'absolute',\n top: boundingBox?.y1,\n width: boundingBox?.w,\n }}\n ></div>\n <ModuleHoverPopper address={address} element={currentEl} name={name} placement={'top'} open />\n </>\n ) : null}\n </>\n )\n}\n","import { alpha, Chip, Popper, PopperProps, Theme, Typography } from '@mui/material'\nimport { FlexCol, FlexRow } from '@xylabs/react-flexbox'\nimport { Identicon } from '@xylabs/react-identicon'\n\nexport interface ModuleHoverPopperProps extends PopperProps {\n address?: string\n element?: HTMLElement \| null\n name?: string\n}\n\nexport const ModuleHoverPopper: React.FC<ModuleHoverPopperProps> = ({ address, element, name, ...props }) => {\n return (\n <Popper anchorEl={element} {...props}>\n <FlexCol gap={2} p={2} paper sx={{ backgroundColor: (theme: Theme) => alpha(theme.palette.background.paper, 0.95) }}>\n <FlexRow gap={2}>\n <Identicon value={address} size={24} />\n <Typography>{name}</Typography>\n </FlexRow>\n <Chip label={address} color={'primary'} />\n </FlexCol>\n </Popper>\n )\n}\n","import { AccountInstance } from '@xyo-network/account-model'\nimport { NodeInstance } from '@xyo-network/node-model'\nimport { useProvidedNode } from '@xyo-network/react-node'\n\nimport { useCytoscapeElements, useCytoscapeOptions } from '../hooks'\nimport { NodeRelationalGraphProps } from './lib'\nimport { NodeRelationalGraphFlexBox } from './RelationalGraph'\n\nexport interface ProvidedNodeRendererProps extends NodeRelationalGraphProps {\n account?: AccountInstance\n node?: NodeInstance\n}\n\nexport const ProvidedNodeRenderer: React.FC<ProvidedNodeRendererProps> = ({ node, ...props }) => {\n const [providedNode] = useProvidedNode()\n const elements = useCytoscapeElements(node ?? providedNode)\n const options = useCytoscapeOptions(elements)\n\n return <NodeRelationalGraphFlexBox alignItems=\"stretch\" flexGrow={1} height=\"100%\" options={options} {...props} />\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,6BAAyD;AACzD,2BAAqD;AAErD,6BAA8B;AAC9B,0BAAwC;AAS3B;AAHN,IAAM,mBAAoD,CAAC,EAAE,QAAAA,QAAO,MAAM;AAC/E,UAAQ,MAAM;AAAA,IACZ,SAAK,4CAAoBA,OAAM;AAC7B,aAAO,4CAAC,wCAAc,YAAQ,4CAAoBA,OAAM,GAAG;AAAA,IAC7D,SAAK,wCAAkBA,OAAM;AAC3B,aAAO,4CAAC,mCAAY,YAAQ,wCAAkBA,OAAM,GAAG;AAAA,IACzD;AACE,aAAO,4CAAC,kCAAW,QAAQA,SAAQ;AAAA,EACvC;AACF;;;ACnBA,IAAAC,mBAAuB;;;ACAvB,gCAA+B;AAE/B,IAAAC,qBAA+B;AAE/B,mBAAoC;;;ACHpC,IAAAC,qBAA+B;;;ACC/B,oBAAqC;AAErC,IAAM,UAAU;AAET,IAAM,YAAY,CAAC,cAA4B,UAAmB;AACvE,QAAM,gBAAY,oCAAqB,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;;;ACVO,IAAM,aAAa;AAAA,EACxB,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,MAAM;AACR;;;ACFO,IAAM,mBAAkC;AAAA,EAC7C,YAAY,SAAU,MAAM;AAC1B,WAAO,KAAK,OAAO;AAAA,EACrB;AAAA,EACA,YAAY,WAAY;AACtB,WAAO;AAAA,EACT;AAAA,EACA,gBAAgB;AAAA,EAChB,MAAM;AACR;;;ACXA,IAAAC,0BAAoC;AACpC,0BAAiC;AACjC,IAAAC,wBAAkC;AAElC,wBAA+B;AAC/B,sBAAmC;AACnC,qBAAgC;AAIzB,IAAM,kBAAkB,CAACC,YAA+C;AAC7E,MAAI,OAA0B;AAC9B,MAAIA,SAAQ;AACV,YAAI,6CAAoBA,OAAM,GAAG;AAC/B,aAAO;AAAA,IACT,eAAW,sCAAiBA,OAAM,GAAG;AACnC,aAAO;AAAA,IACT,eAAW,yCAAkBA,OAAM,GAAG;AACpC,aAAO;AAAA,IACT,eAAW,kCAAeA,OAAM,GAAG;AACjC,aAAO;AAAA,IACT,eAAW,oCAAmBA,OAAM,GAAG;AACrC,aAAO;AAAA,IACT,eAAW,gCAAgBA,OAAM,GAAG;AAClC,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF;AACA,SAAO;AACT;;;ALxBO,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,cAAcC,SAAsD;AAC/E,UAAM,cAAc,mBAAkB,cAAcA,OAAM;AAC1D,UAAM,cAAmC,CAAC,WAAW;AAErD,QAAI;AACF,YAAM,gBAAgB,MAAM,mBAAkB,aAAaA,OAAM;AACjE,qDAAe,QAAQ,CAACA,YAAW;AACjC,cAAM,UAAU,mBAAkB,UAAUA,SAAQ,YAAY,KAAK,EAAE;AACvE,oBAAY,KAAK,OAAO;AAExB,cAAM,UAAU,mBAAkB,UAAU,aAAa,OAAO;AAChE,oBAAY,KAAK,OAAO;AAAA,MAC1B;AAEA,aAAO;AAAA,IACT,SAAS,GAAG;AACV,cAAQ,MAAM,2BAA2B,CAAC;AAC1C,aAAO,CAAC;AAAA,IACV;AAAA,EACF;AAAA,EAEA,OAAO,UAAUA,SAAwB,YAAwC;AAC/E,UAAM,EAAE,SAAS,OAAO,IAAIA;AAC5B,UAAM,iBAAiB,OAAO,QAAQ,QAAQ,UAAU,GAAG,CAAC;AAC5D,WAAO;AAAA,MACL,MAAM;AAAA,QACJ;AAAA,QACA,IAAI;AAAA,QACJ,MAAM;AAAA,QACN;AAAA,QACA,MAAM,gBAAgBA,OAAM;AAAA,MAC9B;AAAA,IACF;AAAA,EACF;AAAA,EAEA,OAAO,gBAAgB,CAACA,YAA8C;AACpE,WAAO,mBAAkB,UAAUA,OAAM;AAAA,EAC3C;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,aAAaA,SAAwB,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,kBAAc,mCAAe,KAAK,GAAG;AACjD;AACA,oBAAM,SAAS,KAAK;AAAA,YAEtB,WAAW,UAAUA,SAAQ;AAC3B,2BAAa,KAAK,KAAK;AAAA,YACzB;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAEA,UAAM,SAASA,OAAM;AAErB,WAAO;AAAA,EACT;AACF;;;AMzFA,4BAQO;AAOA,IAAM,YAAwF;AAAA,EACnG,WAAW,sBAAAC;AAAA,EACX,QAAQ,sBAAAC;AAAA,EACR,SAAS,sBAAAC;AAAA,EACT,QAAQ,sBAAAC;AAAA,EACR,MAAM,sBAAAC;AAAA,EACN,UAAU,sBAAAC;AAAA,EACV,SAAS,sBAAAC;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;;;ARhCO,IAAM,uBAAuB,CAACC,YAAmC;AACtE,QAAM,CAAC,UAAU,WAAW,QAAI,uBAA8B,CAAC,CAAC;AAEhE;AAAA;AAAA,IAEE,YAAY;AACV,UAAIA,SAAQ;AACV,cAAM,cAAe,MAAM,kBAAkB,cAAcA,OAAM,KAAM,CAAC;AACxE,oBAAY,WAAW;AAAA,MACzB;AAAA,IACF;AAAA,IACA,CAACA,OAAM;AAAA,EACT;AAEA,8BAAU,MAAM;AACd,QAAI,mBAAyD;AAC7D,QAAI,mBAAyD;AAE7D,QAAIA,eAAU,mCAAeA,OAAM,GAAG;AACpC,yBAAmBA,QAAO,GAAG,kBAAkB,YAAY;AACzD,cAAM,cAAe,MAAM,kBAAkB,cAAcA,OAAM,KAAM,CAAC;AACxE,oBAAY,WAAW;AAAA,MACzB,CAAC;AACD,yBAAmBA,QAAO,GAAG,kBAAkB,YAAY;AACzD,cAAM,cAAe,MAAM,kBAAkB,cAAcA,OAAM,KAAM,CAAC;AACxE,oBAAY,WAAW;AAAA,MACzB,CAAC;AAAA,IACH;AAEA,WAAO,MAAM;AACX;AACA;AAAA,IACF;AAAA,EACF,GAAG,CAACA,OAAM,CAAC;AAEX,SAAO;AACT;;;AS3CA,IAAAC,gBAAwB;;;ACDxB,IAAAC,mBAAyB;AAEzB,IAAAC,gBAAwB;;;ACFxB,sBAAyB;AACzB,IAAAC,gBAAwB;AASL,IAAAC,sBAAA;AALZ,IAAM,WAAW,MAAM;AAC5B,QAAM,YAAQ,0BAAS;AACvB,QAAM,YAAQ,uBAAQ,MAAM;AAC1B,UAAM,UAAU,gBAAgB;AAChC,WAAO,OAAO,QAAQ,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,aAAa,MAAM;AACtE,YAAM,OAAO,6CAAC,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;;;ADVO,IAAM,oBAAoB,CAAC,aAAa,UAAU;AACvD,QAAM,YAAQ,2BAAS;AACvB,QAAM,QAAQ,SAAS;AAEvB,QAAM,YAAmC;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;;;ADfO,IAAM,sBAAsB,CACjC,UACA,OACA,WACG;AACH,QAAM,eAAe,kBAAkB;AAEvC,QAAM,cAAU,uBAAsC,MAAM;AAC1D,QAAI,YAAY,UAAU,OAAO;AAC/B,aAAO;AAAA,QACL;AAAA,QACA,QAAQ,UAAU;AAAA,QAClB,OAAO,SAAS;AAAA,MAClB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,UAAU,QAAQ,KAAK,CAAC;AAE5B,SAAO;AACT;;;AGvBA,IAAAC,gBAAiD;;;ACDjD,0BAAgC;AAIzB,IAAM,+BAA2B,qCAAwC;;;ACJhF,IAAAC,uBAA6B;AAItB,IAAM,uBAAuB,CAAC,WAAW,cAAU,mCAAa,0BAA0B,qBAAqB,QAAQ;;;AFCvH,IAAM,iBAAiB,CAAC,qBAAsC;AACnE,QAAM,EAAE,GAAG,IAAI,qBAAqB,IAAI;AACxC,QAAM,CAAC,aAAa,cAAc,QAAI,wBAAuB;AAE7D,QAAM,mBAAe,2BAAY,CAAC,SAAuB;AACvD,SAAK,GAAG,iBAAiB,MAAM;AAC7B,qBAAe,IAAI;AAAA,IACrB,CAAC;AACD,SAAK,GAAG,YAAY,MAAM;AACxB,qBAAe,MAAS;AAAA,IAC1B,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,+BAAU,MAAM;AACd,QAAI,kBAAkB;AACpB,uBAAiB,MAAM,EAAE,QAAQ,YAAY;AAAA,IAC/C;AAAA,EACF,GAAG,CAAC,cAAc,gBAAgB,CAAC;AAEnC,+BAAU,MAAM;AACd,6BAAI,MAAM,MAAM;AACd,SAAG,MAAM,EAAE,QAAQ,YAAY;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,IAAI,YAAY,CAAC;AAErB,SAAO;AACT;;;AG/BA,wBAAkC;AAElC,IAAAC,gBAA0B;AAKnB,IAAM,iBAAiB,CAAC,oBAAmC;AAChE,QAAM,EAAE,GAAG,IAAI,qBAAqB,IAAI;AACxC,QAAM,EAAE,SAAS,gBAAgB,KAAI,mDAAiB,WAAU,CAAC;AACjE,QAAM,CAACC,OAAM,QAAI,qCAAkB,eAAe;AAClD,QAAM,cAAc,qBAAqBA,OAAM;AAE/C,+BAAU,MAAM;AACd,QAAI,iBAAiB;AACnB,YAAM,UAAU,yBAAI,EAAE,YAAY,eAAe;AACjD,UAAI,mCAAS;AAAQ,iCAAI,OAAO;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,IAAI,eAAe,CAAC;AAExB,SAAO;AACT;;;ACpBA,IAAAC,gBAAyB;AAOlB,IAAM,4BAA4B,CAACC,YAA4B;AACpE,QAAM,CAAC,YAAY,aAAa,QAAI,wBAAS,IAAI;AAEjD,QAAM,qBAAqB,MAAM;AAC/B,kBAAc,CAAC,aAAa,CAAC,QAAQ;AAAA,EACvC;AAEA,QAAM,WAAW,qBAAqBA,OAAM;AAC5C,QAAM,QAAQ,kBAAkB,UAAU;AAC1C,QAAM,UAAU,oBAAoB,UAAU,OAAO,gBAAgB;AAErE,SAAO,EAAE,oBAAoB,YAAY,QAAQ;AACnD;;;ACnBA,IAAAC,gBAAoC;AAK7B,IAAM,uBAAuB,CAAC,cAAmC,CAAC,GAAG,eAAyB;AACnG,QAAM,EAAE,GAAG,IAAI,qBAAqB,IAAI;AACxC,QAAM,CAAC,kBAAkB,mBAAmB,QAAI,wBAAgC;AAEhF,+BAAU,MAAM;AACd,QAAI,YAAY,SAAS,GAAG;AAC1B,YAAMC,oBAAmB,yBAAI,IAAI;AACjC,0BAAoBA,iBAAgB;AACpC,+BAAI,OAAO,YAAY;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,IAAI,YAAY,WAAW,CAAC;AAEhC,SAAO;AACT;;;AClBA,IAAAC,gBAAoC;AAI7B,IAAM,qBAAqB,MAAM;AACtC,QAAM,EAAE,GAAG,IAAI,qBAAqB,IAAI;AACxC,QAAM,CAAC,iBAAiB,kBAAkB,QAAI,wBAAuB;AAErE,+BAAU,MAAM;AACd,UAAM,WAAW,CAAC,UAAuB;AACvC,YAAM,UAAU,MAAM,OAAO,CAAC;AAC9B,UAAI,QAAQ,OAAO;AAAG,2BAAmB,OAAO;AAAA,IAClD;AACA,6BAAI,GAAG,UAAU;AAEjB,WAAO,MAAM;AACX,+BAAI,IAAI,UAAU;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,IAAI,kBAAkB,CAAC;AAE3B,SAAO;AACT;;;ACtBA,uBAAoB;AACpB,4BAAiB;AACjB,IAAAC,iBAAuD;AAS9C,IAAAC,sBAAA;AAPF,IAAM,iBAA8C,CAAC,EAAE,SAAS,MAAM;AAC3E,QAAM,CAAC,aAAa,cAAc,QAAI,yBAAS,KAAK;AACpD,gCAAU,MAAM;AACd,8BAAI,sBAAAC,OAAI;AACR,mBAAe,IAAI;AAAA,EACrB,GAAG,CAAC,CAAC;AAEL,SAAO,6EAAG,wBAAc,WAAW,QAAU;AAC/C;;;ACZA,IAAAC,mBAA4C;AAC5C,2BAAiC;AACjC,IAAAC,uBAAqC;AACrC,IAAAC,oBAAgC;AAChC,IAAAC,iBAAgD;AAgCxC,IAAAC,sBAAA;AA3BD,IAAM,iCAA6B,2BAAqD,CAAC,EAAE,SAAS,UAAU,SAAS,GAAG,MAAM,GAAG,QAAQ;AAChJ,QAAM,CAAC,IAAI,KAAK,QAAI,yBAAe;AACnC,QAAM,EAAE,OAAO,aAAa,IAAI,qBAAqB;AACrD,QAAM,gBAAY,2CAAqB,GAAG;AAE1C,QAAM,cAAc,MAAM;AACxB,6BAAI;AACJ,6BAAI,IAAI,QAAW;AAAA,EACrB;AAEA,gCAAU,MAAM;AACd,QAAI,WAAW;AACb,YAAM,YAAQ,kBAAAC,SAAU;AAAA,QACtB,WAAW,UAAU;AAAA,QACrB,GAAG;AAAA,MACL,CAAC;AACD,YAAM,KAAK;AAAA,IACb;AAAA,EACF,GAAG,CAAC,SAAS,SAAS,CAAC;AAEvB,gCAAU,MAAM;AACd,iDAAe;AAAA,EACjB,GAAG,CAAC,IAAI,YAAY,CAAC;AAErB,SACE,8CAAC,gCAAS,GAAG,OACX;AAAA,iDAAC,oBACC,wDAAC,gCACE;AAAA;AAAA,MACD,6CAAC,2BAAO,MAAM,SAAS,SAAS,aAAa,SAAS,aAAa,mBAEnE;AAAA,OACF,GACF;AAAA,IAEA,6CAAC,gCAAQ,YAAW,WAAU,QAAO,QAAO,UAAS,YAAW,KAAK,WAAW,OAAM,QAAO;AAAA,IAC5F;AAAA,KACH;AAEJ,CAAC;AAED,2BAA2B,cAAc;AAEzC,IAAM,uBAAmB,yBAAO,8BAAS,EAAE,MAAM,mBAAmB,CAAC,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EACrF,UAAU;AAAA,EACV,KAAK,MAAM,QAAQ,CAAC;AAAA,EACpB,UAAU;AAAA,EACV,OAAO;AAAA,EACP,KAAK;AAAA,EACL,QAAQ;AACV,EAAE;AAGK,IAAM,sBAAsB;;;AC7DnC,IAAAC,iBAAkD;;;ACDlD,IAAAC,mBAAoE;AACpE,IAAAC,wBAAiC;AACjC,6BAA0B;AAYlB,IAAAC,sBAAA;AAJD,IAAM,oBAAsD,CAAC,EAAE,SAAS,SAAS,MAAM,GAAG,MAAM,MAAM;AAC3G,SACE,6CAAC,2BAAO,UAAU,SAAU,GAAG,OAC7B,wDAAC,iCAAQ,KAAK,GAAG,GAAG,GAAG,OAAK,MAAC,IAAI,EAAE,iBAAiB,CAAC,cAAiB,wBAAM,MAAM,QAAQ,WAAW,OAAO,IAAI,EAAE,GAChH;AAAA,kDAAC,iCAAQ,KAAK,GACZ;AAAA,mDAAC,oCAAU,OAAO,SAAS,MAAM,IAAI;AAAA,MACrC,6CAAC,+BAAY,gBAAK;AAAA,OACpB;AAAA,IACA,6CAAC,yBAAK,OAAO,SAAS,OAAO,WAAW;AAAA,KAC1C,GACF;AAEJ;;;ADaQ,IAAAC,sBAAA;AA1BD,IAAM,uBAAmD,CAAC,EAAE,KAAK,MAAM;AAC5E,QAAM,EAAE,SAAS,KAAK,KAAI,6BAAM,WAAU,CAAC;AAC3C,QAAM,CAAC,aAAa,cAAc,QAAI,yBAAS,6BAAM,qBAAqB;AAC1E,QAAM,UAAM,uBAAuB,IAAI;AACvC,QAAM,CAAC,WAAW,YAAY,QAAI,yBAAgC,IAAI;AAEtE,sCAAgB,MAAM;AACpB,QAAI,QAAQ,IAAI,SAAS;AACvB,qBAAe,KAAK,oBAAoB,CAAC;AACzC,mBAAa,IAAI,OAAO;AAAA,IAC1B;AAEA,UAAM,WAAW,MAAM;AACrB,qBAAe,6BAAM,qBAAqB;AAAA,IAC5C;AAEA,iCAAM,GAAG,YAAY;AAErB,WAAO,MAAM;AACX,mCAAM,IAAI,YAAY,QAAW;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,IAAI,CAAC;AAET,SACE,6EACG,iBACC,8EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA;AAAA;AAAA,UAGL,QAAQ;AAAA,UACR,QAAQ,2CAAa;AAAA,UACrB,MAAM,2CAAa;AAAA,UACnB,eAAe;AAAA,UACf,UAAU;AAAA,UACV,KAAK,2CAAa;AAAA,UAClB,OAAO,2CAAa;AAAA,QACtB;AAAA;AAAA,IACD;AAAA,IACD,6CAAC,qBAAkB,SAAkB,SAAS,WAAW,MAAY,WAAW,OAAO,MAAI,MAAC;AAAA,KAC9F,IACE,MACN;AAEJ;;;AtB/BU,IAAAC,sBAAA;AAXH,IAAM,qBAAwD,CAAC,EAAE,YAAY,GAAG,MAAM,MAAM;AACjG,QAAM,EAAE,oBAAoB,YAAY,QAAQ,IAAI,0BAA0B,cAAc,MAAS;AACrG,QAAM,kBAAkB,mBAAmB;AAC3C,QAAM,cAAc,eAAe,eAAe;AAClD,QAAM,mBAAmB,qBAAqB,aAAa,UAAU;AACrE,QAAM,cAAc,eAAe,gBAAgB;AAEnD,SACE,6CAAC,kBACC;AAAA,IAAC;AAAA;AAAA,MACC,SACE,6CAAC,2BAAO,MAAM,SAAS,SAAS,oBAAoB,SAAQ,aAAY,2BAExE;AAAA,MAEF;AAAA,MACC,GAAG;AAAA,MAEJ,uDAAC,wBAAqB,MAAM,aAAa;AAAA;AAAA,EAC3C,GACF;AAEJ;;;AwBjCA,IAAAC,qBAAgC;AAgBvB,IAAAC,sBAAA;AALF,IAAM,uBAA4D,CAAC,EAAE,MAAM,GAAG,MAAM,MAAM;AAC/F,QAAM,CAAC,YAAY,QAAI,oCAAgB;AACvC,QAAM,WAAW,qBAAqB,QAAQ,YAAY;AAC1D,QAAM,UAAU,oBAAoB,QAAQ;AAE5C,SAAO,6CAAC,8BAA2B,YAAW,WAAU,UAAU,GAAG,QAAO,QAAO,SAAmB,GAAG,OAAO;AAClH;","names":["module","import_material","import_node_model","import_node_model","import_archivist_model","import_diviner_model","module","module","Inventory2RoundedIcon","InsertLinkRoundedIcon","BubbleChartRoundedIcon","QuestionMarkRoundedIcon","HubIcon","TimerRoundedIcon","VisibilityRoundedIcon","module","import_react","import_material","import_react","import_react","import_jsx_runtime","import_react","import_react_shared","import_react","module","import_react","module","import_react","renderedElements","import_react","import_react","import_jsx_runtime","cola","import_material","import_react_shared","import_cytoscape","import_react","import_jsx_runtime","cytoscape","import_react","import_material","import_react_flexbox","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_react_node","import_jsx_runtime"]}

package/dist/node/index.js CHANGED Viewed

@@ -1,33 +1,27 @@
-// src/components/ModuleCardParser.tsx
-import { asArchivistInstance } from "@xyo-network/archivist-model";
-import { asDivinerInstance } from "@xyo-network/diviner-model";
+// src/components/module/CardParser.tsx
+import { asArchivistInstance, isArchivistInstance } from "@xyo-network/archivist-model";
+import { asDivinerInstance, isDivinerInstance } from "@xyo-network/diviner-model";
 import { ArchivistCard } from "@xyo-network/react-archivist";
 import { DivinerCard, ModuleCard } from "@xyo-network/react-module";
 import { jsx } from "react/jsx-runtime";
 var ModuleCardParser = ({ module }) => {
   switch (true) {
-    case (module == null ? void 0 : module.config.schema.includes("archivist")):
+    case isArchivistInstance(module):
       return /* @__PURE__ */ jsx(ArchivistCard, { module: asArchivistInstance(module) });
-    case (module == null ? void 0 : module.config.schema.includes("diviner")):
+    case isDivinerInstance(module):
       return /* @__PURE__ */ jsx(DivinerCard, { module: asDivinerInstance(module) });
     default:
       return /* @__PURE__ */ jsx(ModuleCard, { module });
   }
 };
-// src/components/ProvidedNodeRenderer.tsx
-import { useProvidedNode } from "@xyo-network/react-node";
-// src/hooks/cytoscape/useAddNewElements.tsx
-import { useEffect } from "react";
+// src/components/module/graph/GraphFlexBox.tsx
+import { Button as Button2 } from "@mui/material";
-// src/contexts/CytoscapeInstance/Context.ts
-import { createContextEx } from "@xyo-network/react-shared";
-var CytoscapeInstanceContext = createContextEx();
-// src/contexts/CytoscapeInstance/use.ts
-import { useContextEx } from "@xyo-network/react-shared";
-var useCytoscapeInstance = (required = false) => useContextEx(CytoscapeInstanceContext, "CytoscapeInstance", required);
+// src/hooks/cytoscape/useCytoscapeElements.ts
+import { useAsyncEffect } from "@xylabs/react-async-effect";
+import { isNodeInstance as isNodeInstance3 } from "@xyo-network/node-model";
+import { useEffect, useState } from "react";
 // src/Cytoscape/CytoscapeElements.ts
 import { isNodeInstance as isNodeInstance2 } from "@xyo-network/node-model";
@@ -78,20 +72,20 @@ var ConcentricLayout = {
 };
 // src/Cytoscape/lib/parseModuleType.ts
-import { isArchivistInstance } from "@xyo-network/archivist-model";
+import { isArchivistInstance as isArchivistInstance2 } from "@xyo-network/archivist-model";
 import { isBridgeInstance } from "@xyo-network/bridge-model";
-import { isDivinerInstance } from "@xyo-network/diviner-model";
+import { isDivinerInstance as isDivinerInstance2 } from "@xyo-network/diviner-model";
 import { isNodeInstance } from "@xyo-network/node-model";
 import { isSentinelInstance } from "@xyo-network/sentinel";
 import { isWitnessModule } from "@xyo-network/witness";
 var parseModuleType = (module) => {
   let type = "module";
   if (module) {
-    if (isArchivistInstance(module)) {
+    if (isArchivistInstance2(module)) {
       type = "archivist";
     } else if (isBridgeInstance(module)) {
       type = "bridge";
-    } else if (isDivinerInstance(module)) {
+    } else if (isDivinerInstance2(module)) {
       type = "diviner";
     } else if (isNodeInstance(module)) {
       type = "node";
@@ -238,55 +232,7 @@ var EdgeStyled = (lineColor, targetArrowColor) => ({
   }
 });
-// src/hooks/cytoscape/usePopperListener.tsx
-import { useTheme } from "@mui/material";
-import { useCallback } from "react";
-var usePopperListener = () => {
-  const theme = useTheme();
-  const popperListener = useCallback(
-    (node, hideLabels, cy) => {
-      const div = document.createElement("div");
-      const shadowColor = theme.palette.getContrastText(theme.palette.text.primary);
-      const popper = node.popper({
-        content: () => {
-          div.innerHTML = node.data().name;
-          div.style.opacity = "0";
-          div.style.transition = "opacity .25s";
-          div.style.textShadow = `0 0 3px ${shadowColor}`;
-          document.body.appendChild(div);
-          return div;
-        }
-      });
-      const update = async () => {
-        await popper.update();
-      };
-      node.on("position", update);
-      node.on("mouseover", () => hideLabels ? div.style.opacity = "1" : void 0);
-      node.on("mouseout", () => hideLabels ? div.style.opacity = "0" : void 0);
-      cy == null ? void 0 : cy.on("pan zoom resize", update);
-    },
-    [theme]
-  );
-  return popperListener;
-};
-// src/hooks/cytoscape/useAddNewElements.tsx
-var useAddNewElements = (newElements = [], hideLabels) => {
-  const { cy } = useCytoscapeInstance(true);
-  const popperListener = usePopperListener();
-  useEffect(() => {
-    if (newElements.length > 1) {
-      const renderedElements = cy == null ? void 0 : cy.add(newElements);
-      renderedElements == null ? void 0 : renderedElements.nodes().forEach((node) => popperListener(node, hideLabels, cy));
-      cy == null ? void 0 : cy.layout(ColaLayout).run();
-    }
-  }, [cy, hideLabels, newElements, popperListener]);
-};
 // src/hooks/cytoscape/useCytoscapeElements.ts
-import { useAsyncEffect } from "@xylabs/react-async-effect";
-import { isNodeInstance as isNodeInstance3 } from "@xyo-network/node-model";
-import { useEffect as useEffect2, useState } from "react";
 var useCytoscapeElements = (module) => {
   const [elements, setElements] = useState([]);
   useAsyncEffect(
@@ -299,7 +245,7 @@ var useCytoscapeElements = (module) => {
     },
     [module]
   );
-  useEffect2(() => {
+  useEffect(() => {
     let attachedListener = void 0;
     let detachedListener = void 0;
     if (module && isNodeInstance3(module)) {
@@ -324,15 +270,15 @@ var useCytoscapeElements = (module) => {
 import { useMemo as useMemo3 } from "react";
 // src/hooks/cytoscape/useCytoscapeStyle.tsx
-import { useTheme as useTheme3 } from "@mui/material";
+import { useTheme as useTheme2 } from "@mui/material";
 import { useMemo as useMemo2 } from "react";
 // src/hooks/cytoscape/useIcons.tsx
-import { useTheme as useTheme2 } from "@mui/material";
+import { useTheme } from "@mui/material";
 import { useMemo } from "react";
 import { jsx as jsx2 } from "react/jsx-runtime";
 var useIcons = () => {
-  const theme = useTheme2();
+  const theme = useTheme();
   const icons = useMemo(() => {
     const iconMap = generateIconMap();
     return Object.entries(CyIconSet).reduce((acc, [name, IconComponent]) => {
@@ -346,7 +292,7 @@ var useIcons = () => {
 // src/hooks/cytoscape/useCytoscapeStyle.tsx
 var useCytoscapeStyle = (hideLabels = false) => {
-  const theme = useTheme3();
+  const theme = useTheme2();
   const icons = useIcons();
   const style = useMemo2(
     () => [
@@ -374,12 +320,47 @@ var useCytoscapeOptions = (elements, style, layout) => {
   return options;
 };
+// src/hooks/cytoscape/useHoveredNode.tsx
+import { useCallback, useEffect as useEffect2, useState as useState2 } from "react";
+// src/contexts/CytoscapeInstance/Context.ts
+import { createContextEx } from "@xyo-network/react-shared";
+var CytoscapeInstanceContext = createContextEx();
+// src/contexts/CytoscapeInstance/use.ts
+import { useContextEx } from "@xyo-network/react-shared";
+var useCytoscapeInstance = (required = false) => useContextEx(CytoscapeInstanceContext, "CytoscapeInstance", required);
+// src/hooks/cytoscape/useHoveredNode.tsx
+var useHoveredNode = (renderedElements) => {
+  const { cy } = useCytoscapeInstance(true);
+  const [hoveredNode, setHoveredNode] = useState2();
+  const nodeListener = useCallback((node) => {
+    node.on("mouseover tap", () => {
+      setHoveredNode(node);
+    });
+    node.on("mouseout", () => {
+      setHoveredNode(void 0);
+    });
+  }, []);
+  useEffect2(() => {
+    if (renderedElements) {
+      renderedElements.nodes().forEach(nodeListener);
+    }
+  }, [nodeListener, renderedElements]);
+  useEffect2(() => {
+    cy == null ? void 0 : cy.ready(() => {
+      cy.nodes().forEach(nodeListener);
+    });
+  }, [cy, nodeListener]);
+  return hoveredNode;
+};
 // src/hooks/cytoscape/useNewElements.tsx
 import { useModuleFromNode } from "@xyo-network/react-node";
-import { useEffect as useEffect3, useState as useState2 } from "react";
-var useNewElements = () => {
+import { useEffect as useEffect3 } from "react";
+var useNewElements = (selectedElement) => {
   const { cy } = useCytoscapeInstance(true);
-  const [selectedElement, setSelectedElement] = useState2();
   const { address: selectedAddress } = (selectedElement == null ? void 0 : selectedElement.data()) ?? {};
   const [module] = useModuleFromNode(selectedAddress);
   const newElements = useCytoscapeElements(module);
@@ -390,38 +371,86 @@ var useNewElements = () => {
         cy == null ? void 0 : cy.center(element);
     }
   }, [cy, selectedAddress]);
-  return { newElements, setSelectedElement };
+  return newElements;
 };
 // src/hooks/cytoscape/useRelationalGraphOptions.tsx
 import { useState as useState3 } from "react";
 var useRelationalGraphOptions = (module) => {
-  const [hideLabels, setHideLabels] = useState3(false);
+  const [hideLabels, setHideLabels] = useState3(true);
   const handleToggleLabels = () => {
     setHideLabels((oldValue) => !oldValue);
   };
   const elements = useCytoscapeElements(module);
   const style = useCytoscapeStyle(hideLabels);
-  const options = useCytoscapeOptions(elements, style, ColaLayout);
+  const options = useCytoscapeOptions(elements, style, ConcentricLayout);
   return { handleToggleLabels, hideLabels, options };
 };
+// src/hooks/cytoscape/useRenderNewElements.tsx
+import { useEffect as useEffect4, useState as useState4 } from "react";
+var useRenderNewElements = (newElements = [], hideLabels) => {
+  const { cy } = useCytoscapeInstance(true);
+  const [renderedElements, setRenderedElements] = useState4();
+  useEffect4(() => {
+    if (newElements.length > 1) {
+      const renderedElements2 = cy == null ? void 0 : cy.add(newElements);
+      setRenderedElements(renderedElements2);
+      cy == null ? void 0 : cy.layout(ColaLayout).run();
+    }
+  }, [cy, hideLabels, newElements]);
+  return renderedElements;
+};
+// src/hooks/cytoscape/useSelectedElement.tsx
+import { useEffect as useEffect5, useState as useState5 } from "react";
+var useSelectedElement = () => {
+  const { cy } = useCytoscapeInstance(true);
+  const [selectedElement, setSelectedElement] = useState5();
+  useEffect5(() => {
+    const listener = (event) => {
+      const element = event.target[0];
+      if (element.isNode())
+        setSelectedElement(element);
+    };
+    cy == null ? void 0 : cy.on("select", listener);
+    return () => {
+      cy == null ? void 0 : cy.off("select", listener);
+    };
+  }, [cy, setSelectedElement]);
+  return selectedElement;
+};
+// src/components/cytoscape-extensions/WithExtensions.tsx
+import { use } from "cytoscape";
+import cola from "cytoscape-cola";
+import { useEffect as useEffect6, useState as useState6 } from "react";
+import { Fragment, jsx as jsx3 } from "react/jsx-runtime";
+var WithExtensions = ({ children }) => {
+  const [initialized, setInitialized] = useState6(false);
+  useEffect6(() => {
+    use(cola);
+    setInitialized(true);
+  }, []);
+  return /* @__PURE__ */ jsx3(Fragment, { children: initialized ? children : void 0 });
+};
 // src/components/RelationalGraph.tsx
 import { Button, ButtonGroup, styled } from "@mui/material";
 import { FlexCol, FlexRow } from "@xylabs/react-flexbox";
 import { useShareForwardedRef } from "@xyo-network/react-shared";
 import cytoscape from "cytoscape";
-import { forwardRef, useEffect as useEffect4, useState as useState4 } from "react";
-import { jsx as jsx3, jsxs } from "react/jsx-runtime";
-var NodeRelationalGraphFlexBox = forwardRef(({ actions, options, ...props }, ref) => {
-  const [cy, setCy] = useState4();
+import { forwardRef, useEffect as useEffect7, useState as useState7 } from "react";
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
+var NodeRelationalGraphFlexBox = forwardRef(({ actions, children, options, ...props }, ref) => {
+  const [cy, setCy] = useState7();
   const { setCy: setCyContext } = useCytoscapeInstance();
   const sharedRef = useShareForwardedRef(ref);
   const handleReset = () => {
     cy == null ? void 0 : cy.reset();
     cy == null ? void 0 : cy.fit(void 0, 20);
   };
-  useEffect4(() => {
+  useEffect7(() => {
     if (sharedRef) {
       const newCy = cytoscape({
         container: sharedRef.current,
@@ -430,15 +459,16 @@ var NodeRelationalGraphFlexBox = forwardRef(({ actions, options, ...props }, ref
       setCy(newCy);
     }
   }, [options, sharedRef]);
-  useEffect4(() => {
+  useEffect7(() => {
     setCyContext == null ? void 0 : setCyContext(cy);
   }, [cy, setCyContext]);
   return /* @__PURE__ */ jsxs(FlexCol, { ...props, children: [
-    /* @__PURE__ */ jsx3(ActionsContainer, { children: /* @__PURE__ */ jsxs(ButtonGroup, { children: [
+    /* @__PURE__ */ jsx4(ActionsContainer, { children: /* @__PURE__ */ jsxs(ButtonGroup, { children: [
       actions,
-      /* @__PURE__ */ jsx3(Button, { size: "small", variant: "contained", onClick: handleReset, children: "Reset" })
+      /* @__PURE__ */ jsx4(Button, { size: "small", variant: "contained", onClick: handleReset, children: "Reset" })
     ] }) }),
-    /* @__PURE__ */ jsx3(FlexCol, { alignItems: "stretch", height: "100%", position: "absolute", ref: sharedRef, width: "100%" })
+    /* @__PURE__ */ jsx4(FlexCol, { alignItems: "stretch", height: "100%", position: "absolute", ref: sharedRef, width: "100%" }),
+    children
   ] });
 });
 NodeRelationalGraphFlexBox.displayName = "NodeRelationalGraph";
@@ -452,13 +482,93 @@ var ActionsContainer = styled(FlexRow, { name: "ActionsContainer" })(({ theme })
 }));
 var NodeRelationalGraph = NodeRelationalGraphFlexBox;
+// src/components/module/graph/NodeHover.tsx
+import { useLayoutEffect, useRef, useState as useState8 } from "react";
+// src/components/module/graph/Popper.tsx
+import { alpha, Chip, Popper, Typography } from "@mui/material";
+import { FlexCol as FlexCol2, FlexRow as FlexRow2 } from "@xylabs/react-flexbox";
+import { Identicon } from "@xylabs/react-identicon";
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+var ModuleHoverPopper = ({ address, element, name, ...props }) => {
+  return /* @__PURE__ */ jsx5(Popper, { anchorEl: element, ...props, children: /* @__PURE__ */ jsxs2(FlexCol2, { gap: 2, p: 2, paper: true, sx: { backgroundColor: (theme) => alpha(theme.palette.background.paper, 0.95) }, children: [
+    /* @__PURE__ */ jsxs2(FlexRow2, { gap: 2, children: [
+      /* @__PURE__ */ jsx5(Identicon, { value: address, size: 24 }),
+      /* @__PURE__ */ jsx5(Typography, { children: name })
+    ] }),
+    /* @__PURE__ */ jsx5(Chip, { label: address, color: "primary" })
+  ] }) });
+};
+// src/components/module/graph/NodeHover.tsx
+import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+var ModuleGraphNodeHover = ({ node }) => {
+  const { address, name } = (node == null ? void 0 : node.data()) ?? {};
+  const [boundingBox, setBoundingBox] = useState8(node == null ? void 0 : node.renderedBoundingBox());
+  const ref = useRef(null);
+  const [currentEl, setCurrentEl] = useState8(null);
+  useLayoutEffect(() => {
+    if (node && ref.current) {
+      setBoundingBox(node.renderedBoundingBox());
+      setCurrentEl(ref.current);
+    }
+    const listener = () => {
+      setBoundingBox(node == null ? void 0 : node.renderedBoundingBox());
+    };
+    node == null ? void 0 : node.on("position", listener);
+    return () => {
+      node == null ? void 0 : node.off("position", void 0, listener);
+    };
+  }, [node]);
+  return /* @__PURE__ */ jsx6(Fragment2, { children: node ? /* @__PURE__ */ jsxs3(Fragment2, { children: [
+    /* @__PURE__ */ jsx6(
+      "div",
+      {
+        ref,
+        style: {
+          // backgroundColor: '#fff',
+          // opacity: 0.25,
+          cursor: "pointer",
+          height: boundingBox == null ? void 0 : boundingBox.h,
+          left: boundingBox == null ? void 0 : boundingBox.x1,
+          pointerEvents: "none",
+          position: "absolute",
+          top: boundingBox == null ? void 0 : boundingBox.y1,
+          width: boundingBox == null ? void 0 : boundingBox.w
+        }
+      }
+    ),
+    /* @__PURE__ */ jsx6(ModuleHoverPopper, { address, element: currentEl, name, placement: "top", open: true })
+  ] }) : null });
+};
+// src/components/module/graph/GraphFlexBox.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+var ModuleGraphFlexBox = ({ rootModule, ...props }) => {
+  const { handleToggleLabels, hideLabels, options } = useRelationalGraphOptions(rootModule ?? void 0);
+  const selectedElement = useSelectedElement();
+  const newElements = useNewElements(selectedElement);
+  const renderedElements = useRenderNewElements(newElements, hideLabels);
+  const hoveredNode = useHoveredNode(renderedElements);
+  return /* @__PURE__ */ jsx7(WithExtensions, { children: /* @__PURE__ */ jsx7(
+    NodeRelationalGraphFlexBox,
+    {
+      actions: /* @__PURE__ */ jsx7(Button2, { size: "small", onClick: handleToggleLabels, variant: "contained", children: "Toggle Labels" }),
+      options,
+      ...props,
+      children: /* @__PURE__ */ jsx7(ModuleGraphNodeHover, { node: hoveredNode })
+    }
+  ) });
+};
 // src/components/ProvidedNodeRenderer.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { useProvidedNode } from "@xyo-network/react-node";
+import { jsx as jsx8 } from "react/jsx-runtime";
 var ProvidedNodeRenderer = ({ node, ...props }) => {
   const [providedNode] = useProvidedNode();
   const elements = useCytoscapeElements(node ?? providedNode);
   const options = useCytoscapeOptions(elements);
-  return /* @__PURE__ */ jsx4(NodeRelationalGraphFlexBox, { alignItems: "stretch", flexGrow: 1, height: "100%", options, ...props });
+  return /* @__PURE__ */ jsx8(NodeRelationalGraphFlexBox, { alignItems: "stretch", flexGrow: 1, height: "100%", options, ...props });
 };
 export {
   ColaLayout,
@@ -467,6 +577,7 @@ export {
   CytoscapeElements,
   EdgeStyled,
   ModuleCardParser,
+  ModuleGraphFlexBox,
   NodeIdStyles,
   NodeRelationalGraph,
   NodeRelationalGraphFlexBox,
@@ -475,11 +586,12 @@ export {
   encodeSvg,
   generateIconMap,
   parseModuleType,
-  useAddNewElements,
   useCytoscapeElements,
   useCytoscapeOptions,
+  useHoveredNode,
   useNewElements,
-  usePopperListener,
-  useRelationalGraphOptions
+  useRelationalGraphOptions,
+  useRenderNewElements,
+  useSelectedElement
 };
 //# sourceMappingURL=index.js.map