@hitachivantara/uikit-react-viz 5.16.7 → 6.0.0-next.1

package/dist/cjs/hooks/useDataZoom.cjs

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const useDataZoom = ({
-  showHorizontal = false
-}) => {
-  const option = react.useMemo(() => {
-    return {
-      dataZoom: showHorizontal ? [
-        {
-          show: true,
-          type: "slider",
-          orient: "horizontal"
-        },
-        {
-          show: true,
-          type: "inside",
-          orient: "horizontal",
-          zoomOnMouseWheel: "shift",
-          moveOnMouseWheel: true
-        }
-      ] : []
-    };
-  }, [showHorizontal]);
-  return option;
-};
-exports.useDataZoom = useDataZoom;

package/dist/cjs/hooks/useDataset.cjs

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const useDataset = (data) => {
-  return react.useMemo(() => {
-    return {
-      dataset: {
-        source: data.columnNames().reduce((acc, c) => {
-          acc[c] = data.array(c);
-          return acc;
-        }, {})
-      }
-    };
-  }, [data]);
-};
-exports.useDataset = useDataset;

package/dist/cjs/hooks/useGrid.cjs

@@ -1,39 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const useGrid = ({
-  top,
-  left,
-  right,
-  bottom,
-  width,
-  height
-}) => {
-  const option = react.useMemo(() => {
-    return {
-      // if no value is defined we shouldn't pass anything because echarts doesn't behave well otherwise
-      grid: {
-        ...top != null && {
-          top
-        },
-        ...bottom != null && {
-          bottom
-        },
-        ...left != null && {
-          left
-        },
-        ...right != null && {
-          right
-        },
-        ...width != null && {
-          width
-        },
-        ...height != null && {
-          height
-        }
-      }
-    };
-  }, [top, left, right, bottom, height, width]);
-  return option;
-};
-exports.useGrid = useGrid;

package/dist/cjs/hooks/useLegend.cjs

@@ -1,46 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const index = require("../utils/index.cjs");
-const useLegend = ({
-  series,
-  show,
-  icon,
-  formatter,
-  position: positionProp,
-  direction = "horizontal"
-}) => {
-  const option = react.useMemo(() => {
-    const position = {
-      y: positionProp?.y ?? "top",
-      x: positionProp?.x ?? "center"
-    };
-    return {
-      legend: {
-        show: show ?? (Array.isArray(series) && series.length > 1),
-        itemGap: 20,
-        formatter,
-        orient: direction,
-        ...position,
-        ...icon && { icon: index.getLegendIcon(icon) },
-        ...!icon && {
-          data: show !== false && Array.isArray(series) ? series.map((s) => {
-            let iconType = "line";
-            if (s.areaStyle != null) {
-              iconType = "square";
-            }
-            if (s.type === "scatter") {
-              iconType = "circle";
-            }
-            return {
-              name: s.name,
-              icon: index.getLegendIcon(iconType)
-            };
-          }) : void 0
-        }
-      }
-    };
-  }, [series, show, icon, formatter, positionProp, direction]);
-  return option;
-};
-exports.useLegend = useLegend;

package/dist/cjs/hooks/useOption.cjs

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const useOption = ({
-  option: optionProp,
-  onOptionChange
-}) => {
-  const option = react.useMemo(() => {
-    const baseOption = {
-      aria: {
-        enabled: true
-      },
-      animation: false
-    };
-    const opt = { ...baseOption, ...optionProp };
-    return onOptionChange ? onOptionChange(opt) : opt;
-  }, [onOptionChange, optionProp]);
-  return option;
-};
-exports.useOption = useOption;

package/dist/cjs/hooks/useSeries.cjs

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

package/dist/cjs/hooks/useVisualMap.cjs

