@hitachivantara/uikit-react-viz 5.2.8 → 5.3.1

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

@@ -1,17 +1,94 @@
+import { useMemo } from "react";
+import * as echarts from "echarts/core";
+import { LineChart } from "echarts/charts";
+import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent } from "echarts/components";
+import { useDataZoom } from "../../hooks/useDataZoom.js";
+import { useXAxis } from "../../hooks/useXAxis.js";
+import { useYAxis } from "../../hooks/useYAxis.js";
+import { useGrid } from "../../hooks/useGrid.js";
+import { useData } from "../../hooks/useData.js";
+import { useDataset } from "../../hooks/useDataset.js";
+import { useSeries } from "../../hooks/useSeries.js";
+import { useLegend } from "../../hooks/useLegend.js";
 import { jsx } from "@emotion/react/jsx-runtime";
+import { useTooltip } from "../../hooks/tooltip/useTooltip.js";
 import { HvBaseChart } from "../BaseChart/BaseChart.js";
+echarts.use([LineChart, DatasetComponent, GridComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent]);
 const HvLineChart = ({
   area = false,
   emptyCellMode = "void",
   areaOpacity = 0.5,
-  ...others
+  yAxis,
+  xAxis,
+  horizontalRangeSlider,
+  grid,
+  data,
+  groupBy,
+  splitBy,
+  sortBy,
+  measures,
+  stack,
+  seriesNameFormatter,
+  legend,
+  classes,
+  tooltip
 }) => {
-  return /* @__PURE__ */ jsx(HvBaseChart, {
+  const chartData = useData({
+    data,
+    groupBy,
+    measures,
+    splitBy,
+    sortBy
+  });
+  const chartDataset = useDataset(chartData);
+  const chartYAxis = useYAxis({
+    yAxis
+  });
+  const chartXAxis = useXAxis({
+    xAxis,
+    scale: true
+  });
+  const chartSlider = useDataZoom({
+    showHorizontal: horizontalRangeSlider == null ? void 0 : horizontalRangeSlider.show
+  });
+  const chartGrid = useGrid({
+    ...grid
+  });
+  const chartSeries = useSeries({
     type: "line",
+    data: chartData,
+    groupBy,
+    measures,
     area,
-    emptyCellMode,
     areaOpacity,
-    ...others
+    emptyCellMode,
+    stack,
+    nameFormatter: seriesNameFormatter
+  });
+  const chartLegend = useLegend({
+    ...legend,
+    series: chartSeries.series
+  });
+  const chartTooltip = useTooltip({
+    ...tooltip,
+    trigger: "axis",
+    measures,
+    classes
+  });
+  const options = useMemo(() => {
+    return {
+      ...chartYAxis,
+      ...chartXAxis,
+      ...chartSlider,
+      ...chartGrid,
+      ...chartDataset,
+      ...chartSeries,
+      ...chartLegend,
+      ...chartTooltip
+    };
+  }, [chartXAxis, chartYAxis, chartSlider, chartGrid, chartDataset, chartSeries, chartLegend, chartTooltip]);
+  return /* @__PURE__ */ jsx(HvBaseChart, {
+    options
   });
 };
 export {

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

@@ -1 +1 @@
-{"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;"}
+{"version":3,"file":"LineChart.js","sources":["../../../../src/components/LineChart/LineChart.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport * as echarts from \"echarts/core\";\nimport { LineChart } from \"echarts/charts\";\nimport {\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n  DataZoomSliderComponent,\n  DataZoomInsideComponent,\n} from \"echarts/components\";\n\nimport {\n  useYAxis,\n  useXAxis,\n  useDataZoom,\n  useGrid,\n  useData,\n  useDataset,\n  useSeries,\n  useLegend,\n  useTooltip,\n  HvChartTooltipClasses,\n} from \"@viz/hooks\";\n\nimport { HvChartEmptyCellMode, HvLineChartMeasures } from \"../../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../../types/common\";\n\n// Register chart components\necharts.use([\n  LineChart,\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n  DataZoomSliderComponent,\n  DataZoomInsideComponent,\n]);\n\nexport interface HvLineChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvLineChartProps\n  extends HvAxisChartCommonProps,\n    HvChartCommonProps {\n  /**  Columns to measure on the chart. */\n  measures: Arrayable<HvLineChartMeasures>;\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  /** 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  yAxis,\n  xAxis,\n  horizontalRangeSlider,\n  grid,\n  data,\n  groupBy,\n  splitBy,\n  sortBy,\n  measures,\n  stack,\n  seriesNameFormatter,\n  legend,\n  classes,\n  tooltip,\n}: HvLineChartProps) => {\n  const chartData = useData({ data, groupBy, measures, splitBy, sortBy });\n\n  const chartDataset = useDataset(chartData);\n\n  const chartYAxis = useYAxis({ yAxis });\n\n  const chartXAxis = useXAxis({ xAxis, scale: true });\n\n  const chartSlider = useDataZoom({\n    showHorizontal: horizontalRangeSlider?.show,\n  });\n\n  const chartGrid = useGrid({ ...grid });\n\n  const chartSeries = useSeries({\n    type: \"line\",\n    data: chartData,\n    groupBy,\n    measures,\n    area,\n    areaOpacity,\n    emptyCellMode,\n    stack,\n    nameFormatter: seriesNameFormatter,\n  });\n\n  const chartLegend = useLegend({\n    ...legend,\n    series: chartSeries.series,\n  });\n\n  const chartTooltip = useTooltip({\n    ...tooltip,\n    trigger: \"axis\",\n    measures,\n    classes,\n  });\n\n  const options = useMemo(() => {\n    return {\n      ...chartYAxis,\n      ...chartXAxis,\n      ...chartSlider,\n      ...chartGrid,\n      ...chartDataset,\n      ...chartSeries,\n      ...chartLegend,\n      ...chartTooltip,\n    };\n  }, [\n    chartXAxis,\n    chartYAxis,\n    chartSlider,\n    chartGrid,\n    chartDataset,\n    chartSeries,\n    chartLegend,\n    chartTooltip,\n  ]);\n\n  return <HvBaseChart options={options} />;\n};\n"],"names":["echarts","use","LineChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","HvLineChart","area","emptyCellMode","areaOpacity","yAxis","xAxis","horizontalRangeSlider","grid","data","groupBy","splitBy","sortBy","measures","stack","seriesNameFormatter","legend","classes","tooltip","chartData","useData","chartDataset","useDataset","chartYAxis","useYAxis","chartXAxis","useXAxis","scale","chartSlider","useDataZoom","showHorizontal","show","chartGrid","useGrid","chartSeries","useSeries","type","nameFormatter","chartLegend","useLegend","series","chartTooltip","useTooltip","trigger","options","useMemo","HvBaseChart"],"mappings":";;;;;;;;;;;;;;;AAiCAA,QAAQC,IAAI,CACVC,WACAC,kBACAC,eACAC,kBACAC,iBACAC,yBACAC,uBAAuB,CACxB;AAuBM,MAAMC,cAAcA,CAAC;AAAA,EAC1BC,OAAO;AAAA,EACPC,gBAAgB;AAAA,EAChBC,cAAc;AAAA,EACdC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACgB,MAAM;AACtB,QAAMC,YAAYC,QAAQ;AAAA,IAAEX;AAAAA,IAAMC;AAAAA,IAASG;AAAAA,IAAUF;AAAAA,IAASC;AAAAA,EAAAA,CAAQ;AAEhES,QAAAA,eAAeC,WAAWH,SAAS;AAEzC,QAAMI,aAAaC,SAAS;AAAA,IAAEnB;AAAAA,EAAAA,CAAO;AAErC,QAAMoB,aAAaC,SAAS;AAAA,IAAEpB;AAAAA,IAAOqB,OAAO;AAAA,EAAA,CAAM;AAElD,QAAMC,cAAcC,YAAY;AAAA,IAC9BC,gBAAgBvB,+DAAuBwB;AAAAA,EAAAA,CACxC;AAED,QAAMC,YAAYC,QAAQ;AAAA,IAAE,GAAGzB;AAAAA,EAAAA,CAAM;AAErC,QAAM0B,cAAcC,UAAU;AAAA,IAC5BC,MAAM;AAAA,IACN3B,MAAMU;AAAAA,IACNT;AAAAA,IACAG;AAAAA,IACAX;AAAAA,IACAE;AAAAA,IACAD;AAAAA,IACAW;AAAAA,IACAuB,eAAetB;AAAAA,EAAAA,CAChB;AAED,QAAMuB,cAAcC,UAAU;AAAA,IAC5B,GAAGvB;AAAAA,IACHwB,QAAQN,YAAYM;AAAAA,EAAAA,CACrB;AAED,QAAMC,eAAeC,WAAW;AAAA,IAC9B,GAAGxB;AAAAA,IACHyB,SAAS;AAAA,IACT9B;AAAAA,IACAI;AAAAA,EAAAA,CACD;AAEK2B,QAAAA,UAAUC,QAAQ,MAAM;AACrB,WAAA;AAAA,MACL,GAAGtB;AAAAA,MACH,GAAGE;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGX;AAAAA,MACH,GAAGa;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGG;AAAAA,IAAAA;AAAAA,EACL,GACC,CACDhB,YACAF,YACAK,aACAI,WACAX,cACAa,aACAI,aACAG,YAAY,CACb;AAED,6BAAQK,aAAW;AAAA,IAACF;AAAAA,EAAAA,CAAmB;AACzC;"}

package/dist/esm/{components/BaseChart/BaseChart.styles.js → hooks/tooltip/styles.js}

@@ -2,7 +2,7 @@ import { createClasses, theme } from "@hitachivantara/uikit-react-core";
 const {
   useClasses,
   staticClasses
-} = createClasses("HvBaseChart", {
+} = createClasses("HvChartTooltip", {
   /** Single tooltip styles */
   singleTooltipRoot: {
     width: "fit-content",
@@ -82,4 +82,4 @@ export {
   staticClasses,
   useClasses
 };
-//# sourceMappingURL=BaseChart.styles.js.map
+//# sourceMappingURL=styles.js.map

package/dist/esm/hooks/tooltip/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../src/hooks/tooltip/styles.tsx"],"sourcesContent":["import { theme, createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvChartTooltip\", {\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,kBAAkB;AAAA;AAAA,EAE3EC,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/hooks/tooltip/useTooltip.js

@@ -0,0 +1,98 @@
+import { useCallback, useMemo } from "react";
+import { getMeasure } from "../../utils/getMeasure.js";
+import { useClasses } from "./styles.js";
+const useTooltip = ({
+  measures,
+  classes,
+  component,
+  show = true,
+  horizontal = false,
+  trigger = "item",
+  type = "multiple",
+  valueFormatter,
+  titleFormatter,
+  nameFormatter
+}) => {
+  const {
+    classes: hvClasses
+  } = useClasses(classes);
+  const renderTooltip = useCallback((params) => {
+    const title = params[0].seriesType === "pie" ? params[0].seriesName : horizontal ? params[0].value[params[0].encode.y[0]] : params[0].value[params[0].encode.x[0]];
+    const formattedTitle = titleFormatter ? titleFormatter(title) : title;
+    if (type === "single") {
+      const measure = getMeasure(params[0].seriesType === "pie" ? params[0].name : horizontal ? params[0].dimensionNames[params[0].encode.x[0]] : params[0].dimensionNames[params[0].encode.y[0]], measures);
+      const value = params[0].seriesType === "pie" ? params[0].value[params[0].encode.value[0]] : horizontal ? params[0].value[params[0].encode.x[0]] : params[0].value[params[0].encode.y[0]];
+      const formattedValue = typeof measure !== "string" && measure.valueFormatter ? measure.valueFormatter(value) : valueFormatter ? valueFormatter(value) : value;
+      return `
+            <div class="${hvClasses == null ? void 0 : hvClasses.singleTooltipRoot}">
+              <p class="${hvClasses == null ? void 0 : hvClasses.singleTooltipTitle}">${formattedTitle}</p>
+              <p class="${hvClasses == null ? void 0 : hvClasses.singleTooltipValue}">${formattedValue}</p>
+            </div>
+            `;
+    }
+    return `
+        <div class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipRoot}">
+          <div class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipTitleContainer}">
+            <div>
+              <p class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipTitle}">${formattedTitle}</p>
+            </div>
+          </div>
+          <div class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipValuesContainer}">
+            ${params.map((s) => {
+      const measure = getMeasure(s.seriesType === "pie" ? s.name : horizontal ? s.dimensionNames[s.encode.x[0]] : s.dimensionNames[s.encode.y[0]], measures);
+      const value = s.seriesType === "pie" ? s.value[s.encode.value[0]] : horizontal ? s.value[s.encode.x[0]] : s.value[s.encode.y[0]];
+      const formattedValue = typeof measure !== "string" && measure.valueFormatter ? measure.valueFormatter(value) : valueFormatter ? valueFormatter(value) : value;
+      const name = s.seriesType === "pie" ? s.name : s.seriesName;
+      const formattedName = nameFormatter ? nameFormatter(name) : name;
+      return `
+                <div key="${s.seriesName}" class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipSeriesContainer}">
+                  <div class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipSeriesNameContainer}">
+                    <p style="background-color: ${s.color};" class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipSeriesColor}" />
+                    <p class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipSeriesName}">${formattedName}</p>
+                  </div>
+                  <p class="${hvClasses == null ? void 0 : hvClasses.multipleTooltipSeriesValue}">${formattedValue}</p>
+                </div>
+              `;
+    }).join(" ")}
+          </div>
+        </div>
+        `;
+  }, [hvClasses, horizontal, type, measures, nameFormatter, titleFormatter, valueFormatter]);
+  const renderCustomTooltip = useCallback((params) => {
+    if (typeof component === "function") {
+      const values = {
+        title: params[0].seriesType === "pie" ? params[0].seriesName : horizontal ? params[0].value[params[0].encode.y[0]] : params[0].value[params[0].encode.x[0]],
+        series: params.map((p) => {
+          return {
+            color: p.color,
+            name: p.seriesType === "pie" ? p.name : p.seriesName,
+            value: p.seriesType === "pie" ? p.value[p.encode.value[0]] : horizontal ? p.value[p.encode.x[0]] : p.value[p.encode.y[0]]
+          };
+        })
+      };
+      return component(values);
+    }
+    return component;
+  }, [component, horizontal]);
+  const option = useMemo(() => {
+    return {
+      tooltip: {
+        confine: false,
+        show,
+        trigger,
+        position: (point, params, dom, rect, size) => {
+          return [point[0], point[1] - size.contentSize[1]];
+        },
+        formatter: (params) => {
+          const tooltipParams = Array.isArray(params) ? params : [params];
+          return component ? renderCustomTooltip(tooltipParams) : renderTooltip(tooltipParams);
+        }
+      }
+    };
+  }, [trigger, component, show, renderTooltip, renderCustomTooltip]);
+  return option;
+};
+export {
+  useTooltip
+};
+//# sourceMappingURL=useTooltip.js.map

package/dist/esm/hooks/tooltip/useTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTooltip.js","sources":["../../../../src/hooks/tooltip/useTooltip.tsx"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\n\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\nimport { Arrayable, ExtractNames } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  HvBarChartMeasures,\n  HvChartTooltip,\n  HvChartTooltipParams,\n  HvDonutChartMeasure,\n  HvLineChartMeasures,\n} from \"@viz/types\";\nimport { getMeasure } from \"@viz/utils\";\n\nimport { useClasses } from \"./styles\";\n\nexport type HvChartTooltipClasses = ExtractNames<typeof useClasses>;\n\n/** Echarts doesn't seem to have the type for the tooltip params */\ninterface EChartsTooltipParams {\n  seriesName: string;\n  value: (string | number)[];\n  encode: { [key: string]: number[] };\n  color: string;\n  dimensionNames: string[];\n  name: string;\n  seriesType: string;\n}\n\ninterface HvTooltipHookProps {\n  measures:\n    | Arrayable<HvLineChartMeasures | HvBarChartMeasures>\n    | HvDonutChartMeasure;\n  trigger?: \"item\" | \"axis\";\n  classes?: HvChartTooltipClasses;\n  horizontal?: boolean;\n  show?: HvChartTooltip[\"show\"];\n  type?: HvChartTooltip[\"type\"];\n  component?: HvChartTooltip[\"component\"];\n  valueFormatter?: HvChartTooltip[\"valueFormatter\"];\n  titleFormatter?: HvChartTooltip[\"titleFormatter\"];\n  nameFormatter?: (value?: string) => string;\n}\n\nexport const useTooltip = ({\n  measures,\n  classes,\n  component,\n  show = true,\n  horizontal = false,\n  trigger = \"item\",\n  type = \"multiple\",\n  valueFormatter,\n  titleFormatter,\n  nameFormatter,\n}: HvTooltipHookProps) => {\n  const { classes: hvClasses } = useClasses(classes);\n\n  const renderTooltip = useCallback(\n    (params: EChartsTooltipParams[]) => {\n      const title =\n        params[0].seriesType === \"pie\"\n          ? params[0].seriesName\n          : horizontal\n          ? params[0].value[params[0].encode.y[0]]\n          : params[0].value[params[0].encode.x[0]];\n\n      const formattedTitle = titleFormatter ? titleFormatter(title) : title;\n\n      if (type === \"single\") {\n        const measure = getMeasure(\n          params[0].seriesType === \"pie\"\n            ? params[0].name\n            : horizontal\n            ? params[0].dimensionNames[params[0].encode.x[0]]\n            : params[0].dimensionNames[params[0].encode.y[0]],\n\n          measures\n        );\n\n        const value =\n          params[0].seriesType === \"pie\"\n            ? params[0].value[params[0].encode.value[0]]\n            : horizontal\n            ? params[0].value[params[0].encode.x[0]]\n            : params[0].value[params[0].encode.y[0]];\n\n        const formattedValue =\n          typeof measure !== \"string\" && measure.valueFormatter\n            ? measure.valueFormatter(value)\n            : valueFormatter\n            ? valueFormatter(value)\n            : value;\n\n        return `\n            <div class=\"${hvClasses?.singleTooltipRoot}\">\n              <p class=\"${hvClasses?.singleTooltipTitle}\">${formattedTitle}</p>\n              <p class=\"${hvClasses?.singleTooltipValue}\">${formattedValue}</p>\n            </div>\n            `;\n      }\n\n      return `\n        <div class=\"${hvClasses?.multipleTooltipRoot}\">\n          <div class=\"${hvClasses?.multipleTooltipTitleContainer}\">\n            <div>\n              <p class=\"${\n                hvClasses?.multipleTooltipTitle\n              }\">${formattedTitle}</p>\n            </div>\n          </div>\n          <div class=\"${hvClasses?.multipleTooltipValuesContainer}\">\n            ${params\n              .map((s) => {\n                const measure = getMeasure(\n                  s.seriesType === \"pie\"\n                    ? s.name\n                    : horizontal\n                    ? s.dimensionNames[s.encode.x[0]]\n                    : s.dimensionNames[s.encode.y[0]],\n                  measures\n                );\n\n                const value =\n                  s.seriesType === \"pie\"\n                    ? s.value[s.encode.value[0]]\n                    : horizontal\n                    ? s.value[s.encode.x[0]]\n                    : s.value[s.encode.y[0]];\n\n                const formattedValue =\n                  typeof measure !== \"string\" && measure.valueFormatter\n                    ? measure.valueFormatter(value)\n                    : valueFormatter\n                    ? valueFormatter(value)\n                    : value;\n\n                const name = s.seriesType === \"pie\" ? s.name : s.seriesName;\n\n                const formattedName = nameFormatter\n                  ? nameFormatter(name)\n                  : name;\n\n                return `\n                <div key=\"${s.seriesName}\" class=\"${hvClasses?.multipleTooltipSeriesContainer}\">\n                  <div class=\"${hvClasses?.multipleTooltipSeriesNameContainer}\">\n                    <p style=\"background-color: ${s.color};\" class=\"${hvClasses?.multipleTooltipSeriesColor}\" />\n                    <p class=\"${hvClasses?.multipleTooltipSeriesName}\">${formattedName}</p>\n                  </div>\n                  <p class=\"${hvClasses?.multipleTooltipSeriesValue}\">${formattedValue}</p>\n                </div>\n              `;\n              })\n              .join(\" \")}\n          </div>\n        </div>\n        `;\n    },\n    [\n      hvClasses,\n      horizontal,\n      type,\n      measures,\n      nameFormatter,\n      titleFormatter,\n      valueFormatter,\n    ]\n  );\n\n  const renderCustomTooltip = useCallback(\n    (params: EChartsTooltipParams[]) => {\n      if (typeof component === \"function\") {\n        const values: HvChartTooltipParams = {\n          title:\n            params[0].seriesType === \"pie\"\n              ? params[0].seriesName\n              : horizontal\n              ? params[0].value[params[0].encode.y[0]]\n              : params[0].value[params[0].encode.x[0]],\n          series: params.map((p) => {\n            return {\n              color: p.color,\n              name: p.seriesType === \"pie\" ? p.name : p.seriesName,\n              value:\n                p.seriesType === \"pie\"\n                  ? p.value[p.encode.value[0]]\n                  : horizontal\n                  ? p.value[p.encode.x[0]]\n                  : p.value[p.encode.y[0]],\n            };\n          }),\n        };\n\n        return component(values);\n      }\n\n      return component;\n    },\n    [component, horizontal]\n  );\n\n  const option = useMemo<Pick<EChartsOption, \"tooltip\">>(() => {\n    return {\n      tooltip: {\n        confine: false,\n        show,\n        trigger,\n        position: (point, params, dom, rect, size) => {\n          return [point[0], point[1] - size.contentSize[1]];\n        },\n        formatter: (params) => {\n          const tooltipParams = Array.isArray(params) ? params : [params];\n\n          return component\n            ? renderCustomTooltip(tooltipParams)\n            : renderTooltip(tooltipParams);\n        },\n      },\n    };\n  }, [trigger, component, show, renderTooltip, renderCustomTooltip]);\n\n  return option;\n};\n"],"names":["useTooltip","measures","classes","component","show","horizontal","trigger","type","valueFormatter","titleFormatter","nameFormatter","hvClasses","useClasses","renderTooltip","useCallback","params","title","seriesType","seriesName","value","encode","y","x","formattedTitle","measure","getMeasure","name","dimensionNames","formattedValue","singleTooltipRoot","singleTooltipTitle","singleTooltipValue","multipleTooltipRoot","multipleTooltipTitleContainer","multipleTooltipTitle","multipleTooltipValuesContainer","map","s","formattedName","multipleTooltipSeriesContainer","multipleTooltipSeriesNameContainer","color","multipleTooltipSeriesColor","multipleTooltipSeriesName","multipleTooltipSeriesValue","join","renderCustomTooltip","values","series","p","option","useMemo","tooltip","confine","position","point","dom","rect","size","contentSize","formatter","tooltipParams","Array","isArray"],"mappings":"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"}

package/dist/esm/hooks/useData.js

@@ -0,0 +1,93 @@
+import { useMemo } from "react";
+import { internal, from, table, desc, not } from "arquero";
+import { getAgFunc } from "../utils/getAgFunc.js";
+import { getGroupKey } from "../utils/getGroupKey.js";
+const useData = ({
+  data,
+  groupBy,
+  measures,
+  sortBy,
+  splitBy
+}) => {
+  const groupByKey = getGroupKey(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]);
+  return chartData;
+};
+export {
+  useData
+};
+//# sourceMappingURL=useData.js.map

package/dist/esm/hooks/useData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useData.js","sources":["../../../src/hooks/useData.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { from, internal, not, table, desc } from \"arquero\";\nimport type ColumnTable from \"arquero/dist/types/table/column-table\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  HvBarChartMeasures,\n  HvChartAggregation,\n  HvChartOrder,\n  HvLineChartMeasures,\n  HvChartData,\n  HvDonutChartMeasure,\n} from \"@viz/types\";\nimport { getAgFunc, getGroupKey } from \"@viz/utils\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"@viz/types/common\";\n\ninterface HvDataHookProps {\n  data: HvChartData;\n  groupBy: HvChartCommonProps[\"groupBy\"];\n  measures:\n    | Arrayable<HvLineChartMeasures | HvBarChartMeasures>\n    | HvDonutChartMeasure;\n  splitBy?: HvAxisChartCommonProps[\"splitBy\"];\n  sortBy?: HvChartCommonProps[\"sortBy\"];\n}\n\nexport const useData = ({\n  data,\n  groupBy,\n  measures,\n  sortBy,\n  splitBy,\n}: HvDataHookProps): internal.ColumnTable => {\n  const groupByKey = getGroupKey(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  return chartData;\n};\n"],"names":["useData","data","groupBy","measures","sortBy","splitBy","groupByKey","getGroupKey","chartData","useMemo","tableData","internal","ColumnTable","Array","isArray","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","join","derive","after","orderby","filter","key","includes","desc","not"],"mappings":"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"}

