@xyo-network/react-node-renderer 2.61.0 → 2.62.3

package/dist/hooks/cytoscape/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA"}

package/dist/{esm/hooks/cytoscape/index.js → hooks/cytoscape/index.d.ts}

@@ -1,3 +1,3 @@
 export * from './useCytoscapeElements';
 export * from './useCytoscapeOptions';
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.d.ts.map

package/dist/hooks/cytoscape/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA"}

package/dist/hooks/cytoscape/useCytoscapeElements.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCytoscapeElements.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/useCytoscapeElements.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAK7C;;;GAGG;AACH,eAAO,MAAM,oBAAoB,eAAgB,YAAY,GAAG,SAAS,GAAG,IAAI,wBAoC/E,CAAA"}

package/dist/hooks/cytoscape/useCytoscapeElements.d.ts

@@ -0,0 +1,8 @@
+import { NodeInstance } from '@xyo-network/node-model';
+import { ElementDefinition } from 'cytoscape';
+/**
+ * Note: Relies on describe but could eventually be converted to a discover call
+ * Logic would be similar to what the bridge does
+ */
+export declare const useCytoscapeElements: (targetNode: NodeInstance | undefined | null) => ElementDefinition[];
+//# sourceMappingURL=useCytoscapeElements.d.ts.map

package/dist/hooks/cytoscape/useCytoscapeElements.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCytoscapeElements.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/useCytoscapeElements.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAK7C;;;GAGG;AACH,eAAO,MAAM,oBAAoB,eAAgB,YAAY,GAAG,SAAS,GAAG,IAAI,wBAoC/E,CAAA"}

package/dist/hooks/cytoscape/useCytoscapeLayout.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCytoscapeLayout.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/useCytoscapeLayout.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB,2FAU9B,CAAA"}

package/dist/hooks/cytoscape/useCytoscapeLayout.d.ts

@@ -0,0 +1,2 @@
+export declare const useCytoscapeLayout: () => import("cytoscape").BaseLayoutOptions | import("cytoscape").ConcentricLayoutOptions;
+//# sourceMappingURL=useCytoscapeLayout.d.ts.map

package/dist/hooks/cytoscape/useCytoscapeLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCytoscapeLayout.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/useCytoscapeLayout.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB,2FAU9B,CAAA"}

package/dist/hooks/cytoscape/useCytoscapeOptions.d.mts.map

@@ -0,0 +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,qBAepC,CAAA"}

package/dist/hooks/cytoscape/useCytoscapeOptions.d.ts

@@ -0,0 +1,3 @@
+import { CytoscapeOptions } from 'cytoscape';
+export declare const useCytoscapeOptions: (elements: CytoscapeOptions['elements'], style?: CytoscapeOptions['style'], layout?: CytoscapeOptions['layout']) => CytoscapeOptions;
+//# sourceMappingURL=useCytoscapeOptions.d.ts.map

package/dist/hooks/cytoscape/useCytoscapeOptions.d.ts.map

@@ -0,0 +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,qBAepC,CAAA"}

package/dist/hooks/cytoscape/useCytoscapeStyle.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCytoscapeStyle.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/useCytoscapeStyle.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,iBAAiB,wCAc7B,CAAA"}

package/dist/hooks/cytoscape/useCytoscapeStyle.d.ts

@@ -0,0 +1,2 @@
+export declare const useCytoscapeStyle: () => import("cytoscape").Stylesheet[];
+//# sourceMappingURL=useCytoscapeStyle.d.ts.map

package/dist/hooks/cytoscape/useCytoscapeStyle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCytoscapeStyle.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/useCytoscapeStyle.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,iBAAiB,wCAc7B,CAAA"}

package/dist/hooks/cytoscape/useIcons.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIcons.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/useIcons.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAa,iBAAiB,EAA8B,MAAM,iBAAiB,CAAA;AAE1F,eAAO,MAAM,QAAQ,yCAYpB,CAAA"}

package/dist/hooks/cytoscape/useIcons.d.ts

