@wavemaker-ai/react-runtime 1.0.0-next.27766

package/components/chart/src/chart.js

@@ -0,0 +1,473 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useMemo, useCallback, useRef } from "react";
+import { isArray, isObject, keys, debounce, includes } from "lodash-es";
+import {
+  processChartData,
+  getVisuallyGroupedData,
+  getGroupingDetails,
+  getSampleData,
+  getAggregatedData,
+  isGroupByEnabled,
+  isDataFilteringEnabled,
+  isPieType,
+  getBooleanValue
+} from "./dataUtils";
+import { AXIS_CHART_DEFAULT_OFFSETS, dateList, PIE_CHART_DEFAULT_OFFSETS } from "./constants";
+import ChartRenderer from "./ChartRenderer";
+import { WmAppIcon } from "../../common/WmAppIcon";
+const WmChart = (props) => {
+  var _b, _c;
+  const _a = props, {
+    type = "Column",
+    dataset,
+    datasource,
+    xaxisdatakey = "",
+    yaxisdatakey = "",
+    groupby,
+    aggregation,
+    aggregationcolumn,
+    orderby,
+    className,
+    title,
+    subheading,
+    iconclass,
+    iconurl,
+    onSelect,
+    onTransform,
+    onBeforerender,
+    theme,
+    showlabels: showlabelsProp,
+    showlabelsoutside: showlabelsoutsideProp,
+    shape,
+    bubblesize,
+    offsettop,
+    offsetbottom,
+    offsetright,
+    offsetleft,
+    nodatamessage
+  } = _a, rest = __objRest(_a, [
+    "type",
+    "dataset",
+    "datasource",
+    "xaxisdatakey",
+    "yaxisdatakey",
+    "groupby",
+    "aggregation",
+    "aggregationcolumn",
+    "orderby",
+    "className",
+    "title",
+    "subheading",
+    "iconclass",
+    "iconurl",
+    "onSelect",
+    "onTransform",
+    "onBeforerender",
+    "theme",
+    "showlabels",
+    "showlabelsoutside",
+    "shape",
+    "bubblesize",
+    "offsettop",
+    "offsetbottom",
+    "offsetright",
+    "offsetleft",
+    "nodatamessage"
+  ]);
+  const chartId = useMemo(
+    () => "wmChart-" + (props.id || props.name || Math.random().toString(36).slice(2)),
+    [props.id, props.name]
+  );
+  const [processedData, setProcessedData] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState("");
+  const [isVisuallyGrouped, setIsVisuallyGrouped] = useState(false);
+  const xDataKeyArrRef = useRef([]);
+  const chartDataRef = useRef([]);
+  const binddataset = useMemo(() => {
+    if (datasource) return true;
+    if (dataset == null) return false;
+    if (typeof dataset === "string" && dataset === "") return false;
+    if (isArray(dataset)) return dataset.length > 0;
+    if (isObject(dataset)) {
+      const d = dataset;
+      if (keys(d).length === 1 && d.dataValue === "") return false;
+      return true;
+    }
+    return false;
+  }, [dataset, datasource]);
+  const isLiveVariable = useMemo(() => {
+    return datasource && datasource.category === "wm.LiveVariable";
+  }, [datasource]);
+  const showlabels = useMemo(() => {
+    if (!includes(["outside", "inside", "hide"], showlabelsProp)) {
+      const boolVal = getBooleanValue(showlabelsProp);
+      const boolOutside = getBooleanValue(showlabelsoutsideProp);
+      return boolVal ? boolOutside ? "outside" : "inside" : "hide";
+    }
+    return showlabelsProp || "outside";
+  }, [showlabelsProp, showlabelsoutsideProp]);
+  const resolvedTheme = useMemo(() => {
+    if (theme) return theme;
+    return isPieType(type) ? "Azure" : "Terrestrial";
+  }, [theme, type]);
+  const resolvedOffsets = useMemo(() => {
+    if (isPieType(type)) {
+      const coalescePieOffset = (value, axisDefault, pieDefault) => {
+        if (value === void 0 || value === null) return pieDefault;
+        if (value === axisDefault) return pieDefault;
+        return value;
+      };
+      return {
+        offsettop: coalescePieOffset(
+          offsettop,
+          AXIS_CHART_DEFAULT_OFFSETS.offsettop,
+          PIE_CHART_DEFAULT_OFFSETS.offsettop
+        ),
+        offsetright: coalescePieOffset(
+          offsetright,
+          AXIS_CHART_DEFAULT_OFFSETS.offsetright,
+          PIE_CHART_DEFAULT_OFFSETS.offsetright
+        ),
+        offsetbottom: coalescePieOffset(
+          offsetbottom,
+          AXIS_CHART_DEFAULT_OFFSETS.offsetbottom,
+          PIE_CHART_DEFAULT_OFFSETS.offsetbottom
+        ),
+        offsetleft: coalescePieOffset(
+          offsetleft,
+          AXIS_CHART_DEFAULT_OFFSETS.offsetleft,
+          PIE_CHART_DEFAULT_OFFSETS.offsetleft
+        )
+      };
+    }
+    return {
+      offsettop: offsettop != null ? offsettop : AXIS_CHART_DEFAULT_OFFSETS.offsettop,
+      offsetright: offsetright != null ? offsetright : AXIS_CHART_DEFAULT_OFFSETS.offsetright,
+      offsetbottom: offsetbottom != null ? offsetbottom : AXIS_CHART_DEFAULT_OFFSETS.offsetbottom,
+      offsetleft: offsetleft != null ? offsetleft : AXIS_CHART_DEFAULT_OFFSETS.offsetleft
+    };
+  }, [type, offsettop, offsetright, offsetbottom, offsetleft]);
+  const widgetContext = useMemo(
+    () => __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, rest), {
+      type,
+      xaxisdatakey,
+      yaxisdatakey,
+      groupby,
+      aggregation,
+      aggregationcolumn,
+      orderby,
+      theme: resolvedTheme,
+      showlabels,
+      showlabelsoutside: showlabelsoutsideProp,
+      shape,
+      bubblesize,
+      nodatamessage: nodatamessage || "No Data Available."
+    }), resolvedOffsets), {
+      $id: chartId,
+      xDataKeyArr: xDataKeyArrRef.current,
+      binddataset,
+      centerlabel: rest.centerlabel,
+      highlightpoints: rest.highlightpoints,
+      linethickness: rest.linethickness,
+      showlegend: rest.showlegend,
+      fontsize: rest.fontsize,
+      fontunit: rest.fontunit
+    }),
+    [
+      type,
+      xaxisdatakey,
+      yaxisdatakey,
+      groupby,
+      aggregation,
+      aggregationcolumn,
+      orderby,
+      resolvedTheme,
+      showlabels,
+      showlabelsoutsideProp,
+      shape,
+      bubblesize,
+      nodatamessage,
+      resolvedOffsets,
+      chartId,
+      binddataset,
+      rest
+    ]
+  );
+  const doPlotChart = useCallback(() => {
+    setError("");
+    setIsLoading(true);
+    let data = chartDataRef.current;
+    if (onTransform) {
+      const transformed = onTransform(null, props);
+      if (transformed && isArray(transformed)) {
+        data = transformed;
+        chartDataRef.current = data;
+      }
+    }
+    const groupingDetails = getGroupingDetails(
+      groupby,
+      aggregation,
+      aggregationcolumn,
+      xaxisdatakey,
+      yaxisdatakey
+    );
+    if (binddataset && isLiveVariable && isDataFilteringEnabled(isVisuallyGrouped, groupby, aggregation, aggregationcolumn, orderby)) {
+      getAggregatedData(
+        datasource,
+        groupby,
+        aggregation,
+        aggregationcolumn,
+        xaxisdatakey,
+        yaxisdatakey,
+        orderby,
+        (aggData) => {
+          chartDataRef.current = aggData;
+          plotWithCurrentData(aggData, groupingDetails);
+        },
+        () => {
+          setError("Error fetching data");
+          setIsLoading(false);
+        }
+      );
+    } else {
+      if (data && isLiveVariable && isGroupByEnabled(groupby) && groupingDetails.isVisuallyGrouped) {
+        const grouped = getVisuallyGroupedData(
+          data,
+          groupingDetails.visualGroupingColumn,
+          type,
+          xaxisdatakey,
+          yaxisdatakey,
+          void 0,
+          xDataKeyArrRef.current,
+          groupby,
+          orderby
+        );
+        setIsVisuallyGrouped(true);
+        setProcessedData(grouped);
+        setIsLoading(false);
+      } else {
+        plotWithCurrentData(data, groupingDetails);
+      }
+    }
+  }, [
+    binddataset,
+    isLiveVariable,
+    datasource,
+    groupby,
+    aggregation,
+    aggregationcolumn,
+    orderby,
+    xaxisdatakey,
+    yaxisdatakey,
+    type,
+    isVisuallyGrouped,
+    onTransform,
+    props,
+    shape,
+    bubblesize
+  ]);
+  const plotWithCurrentData = useCallback(
+    (data, groupingDetails) => {
+      if (groupingDetails.isVisuallyGrouped && !isPieType(type)) {
+        setIsVisuallyGrouped(true);
+        setProcessedData(data);
+      } else {
+        xDataKeyArrRef.current = [];
+        if (!binddataset) {
+          xDataKeyArrRef.current = [...dateList];
+          const sampleContext = { type, yaxisdatakey, shape };
+          setProcessedData(getSampleData(sampleContext));
+        } else {
+          const processed = processChartData(
+            data,
+            type,
+            xaxisdatakey,
+            yaxisdatakey,
+            void 0,
+            xDataKeyArrRef.current,
+            bubblesize,
+            shape
+          );
+          setProcessedData(processed);
+        }
+      }
+      setIsLoading(false);
+    },
+    [type, xaxisdatakey, yaxisdatakey, binddataset, bubblesize, shape]
+  );
+  const debouncedPlotChart = useMemo(() => debounce(doPlotChart, 100), [doPlotChart]);
+  useEffect(() => {
+    let chartData = dataset;
+    if (!chartData && !binddataset) {
+      setIsVisuallyGrouped(false);
+    }
+    if (isLiveVariable) {
+      chartData = chartData || "";
+    } else if (chartData && typeof chartData === "object" && !isArray(chartData)) {
+      if (chartData.dataValue === "" && keys(chartData).length === 1) {
+        chartData = "";
+      }
+    }
+    if (!isArray(chartData) && isObject(chartData)) {
+      chartData = [chartData];
+    }
+    chartDataRef.current = isArray(chartData) ? chartData : [];
+    const shouldFetchAggregated = isLiveVariable && isDataFilteringEnabled(false, groupby, aggregation, aggregationcolumn, orderby);
+    if (chartData || shouldFetchAggregated) {
+      debouncedPlotChart();
+    }
+    return () => {
+      debouncedPlotChart.cancel();
+    };
+  }, [
+    dataset,
+    binddataset,
+    isLiveVariable,
+    debouncedPlotChart,
+    groupby,
+    aggregation,
+    aggregationcolumn,
+    orderby
+  ]);
+  useEffect(() => {
+    const canFetchViaAggregation = binddataset && isLiveVariable && isDataFilteringEnabled(isVisuallyGrouped, groupby, aggregation, aggregationcolumn, orderby);
+    if (binddataset && (chartDataRef.current.length > 0 || canFetchViaAggregation)) {
+      debouncedPlotChart();
+    } else if (!binddataset) {
+      debouncedPlotChart();
+    }
+  }, [
+    type,
+    xaxisdatakey,
+    yaxisdatakey,
+    groupby,
+    aggregation,
+    aggregationcolumn,
+    orderby,
+    resolvedTheme,
+    showlabels,
+    resolvedOffsets,
+    rest.showlegend,
+    rest.legendtype,
+    rest.tooltips,
+    rest.showxaxis,
+    rest.showyaxis,
+    rest.viewtype,
+    rest.areaviewtype,
+    rest.interpolation,
+    rest.barspacing,
+    rest.donutratio,
+    rest.centerlabel,
+    rest.customcolors,
+    rest.highlightpoints,
+    rest.linethickness,
+    rest.staggerlabels,
+    rest.reducexticks,
+    rest.showvalues,
+    rest.showxdistance,
+    rest.showydistance,
+    rest.labeltype,
+    rest.labelthreshold,
+    rest.xaxislabel,
+    rest.yaxislabel,
+    rest.xnumberformat,
+    rest.xdateformat,
+    rest.ynumberformat,
+    rest.xunits,
+    rest.yunits,
+    rest.xdomain,
+    rest.ydomain,
+    rest.xaxislabeldistance,
+    rest.yaxislabeldistance,
+    shape,
+    bubblesize,
+    nodatamessage
+  ]);
+  const containerStyle = __spreadProps(__spreadValues({}, props == null ? void 0 : props.styles), {
+    width: ((_b = props == null ? void 0 : props.styles) == null ? void 0 : _b.width) || (props == null ? void 0 : props.width) || void 0,
+    height: ((_c = props == null ? void 0 : props.styles) == null ? void 0 : _c.height) || (props == null ? void 0 : props.height) || void 0
+  });
+  const isValidAxis = binddataset ? xaxisdatakey && yaxisdatakey : true;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      id: chartId,
+      className: `app-chart ${title ? "panel" : ""} ${className || ""}`,
+      style: containerStyle,
+      hidden: props == null ? void 0 : props.hidden,
+      show: props == null ? void 0 : props.show,
+      name: props == null ? void 0 : props.name,
+      children: [
+        title && /* @__PURE__ */ jsxs("div", { className: "panel-heading", children: [
+          (iconclass || iconurl) && /* @__PURE__ */ jsx(
+            WmAppIcon,
+            {
+              iconclass,
+              iconurl,
+              prefabName: props.prefabName,
+              defaultClasses: "panel-icon"
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "chart-title", children: title }),
+          subheading && /* @__PURE__ */ jsx("span", { className: "chart-subheading", children: subheading })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "app-chart-inner", children: [
+          isValidAxis ? /* @__PURE__ */ jsx(
+            ChartRenderer,
+            {
+              chartId,
+              processedData,
+              widgetContext,
+              chartDataLength: chartDataRef.current.length,
+              binddataset,
+              onSelect,
+              onBeforerender,
+              props
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: "wm-content-info", children: /* @__PURE__ */ jsx("p", { children: nodatamessage || "No Data Available." }) }),
+          error && /* @__PURE__ */ jsx("div", { className: "wm-content-info wm-content-error", children: /* @__PURE__ */ jsx("p", { children: error }) }),
+          isLoading && /* @__PURE__ */ jsxs("div", { className: "app-spinner", children: [
+            /* @__PURE__ */ jsx("i", { className: "fa fa-spinner fa-spin" }),
+            /* @__PURE__ */ jsx("span", { children: rest.loadingdatamsg || "Loading..." })
+          ] })
+        ] })
+      ]
+    }
+  );
+};
+var chart_default = WmChart;
+export {
+  chart_default as default
+};