package/dist/esm/hooks/useDataZoom.js

@@ -0,0 +1,25 @@
+import { useMemo } from "react";
+const useDataZoom = ({
+  showHorizontal
+}) => {
+  const option = useMemo(() => {
+    return {
+      dataZoom: [{
+        show: showHorizontal ?? false,
+        type: "slider",
+        orient: "horizontal"
+      }, {
+        show: showHorizontal ?? false,
+        type: "inside",
+        orient: "horizontal",
+        zoomOnMouseWheel: "shift",
+        moveOnMouseWheel: true
+      }]
+    };
+  }, [showHorizontal]);
+  return option;
+};
+export {
+  useDataZoom
+};
+//# sourceMappingURL=useDataZoom.js.map

package/dist/esm/hooks/useDataZoom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataZoom.js","sources":["../../../src/hooks/useDataZoom.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\ninterface HvDataZoomHookProps {\n  showHorizontal?: boolean;\n}\n\nexport const useDataZoom = ({ showHorizontal }: HvDataZoomHookProps) => {\n  const option = useMemo<Pick<EChartsOption, \"dataZoom\">>(() => {\n    return {\n      dataZoom: [\n        {\n          show: showHorizontal ?? false,\n          type: \"slider\",\n          orient: \"horizontal\",\n        },\n        {\n          show: showHorizontal ?? false,\n          type: \"inside\",\n          orient: \"horizontal\",\n          zoomOnMouseWheel: \"shift\",\n          moveOnMouseWheel: true,\n        },\n      ],\n    };\n  }, [showHorizontal]);\n\n  return option;\n};\n"],"names":["useDataZoom","showHorizontal","option","useMemo","dataZoom","show","type","orient","zoomOnMouseWheel","moveOnMouseWheel"],"mappings":";AAQO,MAAMA,cAAcA,CAAC;AAAA,EAAEC;AAAoC,MAAM;AAChEC,QAAAA,SAASC,QAAyC,MAAM;AACrD,WAAA;AAAA,MACLC,UAAU,CACR;AAAA,QACEC,MAAMJ,kBAAkB;AAAA,QACxBK,MAAM;AAAA,QACNC,QAAQ;AAAA,MAAA,GAEV;AAAA,QACEF,MAAMJ,kBAAkB;AAAA,QACxBK,MAAM;AAAA,QACNC,QAAQ;AAAA,QACRC,kBAAkB;AAAA,QAClBC,kBAAkB;AAAA,MAAA,CACnB;AAAA,IAAA;AAAA,EAEL,GACC,CAACR,cAAc,CAAC;AAEZC,SAAAA;AACT;"}