@@ -0,0 +1,3 @@
+import { CyNodeModuleTypes } from '../../Cytoscape';
+export declare const useIcons: () => Record<CyNodeModuleTypes, string>;
+//# sourceMappingURL=useIcons.d.ts.map

package/dist/hooks/cytoscape/useIcons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIcons.d.ts","sourceRoot":"","sources":["../../../src/hooks/cytoscape/useIcons.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAa,iBAAiB,EAA8B,MAAM,iBAAiB,CAAA;AAE1F,eAAO,MAAM,QAAQ,yCAYpB,CAAA"}

package/dist/hooks/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}

package/dist/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export * from './cytoscape';
+//# sourceMappingURL=index.d.ts.map

package/dist/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}

package/dist/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,SAAS,CAAA"}

package/dist/{esm/index.js → index.d.ts}

@@ -1,4 +1,4 @@
 export * from './components';
 export * from './Cytoscape';
 export * from './hooks';
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,SAAS,CAAA"}

package/dist/index.js

@@ -0,0 +1,412 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  CyIconSet: () => CyIconSet,
+  CytoscapeElements: () => CytoscapeElements,
+  EdgeStyled: () => EdgeStyled,
+  ModuleCardParser: () => ModuleCardParser,
+  NodeIdStyles: () => NodeIdStyles,
+  NodeRelationalGraph: () => NodeRelationalGraph,
+  NodeStyled: () => NodeStyled,
+  ProvidedNodeRenderer: () => ProvidedNodeRenderer,
+  encodeSvg: () => encodeSvg,
+  generateIconMap: () => generateIconMap,
+  parseModuleType: () => parseModuleType,
+  useCytoscapeElements: () => useCytoscapeElements,
+  useCytoscapeOptions: () => useCytoscapeOptions
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/components/ModuleCardParser.tsx
+var import_archivist_model = require("@xyo-network/archivist-model");
+var import_diviner_model = require("@xyo-network/diviner-model");
+var import_react_archivist = require("@xyo-network/react-archivist");
+var import_react_module = require("@xyo-network/react-module");
+var import_jsx_runtime = require("react/jsx-runtime");
+var ModuleCardParser = ({ module: module2 }) => {
+  switch (true) {
+    case module2?.config.schema.includes("archivist"):
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_archivist.ArchivistCard, { module: (0, import_archivist_model.asArchivistInstance)(module2) });
+    case module2?.config.schema.includes("diviner"):
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_module.DivinerCard, { module: (0, import_diviner_model.asDivinerInstance)(module2) });
+    default:
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_module.ModuleCard, { module: module2 });
+  }
+};
+
+// src/components/ProvidedNodeRenderer.tsx
+var import_react_node = require("@xyo-network/react-node");
+
+// src/hooks/cytoscape/useCytoscapeElements.ts
+var import_react_async_effect = require("@xylabs/react-async-effect");
+var import_react = require("react");
+
+// src/Cytoscape/lib/encodeSvg.ts
+var import_server = require("react-dom/server");
+var dataUri = "data:image/svg+xml,";
+var encodeSvg = (reactElement, color) => {
+  const svgString = (0, import_server.renderToStaticMarkup)(reactElement);
+  const doc = new DOMParser().parseFromString(svgString, "text/html");
+  const svgElement = doc.getElementsByTagName("svg")[0];
+  if (svgElement) {
+    svgElement.setAttribute("xmlns", "http://www.w3.org/2000/svg");
+    svgElement.setAttribute("height", "100");
+    svgElement.style.fill = color ?? "black";
+  }
+  return `${dataUri}${window.encodeURIComponent(svgElement.outerHTML)}`;
+};
+
+// src/Cytoscape/lib/iconMap.ts
+var generateIconMap = () => ({
+  archivist: "",
+  bridge: "",
+  diviner: "",
+  module: "",
+  node: "",
+  sentinel: "",
+  witness: ""
+});
+
+// src/Cytoscape/lib/parseModuleType.ts
+var parseModuleType = (schema) => {
+  let type = "module";
+  if (schema) {
+    if (schema.includes("archivist")) {
+      type = "archivist";
+    } else if (schema.includes("bridge")) {
+      type = "bridge";
+    } else if (schema.includes("diviner")) {
+      type = "diviner";
+    } else if (schema.includes("node")) {
+      type = "node";
+    } else if (schema.includes("sentinel")) {
+      type = "sentinel";
+    } else if (schema.includes("witness")) {
+      type = "witness";
+    } else {
+      type = "module";
+    }
+  }
+  return type;
+};
+
+// src/Cytoscape/CytoscapeElements.ts
+var CytoscapeElements = class _CytoscapeElements {
+  static MaxNameLength = 20;
+  static buildEdge(rootNode, newNode) {
+    return {
+      data: {
+        id: `${rootNode.data.id}/${newNode.data.id}`,
+        source: rootNode.data.id,
+        target: newNode.data.id
+      }
+    };
+  }
+  static async buildElements(node) {
+    try {
+      const [, newRootNode] = await _CytoscapeElements.buildRootNode(node);
+      const newElements = [newRootNode];
+      const children = await Promise.all(
+        (await node.resolve()).map(async (child) => [await child.manifest(), child.address])
+      );
+      await Promise.allSettled(
+        (children ?? [])?.map(async ([child, address]) => {
+          try {
+            const newNode = await _CytoscapeElements.buildNode(child, address);
+            newElements.push(newNode);
+            const newEdge = _CytoscapeElements.buildEdge(newRootNode, newNode);
+            newElements.push(newEdge);
+          } catch (e) {
+            console.error("Error parsing children", e);
+          }
+        })
+      );
+      return newElements;
+    } catch (e) {
+      console.error("Error Getting initial description", e);
+    }
+  }
+  static buildNode(manifest, address) {
+    const newNodeId = _CytoscapeElements.normalizeName(manifest.config.name) ?? address.substring(0, 8);
+    return {
+      data: {
+        address,
+        id: newNodeId,
+        type: parseModuleType(manifest.config.schema)
+      }
+    };
+  }
+  static buildRootNode = async (node) => {
+    const manifest = await node?.manifest();
+    return [manifest, _CytoscapeElements.buildNode(manifest, node.address)];
+  };
+  static normalizeName(name) {
+    if (!name)
+      return;
+    if (name.length > this.MaxNameLength)
+      return `${name.substring(0, 20)}...`;
+    return name;
+  }
+};
+
+// src/Cytoscape/CytoscapeIcons.tsx
+var import_BubbleChartRounded = __toESM(require("@mui/icons-material/BubbleChartRounded"));
+var import_Hub = __toESM(require("@mui/icons-material/Hub"));
+var import_InsertLinkRounded = __toESM(require("@mui/icons-material/InsertLinkRounded"));
+var import_Inventory2Rounded = __toESM(require("@mui/icons-material/Inventory2Rounded"));
+var import_QuestionMarkRounded = __toESM(require("@mui/icons-material/QuestionMarkRounded"));
+var import_TimerRounded = __toESM(require("@mui/icons-material/TimerRounded"));
+var import_VisibilityRounded = __toESM(require("@mui/icons-material/VisibilityRounded"));
+var CyIconSet = {
+  archivist: import_Inventory2Rounded.default,
+  bridge: import_InsertLinkRounded.default,
+  diviner: import_BubbleChartRounded.default,
+  module: import_QuestionMarkRounded.default,
+  node: import_Hub.default,
+  sentinel: import_TimerRounded.default,
+  witness: import_VisibilityRounded.default
+};
+
+// src/Cytoscape/CytoscapeStyles.ts
+var NodeIdStyles = (color) => ({
+  selector: "node[id]",
+  style: {
+    color,
+    "font-family": "Lexend Deca, Helvetica, sans-serif",
+    "font-size": 14,
+    "text-margin-y": -5
+  }
+});
+var NodeStyled = (icons, bgColor) => ({
+  selector: "node",
+  style: {
+    "background-color": bgColor,
+    "background-height": "75%",
+    // TODO - make dynamic
+    "background-image": (elem) => icons[elem.data("type")],
+    "background-image-smoothing": "yes",
+    "background-width": "75%",
+    label: "data(id)"
+  }
+});
+var EdgeStyled = (lineColor, targetArrowColor) => ({
+  selector: "edge",
+  style: {
+    "curve-style": "bezier",
+    "line-color": lineColor,
+    "line-opacity": 0.1,
+    "target-arrow-color": targetArrowColor,
+    "target-arrow-shape": "triangle",
+    width: 3
+  }
+});
+
+// src/hooks/cytoscape/useCytoscapeElements.ts
+var useCytoscapeElements = (targetNode) => {
+  const [elements, setElements] = (0, import_react.useState)([]);
+  (0, import_react_async_effect.useAsyncEffect)(
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    async () => {
+      if (targetNode) {
+        const newElements = await CytoscapeElements.buildElements(targetNode) ?? [];
+        setElements(newElements);
+      }
+    },
+    [targetNode]
+  );
+  (0, import_react.useEffect)(() => {
+    let attachedListener = void 0;
+    let detachedListener = void 0;
+    if (targetNode) {
+      attachedListener = targetNode.on("moduleAttached", async () => {
+        const newElements = await CytoscapeElements.buildElements(targetNode) ?? [];
+        setElements(newElements);
+      });
+      detachedListener = targetNode.on("moduleDetached", async () => {
+        const newElements = await CytoscapeElements.buildElements(targetNode) ?? [];
+        setElements(newElements);
+      });
+    }
+    return () => {
+      attachedListener?.();
+      detachedListener?.();
+    };
+  }, [targetNode]);
+  return elements;
+};
+
+// src/hooks/cytoscape/useCytoscapeOptions.ts
+var import_react5 = require("react");
+
+// src/hooks/cytoscape/useCytoscapeLayout.ts
+var import_react2 = require("react");
+var useCytoscapeLayout = () => {
+  const layout = (0, import_react2.useMemo)(
+    () => ({
+      minNodeSpacing: 75,
+      name: "concentric"
+    }),
+    []
+  );
+  return layout;
+};
+
+// src/hooks/cytoscape/useCytoscapeStyle.ts
+var import_material2 = require("@mui/material");
+var import_react4 = require("react");
+
+// src/hooks/cytoscape/useIcons.tsx
+var import_material = require("@mui/material");
+var import_react3 = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var useIcons = () => {
+  const theme = (0, import_material.useTheme)();
+  const icons = (0, import_react3.useMemo)(() => {
+    const iconMap = generateIconMap();
+    return Object.entries(CyIconSet).reduce((acc, [name, IconComponent]) => {
+      const icon = /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(IconComponent, { fontSize: "small" });
+      acc[name] = encodeSvg(icon, theme.palette.getContrastText(theme.palette.text.primary));
+      return acc;
+    }, iconMap);
+  }, [theme.palette]);
+  return icons;
+};
+
+// src/hooks/cytoscape/useCytoscapeStyle.ts
+var useCytoscapeStyle = () => {
+  const theme = (0, import_material2.useTheme)();
+  const icons = useIcons();
+  const style = (0, import_react4.useMemo)(
+    () => [
+      NodeIdStyles(theme.palette.text.primary),
+      NodeStyled(icons, theme.palette.primary.main),
+      EdgeStyled(theme.palette.divider, theme.palette.divider)
+    ],
+    [icons, theme.palette.divider, theme.palette.primary.main, theme.palette.text.primary]
+  );
+  return style;
+};
+
+// src/hooks/cytoscape/useCytoscapeOptions.ts
+var useCytoscapeOptions = (elements, style, layout) => {
+  const defaultStyle = useCytoscapeStyle();
+  const defaultLayout = useCytoscapeLayout();
+  const options = (0, import_react5.useMemo)(
+    () => ({
+      elements,
+      layout: layout ?? defaultLayout,
+      style: style ?? defaultStyle
+    }),
+    [defaultLayout, defaultStyle, elements, layout, style]
+  );
+  return options;
+};
+
+// src/components/RelationalGraph.tsx
+var import_material3 = require("@mui/material");
+var import_react_flexbox = require("@xylabs/react-flexbox");
+var import_react_shared3 = require("@xyo-network/react-shared");
+var import_cytoscape = __toESM(require("cytoscape"));
+var import_react6 = require("react");
+
+// src/contexts/CytoscapeInstance/Context.ts
+var import_react_shared = require("@xyo-network/react-shared");
+var CytoscapeInstanceContext = (0, import_react_shared.createContextEx)();
+
+// src/contexts/CytoscapeInstance/use.ts
+var import_react_shared2 = require("@xyo-network/react-shared");
+var useCytoscapeInstance = (required = false) => (0, import_react_shared2.useContextEx)(CytoscapeInstanceContext, "CytoscapeInstance", required);
+
+// src/components/RelationalGraph.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var NodeRelationalGraph = (0, import_react6.forwardRef)(({ actions, options, ...props }, ref) => {
+  const [cy, setCy] = (0, import_react6.useState)();
+  const { setCy: setCyContext } = useCytoscapeInstance();
+  const sharedRef = (0, import_react_shared3.useShareForwardedRef)(ref);
+  const handleReset = () => {
+    cy?.reset();
+    cy?.fit(void 0, 20);
+  };
+  (0, import_react6.useEffect)(() => {
+    if (sharedRef) {
+      const newCy = (0, import_cytoscape.default)({
+        container: sharedRef.current,
+        ...options
+      });
+      setCy(newCy);
+    }
+  }, [options, sharedRef]);
+  (0, import_react6.useEffect)(() => {
+    setCyContext?.(cy);
+  }, [cy, setCyContext]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react_flexbox.FlexCol, { ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(ActionsContainer, { children: [
+      actions,
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Button, { size: "small", variant: "contained", onClick: handleReset, children: "Reset" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_flexbox.FlexCol, { alignItems: "stretch", height: "100%", position: "absolute", ref: sharedRef, width: "100%" })
+  ] });
+});
+NodeRelationalGraph.displayName = "NodeRelationalGraph";
+var ActionsContainer = (0, import_material3.styled)(import_react_flexbox.FlexRow, { name: "ActionsContainer" })(() => ({
+  flexWrap: "wrap",
+  position: "absolute",
+  right: "10px",
+  top: "10px",
+  zIndex: 2
+}));
+
+// src/components/ProvidedNodeRenderer.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var ProvidedNodeRenderer = ({ node, ...props }) => {
+  const [providedNode] = (0, import_react_node.useProvidedNode)();
+  const elements = useCytoscapeElements(node ?? providedNode);
+  const options = useCytoscapeOptions(elements);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(NodeRelationalGraph, { alignItems: "stretch", flexGrow: 1, height: "100%", options, ...props });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CyIconSet,
+  CytoscapeElements,
+  EdgeStyled,
+  ModuleCardParser,
+  NodeIdStyles,
+  NodeRelationalGraph,
+  NodeStyled,
+  ProvidedNodeRenderer,
+  encodeSvg,
+  generateIconMap,
+  parseModuleType,
+  useCytoscapeElements,
+  useCytoscapeOptions
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/components/ModuleCardParser.tsx","../src/components/ProvidedNodeRenderer.tsx","../src/hooks/cytoscape/useCytoscapeElements.ts","../src/Cytoscape/lib/encodeSvg.ts","../src/Cytoscape/lib/iconMap.ts","../src/Cytoscape/lib/parseModuleType.ts","../src/Cytoscape/CytoscapeElements.ts","../src/Cytoscape/CytoscapeIcons.tsx","../src/Cytoscape/CytoscapeStyles.ts","../src/hooks/cytoscape/useCytoscapeOptions.ts","../src/hooks/cytoscape/useCytoscapeLayout.ts","../src/hooks/cytoscape/useCytoscapeStyle.ts","../src/hooks/cytoscape/useIcons.tsx","../src/components/RelationalGraph.tsx","../src/contexts/CytoscapeInstance/Context.ts","../src/contexts/CytoscapeInstance/use.ts"],"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 { NodeRelationalGraph } 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 <NodeRelationalGraph alignItems=\"stretch\" flexGrow={1} height=\"100%\" options={options} {...props} />\n}\n","import { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { EventUnsubscribeFunction } from '@xyo-network/module'\nimport { NodeInstance } from '@xyo-network/node-model'\nimport { ElementDefinition } from 'cytoscape'\nimport { useEffect, useState } from 'react'\n\nimport { CytoscapeElements } from '../../Cytoscape'\n\n/**\n * Note: Relies on describe but could eventually be converted to a discover call\n * Logic would be similar to what the bridge does\n */\nexport const useCytoscapeElements = (targetNode: NodeInstance | undefined | null) => {\n  const [elements, setElements] = useState<ElementDefinition[]>([])\n\n  useAsyncEffect(\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    async () => {\n      if (targetNode) {\n        const newElements = (await CytoscapeElements.buildElements(targetNode)) ?? []\n        setElements(newElements)\n      }\n    },\n    [targetNode],\n  )\n\n  useEffect(() => {\n    let attachedListener: EventUnsubscribeFunction | undefined = undefined\n    let detachedListener: EventUnsubscribeFunction | undefined = undefined\n\n    if (targetNode) {\n      attachedListener = targetNode.on('moduleAttached', async () => {\n        const newElements = (await CytoscapeElements.buildElements(targetNode)) ?? []\n        setElements(newElements)\n      })\n      detachedListener = targetNode.on('moduleDetached', async () => {\n        const newElements = (await CytoscapeElements.buildElements(targetNode)) ?? []\n        setElements(newElements)\n      })\n    }\n\n    return () => {\n      attachedListener?.()\n      detachedListener?.()\n    }\n  }, [targetNode])\n\n  return elements\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 { CyNodeModuleTypes } from './CyNodeModuleTypes'\n\nexport const parseModuleType = (schema?: string): CyNodeModuleTypes => {\n  let type: CyNodeModuleTypes = 'module'\n  if (schema) {\n    if (schema.includes('archivist')) {\n      type = 'archivist'\n    } else if (schema.includes('bridge')) {\n      type = 'bridge'\n    } else if (schema.includes('diviner')) {\n      type = 'diviner'\n    } else if (schema.includes('node')) {\n      type = 'node'\n    } else if (schema.includes('sentinel')) {\n      type = 'sentinel'\n    } else if (schema.includes('witness')) {\n      type = 'witness'\n    } else {\n      type = 'module'\n    }\n  }\n  return type\n}\n","import { ModuleManifest } from '@xyo-network/manifest-model'\nimport { NodeInstance } 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(node: NodeInstance) {\n    try {\n      const [, newRootNode] = await CytoscapeElements.buildRootNode(node)\n      const newElements: ElementDefinition[] = [newRootNode]\n\n      const children = await Promise.all(\n        (await node.resolve()).map<Promise<[ModuleManifest, string]>>(async (child) => [await child.manifest(), child.address]),\n      )\n      await Promise.allSettled(\n        (children ?? [])?.map(async ([child, address]) => {\n          try {\n            const newNode = await CytoscapeElements.buildNode(child, address)\n            newElements.push(newNode)\n\n            const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode)\n            newElements.push(newEdge)\n          } catch (e) {\n            console.error('Error parsing children', e)\n          }\n        }),\n      )\n      return newElements\n    } catch (e) {\n      console.error('Error Getting initial description', e)\n    }\n  }\n\n  static buildNode(manifest: ModuleManifest, address: string): ElementDefinition {\n    const newNodeId = CytoscapeElements.normalizeName(manifest.config.name) ?? address.substring(0, 8)\n    return {\n      data: {\n        address,\n        id: newNodeId,\n        type: parseModuleType(manifest.config.schema),\n      },\n    }\n  }\n\n  static buildRootNode = async (node: NodeInstance): Promise<[ModuleManifest, ElementDefinition]> => {\n    const manifest = await node?.manifest()\n    return [manifest, CytoscapeElements.buildNode(manifest, node.address)]\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","import BubbleChartRoundedIcon from '@mui/icons-material/BubbleChartRounded'\nimport HubIcon from '@mui/icons-material/Hub'\nimport InsertLinkRoundedIcon from '@mui/icons-material/InsertLinkRounded'\nimport Inventory2RoundedIcon from '@mui/icons-material/Inventory2Rounded'\nimport QuestionMarkRoundedIcon from '@mui/icons-material/QuestionMarkRounded'\nimport TimerRoundedIcon from '@mui/icons-material/TimerRounded'\nimport VisibilityRoundedIcon from '@mui/icons-material/VisibilityRounded'\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): Stylesheet => ({\n  selector: 'node[id]',\n  style: {\n    color,\n    'font-family': 'Lexend Deca, Helvetica, sans-serif',\n    'font-size': 14,\n    'text-margin-y': -5,\n  },\n})\n\nexport const NodeStyled = (icons: Record<CyNodeModuleTypes, string>, bgColor?: string): Stylesheet => ({\n  selector: 'node',\n  style: {\n    'background-color': bgColor,\n    'background-height': '75%',\n    // TODO - make dynamic\n    'background-image': (elem) => icons[elem.data('type') as CyNodeModuleTypes],\n    'background-image-smoothing': 'yes',\n    'background-width': '75%',\n    label: 'data(id)',\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 { useCytoscapeLayout } from './useCytoscapeLayout'\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  const defaultLayout = useCytoscapeLayout()\n\n  const options = useMemo<CytoscapeOptions>(\n    () => ({\n      elements,\n      layout: layout ?? defaultLayout,\n      style: style ?? defaultStyle,\n    }),\n    [defaultLayout, defaultStyle, elements, layout, style],\n  )\n\n  return options\n}\n","import { CytoscapeOptions } from 'cytoscape'\nimport { useMemo } from 'react'\n\nexport const useCytoscapeLayout = () => {\n  const layout: CytoscapeOptions['layout'] = useMemo(\n    () => ({\n      minNodeSpacing: 75,\n      name: 'concentric',\n    }),\n    [],\n  )\n\n  return layout\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 = () => {\n  const theme = useTheme()\n  const icons = useIcons()\n\n  const style: CytoscapeOptions['style'] = useMemo(\n    () => [\n      NodeIdStyles(theme.palette.text.primary),\n      NodeStyled(icons, theme.palette.primary.main),\n      EdgeStyled(theme.palette.divider, theme.palette.divider),\n    ],\n    [icons, theme.palette.divider, theme.palette.primary.main, theme.palette.text.primary],\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 { Button, 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 NodeRelationalGraph = 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        {actions}\n        <Button size={'small'} variant={'contained'} onClick={handleReset}>\n          Reset\n        </Button>\n      </ActionsContainer>\n      <FlexCol alignItems=\"stretch\" height=\"100%\" position=\"absolute\" ref={sharedRef} width=\"100%\"></FlexCol>\n    </FlexCol>\n  )\n})\n\nNodeRelationalGraph.displayName = 'NodeRelationalGraph'\n\nconst ActionsContainer = styled(FlexRow, { name: 'ActionsContainer' })(() => ({\n  flexWrap: 'wrap',\n  position: 'absolute',\n  right: '10px',\n  top: '10px',\n  zIndex: 2,\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"],"mappings":"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","names":["module","Inventory2RoundedIcon","InsertLinkRoundedIcon","BubbleChartRoundedIcon","QuestionMarkRoundedIcon","HubIcon","TimerRoundedIcon","VisibilityRoundedIcon","import_react","import_react","import_material","import_react","import_react","import_jsx_runtime","import_material","import_react_shared","import_react","import_react_shared","import_jsx_runtime","cytoscape","import_jsx_runtime"]}