@@ -1,57 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const index = require("../utils/index.cjs");
-const useVisualMap = ({
-  show = true,
-  direction = "horizontal",
-  type = "continuous",
-  pieces,
-  max,
-  min,
-  colorScale,
-  position: positionProp,
-  ...others
-}) => {
-  const option = react.useMemo(() => {
-    return {
-      visualMap: {
-        type,
-        show,
-        ...pieces && {
-          pieces
-        },
-        ...type === "piecewise" && {
-          itemSymbol: index.getLegendIcon("square"),
-          itemGap: 20,
-          itemHeight: 16,
-          itemWidth: 16
-        },
-        ...colorScale && {
-          max,
-          min,
-          inRange: {
-            color: colorScale
-          }
-        },
-        orient: direction,
-        top: positionProp?.y || "top",
-        left: positionProp?.x || "center",
-        ...others
-      }
-    };
-  }, [
-    colorScale,
-    direction,
-    max,
-    min,
-    others,
-    pieces,
-    positionProp?.x,
-    positionProp?.y,
-    show,
-    type
-  ]);
-  return option;
-};
-exports.useVisualMap = useVisualMap;

package/dist/cjs/hooks/useVizTheme.cjs

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const Provider = require("../providers/Provider.cjs");
-const useVizTheme = () => {
-  return react.useContext(Provider.HvVizContext);
-};
-exports.useVizTheme = useVizTheme;

package/dist/cjs/hooks/useXAxis.cjs

@@ -1,64 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
-const index = require("../utils/index.cjs");
-const useXAxis = ({
-  id,
-  type = "categorical",
-  labelFormatter,
-  labelRotation,
-  name,
-  maxValue,
-  minValue,
-  scale = false,
-  data,
-  position,
-  nameProps
-}) => {
-  const { colors } = uikitReactUtils.useTheme();
-  const option = react.useMemo(() => {
-    const nameStyleKeys = nameProps ? Object.keys(nameProps).filter((key) => key !== "location") : void 0;
-    const nameStyle = nameProps && nameStyleKeys ? nameStyleKeys.reduce((acc, curr) => {
-      acc[curr] = curr === "color" && colors?.[nameProps[curr]] || nameProps[curr];
-      return acc;
-    }, {}) : void 0;
-    return {
-      xAxis: {
-        id,
-        type: index.getAxisType(type),
-        name,
-        scale,
-        axisLabel: {
-          rotate: labelRotation ?? 0,
-          formatter: labelFormatter
-        },
-        max: maxValue === "max" ? "dataMax" : maxValue,
-        min: minValue === "min" ? "dataMin" : minValue,
-        ...nameProps?.location && {
-          nameLocation: nameProps.location
-        },
-        ...nameStyle && {
-          nameTextStyle: nameStyle
-        },
-        ...data && { data },
-        ...position && { position }
-      }
-    };
-  }, [
-    nameProps,
-    id,
-    type,
-    name,
-    scale,
-    labelRotation,
-    labelFormatter,
-    maxValue,
-    minValue,
-    data,
-    position,
-    colors
-  ]);
-  return option;
-};
-exports.useXAxis = useXAxis;

package/dist/cjs/hooks/useYAxis.cjs

@@ -1,58 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
-const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
-const index = require("../utils/index.cjs");
-const useYAxis = ({
-  axes,
-  defaultType = "continuous"
-}) => {
-  const { colors } = uikitReactUtils.useTheme();
-  const createAxis = react.useCallback(
-    ({
-      id,
-      type,
-      name,
-      labelFormatter,
-      labelRotation,
-      maxValue,
-      minValue,
-      nameProps,
-      data,
-      position
-    }) => {
-      const nameStyleKeys = nameProps ? Object.keys(nameProps).filter((key) => key !== "location") : void 0;
-      const nameStyle = nameProps && nameStyleKeys ? nameStyleKeys.reduce((acc, curr) => {
-        acc[curr] = curr === "color" && colors?.[nameProps[curr]] || nameProps[curr];
-        return acc;
-      }, {}) : void 0;
-      return {
-        id,
-        type: index.getAxisType(type) ?? index.getAxisType(defaultType),
-        name,
-        axisLabel: {
-          rotate: labelRotation ?? 0,
-          formatter: labelFormatter
-        },
-        max: maxValue === "max" ? "dataMax" : maxValue,
-        min: minValue === "min" ? "dataMin" : minValue,
-        ...nameProps?.location && {
-          nameLocation: nameProps?.location
-        },
-        ...nameStyle && {
-          nameTextStyle: nameStyle
-        },
-        ...data && { data },
-        ...position && { position }
-      };
-    },
-    [colors, defaultType]
-  );
-  const option = react.useMemo(() => {
-    return {
-      yAxis: Array.isArray(axes) ? axes.map((axis) => createAxis(axis)) : [createAxis({})]
-    };
-  }, [axes, createAxis]);
-  return option;
-};
-exports.useYAxis = useYAxis;

