@hitachivantara/uikit-react-viz 5.6.1 → 5.6.2

package/dist/cjs/hooks/useXAxis.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useXAxis.cjs","sources":["../../../src/hooks/useXAxis.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { getAxisType } from \"@viz/utils\";\nimport { HvChartXAxis, HvEChartsOption } from \"@viz/types/common\";\n\ninterface HvXAxisHookProps extends HvChartXAxis {\n  scale?: boolean;\n  data?: string[];\n}\n\nexport const useXAxis = ({\n  id,\n  type = \"categorical\",\n  labelFormatter,\n  labelRotation,\n  name,\n  maxValue,\n  minValue,\n  scale = false,\n  data,\n  position,\n  nameProps,\n}: HvXAxisHookProps) => {\n  const { colors } = useTheme();\n\n  const option = useMemo<Pick<HvEChartsOption, \"xAxis\">>(() => {\n    const nameStyleKeys = nameProps\n      ? Object.keys(nameProps).filter((key) => key !== \"location\")\n      : undefined;\n    const nameStyle =\n      nameProps && nameStyleKeys\n        ? nameStyleKeys.reduce((acc, curr) => {\n            return {\n              ...acc,\n              [curr]:\n                curr === \"color\"\n                  ? colors?.[nameProps[curr] as string] || nameProps[curr]\n                  : nameProps[curr],\n            };\n          }, {})\n        : undefined;\n\n    return {\n      xAxis: {\n        id,\n        type: getAxisType(type),\n        name,\n        scale,\n        axisLabel: {\n          rotate: labelRotation ?? 0,\n          formatter: labelFormatter,\n        },\n        max: maxValue === \"max\" ? \"dataMax\" : maxValue,\n        min: minValue === \"min\" ? \"dataMin\" : minValue,\n        ...(nameProps?.location && {\n          nameLocation: nameProps.location,\n        }),\n        ...(nameStyle && {\n          nameTextStyle: nameStyle,\n        }),\n        ...(data && { data }),\n        ...(position && { position }),\n      },\n    };\n  }, [\n    nameProps,\n    id,\n    type,\n    name,\n    scale,\n    labelRotation,\n    labelFormatter,\n    maxValue,\n    minValue,\n    data,\n    position,\n    colors,\n  ]);\n\n  return option;\n};\n"],"names":["useXAxis","id","type","labelFormatter","labelRotation","name","maxValue","minValue","scale","data","position","nameProps","colors","useTheme","option","useMemo","nameStyleKeys","Object","keys","filter","key","undefined","nameStyle","reduce","acc","curr","xAxis","getAxisType","axisLabel","rotate","formatter","max","min","location","nameLocation","nameTextStyle"],"mappings":";;;;;AAYO,MAAMA,WAAWA,CAAC;AAAA,EACvBC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,QAAQ;AAAA,EACRC;AAAAA,EACAC;AAAAA,EACAC;AACgB,MAAM;AAChB,QAAA;AAAA,IAAEC;AAAAA,MAAWC,eAAS,SAAA;AAEtBC,QAAAA,SAASC,MAAAA,QAAwC,MAAM;AACrDC,UAAAA,gBAAgBL,YAClBM,OAAOC,KAAKP,SAAS,EAAEQ,OAAQC,CAAAA,QAAQA,QAAQ,UAAU,IACzDC;AACJ,UAAMC,YACJX,aAAaK,gBACTA,cAAcO,OAAO,CAACC,KAAKC,SAAS;AAC3B,aAAA;AAAA,QACL,GAAGD;AAAAA,QACH,CAACC,IAAI,GACHA,SAAS,WACLb,iCAASD,UAAUc,IAAI,OAAgBd,UAAUc,IAAI,IACrDd,UAAUc,IAAI;AAAA,MAAA;AAAA,IACtB,GACC,CAAE,CAAA,IACLJ;AAEC,WAAA;AAAA,MACLK,OAAO;AAAA,QACLzB;AAAAA,QACAC,MAAMyB,wBAAYzB,IAAI;AAAA,QACtBG;AAAAA,QACAG;AAAAA,QACAoB,WAAW;AAAA,UACTC,QAAQzB,iBAAiB;AAAA,UACzB0B,WAAW3B;AAAAA,QACb;AAAA,QACA4B,KAAKzB,aAAa,QAAQ,YAAYA;AAAAA,QACtC0B,KAAKzB,aAAa,QAAQ,YAAYA;AAAAA,QACtC,IAAII,uCAAWsB,aAAY;AAAA,UACzBC,cAAcvB,UAAUsB;AAAAA,QAC1B;AAAA,QACA,GAAIX,aAAa;AAAA,UACfa,eAAeb;AAAAA,QACjB;AAAA,QACA,GAAIb,QAAQ;AAAA,UAAEA;AAAAA,QAAK;AAAA,QACnB,GAAIC,YAAY;AAAA,UAAEA;AAAAA,QAAS;AAAA,MAC7B;AAAA,IAAA;AAAA,EAED,GAAA,CACDC,WACAV,IACAC,MACAG,MACAG,OACAJ,eACAD,gBACAG,UACAC,UACAE,MACAC,UACAE,MAAM,CACP;AAEME,SAAAA;AACT;;"}
+{"version":3,"file":"useXAxis.cjs","sources":["../../../src/hooks/useXAxis.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { getAxisType } from \"@viz/utils\";\nimport { HvChartXAxis, HvEChartsOption } from \"@viz/types/common\";\n\ninterface HvXAxisHookProps extends HvChartXAxis {\n  scale?: boolean;\n  data?: string[];\n}\n\nexport const useXAxis = ({\n  id,\n  type = \"categorical\",\n  labelFormatter,\n  labelRotation,\n  name,\n  maxValue,\n  minValue,\n  scale = false,\n  data,\n  position,\n  nameProps,\n}: HvXAxisHookProps) => {\n  const { colors } = useTheme();\n\n  const option = useMemo<Pick<HvEChartsOption, \"xAxis\">>(() => {\n    const nameStyleKeys = nameProps\n      ? Object.keys(nameProps).filter((key) => key !== \"location\")\n      : undefined;\n    const nameStyle =\n      nameProps && nameStyleKeys\n        ? nameStyleKeys.reduce((acc, curr) => {\n            return {\n              ...acc,\n              [curr]:\n                curr === \"color\"\n                  ? colors?.[nameProps[curr] as string] || nameProps[curr]\n                  : nameProps[curr],\n            };\n          }, {})\n        : undefined;\n\n    return {\n      xAxis: {\n        id,\n        type: getAxisType(type),\n        name,\n        scale,\n        axisLabel: {\n          rotate: labelRotation ?? 0,\n          formatter: labelFormatter,\n        },\n        max: maxValue === \"max\" ? \"dataMax\" : maxValue,\n        min: minValue === \"min\" ? \"dataMin\" : minValue,\n        ...(nameProps?.location && {\n          nameLocation: nameProps.location,\n        }),\n        ...(nameStyle && {\n          nameTextStyle: nameStyle,\n        }),\n        ...(data && { data }),\n        ...(position && { position }),\n      },\n    };\n  }, [\n    nameProps,\n    id,\n    type,\n    name,\n    scale,\n    labelRotation,\n    labelFormatter,\n    maxValue,\n    minValue,\n    data,\n    position,\n    colors,\n  ]);\n\n  return option;\n};\n"],"names":["useXAxis","id","type","labelFormatter","labelRotation","name","maxValue","minValue","scale","data","position","nameProps","colors","useTheme","option","useMemo","nameStyleKeys","Object","keys","filter","key","undefined","nameStyle","reduce","acc","curr","xAxis","getAxisType","axisLabel","rotate","formatter","max","min","location","nameLocation","nameTextStyle"],"mappings":";;;;;AAYO,MAAMA,WAAWA,CAAC;AAAA,EACvBC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,QAAQ;AAAA,EACRC;AAAAA,EACAC;AAAAA,EACAC;AACgB,MAAM;AAChB,QAAA;AAAA,IAAEC;AAAAA,MAAWC,eAAS,SAAA;AAEtBC,QAAAA,SAASC,MAAAA,QAAwC,MAAM;AACrDC,UAAAA,gBAAgBL,YAClBM,OAAOC,KAAKP,SAAS,EAAEQ,OAAQC,CAAAA,QAAQA,QAAQ,UAAU,IACzDC;AACJ,UAAMC,YACJX,aAAaK,gBACTA,cAAcO,OAAO,CAACC,KAAKC,SAAS;AAC3B,aAAA;AAAA,QACL,GAAGD;AAAAA,QACH,CAACC,IAAI,GACHA,SAAS,UACLb,SAASD,UAAUc,IAAI,CAAY,KAAId,UAAUc,IAAI,IACrDd,UAAUc,IAAI;AAAA,MAAA;AAAA,IACtB,GACC,CAAE,CAAA,IACLJ;AAEC,WAAA;AAAA,MACLK,OAAO;AAAA,QACLzB;AAAAA,QACAC,MAAMyB,wBAAYzB,IAAI;AAAA,QACtBG;AAAAA,QACAG;AAAAA,QACAoB,WAAW;AAAA,UACTC,QAAQzB,iBAAiB;AAAA,UACzB0B,WAAW3B;AAAAA,QACb;AAAA,QACA4B,KAAKzB,aAAa,QAAQ,YAAYA;AAAAA,QACtC0B,KAAKzB,aAAa,QAAQ,YAAYA;AAAAA,QACtC,GAAII,WAAWsB,YAAY;AAAA,UACzBC,cAAcvB,UAAUsB;AAAAA,QAC1B;AAAA,QACA,GAAIX,aAAa;AAAA,UACfa,eAAeb;AAAAA,QACjB;AAAA,QACA,GAAIb,QAAQ;AAAA,UAAEA;AAAAA,QAAK;AAAA,QACnB,GAAIC,YAAY;AAAA,UAAEA;AAAAA,QAAS;AAAA,MAC7B;AAAA,IAAA;AAAA,EAED,GAAA,CACDC,WACAV,IACAC,MACAG,MACAG,OACAJ,eACAD,gBACAG,UACAC,UACAE,MACAC,UACAE,MAAM,CACP;AAEME,SAAAA;AACT;;"}

package/dist/cjs/hooks/useYAxis.cjs

