@empoweredvote/ev-ui 0.8.6 → 0.8.8

package/dist/index.mjs

@@ -20,7 +20,11 @@ function RadarChartCore({
   writeIns = {},
   darkMode = false,
   lineColor,
-  ringColor
+  ringColor,
+  // replacedSpokes: short_titles of substitute spokes (not the user's original defaults)
+  replacedSpokes = {},
+  // boldOriginalSpokes: when true, bold spokes that are NOT replacements
+  boldOriginalSpokes = false
 }) {
   var _a;
   const radius = size / 2 - 40;
@@ -201,6 +205,8 @@ function RadarChartCore({
       if (isTop && lines.length > 1) labelY -= (lines.length - 1) * lineHeight;
       const isActive = shortTitle === activeSpoke;
       const isUnansweredLabel = !!unansweredSpokes[shortTitle];
+      const isReplaced = !!replacedSpokes[shortTitle];
+      const shouldBold = boldOriginalSpokes && !isReplaced;
       const fSize = labelFontSize;
       return /* @__PURE__ */ React.createElement(
         "text",
@@ -212,7 +218,7 @@ function RadarChartCore({
           dominantBaseline: isBottom ? "hanging" : "auto",
           onClick: () => onReplaceTopic(shortTitle),
           fill: isActive ? "#E85D26" : isUnansweredLabel ? "#9ca3af" : darkMode ? "#D3D7DE" : "#555",
-          fontWeight: isActive ? "bold" : "normal",
+          fontWeight: isActive || shouldBold ? "bold" : "normal",
           style: { cursor: "pointer", userSelect: "none", fontSize: fSize, fontFamily: "sans-serif" }
         },
         isUnansweredLabel && /* @__PURE__ */ React.createElement("title", null, "No stance on file for this topic."),
@@ -250,9 +256,7 @@ function RadarChartCore({
           fill: matches ? "#fed12e" : "#7C6B9E",
           stroke: "#FFFFFF",
           strokeWidth: 3,
-          style: { cursor: "default" },
-          onMouseEnter: () => setTooltip({ x: cx, y: cy, text: getStanceText(shortTitle, userVal) }),
-          onMouseLeave: () => setTooltip(null)
+          style: { pointerEvents: "none" }
         }
       );
     }),
@@ -261,14 +265,14 @@ function RadarChartCore({
       {
         key: "compare-static",
         points: comparePoints,
-        style: { fill: "rgba(90, 154, 110, 0.3)", stroke: "#5A9A6E", strokeWidth: 2 }
+        style: { fill: "rgba(90, 154, 110, 0.45)", stroke: "#5A9A6E", strokeWidth: 2, mixBlendMode: "multiply" }
       }
     ) : /* @__PURE__ */ React.createElement(
       animated.polygon,
       {
         key: "compare-animated",
         points: compareSpring.points,
-        style: { fill: "rgba(90, 154, 110, 0.3)", stroke: "#5A9A6E", strokeWidth: 2 }
+        style: { fill: "rgba(90, 154, 110, 0.45)", stroke: "#5A9A6E", strokeWidth: 2, mixBlendMode: "multiply" }
       }
     ) : null,
     hasCompareData && compareCoords && compareCoords.map(([cx, cy], i) => {
@@ -287,9 +291,7 @@ function RadarChartCore({
           fill: matches ? "#fed12e" : "#5A9A6E",
           stroke: "#FFFFFF",
           strokeWidth: 3,
-          style: { cursor: "default" },
-          onMouseEnter: () => setTooltip({ x: cx, y: cy, text: getStanceText(shortTitle, compareVal) }),
-          onMouseLeave: () => setTooltip(null)
+          style: { pointerEvents: "none" }
         }
       );
     }),
@@ -313,6 +315,44 @@ function RadarChartCore({
         }
       );
     }),
+    pointsArr.map(([cx, cy], i) => {
+      const shortTitle = spokes[i][0];
+      const userVal = spokes[i][1];
+      if (!userVal || Number(userVal) === 0) return null;
+      return /* @__PURE__ */ React.createElement(
+        "circle",
+        {
+          key: `user-sensor-${i}`,
+          cx,
+          cy,
+          r: 14,
+          fill: "transparent",
+          stroke: "none",
+          style: { cursor: "default" },
+          onMouseEnter: () => setTooltip({ x: cx, y: cy, text: getStanceText(shortTitle, userVal) }),
+          onMouseLeave: () => setTooltip(null)
+        }
+      );
+    }),
+    hasCompareData && compareCoords && compareCoords.map(([cx, cy], i) => {
+      const shortTitle = spokes[i][0];
+      const compareVal = compareData[shortTitle];
+      if (!compareVal || Number(compareVal) === 0) return null;
+      return /* @__PURE__ */ React.createElement(
+        "circle",
+        {
+          key: `compare-sensor-${i}`,
+          cx,
+          cy,
+          r: 14,
+          fill: "transparent",
+          stroke: "none",
+          style: { cursor: "default" },
+          onMouseEnter: () => setTooltip({ x: cx, y: cy, text: getStanceText(shortTitle, compareVal) }),
+          onMouseLeave: () => setTooltip(null)
+        }
+      );
+    }),
     tooltip && (() => {
       const tipW = 190;
       const tipH = 70;