package/dist/cjs/index.cjs

@@ -1,25 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const Provider = require("./providers/Provider.cjs");
-const index = require("./utils/index.cjs");
-const BaseChart = require("./BaseChart/BaseChart.cjs");
-const BarChart = require("./BarChart/BarChart.cjs");
-const Boxplot = require("./Boxplot/Boxplot.cjs");
-const ConfusionMatrix = require("./ConfusionMatrix/ConfusionMatrix.cjs");
-const DonutChart = require("./DonutChart/DonutChart.cjs");
-const Heatmap = require("./Heatmap/Heatmap.cjs");
-const LineChart = require("./LineChart/LineChart.cjs");
-const ScatterPlot = require("./ScatterPlot/ScatterPlot.cjs");
-const Treemap = require("./Treemap/Treemap.cjs");
-exports.HvVizContext = Provider.HvVizContext;
-exports.HvVizProvider = Provider.HvVizProvider;
-exports.getHvArqueroCombinedFilters = index.getHvArqueroCombinedFilters;
-exports.HvBaseChart = BaseChart.HvBaseChart;
-exports.HvBarChart = BarChart.HvBarChart;
-exports.HvBoxplot = Boxplot.HvBoxplot;
-exports.HvConfusionMatrix = ConfusionMatrix.HvConfusionMatrix;
-exports.HvDonutChart = DonutChart.HvDonutChart;
-exports.HvHeatmap = Heatmap.HvHeatmap;
-exports.HvLineChart = LineChart.HvLineChart;
-exports.HvScatterPlot = ScatterPlot.HvScatterPlot;
-exports.HvTreemapChart = Treemap.HvTreemapChart;

package/dist/cjs/providers/Provider.cjs

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const react = require("react");
-const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
-const registerTheme = require("../utils/registerTheme.cjs");
-const HvVizContext = react.createContext({
-  theme: void 0
-});
-const HvVizProvider = ({ children }) => {
-  const { activeTheme, selectedMode, selectedTheme } = uikitReactUtils.useTheme();
-  const value = react.useMemo(() => {
-    const themeName = `${selectedTheme}-${selectedMode}`;
-    registerTheme.registerTheme(themeName, selectedMode, activeTheme);
-    return { theme: themeName, activeTheme };
-  }, [selectedTheme, selectedMode, activeTheme]);
-  return /* @__PURE__ */ jsxRuntime.jsx(HvVizContext.Provider, { value, children });
-};
-exports.HvVizContext = HvVizContext;
-exports.HvVizProvider = HvVizProvider;

package/dist/cjs/utils/index.cjs