package/dist/esm/hooks/useDataset.js

@@ -0,0 +1,18 @@
+import { useMemo } from "react";
+const useDataset = (data) => {
+  const option = useMemo(() => {
+    return {
+      dataset: {
+        source: data.columnNames().reduce((acc, c) => ({
+          ...acc,
+          [c]: data.array(c)
+        }), {})
+      }
+    };
+  }, [data]);
+  return option;
+};
+export {
+  useDataset
+};
+//# sourceMappingURL=useDataset.js.map

package/dist/esm/hooks/useDataset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataset.js","sources":["../../../src/hooks/useDataset.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { internal } from \"arquero\";\n\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\nexport const useDataset = (data: internal.ColumnTable) => {\n  const option = useMemo<Pick<EChartsOption, \"dataset\">>(() => {\n    return {\n      dataset: {\n        source: data.columnNames().reduce(\n          (acc, c) => ({\n            ...acc,\n            [c]: data.array(c),\n          }),\n          {}\n        ),\n      },\n    };\n  }, [data]);\n\n  return option;\n};\n"],"names":["useDataset","data","option","useMemo","dataset","source","columnNames","reduce","acc","c","array"],"mappings":";AAMaA,MAAAA,aAAaA,CAACC,SAA+B;AAClDC,QAAAA,SAASC,QAAwC,MAAM;AACpD,WAAA;AAAA,MACLC,SAAS;AAAA,QACPC,QAAQJ,KAAKK,YAAAA,EAAcC,OACzB,CAACC,KAAKC,OAAO;AAAA,UACX,GAAGD;AAAAA,UACH,CAACC,CAAC,GAAGR,KAAKS,MAAMD,CAAC;AAAA,QACnB,IACA,CAAA,CACF;AAAA,MACF;AAAA,IAAA;AAAA,EACF,GACC,CAACR,IAAI,CAAC;AAEFC,SAAAA;AACT;"}

