@hitachivantara/uikit-react-viz 5.1.1 → 5.2.0

package/dist/esm/components/{LineChart/LineChart.styles.js.map → BaseChart/BaseChart.styles.js.map}

@@ -1 +1 @@
-{"version":3,"file":"LineChart.styles.js","sources":["../../../../src/components/LineChart/LineChart.styles.tsx"],"sourcesContent":["import { theme, createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvLineChart\", {\n  /** Single tooltip styles */\n  singleTooltipRoot: {\n    width: \"fit-content\",\n    boxShadow: theme.colors.shadow,\n    backgroundColor: theme.colors.atmo1,\n    padding: theme.space.sm,\n    display: \"flex\",\n  },\n  singleTooltipTitle: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.semibold,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n  },\n  singleTooltipValue: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.normal,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n    marginLeft: theme.space.xs,\n  },\n  /** Multiple tooltip styles */\n  multipleTooltipRoot: {\n    width: \"fit-content\",\n    boxShadow: theme.colors.shadow,\n    backgroundColor: theme.colors.atmo1,\n  },\n  multipleTooltipTitleContainer: {\n    padding: `15px ${theme.space.sm}`,\n    borderBottom: `3px solid ${theme.colors.atmo2}`,\n  },\n  multipleTooltipTitle: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.semibold,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n  },\n  multipleTooltipValuesContainer: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    padding: theme.space.sm,\n\n    \"& > *:not(:last-child)\": { paddingBottom: theme.space.sm },\n  },\n  multipleTooltipSeriesContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    justifyContent: \"space-between\",\n    alignItems: \"center\",\n  },\n  multipleTooltipSeriesNameContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n    marginRight: theme.space.sm,\n  },\n  multipleTooltipSeriesColor: {\n    width: \"10px\",\n    height: \"10px\",\n    marginRight: \"5px\",\n  },\n  multipleTooltipSeriesName: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.semibold,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n  },\n  multipleTooltipSeriesValue: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.normal,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n  },\n});\n"],"names":["useClasses","staticClasses","createClasses","singleTooltipRoot","width","boxShadow","theme","colors","shadow","backgroundColor","atmo1","padding","space","sm","display","singleTooltipTitle","fontFamily","body","fontWeight","fontWeights","semibold","fontSize","fontSizes","color","secondary","singleTooltipValue","normal","marginLeft","xs","multipleTooltipRoot","multipleTooltipTitleContainer","borderBottom","atmo2","multipleTooltipTitle","multipleTooltipValuesContainer","flexDirection","paddingBottom","multipleTooltipSeriesContainer","justifyContent","alignItems","multipleTooltipSeriesNameContainer","marginRight","multipleTooltipSeriesColor","height","multipleTooltipSeriesName","multipleTooltipSeriesValue"],"mappings":";AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAYC;AAAc,IAAIC,cAAc,eAAe;AAAA;AAAA,EAExEC,mBAAmB;AAAA,IACjBC,OAAO;AAAA,IACPC,WAAWC,MAAMC,OAAOC;AAAAA,IACxBC,iBAAiBH,MAAMC,OAAOG;AAAAA,IAC9BC,SAASL,MAAMM,MAAMC;AAAAA,IACrBC,SAAS;AAAA,EACX;AAAA,EACAC,oBAAoB;AAAA,IAClBC,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYC;AAAAA,IAC9BC,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,EACtB;AAAA,EACAC,oBAAoB;AAAA,IAClBT,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYO;AAAAA,IAC9BL,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,IACpBG,YAAYrB,MAAMM,MAAMgB;AAAAA,EAC1B;AAAA;AAAA,EAEAC,qBAAqB;AAAA,IACnBzB,OAAO;AAAA,IACPC,WAAWC,MAAMC,OAAOC;AAAAA,IACxBC,iBAAiBH,MAAMC,OAAOG;AAAAA,EAChC;AAAA,EACAoB,+BAA+B;AAAA,IAC7BnB,SAAU,QAAOL,MAAMM,MAAMC;AAAAA,IAC7BkB,cAAe,aAAYzB,MAAMC,OAAOyB;AAAAA,EAC1C;AAAA,EACAC,sBAAsB;AAAA,IACpBjB,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYC;AAAAA,IAC9BC,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,EACtB;AAAA,EACAU,gCAAgC;AAAA,IAC9BpB,SAAS;AAAA,IACTqB,eAAe;AAAA,IACfxB,SAASL,MAAMM,MAAMC;AAAAA,IAErB,0BAA0B;AAAA,MAAEuB,eAAe9B,MAAMM,MAAMC;AAAAA,IAAG;AAAA,EAC5D;AAAA,EACAwB,gCAAgC;AAAA,IAC9BvB,SAAS;AAAA,IACTqB,eAAe;AAAA,IACfG,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,oCAAoC;AAAA,IAClC1B,SAAS;AAAA,IACTqB,eAAe;AAAA,IACfI,YAAY;AAAA,IACZE,aAAanC,MAAMM,MAAMC;AAAAA,EAC3B;AAAA,EACA6B,4BAA4B;AAAA,IAC1BtC,OAAO;AAAA,IACPuC,QAAQ;AAAA,IACRF,aAAa;AAAA,EACf;AAAA,EACAG,2BAA2B;AAAA,IACzB5B,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYC;AAAAA,IAC9BC,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,EACtB;AAAA,EACAqB,4BAA4B;AAAA,IAC1B7B,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYO;AAAAA,IAC9BL,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,EACtB;AACF,CAAC;"}
+{"version":3,"file":"BaseChart.styles.js","sources":["../../../../src/components/BaseChart/BaseChart.styles.tsx"],"sourcesContent":["import { theme, createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvBaseChart\", {\n  /** Single tooltip styles */\n  singleTooltipRoot: {\n    width: \"fit-content\",\n    boxShadow: theme.colors.shadow,\n    backgroundColor: theme.colors.atmo1,\n    padding: theme.space.sm,\n    display: \"flex\",\n  },\n  singleTooltipTitle: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.semibold,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n  },\n  singleTooltipValue: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.normal,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n    marginLeft: theme.space.xs,\n  },\n  /** Multiple tooltip styles */\n  multipleTooltipRoot: {\n    width: \"fit-content\",\n    boxShadow: theme.colors.shadow,\n    backgroundColor: theme.colors.atmo1,\n  },\n  multipleTooltipTitleContainer: {\n    padding: `15px ${theme.space.sm}`,\n    borderBottom: `3px solid ${theme.colors.atmo2}`,\n  },\n  multipleTooltipTitle: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.semibold,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n  },\n  multipleTooltipValuesContainer: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    padding: theme.space.sm,\n\n    \"& > *:not(:last-child)\": { paddingBottom: theme.space.sm },\n  },\n  multipleTooltipSeriesContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    justifyContent: \"space-between\",\n    alignItems: \"center\",\n  },\n  multipleTooltipSeriesNameContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n    marginRight: theme.space.sm,\n  },\n  multipleTooltipSeriesColor: {\n    width: \"10px\",\n    height: \"10px\",\n    marginRight: \"5px\",\n  },\n  multipleTooltipSeriesName: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.semibold,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n  },\n  multipleTooltipSeriesValue: {\n    fontFamily: theme.fontFamily.body,\n    fontWeight: theme.fontWeights.normal,\n    fontSize: theme.fontSizes.sm,\n    color: theme.colors.secondary,\n  },\n});\n"],"names":["useClasses","staticClasses","createClasses","singleTooltipRoot","width","boxShadow","theme","colors","shadow","backgroundColor","atmo1","padding","space","sm","display","singleTooltipTitle","fontFamily","body","fontWeight","fontWeights","semibold","fontSize","fontSizes","color","secondary","singleTooltipValue","normal","marginLeft","xs","multipleTooltipRoot","multipleTooltipTitleContainer","borderBottom","atmo2","multipleTooltipTitle","multipleTooltipValuesContainer","flexDirection","paddingBottom","multipleTooltipSeriesContainer","justifyContent","alignItems","multipleTooltipSeriesNameContainer","marginRight","multipleTooltipSeriesColor","height","multipleTooltipSeriesName","multipleTooltipSeriesValue"],"mappings":";AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAYC;AAAc,IAAIC,cAAc,eAAe;AAAA;AAAA,EAExEC,mBAAmB;AAAA,IACjBC,OAAO;AAAA,IACPC,WAAWC,MAAMC,OAAOC;AAAAA,IACxBC,iBAAiBH,MAAMC,OAAOG;AAAAA,IAC9BC,SAASL,MAAMM,MAAMC;AAAAA,IACrBC,SAAS;AAAA,EACX;AAAA,EACAC,oBAAoB;AAAA,IAClBC,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYC;AAAAA,IAC9BC,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,EACtB;AAAA,EACAC,oBAAoB;AAAA,IAClBT,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYO;AAAAA,IAC9BL,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,IACpBG,YAAYrB,MAAMM,MAAMgB;AAAAA,EAC1B;AAAA;AAAA,EAEAC,qBAAqB;AAAA,IACnBzB,OAAO;AAAA,IACPC,WAAWC,MAAMC,OAAOC;AAAAA,IACxBC,iBAAiBH,MAAMC,OAAOG;AAAAA,EAChC;AAAA,EACAoB,+BAA+B;AAAA,IAC7BnB,SAAU,QAAOL,MAAMM,MAAMC;AAAAA,IAC7BkB,cAAe,aAAYzB,MAAMC,OAAOyB;AAAAA,EAC1C;AAAA,EACAC,sBAAsB;AAAA,IACpBjB,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYC;AAAAA,IAC9BC,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,EACtB;AAAA,EACAU,gCAAgC;AAAA,IAC9BpB,SAAS;AAAA,IACTqB,eAAe;AAAA,IACfxB,SAASL,MAAMM,MAAMC;AAAAA,IAErB,0BAA0B;AAAA,MAAEuB,eAAe9B,MAAMM,MAAMC;AAAAA,IAAG;AAAA,EAC5D;AAAA,EACAwB,gCAAgC;AAAA,IAC9BvB,SAAS;AAAA,IACTqB,eAAe;AAAA,IACfG,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,oCAAoC;AAAA,IAClC1B,SAAS;AAAA,IACTqB,eAAe;AAAA,IACfI,YAAY;AAAA,IACZE,aAAanC,MAAMM,MAAMC;AAAAA,EAC3B;AAAA,EACA6B,4BAA4B;AAAA,IAC1BtC,OAAO;AAAA,IACPuC,QAAQ;AAAA,IACRF,aAAa;AAAA,EACf;AAAA,EACAG,2BAA2B;AAAA,IACzB5B,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYC;AAAAA,IAC9BC,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,EACtB;AAAA,EACAqB,4BAA4B;AAAA,IAC1B7B,YAAYV,MAAMU,WAAWC;AAAAA,IAC7BC,YAAYZ,MAAMa,YAAYO;AAAAA,IAC9BL,UAAUf,MAAMgB,UAAUT;AAAAA,IAC1BU,OAAOjB,MAAMC,OAAOiB;AAAAA,EACtB;AACF,CAAC;"}