@@ -1,193 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const arquero = require("arquero");
-const getAxisType = (type) => {
-  switch (type) {
-    case "categorical":
-      return "category";
-    case "time":
-      return "time";
-    case "continuous":
-      return "value";
-    default:
-      return void 0;
-  }
-};
-const getGroupKey = (groupBy) => Array.isArray(groupBy) ? groupBy.join("_") : groupBy;
-const getLegendIcon = (icon) => {
-  switch (icon) {
-    case "circle":
-      return "circle";
-    case "square":
-      return "path://M0,0L16,0L16,16L0,16L0,0Z";
-    case "line":
-    default:
-      return "path://M0,0L16,0L16,2L0,2Z";
-  }
-};
-const getMeasure = (name, mapping) => {
-  let measure;
-  let count = 0;
-  for (const key of Object.keys(mapping)) {
-    if (name.includes(key) && key.length >= count) {
-      count = key.length;
-      measure = mapping[key];
-    }
-  }
-  return measure ?? Object.values(mapping)[0];
-};
-const getFilterFunction = (operation, field, value) => {
-  const valueArray = Array.isArray(value) ? value : [value];
-  if (valueArray.length === 0) return () => true;
-  switch (operation) {
-    case "is": {
-      return (row) => valueArray.includes(row[field]);
-    }
-    case "isNot": {
-      return (row) => !valueArray.includes(row[field]);
-    }
-    case "contains":
-      return (row) => {
-        let include = false;
-        for (const val of valueArray) {
-          if (String(row[field]).includes(String(val))) {
-            include = true;
-          }
-        }
-        return include;
-      };
-    case "notContains":
-      return (row) => {
-        let include = true;
-        for (const val of valueArray) {
-          if (String(row[field]).includes(String(val))) {
-            include = false;
-          }
-        }
-        return include;
-      };
-    case "greaterThan":
-      return (row) => {
-        let include = false;
-        for (const val of valueArray) {
-          if (row[field] > val) {
-            include = true;
-          }
-        }
-        return include;
-      };
-    case "greaterThanOrEqual":
-      return (row) => {
-        let include = false;
-        for (const val of valueArray) {
-          if (row[field] >= val) {
-            include = true;
-          }
-        }
-        return include;
-      };
-    case "lessThan":
-      return (row) => {
-        let include = false;
-        for (const val of valueArray) {
-          if (row[field] < val) {
-            include = true;
-          }
-        }
-        return include;
-      };
-    case "lessThanOrEqual":
-      return (row) => {
-        let include = false;
-        for (const val of valueArray) {
-          if (row[field] <= val) {
-            include = true;
-          }
-        }
-        return include;
-      };
-    case "between":
-      return (row) => row[field] >= valueArray[0] && row[field] <= valueArray[1];
-    case "ends":
-      return (row) => {
-        let include = false;
-        for (const val of valueArray) {
-          if (String(row[field]).endsWith(String(val))) {
-            include = true;
-          }
-        }
-        return include;
-      };
-    case "notEnds":
-      return (row) => {
-        let include = true;
-        for (const val of valueArray) {
-          if (String(row[field]).endsWith(String(val))) {
-            include = false;
-          }
-        }
-        return include;
-      };
-    case "starts":
-      return (row) => {
-        let include = false;
-        for (const val of valueArray) {
-          if (String(row[field]).startsWith(String(val))) {
-            include = true;
-          }
-        }
-        return include;
-      };
-    case "notStarts":
-      return (row) => {
-        let include = true;
-        for (const val of valueArray) {
-          if (String(row[field]).startsWith(String(val))) {
-            include = false;
-          }
-        }
-        return include;
-      };
-    default:
-      throw new Error("Unsupported operation");
-  }
-};
-const getHvArqueroCombinedFilters = (row, filters) => {
-  return filters.every((filter) => {
-    const { field, operation, value } = filter;
-    const filterFunction = Object.hasOwn(row, field) ? getFilterFunction(operation, field, value) : () => true;
-    return filterFunction(row);
-  });
-};
-const normalizeColumnName = (string) => {
-  return string.replace(/[^a-zA-Z0-9]/g, "__");
-};
-const processTableData = (data) => {
-  let tableData;
-  if (data instanceof arquero.internal.ColumnTable) {
-    tableData = data;
-  } else if (Array.isArray(data)) {
-    tableData = arquero.from(data);
-  } else {
-    tableData = arquero.table(data);
-  }
-  const nameMapping = {};
-  const reversedNameMapping = {};
-  for (const column of tableData.columnNames()) {
-    const normalizedName = normalizeColumnName(column);
-    nameMapping[column] = normalizedName;
-    reversedNameMapping[normalizedName] = column;
-  }
-  return {
-    data: tableData.select(nameMapping),
-    mapping: reversedNameMapping
-  };
-};
-exports.getAxisType = getAxisType;
-exports.getFilterFunction = getFilterFunction;
-exports.getGroupKey = getGroupKey;
-exports.getHvArqueroCombinedFilters = getHvArqueroCombinedFilters;
-exports.getLegendIcon = getLegendIcon;
-exports.getMeasure = getMeasure;
-exports.normalizeColumnName = normalizeColumnName;
-exports.processTableData = processTableData;