@splunk/visualizations 28.1.0 → 28.2.0

package/common/TimeSeriesChartWrapper.js

@@ -0,0 +1,485 @@
+/* Copyright © 2020 Splunk Inc.
+SPLUNK CONFIDENTIAL – Use or disclosure of this material in whole or
+in part without a valid written license from Splunk Inc. is PROHIBITED. */
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+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 __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/common/TimeSeriesChartWrapper.tsx
+var TimeSeriesChartWrapper_exports = {};
+__export(TimeSeriesChartWrapper_exports, {
+  default: () => TimeSeriesChartWrapper_default,
+  handleClick: () => handleClick,
+  handleLegendClick: () => handleLegendClick
+});
+module.exports = __toCommonJS(TimeSeriesChartWrapper_exports);
+
+// esm-externals:react
+var react_exports = {};
+__export(react_exports, {
+  default: () => react_default
+});
+var defaultImport = __toESM(require("react"));
+__reExport(react_exports, require("react"));
+var react_default = "default" in defaultImport ? defaultImport.default : defaultImport;
+
+// esm-externals:lodash
+var lodash_exports = {};
+__export(lodash_exports, {
+  default: () => lodash_default
+});
+var defaultImport2 = __toESM(require("lodash"));
+__reExport(lodash_exports, require("lodash"));
+var lodash_default = "default" in defaultImport2 ? defaultImport2.default : defaultImport2;
+
+// esm-externals:styled-components
+var styled_components_exports = {};
+__export(styled_components_exports, {
+  default: () => styled_components_default
+});
+var defaultImport3 = __toESM(require("styled-components"));
+__reExport(styled_components_exports, require("styled-components"));
+var styled_components_default = "default" in defaultImport3 ? defaultImport3.default : defaultImport3;
+
+// esm-externals:@splunk/visualizations-shared/SizeAwareWrapper
+var SizeAwareWrapper_exports = {};
+__export(SizeAwareWrapper_exports, {
+  default: () => SizeAwareWrapper_default
+});
+var defaultImport4 = __toESM(require("@splunk/visualizations-shared/SizeAwareWrapper"));
+__reExport(SizeAwareWrapper_exports, require("@splunk/visualizations-shared/SizeAwareWrapper"));
+var SizeAwareWrapper_default = "default" in defaultImport4 ? defaultImport4.default : defaultImport4;
+
+// esm-externals:@splunk/visualization-canvas
+var visualization_canvas_exports = {};
+__export(visualization_canvas_exports, {
+  default: () => visualization_canvas_default
+});
+var defaultImport5 = __toESM(require("@splunk/visualization-canvas"));
+__reExport(visualization_canvas_exports, require("@splunk/visualization-canvas"));
+var visualization_canvas_default = "default" in defaultImport5 ? defaultImport5.default : defaultImport5;
+
+// esm-externals:@splunk/visualizations-shared/style
+var style_exports = {};
+__export(style_exports, {
+  default: () => style_default
+});
+var defaultImport6 = __toESM(require("@splunk/visualizations-shared/style"));
+__reExport(style_exports, require("@splunk/visualizations-shared/style"));
+var style_default = "default" in defaultImport6 ? defaultImport6.default : defaultImport6;
+
+// src/common/components/VizStyleWrapper.jsx
+var VizStyleWrapper = styled_components_default.div.attrs(({ dataTestKey }) => ({
+  "data-test": dataTestKey,
+  "data-testid": dataTestKey
+}))`
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    width: 100%;
+    height: 100%;
+    background-color: ${(props) => props.backgroundColor};
+`;
+VizStyleWrapper.displayName = "VizStyleWrapper";
+var VizStyleWrapper_default = VizStyleWrapper;
+
+// esm-externals:@splunk/themes/variables
+var variables_exports = {};
+__export(variables_exports, {
+  default: () => variables_default
+});
+var defaultImport7 = __toESM(require("@splunk/themes/variables"));
+__reExport(variables_exports, require("@splunk/themes/variables"));
+var variables_default = "default" in defaultImport7 ? defaultImport7.default : defaultImport7;
+
+// esm-externals:@splunk/react-icons/Triangle
+var Triangle_exports = {};
+__export(Triangle_exports, {
+  default: () => Triangle_default
+});
+var defaultImport8 = __toESM(require("@splunk/react-icons/Triangle"));
+__reExport(Triangle_exports, require("@splunk/react-icons/Triangle"));
+var Triangle_default = "default" in defaultImport8 ? defaultImport8.default : defaultImport8;
+
+// src/common/chartingUtils.ts
+var DEFAULT_LINE_WIDTH = 2;
+var getAnnotationsForCanvas = ({
+  annotationX,
+  annotationColor,
+  annotationLabel
+}) => (annotationX == null ? void 0 : annotationX.length) ? annotationX.map((timestamp, i) => ({
+  key: annotationLabel == null ? void 0 : annotationLabel[i],
+  time: timestamp,
+  color: annotationColor == null ? void 0 : annotationColor[i]
+})) : [];
+var StyledTriangle = styled_components_default(Triangle_default)`
+    color: ${(props) => props.eventColor || variables_default.severityColorNotice(props)};
+`;
+var triangleEventAnnotationRenderer = ({ event }) => {
+  const eventWithColor = event;
+  return react_default.createElement(StyledTriangle, {
+    viewBox: "0 0 24 24",
+    variant: "filled",
+    eventColor: eventWithColor.color
+  });
+};
+var filterChartDataFromInternalFields = (chartData) => {
+  const { fields, columns } = chartData;
+  const keepIndexes = fields.reduce((acc, field, index) => {
+    const fieldName = typeof field === "object" ? field == null ? void 0 : field.name : field;
+    if (!(fieldName == null ? void 0 : fieldName.startsWith("_")) || fieldName === "_time") {
+      acc.push(index);
+    }
+    return acc;
+  }, []);
+  const filteredFields = keepIndexes.map((index) => fields[index]);
+  const filteredColumns = keepIndexes.map((index) => columns[index]);
+  return { fields: filteredFields, columns: filteredColumns };
+};
+var convert2DArrayToNumbers = (arr) => {
+  return arr.map((subArray) => subArray.map((element) => parseFloat(element)));
+};
+var SideLegendWidth = 75;
+var commonLegendProps = { center: true, fontSize: 12, largerTiles: true, hideSeriesValue: true };
+var getLegend = (props) => {
+  const legendPlacement = props == null ? void 0 : props.legendDisplay;
+  switch (legendPlacement) {
+    case "off":
+      return false;
+    case "left":
+      return (0, visualization_canvas_exports.LeftLegendFactory)(__spreadValues({
+        width: SideLegendWidth
+      }, commonLegendProps));
+    case "bottom":
+      return (0, visualization_canvas_exports.BottomLegendFactory)(__spreadValues({
+        wrap: true
+      }, commonLegendProps));
+    case "top":
+      return (0, visualization_canvas_exports.TopLegendFactory)(__spreadValues({
+        wrap: true
+      }, commonLegendProps));
+    default:
+      return (0, visualization_canvas_exports.SideLegendFactory)(__spreadValues({
+        width: SideLegendWidth
+      }, commonLegendProps));
+  }
+};
+var getComputedAxisTitles = (inputAxisTitle, fields, axisTitleVisibility) => {
+  if (axisTitleVisibility === "collapsed") {
+    return "";
+  }
+  let fieldTitle = fields.length > 1 ? "" : fields[0];
+  if (!fieldTitle) {
+    fieldTitle = "";
+  }
+  return (inputAxisTitle == null ? void 0 : inputAxisTitle.length) ? inputAxisTitle.trim() : fieldTitle;
+};
+var ellipsisAxisTitle = (axisTitle, containerSpacing, fontSize = 12) => {
+  if (!axisTitle) {
+    return "";
+  }
+  if (Number.isNaN(containerSpacing) || containerSpacing <= 0) {
+    return axisTitle;
+  }
+  const availableHeight = containerSpacing * 0.6;
+  const avgCharWidth = fontSize * 0.55;
+  const maxChars = Math.floor(availableHeight / avgCharWidth);
+  if (axisTitle.length <= maxChars) {
+    return axisTitle;
+  }
+  if (maxChars <= 3) {
+    return "...";
+  }
+  const availableChars = maxChars - 3;
+  const halfChars = Math.floor(availableChars / 2);
+  const start = axisTitle.slice(0, halfChars);
+  const end = axisTitle.slice(-halfChars);
+  return `${start}...${end}`;
+};
+var getFieldName = (field) => {
+  const fieldName = typeof field === "object" ? field == null ? void 0 : field.name : field;
+  return fieldName;
+};
+var getFieldNames = (fields) => {
+  return fields.map((field) => getFieldName(field));
+};
+var getXScaleConfig = (label) => {
+  const xConfig = { x: {} };
+  xConfig.x.label = label;
+  return xConfig;
+};
+var getYScaleConfig = (label, yAxisAbbreviation, yAxisScale) => {
+  const scaleType = yAxisScale != null ? yAxisScale : "linear";
+  const yConfig = { y: {} };
+  yConfig.y.label = label;
+  yConfig.y.type = scaleType;
+  if (yAxisAbbreviation !== "none") {
+    yConfig.y.tickFmt = (v) => (0, visualization_canvas_exports.shortenNumber)(v, 1);
+  }
+  if (yAxisAbbreviation === "none") {
+    yConfig.y.width = 55;
+  } else {
+    yConfig.y.width = label && label.length > 0 ? 30 : 10;
+  }
+  return yConfig;
+};
+var getY2ScaleConfig = (label, axisAbbreviation, axisScale, roundAxisLabelsToInteger) => {
+  const y2Config = { y2: {} };
+  const scaleType = axisScale != null ? axisScale : "linear";
+  y2Config.y2.label = label;
+  y2Config.y2.side = "right";
+  y2Config.y2.showGrid = false;
+  y2Config.y2.type = scaleType;
+  if (axisAbbreviation !== "none") {
+    y2Config.y2.tickFmt = (v) => (0, visualization_canvas_exports.shortenNumber)(v, 1, roundAxisLabelsToInteger);
+  } else if (roundAxisLabelsToInteger) {
+    y2Config.y2.tickFmt = (v) => roundAxisLabelsToInteger ? Math.round(v).toString() : v.toString();
+  }
+  return y2Config;
+};
+var getSeriesOverrides = (yfields, y2fields, lineWidth, overlayFields, y2Enabled, nullValueMode) => {
+  const seriesConfig = {};
+  let spanGaps;
+  let replaceNullsWithZero;
+  if (nullValueMode === "gaps") {
+    spanGaps = false;
+  } else if (nullValueMode === "connect" || nullValueMode === "zero") {
+    spanGaps = true;
+    if (nullValueMode === "zero") {
+      replaceNullsWithZero = true;
+    }
+  }
+  yfields.forEach((field) => {
+    seriesConfig[field] = {
+      overrides: { width: lineWidth != null ? lineWidth : DEFAULT_LINE_WIDTH }
+    };
+    if (spanGaps !== void 0) {
+      seriesConfig[field].overrides.spanGaps = spanGaps;
+    }
+    if (y2Enabled) {
+      const shouldAssignToY2 = (
+        // If y2Fields are present, assign all y2Fields to y2 scale
+        (y2fields == null ? void 0 : y2fields.length) > 0 && y2fields.includes(field) || // Else, assign all overlayFields to y2 scale
+        (!y2fields || y2fields.length === 0) && (overlayFields == null ? void 0 : overlayFields.includes(field))
+      );
+      if (shouldAssignToY2) {
+        seriesConfig[field].overrides.scale = "y2";
+      }
+    }
+    if (overlayFields == null ? void 0 : overlayFields.includes(field)) {
+      seriesConfig[field].type = "line";
+    }
+    if (replaceNullsWithZero !== void 0) {
+      seriesConfig[field].replaceNullsWithZero = replaceNullsWithZero;
+    }
+  });
+  return seriesConfig;
+};
+
+// src/common/TimeSeriesChartWrapper.tsx
+var TimeSeriesChartContainer = styled_components_default.div`
+    overflow: hidden;
+    ${(props) => (0, style_exports.toDimension)((0, lodash_exports.pick)(props, ["width", "height"]))};
+
+    canvas {
+        position: absolute !important; // This is needed for canvas element export pdf/png to work correctly
+    }
+`;
+var handleClick = (chartEvent, props) => {
+  const payload = __spreadProps(__spreadValues({}, (0, lodash_exports.pick)(chartEvent, "value", "seriesKey")), {
+    name: chartEvent.seriesKey
+  });
+  delete payload.seriesKey;
+  const clickHandler = props == null ? void 0 : props.onClick;
+  if (clickHandler) {
+    clickHandler({
+      type: "point.click",
+      originalEvent: chartEvent,
+      payload
+    });
+  }
+};
+var handleLegendClick = (chartEvent, props) => {
+  const payload = {
+    name: chartEvent
+  };
+  const clickHandler = props == null ? void 0 : props.onClick;
+  if (clickHandler) {
+    clickHandler({
+      type: "legend.click",
+      originalEvent: chartEvent,
+      payload
+    });
+  }
+};
+var TimeSeriesChartWrapper = (props) => {
+  const { width, height, chartData, options, userLocale, annotationX, annotationLabel, annotationColor } = props;
+  const {
+    backgroundColor,
+    seriesColors: seriesColorsStr,
+    fieldColors,
+    "axisTitleX.text": xAxisTitleText,
+    "axisTitleY.text": yAxisTitleText,
+    "axisTitleY2.text": y2AxisTitleText,
+    "axisTitleX.visibility": xAxisTitleVisibility,
+    "axisTitleY.visibility": yAxisTitleVisibility,
+    "axisTitleY2.visibility": y2AxisTitleVisibility,
+    "axisY.abbreviation": yAxisAbbreviation,
+    "axisY.scale": yAxisScale,
+    "axisY2.abbreviation": y2AxisAbbreviation,
+    "axisY2.fields": y2FieldsStr,
+    "axisY2.scale": y2AxisScale,
+    "axisY2.enabled": y2Enabled,
+    "axisLabelsY2.integerUnits": y2IntegerUnits,
+    "chart.overlayFields": overlayFieldsStr,
+    "chart.nullValueMode": nullValueMode,
+    lineWidth
+  } = options;
+  const seriesColors = seriesColorsStr ? JSON.parse(seriesColorsStr) : void 0;
+  const seriesColorsByField = fieldColors ? JSON.parse(fieldColors) : void 0;
+  const [containerWidth, setContainerWidth] = react_exports.useState(Number(props.width));
+  const [containerHeight, setContainerHeight] = react_exports.useState(Number(props.height));
+  const cachedHandleResize = react_exports.useCallback((w, h) => {
+    setContainerWidth(w);
+    setContainerHeight(h);
+  }, []);
+  const filteredChartData = filterChartDataFromInternalFields({
+    fields: chartData.fields,
+    columns: chartData.seriesList
+  });
+  const xField = getFieldName(filteredChartData.fields[0]);
+  const yFields = getFieldNames(
+    filteredChartData.fields.length > 1 ? filteredChartData.fields.slice(1) : []
+  );
+  const y2Fields = y2FieldsStr ? y2FieldsStr.split(",").map((f) => f.trim()) : [];
+  const overlayFields = overlayFieldsStr ? overlayFieldsStr.split(",").map((f) => f.trim()) : [];
+  let xAxisTitle = getComputedAxisTitles(xAxisTitleText, [xField], xAxisTitleVisibility);
+  xAxisTitle = ellipsisAxisTitle(xAxisTitle, containerWidth);
+  let yAxisTitle = getComputedAxisTitles(yAxisTitleText, yFields, yAxisTitleVisibility);
+  yAxisTitle = ellipsisAxisTitle(yAxisTitle, containerHeight);
+  const fieldsForY2Axis = y2Fields.length > 0 ? y2Fields : overlayFields;
+  let y2AxisTitle = getComputedAxisTitles(y2AxisTitleText, fieldsForY2Axis, y2AxisTitleVisibility);
+  y2AxisTitle = ellipsisAxisTitle(y2AxisTitle, containerHeight);
+  const xScaleConfig = getXScaleConfig(xAxisTitle);
+  const yScaleConfig = getYScaleConfig(yAxisTitle, yAxisAbbreviation, yAxisScale);
+  let y2ScaleConfig = {};
+  if (y2Enabled) {
+    y2ScaleConfig = getY2ScaleConfig(y2AxisTitle, y2AxisAbbreviation, y2AxisScale, y2IntegerUnits);
+  }
+  const uplotContainerElement = (0, react_exports.useRef)(null);
+  const seriesDataFormatted = [
+    filteredChartData.columns[0],
+    ...convert2DArrayToNumbers(filteredChartData.columns.slice(1))
+  ];
+  chartData.fields = filteredChartData.fields;
+  chartData.columns = seriesDataFormatted;
+  const seriesOverrides = getSeriesOverrides(
+    yFields,
+    y2Fields,
+    lineWidth,
+    overlayFields,
+    y2Enabled,
+    nullValueMode
+  );
+  const chartingEventAnnotations = getAnnotationsForCanvas({
+    annotationX,
+    annotationColor,
+    annotationLabel
+  });
+  const MemoizedChart = react_exports.memo(visualization_canvas_exports.TimeSeriesChart);
+  const scaleConfig = __spreadValues(__spreadValues(__spreadValues({}, xScaleConfig), yScaleConfig), y2ScaleConfig);
+  const memoizedChart = (0, react_exports.useMemo)(
+    () => /* @__PURE__ */ react_exports.createElement(
+      MemoizedChart,
+      {
+        data: chartData,
+        width: containerWidth,
+        height: containerHeight,
+        seriesColors,
+        seriesColorsByField,
+        seriesConfig: seriesOverrides,
+        legend: getLegend(props),
+        scaleConfig,
+        timestampFormat: "expanded",
+        onCrosshairClick: (event) => handleClick(event, props),
+        onSeriesClick: (event) => handleLegendClick(event, props),
+        userLocale,
+        events: chartingEventAnnotations,
+        eventsConfig: { renderer: triangleEventAnnotationRenderer }
+      }
+    ),
+    [
+      MemoizedChart,
+      chartData,
+      containerWidth,
+      containerHeight,
+      seriesColors,
+      seriesColorsByField,
+      seriesOverrides,
+      lineWidth,
+      props,
+      scaleConfig,
+      userLocale,
+      chartingEventAnnotations
+    ]
+  );
+  const memoizedVisualization = (0, react_exports.useMemo)(() => {
+    return /* @__PURE__ */ react_exports.createElement(VizStyleWrapper_default, { backgroundColor }, memoizedChart);
+  }, [backgroundColor]);
+  return /* @__PURE__ */ react_exports.createElement(
+    TimeSeriesChartContainer,
+    {
+      height,
+      width,
+      ref: uplotContainerElement,
+      "data-test": "timeseries-chart-wrapper"
+    },
+    /* @__PURE__ */ react_exports.createElement(SizeAwareWrapper_default, { width, height, onResize: cachedHandleResize }),
+    memoizedVisualization
+  );
+};
+var TimeSeriesChartWrapper_default = TimeSeriesChartWrapper;
+//# sourceMappingURL=TimeSeriesChartWrapper.js.map