package/dist/esm/components/LineChart/LineChart.js

@@ -1,374 +1,17 @@
-import { useRef, useMemo, useState, useEffect } from "react";
-import { DatasetComponent, GridComponent, AriaComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent } from "echarts/components";
-import { CanvasRenderer } from "echarts/renderers";
-import * as echarts from "echarts/core";
-import { LineChart } from "echarts/charts";
-import ReactECharts from "echarts-for-react";
-import { internal, from, table, desc, not } from "arquero";
-import { getAxisType } from "../../utils/getAxisType.js";
-import { getAgFunc } from "../../utils/getAgFunc.js";
-import { getLegendIcon } from "../../utils/getLegendIcon.js";
-import { useVizTheme } from "../../hooks/useVizTheme.js";
-import { useClasses } from "./LineChart.styles.js";
 import { jsx } from "@emotion/react/jsx-runtime";
-echarts.use([LineChart, CanvasRenderer, DatasetComponent, GridComponent, AriaComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent]);
+import { HvBaseChart } from "../BaseChart/BaseChart.js";
 const HvLineChart = ({
-  data,
-  groupBy,
-  splitBy,
-  measures,
-  sortBy,
-  xAxis,
-  yAxis,
-  legend,
-  tooltip,
-  seriesNameFormatter,
   area = false,
-  stack,
   emptyCellMode = "void",
-  horizontalRangeSlider,
   areaOpacity = 0.5,
-  classes: classesProp = {},
-  grid
+  ...others
 }) => {
-  const {
-    theme
-  } = useVizTheme();
-  const {
-    classes
-  } = useClasses(classesProp);
-  const currentTheme = useRef(theme);
-  const chartRef = useRef(null);
-  const isMounted = useRef(false);
-  const groupByKey = Array.isArray(groupBy) ? groupBy.join("_") : groupBy;
-  const chartData = useMemo(() => {
-    let tableData;
-    if (data instanceof internal.ColumnTable) {
-      tableData = data;
-    } else if (Array.isArray(data)) {
-      tableData = from(data);
-    } else {
-      tableData = table(data);
-    }
-    const groupByFields = groupBy ? Array.isArray(groupBy) ? groupBy : [groupBy] : [];
-    const splitByFields = Array.isArray(splitBy) ? splitBy : splitBy != null ? [splitBy] : [];
-    const measuresFields = measures == null ? {} : typeof measures === "string" ? {
-      [measures]: getAgFunc("sum", measures)
-    } : Array.isArray(measures) ? measures.reduce((acc, value) => {
-      let field;
-      let agFunction;
-      if (typeof value === "string") {
-        field = value;
-        agFunction = "sum";
-      } else {
-        field = value.field;
-        agFunction = value.agg ?? "sum";
-      }
-      return {
-        ...acc,
-        [field]: getAgFunc(agFunction, field)
-      };
-    }, {}) : {
-      [measures.field]: getAgFunc(measures.agg ?? "sum", measures.field)
-    };
-    const sortByFields = sortBy == null ? {} : typeof sortBy === "string" ? {
-      [sortBy]: "asc"
-    } : Array.isArray(sortBy) ? sortBy.reduce((acc, value) => {
-      let field;
-      let orderFunction;
-      if (typeof value === "string") {
-        field = value;
-        orderFunction = "asc";
-      } else {
-        field = value.field;
-        orderFunction = value.order ?? "asc";
-      }
-      return {
-        ...acc,
-        [field]: orderFunction
-      };
-    }, {}) : {
-      [sortBy.field]: sortBy.order ?? "asc"
-    };
-    const allFields = [...groupByFields, ...splitByFields, ...Object.keys(measuresFields)];
-    tableData = tableData.select(...allFields);
-    if (groupByFields.length > 0) {
-      tableData = tableData.groupby(groupByFields);
-    }
-    if (splitByFields.length > 0) {
-      tableData = tableData.pivot(splitByFields, measuresFields);
-    } else {
-      tableData = tableData.rollup(measuresFields);
-    }
-    if (groupByFields.length > 1) {
-      const expression = `d => ${groupByFields.map((field) => `d.${field}`).join(" + '_' + ")}`;
-      tableData = tableData.derive({
-        [groupByKey]: expression
-      }, {
-        after: groupByFields[groupByFields.length - 1]
-      });
-    }
-    if (Object.keys(sortByFields).length > 0) {
-      tableData = tableData.orderby(...Object.keys(sortByFields).filter((key) => allFields.includes(key)).map((key) => sortByFields[key] === "desc" ? desc(key) : key));
-    }
-    if (groupByFields.length > 1) {
-      tableData = tableData.select(not(...groupByFields));
-    }
-    return tableData;
-  }, [data, groupBy, groupByKey, splitBy, measures, sortBy]);
-  const chartDataset = useMemo(() => {
-    return {
-      dataset: {
-        source: chartData.columnNames().reduce((acc, c) => ({
-          ...acc,
-          [c]: chartData.array(c)
-        }), {})
-      }
-    };
-  }, [chartData]);
-  const chartXAxis = useMemo(() => {
-    return {
-      xAxis: {
-        type: getAxisType(xAxis == null ? void 0 : xAxis.type) ?? "category",
-        name: xAxis == null ? void 0 : xAxis.name,
-        scale: true,
-        axisLabel: {
-          rotate: (xAxis == null ? void 0 : xAxis.labelRotation) ?? 0,
-          formatter: xAxis == null ? void 0 : xAxis.labelFormatter
-        },
-        max: (xAxis == null ? void 0 : xAxis.maxValue) === "max" ? "dataMax" : xAxis == null ? void 0 : xAxis.maxValue,
-        min: (xAxis == null ? void 0 : xAxis.minValue) === "min" ? "dataMin" : xAxis == null ? void 0 : xAxis.minValue
-      }
-    };
-  }, [xAxis == null ? void 0 : xAxis.labelFormatter, xAxis == null ? void 0 : xAxis.labelRotation, xAxis == null ? void 0 : xAxis.name, xAxis == null ? void 0 : xAxis.type, xAxis == null ? void 0 : xAxis.maxValue, xAxis == null ? void 0 : xAxis.minValue]);
-  const chartYAxis = useMemo(() => {
-    if (!yAxis || !Array.isArray(yAxis)) {
-      return {
-        yAxis: {
-          id: yAxis == null ? void 0 : yAxis.id,
-          type: getAxisType(yAxis == null ? void 0 : yAxis.type) ?? "value",
-          name: yAxis == null ? void 0 : yAxis.name,
-          axisLabel: {
-            rotate: (yAxis == null ? void 0 : yAxis.labelRotation) ?? 0,
-            formatter: yAxis == null ? void 0 : yAxis.labelFormatter
-          },
-          max: (yAxis == null ? void 0 : yAxis.maxValue) === "max" ? "dataMax" : yAxis == null ? void 0 : yAxis.maxValue,
-          min: (yAxis == null ? void 0 : yAxis.minValue) === "min" ? "dataMin" : yAxis == null ? void 0 : yAxis.minValue
-        }
-      };
-    }
-    return {
-      yAxis: yAxis.map((axis) => ({
-        id: axis == null ? void 0 : axis.id,
-        type: getAxisType(axis == null ? void 0 : axis.type) ?? "value",
-        name: axis == null ? void 0 : axis.name,
-        axisLabel: {
-          rotate: (axis == null ? void 0 : axis.labelRotation) ?? 0,
-          formatter: axis == null ? void 0 : axis.labelFormatter
-        },
-        max: (axis == null ? void 0 : axis.maxValue) === "max" ? "dataMax" : axis == null ? void 0 : axis.maxValue,
-        min: (axis == null ? void 0 : axis.minValue) === "min" ? "dataMin" : axis == null ? void 0 : axis.minValue
-      }))
-    };
-  }, [yAxis]);
-  const getMeasure = (name, msr) => {
-    const measureName = name.split("_")[0];
-    const measuresArray = Array.isArray(msr) ? msr : [msr];
-    return measuresArray.find((m) => {
-      if (typeof m === "string") {
-        return m === measureName;
-      }
-      return m.field === measureName;
-    }) ?? measuresArray[0];
-  };
-  const chartSeries = useMemo(() => {
-    return {
-      series: chartData.columnNames().filter((c) => c !== groupByKey).map((c) => {
-        const measure = getMeasure(c, measures);
-        const showSymbol = typeof measure !== "string" ? !measure.hideSymbol : true;
-        const sampling = typeof measure !== "string" ? measure.sampling : void 0;
-        const yAxisId = typeof measure !== "string" ? measure.yAxis : void 0;
-        const isArea = typeof measure !== "string" ? measure.area ?? area : area;
-        const aOpacity = typeof measure !== "string" ? measure.areaOpacity ?? areaOpacity : areaOpacity;
-        const stackName = typeof measure !== "string" ? measure.stack ?? stack ?? void 0 : stack ?? void 0;
-        const connectNulls = typeof measure !== "string" && measure.emptyCellMode ? measure.emptyCellMode === "connect" : emptyCellMode === "connect";
-        return {
-          id: `series~${groupByKey}~${c}`,
-          name: seriesNameFormatter ? seriesNameFormatter(c) : c,
-          encode: {
-            x: groupByKey,
-            y: c
-          },
-          type: "line",
-          showSymbol,
-          sampling,
-          areaStyle: isArea ? {
-            opacity: aOpacity
-          } : void 0,
-          connectNulls,
-          stack: stackName,
-          yAxisId
-        };
-      })
-    };
-  }, [chartData, groupByKey, area, stack, seriesNameFormatter, emptyCellMode, areaOpacity, measures]);
-  const renderTooltip = (params, single, msr, cls, formatter) => {
-    const tooltipTitle = params[0].value[params[0].encode.x[0]];
-    if (single) {
-      const measure = getMeasure(params[0].dimensionNames[params[0].encode.y[0]], msr);
-      const value = params[0].value[params[0].encode.y[0]];
-      const formattedValue = typeof measure !== "string" && measure.valueFormatter ? measure.valueFormatter(value) : formatter ? formatter(value) : value;
-      return `
-        <div class="${cls == null ? void 0 : cls.singleTooltipRoot}">
-          <p class="${cls == null ? void 0 : cls.singleTooltipTitle}">${tooltipTitle}</p>
-          <p class="${cls == null ? void 0 : cls.singleTooltipValue}">${formattedValue}</p>
-        </div>
-        `;
-    }
-    return `
-    <div class="${cls == null ? void 0 : cls.multipleTooltipRoot}">
-      <div class="${cls == null ? void 0 : cls.multipleTooltipTitleContainer}">
-        <div>
-          <p class="${cls == null ? void 0 : cls.multipleTooltipTitle}">${tooltipTitle}</p>
-        </div>
-      </div>
-      <div class="${cls == null ? void 0 : cls.multipleTooltipValuesContainer}">
-        ${params.map((s) => {
-      const measure = getMeasure(s.dimensionNames[s.encode.y[0]], msr);
-      const value = s.value[s.encode.y[0]];
-      const formattedValue = typeof measure !== "string" && measure.valueFormatter ? measure.valueFormatter(value) : formatter ? formatter(value) : value;
-      return `
-            <div key="${s.seriesName}" class="${cls == null ? void 0 : cls.multipleTooltipSeriesContainer}">
-              <div class="${cls == null ? void 0 : cls.multipleTooltipSeriesNameContainer}">
-                <p style="background-color: ${s.color};" class="${cls == null ? void 0 : cls.multipleTooltipSeriesColor}" />
-                <p class="${cls == null ? void 0 : cls.multipleTooltipSeriesName}">${s.seriesName}</p>
-              </div>
-              <p class="${cls == null ? void 0 : cls.multipleTooltipSeriesValue}">${formattedValue}</p>
-            </div>
-          `;
-    }).join(" ")}
-      </div>
-    </div>
-    `;
-  };
-  const chartTooltip = useMemo(() => {
-    return {
-      tooltip: {
-        confine: false,
-        show: (tooltip == null ? void 0 : tooltip.show) ?? true,
-        trigger: "axis",
-        position: (point, params, dom, rect, size) => {
-          return [point[0], point[1] - size.contentSize[1]];
-        },
-        formatter: (params) => renderTooltip(params, (tooltip == null ? void 0 : tooltip.type) === "single", measures, classes, tooltip == null ? void 0 : tooltip.valueFormatter)
-      }
-    };
-  }, [tooltip == null ? void 0 : tooltip.show, tooltip == null ? void 0 : tooltip.valueFormatter, tooltip == null ? void 0 : tooltip.type, classes, measures]);
-  const chartLegend = useMemo(() => {
-    return {
-      legend: {
-        show: (legend == null ? void 0 : legend.show) ?? (Array.isArray(chartSeries.series) && chartSeries.series.length > 1),
-        itemGap: 20,
-        data: (legend == null ? void 0 : legend.show) !== false && Array.isArray(chartSeries.series) ? chartSeries.series.map((s) => {
-          return {
-            name: s.name,
-            icon: getLegendIcon(s.areaStyle != null)
-          };
-        }) : void 0
-      }
-    };
-  }, [chartSeries, legend == null ? void 0 : legend.show]);
-  const chartHorizontalRangerSlider = useMemo(() => {
-    return {
-      dataZoom: [{
-        show: (horizontalRangeSlider == null ? void 0 : horizontalRangeSlider.show) ?? false,
-        type: "slider",
-        orient: "horizontal"
-      }, {
-        show: (horizontalRangeSlider == null ? void 0 : horizontalRangeSlider.show) ?? false,
-        type: "inside",
-        orient: "horizontal",
-        zoomOnMouseWheel: "shift",
-        moveOnMouseWheel: true
-      }]
-    };
-  }, [horizontalRangeSlider == null ? void 0 : horizontalRangeSlider.show]);
-  const chartGrid = useMemo(() => {
-    return {
-      // if no value is defined we shouldn't pass anything because echarts doesn't behave well otherwise
-      grid: {
-        ...(grid == null ? void 0 : grid.top) != null && {
-          top: grid.top
-        },
-        ...(grid == null ? void 0 : grid.bottom) != null && {
-          bottom: grid.bottom
-        },
-        ...(grid == null ? void 0 : grid.left) != null && {
-          left: grid.left
-        },
-        ...(grid == null ? void 0 : grid.right) != null && {
-          right: grid.right
-        }
-      }
-    };
-  }, [grid == null ? void 0 : grid.bottom, grid == null ? void 0 : grid.left, grid == null ? void 0 : grid.right, grid == null ? void 0 : grid.top]);
-  const [initialOption, setInitialOption] = useState({
-    aria: {
-      enabled: true
-    },
-    animation: false,
-    ...chartDataset,
-    ...chartXAxis,
-    ...chartYAxis,
-    ...chartSeries,
-    ...chartTooltip,
-    ...chartLegend,
-    ...chartHorizontalRangerSlider,
-    ...chartGrid
-  });
-  useEffect(() => {
-    var _a;
-    if (!isMounted.current) {
-      isMounted.current = true;
-      return;
-    }
-    if (theme !== currentTheme.current) {
-      setInitialOption({
-        aria: {
-          enabled: true
-        },
-        animation: false,
-        ...chartDataset,
-        ...chartXAxis,
-        ...chartYAxis,
-        ...chartSeries,
-        ...chartTooltip,
-        ...chartLegend,
-        ...chartHorizontalRangerSlider,
-        ...chartGrid
-      });
-      currentTheme.current = theme;
-      return;
-    }
-    (_a = chartRef.current) == null ? void 0 : _a.getEchartsInstance().setOption({
-      ...chartDataset,
-      ...chartXAxis,
-      ...chartYAxis,
-      ...chartSeries,
-      ...chartLegend,
-      ...chartTooltip,
-      ...chartHorizontalRangerSlider,
-      ...chartGrid
-    }, {
-      replaceMerge: ["xAxis", "yAxis", "series", "dataset"]
-    });
-  }, [theme, chartDataset, chartXAxis, chartYAxis, chartSeries, chartLegend, chartTooltip, chartHorizontalRangerSlider, chartGrid]);
-  return /* @__PURE__ */ jsx(ReactECharts, {
-    ref: chartRef,
-    echarts,
-    option: initialOption,
-    theme,
-    notMerge: true
+  return /* @__PURE__ */ jsx(HvBaseChart, {
+    type: "line",
+    area,
+    emptyCellMode,
+    areaOpacity,
+    ...others
   });
 };
 export {

package/dist/esm/components/LineChart/LineChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"LineChart.js","sources":["../../../../src/components/LineChart/LineChart.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\n\nimport {\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  AriaComponent,\n  LegendComponent,\n  DataZoomSliderComponent,\n  DataZoomInsideComponent,\n} from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\nimport { LineChart } from \"echarts/charts\";\nimport type {\n  EChartsOption,\n  LineSeriesOption,\n  YAXisComponentOption,\n} from \"echarts\";\n\nimport ReactECharts from \"echarts-for-react\";\n\nimport { from, internal, not, table, desc } from \"arquero\";\nimport type ColumnTable from \"arquero/dist/types/table/column-table\";\n\nimport { ExtractNames } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  HvChartAggregation,\n  HvChartOrder,\n  HvChartAxis,\n  HvChartEmptyCellMode,\n  HvChartSampling,\n  HvChartTooltipType,\n} from \"@viz/types\";\nimport { getAgFunc, getAxisType, getLegendIcon } from \"@viz/utils\";\nimport { useVizTheme } from \"@viz/hooks\";\nimport { useClasses } from \"./LineChart.styles\";\n\nexport type HvLineChartClasses = ExtractNames<typeof useClasses>;\n\n// Register chart components\necharts.use([\n  LineChart,\n  CanvasRenderer,\n  DatasetComponent,\n  GridComponent,\n  AriaComponent,\n  TooltipComponent,\n  LegendComponent,\n  DataZoomSliderComponent,\n  DataZoomInsideComponent,\n]);\n\ntype GroupByField = string;\ntype SplitByField = string;\n\ntype FullMeasuresField = {\n  /** Column name. */\n  field: string;\n  /** Sampling function to use. */\n  sampling?: HvChartSampling;\n  /** Id of the yAxis. */\n  yAxis?: string;\n  /** Whether to hide the symbol for data points. Defaults to `false`. */\n  hideSymbol?: boolean;\n  /** Aggregation function to use. If no `agg` is defined, it will default to `sum`. */\n  agg?: HvChartAggregation;\n  /** Whether the area under the lines should be filled. If not specified, it defaults to the global `area` prop. */\n  area?: boolean;\n  /** Sets opacity of the filled area if `area` is true. If not specified, it defaults to the global `areaOpacity` prop. */\n  areaOpacity?: number;\n  /**\n   * Stack name to use when the measure should be stacked.\n   *\n   * Measures stacked together have the same name.\n   *\n   * If not specified, it defaults to the global `stacked` prop.\n   */\n  stack?: string;\n  /** Strategy to use when there are empty cells. If not specified, it defaults to the global `emptyCellMode` prop. */\n  emptyCellMode?: HvChartEmptyCellMode;\n  /** Formatter for the value in the tooltip. If not specified, it defaults to the one defined in the global `tooltip` prop. */\n  valueFormatter?: (value?: string | number) => string;\n};\n\ntype MeasuresField = string | FullMeasuresField;\n\ntype FullSortByField = {\n  /** Column name. */\n  field: string;\n  /** Order function to use. If no `order` is defined, it will default to `asc`. */\n  order?: HvChartOrder;\n};\ntype SortByField = string | FullSortByField;\n\nexport interface HvLineChartProps {\n  /** Chart data. */\n  data:\n    | Map<string | number, (string | number)[]>\n    | Record<string | number, (string | number)[]>\n    | Record<string | number, string | number>[]\n    | ColumnTable;\n  /** Columns to use to group the data. */\n  groupBy: GroupByField | GroupByField[];\n  /**  Columns to measure on the chart. */\n  measures: MeasuresField | MeasuresField[];\n  /** Columns to use to split the measures. */\n  splitBy?: SplitByField | SplitByField[];\n  /** Columns to use to sort the data points. */\n  sortBy?: SortByField | SortByField[];\n  /**\n   * Options for the xAxis, i.e. the horizontal axis.\n   *\n   * The default `type` for this axis is `categorical`.\n   * */\n  xAxis?: HvChartAxis;\n  /**\n   * Options for the yAxis, i.e. the vertical axis.\n   *\n   * The default `type` for this axis is `continuous`.\n   * */\n  yAxis?: HvChartAxis | [HvChartAxis, HvChartAxis];\n  /** Tooltip options. */\n  tooltip?: {\n    /** Whether to show the tooltip or not. Defaults to `true`. */\n    show?: boolean;\n    /** Formatter for the value in the tooltip. */\n    valueFormatter?: (value?: string | number) => string;\n    /** Tooltip type: single line or multiple lines modes. The single line mode should only be used when there's one series. Defaults to `multiple`. */\n    type?: HvChartTooltipType;\n  };\n  /** Legend options. */\n  legend?: {\n    /** Whether to show the legend or not. The legend will appear by default for multiple series. Otherwise, the legend will not be shown. */\n    show?: boolean;\n  };\n  /** Formatter for the series names used on the tooltips and legend. */\n  seriesNameFormatter?: (value?: string) => string;\n  /** Strategy to use when there are empty cells. Defaults to `void`. */\n  emptyCellMode?: HvChartEmptyCellMode;\n  /** Whether the area under the lines should be filled. Defaults to `false`. */\n  area?: boolean;\n  /** Sets opacity of the filled area if `area` is true. Defaults to `0.5`. */\n  areaOpacity?: number;\n  /** Stack name to use when all the series should be stacked together. If not provided, the series are not stacked. */\n  stack?: string;\n  /** Ranger slider options for the horizontal axis. */\n  horizontalRangeSlider?: {\n    /** Whether to show the ranger slider or not. Defaults to `false`. */\n    show?: boolean;\n  };\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: Partial<HvLineChartClasses>;\n  /** Grid options. */\n  grid?: {\n    /** Distance between the grid and the top of the container. */\n    top?: string | number;\n    /** Distance between the grid and the right side of the container. */\n    right?: string | number;\n    /** Distance between the grid and the left side of the container. */\n    left?: string | number;\n    /** Distance between the grid and the bottom of the container. */\n    bottom?: string | number;\n  };\n}\n\n/**\n * A line chart or line plot or line graph is a type of chart which displays information as a series of data points\n * connected by straight line segments. It is a basic type of chart common in many fields.\n */\nexport const HvLineChart = ({\n  data,\n  groupBy,\n  splitBy,\n  measures,\n  sortBy,\n  xAxis,\n  yAxis,\n  legend,\n  tooltip,\n  seriesNameFormatter,\n  area = false,\n  stack,\n  emptyCellMode = \"void\",\n  horizontalRangeSlider,\n  areaOpacity = 0.5,\n  classes: classesProp = {},\n  grid,\n}: HvLineChartProps) => {\n  const { theme } = useVizTheme();\n  const { classes } = useClasses(classesProp);\n\n  const currentTheme = useRef<string | undefined>(theme);\n  const chartRef = useRef<ReactECharts>(null);\n  const isMounted = useRef<boolean>(false);\n\n  const groupByKey = Array.isArray(groupBy) ? groupBy.join(\"_\") : groupBy;\n\n  const chartData = useMemo<ColumnTable>(() => {\n    let tableData: ColumnTable;\n    if (data instanceof internal.ColumnTable) {\n      tableData = data;\n    } else if (Array.isArray(data)) {\n      tableData = from(data);\n    } else {\n      tableData = table(data);\n    }\n\n    const groupByFields = groupBy\n      ? Array.isArray(groupBy)\n        ? groupBy\n        : [groupBy]\n      : [];\n\n    const splitByFields = Array.isArray(splitBy)\n      ? splitBy\n      : splitBy != null\n      ? [splitBy]\n      : [];\n\n    const measuresFields: { [key: string]: string } =\n      measures == null\n        ? {}\n        : typeof measures === \"string\"\n        ? { [measures]: getAgFunc(\"sum\", measures) }\n        : Array.isArray(measures)\n        ? measures.reduce<{ [key: string]: string }>((acc, value) => {\n            let field: string;\n            let agFunction: HvChartAggregation;\n            if (typeof value === \"string\") {\n              field = value;\n              agFunction = \"sum\";\n            } else {\n              field = value.field;\n              agFunction = value.agg ?? \"sum\";\n            }\n\n            return {\n              ...acc,\n              [field]: getAgFunc(agFunction, field),\n            };\n          }, {})\n        : {\n            [measures.field]: getAgFunc(measures.agg ?? \"sum\", measures.field),\n          };\n\n    const sortByFields: { [key: string]: HvChartOrder } =\n      sortBy == null\n        ? {}\n        : typeof sortBy === \"string\"\n        ? { [sortBy]: \"asc\" }\n        : Array.isArray(sortBy)\n        ? sortBy.reduce<{ [key: string]: HvChartOrder }>((acc, value) => {\n            let field: string;\n            let orderFunction: HvChartOrder;\n            if (typeof value === \"string\") {\n              field = value;\n              orderFunction = \"asc\";\n            } else {\n              field = value.field;\n              orderFunction = value.order ?? \"asc\";\n            }\n\n            return {\n              ...acc,\n              [field]: orderFunction,\n            };\n          }, {})\n        : { [sortBy.field]: sortBy.order ?? \"asc\" };\n\n    const allFields = [\n      ...groupByFields,\n      ...splitByFields,\n      ...Object.keys(measuresFields),\n    ];\n\n    // remove unneeded fields\n    tableData = tableData.select(...allFields);\n\n    // group by groupBy fields\n    if (groupByFields.length > 0) {\n      tableData = tableData.groupby(groupByFields);\n    }\n\n    if (splitByFields.length > 0) {\n      // pivot by splitBy fields\n      tableData = tableData.pivot(splitByFields, measuresFields);\n    } else {\n      // if there is no splitBy fields, just aggregate measures fields\n      tableData = tableData.rollup(measuresFields);\n    }\n\n    // if grouped by multiple fields, create a new joint field\n    // as the line chart doesn't implement hierarchical axis label grouping\n    if (groupByFields.length > 1) {\n      const expression = `d => ${groupByFields\n        .map((field) => `d.${field}`)\n        .join(\" + '_' + \")}`;\n\n      tableData = tableData.derive(\n        { [groupByKey]: expression },\n        { after: groupByFields[groupByFields.length - 1] }\n      );\n    }\n\n    // sort by sortBy fields\n    if (Object.keys(sortByFields).length > 0) {\n      tableData = tableData.orderby(\n        ...Object.keys(sortByFields)\n          // only sort by fields that are in the table, ignore the rest\n          .filter((key) => allFields.includes(key))\n          .map((key) => (sortByFields[key] === \"desc\" ? desc(key) : key))\n      );\n    }\n\n    // if a derived field was created, remove the original fields\n    if (groupByFields.length > 1) {\n      tableData = tableData.select(not(...groupByFields));\n    }\n\n    return tableData;\n  }, [data, groupBy, groupByKey, splitBy, measures, sortBy]);\n\n  const chartDataset = useMemo<Pick<EChartsOption, \"dataset\">>(() => {\n    return {\n      dataset: {\n        source: chartData.columnNames().reduce(\n          (acc, c) => ({\n            ...acc,\n            [c]: chartData.array(c),\n          }),\n          {}\n        ),\n      },\n    };\n  }, [chartData]);\n\n  const chartXAxis = useMemo<Pick<EChartsOption, \"xAxis\">>(() => {\n    return {\n      xAxis: {\n        type: getAxisType(xAxis?.type) ?? \"category\",\n        name: xAxis?.name,\n        scale: true,\n        axisLabel: {\n          rotate: xAxis?.labelRotation ?? 0,\n          formatter: xAxis?.labelFormatter,\n        },\n        max: xAxis?.maxValue === \"max\" ? \"dataMax\" : xAxis?.maxValue,\n        min: xAxis?.minValue === \"min\" ? \"dataMin\" : xAxis?.minValue,\n      },\n    };\n  }, [\n    xAxis?.labelFormatter,\n    xAxis?.labelRotation,\n    xAxis?.name,\n    xAxis?.type,\n    xAxis?.maxValue,\n    xAxis?.minValue,\n  ]);\n\n  const chartYAxis = useMemo<Pick<EChartsOption, \"yAxis\">>(() => {\n    if (!yAxis || !Array.isArray(yAxis)) {\n      return {\n        yAxis: {\n          id: yAxis?.id,\n          type: getAxisType(yAxis?.type) ?? \"value\",\n          name: yAxis?.name,\n          axisLabel: {\n            rotate: yAxis?.labelRotation ?? 0,\n            formatter: yAxis?.labelFormatter,\n          },\n          max: yAxis?.maxValue === \"max\" ? \"dataMax\" : yAxis?.maxValue,\n          min: yAxis?.minValue === \"min\" ? \"dataMin\" : yAxis?.minValue,\n        },\n      };\n    }\n\n    return {\n      yAxis: yAxis.map<YAXisComponentOption>((axis) => ({\n        id: axis?.id,\n        type: getAxisType(axis?.type) ?? \"value\",\n        name: axis?.name,\n        axisLabel: {\n          rotate: axis?.labelRotation ?? 0,\n          formatter: axis?.labelFormatter,\n        },\n        max: axis?.maxValue === \"max\" ? \"dataMax\" : axis?.maxValue,\n        min: axis?.minValue === \"min\" ? \"dataMin\" : axis?.minValue,\n      })),\n    };\n  }, [yAxis]);\n\n  const getMeasure = (name: string, msr: MeasuresField | MeasuresField[]) => {\n    const measureName = name.split(\"_\")[0];\n    const measuresArray = Array.isArray(msr) ? msr : [msr];\n    // find the measure in measures array or return the first one\n    return (\n      measuresArray.find((m) => {\n        if (typeof m === \"string\") {\n          return m === measureName;\n        }\n        return m.field === measureName;\n      }) ?? measuresArray[0]\n    );\n  };\n\n  const chartSeries = useMemo<Pick<EChartsOption, \"series\">>(() => {\n    return {\n      series: chartData\n        .columnNames()\n        .filter((c) => c !== groupByKey)\n        .map<LineSeriesOption>((c) => {\n          const measure = getMeasure(c, measures);\n\n          const showSymbol =\n            typeof measure !== \"string\" ? !measure.hideSymbol : true;\n          const sampling =\n            typeof measure !== \"string\" ? measure.sampling : undefined;\n          const yAxisId =\n            typeof measure !== \"string\" ? measure.yAxis : undefined;\n          const isArea =\n            typeof measure !== \"string\" ? measure.area ?? area : area;\n          const aOpacity =\n            typeof measure !== \"string\"\n              ? measure.areaOpacity ?? areaOpacity\n              : areaOpacity;\n          const stackName =\n            typeof measure !== \"string\"\n              ? measure.stack ?? stack ?? undefined\n              : stack ?? undefined;\n          const connectNulls =\n            typeof measure !== \"string\" && measure.emptyCellMode\n              ? measure.emptyCellMode === \"connect\"\n              : emptyCellMode === \"connect\";\n\n          return {\n            id: `series~${groupByKey}~${c}`,\n            name: seriesNameFormatter ? seriesNameFormatter(c) : c,\n            encode: { x: groupByKey, y: c },\n            type: \"line\",\n            showSymbol,\n            sampling,\n            areaStyle: isArea ? { opacity: aOpacity } : undefined,\n            connectNulls,\n            stack: stackName,\n            yAxisId,\n          };\n        }),\n    };\n  }, [\n    chartData,\n    groupByKey,\n    area,\n    stack,\n    seriesNameFormatter,\n    emptyCellMode,\n    areaOpacity,\n    measures,\n  ]);\n\n  const renderTooltip = (\n    params: {\n      seriesName: string;\n      value: (string | number)[];\n      encode: { [key: string]: number[] };\n      color: string;\n      dimensionNames: string[];\n    }[],\n    single: boolean,\n    msr: MeasuresField | MeasuresField[],\n    cls?: typeof classes,\n    formatter?: (value?: string | number) => string\n  ) => {\n    const tooltipTitle = params[0].value[params[0].encode.x[0]];\n\n    if (single) {\n      const measure = getMeasure(\n        params[0].dimensionNames[params[0].encode.y[0]],\n        msr\n      );\n      const value = params[0].value[params[0].encode.y[0]];\n      const formattedValue =\n        typeof measure !== \"string\" && measure.valueFormatter\n          ? measure.valueFormatter(value)\n          : formatter\n          ? formatter(value)\n          : value;\n\n      return `\n        <div class=\"${cls?.singleTooltipRoot}\">\n          <p class=\"${cls?.singleTooltipTitle}\">${tooltipTitle}</p>\n          <p class=\"${cls?.singleTooltipValue}\">${formattedValue}</p>\n        </div>\n        `;\n    }\n\n    return `\n    <div class=\"${cls?.multipleTooltipRoot}\">\n      <div class=\"${cls?.multipleTooltipTitleContainer}\">\n        <div>\n          <p class=\"${cls?.multipleTooltipTitle}\">${tooltipTitle}</p>\n        </div>\n      </div>\n      <div class=\"${cls?.multipleTooltipValuesContainer}\">\n        ${params\n          .map((s) => {\n            const measure = getMeasure(s.dimensionNames[s.encode.y[0]], msr);\n            const value = s.value[s.encode.y[0]];\n            const formattedValue =\n              typeof measure !== \"string\" && measure.valueFormatter\n                ? measure.valueFormatter(value)\n                : formatter\n                ? formatter(value)\n                : value;\n\n            return `\n            <div key=\"${s.seriesName}\" class=\"${cls?.multipleTooltipSeriesContainer}\">\n              <div class=\"${cls?.multipleTooltipSeriesNameContainer}\">\n                <p style=\"background-color: ${s.color};\" class=\"${cls?.multipleTooltipSeriesColor}\" />\n                <p class=\"${cls?.multipleTooltipSeriesName}\">${s.seriesName}</p>\n              </div>\n              <p class=\"${cls?.multipleTooltipSeriesValue}\">${formattedValue}</p>\n            </div>\n          `;\n          })\n          .join(\" \")}\n      </div>\n    </div>\n    `;\n  };\n\n  const chartTooltip = useMemo<Pick<EChartsOption, \"tooltip\">>(() => {\n    return {\n      tooltip: {\n        confine: false,\n        show: tooltip?.show ?? true,\n        trigger: \"axis\",\n        position: (point, params, dom, rect, size) => {\n          return [point[0], point[1] - size.contentSize[1]];\n        },\n        formatter: (params) =>\n          renderTooltip(\n            params,\n            tooltip?.type === \"single\",\n            measures,\n            classes,\n            tooltip?.valueFormatter\n          ),\n      },\n    };\n  }, [\n    tooltip?.show,\n    tooltip?.valueFormatter,\n    tooltip?.type,\n    classes,\n    measures,\n  ]);\n\n  const chartLegend = useMemo<Pick<EChartsOption, \"legend\">>(() => {\n    return {\n      legend: {\n        show:\n          legend?.show ??\n          (Array.isArray(chartSeries.series) && chartSeries.series.length > 1),\n        itemGap: 20,\n        data:\n          legend?.show !== false && Array.isArray(chartSeries.series)\n            ? chartSeries.series.map((s) => {\n                return {\n                  name: s.name as string,\n                  icon: getLegendIcon((s as any).areaStyle != null),\n                };\n              })\n            : undefined,\n      },\n    };\n  }, [chartSeries, legend?.show]);\n\n  const chartHorizontalRangerSlider = useMemo<\n    Pick<EChartsOption, \"dataZoom\">\n  >(() => {\n    return {\n      dataZoom: [\n        {\n          show: horizontalRangeSlider?.show ?? false,\n          type: \"slider\",\n          orient: \"horizontal\",\n        },\n        {\n          show: horizontalRangeSlider?.show ?? false,\n          type: \"inside\",\n          orient: \"horizontal\",\n          zoomOnMouseWheel: \"shift\",\n          moveOnMouseWheel: true,\n        },\n      ],\n    };\n  }, [horizontalRangeSlider?.show]);\n\n  const chartGrid = useMemo(() => {\n    return {\n      // if no value is defined we shouldn't pass anything because echarts doesn't behave well otherwise\n      grid: {\n        ...(grid?.top != null && {\n          top: grid.top,\n        }),\n        ...(grid?.bottom != null && {\n          bottom: grid.bottom,\n        }),\n        ...(grid?.left != null && {\n          left: grid.left,\n        }),\n        ...(grid?.right != null && {\n          right: grid.right,\n        }),\n      },\n    };\n  }, [grid?.bottom, grid?.left, grid?.right, grid?.top]);\n\n  const [initialOption, setInitialOption] = useState<EChartsOption>({\n    aria: {\n      enabled: true,\n    },\n    animation: false,\n    ...chartDataset,\n    ...chartXAxis,\n    ...chartYAxis,\n    ...chartSeries,\n    ...chartTooltip,\n    ...chartLegend,\n    ...chartHorizontalRangerSlider,\n    ...chartGrid,\n  });\n\n  useEffect(() => {\n    if (!isMounted.current) {\n      isMounted.current = true;\n      return;\n    }\n\n    // when the theme changes echarts destroys the chart and mounts it again\n    // thus we need to reset the initial option\n    if (theme !== currentTheme.current) {\n      setInitialOption({\n        aria: {\n          enabled: true,\n        },\n        animation: false,\n        ...chartDataset,\n        ...chartXAxis,\n        ...chartYAxis,\n        ...chartSeries,\n        ...chartTooltip,\n        ...chartLegend,\n        ...chartHorizontalRangerSlider,\n        ...chartGrid,\n      });\n      currentTheme.current = theme;\n      return;\n    }\n\n    chartRef.current?.getEchartsInstance().setOption(\n      {\n        ...chartDataset,\n        ...chartXAxis,\n        ...chartYAxis,\n        ...chartSeries,\n        ...chartLegend,\n        ...chartTooltip,\n        ...chartHorizontalRangerSlider,\n        ...chartGrid,\n      },\n      {\n        replaceMerge: [\"xAxis\", \"yAxis\", \"series\", \"dataset\"],\n      }\n    );\n  }, [\n    theme,\n    chartDataset,\n    chartXAxis,\n    chartYAxis,\n    chartSeries,\n    chartLegend,\n    chartTooltip,\n    chartHorizontalRangerSlider,\n    chartGrid,\n  ]);\n\n  return (\n    <ReactECharts\n      ref={chartRef}\n      echarts={echarts}\n      option={initialOption}\n      theme={theme}\n      notMerge\n    />\n  );\n};\n"],"names":["echarts","use","LineChart","CanvasRenderer","DatasetComponent","GridComponent","AriaComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","HvLineChart","data","groupBy","splitBy","measures","sortBy","xAxis","yAxis","legend","tooltip","seriesNameFormatter","area","stack","emptyCellMode","horizontalRangeSlider","areaOpacity","classes","classesProp","grid","theme","useVizTheme","useClasses","currentTheme","useRef","chartRef","isMounted","groupByKey","Array","isArray","join","chartData","useMemo","tableData","internal","ColumnTable","from","table","groupByFields","splitByFields","measuresFields","getAgFunc","reduce","acc","value","field","agFunction","agg","sortByFields","orderFunction","order","allFields","Object","keys","select","length","groupby","pivot","rollup","expression","map","derive","after","orderby","filter","key","includes","desc","not","chartDataset","dataset","source","columnNames","c","array","chartXAxis","type","getAxisType","name","scale","axisLabel","rotate","labelRotation","formatter","labelFormatter","max","maxValue","min","minValue","chartYAxis","id","axis","getMeasure","msr","measureName","split","measuresArray","find","m","chartSeries","series","measure","showSymbol","hideSymbol","sampling","undefined","yAxisId","isArea","aOpacity","stackName","connectNulls","encode","x","y","areaStyle","opacity","renderTooltip","params","single","cls","tooltipTitle","dimensionNames","formattedValue","valueFormatter","singleTooltipRoot","singleTooltipTitle","singleTooltipValue","multipleTooltipRoot","multipleTooltipTitleContainer","multipleTooltipTitle","multipleTooltipValuesContainer","s","seriesName","multipleTooltipSeriesContainer","multipleTooltipSeriesNameContainer","color","multipleTooltipSeriesColor","multipleTooltipSeriesName","multipleTooltipSeriesValue","chartTooltip","confine","show","trigger","position","point","dom","rect","size","contentSize","chartLegend","itemGap","icon","getLegendIcon","chartHorizontalRangerSlider","dataZoom","orient","zoomOnMouseWheel","moveOnMouseWheel","chartGrid","top","bottom","left","right","initialOption","setInitialOption","useState","aria","enabled","animation","useEffect","current","getEchartsInstance","setOption","replaceMerge","ReactECharts","ref","option","notMerge"],"mappings":"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"}
+{"version":3,"file":"LineChart.js","sources":["../../../../src/components/LineChart/LineChart.tsx"],"sourcesContent":["import {\n  HvBaseChart,\n  HvBaseChartClasses,\n  HvBaseChartCommonProps,\n  HvBaseChartLineProps,\n} from \"../BaseChart\";\n\nexport interface HvLineChartClasses extends HvBaseChartClasses {}\n\nexport interface HvLineChartProps\n  extends HvBaseChartCommonProps,\n    HvBaseChartLineProps {\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvLineChartClasses;\n}\n\n/**\n * A line chart or line plot or line graph is a type of chart which displays information as a series of data points\n * connected by straight line segments. It is a basic type of chart common in many fields.\n */\nexport const HvLineChart = ({\n  area = false,\n  emptyCellMode = \"void\",\n  areaOpacity = 0.5,\n  ...others\n}: HvLineChartProps) => {\n  return (\n    <HvBaseChart\n      type=\"line\"\n      area={area}\n      emptyCellMode={emptyCellMode}\n      areaOpacity={areaOpacity}\n      {...others}\n    />\n  );\n};\n"],"names":["HvLineChart","area","emptyCellMode","areaOpacity","others","HvBaseChart","type"],"mappings":";;AAoBO,MAAMA,cAAcA,CAAC;AAAA,EAC1BC,OAAO;AAAA,EACPC,gBAAgB;AAAA,EAChBC,cAAc;AAAA,EACd,GAAGC;AACa,MAAM;AACtB,6BACGC,aAAW;AAAA,IACVC,MAAK;AAAA,IACLL;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IAAyB,GACrBC;AAAAA,EAAAA,CACL;AAEL;"}

package/dist/esm/index.js

@@ -1,6 +1,8 @@
 import { HvLineChart } from "./components/LineChart/LineChart.js";
+import { HvBarChart } from "./components/BarChart/BarChart.js";
 import { HvVizContext, HvVizProvider } from "./providers/Provider.js";
 export {
+  HvBarChart,
   HvLineChart,
   HvVizContext,
   HvVizProvider

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/providers/Provider.js

@@ -1,5 +1,5 @@
 import { useTheme } from "@hitachivantara/uikit-react-core";
-import * as echarts from "echarts/core";
+import { registerThemes } from "../utils/registerThemes.js";
 import { createContext, useState, useEffect, useMemo } from "react";
 import { jsx } from "@emotion/react/jsx-runtime";
 const HvVizContext = createContext({
@@ -15,88 +15,6 @@ const HvVizProvider = ({
     selectedTheme
   } = useTheme();
   const [theme, setTheme] = useState();
-  const registerThemes = (themeName, modes, themeStructure) => {
-    modes.forEach((mode) => {
-      const baseText = {
-        color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].secondary,
-        fontWeight: themeStructure == null ? void 0 : themeStructure.fontWeights.normal,
-        fontSize: themeStructure == null ? void 0 : themeStructure.fontSizes.sm,
-        fontFamily: themeStructure == null ? void 0 : themeStructure.fontFamily.body
-      };
-      const customAxis = {
-        nameTextStyle: {
-          ...baseText
-        },
-        axisLine: {
-          show: true,
-          lineStyle: {
-            color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].atmo3
-          }
-        },
-        axisTick: {
-          show: true,
-          lineStyle: {
-            color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].atmo3
-          }
-        },
-        axisLabel: {
-          color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].secondary_80,
-          fontWeight: themeStructure == null ? void 0 : themeStructure.fontWeights.normal,
-          fontSize: themeStructure == null ? void 0 : themeStructure.fontSizes.sm,
-          fontFamily: themeStructure == null ? void 0 : themeStructure.fontFamily.body
-        },
-        splitLine: {
-          show: true,
-          lineStyle: {
-            color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].atmo3
-          }
-        }
-      };
-      echarts.registerTheme(`${themeName}-${mode}`, {
-        color: [themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat1, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat2, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat3, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat4, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat5, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat6],
-        legend: {
-          textStyle: {
-            ...baseText
-          }
-        },
-        tooltip: {
-          borderWidth: 0,
-          padding: 0,
-          textStyle: {
-            ...baseText
-          },
-          axisPointer: {
-            lineStyle: {
-              color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].secondary,
-              width: 1
-            }
-          }
-        },
-        dataZoom: {
-          textStyle: {
-            ...baseText
-          }
-        },
-        categoryAxis: {
-          ...customAxis
-        },
-        valueAxis: {
-          ...customAxis
-        },
-        logAxis: {
-          ...customAxis
-        },
-        timeAxis: {
-          ...customAxis
-        },
-        line: {
-          lineStyle: {
-            width: 2
-          }
-        }
-      });
-    });
-  };
   useEffect(() => {
     registerThemes(selectedTheme, colorModes, activeTheme);
   }, [selectedTheme, colorModes, activeTheme]);

