@cccsaurora/clue-ui 0.15.0-dev.31 → 0.15.0

package/components/display/graph/visualizations/tree/BundleLine.js

@@ -1,121 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useTheme } from "@mui/material";
-import { d as d3, S as Spectral } from "../../../../../index-DJYqRcxJ.js";
-import { useMyLocalStorageItem } from "../../../../../hooks/useMyLocalStorage.js";
-import { StorageKey } from "../../../../../utils/constants.js";
-import { buildHorizontalLine, buildVerticalLine } from "../../../../../utils/line.js";
-import { i as isNil } from "../../../../../isNil-CIubwp4T.js";
-import { useMemo } from "react";
-import { cyrb53 } from "../../../../../utils/graph.js";
-const BundleLine = ({
-  bundle,
-  linesByLevel,
-  paddingByLevel,
-  maxArcRadius,
-  lineWidth,
-  linePaddingX,
-  linePaddingY,
-  highlightedPath,
-  nodeLocations,
-  inputsByNode,
-  outputsByNode,
-  lineDirection,
-  colorTheme
-}) => {
-  const theme = useTheme();
-  const [colorSetting] = useMyLocalStorageItem(StorageKey.COLOR_SCHEME, "Spectral");
-  const [forceColorSetting] = useMyLocalStorageItem(StorageKey.FORCE_COLOR_SETTING, "Spectral");
-  const colorScheme = useMemo(
-    () => forceColorSetting ? colorSetting : colorTheme || colorSetting,
-    [colorSetting, colorTheme, forceColorSetting]
-  );
-  const color = useMemo(
-    () => (d3[`interpolate${colorScheme}`] ?? Spectral)(cyrb53(JSON.stringify(bundle))),
-    [bundle, colorScheme]
-  );
-  const opacities = useMemo(
-    () => (_bundle) => highlightedPath.size === 0 || _bundle.sources.some((source) => highlightedPath.has(source.id)) && _bundle.destinations.some((destination) => highlightedPath.has(destination.id)) ? 1 : 0.2,
-    [highlightedPath]
-  );
-  const arrows = [];
-  const d = bundle.sources.flatMap((source) => {
-    const result = bundle.destinations.flatMap((dest) => {
-      var _a, _b;
-      linesByLevel[dest.level].delete(bundle.id);
-      const [parentX, rawParentY] = nodeLocations[source.id];
-      const parentY = rawParentY + (((_a = outputsByNode[source.id]) == null ? void 0 : _a.size) ?? 0) * linePaddingY;
-      const [childX, rawChildY, childHeight] = nodeLocations[dest.id];
-      const childY = rawChildY + (((_b = inputsByNode[dest.id]) == null ? void 0 : _b.size) ?? 0 + +(source.id === dest.id)) * linePaddingY;
-      const distanceX = childX - parentX;
-      const distanceY = childY - parentY;
-      const arcRadius = Math.min(Math.abs(distanceY / 3), maxArcRadius);
-      if (lineDirection === "horizontal") {
-        return buildHorizontalLine({
-          paddingAtLevel: paddingByLevel[dest.level],
-          numLines: linesByLevel[dest.level].size,
-          nodeLocations,
-          dest,
-          distanceX,
-          distanceY,
-          childX,
-          childY,
-          childHeight,
-          parentX,
-          parentY,
-          linePaddingX,
-          arcRadius
-        });
-      } else {
-        return buildVerticalLine({
-          paddingAtLevel: paddingByLevel[dest.level],
-          numLines: linesByLevel[dest.level].size,
-          distanceX,
-          distanceY,
-          childX,
-          childY,
-          childHeight,
-          parentX,
-          parentY,
-          linePaddingX,
-          arcRadius
-        });
-      }
-    });
-    return result;
-  }).join("\n");
-  bundle.destinations.forEach((dest) => {
-    if (isNil(inputsByNode[dest.id])) {
-      inputsByNode[dest.id] = /* @__PURE__ */ new Set();
-    }
-    inputsByNode[dest.id].add(bundle.id);
-  });
-  bundle.sources.forEach((source) => {
-    if (isNil(outputsByNode[source.id])) {
-      outputsByNode[source.id] = /* @__PURE__ */ new Set();
-    }
-    outputsByNode[source.id].add(bundle.id);
-  });
-  return /* @__PURE__ */ jsxs("g", { className: "path", style: { opacity: opacities(bundle) }, children: [
-    /* @__PURE__ */ jsx(
-      "path",
-      {
-        d,
-        style: { fill: "none", stroke: theme.palette.background.paper, strokeWidth: lineWidth + 3 }
-      },
-      bundle.id + "-bg"
-    ),
-    /* @__PURE__ */ jsx(
-      "path",
-      {
-        d,
-        strokeWidth: lineWidth,
-        style: { fill: "none", stroke: color, strokeWidth: lineWidth }
-      },
-      bundle.id + "-fg"
-    ),
-    arrows
-  ] }, bundle.id);
-};
-export {
-  BundleLine as default
-};

