impaktapps-design 0.2.58-alpha.4 → 0.2.58-alpha.6

package/dist/impaktapps-design.es.js

@@ -10873,26 +10873,23 @@ function Legend({
   colorRange,
   dataKeyArray
 }) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
   const legendGlyphSize = ((_b = (_a = value == null ? void 0 : value.main) == null ? void 0 : _a.legend) == null ? void 0 : _b.colorRectWidth) || 15;
-  const xValues = (_c = value == null ? void 0 : value.main) == null ? void 0 : _c.data.map((item) => {
-    return item.x;
-  });
   const ordinalColorScale = createOrdinalScale$1({
-    domain: dataKeyArray || ((_d = value == null ? void 0 : value.main) == null ? void 0 : _d.tooltipDataKey),
-    range: colorRange || ((_f = (_e = value == null ? void 0 : value.style) == null ? void 0 : _e.pieStyle) == null ? void 0 : _f.colorRange)
+    domain: dataKeyArray || ((_c = value == null ? void 0 : value.main) == null ? void 0 : _c.tooltipDataKey),
+    range: colorRange || ((_e = (_d = value == null ? void 0 : value.style) == null ? void 0 : _d.pieStyle) == null ? void 0 : _e.colorRange)
   });
   return /* @__PURE__ */ jsxs("div", {
     className: "legend",
     style: {
       paddingLeft: "40px",
       paddingRight: "40px",
-      ...(_h = (_g = value == null ? void 0 : value.style) == null ? void 0 : _g.legendStyle) == null ? void 0 : _h.legend
+      ...(_g = (_f = value == null ? void 0 : value.style) == null ? void 0 : _f.legendStyle) == null ? void 0 : _g.legend
     },
     children: [/* @__PURE__ */ jsx("div", {
       className: "title",
-      style: (_j = (_i = value == null ? void 0 : value.style) == null ? void 0 : _i.legendStyle) == null ? void 0 : _j.legendTitle,
-      children: (_l = (_k = value == null ? void 0 : value.main) == null ? void 0 : _k.legend) == null ? void 0 : _l.legendTitle
+      style: (_i = (_h = value == null ? void 0 : value.style) == null ? void 0 : _h.legendStyle) == null ? void 0 : _i.legendTitle,
+      children: (_k = (_j = value == null ? void 0 : value.main) == null ? void 0 : _j.legend) == null ? void 0 : _k.legendTitle
     }), /* @__PURE__ */ jsx(Ordinal, {
       scale: ordinalColorScale,
       labelFormat: (label) => `${label.toUpperCase()}`,
@@ -10903,7 +10900,7 @@ function Legend({
             display: "flex",
             flexDirection: ((_b2 = (_a2 = value == null ? void 0 : value.main) == null ? void 0 : _a2.legend) == null ? void 0 : _b2.direction) || "row"
           },
-          children: xValues.map((label, i) => {
+          children: labels.map((label, i) => {
             var _a3, _b3;
             return /* @__PURE__ */ jsxs(LegendItem, {
               margin: "0 5px",
@@ -10915,14 +10912,14 @@ function Legend({
                 width: legendGlyphSize,
                 height: legendGlyphSize,
                 children: /* @__PURE__ */ jsx("rect", {
-                  fill: label,
+                  fill: label.value,
                   width: legendGlyphSize,
                   height: legendGlyphSize
                 })
-              }), /* @__PURE__ */ jsx(LegendLabel, {
+              }), /* @__PURE__ */ jsxs(LegendLabel, {
                 align: `${((_b3 = (_a3 = value == null ? void 0 : value.main) == null ? void 0 : _a3.legend) == null ? void 0 : _b3.align) || "left"}`,
                 margin: "0 0 0 4px",
-                children: label
+                children: ["", label.text]
               })]
             }, `legend-quantile-${i}`);
           })
@@ -19784,9 +19781,13 @@ const DrawGraph = ({
     xAccessor: (d2) => d2[arr[0]],
     yAccessor: (d2) => d2[arr[1]]
   };
+  const dataKeyArray = data.map((ele) => {
+    return ele.key;
+  });
   return /* @__PURE__ */ jsxs(Fragment, {
     children: [value.main.legendAvailable && /* @__PURE__ */ jsx(Legend, {
-      value
+      value,
+      dataKeyArray
     }), /* @__PURE__ */ jsxs(XYChart, {
       height: parseInt((_c = (_b = value.style) == null ? void 0 : _b.containerStyle) == null ? void 0 : _c.height),
       xScale: {
@@ -19831,16 +19832,19 @@ const DrawGraph = ({
         numTicks: value.main.numHidden ? 0 : ((_r = value.main) == null ? void 0 : _r.data[0].length) - 1
       }), (_s = value.main) == null ? void 0 : _s.data.map((elem, i) => {
         var _a2, _b2, _c2, _d2, _e2, _f2;
-        return /* @__PURE__ */ jsx(AnimatedLineSeries, {
-          dataKey: value.main.tooltipDataKey[i],
-          data: elem,
-          fill: (_b2 = (_a2 = value.style) == null ? void 0 : _a2.lineStyle) == null ? void 0 : _b2.lineAreaColor,
-          fillOpacity: (_d2 = (_c2 = value.style) == null ? void 0 : _c2.lineStyle) == null ? void 0 : _d2.lineAreaOpacity,
-          floodColor: "green",
-          floodOpacity: 1,
-          stroke: (_f2 = (_e2 = value.style) == null ? void 0 : _e2.lineStyle) == null ? void 0 : _f2.colorRange[i],
-          ...accessors
-        });
+        return /* @__PURE__ */ jsx(
+          AnimatedLineSeries,
+          {
+            dataKey: elem.key,
+            data: elem.value,
+            fill: (_b2 = (_a2 = value.style) == null ? void 0 : _a2.lineStyle) == null ? void 0 : _b2.lineAreaColor,
+            fillOpacity: (_d2 = (_c2 = value.style) == null ? void 0 : _c2.lineStyle) == null ? void 0 : _d2.lineAreaOpacity,
+            floodColor: "green",
+            floodOpacity: 1,
+            stroke: (_f2 = (_e2 = value.style) == null ? void 0 : _e2.lineStyle) == null ? void 0 : _f2.colorRange[i],
+            ...accessors
+          }
+        );
       }), /* @__PURE__ */ jsx(Tooltip, {
         snapTooltipToDatumX: true,
         snapTooltipToDatumY: true,
@@ -43977,3 +43981,4 @@ const CustomTimer = ({
   });
 };
 export { BarGraph, ImpaktAppsCard as Card, HorizontalBarGraph, LineGraph, PieGraph, ProgressBar, SpeedoMeter, CustomTimer as Timer };
+//# sourceMappingURL=impaktapps-design.es.js.map