package/dist/esm/providers/Provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","sources":["../../../src/providers/Provider.tsx"],"sourcesContent":["import { HvTheme, useTheme } from \"@hitachivantara/uikit-react-core\";\nimport * as echarts from \"echarts/core\";\nimport { createContext, useEffect, useMemo, useState } from \"react\";\n\nexport interface HvVizContextValue {\n  /**\n   * Current theme\n   */\n  theme?: string;\n}\n\nexport const HvVizContext = createContext<HvVizContextValue>({\n  theme: undefined,\n});\n\nexport interface HvVizProviderProps {\n  /**\n   * Component tree.\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * Enables theming capabilities for visualizations.\n *\n * Without this provider the visualizations will not comply to the UI Kit themes.\n *\n * This provider should always be used in combination with the `HvProvider` from\n * the core package since the former uses the themes provided by the latter.\n *\n * `HvVizProvider` should always be used after `HvProvider` like so to work properly:\n *\n * ```\n * <HvProvider>\n *    <HvVizProvider>\n *        (...)\n *    </HvVizProvider>\n * </HvProvider>\n * ```\n */\nexport const HvVizProvider = ({ children }: HvVizProviderProps) => {\n  const { activeTheme, colorModes, selectedMode, selectedTheme } = useTheme();\n\n  const [theme, setTheme] = useState<string | undefined>();\n\n  const registerThemes = (\n    themeName: string,\n    modes: string[],\n    themeStructure?: HvTheme\n  ) => {\n    modes.forEach((mode) => {\n      const baseText = {\n        color: themeStructure?.colors.modes[mode].secondary,\n        fontWeight: themeStructure?.fontWeights.normal,\n        fontSize: themeStructure?.fontSizes.sm,\n        fontFamily: themeStructure?.fontFamily.body,\n      };\n\n      const customAxis = {\n        nameTextStyle: {\n          ...baseText,\n        },\n        axisLine: {\n          show: true,\n          lineStyle: {\n            color: themeStructure?.colors.modes[mode].atmo3,\n          },\n        },\n        axisTick: {\n          show: true,\n          lineStyle: {\n            color: themeStructure?.colors.modes[mode].atmo3,\n          },\n        },\n        axisLabel: {\n          color: themeStructure?.colors.modes[mode].secondary_80,\n          fontWeight: themeStructure?.fontWeights.normal,\n          fontSize: themeStructure?.fontSizes.sm,\n          fontFamily: themeStructure?.fontFamily.body,\n        },\n        splitLine: {\n          show: true,\n          lineStyle: {\n            color: themeStructure?.colors.modes[mode].atmo3,\n          },\n        },\n      };\n\n      echarts.registerTheme(`${themeName}-${mode}`, {\n        color: [\n          themeStructure?.colors.modes[mode].cat1,\n          themeStructure?.colors.modes[mode].cat2,\n          themeStructure?.colors.modes[mode].cat3,\n          themeStructure?.colors.modes[mode].cat4,\n          themeStructure?.colors.modes[mode].cat5,\n          themeStructure?.colors.modes[mode].cat6,\n        ],\n        legend: {\n          textStyle: {\n            ...baseText,\n          },\n        },\n        tooltip: {\n          borderWidth: 0,\n          padding: 0,\n          textStyle: {\n            ...baseText,\n          },\n          axisPointer: {\n            lineStyle: {\n              color: themeStructure?.colors.modes[mode].secondary,\n              width: 1,\n            },\n          },\n        },\n        dataZoom: {\n          textStyle: { ...baseText },\n        },\n        categoryAxis: {\n          ...customAxis,\n        },\n        valueAxis: {\n          ...customAxis,\n        },\n        logAxis: {\n          ...customAxis,\n        },\n        timeAxis: {\n          ...customAxis,\n        },\n        line: {\n          lineStyle: {\n            width: 2,\n          },\n        },\n      });\n    });\n  };\n\n  useEffect(() => {\n    registerThemes(selectedTheme, colorModes, activeTheme);\n  }, [selectedTheme, colorModes, activeTheme]);\n\n  useEffect(() => {\n    setTheme(`${selectedTheme}-${selectedMode}`);\n  }, [selectedMode, selectedTheme]);\n\n  const value = useMemo<HvVizContextValue>(\n    () => ({\n      theme,\n    }),\n    [theme]\n  );\n\n  return (\n    <HvVizContext.Provider value={value}>{children}</HvVizContext.Provider>\n  );\n};\n"],"names":["HvVizContext","createContext","theme","undefined","HvVizProvider","children","activeTheme","colorModes","selectedMode","selectedTheme","useTheme","setTheme","useState","registerThemes","themeName","modes","themeStructure","forEach","mode","baseText","color","colors","secondary","fontWeight","fontWeights","normal","fontSize","fontSizes","sm","fontFamily","body","customAxis","nameTextStyle","axisLine","show","lineStyle","atmo3","axisTick","axisLabel","secondary_80","splitLine","registerTheme","cat1","cat2","cat3","cat4","cat5","cat6","legend","textStyle","tooltip","borderWidth","padding","axisPointer","width","dataZoom","categoryAxis","valueAxis","logAxis","timeAxis","line","useEffect","value","useMemo","_jsx","Provider"],"mappings":"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"}
+{"version":3,"file":"Provider.js","sources":["../../../src/providers/Provider.tsx"],"sourcesContent":["import { useTheme } from \"@hitachivantara/uikit-react-core\";\nimport { registerThemes } from \"@viz/utils\";\nimport { createContext, useEffect, useMemo, useState } from \"react\";\n\nexport interface HvVizContextValue {\n  /**\n   * Current theme\n   */\n  theme?: string;\n}\n\nexport const HvVizContext = createContext<HvVizContextValue>({\n  theme: undefined,\n});\n\nexport interface HvVizProviderProps {\n  /**\n   * Component tree.\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * Enables theming capabilities for visualizations.\n *\n * Without this provider the visualizations will not comply to the UI Kit themes.\n *\n * This provider should always be used in combination with the `HvProvider` from\n * the core package since the former uses the themes provided by the latter.\n *\n * `HvVizProvider` should always be used after `HvProvider` like so to work properly:\n *\n * ```\n * <HvProvider>\n *    <HvVizProvider>\n *        (...)\n *    </HvVizProvider>\n * </HvProvider>\n * ```\n */\nexport const HvVizProvider = ({ children }: HvVizProviderProps) => {\n  const { activeTheme, colorModes, selectedMode, selectedTheme } = useTheme();\n\n  const [theme, setTheme] = useState<string | undefined>();\n\n  useEffect(() => {\n    registerThemes(selectedTheme, colorModes, activeTheme);\n  }, [selectedTheme, colorModes, activeTheme]);\n\n  useEffect(() => {\n    setTheme(`${selectedTheme}-${selectedMode}`);\n  }, [selectedMode, selectedTheme]);\n\n  const value = useMemo<HvVizContextValue>(\n    () => ({\n      theme,\n    }),\n    [theme]\n  );\n\n  return (\n    <HvVizContext.Provider value={value}>{children}</HvVizContext.Provider>\n  );\n};\n"],"names":["HvVizContext","createContext","theme","undefined","HvVizProvider","children","activeTheme","colorModes","selectedMode","selectedTheme","useTheme","setTheme","useState","useEffect","value","useMemo","_jsx","Provider"],"mappings":";;;;AAWO,MAAMA,eAAeC,cAAiC;AAAA,EAC3DC,OAAOC;AACT,CAAC;AA2BM,MAAMC,gBAAgBA,CAAC;AAAA,EAAEC;AAA6B,MAAM;AAC3D,QAAA;AAAA,IAAEC;AAAAA,IAAaC;AAAAA,IAAYC;AAAAA,IAAcC;AAAAA,MAAkBC,SAAS;AAE1E,QAAM,CAACR,OAAOS,QAAQ,IAAIC,SAA6B;AAEvDC,YAAU,MAAM;AACCJ,mBAAAA,eAAeF,YAAYD,WAAW;AAAA,EACpD,GAAA,CAACG,eAAeF,YAAYD,WAAW,CAAC;AAE3CO,YAAU,MAAM;AACJ,aAAA,GAAEJ,iBAAiBD,cAAc;AAAA,EAAA,GAC1C,CAACA,cAAcC,aAAa,CAAC;AAE1BK,QAAAA,QAAQC,QACZ,OAAO;AAAA,IACLb;AAAAA,EAAAA,IAEF,CAACA,KAAK,CACR;AAGEc,SAAAA,oBAAChB,aAAaiB,UAAQ;AAAA,IAACH;AAAAA,IAAaT;AAAAA,EAAAA,CAAkC;AAE1E;"}