package/dist/esm/hooks/useGrid.js

@@ -0,0 +1,32 @@
+import { useMemo } from "react";
+const useGrid = ({
+  top,
+  left,
+  right,
+  bottom
+}) => {
+  const option = useMemo(() => {
+    return {
+      // if no value is defined we shouldn't pass anything because echarts doesn't behave well otherwise
+      grid: {
+        ...top != null && {
+          top
+        },
+        ...bottom != null && {
+          bottom
+        },
+        ...left != null && {
+          left
+        },
+        ...right != null && {
+          right
+        }
+      }
+    };
+  }, [top, left, right, bottom]);
+  return option;
+};
+export {
+  useGrid
+};
+//# sourceMappingURL=useGrid.js.map

package/dist/esm/hooks/useGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGrid.js","sources":["../../../src/hooks/useGrid.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\nimport { HvChartGrid } from \"@viz/types\";\n\ninterface HvGridHookProps {\n  top?: HvChartGrid[\"top\"];\n  bottom?: HvChartGrid[\"bottom\"];\n  left?: HvChartGrid[\"left\"];\n  right?: HvChartGrid[\"right\"];\n}\n\nexport const useGrid = ({ top, left, right, bottom }: HvGridHookProps) => {\n  const option = useMemo<Pick<EChartsOption, \"grid\">>(() => {\n    return {\n      // if no value is defined we shouldn't pass anything because echarts doesn't behave well otherwise\n      grid: {\n        ...(top != null && {\n          top,\n        }),\n        ...(bottom != null && {\n          bottom,\n        }),\n        ...(left != null && {\n          left,\n        }),\n        ...(right != null && {\n          right,\n        }),\n      },\n    };\n  }, [top, left, right, bottom]);\n\n  return option;\n};\n"],"names":["useGrid","top","left","right","bottom","option","useMemo","grid"],"mappings":";AAaO,MAAMA,UAAUA,CAAC;AAAA,EAAEC;AAAAA,EAAKC;AAAAA,EAAMC;AAAAA,EAAOC;AAAwB,MAAM;AAClEC,QAAAA,SAASC,QAAqC,MAAM;AACjD,WAAA;AAAA;AAAA,MAELC,MAAM;AAAA,QACJ,GAAIN,OAAO,QAAQ;AAAA,UACjBA;AAAAA,QACF;AAAA,QACA,GAAIG,UAAU,QAAQ;AAAA,UACpBA;AAAAA,QACF;AAAA,QACA,GAAIF,QAAQ,QAAQ;AAAA,UAClBA;AAAAA,QACF;AAAA,QACA,GAAIC,SAAS,QAAQ;AAAA,UACnBA;AAAAA,QACF;AAAA,MACF;AAAA,IAAA;AAAA,KAED,CAACF,KAAKC,MAAMC,OAAOC,MAAM,CAAC;AAEtBC,SAAAA;AACT;"}