package/components/chart/src/chartStyles.generated.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Auto-generated by scripts/generate-chart-assets.js — do not edit.
+ * nvd3: @wavemaker/nvd3/build/nv.d3.min.css
+ * wm overrides: src/components/chart/src/wm-chart.css (optional)
+ */
+export declare const nvd3Css: string;
+export declare const wmChartCss: string;

package/components/chart/src/chartStyles.generated.js

@@ -0,0 +1,6 @@
+const nvd3Css = ".nvtooltip h3,.nvtooltip p{margin:0;text-align:center}.nv-distx,.nv-disty,.nv-noninteractive,.nvd3 .nv-axis,.nvd3 .nv-interactiveGuideLine,.nvd3.nv-pie .nv-label,.nvd3.nv-sparklineplus g.nv-hoverValue,.nvtooltip{pointer-events:none}.nvd3 .nv-axis{opacity:1}.nvd3 .nv-axis path{fill:none;stroke:#000;stroke-opacity:.75;shape-rendering:crispEdges}.nvd3 .nv-axis .zero line,.nvd3 .nv-axis line.zero,.nvd3 .nv-axis path.domain{stroke-opacity:.75}.nvd3 .nv-axis.nv-x path.domain{stroke-opacity:0}.nvd3 .nv-axis line{fill:none;stroke:#e5e5e5;shape-rendering:crispEdges}.nvd3 .nv-axis .nv-axisMaxMin text,.nvtooltip table td.key.total{font-weight:700}.nvd3 .x .nv-axis .nv-axisMaxMin text,.nvd3 .x2 .nv-axis .nv-axisMaxMin text,.nvd3 .x3 .nv-axis .nv-axisMaxMin text{text-anchor:middle}.nvd3 .nv-axis.nv-disabled,.nvd3 .nv-controlsWrap .nv-legend .nv-check-box .nv-check{opacity:0}.nvd3 .nv-bars rect{fill-opacity:.75;-webkit-transition:fill-opacity 250ms linear;transition:fill-opacity 250ms linear}.nvd3 .nv-bars rect.hover,.nvd3 .nv-boxplot circle:hover,.nvd3 .nv-boxplot rect:hover,.nvd3 .nv-candlestickBar .nv-ticks rect:hover,.nvd3 .nv-discretebar .nv-groups rect:hover,.nvd3 .nv-multibar .nv-groups rect:hover,.nvd3 .nv-multibarHorizontal .nv-groups rect:hover,.nvd3 .nv-scatter .nv-point.hover,.nvd3.nv-bullet .nv-measure:hover,.nvd3.nv-linePlusBar .nv-bar rect:hover,.nvd3.nv-pie .hover path{fill-opacity:1}.nvd3 .nv-bars .hover rect{fill:lightblue}.nvd3 .nv-bars text{fill:rgba(0,0,0,0)}.nvd3 .nv-bars .hover text{fill:rgba(0,0,0,1)}.nvd3 .nv-discretebar .nv-groups rect,.nvd3 .nv-multibar .nv-groups rect,.nvd3 .nv-multibarHorizontal .nv-groups rect{stroke-opacity:0;-webkit-transition:fill-opacity 250ms linear;transition:fill-opacity 250ms linear}.nvd3 .nv-discretebar .nv-groups text,.nvd3 .nv-multibarHorizontal .nv-groups text{font-weight:700;fill:rgba(0,0,0,1);stroke:rgba(0,0,0,0)}.nvd3 .nv-boxplot circle{fill-opacity:0.5}.nvd3 line.nv-boxplot-median{stroke:black}.nv-boxplot-tick:hover{stroke-width:2.5px}.nvd3.nv-bullet{font:10px sans-serif}.nvd3.nv-bullet .nv-measure{fill-opacity:.8}.nvd3.nv-bullet .nv-marker{stroke:#000;stroke-width:2px}.nvd3.nv-bullet .nv-markerTriangle{stroke:#000;fill:#fff;stroke-width:1.5px}.nvd3.nv-bullet .nv-markerLine{stroke:#000;stroke-width:1.5px}.nvd3.nv-bullet .nv-tick line{stroke:#666;stroke-width:.5px}.nvd3.nv-bullet .nv-range.nv-s0{fill:#eee}.nvd3.nv-bullet .nv-range.nv-s1{fill:#ddd}.nvd3.nv-bullet .nv-range.nv-s2{fill:#ccc}.nvd3.nv-bullet .nv-title{font-size:14px;font-weight:700}.nvd3.nv-bullet .nv-subtitle{fill:#999}.nvd3.nv-bullet .nv-range{fill:#bababa;fill-opacity:.4}.nvd3.nv-bullet .nv-range:hover{fill-opacity:.7}.nvd3.nv-candlestickBar .nv-ticks .nv-tick,.nvd3.nv-ohlcBar .nv-ticks .nv-tick{stroke-width:1px}.nvd3.nv-candlestickBar .nv-ticks .nv-tick.hover,.nvd3.nv-ohlcBar .nv-ticks .nv-tick.hover{stroke-width:2px}.nvd3.nv-candlestickBar .nv-ticks .nv-tick.positive rect,.nvd3.nv-sparklineplus .nv-maxValue{stroke:#2ca02c;fill:#2ca02c}.nvd3.nv-candlestickBar .nv-ticks .nv-tick.negative rect,.nvd3.nv-sparklineplus .nv-minValue{stroke:#d62728;fill:#d62728}.with-transitions .nv-candlestickBar .nv-ticks .nv-tick,.with-transitions .nvd3 .nv-groups .nv-point{-webkit-transition:stroke-width 250ms linear,stroke-opacity 250ms linear;transition:stroke-width 250ms linear,stroke-opacity 250ms linear}.nvd3.nv-candlestickBar .nv-ticks line{stroke:#333}.nv-force-node{stroke:#fff;stroke-width:1.5px}.nv-force-link{stroke:#999;stroke-opacity:.6}.nv-force-node text{stroke-width:0}.nvd3 .nv-check-box .nv-box{fill-opacity:0;stroke-width:2}.nvd3 .nv-check-box .nv-check{fill-opacity:0;stroke-width:4}.nvd3 .nv-hoverArea,.nvd3 .nv-series.nv-disabled .nv-check-box .nv-check,.nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point,.nvd3.nv-pie .nv-label rect{fill-opacity:0;stroke-opacity:0}.nvd3.nv-linePlusBar .nv-bar rect{fill-opacity:.75}.nvd3 .nv-groups path.nv-line,.nvd3.nv-sparkline path{fill:none}.nvd3 .nv-groups path.nv-area{stroke:none}.nvd3.nv-scatter.nv-single-point .nv-groups .nv-point{fill-opacity:.5!important;stroke-opacity:.5!important}.nvd3 .nv-groups .nv-point.hover,.nvd3.nv-scatter .nv-groups .nv-point.hover{stroke-width:7px;fill-opacity:.95!important;stroke-opacity:.95!important}.nvd3 .nv-point-paths path{stroke:#aaa;stroke-opacity:0;fill:#eee;fill-opacity:0}.nvd3 .nv-indexLine{cursor:ew-resize}svg.nvd3-svg{-webkit-user-select:none;-ms-user-select:none;user-select:none;display:block;width:100%;height:100%}.nvtooltip.with-3d-shadow,.with-3d-shadow .nvtooltip{-webkit-box-shadow:0 5px 10px rgba(0,0,0,.2);box-shadow:0 5px 10px rgba(0,0,0,.2);border-radius:5px}.nvd3 text{font:12px Arial,sans-serif}.nvtooltip h3,.nvtooltip table td.key{font-weight:400}.nvd3 .title{font:bold 14px Arial,sans-serif}.nvd3 .nv-background{fill:white;fill-opacity:0}.nvd3.nv-noData{font-size:18px;font-weight:700}.nv-brush .selection{fill-opacity:.125;shape-rendering:crispEdges}.nv-brush .handle path{fill:#eee;stroke:#666}.nvd3 .nv-legend .nv-series{cursor:pointer}.nvd3 .nv-legend .nv-disabled circle{fill-opacity:0}.nvd3 .nv-brush .selection{fill-opacity:0!important}.nvd3 .nv-brushBackground rect{stroke:#000;stroke-width:.4;fill:#fff;fill-opacity:.7}@media print{.nvd3 text{stroke-width:0;fill-opacity:1}}.nvd3.nv-ohlcBar .nv-ticks .nv-tick.positive{stroke:#2ca02c}.nvd3.nv-ohlcBar .nv-ticks .nv-tick.negative{stroke:#d62728}.nvd3 .background path{fill:none;stroke:#EEE;stroke-opacity:.4;shape-rendering:crispEdges}.nvd3 .foreground path{fill:none;stroke-opacity:.7}.nvd3 .nv-parallelCoordinates-brush .selection{fill:#fff;fill-opacity:.6;stroke:gray;shape-rendering:crispEdges}.nvd3 .nv-parallelCoordinates .hover{fill-opacity:1;stroke-width:3px}.nvd3 .missingValuesline line{fill:none;stroke:black;stroke-width:1;stroke-opacity:1;stroke-dasharray:5,5}.nvd3.nv-pie path{stroke-opacity:0;-webkit-transition:fill-opacity 250ms linear,stroke-width 250ms linear,stroke-opacity 250ms linear;transition:fill-opacity 250ms linear,stroke-width 250ms linear,stroke-opacity 250ms linear;stroke:#fff;stroke-width:1px;stroke-opacity:1;fill-opacity:.7}.nvd3.nv-pie .nv-pie-title{font-size:24px;fill:rgba(19,196,249,0.59)}.nvd3.nv-pie .nv-slice text{stroke:#000;stroke-width:0}.nvd3 .nv-groups .nv-point.hover{stroke-width:20px;stroke-opacity:.5}.nvd3.nv-sparklineplus .nv-hoverValue line{stroke:#333;stroke-width:1.5px}.nvd3.nv-sparklineplus,.nvd3.nv-sparklineplus g{pointer-events:all}.nvd3.nv-sparklineplus .nv-xValue,.nvd3.nv-sparklineplus .nv-yValue{stroke-width:0;font-size:.9em;font-weight:400}.nvd3.nv-sparklineplus .nv-yValue{stroke:#f66}.nvd3.nv-sparklineplus .nv-currentValue{font-weight:700;font-size:1.1em}.nvd3.nv-stackedarea path.nv-area{fill-opacity:.7;stroke-opacity:0;-webkit-transition:fill-opacity 250ms linear,stroke-opacity 250ms linear;transition:fill-opacity 250ms linear,stroke-opacity 250ms linear}.nvd3.nv-stackedarea path.nv-area.hover{fill-opacity:.9}.nvd3.nv-stackedarea .nv-groups .nv-point{stroke-opacity:0;fill-opacity:0}.nvtooltip{position:absolute;background-color:#fff;color:#000;padding:1px;border:1px solid rgba(0,0,0,.5);z-index:10000;display:block;font-family:Arial,sans-serif;font-size:13px;text-align:left;white-space:nowrap;-webkit-user-select:none;-ms-user-select:none;user-select:none;background:rgba(255,255,255,.8);border-radius:4px}.nvtooltip.with-transitions,.with-transitions .nvtooltip{-webkit-transition:opacity 50ms linear 0.2s;transition:opacity 50ms linear 0.2s}.nvtooltip.x-nvtooltip,.nvtooltip.y-nvtooltip{padding:8px}.nvtooltip h3{padding:4px 14px;line-height:18px;background-color:rgba(247,247,247,.75);color:#000;border-bottom:1px solid #ebebeb;border-radius:5px 5px 0 0}.nvtooltip p{padding:5px 14px}.nvtooltip span{display:inline-block;margin:2px 0}.nvtooltip table{margin:6px;border-spacing:0}.nvtooltip table td{padding:2px 9px 2px 0;vertical-align:middle}.nvtooltip table td.value{text-align:right;font-weight:700}.nvtooltip table td.percent{color:#a9a9a9}.nvtooltip table tr.highlight td{padding:1px 9px 1px 0;border-bottom-style:solid;border-bottom-width:1px;border-top-style:solid;border-top-width:1px}.nvtooltip table td.legend-color-guide div{vertical-align:middle;width:12px;height:12px;border:1px solid #999}.nvtooltip .footer{padding:3px;text-align:center}.nvtooltip-pending-removal{pointer-events:none;display:none}.nvd3 line.nv-guideline{stroke:#ccc}\n";
+const wmChartCss = "";
+export {
+  nvd3Css,
+  wmChartCss
+};