package/common/TimeSeriesChartWrapper.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/common/TimeSeriesChartWrapper.tsx", "esm-externals:react", "esm-externals:lodash", "esm-externals:styled-components", "esm-externals:@splunk/visualizations-shared/SizeAwareWrapper", "esm-externals:@splunk/visualization-canvas", "esm-externals:@splunk/visualizations-shared/style", "../src/common/components/VizStyleWrapper.jsx", "esm-externals:@splunk/themes/variables", "esm-externals:@splunk/react-icons/Triangle", "../src/common/chartingUtils.ts"],
+  "sourcesContent": ["import * as React from 'react';\nimport { useMemo, useRef } from 'react';\nimport { pick } from 'lodash';\nimport styled from 'styled-components';\nimport SizeAwareWrapper from '@splunk/visualizations-shared/SizeAwareWrapper';\nimport { TimeSeriesChart } from '@splunk/visualization-canvas';\nimport { toDimension } from '@splunk/visualizations-shared/style';\nimport type { GenericDataSet } from '@splunk/visualization-canvas/types/types';\nimport VizStyleWrapper from './components/VizStyleWrapper';\nimport { ChartingProps } from './Charting';\nimport {\n    convert2DArrayToNumbers,\n    filterChartDataFromInternalFields,\n    getComputedAxisTitles,\n    getFieldName,\n    getFieldNames,\n    getLegend,\n    getSeriesOverrides,\n    getXScaleConfig,\n    getYScaleConfig,\n    getY2ScaleConfig,\n    ellipsisAxisTitle,\n    getAnnotationsForCanvas,\n    triangleEventAnnotationRenderer,\n} from './chartingUtils';\n\nconst TimeSeriesChartContainer = styled.div<{\n    width: number | string;\n    height: number | string;\n}>`\n    overflow: hidden;\n    ${props => toDimension(pick(props, ['width', 'height']))};\n\n    canvas {\n        position: absolute !important; // This is needed for canvas element export pdf/png to work correctly\n    }\n`;\n\nexport const handleClick = (chartEvent, props) => {\n    const payload = {\n        ...pick(chartEvent, 'value', 'seriesKey'),\n        name: chartEvent.seriesKey,\n    };\n    delete payload.seriesKey;\n    const clickHandler = props?.onClick;\n    if (clickHandler) {\n        clickHandler({\n            type: 'point.click',\n            originalEvent: chartEvent,\n            payload,\n        });\n    }\n};\n\nexport const handleLegendClick = (chartEvent, props) => {\n    const payload = {\n        name: chartEvent,\n    };\n    const clickHandler = props?.onClick;\n    if (clickHandler) {\n        clickHandler({\n            type: 'legend.click',\n            originalEvent: chartEvent,\n            payload,\n        });\n    }\n};\n\nconst TimeSeriesChartWrapper = (props: ChartingProps) => {\n    const { width, height, chartData, options, userLocale, annotationX, annotationLabel, annotationColor } =\n        props;\n    const {\n        backgroundColor,\n        seriesColors: seriesColorsStr,\n        fieldColors,\n        'axisTitleX.text': xAxisTitleText,\n        'axisTitleY.text': yAxisTitleText,\n        'axisTitleY2.text': y2AxisTitleText,\n        'axisTitleX.visibility': xAxisTitleVisibility,\n        'axisTitleY.visibility': yAxisTitleVisibility,\n        'axisTitleY2.visibility': y2AxisTitleVisibility,\n        'axisY.abbreviation': yAxisAbbreviation,\n        'axisY.scale': yAxisScale,\n        'axisY2.abbreviation': y2AxisAbbreviation,\n        'axisY2.fields': y2FieldsStr,\n        'axisY2.scale': y2AxisScale,\n        'axisY2.enabled': y2Enabled,\n        'axisLabelsY2.integerUnits': y2IntegerUnits,\n        'chart.overlayFields': overlayFieldsStr,\n        'chart.nullValueMode': nullValueMode,\n        lineWidth,\n    } = options;\n\n    const seriesColors = seriesColorsStr ? JSON.parse(seriesColorsStr) : undefined;\n    const seriesColorsByField = fieldColors ? JSON.parse(fieldColors) : undefined;\n    const [containerWidth, setContainerWidth] = React.useState(Number(props.width));\n    const [containerHeight, setContainerHeight] = React.useState(Number(props.height));\n    const cachedHandleResize = React.useCallback((w, h) => {\n        setContainerWidth(w);\n        setContainerHeight(h);\n    }, []);\n    const filteredChartData = filterChartDataFromInternalFields({\n        fields: chartData.fields,\n        columns: chartData.seriesList,\n    });\n\n    const xField = getFieldName(filteredChartData.fields[0]);\n    const yFields = getFieldNames(\n        filteredChartData.fields.length > 1 ? filteredChartData.fields.slice(1) : []\n    );\n    const y2Fields = y2FieldsStr ? y2FieldsStr.split(',').map(f => f.trim()) : [];\n    const overlayFields = overlayFieldsStr ? overlayFieldsStr.split(',').map(f => f.trim()) : [];\n    let xAxisTitle = getComputedAxisTitles(xAxisTitleText, [xField], xAxisTitleVisibility);\n    xAxisTitle = ellipsisAxisTitle(xAxisTitle, containerWidth);\n    let yAxisTitle = getComputedAxisTitles(yAxisTitleText, yFields, yAxisTitleVisibility);\n    yAxisTitle = ellipsisAxisTitle(yAxisTitle, containerHeight);\n    const fieldsForY2Axis = y2Fields.length > 0 ? y2Fields : overlayFields;\n    let y2AxisTitle = getComputedAxisTitles(y2AxisTitleText, fieldsForY2Axis, y2AxisTitleVisibility);\n    y2AxisTitle = ellipsisAxisTitle(y2AxisTitle, containerHeight);\n    const xScaleConfig = getXScaleConfig(xAxisTitle);\n    const yScaleConfig = getYScaleConfig(yAxisTitle, yAxisAbbreviation, yAxisScale);\n    let y2ScaleConfig = {};\n    if (y2Enabled) {\n        y2ScaleConfig = getY2ScaleConfig(y2AxisTitle, y2AxisAbbreviation, y2AxisScale, y2IntegerUnits);\n    }\n    const uplotContainerElement = useRef(null);\n\n    const seriesDataFormatted = [\n        filteredChartData.columns[0],\n        ...convert2DArrayToNumbers(filteredChartData.columns.slice(1)),\n    ];\n    chartData.fields = filteredChartData.fields;\n    chartData.columns = seriesDataFormatted;\n    const seriesOverrides = getSeriesOverrides(\n        yFields,\n        y2Fields,\n        lineWidth,\n        overlayFields,\n        y2Enabled,\n        nullValueMode\n    );\n    const chartingEventAnnotations = getAnnotationsForCanvas({\n        annotationX,\n        annotationColor,\n        annotationLabel,\n    });\n    const MemoizedChart = React.memo(TimeSeriesChart);\n    const scaleConfig = { ...xScaleConfig, ...yScaleConfig, ...y2ScaleConfig };\n    const memoizedChart = useMemo(\n        () => (\n            <MemoizedChart\n                data={chartData as GenericDataSet}\n                width={containerWidth}\n                height={containerHeight}\n                seriesColors={seriesColors}\n                seriesColorsByField={seriesColorsByField}\n                seriesConfig={seriesOverrides}\n                legend={getLegend(props)}\n                scaleConfig={scaleConfig}\n                timestampFormat=\"expanded\"\n                onCrosshairClick={event => handleClick(event, props)}\n                onSeriesClick={event => handleLegendClick(event, props)}\n                userLocale={userLocale}\n                events={chartingEventAnnotations}\n                eventsConfig={{ renderer: triangleEventAnnotationRenderer }}\n            />\n        ),\n        [\n            MemoizedChart,\n            chartData,\n            containerWidth,\n            containerHeight,\n            seriesColors,\n            seriesColorsByField,\n            seriesOverrides,\n            lineWidth,\n            props,\n            scaleConfig,\n            userLocale,\n            chartingEventAnnotations,\n        ]\n    );\n\n    const memoizedVisualization = useMemo(() => {\n        return <VizStyleWrapper backgroundColor={backgroundColor}>{memoizedChart}</VizStyleWrapper>;\n    }, [backgroundColor]);\n\n    return (\n        <TimeSeriesChartContainer\n            height={height}\n            width={width}\n            ref={uplotContainerElement}\n            data-test=\"timeseries-chart-wrapper\"\n        >\n            <SizeAwareWrapper width={width} height={height} onResize={cachedHandleResize} />\n            {memoizedVisualization}\n        </TimeSeriesChartContainer>\n    );\n};\n\nexport default TimeSeriesChartWrapper;\n", "\nimport * as defaultImport from \"react\";\nexport * from \"react\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"lodash\";\nexport * from \"lodash\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"styled-components\";\nexport * from \"styled-components\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/visualizations-shared/SizeAwareWrapper\";\nexport * from \"@splunk/visualizations-shared/SizeAwareWrapper\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/visualization-canvas\";\nexport * from \"@splunk/visualization-canvas\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/visualizations-shared/style\";\nexport * from \"@splunk/visualizations-shared/style\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import styled from 'styled-components';\n\nconst VizStyleWrapper = styled.div.attrs(({ dataTestKey }) => ({\n    'data-test': dataTestKey,\n    'data-testid': dataTestKey,\n}))`\n    display: flex;\n    justify-content: center;\n    flex-direction: column;\n    width: 100%;\n    height: 100%;\n    background-color: ${props => props.backgroundColor};\n`;\n\nVizStyleWrapper.displayName = 'VizStyleWrapper';\n\nexport default VizStyleWrapper;\n", "\nimport * as defaultImport from \"@splunk/themes/variables\";\nexport * from \"@splunk/themes/variables\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "\nimport * as defaultImport from \"@splunk/react-icons/Triangle\";\nexport * from \"@splunk/react-icons/Triangle\";\nexport default ('default' in defaultImport ? defaultImport.default : defaultImport);\n", "import { has, isArray, isUndefined } from 'lodash';\nimport React from 'react';\nimport styled from 'styled-components';\nimport variables from '@splunk/themes/variables';\nimport Triangle from '@splunk/react-icons/Triangle';\nimport {\n    BottomLegendFactory,\n    Legend,\n    SideLegendFactory,\n    LeftLegendFactory,\n    TopLegendFactory,\n    ScaleConfig,\n    shortenNumber,\n    SeriesConfig,\n    EventAnnotation,\n    EventAnnotationRendererProps,\n} from '@splunk/visualization-canvas';\nimport type { JsonColumnData } from './interfaces/DataSource';\n\ninterface ChartOptions {\n    [key: string]: any;\n}\n\nexport const DEFAULT_LINE_WIDTH = 2;\n/**\n * Get formatted annotations - highcharts expects annotations in a specific format\n * @method getAnnotations\n * @param {Object} options\n * @param {Array} options.annotationX\n * @param {Array} options.annotationColor\n * @param {Array} options.annotationLabel\n * @returns {Array}\n */\nexport const getAnnotations = ({ annotationX, annotationColor, annotationLabel }) =>\n    annotationX && annotationX.length\n        ? annotationX.map((timestamp, i) => ({\n              color: annotationColor && annotationColor[i],\n              label: annotationLabel && annotationLabel[i],\n              time: timestamp,\n          }))\n        : [];\n\n/**\n * Get formatted annotations for canvas - viz-canvas timeseries expects annotations in a specific format\n * @method getAnnotationsForCanvas\n * @param {Object} options\n * @param {Array} options.annotationX\n * @param {Array} options.annotationColor\n * @param {Array} options.annotationLabel\n * @returns {Array}\n */\nexport const getAnnotationsForCanvas = ({\n    annotationX,\n    annotationColor,\n    annotationLabel,\n}): EventAnnotation[] =>\n    annotationX?.length\n        ? annotationX.map((timestamp, i) => ({\n              key: annotationLabel?.[i],\n              time: timestamp,\n              color: annotationColor?.[i],\n          }))\n        : [];\n\n/**\n * Styled Triangle component for event annotations with default severityColorNotice\n */\nconst StyledTriangle = styled(Triangle)<{ eventColor?: string }>`\n    color: ${props => props.eventColor || variables.severityColorNotice(props)};\n`;\n\n/**\n * Custom event annotation renderer using Triangle icon from @splunk/react-icons\n * @method triangleEventAnnotationRenderer\n * @param {EventAnnotationRendererProps} props\n * @returns {ReactElement}\n */\nexport const triangleEventAnnotationRenderer: React.FC<EventAnnotationRendererProps> = ({ event }) => {\n    const eventWithColor = event as EventAnnotation & { color?: string };\n    return React.createElement(StyledTriangle, {\n        viewBox: '0 0 24 24',\n        variant: 'filled',\n        eventColor: eventWithColor.color,\n    });\n};\n\n/**\n * Truncate the result set to given limit\n * @method truncateData\n * @param {Object} dataSet - dataSources.primary.data\n * @param {Number|String} truncationLimit - options['chart.resultTruncationLimit']\n * @returns {Object}\n */\nexport const truncateData = (dataSet, truncationLimit): Record<string, any[]> => {\n    if (!dataSet) {\n        return null;\n    }\n\n    const limit = parseInt(truncationLimit, 10);\n    if (!limit || limit <= 0) {\n        return dataSet;\n    }\n\n    const truncatedData: Record<string, Array<string[] | number[]>> = {\n        ...dataSet,\n    };\n    truncatedData.columns = truncatedData.columns.map(columnData =>\n        columnData && Array.isArray(columnData) ? columnData.slice(0, limit) : columnData\n    );\n    return truncatedData;\n};\n\n/**\n * Helper method to update the option values into the values that SC accepts\n * @method mapToValues\n * @param {Object} options\n * @returns {Object}\n */\nexport const mapToValues = (optionValuesSCMapping: Record<string, any>) => options => {\n    const convertedOptions: Record<string, any> = { ...options };\n    Object.keys(optionValuesSCMapping).forEach(key => {\n        if (has(options, key)) {\n            const updatedValue = optionValuesSCMapping[key][options[key]];\n            if (!isUndefined(updatedValue)) {\n                convertedOptions[key] = updatedValue;\n            }\n        }\n    });\n    return convertedOptions;\n};\n\ninterface y2AxisOptions extends ChartOptions {\n    y2Fields?: string | string[];\n}\n\n/**\n * Helper method to process options related to y2Fields\n * @method convertY2AxisOptions\n * @param {Object} originalOptions\n * @returns {Object}\n */\nexport const convertY2AxisOptions = ({\n    y2Fields,\n    ...originalOptions\n}: y2AxisOptions): Record<string, any> => {\n    const convertedOptions: Record<string, any> = {\n        ...originalOptions,\n    };\n    if (y2Fields) {\n        convertedOptions['axisY2.enabled'] = true;\n        convertedOptions['axisY2.fields'] = isArray(y2Fields)\n            ? y2Fields.filter(name => name).join(',')\n            : y2Fields;\n    }\n    return convertedOptions;\n};\n\n/**\n * Helper method to format value for overlayFields\n * @method convertOverlayFields\n * @param {Object} originalOptions\n * @returns {Object}\n */\nexport const convertOverlayFields = (originalOptions: ChartOptions): ChartOptions => {\n    const convertedOptions: ChartOptions = {\n        ...originalOptions,\n    };\n    const { overlayFields } = originalOptions;\n    if (overlayFields) {\n        convertedOptions.overlayFields = Array.isArray(overlayFields)\n            ? overlayFields\n                  .filter(field => field)\n                  .map(field => field.trim())\n                  .join(',')\n            : overlayFields;\n    }\n    return convertedOptions;\n};\n\n/**\n * checks whether data is multi series data\n * @param {array} data array\n * @return {Boolean}\n */\nexport const isMultiSeriesData = (data: string[] | string[][]): boolean =>\n    Array.isArray(data) && Array.isArray(data[0]);\n/**\n * checks whether data is multi series data and returns value as array\n * @param {array} data array\n * @param {*} value to return as array\n * @return {array}\n */\nexport const toArrayForSeries = (data, value): any[] => {\n    if (isMultiSeriesData(data)) {\n        return Array.isArray(value) ? value : [value];\n    }\n    return [value];\n};\ninterface ConstructFieldsAndColumnsParams {\n    x: string[];\n    y: string[] | string[][];\n    xField: string;\n    yFields: string | string[];\n    y2?: string[] | string[][];\n    y2Fields?: string | string[];\n}\nexport const constructFieldsAndColumns = ({\n    x = [],\n    y = [],\n    xField,\n    yFields,\n    y2,\n    y2Fields,\n}: ConstructFieldsAndColumnsParams): JsonColumnData => {\n    const columns = [x.map(String), ...toArrayForSeries(y, y).map(series => series.map(String))];\n    const yFieldsArray = toArrayForSeries(y, yFields);\n    const fields = [{ name: xField }, ...yFieldsArray.map(field => ({ name: field }))];\n    // splunk-charting requires y2 to be part of columns\n    // when y & y2 options are configured with different (mutually exclusive) series\n    // y2 columns need to be added to columns\n    if (y2Fields) {\n        const y2FieldsArray = toArrayForSeries(y2, y2Fields);\n        const y2AsArray = toArrayForSeries(y2, y2).map(series => series?.map(String));\n        y2FieldsArray.forEach((y2Field, index) => {\n            if (yFieldsArray.indexOf(y2Field) === -1 && y2AsArray[index]) {\n                fields.push({\n                    name: y2Field,\n                });\n                columns.push(y2AsArray[index]);\n            }\n        });\n    }\n    return {\n        columns,\n        fields,\n    };\n};\n\nexport function constructAdditionalTooltipFieldsMap({ fields, columns, additionalTooltipFields }) {\n    const map = {};\n\n    additionalTooltipFields?.forEach(fieldName => {\n        const index = fields.findIndex(f => f.name === fieldName);\n        if (index !== -1) {\n            map[fieldName] = columns[index];\n        }\n    });\n\n    return map;\n}\n\n// Note: we are making the assumption that attaching a range.select listener means the user wants to enable search zoom\n// This is because we don't know if the time range tokens being updated by the drilldown is used by the current viz.\n// In the future we are considering using a shared context to pass this information from UDF to Viz.\ninterface OptionsProps {\n    events?: string[];\n    selectedItemId?: string;\n    [key: string]: unknown;\n}\ninterface EventHandler {\n    type: string;\n    options: OptionsProps;\n}\n\nexport const shouldEnableSearchZoom = (eventHandlers: EventHandler[] = [], xField = '') => {\n    const rangeSelectEventHandler = eventHandlers.find(eventHandler =>\n        eventHandler.options.events?.includes('range.select')\n    );\n    // Check if xField is _time. This is how splunk-charting distinguishes a time chart from categorical.\n    // Note: search zoom will be buggy if the x axis uses timestamp values but is not _time\n    const xAxisIsTime = xField === '_time';\n\n    return !!rangeSelectEventHandler && xAxisIsTime;\n};\n\nconst canvasSupportedTimeSeriesCharts = ['splunk.line'];\nexport const isTimeSeriesCanvasRenderSupported = (vizConfigKey: string): boolean => {\n    return canvasSupportedTimeSeriesCharts.indexOf(vizConfigKey) > -1;\n};\n\ntype ChartData = {\n    fields: (string | { name: string })[];\n    columns: (string | number)[][];\n};\n\n// Filter all internal fields and columns except for _time fild\nexport const filterChartDataFromInternalFields = (chartData: ChartData): ChartData => {\n    const { fields, columns } = chartData;\n\n    // Determine the indexes to keep\n    const keepIndexes = fields.reduce<number[]>((acc, field, index) => {\n        const fieldName = typeof field === 'object' ? field?.name : field;\n        if (!fieldName?.startsWith('_') || fieldName === '_time') {\n            acc.push(index);\n        }\n        return acc;\n    }, []);\n\n    // Filter fields and columns\n    const filteredFields = keepIndexes.map(index => fields[index]);\n    const filteredColumns = keepIndexes.map(index => columns[index]);\n\n    return { fields: filteredFields, columns: filteredColumns };\n};\n\nexport const isTimeField = (field): boolean => {\n    return (\n        (typeof field === 'object' && field?.name === '_time') ||\n        (typeof field === 'string' && field === '_time')\n    );\n};\n\nexport const convert2DArrayToNumbers = arr => {\n    return arr.map(subArray => subArray.map(element => parseFloat(element)));\n};\n\nexport const convertTimeStringToUnix = arr => {\n    return arr.map(timeStr => parseInt((new Date(timeStr).getTime() / 1000).toFixed(0), 10));\n};\n\nexport const SideLegendWidth = 75;\nconst commonLegendProps = { center: true, fontSize: 12, largerTiles: true, hideSeriesValue: true };\n// Legend placement logic for canvas render, used in TimeseriesChartWrapper\nexport const getLegend = (props): Legend | false => {\n    const legendPlacement = props?.legendDisplay;\n    // \"right\" | \"left\" | \"top\" | \"bottom\" | \"off\"\n    switch (legendPlacement) {\n        case 'off':\n            return false;\n        case 'left':\n            return LeftLegendFactory({\n                width: SideLegendWidth,\n                ...commonLegendProps,\n            });\n        case 'bottom':\n            return BottomLegendFactory({\n                wrap: true,\n                ...commonLegendProps,\n            });\n        case 'top':\n            return TopLegendFactory({\n                wrap: true,\n                ...commonLegendProps,\n            });\n        // Note: By default, use right legend\n        default:\n            return SideLegendFactory({\n                width: SideLegendWidth,\n                ...commonLegendProps,\n            });\n    }\n};\n\nexport const getComputedAxisTitles = (\n    inputAxisTitle: string,\n    fields: string[],\n    axisTitleVisibility: 'show' | 'collapsed'\n): string => {\n    if (axisTitleVisibility === 'collapsed') {\n        return '';\n    }\n    let fieldTitle = fields.length > 1 ? '' : fields[0]; // If more than one series (multi-series) default empty title\n    if (!fieldTitle) {\n        fieldTitle = '';\n    }\n    return inputAxisTitle?.length ? inputAxisTitle.trim() : fieldTitle;\n};\n\n/**\n * Truncates Y-axis title based on available container height and font metrics\n * @param axisTitle - The title text to potentially truncate\n * @param containerSpacing - Available height/ width in pixels depending on axis orientation\n * @param fontSize - Font size in pixels (default: 12)\n * @returns Truncated title with ellipsis if needed\n */\nexport const ellipsisAxisTitle = (axisTitle: string, containerSpacing: number, fontSize = 12): string => {\n    if (!axisTitle) {\n        return '';\n    }\n    if (Number.isNaN(containerSpacing) || containerSpacing <= 0) {\n        return axisTitle;\n    }\n    // Calculate available height for text (leave 40% margin)\n    const availableHeight = containerSpacing * 0.6;\n\n    // Use a generic character width ratio that works across most fonts\n    // 0.55 is a reasonable average for most fonts\n    const avgCharWidth = fontSize * 0.55;\n\n    // Calculate maximum characters that fit in available height\n    const maxChars = Math.floor(availableHeight / avgCharWidth);\n\n    // If title fits, return as-is\n    if (axisTitle.length <= maxChars) {\n        return axisTitle;\n    }\n\n    // Need to truncate - use middle ellipsis for better context\n    if (maxChars <= 3) {\n        return '...'; // Not enough space for meaningful text\n    }\n\n    // Reserve 3 characters for ellipsis\n    const availableChars = maxChars - 3;\n    const halfChars = Math.floor(availableChars / 2);\n\n    // Create truncated title with middle ellipsis\n    const start = axisTitle.slice(0, halfChars);\n    const end = axisTitle.slice(-halfChars);\n\n    return `${start}...${end}`;\n};\n\nexport type FieldObject = {\n    name: string;\n};\n\nexport const getFieldName = (field: string | FieldObject): string => {\n    const fieldName = typeof field === 'object' ? (field as unknown as FieldObject)?.name : field;\n    return fieldName;\n};\n\nexport const getFieldNames = (fields: (string | FieldObject)[]): string[] => {\n    return fields.map(field => getFieldName(field));\n};\n\n/**\n * Returns X scale config for viz-canvas charts\n * @param label\n * @returns\n */\nexport const getXScaleConfig = (label: string): ScaleConfig => {\n    const xConfig: ScaleConfig = { x: {} };\n    xConfig.x.label = label;\n    return xConfig;\n};\n\n/**\n * Returns Y scale config for viz-canvas charts\n * @param label\n * @param yAxisAbbreviation\n * @returns\n */\nexport const getYScaleConfig = (\n    label: string,\n    yAxisAbbreviation: string,\n    yAxisScale?: 'linear' | 'log'\n): ScaleConfig => {\n    const scaleType = yAxisScale ?? 'linear';\n    const yConfig: ScaleConfig = { y: {} };\n    yConfig.y.label = label;\n    yConfig.y.type = scaleType;\n    if (yAxisAbbreviation !== 'none') {\n        yConfig.y.tickFmt = (v): string => shortenNumber(v, 1);\n    }\n    if (yAxisAbbreviation === 'none') {\n        yConfig.y.width = 55;\n    } else {\n        yConfig.y.width = label && label.length > 0 ? 30 : 10;\n    }\n    return yConfig;\n};\n/**\n * Returns Y2 scale config for viz-canvas charts\n * @param label\n * @param axisAbbreviation\n * @returns\n */\nexport const getY2ScaleConfig = (\n    label: string,\n    axisAbbreviation: string,\n    axisScale?: 'linear' | 'log',\n    roundAxisLabelsToInteger?: boolean\n): ScaleConfig => {\n    const y2Config: ScaleConfig = { y2: {} };\n    const scaleType = axisScale ?? 'linear';\n    y2Config.y2.label = label;\n    y2Config.y2.side = 'right';\n    y2Config.y2.showGrid = false; // disabled y2 axis gridlines as it is the default, TODO: make this configurable in the future (SCP-71269)\n    y2Config.y2.type = scaleType;\n    if (axisAbbreviation !== 'none') {\n        y2Config.y2.tickFmt = (v): string => shortenNumber(v, 1, roundAxisLabelsToInteger);\n    } else if (roundAxisLabelsToInteger) {\n        y2Config.y2.tickFmt = (v): string =>\n            roundAxisLabelsToInteger ? Math.round(v).toString() : v.toString();\n    }\n    return y2Config;\n};\n\n/**\n * Add series overrides for viz-canvas charts (for eg:- line width)\n */\nexport const getSeriesOverrides = (\n    yfields: string[],\n    y2fields?: string[],\n    lineWidth?: number,\n    overlayFields?: string[],\n    y2Enabled?: boolean,\n    nullValueMode?: 'gaps' | 'connect' | 'zero'\n): SeriesConfig => {\n    const seriesConfig: SeriesConfig = {};\n\n    // Determine spanGaps based on nullValueMode\n    let spanGaps: boolean | undefined;\n    let replaceNullsWithZero: boolean | undefined;\n    if (nullValueMode === 'gaps') {\n        spanGaps = false;\n    } else if (nullValueMode === 'connect' || nullValueMode === 'zero') {\n        spanGaps = true;\n        if (nullValueMode === 'zero') {\n            replaceNullsWithZero = true;\n        }\n    }\n\n    yfields.forEach(field => {\n        seriesConfig[field] = {\n            overrides: { width: lineWidth ?? DEFAULT_LINE_WIDTH },\n        };\n\n        // Add spanGaps if nullValueMode is provided\n        if (spanGaps !== undefined) {\n            seriesConfig[field].overrides.spanGaps = spanGaps;\n        }\n\n        // If y2Enabled is true, determine which fields go to y2 scale\n        if (y2Enabled) {\n            const shouldAssignToY2 =\n                // If y2Fields are present, assign all y2Fields to y2 scale\n                (y2fields?.length > 0 && y2fields.includes(field)) ||\n                // Else, assign all overlayFields to y2 scale\n                ((!y2fields || y2fields.length === 0) && overlayFields?.includes(field));\n\n            if (shouldAssignToY2) {\n                seriesConfig[field].overrides.scale = 'y2';\n            }\n        }\n\n        // If field is in overlayFields, set type to 'line'\n        if (overlayFields?.includes(field)) {\n            seriesConfig[field].type = 'line';\n        }\n\n        // Add replaceNullsWithZero if nullValueMode is 'zero'\n        if (replaceNullsWithZero !== undefined) {\n            seriesConfig[field].replaceNullsWithZero = replaceNullsWithZero;\n        }\n    });\n\n    return seriesConfig;\n};\n"],
+  "mappings": "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",
+  "names": ["defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport", "defaultImport"]
+}