package/dist/esm/hooks/useLegend.js

@@ -0,0 +1,46 @@
+import { useMemo } from "react";
+import { getLegendIcon } from "../utils/getLegendIcon.js";
+const useLegend = ({
+  series,
+  show,
+  icon,
+  formatter,
+  position: positionProp,
+  direction = "horizontal"
+}) => {
+  const option = useMemo(() => {
+    const position = {
+      y: (positionProp == null ? void 0 : positionProp.y) ?? "top"
+    };
+    if ((positionProp == null ? void 0 : positionProp.x) != null && (positionProp == null ? void 0 : positionProp.x) !== "center") {
+      position[positionProp.x] = positionProp.x;
+    } else {
+      position.x = "center";
+    }
+    return {
+      legend: {
+        show: show ?? (Array.isArray(series) && series.length > 1),
+        itemGap: 20,
+        formatter,
+        orient: direction,
+        ...position,
+        ...icon && {
+          icon: getLegendIcon(icon)
+        },
+        ...!icon && {
+          data: show !== false && Array.isArray(series) ? series.map((s) => {
+            return {
+              name: s.name,
+              icon: getLegendIcon(s.areaStyle != null ? "square" : "line")
+            };
+          }) : void 0
+        }
+      }
+    };
+  }, [series, show, icon, formatter, positionProp, direction]);
+  return option;
+};
+export {
+  useLegend
+};
+//# sourceMappingURL=useLegend.js.map