package/components/display/graph/visualizations/tree/Triangle.d.ts

@@ -1,9 +0,0 @@
-import { FC } from 'react';
-
-declare const Triangle: FC<{
-    x: number;
-    y: number;
-    fill: string;
-    lineWidth: number;
-}>;
-export default Triangle;

package/components/display/graph/visualizations/tree/Triangle.js

@@ -1,26 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useTheme } from "@mui/material";
-const Triangle = ({ x, y, fill, lineWidth }) => {
-  const theme = useTheme();
-  return /* @__PURE__ */ jsxs("g", { className: "arrow", children: [
-    /* @__PURE__ */ jsx(
-      "polygon",
-      {
-        points: `${x},${y - 1.5 * lineWidth} ${x - 2 * lineWidth},${y + 1.5 * lineWidth} ${x + 2 * lineWidth},${y + 1.5 * lineWidth}`,
-        style: { fill },
-        stroke: theme.palette.background.paper,
-        strokeWidth: 2
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "polygon",
-      {
-        points: `${x - lineWidth / 2},${y - 2 * lineWidth} ${x + lineWidth / 2},${y - 2 * lineWidth} ${x + lineWidth / 2},${y + 2 * lineWidth} ${x - lineWidth / 2},${y + 2 * lineWidth}`,
-        style: { fill }
-      }
-    )
-  ] });
-};
-export {
-  Triangle as default
-};

package/components/display/graph/visualizations/tree/index.d.ts

@@ -1,36 +0,0 @@
-import { NestedDataset, ZoomField } from "../../../../../types/graph";
-import { MutableRefObject } from 'react';
-
-interface TreeOptions {
-    textColor: string;
-    nodeColor: {
-        border: string;
-        center: string;
-    };
-    letterSize: number;
-    letterWidth: number;
-    xSpacing: number;
-    ySpacing: number;
-    nodeRadius: number;
-    maxArcRadius: number;
-    linePaddingX: number;
-    linePaddingY: number;
-    lineWidth: number;
-    enableEntryPadding: boolean;
-    truncateLabels: boolean;
-    enableTimestamps: boolean;
-    rowStep: number;
-    belowPrevious: boolean;
-    iconOrientation: 'horizontal' | 'vertical';
-    lineDirection: 'horizontal' | 'vertical';
-    colorTheme?: string;
-}
-declare const _default: import('react').NamedExoticComponent<{
-    svgRef?: MutableRefObject<SVGSVGElement>;
-    graph: NestedDataset;
-    labelKeys: ZoomField[];
-    onNodeSelectionChanged: (nodeIds: string[]) => void;
-    options?: Partial<TreeOptions>;
-    zoom: d3.ZoomTransform;
-}>;
-export default _default;

package/components/display/graph/visualizations/tree/index.js

@@ -1,485 +0,0 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { useTheme, colors, Box } from "@mui/material";
-import useComparator from "../../../../../hooks/useComparator.js";
-import useMyHighlights from "../../../../../hooks/useMyHighlights.js";
-import { useMyLocalStorageItem } from "../../../../../hooks/useMyLocalStorage.js";
-import { StorageKey, BUNDLE_SEPARATOR } from "../../../../../utils/constants.js";
-import { c as cloneDeep } from "../../../../../cloneDeep-CjP5k9zW.js";
-import { g as get } from "../../../../../get-D3C3lEU3.js";
-import { i as isNil } from "../../../../../isNil-CIubwp4T.js";
-import { b as baseExtremum, a as baseGt, i as isIterateeCall } from "../../../../../_baseExtremum-B1o1zHjR.js";
-import { i as identity } from "../../../../../identity-CPGTqrE4.js";
-import { t as toFinite } from "../../../../../toFinite-CArjry_l.js";
-import { b as baseSum } from "../../../../../_baseSum-D0WC1dN0.js";
-import { memo, useMemo } from "react";
-import NodeCard from "../../elements/NodeCard.js";
-import getIcon from "../icons/index.js";
-import Leaf from "../Leaf.js";
-import BundleLine from "./BundleLine.js";
-function max(array) {
-  return array && array.length ? baseExtremum(array, identity, baseGt) : void 0;
-}
-var nativeCeil = Math.ceil, nativeMax = Math.max;
-function baseRange(start, end, step, fromRight) {
-  var index = -1, length = nativeMax(nativeCeil((end - start) / (step || 1)), 0), result = Array(length);
-  while (length--) {
-    result[++index] = start;
-    start += step;
-  }
-  return result;
-}
-function createRange(fromRight) {
-  return function(start, end, step) {
-    if (step && typeof step != "number" && isIterateeCall(start, end, step)) {
-      end = step = void 0;
-    }
-    start = toFinite(start);
-    if (end === void 0) {
-      end = start;
-      start = 0;
-    } else {
-      end = toFinite(end);
-    }
-    step = step === void 0 ? start < end ? 1 : -1 : toFinite(step);
-    return baseRange(start, end, step);
-  };
-}
-var range = createRange();
-function sum(array) {
-  return array && array.length ? baseSum(array, identity) : 0;
-}
-const DEFAULT_OPTIONS = {
-  textColor: "white",
-  nodeColor: {
-    border: "grey",
-    center: "white"
-  },
-  letterSize: 10,
-  letterWidth: 6.5,
-  xSpacing: 8,
-  ySpacing: 20,
-  nodeRadius: 6,
-  maxArcRadius: 8,
-  linePaddingX: 10,
-  linePaddingY: 10,
-  lineWidth: 3,
-  enableEntryPadding: true,
-  truncateLabels: true,
-  enableTimestamps: true,
-  iconOrientation: "vertical",
-  lineDirection: "horizontal",
-  rowStep: null,
-  // We'll make this dynamic
-  belowPrevious: false
-};
-DEFAULT_OPTIONS.rowStep = DEFAULT_OPTIONS.ySpacing * 2;
-const Tree = ({ svgRef, graph, labelKeys, onNodeSelectionChanged, zoom, options = {} }) => {
-  var _a, _b, _c;
-  const combinedOptions = useMemo(
-    () => {
-      var _a2, _b2;
-      return {
-        ...DEFAULT_OPTIONS,
-        ...options,
-        ...((_b2 = (_a2 = graph == null ? void 0 : graph.metadata.display) == null ? void 0 : _a2.visualization) == null ? void 0 : _b2.config) ?? {}
-      };
-    },
-    [(_b = (_a = graph == null ? void 0 : graph.metadata.display) == null ? void 0 : _a.visualization) == null ? void 0 : _b.config, options]
-  );
-  const {
-    xSpacing: baseXSpacing,
-    ySpacing: baseYSpacing,
-    linePaddingX: baseLinePaddingX,
-    linePaddingY: baseLinePaddingY
-  } = combinedOptions;
-  const { runComparators, runComparator } = useComparator();
-  const { onNodeHoveredChanged, onNodeClicked, nodeOpacities, highlightedPath, highlightedNodes, hoveredNode } = useMyHighlights(graph, (nodeIds) => onNodeSelectionChanged(nodeIds));
-  const theme = useTheme();
-  const isDark = useMemo(() => theme.palette.mode === "dark", [theme]);
-  const [showCardsSettings] = useMyLocalStorageItem(StorageKey.SHOW_CARDS, false);
-  const [cardCutoff] = useMyLocalStorageItem(StorageKey.CARD_CUTOFF, 2.5);
-  const showCards = useMemo(() => zoom.k > cardCutoff && showCardsSettings, [cardCutoff, showCardsSettings, zoom.k]);
-  const levels = useMemo(
-    () => graph.data.map(
-      (level, levelIndex) => level.map((node) => ({
-        ...node,
-        parents: node == null ? void 0 : node.edges,
-        level: levelIndex
-      }))
-    ),
-    [graph.data]
-  );
-  const flatNodes = useMemo(() => levels.flat(), [levels]);
-  const [xSpacing, linePaddingX, ySpacing, linePaddingY] = useMemo(() => {
-    const baseValues = [
-      [baseXSpacing, baseLinePaddingX],
-      [baseYSpacing, baseLinePaddingY]
-    ];
-    if (zoom.k > 1 && showCardsSettings) {
-      return baseValues.flatMap(
-        (arr, index) => arr.map((_v) => _v * Math.pow(2.5 - index * 1.25, Math.min(zoom.k, 2.5) - 1))
-      );
-    } else {
-      return baseValues.flat();
-    }
-  }, [baseLinePaddingX, baseLinePaddingY, baseXSpacing, baseYSpacing, showCardsSettings, zoom.k]);
-  let portBounds;
-  if (!graph || !svgRef.current) {
-    portBounds = [
-      [0, 0],
-      [0, 0]
-    ];
-  } else {
-    const data = svgRef.current.getBoundingClientRect();
-    portBounds = [zoom.invert([0, 0]), zoom.invert([data.width, data.height])];
-  }
-  const bundles = useMemo(() => {
-    const bundlesDict = {};
-    flatNodes.forEach((node) => {
-      if (!node.parents) {
-        return;
-      }
-      const bundleId = node.parents.join(BUNDLE_SEPARATOR);
-      if (bundlesDict[bundleId]) {
-        bundlesDict[bundleId].destinations.push(node);
-      } else {
-        bundlesDict[bundleId] = {
-          id: bundleId,
-          sources: node.parents.map((parent) => flatNodes.find((_node) => _node.id === parent)),
-          destinations: [node]
-        };
-      }
-    });
-    return Object.values(bundlesDict);
-  }, [flatNodes]);
-  const layoutData = useMemo(() => {
-    const {
-      letterSize,
-      letterWidth,
-      enableEntryPadding,
-      truncateLabels,
-      rowStep,
-      belowPrevious
-    } = combinedOptions;
-    let currentX = 0;
-    let currentY = 0;
-    const nodeLocations = {};
-    const linesByLevel = {};
-    const paddingByLevel = {};
-    const inputs = {};
-    const outputs = {};
-    levels.forEach((level, levelIndex) => {
-      let longestLabel = 0;
-      level.forEach((node) => {
-        var _a2;
-        const validKeys = labelKeys == null ? void 0 : labelKeys.filter((_comparator) => runComparator(_comparator, node));
-        const labelKey = (_a2 = validKeys == null ? void 0 : validKeys.pop()) == null ? void 0 : _a2.label;
-        const labelRows = (labelKey == null ? void 0 : labelKey.split(",").map((key) => get(node, key)).filter((val) => !!val)) ?? [];
-        if (labelRows.length < 1) {
-          node.id.split("\n").forEach((line) => labelRows.push(line));
-        }
-        const labelHeight = labelRows.length * letterSize;
-        currentY += labelHeight;
-        nodeLocations[node.id] = [+currentX, +currentY, -linePaddingY];
-        currentY += ySpacing;
-        if (enableEntryPadding) {
-          longestLabel = Math.max(longestLabel, max((labelRows == null ? void 0 : labelRows.map((row) => row.toString().length)) ?? [node.id.length]));
-        }
-      });
-      currentX += xSpacing + (!truncateLabels ? longestLabel : Math.min(longestLabel, 44)) * letterWidth;
-      if (!belowPrevious) {
-        currentY = (levelIndex + 1) * rowStep;
-      } else {
-        currentY += rowStep;
-      }
-    });
-    bundles.forEach((bundle) => {
-      bundle.sources.forEach((source) => {
-        if (!outputs[source.id]) {
-          outputs[source.id] = /* @__PURE__ */ new Set();
-        }
-        outputs[source.id].add(bundle.id);
-      });
-      bundle.destinations.forEach((dest) => {
-        if (isNil(linesByLevel[dest.level])) {
-          linesByLevel[dest.level] = /* @__PURE__ */ new Set();
-        }
-        if (!inputs[dest.id]) {
-          inputs[dest.id] = /* @__PURE__ */ new Set();
-        }
-        linesByLevel[dest.level].add(bundle.id);
-        inputs[dest.id].add(bundle.id);
-      });
-    });
-    Object.entries(linesByLevel).forEach(([level, lines]) => paddingByLevel[level] = lines.size);
-    levels.forEach((level, levelIndex) => {
-      const indexesSoFar = range(levelIndex + 1);
-      const paddingArray = indexesSoFar.map((_levelIndex) => paddingByLevel[_levelIndex] ?? 0);
-      const totalPadding = sum(paddingArray) * linePaddingX;
-      level.forEach((node) => {
-        nodeLocations[node.id][0] += totalPadding;
-      });
-    });
-    flatNodes.forEach((node) => {
-      var _a2, _b2, _c2;
-      let maxHeight = max([((_a2 = inputs[node.id]) == null ? void 0 : _a2.size) - 1, ((_b2 = outputs[node.id]) == null ? void 0 : _b2.size) - 1, 0]) * linePaddingY;
-      if ((_c2 = inputs[node.id]) == null ? void 0 : _c2.has(node.id)) {
-        maxHeight += linePaddingY;
-      }
-      nodeLocations[node.id][2] = maxHeight;
-      const levelIndex = levels[node.level].findIndex((_node) => _node.id === node.id);
-      levels[node.level].filter((__, index) => levelIndex < index).forEach((_node) => {
-        nodeLocations[_node.id][1] += maxHeight;
-      });
-    });
-    return {
-      nodeLocations,
-      linesByLevel,
-      paddingByLevel
-    };
-  }, [
-    bundles,
-    combinedOptions,
-    flatNodes,
-    labelKeys,
-    levels,
-    linePaddingX,
-    linePaddingY,
-    runComparator,
-    xSpacing,
-    ySpacing
-  ]);
-  const [timestamps, bundleElements, nodes] = useMemo(() => {
-    const {
-      textColor,
-      letterSize,
-      letterWidth,
-      nodeRadius,
-      nodeColor,
-      maxArcRadius,
-      lineWidth,
-      truncateLabels,
-      enableTimestamps,
-      belowPrevious,
-      iconOrientation,
-      lineDirection,
-      colorTheme
-    } = combinedOptions;
-    const { nodeLocations, linesByLevel, paddingByLevel } = layoutData;
-    const _nodes = [];
-    const _timestamps = [];
-    flatNodes.forEach((node) => {
-      var _a2, _b2, _c2, _d;
-      const [x, y, _height] = nodeLocations[node.id];
-      const labelKey = ((_a2 = labelKeys == null ? void 0 : labelKeys.filter((_comparator) => runComparator(_comparator, node)).pop()) == null ? void 0 : _a2.label) ?? "id";
-      let label = labelKey == null ? void 0 : labelKey.split(",").map((key) => {
-        let labelSection = get(node, key);
-        if (labelSection && truncateLabels && labelSection.length > 44) {
-          labelSection = labelSection.replace(/^(.{32}).+$/, "$1 (TRUNCATED)");
-        }
-        return labelSection;
-      }).filter((section) => !!section).join("\n");
-      if (!label) {
-        if (node.id.length > 44) {
-          label = node.id.replace(/^(.{32}).+$/, "$1 (TRUNCATED)");
-        } else {
-          label = node.id;
-        }
-      }
-      if (belowPrevious && enableTimestamps && (node.timestamp || node.annotation)) {
-        _timestamps.push(
-          /* @__PURE__ */ jsxs(
-            "g",
-            {
-              style: {
-                cursor: "default",
-                fontFamily: '"Lucida Console", monospace',
-                fontSize: letterSize * 0.75 + "px"
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "text",
-                  {
-                    x: portBounds[0][0] + xSpacing,
-                    y: y + (_height + nodeRadius) / 2,
-                    fill: theme.palette.getContrastText(theme.palette.background.paper),
-                    style: {
-                      fillOpacity: nodeOpacities(node.id) / 2,
-                      transition: theme.transitions.create(["fill-opacity"], {
-                        duration: theme.transitions.duration.short
-                      })
-                    },
-                    children: node.timestamp
-                  }
-                ),
-                node.annotation && node.annotation.split("\n").map((line, index) => {
-                  var _a3;
-                  return /* @__PURE__ */ jsx(
-                    "text",
-                    {
-                      x: portBounds[0][0] + (((_a3 = node.timestamp) == null ? void 0 : _a3.length) ?? 0) * letterWidth,
-                      y: y + (_height + nodeRadius) / 2 + index * letterSize,
-                      fill: isDark ? colors.orange[300] : colors.blue[900],
-                      style: {
-                        fillOpacity: nodeOpacities(node.id),
-                        transition: theme.transitions.create(["fill-opacity"], {
-                          duration: theme.transitions.duration.short
-                        })
-                      },
-                      children: line
-                    },
-                    line
-                  );
-                })
-              ]
-            },
-            node.id + "-timestamp"
-          )
-        );
-      }
-      if (!showCards) {
-        const style = runComparators(
-          (_c2 = (_b2 = graph.metadata.display) == null ? void 0 : _b2.styles) == null ? void 0 : _c2.filter((comparator) => comparator.type === "node"),
-          node
-        );
-        const nodeOpacity = nodeOpacities(node.id);
-        const icons = (_d = node.icons) == null ? void 0 : _d.map((icon) => [icon, getIcon(icon)]).filter(([__, icon]) => !!icon).map(([icon, Icon], index) => /* @__PURE__ */ jsx(
-          Icon,
-          {
-            x: x - nodeRadius * 3 * (iconOrientation === "horizontal" ? index + 1 : 0),
-            y: y - nodeRadius * 3 * (iconOrientation === "vertical" ? index + 1 : 0),
-            size: letterSize * 1.5,
-            style: {
-              fillOpacity: nodeOpacity
-            },
-            circleStyle: {
-              fillOpacity: nodeOpacity
-            }
-          },
-          icon
-        ));
-        _nodes.push(
-          /* @__PURE__ */ jsx(
-            Leaf,
-            {
-              alwaysShowText: true,
-              nodeId: node.id,
-              label,
-              height: _height,
-              x,
-              y,
-              style,
-              nodeRadius,
-              nodeColor,
-              nodeOpacity,
-              letterSize,
-              letterWidth,
-              textColor,
-              selected: highlightedNodes.has(node.id),
-              onHoverChanged: onNodeHoveredChanged,
-              onClick: onNodeClicked,
-              children: icons
-            },
-            node.id
-          )
-        );
-      }
-    });
-    const readonlyNodeLocations = cloneDeep(nodeLocations);
-    const outputsByNode = {};
-    const inputsByNode = {};
-    const _bundleElements = bundles.map((bundle) => {
-      return /* @__PURE__ */ jsx(
-        BundleLine,
-        {
-          lineDirection,
-          linesByLevel,
-          paddingByLevel,
-          nodeLocations: readonlyNodeLocations,
-          outputsByNode,
-          inputsByNode,
-          bundle,
-          maxArcRadius,
-          lineWidth,
-          linePaddingX,
-          linePaddingY,
-          highlightedPath,
-          colorTheme
-        },
-        bundle.id
-      );
-    });
-    return [_timestamps, _bundleElements, _nodes];
-  }, [
-    bundles,
-    combinedOptions,
-    (_c = graph.metadata.display) == null ? void 0 : _c.styles,
-    flatNodes,
-    highlightedNodes,
-    highlightedPath,
-    isDark,
-    labelKeys,
-    layoutData,
-    linePaddingX,
-    linePaddingY,
-    nodeOpacities,
-    onNodeClicked,
-    onNodeHoveredChanged,
-    portBounds,
-    runComparator,
-    runComparators,
-    showCards,
-    theme.palette,
-    theme.transitions,
-    xSpacing
-  ]);
-  const cards = useMemo(() => {
-    const { nodeRadius, lineWidth } = combinedOptions;
-    const { nodeLocations } = layoutData;
-    return flatNodes.filter((node) => showCards || hoveredNode === node.id).map((node) => {
-      const [x, y] = nodeLocations[node.id];
-      return /* @__PURE__ */ jsx(
-        Box,
-        {
-          onMouseOver: () => onNodeHoveredChanged(node.id, true),
-          onMouseLeave: () => setTimeout(() => onNodeHoveredChanged(node.id, false), 100),
-          sx: {
-            position: "absolute",
-            left: zoom.k * x + zoom.x,
-            top: zoom.k * y + zoom.y,
-            transform: `translateX(-${nodeRadius * 2}px) translateY(${lineWidth}px)`,
-            backgroundColor: theme.palette.background.paper,
-            maxWidth: "450px",
-            maxHeight: "500px",
-            overflow: "auto"
-          },
-          children: /* @__PURE__ */ jsx(NodeCard, { node })
-        },
-        node.id
-      );
-    });
-  }, [
-    combinedOptions,
-    flatNodes,
-    hoveredNode,
-    layoutData,
-    onNodeHoveredChanged,
-    showCards,
-    theme.palette.background.paper,
-    zoom.k,
-    zoom.x,
-    zoom.y
-  ]);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("svg", { id: "viz", ref: svgRef, children: /* @__PURE__ */ jsxs("g", { id: "view", children: [
-      timestamps,
-      bundleElements,
-      nodes
-    ] }) }),
-    cards
-  ] });
-};
-const Tree$1 = memo(Tree);
-export {
-  Tree$1 as default
-};

package/components/display/graph/visualizations/tree/types.d.ts

@@ -1,11 +0,0 @@
-import { RawEntry } from "../../../../../types/graph";
-
-export interface Node extends RawEntry {
-    level: number;
-    parents: string[];
-}
-export interface Bundle {
-    id: string;
-    sources: Node[];
-    destinations: Node[];
-}

package/components/display/graph/visualizations/tree/types.js

@@ -1 +0,0 @@
-