ag-common 0.0.795 → 0.0.797

package/dist/ui/components/LineChart/Base.js

@@ -58,7 +58,7 @@ const LineChart = (p) => {
     lt !== null && lt !== void 0 ? lt : (lt = (s) => s.toString());
     const lt2 = lt;
     const tt2 = tt;
-    const legendItems = (0, getLegendItems_1.getLegendItems)(Object.assign(Object.assign({ colours: p.colours, data: p.data, tt: tt2, lt: lt2 }, (_a = UT.pos) === null || _a === void 0 ? void 0 : _a.data), { fixed: false }));
+    const legendItems = (0, getLegendItems_1.getLegendItems)(Object.assign(Object.assign({ colours: p.colours, data: p.data, legendData: p.legendData, tt: tt2, lt: lt2 }, (_a = UT.pos) === null || _a === void 0 ? void 0 : _a.data), { fixed: false }));
     const SvgC = (react_1.default.createElement(Svg, { style: {
             borderLeft: `solid 1px ${style.borderColor}`,
             borderTop: `solid 1px ${style.borderColor}`,
@@ -116,6 +116,6 @@ const LineChart = (p) => {
         react_1.default.createElement(FlexRow_1.FlexRow, { noWrap: true },
             react_1.default.createElement(LegendY_1.LegendY, { data: p.data, style: style }),
             SvgC),
-        react_1.default.createElement(LegendX_1.LegendX, { data: p.data, colours: p.colours, lt: lt, tt: tt, style: style })));
+        react_1.default.createElement(LegendX_1.LegendX, { data: p.data, legendData: p.legendData, colours: p.colours, lt: lt, tt: tt, style: style })));
 };
 exports.LineChart = LineChart;

package/dist/ui/components/LineChart/LegendX.d.ts

@@ -1,8 +1,9 @@
 import React from 'react';
 import type { IVarStyles } from '../../styles/common';
 import type { ILineChartItemRaw } from './types';
-export declare const LegendX: ({ data, lt, tt, colours, style, }: {
+export declare const LegendX: ({ data, legendData, lt, tt, colours, style, }: {
     data: ILineChartItemRaw[];
+    legendData?: ILineChartItemRaw[];
     colours: Record<string, string>;
     lt: (a: number) => string;
     tt: (a: number) => string;

package/dist/ui/components/LineChart/LegendX.js

@@ -68,9 +68,10 @@ const Col = styled_1.default.div `
   border-radius: 50%;
   margin-right: 0.25rem;
 `;
-const LegendX = ({ data, lt, tt, colours, style, }) => {
+const LegendX = ({ data, legendData, lt, tt, colours, style, }) => {
     const legendItems = (0, getLegendItems_1.getLegendItems)({
         data,
+        legendData,
         colours,
         fixed: true,
         lt,

package/dist/ui/components/LineChart/getLegendItems.d.ts

@@ -1,4 +1,4 @@
-import type { ILineChartTooltip } from './types';
+import type { ILineChartItemRaw, ILineChartTooltip } from './types';
 export interface ILegendItem {
     y: number;
     colour: string;
@@ -13,4 +13,6 @@ export interface ILegendItems {
 export declare const getLegendItems: (p: ILineChartTooltip & {
     /** if true, will only return top items */
     fixed: boolean;
+    /** optional dataset used for legend/tooltip computations */
+    legendData?: ILineChartItemRaw[];
 }) => ILegendItems;

package/dist/ui/components/LineChart/getLegendItems.js

@@ -8,12 +8,14 @@ const shownResults = 4;
 const getTopItems = ({ data, colours, }) => {
     const val = {};
     data.forEach((d) => {
+        var _a;
+        const key = (_a = d.legendName) !== null && _a !== void 0 ? _a : d.name;
         // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-        if (!val[d.name]) {
-            val[d.name] = { colour: colours[d.name], name: d.name, value: d.y };
+        if (!val[key]) {
+            val[key] = { colour: colours[d.name], name: key, value: d.y };
         }
         else {
-            val[d.name].value += d.y;
+            val[key].value += d.y;
         }
     });
     const values = Object.values(val).sort((a, b) => a.value < b.value ? 1 : -1);
@@ -26,15 +28,38 @@ const getTopItems = ({ data, colours, }) => {
     return legendItems;
 };
 const getLegendItems = (p) => {
-    var _a, _b;
-    let values = (_b = (_a = p.selectedXs) === null || _a === void 0 ? void 0 : _a.map((a) => ({
-        colour: p.colours[a.name],
-        name: a.name,
-        y: a.y,
-        x: a.x,
-    }))) !== null && _b !== void 0 ? _b : [];
+    var _a;
+    const dataSource = (_a = p.legendData) !== null && _a !== void 0 ? _a : p.data;
+    let values = [];
+    if (p.selectedXs && p.selectedXs.length > 0) {
+        const sx = p.selectedXs[0].x;
+        const grouped = {};
+        dataSource
+            .filter((d) => d.x === sx)
+            .forEach((d) => {
+            var _a;
+            const key = (_a = d.legendName) !== null && _a !== void 0 ? _a : d.name;
+            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+            if (!grouped[key]) {
+                grouped[key] = {
+                    value: d.y,
+                    colour: p.colours[d.name],
+                    name: key,
+                };
+            }
+            else {
+                grouped[key].value += d.y;
+            }
+        });
+        values = Object.values(grouped).map((g) => ({
+            colour: g.colour,
+            name: g.name,
+            y: g.value,
+            x: sx,
+        }));
+    }
     if (p.fixed || values.length === 0) {
-        values = getTopItems(p);
+        values = getTopItems({ data: dataSource, colours: p.colours });
     }
     const total = (0, math_1.sumArray)(values.map((a) => a.y));
     const min = total * 0.1;

package/dist/ui/components/LineChart/types.d.ts

@@ -3,6 +3,8 @@ export type ILineChartItemRaw = {
     x: number;
     y: number;
     name: string;
+    /** Optional display name used for legend/tooltip grouping */
+    legendName?: string;
 };
 export interface ILineChartState {
     selectedPoints?: {
@@ -19,6 +21,8 @@ export interface ILineChartTooltip extends ILineChartState {
 }
 export interface ILineChart {
     data: ILineChartItemRaw[];
+    /** Optional dataset used only for legend/tooltip calculations */
+    legendData?: ILineChartItemRaw[];
     className?: string;
     /** name -> colour */
     colours: Record<string, string>;

package/dist/ui/helpers/useTooltip.js

@@ -32,18 +32,10 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useTooltip = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
 const react_1 = __importStar(require("react"));
 const react_dom_1 = require("react-dom");
-const Base = styled_1.default.div `
-  position: absolute;
-  z-index: 10;
-`;
 const Comp = ({ pos, children, }) => {
     const ref = (0, react_1.createRef)();
     const [size, setSize] = (0, react_1.useState)();
@@ -100,7 +92,7 @@ const Comp = ({ pos, children, }) => {
             top = 0;
         }
     }
-    const Content = (react_1.default.createElement(Base, { "data-type": "tooltip-content", ref: ref, style: Object.assign(Object.assign({ left,
+    const Content = (react_1.default.createElement("div", { "data-type": "tooltip-content", ref: ref, className: "absolute z-10", style: Object.assign(Object.assign({ left,
             right,
             top,
             bottom }, (!pos.hasParent && { position: 'fixed' })), (!size && { zIndex: -1 })) }, children(pos, size)));

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.795",
+  "version": "0.0.797",
   "name": "ag-common",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",