package/dist/esm/hooks/useLegend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLegend.js","sources":["../../../src/hooks/useLegend.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\nimport { getLegendIcon } from \"@viz/utils\";\nimport { HvChartLegend, HvChartLegendIcon } from \"@viz/types/legend\";\n\ninterface HvLegendHookProps {\n  show?: HvChartLegend[\"show\"];\n  direction?: HvChartLegend[\"direction\"];\n  position?: HvChartLegend[\"position\"];\n  series?: Pick<EChartsOption, \"series.series\">;\n  icon?: HvChartLegendIcon;\n  formatter?: string | ((value?: string) => string);\n}\n\nexport const useLegend = ({\n  series,\n  show,\n  icon,\n  formatter,\n  position: positionProp,\n  direction = \"horizontal\",\n}: HvLegendHookProps) => {\n  const option = useMemo<Pick<EChartsOption, \"legend\">>(() => {\n    const position: Record<string, string> = { y: positionProp?.y ?? \"top\" };\n    if (positionProp?.x != null && positionProp?.x !== \"center\") {\n      position[positionProp.x] = positionProp.x;\n    } else {\n      position.x = \"center\";\n    }\n\n    return {\n      legend: {\n        show: show ?? (Array.isArray(series) && series.length > 1),\n        itemGap: 20,\n        formatter,\n        orient: direction,\n        ...position,\n        ...(icon && { icon: getLegendIcon(icon) }),\n        ...(!icon && {\n          data:\n            show !== false && Array.isArray(series)\n              ? series.map((s) => {\n                  return {\n                    name: s.name as string,\n                    icon: getLegendIcon(\n                      (s as any).areaStyle != null ? \"square\" : \"line\"\n                    ),\n                  };\n                })\n              : undefined,\n        }),\n      },\n    };\n  }, [series, show, icon, formatter, positionProp, direction]);\n\n  return option;\n};\n"],"names":["useLegend","series","show","icon","formatter","position","positionProp","direction","option","useMemo","y","x","legend","Array","isArray","length","itemGap","orient","getLegendIcon","data","map","s","name","areaStyle","undefined"],"mappings":";;AAgBO,MAAMA,YAAYA,CAAC;AAAA,EACxBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,UAAUC;AAAAA,EACVC,YAAY;AACK,MAAM;AACjBC,QAAAA,SAASC,QAAuC,MAAM;AAC1D,UAAMJ,WAAmC;AAAA,MAAEK,IAAGJ,6CAAcI,MAAK;AAAA,IAAA;AACjE,SAAIJ,6CAAcK,MAAK,SAAQL,6CAAcK,OAAM,UAAU;AAClDL,eAAAA,aAAaK,CAAC,IAAIL,aAAaK;AAAAA,IAAAA,OACnC;AACLN,eAASM,IAAI;AAAA,IACf;AAEO,WAAA;AAAA,MACLC,QAAQ;AAAA,QACNV,MAAMA,SAASW,MAAMC,QAAQb,MAAM,KAAKA,OAAOc,SAAS;AAAA,QACxDC,SAAS;AAAA,QACTZ;AAAAA,QACAa,QAAQV;AAAAA,QACR,GAAGF;AAAAA,QACH,GAAIF,QAAQ;AAAA,UAAEA,MAAMe,cAAcf,IAAI;AAAA,QAAE;AAAA,QACxC,GAAI,CAACA,QAAQ;AAAA,UACXgB,MACEjB,SAAS,SAASW,MAAMC,QAAQb,MAAM,IAClCA,OAAOmB,IAAKC,CAAM,MAAA;AACT,mBAAA;AAAA,cACLC,MAAMD,EAAEC;AAAAA,cACRnB,MAAMe,cACHG,EAAUE,aAAa,OAAO,WAAW,MAC5C;AAAA,YAAA;AAAA,UAEH,CAAA,IACDC;AAAAA,QACR;AAAA,MACF;AAAA,IAAA;AAAA,EACF,GACC,CAACvB,QAAQC,MAAMC,MAAMC,WAAWE,cAAcC,SAAS,CAAC;AAEpDC,SAAAA;AACT;"}