package/components/chart/src/chartUtils.d.ts

@@ -0,0 +1,26 @@
+import type { WidgetContext } from "./types";
+export { isShowLegend } from "./dataUtils";
+export declare const customiseTooltip: (chart: any, propertyValueMap: any, widgetContext: WidgetContext, label?: string) => void;
+export declare const highlightPoints: (chartId: string | null, highlightpoints: boolean) => void;
+export declare const setLineThickness: (chartId: string | null, thickness: string | undefined) => void;
+export declare const setTextStyle: (properties: Record<string, string>, chartId: string) => void;
+export declare const modifyLegendPosition: (widgetContext: WidgetContext, position: string, chartId: string) => void;
+export declare const postPlotChartProcess: (widgetContext: WidgetContext, chartId: string) => void;
+export declare const initChart: (widgetContext: WidgetContext, xDomainValues: any, yDomainValues: any, propertyValueMap: any, isPreview: boolean) => any;
+export declare const isShowLegendValue: (value: any) => boolean;
+export declare const setLabelsMaxWidth: (chartId: string, chartDataLength: number, fontsize: string | undefined, type: string) => void;
+/**
+ * Sets the center label for donut charts.
+ * Ported from Angular chart.component.ts setDonutCenterLabel().
+ */
+export declare const setDonutCenterLabel: (chartId: string, labelValue: string) => void;
+/**
+ * Handles pie label rotation post-render.
+ * Ported from Angular chart.component.ts postPlotProcess() pie section.
+ */
+export declare const rotatePieLabels: (chartId: string) => void;
+/**
+ * Attaches click events to chart data points.
+ * Ported from Angular chart.component.ts attachClickEvent().
+ */
+export declare const attachClickEvent: (chartId: string, type: string, onSelect?: (event: MouseEvent, selectedItem: any, selectedChartItem: any) => void) => void;