@@ -26,7 +26,7 @@ const useYAxis = ({
     const nameStyle = nameProps && nameStyleKeys ? nameStyleKeys.reduce((acc, curr) => {
       return {
         ...acc,
-        [curr]: curr === "color" ? (colors == null ? void 0 : colors[nameProps[curr]]) || nameProps[curr] : nameProps[curr]
+        [curr]: curr === "color" ? colors?.[nameProps[curr]] || nameProps[curr] : nameProps[curr]
       };
     }, {}) : void 0;
     return {
@@ -39,8 +39,8 @@ const useYAxis = ({
       },
       max: maxValue === "max" ? "dataMax" : maxValue,
       min: minValue === "min" ? "dataMin" : minValue,
-      ...(nameProps == null ? void 0 : nameProps.location) && {
-        nameLocation: nameProps == null ? void 0 : nameProps.location
+      ...nameProps?.location && {
+        nameLocation: nameProps?.location
       },
       ...nameStyle && {
         nameTextStyle: nameStyle

package/dist/cjs/hooks/useYAxis.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useYAxis.cjs","sources":["../../../src/hooks/useYAxis.tsx"],"sourcesContent":["import { useMemo, useCallback } from \"react\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { getAxisType } from \"@viz/utils\";\nimport { HvChartAxisType } from \"@viz/types\";\nimport { HvChartYAxis, HvEChartsOption } from \"@viz/types/common\";\n\ninterface YAxis extends HvChartYAxis {\n  data?: string[];\n}\n\ninterface HvYAxisHookProps {\n  axes?: YAxis[];\n  defaultType?: HvChartAxisType;\n}\n\nexport const useYAxis = ({\n  axes,\n  defaultType = \"continuous\",\n}: HvYAxisHookProps) => {\n  const { colors } = useTheme();\n\n  const createAxis = useCallback(\n    ({\n      id,\n      type,\n      name,\n      labelFormatter,\n      labelRotation,\n      maxValue,\n      minValue,\n      nameProps,\n      data,\n      position,\n    }: YAxis) => {\n      const nameStyleKeys = nameProps\n        ? Object.keys(nameProps).filter((key) => key !== \"location\")\n        : undefined;\n      const nameStyle =\n        nameProps && nameStyleKeys\n          ? nameStyleKeys.reduce((acc, curr) => {\n              return {\n                ...acc,\n                [curr]:\n                  curr === \"color\"\n                    ? colors?.[nameProps[curr] as string] || nameProps[curr]\n                    : nameProps[curr],\n              };\n            }, {})\n          : undefined;\n\n      return {\n        id,\n        type: getAxisType(type) ?? getAxisType(defaultType),\n        name,\n        axisLabel: {\n          rotate: labelRotation ?? 0,\n          formatter: labelFormatter,\n        },\n        max: maxValue === \"max\" ? \"dataMax\" : maxValue,\n        min: minValue === \"min\" ? \"dataMin\" : minValue,\n        ...(nameProps?.location && {\n          nameLocation: nameProps?.location,\n        }),\n        ...(nameStyle && {\n          nameTextStyle: nameStyle,\n        }),\n        ...(data && { data }),\n        ...(position && { position }),\n      };\n    },\n    [colors, defaultType]\n  );\n\n  const option = useMemo<Pick<HvEChartsOption, \"yAxis\">>(() => {\n    return {\n      yAxis: Array.isArray(axes)\n        ? axes.map((axis) => createAxis(axis))\n        : [createAxis({})],\n    };\n  }, [axes, createAxis]);\n\n  return option;\n};\n"],"names":["useYAxis","axes","defaultType","colors","useTheme","createAxis","useCallback","id","type","name","labelFormatter","labelRotation","maxValue","minValue","nameProps","data","position","nameStyleKeys","Object","keys","filter","key","undefined","nameStyle","reduce","acc","curr","getAxisType","axisLabel","rotate","formatter","max","min","location","nameLocation","nameTextStyle","option","useMemo","yAxis","Array","isArray","map","axis"],"mappings":";;;;;AAiBO,MAAMA,WAAWA,CAAC;AAAA,EACvBC;AAAAA,EACAC,cAAc;AACE,MAAM;AAChB,QAAA;AAAA,IAAEC;AAAAA,MAAWC,eAAS,SAAA;AAEtBC,QAAAA,aAAaC,MAAAA,YACjB,CAAC;AAAA,IACCC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,MACW;AACLC,UAAAA,gBAAgBH,YAClBI,OAAOC,KAAKL,SAAS,EAAEM,OAAQC,CAAAA,QAAQA,QAAQ,UAAU,IACzDC;AACJ,UAAMC,YACJT,aAAaG,gBACTA,cAAcO,OAAO,CAACC,KAAKC,SAAS;AAC3B,aAAA;AAAA,QACL,GAAGD;AAAAA,QACH,CAACC,IAAI,GACHA,SAAS,WACLvB,iCAASW,UAAUY,IAAI,OAAgBZ,UAAUY,IAAI,IACrDZ,UAAUY,IAAI;AAAA,MAAA;AAAA,IACtB,GACC,CAAE,CAAA,IACLJ;AAEC,WAAA;AAAA,MACLf;AAAAA,MACAC,MAAMmB,YAAAA,YAAYnB,IAAI,KAAKmB,YAAAA,YAAYzB,WAAW;AAAA,MAClDO;AAAAA,MACAmB,WAAW;AAAA,QACTC,QAAQlB,iBAAiB;AAAA,QACzBmB,WAAWpB;AAAAA,MACb;AAAA,MACAqB,KAAKnB,aAAa,QAAQ,YAAYA;AAAAA,MACtCoB,KAAKnB,aAAa,QAAQ,YAAYA;AAAAA,MACtC,IAAIC,uCAAWmB,aAAY;AAAA,QACzBC,cAAcpB,uCAAWmB;AAAAA,MAC3B;AAAA,MACA,GAAIV,aAAa;AAAA,QACfY,eAAeZ;AAAAA,MACjB;AAAA,MACA,GAAIR,QAAQ;AAAA,QAAEA;AAAAA,MAAK;AAAA,MACnB,GAAIC,YAAY;AAAA,QAAEA;AAAAA,MAAS;AAAA,IAAA;AAAA,EAC7B,GAEF,CAACb,QAAQD,WAAW,CACtB;AAEMkC,QAAAA,SAASC,MAAAA,QAAwC,MAAM;AACpD,WAAA;AAAA,MACLC,OAAOC,MAAMC,QAAQvC,IAAI,IACrBA,KAAKwC,IAAKC,CAAAA,SAASrC,WAAWqC,IAAI,CAAC,IACnC,CAACrC,WAAW,CAAE,CAAA,CAAC;AAAA,IAAA;AAAA,EACrB,GACC,CAACJ,MAAMI,UAAU,CAAC;AAEd+B,SAAAA;AACT;;"}
+{"version":3,"file":"useYAxis.cjs","sources":["../../../src/hooks/useYAxis.tsx"],"sourcesContent":["import { useMemo, useCallback } from \"react\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { getAxisType } from \"@viz/utils\";\nimport { HvChartAxisType } from \"@viz/types\";\nimport { HvChartYAxis, HvEChartsOption } from \"@viz/types/common\";\n\ninterface YAxis extends HvChartYAxis {\n  data?: string[];\n}\n\ninterface HvYAxisHookProps {\n  axes?: YAxis[];\n  defaultType?: HvChartAxisType;\n}\n\nexport const useYAxis = ({\n  axes,\n  defaultType = \"continuous\",\n}: HvYAxisHookProps) => {\n  const { colors } = useTheme();\n\n  const createAxis = useCallback(\n    ({\n      id,\n      type,\n      name,\n      labelFormatter,\n      labelRotation,\n      maxValue,\n      minValue,\n      nameProps,\n      data,\n      position,\n    }: YAxis) => {\n      const nameStyleKeys = nameProps\n        ? Object.keys(nameProps).filter((key) => key !== \"location\")\n        : undefined;\n      const nameStyle =\n        nameProps && nameStyleKeys\n          ? nameStyleKeys.reduce((acc, curr) => {\n              return {\n                ...acc,\n                [curr]:\n                  curr === \"color\"\n                    ? colors?.[nameProps[curr] as string] || nameProps[curr]\n                    : nameProps[curr],\n              };\n            }, {})\n          : undefined;\n\n      return {\n        id,\n        type: getAxisType(type) ?? getAxisType(defaultType),\n        name,\n        axisLabel: {\n          rotate: labelRotation ?? 0,\n          formatter: labelFormatter,\n        },\n        max: maxValue === \"max\" ? \"dataMax\" : maxValue,\n        min: minValue === \"min\" ? \"dataMin\" : minValue,\n        ...(nameProps?.location && {\n          nameLocation: nameProps?.location,\n        }),\n        ...(nameStyle && {\n          nameTextStyle: nameStyle,\n        }),\n        ...(data && { data }),\n        ...(position && { position }),\n      };\n    },\n    [colors, defaultType]\n  );\n\n  const option = useMemo<Pick<HvEChartsOption, \"yAxis\">>(() => {\n    return {\n      yAxis: Array.isArray(axes)\n        ? axes.map((axis) => createAxis(axis))\n        : [createAxis({})],\n    };\n  }, [axes, createAxis]);\n\n  return option;\n};\n"],"names":["useYAxis","axes","defaultType","colors","useTheme","createAxis","useCallback","id","type","name","labelFormatter","labelRotation","maxValue","minValue","nameProps","data","position","nameStyleKeys","Object","keys","filter","key","undefined","nameStyle","reduce","acc","curr","getAxisType","axisLabel","rotate","formatter","max","min","location","nameLocation","nameTextStyle","option","useMemo","yAxis","Array","isArray","map","axis"],"mappings":";;;;;AAiBO,MAAMA,WAAWA,CAAC;AAAA,EACvBC;AAAAA,EACAC,cAAc;AACE,MAAM;AAChB,QAAA;AAAA,IAAEC;AAAAA,MAAWC,eAAS,SAAA;AAEtBC,QAAAA,aAAaC,MAAAA,YACjB,CAAC;AAAA,IACCC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,MACW;AACLC,UAAAA,gBAAgBH,YAClBI,OAAOC,KAAKL,SAAS,EAAEM,OAAQC,CAAAA,QAAQA,QAAQ,UAAU,IACzDC;AACJ,UAAMC,YACJT,aAAaG,gBACTA,cAAcO,OAAO,CAACC,KAAKC,SAAS;AAC3B,aAAA;AAAA,QACL,GAAGD;AAAAA,QACH,CAACC,IAAI,GACHA,SAAS,UACLvB,SAASW,UAAUY,IAAI,CAAY,KAAIZ,UAAUY,IAAI,IACrDZ,UAAUY,IAAI;AAAA,MAAA;AAAA,IACtB,GACC,CAAE,CAAA,IACLJ;AAEC,WAAA;AAAA,MACLf;AAAAA,MACAC,MAAMmB,YAAAA,YAAYnB,IAAI,KAAKmB,YAAAA,YAAYzB,WAAW;AAAA,MAClDO;AAAAA,MACAmB,WAAW;AAAA,QACTC,QAAQlB,iBAAiB;AAAA,QACzBmB,WAAWpB;AAAAA,MACb;AAAA,MACAqB,KAAKnB,aAAa,QAAQ,YAAYA;AAAAA,MACtCoB,KAAKnB,aAAa,QAAQ,YAAYA;AAAAA,MACtC,GAAIC,WAAWmB,YAAY;AAAA,QACzBC,cAAcpB,WAAWmB;AAAAA,MAC3B;AAAA,MACA,GAAIV,aAAa;AAAA,QACfY,eAAeZ;AAAAA,MACjB;AAAA,MACA,GAAIR,QAAQ;AAAA,QAAEA;AAAAA,MAAK;AAAA,MACnB,GAAIC,YAAY;AAAA,QAAEA;AAAAA,MAAS;AAAA,IAAA;AAAA,EAC7B,GAEF,CAACb,QAAQD,WAAW,CACtB;AAEMkC,QAAAA,SAASC,MAAAA,QAAwC,MAAM;AACpD,WAAA;AAAA,MACLC,OAAOC,MAAMC,QAAQvC,IAAI,IACrBA,KAAKwC,IAAKC,CAAAA,SAASrC,WAAWqC,IAAI,CAAC,IACnC,CAACrC,WAAW,CAAE,CAAA,CAAC;AAAA,IAAA;AAAA,EACrB,GACC,CAACJ,MAAMI,UAAU,CAAC;AAEd+B,SAAAA;AACT;;"}

package/dist/cjs/utils/registerTheme.cjs

@@ -22,43 +22,43 @@ function _interopNamespace(e) {
 const echarts__namespace = /* @__PURE__ */ _interopNamespace(echarts);
 const registerTheme = (name, mode, themeStructure) => {
   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
+    color: themeStructure?.colors.modes[mode].secondary,
+    fontWeight: themeStructure?.fontWeights.normal,
+    fontSize: themeStructure?.fontSizes.sm,
+    fontFamily: themeStructure?.fontFamily.body
   };
   const customAxis = {
     nameTextStyle: {
       ...baseText,
-      color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].secondary_80
+      color: themeStructure?.colors.modes[mode].secondary_80
     },
     axisLine: {
       show: true,
       lineStyle: {
-        color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].atmo3
+        color: themeStructure?.colors.modes[mode].atmo3
       }
     },
     axisTick: {
       show: true,
       lineStyle: {
-        color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].atmo3
+        color: 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
+      color: themeStructure?.colors.modes[mode].secondary_80,
+      fontWeight: themeStructure?.fontWeights.normal,
+      fontSize: themeStructure?.fontSizes.sm,
+      fontFamily: themeStructure?.fontFamily.body
     },
     splitLine: {
       show: true,
       lineStyle: {
-        color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].atmo3
+        color: themeStructure?.colors.modes[mode].atmo3
       }
     }
   };
   echarts__namespace.registerTheme(`${name}-${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, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat7, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat8, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat9, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat10, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat11, themeStructure == null ? void 0 : themeStructure.colors.modes[mode].cat12],
+    color: [themeStructure?.colors.modes[mode].cat1, themeStructure?.colors.modes[mode].cat2, themeStructure?.colors.modes[mode].cat3, themeStructure?.colors.modes[mode].cat4, themeStructure?.colors.modes[mode].cat5, themeStructure?.colors.modes[mode].cat6, themeStructure?.colors.modes[mode].cat7, themeStructure?.colors.modes[mode].cat8, themeStructure?.colors.modes[mode].cat9, themeStructure?.colors.modes[mode].cat10, themeStructure?.colors.modes[mode].cat11, themeStructure?.colors.modes[mode].cat12],
     legend: {
       textStyle: {
         ...baseText
@@ -72,7 +72,7 @@ const registerTheme = (name, mode, themeStructure) => {
       },
       axisPointer: {
         lineStyle: {
-          color: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].secondary,
+          color: themeStructure?.colors.modes[mode].secondary,
           width: 1
         }
       }
@@ -111,7 +111,7 @@ const registerTheme = (name, mode, themeStructure) => {
         fontFamily: baseText.fontFamily
       },
       itemStyle: {
-        borderColor: themeStructure == null ? void 0 : themeStructure.colors.modes[mode].atmo3,
+        borderColor: themeStructure?.colors.modes[mode].atmo3,
         borderWidth: 1
       }
     }

package/dist/cjs/utils/registerTheme.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"registerTheme.cjs","sources":["../../../src/utils/registerTheme.ts"],"sourcesContent":["import { HvTheme } from \"@hitachivantara/uikit-react-core\";\nimport * as echarts from \"echarts/core\";\n\nexport const registerTheme = (\n  name: string,\n  mode: string,\n  themeStructure?: HvTheme\n) => {\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      color: themeStructure?.colors.modes[mode].secondary_80,\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(`${name}-${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      themeStructure?.colors.modes[mode].cat7,\n      themeStructure?.colors.modes[mode].cat8,\n      themeStructure?.colors.modes[mode].cat9,\n      themeStructure?.colors.modes[mode].cat10,\n      themeStructure?.colors.modes[mode].cat11,\n      themeStructure?.colors.modes[mode].cat12,\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    visualMap: {\n      textStyle: {\n        ...baseText,\n      },\n    },\n    heatmap: {\n      label: {\n        fontWeight: baseText.fontWeight,\n        fontSize: baseText.fontSize,\n        fontFamily: baseText.fontFamily,\n      },\n      itemStyle: {\n        borderColor: themeStructure?.colors.modes[mode].atmo3,\n        borderWidth: 1,\n      },\n    },\n  });\n};\n"],"names":["registerTheme","name","mode","themeStructure","baseText","color","colors","modes","secondary","fontWeight","fontWeights","normal","fontSize","fontSizes","sm","fontFamily","body","customAxis","nameTextStyle","secondary_80","axisLine","show","lineStyle","atmo3","axisTick","axisLabel","splitLine","echarts","cat1","cat2","cat3","cat4","cat5","cat6","cat7","cat8","cat9","cat10","cat11","cat12","legend","textStyle","tooltip","borderWidth","padding","axisPointer","width","dataZoom","categoryAxis","valueAxis","logAxis","timeAxis","line","visualMap","heatmap","label","itemStyle","borderColor"],"mappings":"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"}
+{"version":3,"file":"registerTheme.cjs","sources":["../../../src/utils/registerTheme.ts"],"sourcesContent":["import { HvTheme } from \"@hitachivantara/uikit-react-core\";\nimport * as echarts from \"echarts/core\";\n\nexport const registerTheme = (\n  name: string,\n  mode: string,\n  themeStructure?: HvTheme\n) => {\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      color: themeStructure?.colors.modes[mode].secondary_80,\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(`${name}-${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      themeStructure?.colors.modes[mode].cat7,\n      themeStructure?.colors.modes[mode].cat8,\n      themeStructure?.colors.modes[mode].cat9,\n      themeStructure?.colors.modes[mode].cat10,\n      themeStructure?.colors.modes[mode].cat11,\n      themeStructure?.colors.modes[mode].cat12,\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    visualMap: {\n      textStyle: {\n        ...baseText,\n      },\n    },\n    heatmap: {\n      label: {\n        fontWeight: baseText.fontWeight,\n        fontSize: baseText.fontSize,\n        fontFamily: baseText.fontFamily,\n      },\n      itemStyle: {\n        borderColor: themeStructure?.colors.modes[mode].atmo3,\n        borderWidth: 1,\n      },\n    },\n  });\n};\n"],"names":["registerTheme","name","mode","themeStructure","baseText","color","colors","modes","secondary","fontWeight","fontWeights","normal","fontSize","fontSizes","sm","fontFamily","body","customAxis","nameTextStyle","secondary_80","axisLine","show","lineStyle","atmo3","axisTick","axisLabel","splitLine","echarts","cat1","cat2","cat3","cat4","cat5","cat6","cat7","cat8","cat9","cat10","cat11","cat12","legend","textStyle","tooltip","borderWidth","padding","axisPointer","width","dataZoom","categoryAxis","valueAxis","logAxis","timeAxis","line","visualMap","heatmap","label","itemStyle","borderColor"],"mappings":"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"}

package/dist/esm/components/BarChart/BarChart.js

@@ -53,7 +53,7 @@ const HvBarChart = forwardRef((props, ref) => {
     ...xAxis
   });
   const chartSlider = useDataZoom({
-    showHorizontal: horizontalRangeSlider == null ? void 0 : horizontalRangeSlider.show
+    showHorizontal: horizontalRangeSlider?.show
   });
   const chartGrid = useGrid({
     ...grid

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

@@ -1 +1 @@
-{"version":3,"file":"BarChart.js","sources":["../../../../src/components/BarChart/BarChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { BarChart } from \"echarts/charts\";\nimport {\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n  DataZoomSliderComponent,\n  DataZoomInsideComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  useXAxis,\n  useYAxis,\n  useDataZoom,\n  useGrid,\n  useData,\n  useDataset,\n  useSeries,\n  useLegend,\n  useTooltip,\n  useOption,\n  HvChartTooltipClasses,\n} from \"@viz/hooks\";\n\nimport { HvBarChartMeasures } from \"../../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../../types/common\";\n\n// Register chart components\necharts.use([\n  BarChart,\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n  DataZoomSliderComponent,\n  DataZoomInsideComponent,\n]);\n\nexport interface HvBarChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvBarChartProps\n  extends HvAxisChartCommonProps,\n    HvChartCommonProps {\n  /**  Columns to measure on the chart. */\n  measures: Arrayable<HvBarChartMeasures>;\n  /** Whether the bar chart should be horizontal. Defaults to `false`. */\n  horizontal?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvBarChartClasses;\n}\n\n/**\n * A bar chart is a chart or graph that presents categorical data with rectangular bars.\n */\nexport const HvBarChart = forwardRef<ReactECharts, HvBarChartProps>(\n  (props, ref) => {\n    const {\n      yAxis,\n      xAxis,\n      horizontal = false,\n      horizontalRangeSlider,\n      grid,\n      data,\n      groupBy,\n      splitBy,\n      sortBy,\n      stack,\n      seriesNameFormatter,\n      measures,\n      legend,\n      tooltip,\n      classes,\n      height,\n      width,\n      onOptionChange,\n    } = props;\n\n    const chartData = useData({ data, groupBy, sortBy, splitBy, measures });\n\n    const chartDataset = useDataset(chartData);\n\n    const chartYAxis = useYAxis({\n      axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n      defaultType: horizontal ? \"categorical\" : \"continuous\",\n    });\n\n    const chartXAxis = useXAxis({\n      type: horizontal ? \"continuous\" : \"categorical\",\n      ...xAxis,\n    });\n\n    const chartSlider = useDataZoom({\n      showHorizontal: horizontalRangeSlider?.show,\n    });\n\n    const chartGrid = useGrid({ ...grid });\n\n    const chartSeries = useSeries({\n      type: \"bar\",\n      data: chartData,\n      groupBy,\n      measures,\n      stack,\n      nameFormatter: seriesNameFormatter,\n      horizontal,\n    });\n\n    const chartLegend = useLegend({\n      ...legend,\n      series: chartSeries.series,\n      icon: \"square\",\n    });\n\n    const chartTooltip = useTooltip({\n      ...tooltip,\n      trigger: \"axis\",\n      measures,\n      classes,\n      horizontal,\n    });\n\n    const option = useOption({\n      option: {\n        ...chartYAxis,\n        ...chartXAxis,\n        ...chartSlider,\n        ...chartGrid,\n        ...chartDataset,\n        ...chartSeries,\n        ...chartLegend,\n        ...chartTooltip,\n      },\n      onOptionChange,\n    });\n\n    return (\n      <HvBaseChart ref={ref} option={option} width={width} height={height} />\n    );\n  }\n);\n"],"names":["echarts","use","BarChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","HvBarChart","forwardRef","props","ref","yAxis","xAxis","horizontal","horizontalRangeSlider","grid","data","groupBy","splitBy","sortBy","stack","seriesNameFormatter","measures","legend","tooltip","classes","height","width","onOptionChange","chartData","useData","chartDataset","useDataset","chartYAxis","useYAxis","axes","Array","isArray","defaultType","chartXAxis","useXAxis","type","chartSlider","useDataZoom","showHorizontal","show","chartGrid","useGrid","chartSeries","useSeries","nameFormatter","chartLegend","useLegend","series","icon","chartTooltip","useTooltip","trigger","option","useOption"],"mappings":";;;;;;;;;;;;;;;;AAmCAA,QAAQC,IAAI,CACVC,UACAC,kBACAC,eACAC,kBACAC,iBACAC,yBACAC,uBAAuB,CACxB;AAkBM,MAAMC,aAAaC,WACxB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,aAAa;AAAA,IACbC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EACEnB,IAAAA;AAEJ,QAAMoB,YAAYC,QAAQ;AAAA,IAAEd;AAAAA,IAAMC;AAAAA,IAASE;AAAAA,IAAQD;AAAAA,IAASI;AAAAA,EAAAA,CAAU;AAEhES,QAAAA,eAAeC,WAAWH,SAAS;AAEzC,QAAMI,aAAaC,SAAS;AAAA,IAC1BC,MAAMC,MAAMC,QAAQ1B,KAAK,KAAKA,SAAS,OAAOA,QAAQ,CAACA,KAAK;AAAA,IAC5D2B,aAAazB,aAAa,gBAAgB;AAAA,EAAA,CAC3C;AAED,QAAM0B,aAAaC,SAAS;AAAA,IAC1BC,MAAM5B,aAAa,eAAe;AAAA,IAClC,GAAGD;AAAAA,EAAAA,CACJ;AAED,QAAM8B,cAAcC,YAAY;AAAA,IAC9BC,gBAAgB9B,+DAAuB+B;AAAAA,EAAAA,CACxC;AAED,QAAMC,YAAYC,QAAQ;AAAA,IAAE,GAAGhC;AAAAA,EAAAA,CAAM;AAErC,QAAMiC,cAAcC,UAAU;AAAA,IAC5BR,MAAM;AAAA,IACNzB,MAAMa;AAAAA,IACNZ;AAAAA,IACAK;AAAAA,IACAF;AAAAA,IACA8B,eAAe7B;AAAAA,IACfR;AAAAA,EAAAA,CACD;AAED,QAAMsC,cAAcC,UAAU;AAAA,IAC5B,GAAG7B;AAAAA,IACH8B,QAAQL,YAAYK;AAAAA,IACpBC,MAAM;AAAA,EAAA,CACP;AAED,QAAMC,eAAeC,WAAW;AAAA,IAC9B,GAAGhC;AAAAA,IACHiC,SAAS;AAAA,IACTnC;AAAAA,IACAG;AAAAA,IACAZ;AAAAA,EAAAA,CACD;AAED,QAAM6C,SAASC,UAAU;AAAA,IACvBD,QAAQ;AAAA,MACN,GAAGzB;AAAAA,MACH,GAAGM;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGf;AAAAA,MACH,GAAGiB;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,IACL;AAAA,IACA3B;AAAAA,EAAAA,CACD;AAED,SACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAkB,CAAA;AAE3E,CACF;"}
+{"version":3,"file":"BarChart.js","sources":["../../../../src/components/BarChart/BarChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { BarChart } from \"echarts/charts\";\nimport {\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n  DataZoomSliderComponent,\n  DataZoomInsideComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  useXAxis,\n  useYAxis,\n  useDataZoom,\n  useGrid,\n  useData,\n  useDataset,\n  useSeries,\n  useLegend,\n  useTooltip,\n  useOption,\n  HvChartTooltipClasses,\n} from \"@viz/hooks\";\n\nimport { HvBarChartMeasures } from \"../../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../../types/common\";\n\n// Register chart components\necharts.use([\n  BarChart,\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n  DataZoomSliderComponent,\n  DataZoomInsideComponent,\n]);\n\nexport interface HvBarChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvBarChartProps\n  extends HvAxisChartCommonProps,\n    HvChartCommonProps {\n  /**  Columns to measure on the chart. */\n  measures: Arrayable<HvBarChartMeasures>;\n  /** Whether the bar chart should be horizontal. Defaults to `false`. */\n  horizontal?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvBarChartClasses;\n}\n\n/**\n * A bar chart is a chart or graph that presents categorical data with rectangular bars.\n */\nexport const HvBarChart = forwardRef<ReactECharts, HvBarChartProps>(\n  (props, ref) => {\n    const {\n      yAxis,\n      xAxis,\n      horizontal = false,\n      horizontalRangeSlider,\n      grid,\n      data,\n      groupBy,\n      splitBy,\n      sortBy,\n      stack,\n      seriesNameFormatter,\n      measures,\n      legend,\n      tooltip,\n      classes,\n      height,\n      width,\n      onOptionChange,\n    } = props;\n\n    const chartData = useData({ data, groupBy, sortBy, splitBy, measures });\n\n    const chartDataset = useDataset(chartData);\n\n    const chartYAxis = useYAxis({\n      axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n      defaultType: horizontal ? \"categorical\" : \"continuous\",\n    });\n\n    const chartXAxis = useXAxis({\n      type: horizontal ? \"continuous\" : \"categorical\",\n      ...xAxis,\n    });\n\n    const chartSlider = useDataZoom({\n      showHorizontal: horizontalRangeSlider?.show,\n    });\n\n    const chartGrid = useGrid({ ...grid });\n\n    const chartSeries = useSeries({\n      type: \"bar\",\n      data: chartData,\n      groupBy,\n      measures,\n      stack,\n      nameFormatter: seriesNameFormatter,\n      horizontal,\n    });\n\n    const chartLegend = useLegend({\n      ...legend,\n      series: chartSeries.series,\n      icon: \"square\",\n    });\n\n    const chartTooltip = useTooltip({\n      ...tooltip,\n      trigger: \"axis\",\n      measures,\n      classes,\n      horizontal,\n    });\n\n    const option = useOption({\n      option: {\n        ...chartYAxis,\n        ...chartXAxis,\n        ...chartSlider,\n        ...chartGrid,\n        ...chartDataset,\n        ...chartSeries,\n        ...chartLegend,\n        ...chartTooltip,\n      },\n      onOptionChange,\n    });\n\n    return (\n      <HvBaseChart ref={ref} option={option} width={width} height={height} />\n    );\n  }\n);\n"],"names":["echarts","use","BarChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","HvBarChart","forwardRef","props","ref","yAxis","xAxis","horizontal","horizontalRangeSlider","grid","data","groupBy","splitBy","sortBy","stack","seriesNameFormatter","measures","legend","tooltip","classes","height","width","onOptionChange","chartData","useData","chartDataset","useDataset","chartYAxis","useYAxis","axes","Array","isArray","defaultType","chartXAxis","useXAxis","type","chartSlider","useDataZoom","showHorizontal","show","chartGrid","useGrid","chartSeries","useSeries","nameFormatter","chartLegend","useLegend","series","icon","chartTooltip","useTooltip","trigger","option","useOption"],"mappings":";;;;;;;;;;;;;;;;AAmCAA,QAAQC,IAAI,CACVC,UACAC,kBACAC,eACAC,kBACAC,iBACAC,yBACAC,uBAAuB,CACxB;AAkBM,MAAMC,aAAaC,WACxB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,aAAa;AAAA,IACbC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EACEnB,IAAAA;AAEJ,QAAMoB,YAAYC,QAAQ;AAAA,IAAEd;AAAAA,IAAMC;AAAAA,IAASE;AAAAA,IAAQD;AAAAA,IAASI;AAAAA,EAAAA,CAAU;AAEhES,QAAAA,eAAeC,WAAWH,SAAS;AAEzC,QAAMI,aAAaC,SAAS;AAAA,IAC1BC,MAAMC,MAAMC,QAAQ1B,KAAK,KAAKA,SAAS,OAAOA,QAAQ,CAACA,KAAK;AAAA,IAC5D2B,aAAazB,aAAa,gBAAgB;AAAA,EAAA,CAC3C;AAED,QAAM0B,aAAaC,SAAS;AAAA,IAC1BC,MAAM5B,aAAa,eAAe;AAAA,IAClC,GAAGD;AAAAA,EAAAA,CACJ;AAED,QAAM8B,cAAcC,YAAY;AAAA,IAC9BC,gBAAgB9B,uBAAuB+B;AAAAA,EAAAA,CACxC;AAED,QAAMC,YAAYC,QAAQ;AAAA,IAAE,GAAGhC;AAAAA,EAAAA,CAAM;AAErC,QAAMiC,cAAcC,UAAU;AAAA,IAC5BR,MAAM;AAAA,IACNzB,MAAMa;AAAAA,IACNZ;AAAAA,IACAK;AAAAA,IACAF;AAAAA,IACA8B,eAAe7B;AAAAA,IACfR;AAAAA,EAAAA,CACD;AAED,QAAMsC,cAAcC,UAAU;AAAA,IAC5B,GAAG7B;AAAAA,IACH8B,QAAQL,YAAYK;AAAAA,IACpBC,MAAM;AAAA,EAAA,CACP;AAED,QAAMC,eAAeC,WAAW;AAAA,IAC9B,GAAGhC;AAAAA,IACHiC,SAAS;AAAA,IACTnC;AAAAA,IACAG;AAAAA,IACAZ;AAAAA,EAAAA,CACD;AAED,QAAM6C,SAASC,UAAU;AAAA,IACvBD,QAAQ;AAAA,MACN,GAAGzB;AAAAA,MACH,GAAGM;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGf;AAAAA,MACH,GAAGiB;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,IACL;AAAA,IACA3B;AAAAA,EAAAA,CACD;AAED,SACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAkB,CAAA;AAE3E,CACF;"}

package/dist/esm/components/BaseChart/BaseChart.js

@@ -22,7 +22,6 @@ const HvBaseChart = forwardRef((props, ref) => {
   const forkedRef = useForkRef(ref, chartRef);
   const [initialOption, setInitialOption] = useState(option);
   useEffect(() => {
-    var _a;
     if (!isMounted.current) {
       isMounted.current = true;
       return;
@@ -32,7 +31,7 @@ const HvBaseChart = forwardRef((props, ref) => {
       currentTheme.current = theme;
       return;
     }
-    const instance = (_a = chartRef.current) == null ? void 0 : _a.getEchartsInstance();
+    const instance = chartRef.current?.getEchartsInstance();
     if (!instance)
       return;
     instance.setOption(option, {

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

@@ -1 +1 @@
-{"version":3,"file":"BaseChart.js","sources":["../../../../src/components/BaseChart/BaseChart.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef, useState } from \"react\";\n\nimport { useForkRef } from \"@mui/material\";\n\nimport { AriaComponent } from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { useVizTheme } from \"@viz/hooks\";\nimport { HvEChartsOption } from \"@viz/types/common\";\n\n// Register chart components\necharts.use([CanvasRenderer, AriaComponent]);\n\nexport interface HvBaseChartProps {\n  /** ECharts option. */\n  option: HvEChartsOption;\n  /** Charts width. */\n  width?: echarts.ResizeOpts[\"width\"];\n  /** Charts height. */\n  height?: echarts.ResizeOpts[\"height\"];\n}\n\n/**\n * Base chart.\n */\nexport const HvBaseChart = forwardRef<ReactECharts, HvBaseChartProps>(\n  (props, ref) => {\n    const { option, width, height } = props;\n\n    const { theme } = useVizTheme();\n\n    const currentTheme = useRef<string | undefined>(theme);\n    const chartRef = useRef<ReactECharts>(null);\n    const isMounted = useRef<boolean>(false);\n\n    const forkedRef = useForkRef<ReactECharts>(ref, chartRef);\n\n    const [initialOption, setInitialOption] = useState<HvEChartsOption>(option);\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(option);\n        currentTheme.current = theme;\n        return;\n      }\n\n      const instance = chartRef.current?.getEchartsInstance();\n\n      if (!instance) return;\n\n      instance.setOption(option, {\n        replaceMerge: [\"xAxis\", \"yAxis\", \"series\", \"dataset\"],\n      });\n    }, [theme, option]);\n\n    return (\n      <ReactECharts\n        ref={forkedRef}\n        echarts={echarts}\n        option={initialOption}\n        theme={theme}\n        notMerge\n        {...((width || height) && {\n          style: { width, height },\n        })}\n      />\n    );\n  }\n);\n"],"names":["echarts","use","CanvasRenderer","AriaComponent","HvBaseChart","forwardRef","props","ref","option","width","height","theme","useVizTheme","currentTheme","useRef","chartRef","isMounted","forkedRef","useForkRef","initialOption","setInitialOption","useState","useEffect","current","instance","getEchartsInstance","setOption","replaceMerge","style"],"mappings":";;;;;;;;AAaAA,QAAQC,IAAI,CAACC,gBAAgBC,aAAa,CAAC;AAcpC,MAAMC,cAAcC,WACzB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IAAEC;AAAAA,IAAQC;AAAAA,IAAOC;AAAAA,EAAWJ,IAAAA;AAE5B,QAAA;AAAA,IAAEK;AAAAA,MAAUC,YAAY;AAExBC,QAAAA,eAAeC,OAA2BH,KAAK;AAC/CI,QAAAA,WAAWD,OAAqB,IAAI;AACpCE,QAAAA,YAAYF,OAAgB,KAAK;AAEjCG,QAAAA,YAAYC,WAAyBX,KAAKQ,QAAQ;AAExD,QAAM,CAACI,eAAeC,gBAAgB,IAAIC,SAA0Bb,MAAM;AAE1Ec,YAAU,MAAM;;AACV,QAAA,CAACN,UAAUO,SAAS;AACtBP,gBAAUO,UAAU;AACpB;AAAA,IACF;AAIIZ,QAAAA,UAAUE,aAAaU,SAAS;AAClCH,uBAAiBZ,MAAM;AACvBK,mBAAaU,UAAUZ;AACvB;AAAA,IACF;AAEMa,UAAAA,YAAWT,cAASQ,YAATR,mBAAkBU;AAEnC,QAAI,CAACD;AAAU;AAEfA,aAASE,UAAUlB,QAAQ;AAAA,MACzBmB,cAAc,CAAC,SAAS,SAAS,UAAU,SAAS;AAAA,IAAA,CACrD;AAAA,EAAA,GACA,CAAChB,OAAOH,MAAM,CAAC;AAElB,SACG,oBAAA,cAAA,EACC,KAAKS,WACL,SACA,QAAQE,eACR,OACA,UAAQ,MACH,IAACV,SAASC,WAAW;AAAA,IACxBkB,OAAO;AAAA,MAAEnB;AAAAA,MAAOC;AAAAA,IAAO;AAAA,EAEzB,EAAA,CAAA;AAEN,CACF;"}
+{"version":3,"file":"BaseChart.js","sources":["../../../../src/components/BaseChart/BaseChart.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef, useState } from \"react\";\n\nimport { useForkRef } from \"@mui/material\";\n\nimport { AriaComponent } from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { useVizTheme } from \"@viz/hooks\";\nimport { HvEChartsOption } from \"@viz/types/common\";\n\n// Register chart components\necharts.use([CanvasRenderer, AriaComponent]);\n\nexport interface HvBaseChartProps {\n  /** ECharts option. */\n  option: HvEChartsOption;\n  /** Charts width. */\n  width?: echarts.ResizeOpts[\"width\"];\n  /** Charts height. */\n  height?: echarts.ResizeOpts[\"height\"];\n}\n\n/**\n * Base chart.\n */\nexport const HvBaseChart = forwardRef<ReactECharts, HvBaseChartProps>(\n  (props, ref) => {\n    const { option, width, height } = props;\n\n    const { theme } = useVizTheme();\n\n    const currentTheme = useRef<string | undefined>(theme);\n    const chartRef = useRef<ReactECharts>(null);\n    const isMounted = useRef<boolean>(false);\n\n    const forkedRef = useForkRef<ReactECharts>(ref, chartRef);\n\n    const [initialOption, setInitialOption] = useState<HvEChartsOption>(option);\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(option);\n        currentTheme.current = theme;\n        return;\n      }\n\n      const instance = chartRef.current?.getEchartsInstance();\n\n      if (!instance) return;\n\n      instance.setOption(option, {\n        replaceMerge: [\"xAxis\", \"yAxis\", \"series\", \"dataset\"],\n      });\n    }, [theme, option]);\n\n    return (\n      <ReactECharts\n        ref={forkedRef}\n        echarts={echarts}\n        option={initialOption}\n        theme={theme}\n        notMerge\n        {...((width || height) && {\n          style: { width, height },\n        })}\n      />\n    );\n  }\n);\n"],"names":["echarts","use","CanvasRenderer","AriaComponent","HvBaseChart","forwardRef","props","ref","option","width","height","theme","useVizTheme","currentTheme","useRef","chartRef","isMounted","forkedRef","useForkRef","initialOption","setInitialOption","useState","useEffect","current","instance","getEchartsInstance","setOption","replaceMerge","style"],"mappings":";;;;;;;;AAaAA,QAAQC,IAAI,CAACC,gBAAgBC,aAAa,CAAC;AAcpC,MAAMC,cAAcC,WACzB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IAAEC;AAAAA,IAAQC;AAAAA,IAAOC;AAAAA,EAAWJ,IAAAA;AAE5B,QAAA;AAAA,IAAEK;AAAAA,MAAUC,YAAY;AAExBC,QAAAA,eAAeC,OAA2BH,KAAK;AAC/CI,QAAAA,WAAWD,OAAqB,IAAI;AACpCE,QAAAA,YAAYF,OAAgB,KAAK;AAEjCG,QAAAA,YAAYC,WAAyBX,KAAKQ,QAAQ;AAExD,QAAM,CAACI,eAAeC,gBAAgB,IAAIC,SAA0Bb,MAAM;AAE1Ec,YAAU,MAAM;AACV,QAAA,CAACN,UAAUO,SAAS;AACtBP,gBAAUO,UAAU;AACpB;AAAA,IACF;AAIIZ,QAAAA,UAAUE,aAAaU,SAAS;AAClCH,uBAAiBZ,MAAM;AACvBK,mBAAaU,UAAUZ;AACvB;AAAA,IACF;AAEMa,UAAAA,WAAWT,SAASQ,SAASE,mBAAmB;AAEtD,QAAI,CAACD;AAAU;AAEfA,aAASE,UAAUlB,QAAQ;AAAA,MACzBmB,cAAc,CAAC,SAAS,SAAS,UAAU,SAAS;AAAA,IAAA,CACrD;AAAA,EAAA,GACA,CAAChB,OAAOH,MAAM,CAAC;AAElB,SACG,oBAAA,cAAA,EACC,KAAKS,WACL,SACA,QAAQE,eACR,OACA,UAAQ,MACH,IAACV,SAASC,WAAW;AAAA,IACxBkB,OAAO;AAAA,MAAEnB;AAAAA,MAAOC;AAAAA,IAAO;AAAA,EAEzB,EAAA,CAAA;AAEN,CACF;"}

package/dist/esm/components/ConfusionMatrix/ConfusionMatrix.js

@@ -16,7 +16,6 @@ import { useTooltip } from "../../hooks/tooltip/useTooltip.js";
 import { HvBaseChart } from "../BaseChart/BaseChart.js";
 echarts.use([HeatmapChart, VisualMapComponent, GridComponent, TooltipComponent]);
 const HvConfusionMatrix = forwardRef((props, ref) => {
-  var _a, _b, _c, _d;
   const {
     legend,
     groupBy,
@@ -57,18 +56,17 @@ const HvConfusionMatrix = forwardRef((props, ref) => {
     filterKey: groupByKey
   });
   const chartVisualMap = useVisualMap({
-    show: (colorScale == null ? void 0 : colorScale.pieces) != null,
-    type: (colorScale == null ? void 0 : colorScale.pieces) != null ? "piecewise" : "continuous",
+    show: colorScale?.pieces != null,
+    type: colorScale?.pieces != null ? "piecewise" : "continuous",
     ...colorScale,
     ...legend
   });
   const chartTooltip = useTooltip({
     component: (params) => {
-      var _a2, _b2;
-      const value = (_a2 = params == null ? void 0 : params.series) == null ? void 0 : _a2[0].value;
-      const fmtValue = typeof measure !== "string" && measure.valueFormatter ? measure.valueFormatter(value) : (tooltip == null ? void 0 : tooltip.valueFormatter) ? tooltip == null ? void 0 : tooltip.valueFormatter(value) : value;
-      const ftmTitle = (tooltip == null ? void 0 : tooltip.titleFormatter) ? tooltip.titleFormatter(params == null ? void 0 : params.title) : params == null ? void 0 : params.title;
-      const content = `${ftmTitle} - ${(_b2 = params == null ? void 0 : params.series) == null ? void 0 : _b2[0].name}: ${fmtValue}`;
+      const value = params?.series?.[0].value;
+      const fmtValue = typeof measure !== "string" && measure.valueFormatter ? measure.valueFormatter(value) : tooltip?.valueFormatter ? tooltip?.valueFormatter(value) : value;
+      const ftmTitle = tooltip?.titleFormatter ? tooltip.titleFormatter(params?.title) : params?.title;
+      const content = `${ftmTitle} - ${params?.series?.[0].name}: ${fmtValue}`;
       return `
         <div class="${classes.tooltipRoot}">
             <div class="${classes.tooltipContainer}">
@@ -88,8 +86,8 @@ const HvConfusionMatrix = forwardRef((props, ref) => {
       ...yAxis,
       nameProps: {
         location: "center",
-        padding: ((_a = yAxis == null ? void 0 : yAxis.nameProps) == null ? void 0 : _a.location) == null || ((_b = yAxis == null ? void 0 : yAxis.nameProps) == null ? void 0 : _b.location) === "center" ? (yAxis == null ? void 0 : yAxis.position) === "right" ? [50, 0, 0, 0] : [0, 0, 50, 0] : void 0,
-        ...yAxis == null ? void 0 : yAxis.nameProps
+        padding: yAxis?.nameProps?.location == null || yAxis?.nameProps?.location === "center" ? yAxis?.position === "right" ? [50, 0, 0, 0] : [0, 0, 50, 0] : void 0,
+        ...yAxis?.nameProps
       },
       data: chartData.columnNames().filter((p) => p !== groupByKey).reverse()
     }]
@@ -100,8 +98,8 @@ const HvConfusionMatrix = forwardRef((props, ref) => {
     ...xAxis,
     nameProps: {
       location: "center",
-      padding: ((_c = xAxis == null ? void 0 : xAxis.nameProps) == null ? void 0 : _c.location) == null || ((_d = xAxis == null ? void 0 : xAxis.nameProps) == null ? void 0 : _d.location) === "center" ? (xAxis == null ? void 0 : xAxis.position) === "bottom" ? [30, 0, 0, 0] : [0, 0, 30, 0] : void 0,
-      ...xAxis == null ? void 0 : xAxis.nameProps
+      padding: xAxis?.nameProps?.location == null || xAxis?.nameProps?.location === "center" ? xAxis?.position === "bottom" ? [30, 0, 0, 0] : [0, 0, 30, 0] : void 0,
+      ...xAxis?.nameProps
     },
     data: chartData.array(groupByKey)
   });

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

@@ -1 +1 @@
-{"version":3,"file":"ConfusionMatrix.js","sources":["../../../../src/components/ConfusionMatrix/ConfusionMatrix.tsx"],"sourcesContent":["import { forwardRef, useMemo } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { HeatmapChart } from \"echarts/charts\";\nimport {\n  VisualMapComponent,\n  GridComponent,\n  TooltipComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable, ExtractNames } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  HvVisualMapHookProps,\n  useData,\n  useGrid,\n  useOption,\n  useTooltip,\n  useVisualMap,\n  useXAxis,\n  useYAxis,\n} from \"@viz/hooks\";\nimport { getGroupKey } from \"@viz/utils\";\n\nimport { HvBaseChart } from \"../BaseChart\";\nimport { useClasses } from \"./ConfusionMatrix.styles\";\nimport {\n  HvChartCommonProps,\n  HvChartXAxis,\n  HvChartYAxis,\n} from \"../../types/common\";\nimport { HvChartTooltip } from \"../../types/tooltip\";\nimport { HvConfusionMatrixMeasure } from \"../../types/measures\";\nimport { useColorScale, useGridLayout, useSeries } from \"./utils\";\nimport {\n  HvConfusionMatrixFormat,\n  HvConfusionMatrixColorScale,\n  HvConfusionMatrixValuesProps,\n} from \"./types\";\n\n// Register chart components\necharts.use([\n  HeatmapChart,\n  VisualMapComponent,\n  GridComponent,\n  TooltipComponent,\n]);\n\nexport type HvConfusionMatrixClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvConfusionMatrixProps\n  extends Omit<HvChartCommonProps, \"tooltip\"> {\n  /** Column to measure. */\n  measure: HvConfusionMatrixMeasure;\n  /** Columns to use to split the measure. */\n  splitBy?: Arrayable<string>;\n  /**\n   * Column to use for the delta confusion matrix.\n   *\n   * It can be set to `true` in case the `measure` already has the calculations for the delta confusion matrix.\n   */\n  delta?: boolean | string;\n  /** Options for the xAxis, i.e. the horizontal axis. */\n  xAxis?: HvChartXAxis;\n  /** Options for the yAxis, i.e. the vertical axis. */\n  yAxis?: HvChartYAxis;\n  /** Tooltip options. */\n  tooltip?: Omit<HvChartTooltip, \"type\">;\n  /** Format of the confusion matrix. Defaults to `square`. */\n  format?: HvConfusionMatrixFormat;\n  /** Properties to customize the prediction values. */\n  valuesProps?: HvConfusionMatrixValuesProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvConfusionMatrixClasses;\n  /**\n   * Color scale of the confusion matrix.\n   *\n   * If an array of two strings is provided, the first and second values are the lower and upper ends of the scale, respectively.\n   * An array of objects can also be used to create a custom scale.\n   * If `delta` is not provided, a default color scale is used when `colorScale` is not defined: `[base-light, cat3]`.\n   */\n  colorScale?: [string, string] | HvConfusionMatrixColorScale[];\n}\n\n/**\n * Confusion Matrix is a table displaying the performance of a predictive model.\n * Typically the columns show the predicted class and the rows the expected class.\n * The main diagonal counts the positive matches while the cells outside it count the mismatches between predicted and expected.\n */\nexport const HvConfusionMatrix = forwardRef<\n  ReactECharts,\n  HvConfusionMatrixProps\n>((props, ref) => {\n  const {\n    legend,\n    groupBy,\n    measure,\n    sortBy,\n    splitBy,\n    grid,\n    data: dataProp,\n    tooltip,\n    xAxis,\n    yAxis,\n    colorScale: colorScaleProp,\n    delta,\n    valuesProps,\n    width,\n    height,\n    format = \"square\",\n    classes: classesProp,\n    onOptionChange,\n  } = props;\n\n  const { classes } = useClasses(classesProp);\n\n  const groupByKey = getGroupKey(groupBy);\n\n  const chartData = useData({\n    data: dataProp,\n    groupBy,\n    measures: [measure],\n    sortBy: sortBy ?? groupBy, // automatically orders x axis to create the confusion matrix\n    splitBy,\n    delta: typeof delta === \"string\" ? delta : undefined,\n  });\n\n  const colorScale = useColorScale({\n    delta: !!delta,\n    data: chartData,\n    custom: colorScaleProp,\n    filterKey: groupByKey,\n  });\n\n  const chartVisualMap = useVisualMap({\n    show: colorScale?.pieces != null,\n    type: colorScale?.pieces != null ? \"piecewise\" : \"continuous\",\n    ...(colorScale as Pick<\n      HvVisualMapHookProps,\n      \"max\" | \"min\" | \"colorScale\" | \"pieces\"\n    >),\n    ...legend,\n  });\n\n  const chartTooltip = useTooltip({\n    component: (params) => {\n      const value = params?.series?.[0].value;\n      const fmtValue =\n        typeof measure !== \"string\" && measure.valueFormatter\n          ? measure.valueFormatter(value)\n          : tooltip?.valueFormatter\n          ? tooltip?.valueFormatter(value)\n          : value;\n      const ftmTitle = tooltip?.titleFormatter\n        ? tooltip.titleFormatter(params?.title)\n        : params?.title;\n\n      const content = `${ftmTitle} - ${params?.series?.[0].name}: ${fmtValue}`;\n\n      return `\n        <div class=\"${classes.tooltipRoot}\">\n            <div class=\"${classes.tooltipContainer}\">\n                <div>\n                    <p class=\"${classes.tooltipText}\">${content}</p>\n                </div>\n            </div>\n        </div>`;\n    },\n    ...tooltip,\n  });\n\n  const chartYAxis = useYAxis({\n    axes: [\n      {\n        type: \"categorical\",\n        name: \"True Label\",\n        position: \"left\",\n        ...yAxis,\n        nameProps: {\n          location: \"center\",\n          padding:\n            yAxis?.nameProps?.location == null ||\n            yAxis?.nameProps?.location === \"center\"\n              ? yAxis?.position === \"right\"\n                ? [50, 0, 0, 0]\n                : [0, 0, 50, 0]\n              : undefined,\n          ...yAxis?.nameProps,\n        },\n        data: chartData\n          .columnNames()\n          .filter((p) => p !== groupByKey)\n          .reverse(),\n      },\n    ],\n  });\n\n  const chartXAxis = useXAxis({\n    name: \"Predicted Value\",\n    position: \"top\",\n    ...xAxis,\n    nameProps: {\n      location: \"center\",\n      padding:\n        xAxis?.nameProps?.location == null ||\n        xAxis?.nameProps?.location === \"center\"\n          ? xAxis?.position === \"bottom\"\n            ? [30, 0, 0, 0]\n            : [0, 0, 30, 0]\n          : undefined,\n      ...xAxis?.nameProps,\n    },\n    data: chartData.array(groupByKey),\n  });\n\n  const chartSeries = useSeries({\n    data: chartData,\n    filterKey: groupByKey,\n    valuesProps,\n    delta: !!(delta && colorScale == null),\n  });\n\n  const chartGridLayout = useGridLayout({\n    data: chartData,\n    format,\n    filterKey: groupByKey,\n    visualMapVisible: chartVisualMap.visualMap.show,\n    visualMapYPosition: chartVisualMap.visualMap.top,\n    xAxisPosition: chartXAxis.xAxis.position,\n  });\n\n  const chartGrid = useGrid({\n    // If sizes are provided, the grid size should automatically adapt to the values provided\n    width: width != null ? undefined : chartGridLayout.size.width,\n    height: height != null ? undefined : chartGridLayout.size.height,\n    ...chartGridLayout.padding,\n    ...grid,\n  });\n\n  const size = useMemo(() => {\n    return {\n      width,\n      // Echarts has a problem were the height is always set to 300px\n      // Thus, we need to update the height to make sure the chart is not cut out\n      height:\n        height ??\n        chartGridLayout.size.height +\n          chartGridLayout.padding.bottom +\n          chartGridLayout.padding.top,\n    };\n  }, [\n    chartGridLayout.padding.bottom,\n    chartGridLayout.padding.top,\n    chartGridLayout.size.height,\n    height,\n    width,\n  ]);\n\n  const option = useOption({\n    option: {\n      ...chartVisualMap,\n      ...chartTooltip,\n      ...chartGrid,\n      ...chartXAxis,\n      ...chartYAxis,\n      ...chartSeries,\n    },\n    onOptionChange,\n  });\n\n  return <HvBaseChart ref={ref} option={option} {...size} />;\n});\n"],"names":["echarts","use","HeatmapChart","VisualMapComponent","GridComponent","TooltipComponent","HvConfusionMatrix","forwardRef","props","ref","legend","groupBy","measure","sortBy","splitBy","grid","data","dataProp","tooltip","xAxis","yAxis","colorScale","colorScaleProp","delta","valuesProps","width","height","format","classes","classesProp","onOptionChange","useClasses","groupByKey","getGroupKey","chartData","useData","measures","undefined","useColorScale","custom","filterKey","chartVisualMap","useVisualMap","show","pieces","type","chartTooltip","useTooltip","component","params","value","series","fmtValue","valueFormatter","ftmTitle","titleFormatter","title","content","name","tooltipRoot","tooltipContainer","tooltipText","chartYAxis","useYAxis","axes","position","nameProps","location","padding","columnNames","filter","p","reverse","chartXAxis","useXAxis","array","chartSeries","useSeries","chartGridLayout","useGridLayout","visualMapVisible","visualMap","visualMapYPosition","top","xAxisPosition","chartGrid","useGrid","size","useMemo","bottom","option","useOption"],"mappings":"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"}
+{"version":3,"file":"ConfusionMatrix.js","sources":["../../../../src/components/ConfusionMatrix/ConfusionMatrix.tsx"],"sourcesContent":["import { forwardRef, useMemo } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { HeatmapChart } from \"echarts/charts\";\nimport {\n  VisualMapComponent,\n  GridComponent,\n  TooltipComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable, ExtractNames } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  HvVisualMapHookProps,\n  useData,\n  useGrid,\n  useOption,\n  useTooltip,\n  useVisualMap,\n  useXAxis,\n  useYAxis,\n} from \"@viz/hooks\";\nimport { getGroupKey } from \"@viz/utils\";\n\nimport { HvBaseChart } from \"../BaseChart\";\nimport { useClasses } from \"./ConfusionMatrix.styles\";\nimport {\n  HvChartCommonProps,\n  HvChartXAxis,\n  HvChartYAxis,\n} from \"../../types/common\";\nimport { HvChartTooltip } from \"../../types/tooltip\";\nimport { HvConfusionMatrixMeasure } from \"../../types/measures\";\nimport { useColorScale, useGridLayout, useSeries } from \"./utils\";\nimport {\n  HvConfusionMatrixFormat,\n  HvConfusionMatrixColorScale,\n  HvConfusionMatrixValuesProps,\n} from \"./types\";\n\n// Register chart components\necharts.use([\n  HeatmapChart,\n  VisualMapComponent,\n  GridComponent,\n  TooltipComponent,\n]);\n\nexport type HvConfusionMatrixClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvConfusionMatrixProps\n  extends Omit<HvChartCommonProps, \"tooltip\"> {\n  /** Column to measure. */\n  measure: HvConfusionMatrixMeasure;\n  /** Columns to use to split the measure. */\n  splitBy?: Arrayable<string>;\n  /**\n   * Column to use for the delta confusion matrix.\n   *\n   * It can be set to `true` in case the `measure` already has the calculations for the delta confusion matrix.\n   */\n  delta?: boolean | string;\n  /** Options for the xAxis, i.e. the horizontal axis. */\n  xAxis?: HvChartXAxis;\n  /** Options for the yAxis, i.e. the vertical axis. */\n  yAxis?: HvChartYAxis;\n  /** Tooltip options. */\n  tooltip?: Omit<HvChartTooltip, \"type\">;\n  /** Format of the confusion matrix. Defaults to `square`. */\n  format?: HvConfusionMatrixFormat;\n  /** Properties to customize the prediction values. */\n  valuesProps?: HvConfusionMatrixValuesProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvConfusionMatrixClasses;\n  /**\n   * Color scale of the confusion matrix.\n   *\n   * If an array of two strings is provided, the first and second values are the lower and upper ends of the scale, respectively.\n   * An array of objects can also be used to create a custom scale.\n   * If `delta` is not provided, a default color scale is used when `colorScale` is not defined: `[base-light, cat3]`.\n   */\n  colorScale?: [string, string] | HvConfusionMatrixColorScale[];\n}\n\n/**\n * Confusion Matrix is a table displaying the performance of a predictive model.\n * Typically the columns show the predicted class and the rows the expected class.\n * The main diagonal counts the positive matches while the cells outside it count the mismatches between predicted and expected.\n */\nexport const HvConfusionMatrix = forwardRef<\n  ReactECharts,\n  HvConfusionMatrixProps\n>((props, ref) => {\n  const {\n    legend,\n    groupBy,\n    measure,\n    sortBy,\n    splitBy,\n    grid,\n    data: dataProp,\n    tooltip,\n    xAxis,\n    yAxis,\n    colorScale: colorScaleProp,\n    delta,\n    valuesProps,\n    width,\n    height,\n    format = \"square\",\n    classes: classesProp,\n    onOptionChange,\n  } = props;\n\n  const { classes } = useClasses(classesProp);\n\n  const groupByKey = getGroupKey(groupBy);\n\n  const chartData = useData({\n    data: dataProp,\n    groupBy,\n    measures: [measure],\n    sortBy: sortBy ?? groupBy, // automatically orders x axis to create the confusion matrix\n    splitBy,\n    delta: typeof delta === \"string\" ? delta : undefined,\n  });\n\n  const colorScale = useColorScale({\n    delta: !!delta,\n    data: chartData,\n    custom: colorScaleProp,\n    filterKey: groupByKey,\n  });\n\n  const chartVisualMap = useVisualMap({\n    show: colorScale?.pieces != null,\n    type: colorScale?.pieces != null ? \"piecewise\" : \"continuous\",\n    ...(colorScale as Pick<\n      HvVisualMapHookProps,\n      \"max\" | \"min\" | \"colorScale\" | \"pieces\"\n    >),\n    ...legend,\n  });\n\n  const chartTooltip = useTooltip({\n    component: (params) => {\n      const value = params?.series?.[0].value;\n      const fmtValue =\n        typeof measure !== \"string\" && measure.valueFormatter\n          ? measure.valueFormatter(value)\n          : tooltip?.valueFormatter\n          ? tooltip?.valueFormatter(value)\n          : value;\n      const ftmTitle = tooltip?.titleFormatter\n        ? tooltip.titleFormatter(params?.title)\n        : params?.title;\n\n      const content = `${ftmTitle} - ${params?.series?.[0].name}: ${fmtValue}`;\n\n      return `\n        <div class=\"${classes.tooltipRoot}\">\n            <div class=\"${classes.tooltipContainer}\">\n                <div>\n                    <p class=\"${classes.tooltipText}\">${content}</p>\n                </div>\n            </div>\n        </div>`;\n    },\n    ...tooltip,\n  });\n\n  const chartYAxis = useYAxis({\n    axes: [\n      {\n        type: \"categorical\",\n        name: \"True Label\",\n        position: \"left\",\n        ...yAxis,\n        nameProps: {\n          location: \"center\",\n          padding:\n            yAxis?.nameProps?.location == null ||\n            yAxis?.nameProps?.location === \"center\"\n              ? yAxis?.position === \"right\"\n                ? [50, 0, 0, 0]\n                : [0, 0, 50, 0]\n              : undefined,\n          ...yAxis?.nameProps,\n        },\n        data: chartData\n          .columnNames()\n          .filter((p) => p !== groupByKey)\n          .reverse(),\n      },\n    ],\n  });\n\n  const chartXAxis = useXAxis({\n    name: \"Predicted Value\",\n    position: \"top\",\n    ...xAxis,\n    nameProps: {\n      location: \"center\",\n      padding:\n        xAxis?.nameProps?.location == null ||\n        xAxis?.nameProps?.location === \"center\"\n          ? xAxis?.position === \"bottom\"\n            ? [30, 0, 0, 0]\n            : [0, 0, 30, 0]\n          : undefined,\n      ...xAxis?.nameProps,\n    },\n    data: chartData.array(groupByKey),\n  });\n\n  const chartSeries = useSeries({\n    data: chartData,\n    filterKey: groupByKey,\n    valuesProps,\n    delta: !!(delta && colorScale == null),\n  });\n\n  const chartGridLayout = useGridLayout({\n    data: chartData,\n    format,\n    filterKey: groupByKey,\n    visualMapVisible: chartVisualMap.visualMap.show,\n    visualMapYPosition: chartVisualMap.visualMap.top,\n    xAxisPosition: chartXAxis.xAxis.position,\n  });\n\n  const chartGrid = useGrid({\n    // If sizes are provided, the grid size should automatically adapt to the values provided\n    width: width != null ? undefined : chartGridLayout.size.width,\n    height: height != null ? undefined : chartGridLayout.size.height,\n    ...chartGridLayout.padding,\n    ...grid,\n  });\n\n  const size = useMemo(() => {\n    return {\n      width,\n      // Echarts has a problem were the height is always set to 300px\n      // Thus, we need to update the height to make sure the chart is not cut out\n      height:\n        height ??\n        chartGridLayout.size.height +\n          chartGridLayout.padding.bottom +\n          chartGridLayout.padding.top,\n    };\n  }, [\n    chartGridLayout.padding.bottom,\n    chartGridLayout.padding.top,\n    chartGridLayout.size.height,\n    height,\n    width,\n  ]);\n\n  const option = useOption({\n    option: {\n      ...chartVisualMap,\n      ...chartTooltip,\n      ...chartGrid,\n      ...chartXAxis,\n      ...chartYAxis,\n      ...chartSeries,\n    },\n    onOptionChange,\n  });\n\n  return <HvBaseChart ref={ref} option={option} {...size} />;\n});\n"],"names":["echarts","use","HeatmapChart","VisualMapComponent","GridComponent","TooltipComponent","HvConfusionMatrix","forwardRef","props","ref","legend","groupBy","measure","sortBy","splitBy","grid","data","dataProp","tooltip","xAxis","yAxis","colorScale","colorScaleProp","delta","valuesProps","width","height","format","classes","classesProp","onOptionChange","useClasses","groupByKey","getGroupKey","chartData","useData","measures","undefined","useColorScale","custom","filterKey","chartVisualMap","useVisualMap","show","pieces","type","chartTooltip","useTooltip","component","params","value","series","fmtValue","valueFormatter","ftmTitle","titleFormatter","title","content","name","tooltipRoot","tooltipContainer","tooltipText","chartYAxis","useYAxis","axes","position","nameProps","location","padding","columnNames","filter","p","reverse","chartXAxis","useXAxis","array","chartSeries","useSeries","chartGridLayout","useGridLayout","visualMapVisible","visualMap","visualMapYPosition","top","xAxisPosition","chartGrid","useGrid","size","useMemo","bottom","option","useOption"],"mappings":"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"}

package/dist/esm/components/ConfusionMatrix/utils.js

@@ -18,7 +18,7 @@ const useColorScale = ({
         pieces: custom.reduce((acc, curr) => {
           acc.push({
             ...curr,
-            color: (colors == null ? void 0 : colors[curr.color]) || curr.color
+            color: colors?.[curr.color] || curr.color
           });
           return acc;
         }, [])
@@ -31,7 +31,7 @@ const useColorScale = ({
     const max = Math.max(...flatData);
     const min = Math.min(...flatData);
     return {
-      colorScale: custom || [(colors == null ? void 0 : colors.base_light) || "", (colors == null ? void 0 : colors.cat3) || ""],
+      colorScale: custom || [colors?.base_light || "", colors?.cat3 || ""],
       max,
       min
     };
@@ -49,12 +49,12 @@ const useSeries = ({
   } = useTheme();
   const getDeltaColor = useCallback((value, diagonal) => {
     if (diagonal && value > 0 || !diagonal && value < 0) {
-      return colors == null ? void 0 : colors.positive;
+      return colors?.positive;
     }
     if (diagonal && value < 0 || !diagonal && value > 0) {
-      return colors == null ? void 0 : colors.negative;
+      return colors?.negative;
     }
-    return colors == null ? void 0 : colors.base_light;
+    return colors?.base_light;
   }, [colors]);
   const chartSeries = useMemo(() => {
     return {
@@ -64,8 +64,8 @@ const useSeries = ({
         label: {
           show: true,
           ...valuesProps,
-          ...(valuesProps == null ? void 0 : valuesProps.color) && {
-            color: (colors == null ? void 0 : colors[valuesProps.color]) || valuesProps.color
+          ...valuesProps?.color && {
+            color: colors?.[valuesProps.color] || valuesProps.color
           }
         },
         emphasis: {

package/dist/esm/components/ConfusionMatrix/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../src/components/ConfusionMatrix/utils.ts"],"sourcesContent":["import { useMemo, useCallback } from \"react\";\n\nimport type ColumnTable from \"arquero/dist/types/table/column-table\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { HvChartXAxis } from \"@viz/types/common\";\n\nimport {\n  HvConfusionMatrixColorScale,\n  HvConfusionMatrixFormat,\n  HvConfusionMatrixValuesProps,\n} from \"./types\";\n\nexport const useColorScale = ({\n  data,\n  delta,\n  custom,\n  filterKey,\n}: {\n  data: ColumnTable;\n  delta: boolean;\n  filterKey: string;\n  custom?: [string, string] | HvConfusionMatrixColorScale[];\n}) => {\n  const { colors } = useTheme();\n\n  const colorScale = useMemo(() => {\n    if (custom == null && delta) {\n      return;\n    }\n\n    if (custom && typeof custom[0] === \"object\") {\n      return {\n        pieces: (custom as HvConfusionMatrixColorScale[]).reduce(\n          (acc: HvConfusionMatrixColorScale[], curr) => {\n            acc.push({\n              ...curr,\n              color: colors?.[curr.color] || curr.color,\n            });\n            return acc;\n          },\n          []\n        ),\n      };\n    }\n\n    const flatData = data\n      .columnNames()\n      .filter((p) => p !== filterKey)\n      .reduce((acc: number[], c: string) => {\n        acc.push(...data.array(c));\n        return acc;\n      }, []);\n    const max = Math.max(...flatData);\n    const min = Math.min(...flatData);\n\n    return {\n      colorScale: custom || [colors?.base_light || \"\", colors?.cat3 || \"\"],\n      max,\n      min,\n    };\n  }, [colors, custom, data, filterKey, delta]);\n\n  return colorScale;\n};\n\nexport const useSeries = ({\n  data,\n  filterKey,\n  delta,\n  valuesProps,\n}: {\n  data: ColumnTable;\n  filterKey: string;\n  delta: boolean;\n  valuesProps?: HvConfusionMatrixValuesProps;\n}) => {\n  const { colors } = useTheme();\n\n  const getDeltaColor = useCallback(\n    (value: number, diagonal: boolean) => {\n      if ((diagonal && value > 0) || (!diagonal && value < 0)) {\n        return colors?.positive;\n      }\n      if ((diagonal && value < 0) || (!diagonal && value > 0)) {\n        return colors?.negative;\n      }\n\n      return colors?.base_light;\n    },\n    [colors]\n  );\n\n  const chartSeries = useMemo(() => {\n    return {\n      series: {\n        id: `series~${filterKey}`,\n        type: \"heatmap\",\n        label: {\n          show: true,\n          ...valuesProps,\n          ...(valuesProps?.color && {\n            color: colors?.[valuesProps.color] || valuesProps.color,\n          }),\n        },\n        emphasis: {\n          disabled: true,\n        },\n        data: data\n          .columnNames()\n          .filter((p) => p !== filterKey)\n          .reduce((acc: (string | number)[][], c: string, j) => {\n            const row: (string | number)[][] = data\n              .array(c)\n              .reduce((racc, rv, i) => {\n                racc.push({\n                  value: [data.array(filterKey)[i], c, rv != null ? rv : \"-\"],\n                  ...(delta && {\n                    visualMap: false,\n                    itemStyle: {\n                      color: getDeltaColor(rv, i === j),\n                    },\n                  }),\n                });\n                return racc;\n              }, []);\n\n            acc.push(...row);\n            return acc;\n          }, []),\n      },\n    };\n  }, [colors, data, delta, filterKey, getDeltaColor, valuesProps]);\n\n  return chartSeries;\n};\n\nconst SQUARE_SIZE = 52;\n\nexport const useGridLayout = ({\n  data,\n  filterKey,\n  format,\n  xAxisPosition,\n  visualMapVisible,\n  visualMapYPosition,\n}: {\n  xAxisPosition: HvChartXAxis[\"position\"];\n  data: ColumnTable;\n  filterKey: string;\n  format: HvConfusionMatrixFormat;\n  visualMapVisible: boolean;\n  visualMapYPosition: \"top\" | \"center\" | \"bottom\";\n}) => {\n  const size = useMemo(() => {\n    const nCols = data.array(filterKey).length;\n    const nRows = data.columnNames().filter((p) => p !== filterKey).length;\n    const itemHeight = format === \"square\" ? SQUARE_SIZE : SQUARE_SIZE / 2;\n\n    return {\n      padding: {\n        bottom:\n          xAxisPosition === \"bottom\" ||\n          (visualMapVisible && visualMapYPosition === \"bottom\")\n            ? 60\n            : 20,\n        top:\n          xAxisPosition === \"top\" ||\n          (visualMapVisible && visualMapYPosition === \"top\")\n            ? 60\n            : 20,\n        ...(visualMapVisible &&\n          visualMapYPosition === \"bottom\" &&\n          xAxisPosition === \"bottom\" && {\n            bottom: 100,\n          }),\n        ...(visualMapVisible &&\n          visualMapYPosition === \"top\" &&\n          xAxisPosition === \"top\" && {\n            top: 100,\n          }),\n        left: 80,\n        right: 80,\n      },\n      size: {\n        height: Math.max(itemHeight * nRows, itemHeight * 8),\n        width: Math.max(SQUARE_SIZE * nCols, SQUARE_SIZE * 8),\n      },\n    };\n  }, [\n    data,\n    filterKey,\n    format,\n    visualMapVisible,\n    visualMapYPosition,\n    xAxisPosition,\n  ]);\n\n  return size;\n};\n"],"names":["useColorScale","data","delta","custom","filterKey","colors","useTheme","colorScale","useMemo","pieces","reduce","acc","curr","push","color","flatData","columnNames","filter","p","c","array","max","Math","min","base_light","cat3","useSeries","valuesProps","getDeltaColor","useCallback","value","diagonal","positive","negative","chartSeries","series","id","type","label","show","emphasis","disabled","j","row","racc","rv","i","visualMap","itemStyle","SQUARE_SIZE","useGridLayout","format","xAxisPosition","visualMapVisible","visualMapYPosition","size","nCols","length","nRows","itemHeight","padding","bottom","top","left","right","height","width"],"mappings":"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"}
+{"version":3,"file":"utils.js","sources":["../../../../src/components/ConfusionMatrix/utils.ts"],"sourcesContent":["import { useMemo, useCallback } from \"react\";\n\nimport type ColumnTable from \"arquero/dist/types/table/column-table\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { HvChartXAxis } from \"@viz/types/common\";\n\nimport {\n  HvConfusionMatrixColorScale,\n  HvConfusionMatrixFormat,\n  HvConfusionMatrixValuesProps,\n} from \"./types\";\n\nexport const useColorScale = ({\n  data,\n  delta,\n  custom,\n  filterKey,\n}: {\n  data: ColumnTable;\n  delta: boolean;\n  filterKey: string;\n  custom?: [string, string] | HvConfusionMatrixColorScale[];\n}) => {\n  const { colors } = useTheme();\n\n  const colorScale = useMemo(() => {\n    if (custom == null && delta) {\n      return;\n    }\n\n    if (custom && typeof custom[0] === \"object\") {\n      return {\n        pieces: (custom as HvConfusionMatrixColorScale[]).reduce(\n          (acc: HvConfusionMatrixColorScale[], curr) => {\n            acc.push({\n              ...curr,\n              color: colors?.[curr.color] || curr.color,\n            });\n            return acc;\n          },\n          []\n        ),\n      };\n    }\n\n    const flatData = data\n      .columnNames()\n      .filter((p) => p !== filterKey)\n      .reduce((acc: number[], c: string) => {\n        acc.push(...data.array(c));\n        return acc;\n      }, []);\n    const max = Math.max(...flatData);\n    const min = Math.min(...flatData);\n\n    return {\n      colorScale: custom || [colors?.base_light || \"\", colors?.cat3 || \"\"],\n      max,\n      min,\n    };\n  }, [colors, custom, data, filterKey, delta]);\n\n  return colorScale;\n};\n\nexport const useSeries = ({\n  data,\n  filterKey,\n  delta,\n  valuesProps,\n}: {\n  data: ColumnTable;\n  filterKey: string;\n  delta: boolean;\n  valuesProps?: HvConfusionMatrixValuesProps;\n}) => {\n  const { colors } = useTheme();\n\n  const getDeltaColor = useCallback(\n    (value: number, diagonal: boolean) => {\n      if ((diagonal && value > 0) || (!diagonal && value < 0)) {\n        return colors?.positive;\n      }\n      if ((diagonal && value < 0) || (!diagonal && value > 0)) {\n        return colors?.negative;\n      }\n\n      return colors?.base_light;\n    },\n    [colors]\n  );\n\n  const chartSeries = useMemo(() => {\n    return {\n      series: {\n        id: `series~${filterKey}`,\n        type: \"heatmap\",\n        label: {\n          show: true,\n          ...valuesProps,\n          ...(valuesProps?.color && {\n            color: colors?.[valuesProps.color] || valuesProps.color,\n          }),\n        },\n        emphasis: {\n          disabled: true,\n        },\n        data: data\n          .columnNames()\n          .filter((p) => p !== filterKey)\n          .reduce((acc: (string | number)[][], c: string, j) => {\n            const row: (string | number)[][] = data\n              .array(c)\n              .reduce((racc, rv, i) => {\n                racc.push({\n                  value: [data.array(filterKey)[i], c, rv != null ? rv : \"-\"],\n                  ...(delta && {\n                    visualMap: false,\n                    itemStyle: {\n                      color: getDeltaColor(rv, i === j),\n                    },\n                  }),\n                });\n                return racc;\n              }, []);\n\n            acc.push(...row);\n            return acc;\n          }, []),\n      },\n    };\n  }, [colors, data, delta, filterKey, getDeltaColor, valuesProps]);\n\n  return chartSeries;\n};\n\nconst SQUARE_SIZE = 52;\n\nexport const useGridLayout = ({\n  data,\n  filterKey,\n  format,\n  xAxisPosition,\n  visualMapVisible,\n  visualMapYPosition,\n}: {\n  xAxisPosition: HvChartXAxis[\"position\"];\n  data: ColumnTable;\n  filterKey: string;\n  format: HvConfusionMatrixFormat;\n  visualMapVisible: boolean;\n  visualMapYPosition: \"top\" | \"center\" | \"bottom\";\n}) => {\n  const size = useMemo(() => {\n    const nCols = data.array(filterKey).length;\n    const nRows = data.columnNames().filter((p) => p !== filterKey).length;\n    const itemHeight = format === \"square\" ? SQUARE_SIZE : SQUARE_SIZE / 2;\n\n    return {\n      padding: {\n        bottom:\n          xAxisPosition === \"bottom\" ||\n          (visualMapVisible && visualMapYPosition === \"bottom\")\n            ? 60\n            : 20,\n        top:\n          xAxisPosition === \"top\" ||\n          (visualMapVisible && visualMapYPosition === \"top\")\n            ? 60\n            : 20,\n        ...(visualMapVisible &&\n          visualMapYPosition === \"bottom\" &&\n          xAxisPosition === \"bottom\" && {\n            bottom: 100,\n          }),\n        ...(visualMapVisible &&\n          visualMapYPosition === \"top\" &&\n          xAxisPosition === \"top\" && {\n            top: 100,\n          }),\n        left: 80,\n        right: 80,\n      },\n      size: {\n        height: Math.max(itemHeight * nRows, itemHeight * 8),\n        width: Math.max(SQUARE_SIZE * nCols, SQUARE_SIZE * 8),\n      },\n    };\n  }, [\n    data,\n    filterKey,\n    format,\n    visualMapVisible,\n    visualMapYPosition,\n    xAxisPosition,\n  ]);\n\n  return size;\n};\n"],"names":["useColorScale","data","delta","custom","filterKey","colors","useTheme","colorScale","useMemo","pieces","reduce","acc","curr","push","color","flatData","columnNames","filter","p","c","array","max","Math","min","base_light","cat3","useSeries","valuesProps","getDeltaColor","useCallback","value","diagonal","positive","negative","chartSeries","series","id","type","label","show","emphasis","disabled","j","row","racc","rv","i","visualMap","itemStyle","SQUARE_SIZE","useGridLayout","format","xAxisPosition","visualMapVisible","visualMapYPosition","size","nCols","length","nRows","itemHeight","padding","bottom","top","left","right","height","width"],"mappings":"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"}

package/dist/esm/components/DonutChart/DonutChart.js

@@ -44,7 +44,7 @@ const HvDonutChart = forwardRef((props, ref) => {
   });
   const chartLegend = useLegend({
     ...legend,
-    show: (legend == null ? void 0 : legend.show) ?? true,
+    show: legend?.show ?? true,
     icon: "square",
     series: chartSeries.series,
     formatter: slicesNameFormatter

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

@@ -1 +1 @@
-{"version":3,"file":"DonutChart.js","sources":["../../../../src/components/DonutChart/DonutChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { PieChart } from \"echarts/charts\";\nimport {\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport {\n  HvChartTooltipClasses,\n  useData,\n  useDataset,\n  useGrid,\n  useLegend,\n  useOption,\n  useSeries,\n  useTooltip,\n} from \"@viz/hooks\";\n\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvChartCommonProps } from \"../../types/common\";\nimport { HvDonutChartMeasure } from \"../../types\";\n\n// Register chart components\necharts.use([\n  PieChart,\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n]);\n\nexport interface HvDonutChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvDonutChartProps extends HvChartCommonProps {\n  /** Column to measure. */\n  measure: HvDonutChartMeasure;\n  /** Type: regular or thin. Defaults to `regular`. */\n  type?: \"regular\" | \"thin\";\n  /** Formatter for the slices names used on the tooltips and legend. */\n  slicesNameFormatter?: (value?: string) => string;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvDonutChartClasses;\n}\n\n/**\n * Donut charts nicely convey the part-whole relationship and they have become\n * the most recognizable chart types for representing proportions in business and data statistics.\n */\nexport const HvDonutChart = forwardRef<ReactECharts, HvDonutChartProps>(\n  (props, ref) => {\n    const {\n      data,\n      groupBy,\n      classes,\n      legend,\n      tooltip,\n      measure: measures,\n      sortBy,\n      grid,\n      width,\n      height,\n      type = \"regular\",\n      slicesNameFormatter,\n      onOptionChange,\n    } = props;\n\n    const chartData = useData({ data, groupBy, measures, sortBy });\n\n    const chartDataset = useDataset(chartData);\n\n    const chartSeries = useSeries({\n      type: \"pie\",\n      data: chartData,\n      groupBy,\n      measures,\n      radius: type === \"thin\" ? [\"65%\", \"70%\"] : [\"55%\", \"70%\"],\n    });\n\n    const chartLegend = useLegend({\n      ...legend,\n      show: legend?.show ?? true,\n      icon: \"square\",\n      series: chartSeries.series,\n      formatter: slicesNameFormatter,\n    });\n\n    const chartTooltip = useTooltip({\n      ...tooltip,\n      measures,\n      classes,\n      nameFormatter: slicesNameFormatter,\n    });\n\n    const chartGrid = useGrid({ ...grid });\n\n    const option = useOption({\n      option: {\n        ...chartSeries,\n        ...chartDataset,\n        ...chartLegend,\n        ...chartTooltip,\n        ...chartGrid,\n      },\n      onOptionChange,\n    });\n\n    return (\n      <HvBaseChart ref={ref} option={option} width={width} height={height} />\n    );\n  }\n);\n"],"names":["echarts","use","PieChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","HvDonutChart","forwardRef","props","ref","data","groupBy","classes","legend","tooltip","measure","measures","sortBy","grid","width","height","type","slicesNameFormatter","onOptionChange","chartData","useData","chartDataset","useDataset","chartSeries","useSeries","radius","chartLegend","useLegend","show","icon","series","formatter","chartTooltip","useTooltip","nameFormatter","chartGrid","useGrid","option","useOption"],"mappings":";;;;;;;;;;;;;AA4BAA,QAAQC,IAAI,CACVC,UACAC,kBACAC,eACAC,kBACAC,eAAe,CAChB;AAmBM,MAAMC,eAAeC,WAC1B,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,OAAO;AAAA,IACPC;AAAAA,IACAC;AAAAA,EACEf,IAAAA;AAEJ,QAAMgB,YAAYC,QAAQ;AAAA,IAAEf;AAAAA,IAAMC;AAAAA,IAASK;AAAAA,IAAUC;AAAAA,EAAAA,CAAQ;AAEvDS,QAAAA,eAAeC,WAAWH,SAAS;AAEzC,QAAMI,cAAcC,UAAU;AAAA,IAC5BR,MAAM;AAAA,IACNX,MAAMc;AAAAA,IACNb;AAAAA,IACAK;AAAAA,IACAc,QAAQT,SAAS,SAAS,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,KAAK;AAAA,EAAA,CACzD;AAED,QAAMU,cAAcC,UAAU;AAAA,IAC5B,GAAGnB;AAAAA,IACHoB,OAAMpB,iCAAQoB,SAAQ;AAAA,IACtBC,MAAM;AAAA,IACNC,QAAQP,YAAYO;AAAAA,IACpBC,WAAWd;AAAAA,EAAAA,CACZ;AAED,QAAMe,eAAeC,WAAW;AAAA,IAC9B,GAAGxB;AAAAA,IACHE;AAAAA,IACAJ;AAAAA,IACA2B,eAAejB;AAAAA,EAAAA,CAChB;AAED,QAAMkB,YAAYC,QAAQ;AAAA,IAAE,GAAGvB;AAAAA,EAAAA,CAAM;AAErC,QAAMwB,SAASC,UAAU;AAAA,IACvBD,QAAQ;AAAA,MACN,GAAGd;AAAAA,MACH,GAAGF;AAAAA,MACH,GAAGK;AAAAA,MACH,GAAGM;AAAAA,MACH,GAAGG;AAAAA,IACL;AAAA,IACAjB;AAAAA,EAAAA,CACD;AAED,SACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAkB,CAAA;AAE3E,CACF;"}
+{"version":3,"file":"DonutChart.js","sources":["../../../../src/components/DonutChart/DonutChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { PieChart } from \"echarts/charts\";\nimport {\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport {\n  HvChartTooltipClasses,\n  useData,\n  useDataset,\n  useGrid,\n  useLegend,\n  useOption,\n  useSeries,\n  useTooltip,\n} from \"@viz/hooks\";\n\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvChartCommonProps } from \"../../types/common\";\nimport { HvDonutChartMeasure } from \"../../types\";\n\n// Register chart components\necharts.use([\n  PieChart,\n  DatasetComponent,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n]);\n\nexport interface HvDonutChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvDonutChartProps extends HvChartCommonProps {\n  /** Column to measure. */\n  measure: HvDonutChartMeasure;\n  /** Type: regular or thin. Defaults to `regular`. */\n  type?: \"regular\" | \"thin\";\n  /** Formatter for the slices names used on the tooltips and legend. */\n  slicesNameFormatter?: (value?: string) => string;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvDonutChartClasses;\n}\n\n/**\n * Donut charts nicely convey the part-whole relationship and they have become\n * the most recognizable chart types for representing proportions in business and data statistics.\n */\nexport const HvDonutChart = forwardRef<ReactECharts, HvDonutChartProps>(\n  (props, ref) => {\n    const {\n      data,\n      groupBy,\n      classes,\n      legend,\n      tooltip,\n      measure: measures,\n      sortBy,\n      grid,\n      width,\n      height,\n      type = \"regular\",\n      slicesNameFormatter,\n      onOptionChange,\n    } = props;\n\n    const chartData = useData({ data, groupBy, measures, sortBy });\n\n    const chartDataset = useDataset(chartData);\n\n    const chartSeries = useSeries({\n      type: \"pie\",\n      data: chartData,\n      groupBy,\n      measures,\n      radius: type === \"thin\" ? [\"65%\", \"70%\"] : [\"55%\", \"70%\"],\n    });\n\n    const chartLegend = useLegend({\n      ...legend,\n      show: legend?.show ?? true,\n      icon: \"square\",\n      series: chartSeries.series,\n      formatter: slicesNameFormatter,\n    });\n\n    const chartTooltip = useTooltip({\n      ...tooltip,\n      measures,\n      classes,\n      nameFormatter: slicesNameFormatter,\n    });\n\n    const chartGrid = useGrid({ ...grid });\n\n    const option = useOption({\n      option: {\n        ...chartSeries,\n        ...chartDataset,\n        ...chartLegend,\n        ...chartTooltip,\n        ...chartGrid,\n      },\n      onOptionChange,\n    });\n\n    return (\n      <HvBaseChart ref={ref} option={option} width={width} height={height} />\n    );\n  }\n);\n"],"names":["echarts","use","PieChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","HvDonutChart","forwardRef","props","ref","data","groupBy","classes","legend","tooltip","measure","measures","sortBy","grid","width","height","type","slicesNameFormatter","onOptionChange","chartData","useData","chartDataset","useDataset","chartSeries","useSeries","radius","chartLegend","useLegend","show","icon","series","formatter","chartTooltip","useTooltip","nameFormatter","chartGrid","useGrid","option","useOption"],"mappings":";;;;;;;;;;;;;AA4BAA,QAAQC,IAAI,CACVC,UACAC,kBACAC,eACAC,kBACAC,eAAe,CAChB;AAmBM,MAAMC,eAAeC,WAC1B,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,OAAO;AAAA,IACPC;AAAAA,IACAC;AAAAA,EACEf,IAAAA;AAEJ,QAAMgB,YAAYC,QAAQ;AAAA,IAAEf;AAAAA,IAAMC;AAAAA,IAASK;AAAAA,IAAUC;AAAAA,EAAAA,CAAQ;AAEvDS,QAAAA,eAAeC,WAAWH,SAAS;AAEzC,QAAMI,cAAcC,UAAU;AAAA,IAC5BR,MAAM;AAAA,IACNX,MAAMc;AAAAA,IACNb;AAAAA,IACAK;AAAAA,IACAc,QAAQT,SAAS,SAAS,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,KAAK;AAAA,EAAA,CACzD;AAED,QAAMU,cAAcC,UAAU;AAAA,IAC5B,GAAGnB;AAAAA,IACHoB,MAAMpB,QAAQoB,QAAQ;AAAA,IACtBC,MAAM;AAAA,IACNC,QAAQP,YAAYO;AAAAA,IACpBC,WAAWd;AAAAA,EAAAA,CACZ;AAED,QAAMe,eAAeC,WAAW;AAAA,IAC9B,GAAGxB;AAAAA,IACHE;AAAAA,IACAJ;AAAAA,IACA2B,eAAejB;AAAAA,EAAAA,CAChB;AAED,QAAMkB,YAAYC,QAAQ;AAAA,IAAE,GAAGvB;AAAAA,EAAAA,CAAM;AAErC,QAAMwB,SAASC,UAAU;AAAA,IACvBD,QAAQ;AAAA,MACN,GAAGd;AAAAA,MACH,GAAGF;AAAAA,MACH,GAAGK;AAAAA,MACH,GAAGM;AAAAA,MACH,GAAGG;AAAAA,IACL;AAAA,IACAjB;AAAAA,EAAAA,CACD;AAED,SACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAkB,CAAA;AAE3E,CACF;"}

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

@@ -54,7 +54,7 @@ const HvLineChart = forwardRef((props, ref) => {
     scale: true
   });
   const chartSlider = useDataZoom({
-    showHorizontal: horizontalRangeSlider == null ? void 0 : horizontalRangeSlider.show
+    showHorizontal: horizontalRangeSlider?.show
   });
   const chartGrid = useGrid({
     ...grid

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

@@ -1 +1 @@
-{"version":3,"file":"LineChart.js","sources":["../../../../src/components/LineChart/LineChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\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\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  useYAxis,\n  useXAxis,\n  useDataZoom,\n  useGrid,\n  useData,\n  useDataset,\n  useSeries,\n  useLegend,\n  useTooltip,\n  HvChartTooltipClasses,\n  useOption,\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 = forwardRef<ReactECharts, HvLineChartProps>(\n  (props, ref) => {\n    const {\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      width,\n      height,\n      onOptionChange,\n    } = props;\n\n    const chartData = useData({ data, groupBy, measures, splitBy, sortBy });\n\n    const chartDataset = useDataset(chartData);\n\n    const chartYAxis = useYAxis({\n      axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n    });\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 option = useOption({\n      option: {\n        ...chartYAxis,\n        ...chartXAxis,\n        ...chartSlider,\n        ...chartGrid,\n        ...chartDataset,\n        ...chartSeries,\n        ...chartLegend,\n        ...chartTooltip,\n      },\n      onOptionChange,\n    });\n\n    return (\n      <HvBaseChart ref={ref} option={option} width={width} height={height} />\n    );\n  }\n);\n"],"names":["echarts","use","LineChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","HvLineChart","forwardRef","props","ref","area","emptyCellMode","areaOpacity","yAxis","xAxis","horizontalRangeSlider","grid","data","groupBy","splitBy","sortBy","measures","stack","seriesNameFormatter","legend","classes","tooltip","width","height","onOptionChange","chartData","useData","chartDataset","useDataset","chartYAxis","useYAxis","axes","Array","isArray","chartXAxis","useXAxis","scale","chartSlider","useDataZoom","showHorizontal","show","chartGrid","useGrid","chartSeries","useSeries","type","nameFormatter","chartLegend","useLegend","series","chartTooltip","useTooltip","trigger","option","useOption"],"mappings":";;;;;;;;;;;;;;;;AAmCAA,QAAQC,IAAI,CACVC,WACAC,kBACAC,eACAC,kBACAC,iBACAC,yBACAC,uBAAuB,CACxB;AAuBM,MAAMC,cAAcC,WACzB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC,OAAO;AAAA,IACPC,gBAAgB;AAAA,IAChBC,cAAc;AAAA,IACdC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EACErB,IAAAA;AAEJ,QAAMsB,YAAYC,QAAQ;AAAA,IAAEd;AAAAA,IAAMC;AAAAA,IAASG;AAAAA,IAAUF;AAAAA,IAASC;AAAAA,EAAAA,CAAQ;AAEhEY,QAAAA,eAAeC,WAAWH,SAAS;AAEzC,QAAMI,aAAaC,SAAS;AAAA,IAC1BC,MAAMC,MAAMC,QAAQzB,KAAK,KAAKA,SAAS,OAAOA,QAAQ,CAACA,KAAK;AAAA,EAAA,CAC7D;AAED,QAAM0B,aAAaC,SAAS;AAAA,IAAE,GAAG1B;AAAAA,IAAO2B,OAAO;AAAA,EAAA,CAAM;AAErD,QAAMC,cAAcC,YAAY;AAAA,IAC9BC,gBAAgB7B,+DAAuB8B;AAAAA,EAAAA,CACxC;AAED,QAAMC,YAAYC,QAAQ;AAAA,IAAE,GAAG/B;AAAAA,EAAAA,CAAM;AAErC,QAAMgC,cAAcC,UAAU;AAAA,IAC5BC,MAAM;AAAA,IACNjC,MAAMa;AAAAA,IACNZ;AAAAA,IACAG;AAAAA,IACAX;AAAAA,IACAE;AAAAA,IACAD;AAAAA,IACAW;AAAAA,IACA6B,eAAe5B;AAAAA,EAAAA,CAChB;AAED,QAAM6B,cAAcC,UAAU;AAAA,IAC5B,GAAG7B;AAAAA,IACH8B,QAAQN,YAAYM;AAAAA,EAAAA,CACrB;AAED,QAAMC,eAAeC,WAAW;AAAA,IAC9B,GAAG9B;AAAAA,IACH+B,SAAS;AAAA,IACTpC;AAAAA,IACAI;AAAAA,EAAAA,CACD;AAED,QAAMiC,SAASC,UAAU;AAAA,IACvBD,QAAQ;AAAA,MACN,GAAGxB;AAAAA,MACH,GAAGK;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGd;AAAAA,MACH,GAAGgB;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGG;AAAAA,IACL;AAAA,IACA1B;AAAAA,EAAAA,CACD;AAED,SACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAkB,CAAA;AAE3E,CACF;"}
+{"version":3,"file":"LineChart.js","sources":["../../../../src/components/LineChart/LineChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\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\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  useYAxis,\n  useXAxis,\n  useDataZoom,\n  useGrid,\n  useData,\n  useDataset,\n  useSeries,\n  useLegend,\n  useTooltip,\n  HvChartTooltipClasses,\n  useOption,\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 = forwardRef<ReactECharts, HvLineChartProps>(\n  (props, ref) => {\n    const {\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      width,\n      height,\n      onOptionChange,\n    } = props;\n\n    const chartData = useData({ data, groupBy, measures, splitBy, sortBy });\n\n    const chartDataset = useDataset(chartData);\n\n    const chartYAxis = useYAxis({\n      axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n    });\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 option = useOption({\n      option: {\n        ...chartYAxis,\n        ...chartXAxis,\n        ...chartSlider,\n        ...chartGrid,\n        ...chartDataset,\n        ...chartSeries,\n        ...chartLegend,\n        ...chartTooltip,\n      },\n      onOptionChange,\n    });\n\n    return (\n      <HvBaseChart ref={ref} option={option} width={width} height={height} />\n    );\n  }\n);\n"],"names":["echarts","use","LineChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","HvLineChart","forwardRef","props","ref","area","emptyCellMode","areaOpacity","yAxis","xAxis","horizontalRangeSlider","grid","data","groupBy","splitBy","sortBy","measures","stack","seriesNameFormatter","legend","classes","tooltip","width","height","onOptionChange","chartData","useData","chartDataset","useDataset","chartYAxis","useYAxis","axes","Array","isArray","chartXAxis","useXAxis","scale","chartSlider","useDataZoom","showHorizontal","show","chartGrid","useGrid","chartSeries","useSeries","type","nameFormatter","chartLegend","useLegend","series","chartTooltip","useTooltip","trigger","option","useOption"],"mappings":";;;;;;;;;;;;;;;;AAmCAA,QAAQC,IAAI,CACVC,WACAC,kBACAC,eACAC,kBACAC,iBACAC,yBACAC,uBAAuB,CACxB;AAuBM,MAAMC,cAAcC,WACzB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC,OAAO;AAAA,IACPC,gBAAgB;AAAA,IAChBC,cAAc;AAAA,IACdC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EACErB,IAAAA;AAEJ,QAAMsB,YAAYC,QAAQ;AAAA,IAAEd;AAAAA,IAAMC;AAAAA,IAASG;AAAAA,IAAUF;AAAAA,IAASC;AAAAA,EAAAA,CAAQ;AAEhEY,QAAAA,eAAeC,WAAWH,SAAS;AAEzC,QAAMI,aAAaC,SAAS;AAAA,IAC1BC,MAAMC,MAAMC,QAAQzB,KAAK,KAAKA,SAAS,OAAOA,QAAQ,CAACA,KAAK;AAAA,EAAA,CAC7D;AAED,QAAM0B,aAAaC,SAAS;AAAA,IAAE,GAAG1B;AAAAA,IAAO2B,OAAO;AAAA,EAAA,CAAM;AAErD,QAAMC,cAAcC,YAAY;AAAA,IAC9BC,gBAAgB7B,uBAAuB8B;AAAAA,EAAAA,CACxC;AAED,QAAMC,YAAYC,QAAQ;AAAA,IAAE,GAAG/B;AAAAA,EAAAA,CAAM;AAErC,QAAMgC,cAAcC,UAAU;AAAA,IAC5BC,MAAM;AAAA,IACNjC,MAAMa;AAAAA,IACNZ;AAAAA,IACAG;AAAAA,IACAX;AAAAA,IACAE;AAAAA,IACAD;AAAAA,IACAW;AAAAA,IACA6B,eAAe5B;AAAAA,EAAAA,CAChB;AAED,QAAM6B,cAAcC,UAAU;AAAA,IAC5B,GAAG7B;AAAAA,IACH8B,QAAQN,YAAYM;AAAAA,EAAAA,CACrB;AAED,QAAMC,eAAeC,WAAW;AAAA,IAC9B,GAAG9B;AAAAA,IACH+B,SAAS;AAAA,IACTpC;AAAAA,IACAI;AAAAA,EAAAA,CACD;AAED,QAAMiC,SAASC,UAAU;AAAA,IACvBD,QAAQ;AAAA,MACN,GAAGxB;AAAAA,MACH,GAAGK;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGd;AAAAA,MACH,GAAGgB;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGG;AAAAA,IACL;AAAA,IACA1B;AAAAA,EAAAA,CACD;AAED,SACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAkB,CAAA;AAE3E,CACF;"}