package/dist/esm/hooks/useSeries.js

@@ -0,0 +1,99 @@
+import { useMemo } from "react";
+import { getGroupKey } from "../utils/getGroupKey.js";
+import { getMeasure } from "../utils/getMeasure.js";
+const useSeries = ({
+  groupBy,
+  type,
+  data,
+  measures,
+  nameFormatter,
+  stack,
+  horizontal = false,
+  area = false,
+  areaOpacity = 0.5,
+  emptyCellMode,
+  radius
+}) => {
+  const groupByKey = getGroupKey(groupBy);
+  const option = useMemo(() => {
+    return {
+      series: data.columnNames().filter((c) => c !== groupByKey).map((c) => {
+        const measure = getMeasure(c, measures);
+        let pieOps = {};
+        let lineOps = {};
+        let barOps = {};
+        if (type === "pie") {
+          pieOps = {
+            encode: {
+              value: c,
+              itemName: groupByKey
+            },
+            labelLine: {
+              show: false
+            },
+            label: {
+              show: false
+            },
+            emphasis: {
+              label: {
+                show: false
+              }
+            },
+            radius
+          };
+        }
+        if (type === "line" || type === "bar") {
+          const sampling = typeof measure !== "string" ? measure.sampling : void 0;
+          const yAxisId = typeof measure !== "string" ? measure.yAxis : void 0;
+          const stackName = typeof measure !== "string" ? measure.stack ?? stack ?? void 0 : stack ?? void 0;
+          const axisOps = {
+            sampling,
+            yAxisId,
+            stack: stackName,
+            encode: horizontal ? {
+              x: c,
+              y: groupByKey
+            } : {
+              x: groupByKey,
+              y: c
+            }
+          };
+          if (type === "bar") {
+            barOps = {
+              ...axisOps,
+              barMaxWidth: 90,
+              barMinWidth: 3
+            };
+          }
+          if (type === "line") {
+            const showSymbol = typeof measure !== "string" ? !measure.hideSymbol : true;
+            const connectNulls = typeof measure !== "string" && measure.emptyCellMode ? measure.emptyCellMode === "connect" : emptyCellMode === "connect";
+            const isArea = typeof measure !== "string" ? measure.area ?? area : area;
+            const aOpacity = typeof measure !== "string" ? measure.areaOpacity ?? areaOpacity : areaOpacity;
+            lineOps = {
+              ...axisOps,
+              connectNulls,
+              showSymbol,
+              areaStyle: isArea ? {
+                opacity: aOpacity
+              } : void 0
+            };
+          }
+        }
+        return {
+          id: `series~${groupByKey}~${c}`,
+          type,
+          name: nameFormatter ? nameFormatter(c) : c,
+          ...pieOps,
+          ...barOps,
+          ...lineOps
+        };
+      })
+    };
+  }, [data, groupByKey, area, stack, nameFormatter, emptyCellMode, areaOpacity, measures, type, horizontal, radius]);
+  return option;
+};
+export {
+  useSeries
+};
+//# sourceMappingURL=useSeries.js.map