@opentrace/components 0.1.1-rc.11 → 0.1.1-rc.30

package/dist/{useHighlights-D6Jl6Woe.cjs → useHighlights-fRWg-A_c.cjs}

@@ -4614,37 +4614,38 @@ function requireIsGraph() {
   };
   return isGraph;
 }
-const PALETTE$1 = [
-  "#6366f1",
+const PALETTE_SIZE$1 = 12;
+const FALLBACK_PALETTE$1 = [
+  "#818cf8",
   // Indigo
-  "#f59e0b",
+  "#fbbf24",
   // Amber
-  "#10b981",
-  // Emerald
-  "#8b5cf6",
+  "#4ade80",
+  // Green
+  "#c084fc",
   // Violet
-  "#ef4444",
-  // Red
-  "#3b82f6",
+  "#fb7185",
+  // Rose
+  "#60a5fa",
   // Blue
-  "#ec4899",
+  "#f472b6",
   // Pink
-  "#14b8a6",
+  "#2dd4bf",
   // Teal
-  "#f97316",
+  "#fb923c",
   // Orange
-  "#84cc16",
+  "#a3e635",
   // Lime
-  "#a855f7",
-  // Purple
-  "#06b6d4"
+  "#e879f9",
+  // Fuchsia
+  "#22d3ee"
   // Cyan
 ];
-const KNOWN$1 = {
-  Repository: "#10b981",
-  Class: "#3b82f6",
-  Function: "#a855f7",
-  File: "#84cc16",
+const FALLBACK_KNOWN$1 = {
+  Repository: "#4ade80",
+  Class: "#60a5fa",
+  Function: "#c084fc",
+  File: "#a3e635",
   Directory: "#22d3ee"
 };
 function djb2$1(str) {
@@ -4654,60 +4655,77 @@ function djb2$1(str) {
   }
   return Math.abs(h);
 }
+let cache$1 = null;
+function resolveColors$1() {
+  if (typeof document === "undefined") {
+    return {
+      themeKey: "__fallback__",
+      known: new Map(Object.entries(FALLBACK_KNOWN$1)),
+      palette: FALLBACK_PALETTE$1
+    };
+  }
+  const root = document.documentElement;
+  const themeKey = `${root.dataset.theme ?? ""}_${root.dataset.mode ?? ""}`;
+  if (cache$1 && cache$1.themeKey === themeKey) return cache$1;
+  const style = getComputedStyle(root);
+  const known = /* @__PURE__ */ new Map();
+  for (const [type, fallback] of Object.entries(FALLBACK_KNOWN$1)) {
+    const varName = `--graph-node-${type.toLowerCase()}`;
+    const val = style.getPropertyValue(varName).trim();
+    known.set(type, val || fallback);
+  }
+  const palette = [];
+  for (let i = 0; i < PALETTE_SIZE$1; i++) {
+    const val = style.getPropertyValue(`--graph-node-palette-${i}`).trim();
+    palette.push(val || FALLBACK_PALETTE$1[i]);
+  }
+  cache$1 = { themeKey, known, palette };
+  return cache$1;
+}
 function getNodeColor(type) {
-  return KNOWN$1[type] ?? PALETTE$1[djb2$1(type) % PALETTE$1.length];
+  const { known, palette } = resolveColors$1();
+  return known.get(type) ?? palette[djb2$1(type) % palette.length];
 }
-const PALETTE = [
-  "#f472b6",
+const PALETTE_SIZE = 12;
+const FALLBACK_PALETTE = [
+  "#f9a8d4",
   // Pink
-  "#60a5fa",
+  "#93c5fd",
   // Blue
-  "#34d399",
+  "#6ee7b7",
   // Emerald
-  "#fbbf24",
+  "#fde68a",
   // Amber
-  "#a78bfa",
+  "#c4b5fd",
   // Violet
-  "#fb923c",
+  "#fdba74",
   // Orange
-  "#2dd4bf",
+  "#5eead4",
   // Teal
-  "#f87171",
+  "#fca5a5",
   // Red
-  "#38bdf8",
+  "#7dd3fc",
   // Sky
-  "#a3e635",
+  "#bef264",
   // Lime
-  "#c084fc",
+  "#d8b4fe",
   // Purple
-  "#22d3ee"
+  "#67e8f9"
   // Cyan
 ];
-const KNOWN = {
-  CALLS: "#60a5fa",
-  // Blue — invocation / dependency chains
-  READS: "#fbbf24",
-  // Amber — data access
-  WRITES: "#fb923c",
-  // Orange — data mutation
-  DEFINED_IN: "#34d399",
-  // Emerald — containment / location
-  PART_OF: "#2dd4bf",
-  // Teal — structural membership
-  DEPENDS_ON: "#f472b6",
-  // Pink — dependency edges
-  EXTENDS: "#a78bfa",
-  // Violet — inheritance
-  HANDLES: "#38bdf8",
-  // Sky — endpoint handling
-  IMPORTS: "#c084fc",
-  // Purple — module imports
-  AUTHORED: "#f87171",
-  // Red — authorship
-  ASSIGNED: "#22d3ee",
-  // Cyan — assignment
-  PARTICIPATED: "#a3e635"
-  // Lime — participation
+const FALLBACK_KNOWN = {
+  CALLS: { varSuffix: "calls", color: "#93c5fd" },
+  READS: { varSuffix: "reads", color: "#fde68a" },
+  WRITES: { varSuffix: "writes", color: "#fdba74" },
+  DEFINED_IN: { varSuffix: "defined-in", color: "#6ee7b7" },
+  PART_OF: { varSuffix: "part-of", color: "#5eead4" },
+  DEPENDS_ON: { varSuffix: "depends-on", color: "#f9a8d4" },
+  EXTENDS: { varSuffix: "extends", color: "#c4b5fd" },
+  HANDLES: { varSuffix: "handles", color: "#7dd3fc" },
+  IMPORTS: { varSuffix: "imports", color: "#d8b4fe" },
+  AUTHORED: { varSuffix: "authored", color: "#fca5a5" },
+  ASSIGNED: { varSuffix: "assigned", color: "#67e8f9" },
+  PARTICIPATED: { varSuffix: "participated", color: "#bef264" }
 };
 function djb2(str) {
   let h = 5381;
@@ -4716,9 +4734,36 @@ function djb2(str) {
   }
   return Math.abs(h);
 }
+let cache = null;
+function resolveColors() {
+  if (typeof document === "undefined") {
+    const known2 = /* @__PURE__ */ new Map();
+    for (const [key, { color }] of Object.entries(FALLBACK_KNOWN)) {
+      known2.set(key, color);
+    }
+    return { themeKey: "__fallback__", known: known2, palette: FALLBACK_PALETTE };
+  }
+  const root = document.documentElement;
+  const themeKey = `${root.dataset.theme ?? ""}_${root.dataset.mode ?? ""}`;
+  if (cache && cache.themeKey === themeKey) return cache;
+  const style = getComputedStyle(root);
+  const known = /* @__PURE__ */ new Map();
+  for (const [key, { varSuffix, color }] of Object.entries(FALLBACK_KNOWN)) {
+    const val = style.getPropertyValue(`--graph-edge-${varSuffix}`).trim();
+    known.set(key, val || color);
+  }
+  const palette = [];
+  for (let i = 0; i < PALETTE_SIZE; i++) {
+    const val = style.getPropertyValue(`--graph-edge-palette-${i}`).trim();
+    palette.push(val || FALLBACK_PALETTE[i]);
+  }
+  cache = { themeKey, known, palette };
+  return cache;
+}
 function getLinkColor(type) {
   const upper = type.toUpperCase();
-  return KNOWN[upper] ?? PALETTE[djb2(upper) % PALETTE.length];
+  const { known, palette } = resolveColors();
+  return known.get(upper) ?? palette[djb2(upper) % palette.length];
 }
 const COMMUNITY_PALETTE = [
   "#f472b6",
@@ -4936,19 +4981,22 @@ function useGraphFilters(graph, layoutReady, filterState, communityAssignments,
       attrs.hidden = hidden;
       return attrs;
     });
-    graph.updateEachEdgeAttributes((_id, attrs, source, target) => {
-      if (hiddenNodes.has(source) || hiddenNodes.has(target)) {
-        attrs.hidden = true;
-        return attrs;
-      }
-      const label = attrs.label;
-      if (label && filterState.hiddenLinkTypes.has(label)) {
-        attrs.hidden = true;
+    graph.updateEachEdgeAttributes(
+      (_id, attrs, source, target) => {
+        if (hiddenNodes.has(source) || hiddenNodes.has(target)) {
+          attrs.hidden = true;
+          return attrs;
+        }
+        const label = attrs.label;
+        if (label && filterState.hiddenLinkTypes.has(label)) {
+          attrs.hidden = true;
+          return attrs;
+        }
+        attrs.hidden = false;
         return attrs;
-      }
-      attrs.hidden = false;
-      return attrs;
-    });
+      },
+      { attributes: ["type"] }
+    );
   }, [
     graph,
     layoutReady,
@@ -6688,4 +6736,4 @@ exports.shouldHideNode = shouldHideNode;
 exports.useCommunities = useCommunities;
 exports.useGraphFilters = useGraphFilters;
 exports.useHighlights = useHighlights;
-//# sourceMappingURL=useHighlights-D6Jl6Woe.cjs.map
+//# sourceMappingURL=useHighlights-fRWg-A_c.cjs.map