@dynatrace/strato-components 3.0.1 → 3.1.0

package/esm/charts/xy-chart/components/tooltip/HoveredPointTooltip/HoveredPointTooltipHeader.js

@@ -1,90 +1,29 @@
 import { jsx } from "react/jsx-runtime";
-import { getDefaultAction } from "../../../../core/components/series-action/hooks/useDefaultAction.js";
-import { getFormatter } from "../../../../core/utils/get-formatter.js";
-import { safeGet } from "../../../../core/utils/safe-get.js";
+import { buildHoveredPointTooltipHeaderProps } from "./hoveredPointTooltipHeaderUtils.js";
 import { useBarData } from "../../../hooks/useBarData.js";
 import { useXYChartColorScales } from "../../../hooks/useXYChartColorScales.js";
 import { useXYChartData } from "../../../hooks/useXYChartData.js";
 import { useXYChartTruncationMode } from "../../../hooks/useXYChartTruncationMode.js";
-import { buildBarSeriesActionItem } from "../../../utils/build-bar-series-action-item.js";
-import { getColorFromScaleAndData } from "../../../utils/coloring/get-color-from-scale-and-data.js";
-import {
-  isBarTooltipContext,
-  isRectTooltipContext
-} from "../../../utils/type-guards.js";
 import { XYChartTooltipHeader } from "../XYChartTooltipHeader/XYChartTooltipHeader.js";
 function HoveredPointTooltipHeader({
   datapoint,
   series,
   seriesToMetadata
 }) {
-  const { seriesWithDatapoints } = useBarData();
+  const { filteredSeriesWithDatapoints } = useBarData();
   const { datapointMetadataMap } = useXYChartData();
   const colorScaleMap = useXYChartColorScales();
   const { truncationMode } = useXYChartTruncationMode();
-  let content;
-  let valueToDisplay = "";
-  let colorToDisplay = "";
-  let actions;
-  const metadata = safeGet(seriesToMetadata, series);
-  const enrichedDatapoint = {
-    series,
+  const tooltipHeaderProps = buildHoveredPointTooltipHeaderProps({
     datapoint,
-    metadata
-  };
-  if (isRectTooltipContext(enrichedDatapoint)) {
-    const colorScale = safeGet(colorScaleMap, series.id);
-    const datapointMetadata = safeGet(datapointMetadataMap, datapoint);
-    const rawValue = enrichedDatapoint.datapoint.value;
-    const { valueAccessorLabel, valueAccessor, valueFormatter, valueUnit } = enrichedDatapoint.metadata;
-    const tooltipName = valueAccessorLabel ?? valueAccessor ?? "";
-    content = {
-      id: crypto.randomUUID(),
-      name: tooltipName
-    };
-    valueToDisplay = typeof rawValue === "number" ? getFormatter(valueFormatter)(rawValue, valueUnit) : rawValue?.toString() ?? "";
-    colorToDisplay = rawValue !== void 0 ? getColorFromScaleAndData(
-      colorScale,
-      enrichedDatapoint.datapoint.value,
-      datapointMetadata.colorOverride
-    ) ?? "" : "";
-    const metadataActions = enrichedDatapoint.metadata.actions;
-    actions = metadataActions ? () => metadataActions(enrichedDatapoint.datapoint) : void 0;
-  } else if (isBarTooltipContext(enrichedDatapoint)) {
-    const { color, name } = metadata;
-    content = {
-      id: crypto.randomUUID(),
-      name: name ?? ""
-    };
-    colorToDisplay = color?.Default ?? "";
-    const metadataActions = enrichedDatapoint.metadata.actions;
-    actions = metadataActions ? () => {
-      const actionItem = buildBarSeriesActionItem({
-        datapoint: enrichedDatapoint.datapoint,
-        allBarSeries: seriesWithDatapoints,
-        seriesToMetadata,
-        datapointMetadataMap,
-        currentSeries: enrichedDatapoint.series
-      });
-      return metadataActions(actionItem);
-    } : void 0;
-  } else {
-    content = {
-      id: crypto.randomUUID(),
-      name: ""
-    };
-  }
-  return /* @__PURE__ */ jsx(
-    XYChartTooltipHeader,
-    {
-      color: colorToDisplay,
-      name: content.name,
-      value: valueToDisplay,
-      actions,
-      defaultActions: getDefaultAction(content),
-      truncationMode
-    }
-  );
+    series,
+    seriesToMetadata,
+    seriesWithDatapoints: filteredSeriesWithDatapoints,
+    datapointMetadataMap,
+    colorScaleMap,
+    truncationMode
+  });
+  return /* @__PURE__ */ jsx(XYChartTooltipHeader, { ...tooltipHeaderProps });
 }
 HoveredPointTooltipHeader.displayName = "HoveredPointTooltipHeader";
 export {

package/esm/charts/xy-chart/components/tooltip/HoveredPointTooltip/HoveredPointTooltipHeader.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/tooltip/HoveredPointTooltip/HoveredPointTooltipHeader.tsx"],
-  "sourcesContent": ["import { getDefaultAction } from '../../../../core/components/series-action/hooks/useDefaultAction.js';\nimport type { SeriesActionsTemplate } from '../../../../core/types/series-actions-template.js';\nimport { getFormatter } from '../../../../core/utils/get-formatter.js';\nimport { safeGet } from '../../../../core/utils/safe-get.js';\nimport { useBarData } from '../../../hooks/useBarData.js';\nimport { useXYChartColorScales } from '../../../hooks/useXYChartColorScales.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartTruncationMode } from '../../../hooks/useXYChartTruncationMode.js';\nimport type {\n  BarMetadata,\n  BarSeriesToMetadata,\n  BarSeriesWithDatapoints,\n  RectDatapointInternal,\n} from '../../../types/xy-chart-internals.js';\nimport type { BarDatapoint } from '../../../types/xy-chart.js';\nimport { buildBarSeriesActionItem } from '../../../utils/build-bar-series-action-item.js';\nimport { getColorFromScaleAndData } from '../../../utils/coloring/get-color-from-scale-and-data.js';\nimport {\n  type Datapoint,\n  isBarTooltipContext,\n  isRectTooltipContext,\n  type Series,\n  type SeriesToMetadata,\n  type TooltipContext,\n} from '../../../utils/type-guards.js';\nimport { XYChartTooltipHeader } from '../XYChartTooltipHeader/XYChartTooltipHeader.js';\n\ntype TooltipContent = {\n  id: string;\n  name: string;\n};\n\nexport interface HoveredPointTooltipHeaderProps<\n  T extends Series,\n  K extends Datapoint<T>,\n> {\n  datapoint: K;\n  series: T;\n  seriesToMetadata: SeriesToMetadata<T>;\n}\n\nexport function HoveredPointTooltipHeader<\n  T extends Series,\n  K extends T extends BarSeriesWithDatapoints\n    ? BarDatapoint\n    : RectDatapointInternal,\n>({\n  datapoint,\n  series,\n  seriesToMetadata,\n}: Readonly<HoveredPointTooltipHeaderProps<T, K>>) {\n  const { seriesWithDatapoints } = useBarData();\n  const { datapointMetadataMap } = useXYChartData();\n  const colorScaleMap = useXYChartColorScales();\n  const { truncationMode } = useXYChartTruncationMode();\n\n  let content: TooltipContent;\n  let valueToDisplay = '';\n  let colorToDisplay = '';\n  let actions: (() => SeriesActionsTemplate) | undefined;\n\n  const metadata = safeGet(seriesToMetadata, series);\n\n  const enrichedDatapoint: TooltipContext = {\n    series,\n    datapoint,\n    metadata: metadata,\n  };\n\n  if (isRectTooltipContext(enrichedDatapoint)) {\n    const colorScale = safeGet(colorScaleMap, series.id);\n    const datapointMetadata = safeGet(datapointMetadataMap, datapoint);\n    const rawValue = enrichedDatapoint.datapoint.value;\n    const { valueAccessorLabel, valueAccessor, valueFormatter, valueUnit } =\n      enrichedDatapoint.metadata;\n\n    const tooltipName = valueAccessorLabel ?? valueAccessor ?? '';\n    content = {\n      id: crypto.randomUUID(),\n      name: tooltipName,\n    };\n\n    valueToDisplay =\n      typeof rawValue === 'number'\n        ? getFormatter(valueFormatter)(rawValue, valueUnit)\n        : rawValue?.toString() ?? '';\n\n    colorToDisplay =\n      rawValue !== undefined\n        ? getColorFromScaleAndData(\n            colorScale,\n            enrichedDatapoint.datapoint.value,\n            datapointMetadata.colorOverride,\n          ) ?? ''\n        : '';\n\n    const metadataActions = enrichedDatapoint.metadata.actions;\n\n    actions = metadataActions\n      ? () => metadataActions(enrichedDatapoint.datapoint)\n      : undefined;\n  } else if (isBarTooltipContext(enrichedDatapoint)) {\n    const { color, name } = metadata as BarMetadata;\n\n    content = {\n      id: crypto.randomUUID(),\n      name: name ?? '',\n    };\n\n    colorToDisplay = color?.Default ?? '';\n\n    const metadataActions = enrichedDatapoint.metadata.actions;\n    actions = metadataActions\n      ? () => {\n          const actionItem = buildBarSeriesActionItem({\n            datapoint: enrichedDatapoint.datapoint,\n            allBarSeries: seriesWithDatapoints,\n            seriesToMetadata:\n              seriesToMetadata as unknown as BarSeriesToMetadata,\n            datapointMetadataMap,\n            currentSeries: enrichedDatapoint.series,\n          });\n          return metadataActions(actionItem);\n        }\n      : undefined;\n  } else {\n    content = {\n      id: crypto.randomUUID(),\n      name: '',\n    };\n  }\n\n  return (\n    <XYChartTooltipHeader\n      color={colorToDisplay}\n      name={content.name}\n      value={valueToDisplay}\n      actions={actions}\n      defaultActions={getDefaultAction(content)}\n      truncationMode={truncationMode}\n    />\n  );\n}\n\nHoveredPointTooltipHeader.displayName = 'HoveredPointTooltipHeader';\n"],
-  "mappings": "AAqII;AArIJ,SAAS,wBAAwB;AAEjC,SAAS,oBAAoB;AAC7B,SAAS,eAAe;AACxB,SAAS,kBAAkB;AAC3B,SAAS,6BAA6B;AACtC,SAAS,sBAAsB;AAC/B,SAAS,gCAAgC;AAQzC,SAAS,gCAAgC;AACzC,SAAS,gCAAgC;AACzC;AAAA,EAEE;AAAA,EACA;AAAA,OAIK;AACP,SAAS,4BAA4B;AAgB9B,SAAS,0BAKd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAmD;AACjD,QAAM,EAAE,qBAAqB,IAAI,WAAW;AAC5C,QAAM,EAAE,qBAAqB,IAAI,eAAe;AAChD,QAAM,gBAAgB,sBAAsB;AAC5C,QAAM,EAAE,eAAe,IAAI,yBAAyB;AAEpD,MAAI;AACJ,MAAI,iBAAiB;AACrB,MAAI,iBAAiB;AACrB,MAAI;AAEJ,QAAM,WAAW,QAAQ,kBAAkB,MAAM;AAEjD,QAAM,oBAAoC;AAAA,IACxC;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,MAAI,qBAAqB,iBAAiB,GAAG;AAC3C,UAAM,aAAa,QAAQ,eAAe,OAAO,EAAE;AACnD,UAAM,oBAAoB,QAAQ,sBAAsB,SAAS;AACjE,UAAM,WAAW,kBAAkB,UAAU;AAC7C,UAAM,EAAE,oBAAoB,eAAe,gBAAgB,UAAU,IACnE,kBAAkB;AAEpB,UAAM,cAAc,sBAAsB,iBAAiB;AAC3D,cAAU;AAAA,MACR,IAAI,OAAO,WAAW;AAAA,MACtB,MAAM;AAAA,IACR;AAEA,qBACE,OAAO,aAAa,WAChB,aAAa,cAAc,EAAE,UAAU,SAAS,IAChD,UAAU,SAAS,KAAK;AAE9B,qBACE,aAAa,SACT;AAAA,MACE;AAAA,MACA,kBAAkB,UAAU;AAAA,MAC5B,kBAAkB;AAAA,IACpB,KAAK,KACL;AAEN,UAAM,kBAAkB,kBAAkB,SAAS;AAEnD,cAAU,kBACN,MAAM,gBAAgB,kBAAkB,SAAS,IACjD;AAAA,EACN,WAAW,oBAAoB,iBAAiB,GAAG;AACjD,UAAM,EAAE,OAAO,KAAK,IAAI;AAExB,cAAU;AAAA,MACR,IAAI,OAAO,WAAW;AAAA,MACtB,MAAM,QAAQ;AAAA,IAChB;AAEA,qBAAiB,OAAO,WAAW;AAEnC,UAAM,kBAAkB,kBAAkB,SAAS;AACnD,cAAU,kBACN,MAAM;AACJ,YAAM,aAAa,yBAAyB;AAAA,QAC1C,WAAW,kBAAkB;AAAA,QAC7B,cAAc;AAAA,QACd;AAAA,QAEA;AAAA,QACA,eAAe,kBAAkB;AAAA,MACnC,CAAC;AACD,aAAO,gBAAgB,UAAU;AAAA,IACnC,IACA;AAAA,EACN,OAAO;AACL,cAAU;AAAA,MACR,IAAI,OAAO,WAAW;AAAA,MACtB,MAAM;AAAA,IACR;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,MAAM,QAAQ;AAAA,MACd,OAAO;AAAA,MACP;AAAA,MACA,gBAAgB,iBAAiB,OAAO;AAAA,MACxC;AAAA;AAAA,EACF;AAEJ;AAEA,0BAA0B,cAAc;",
+  "sourcesContent": ["import { buildHoveredPointTooltipHeaderProps } from './hoveredPointTooltipHeaderUtils.js';\nimport { useBarData } from '../../../hooks/useBarData.js';\nimport { useXYChartColorScales } from '../../../hooks/useXYChartColorScales.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartTruncationMode } from '../../../hooks/useXYChartTruncationMode.js';\nimport type {\n  BarSeriesWithDatapoints,\n  RectDatapointInternal,\n} from '../../../types/xy-chart-internals.js';\nimport type { BarDatapoint } from '../../../types/xy-chart.js';\nimport {\n  type HoveredDatapoint,\n  type HoveredSeries,\n  type HoveredSeriesToMetadata,\n} from '../../../utils/type-guards.js';\nimport { XYChartTooltipHeader } from '../XYChartTooltipHeader/XYChartTooltipHeader.js';\n\nexport interface HoveredPointTooltipHeaderProps<\n  T extends HoveredSeries,\n  K extends HoveredDatapoint<T>,\n> {\n  datapoint: K;\n  series: T;\n  seriesToMetadata: HoveredSeriesToMetadata<T>;\n}\n\nexport function HoveredPointTooltipHeader<\n  T extends HoveredSeries,\n  K extends T extends BarSeriesWithDatapoints\n    ? BarDatapoint\n    : RectDatapointInternal,\n>({\n  datapoint,\n  series,\n  seriesToMetadata,\n}: Readonly<HoveredPointTooltipHeaderProps<T, K>>) {\n  const { filteredSeriesWithDatapoints } = useBarData();\n  const { datapointMetadataMap } = useXYChartData();\n  const colorScaleMap = useXYChartColorScales();\n  const { truncationMode } = useXYChartTruncationMode();\n\n  const tooltipHeaderProps = buildHoveredPointTooltipHeaderProps({\n    datapoint,\n    series,\n    seriesToMetadata,\n    seriesWithDatapoints: filteredSeriesWithDatapoints,\n    datapointMetadataMap,\n    colorScaleMap,\n    truncationMode,\n  });\n\n  return <XYChartTooltipHeader {...tooltipHeaderProps} />;\n}\n\nHoveredPointTooltipHeader.displayName = 'HoveredPointTooltipHeader';\n"],
+  "mappings": "AAmDS;AAnDT,SAAS,2CAA2C;AACpD,SAAS,kBAAkB;AAC3B,SAAS,6BAA6B;AACtC,SAAS,sBAAsB;AAC/B,SAAS,gCAAgC;AAWzC,SAAS,4BAA4B;AAW9B,SAAS,0BAKd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAmD;AACjD,QAAM,EAAE,6BAA6B,IAAI,WAAW;AACpD,QAAM,EAAE,qBAAqB,IAAI,eAAe;AAChD,QAAM,gBAAgB,sBAAsB;AAC5C,QAAM,EAAE,eAAe,IAAI,yBAAyB;AAEpD,QAAM,qBAAqB,oCAAoC;AAAA,IAC7D;AAAA,IACA;AAAA,IACA;AAAA,IACA,sBAAsB;AAAA,IACtB;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO,oBAAC,wBAAsB,GAAG,oBAAoB;AACvD;AAEA,0BAA0B,cAAc;",
   "names": []
 }

package/esm/charts/xy-chart/components/tooltip/HoveredPointTooltip/hooks/{useHoveredPointTooltipHeaderContent.js → getHoveredPointTooltipBodyContent.js}

@@ -1,4 +1,3 @@
-import { useIntl } from "react-intl";
 import { formatResolution } from "../../../../../core/components/tooltip/utils/resolution-formatter.js";
 import { XYCHART_MESSAGES } from "../../../../messages/messages.js";
 import {
@@ -6,8 +5,7 @@ import {
   isNumericalToolTip,
   isTimeTooltip
 } from "../../../../utils/type-guards.js";
-function useHoveredPointTooltipHeaderContent(v0, v1, formatter, toPercentage) {
-  const intl = useIntl();
+function getHoveredPointTooltipBodyContent(intl, v0, v1, formatter, toPercentage) {
   const separator = intl.formatMessage(XYCHART_MESSAGES.separatorDash);
   let duration;
   let text = "";
@@ -46,6 +44,6 @@ function useHoveredPointTooltipHeaderContent(v0, v1, formatter, toPercentage) {
   return { duration, text };
 }
 export {
-  useHoveredPointTooltipHeaderContent
+  getHoveredPointTooltipBodyContent
 };
-//# sourceMappingURL=useHoveredPointTooltipHeaderContent.js.map
+//# sourceMappingURL=getHoveredPointTooltipBodyContent.js.map

package/esm/charts/xy-chart/components/tooltip/HoveredPointTooltip/hooks/getHoveredPointTooltipBodyContent.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/charts/xy-chart/components/tooltip/HoveredPointTooltip/hooks/getHoveredPointTooltipBodyContent.ts"],
+  "sourcesContent": ["import type { IntlShape } from 'react-intl';\n\nimport { formatResolution } from '../../../../../core/components/tooltip/utils/resolution-formatter.js';\nimport type {\n  FormatterWithPrecision,\n  TimeFrameFormatter,\n} from '../../../../../core/types/formatter.js';\nimport { XYCHART_MESSAGES } from '../../../../messages/messages.js';\nimport type { XYAccessorDataTypes } from '../../../../types/xy-chart.js';\nimport {\n  isCategoricalTooltip,\n  isNumericalToolTip,\n  isTimeTooltip,\n} from '../../../../utils/type-guards.js';\n\n/**\n * Pure function that formats tooltip header content.\n * This can be called from non-React contexts (like utility functions).\n */\nexport function getHoveredPointTooltipBodyContent(\n  intl: IntlShape,\n  v0?: XYAccessorDataTypes | undefined,\n  v1?: XYAccessorDataTypes | undefined,\n  formatter?: FormatterWithPrecision | TimeFrameFormatter,\n  toPercentage?: (value: number) => number,\n) {\n  const separator = intl.formatMessage(XYCHART_MESSAGES.separatorDash);\n\n  let duration: string | undefined;\n  let text = '';\n\n  const primaryValue = v0 ?? v1;\n  const secondaryValue = v0 !== undefined && v1 !== undefined ? v1 : undefined;\n\n  if (primaryValue === undefined) {\n    return { duration, text };\n  }\n\n  const args = {\n    formatter,\n    v0: primaryValue,\n    v1: secondaryValue,\n  };\n\n  if (isCategoricalTooltip(args)) {\n    const startText = String(args.v0);\n    const endText = args.v1 !== undefined ? String(args.v1) : startText;\n\n    text =\n      args.v1 !== undefined\n        ? `${startText} ${separator} ${endText}`\n        : startText;\n\n    return { duration, text };\n  }\n\n  if (isNumericalToolTip(args) && formatter) {\n    const format = formatter as FormatterWithPrecision;\n    const formattedStart = `${format(args.v0 as number)}${\n      toPercentage ? ' (' + toPercentage(args.v0) + '%)' : ''\n    }`;\n    const formattedEnd =\n      args.v1 !== undefined\n        ? `${format(args.v1 as number)}${\n            toPercentage ? ' (' + toPercentage(args.v1) + '%)' : ''\n          }`\n        : formattedStart;\n\n    text =\n      args.v1 !== undefined\n        ? `${formattedStart} ${separator} ${formattedEnd}`\n        : formattedStart;\n\n    return { duration, text };\n  }\n\n  if (isTimeTooltip(args) && formatter) {\n    const format = formatter as TimeFrameFormatter;\n\n    if (args.v0 instanceof Date) {\n      text = format(args.v0, args.v1 instanceof Date ? args.v1 : undefined);\n\n      if (args.v1 instanceof Date) {\n        duration = formatResolution(args.v0, args.v1);\n      }\n    }\n  }\n\n  return { duration, text };\n}\n"],
+  "mappings": "AAEA,SAAS,wBAAwB;AAKjC,SAAS,wBAAwB;AAEjC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAMA,SAAS,kCACd,MACA,IACA,IACA,WACA,cACA;AACA,QAAM,YAAY,KAAK,cAAc,iBAAiB,aAAa;AAEnE,MAAI;AACJ,MAAI,OAAO;AAEX,QAAM,eAAe,MAAM;AAC3B,QAAM,iBAAiB,OAAO,UAAa,OAAO,SAAY,KAAK;AAEnE,MAAI,iBAAiB,QAAW;AAC9B,WAAO,EAAE,UAAU,KAAK;AAAA,EAC1B;AAEA,QAAM,OAAO;AAAA,IACX;AAAA,IACA,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,MAAI,qBAAqB,IAAI,GAAG;AAC9B,UAAM,YAAY,OAAO,KAAK,EAAE;AAChC,UAAM,UAAU,KAAK,OAAO,SAAY,OAAO,KAAK,EAAE,IAAI;AAE1D,WACE,KAAK,OAAO,SACR,GAAG,SAAS,IAAI,SAAS,IAAI,OAAO,KACpC;AAEN,WAAO,EAAE,UAAU,KAAK;AAAA,EAC1B;AAEA,MAAI,mBAAmB,IAAI,KAAK,WAAW;AACzC,UAAM,SAAS;AACf,UAAM,iBAAiB,GAAG,OAAO,KAAK,EAAY,CAAC,GACjD,eAAe,OAAO,aAAa,KAAK,EAAE,IAAI,OAAO,EACvD;AACA,UAAM,eACJ,KAAK,OAAO,SACR,GAAG,OAAO,KAAK,EAAY,CAAC,GAC1B,eAAe,OAAO,aAAa,KAAK,EAAE,IAAI,OAAO,EACvD,KACA;AAEN,WACE,KAAK,OAAO,SACR,GAAG,cAAc,IAAI,SAAS,IAAI,YAAY,KAC9C;AAEN,WAAO,EAAE,UAAU,KAAK;AAAA,EAC1B;AAEA,MAAI,cAAc,IAAI,KAAK,WAAW;AACpC,UAAM,SAAS;AAEf,QAAI,KAAK,cAAc,MAAM;AAC3B,aAAO,OAAO,KAAK,IAAI,KAAK,cAAc,OAAO,KAAK,KAAK,MAAS;AAEpE,UAAI,KAAK,cAAc,MAAM;AAC3B,mBAAW,iBAAiB,KAAK,IAAI,KAAK,EAAE;AAAA,MAC9C;AAAA,IACF;AAAA,EACF;AAEA,SAAO,EAAE,UAAU,KAAK;AAC1B;",
+  "names": []
+}

package/esm/charts/xy-chart/components/tooltip/HoveredPointTooltip/hoveredPointTooltipBodyUtils.js

@@ -0,0 +1,55 @@
+import { safeGet } from "../../../../core/utils/safe-get.js";
+import { getRelativeAccessor } from "../../../utils/value-representation.js";
+import { getTooltipFormatter } from "../utils/get-tooltip-formatter.js";
+import { getHoveredPointTooltipBodyContent } from "./hooks/getHoveredPointTooltipBodyContent.js";
+const buildHoveredPointTooltipBodyProps = ({
+  datapoint,
+  series,
+  seriesToMetadata,
+  axisIdToFormatter,
+  axisIdToScaleDomain,
+  datapointMetadataMap,
+  intl
+}) => {
+  const { xAxis, yAxis } = safeGet(seriesToMetadata, series);
+  const xFormatter = getTooltipFormatter(xAxis, axisIdToFormatter, intl);
+  const yFormatter = getTooltipFormatter(yAxis, axisIdToFormatter, intl);
+  const datapointMetadata = datapointMetadataMap.get(datapoint);
+  const binDomain = datapointMetadata?.binDomain;
+  const isRelative = typeof binDomain === "number" && binDomain;
+  const yDomain = isRelative && datapointMetadata?.baseline === "y" ? {
+    min: binDomain * -1,
+    max: binDomain
+  } : safeGet(axisIdToScaleDomain, xAxis.id);
+  const xDomain = isRelative && datapointMetadata?.baseline === "x" ? {
+    min: binDomain * -1,
+    max: binDomain
+  } : safeGet(axisIdToScaleDomain, yAxis.id);
+  const { x0, x1, y0, y1 } = datapoint;
+  const { text: textX, duration: durationX } = getHoveredPointTooltipBodyContent(
+    intl,
+    x0,
+    x1,
+    xFormatter,
+    getRelativeAccessor(xAxis, yDomain)
+  );
+  const { text: textY, duration: durationY } = getHoveredPointTooltipBodyContent(
+    intl,
+    y0,
+    y1,
+    yFormatter,
+    getRelativeAccessor(yAxis, xDomain)
+  );
+  return {
+    xAxisLabel: xAxis.label,
+    yAxisLabel: yAxis.label,
+    xAxisValue: textX,
+    yAxisValue: textY,
+    xAxisDuration: durationX,
+    yAxisDuration: durationY
+  };
+};
+export {
+  buildHoveredPointTooltipBodyProps
+};
+//# sourceMappingURL=hoveredPointTooltipBodyUtils.js.map

package/esm/charts/xy-chart/components/tooltip/HoveredPointTooltip/hoveredPointTooltipBodyUtils.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../src/charts/xy-chart/components/tooltip/HoveredPointTooltip/hoveredPointTooltipBodyUtils.ts"],
+  "sourcesContent": ["import type { IntlShape } from 'react-intl';\n\nimport type { MinMax } from '../../../../core/types/min-max.js';\nimport { safeGet } from '../../../../core/utils/safe-get.js';\nimport type {\n  AxisIdToFormatter,\n  AxisIdToScaleDomain,\n  MapDatapoints,\n} from '../../../types/xy-chart-internals.js';\nimport type {\n  HoveredDatapoint,\n  HoveredSeries,\n  HoveredSeriesToMetadata,\n} from '../../../utils/type-guards.js';\nimport { getRelativeAccessor } from '../../../utils/value-representation.js';\nimport { getTooltipFormatter } from '../utils/get-tooltip-formatter.js';\nimport type { XYChartTooltipBodyProps } from '../XYChartTooltipBody/XYChartTooltipBody.js';\nimport { getHoveredPointTooltipBodyContent } from './hooks/getHoveredPointTooltipBodyContent.js';\n\nexport interface BuildHoveredPointTooltipBodyPropsArgs<\n  T extends HoveredSeries,\n  K extends HoveredDatapoint<T>,\n> {\n  datapoint: K;\n  series: T;\n  seriesToMetadata: HoveredSeriesToMetadata<T>;\n  axisIdToFormatter: AxisIdToFormatter;\n  axisIdToScaleDomain: AxisIdToScaleDomain;\n  datapointMetadataMap: MapDatapoints;\n  intl: IntlShape;\n}\n\nexport const buildHoveredPointTooltipBodyProps = <\n  T extends HoveredSeries,\n  K extends HoveredDatapoint<T>,\n>({\n  datapoint,\n  series,\n  seriesToMetadata,\n  axisIdToFormatter,\n  axisIdToScaleDomain,\n  datapointMetadataMap,\n  intl,\n}: BuildHoveredPointTooltipBodyPropsArgs<T, K>): XYChartTooltipBodyProps => {\n  const { xAxis, yAxis } = safeGet(seriesToMetadata, series);\n\n  const xFormatter = getTooltipFormatter(xAxis, axisIdToFormatter, intl);\n  const yFormatter = getTooltipFormatter(yAxis, axisIdToFormatter, intl);\n  const datapointMetadata = datapointMetadataMap.get(datapoint);\n  const binDomain = datapointMetadata?.binDomain;\n\n  const isRelative = typeof binDomain === 'number' && binDomain;\n\n  const yDomain =\n    isRelative && datapointMetadata?.baseline === 'y'\n      ? {\n          min: binDomain * -1,\n          max: binDomain,\n        }\n      : (safeGet(axisIdToScaleDomain, xAxis.id) as MinMax);\n\n  const xDomain =\n    isRelative && datapointMetadata?.baseline === 'x'\n      ? {\n          min: binDomain * -1,\n          max: binDomain,\n        }\n      : (safeGet(axisIdToScaleDomain, yAxis.id) as MinMax);\n\n  const { x0, x1, y0, y1 } = datapoint;\n  const { text: textX, duration: durationX } =\n    getHoveredPointTooltipBodyContent(\n      intl,\n      x0,\n      x1,\n      xFormatter,\n      getRelativeAccessor(xAxis, yDomain),\n    );\n\n  const { text: textY, duration: durationY } =\n    getHoveredPointTooltipBodyContent(\n      intl,\n      y0,\n      y1,\n      yFormatter,\n      getRelativeAccessor(yAxis, xDomain),\n    );\n\n  return {\n    xAxisLabel: xAxis.label,\n    yAxisLabel: yAxis.label,\n    xAxisValue: textX,\n    yAxisValue: textY,\n    xAxisDuration: durationX,\n    yAxisDuration: durationY,\n  };\n};\n"],
+  "mappings": "AAGA,SAAS,eAAe;AAWxB,SAAS,2BAA2B;AACpC,SAAS,2BAA2B;AAEpC,SAAS,yCAAyC;AAe3C,MAAM,oCAAoC,CAG/C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA4E;AAC1E,QAAM,EAAE,OAAO,MAAM,IAAI,QAAQ,kBAAkB,MAAM;AAEzD,QAAM,aAAa,oBAAoB,OAAO,mBAAmB,IAAI;AACrE,QAAM,aAAa,oBAAoB,OAAO,mBAAmB,IAAI;AACrE,QAAM,oBAAoB,qBAAqB,IAAI,SAAS;AAC5D,QAAM,YAAY,mBAAmB;AAErC,QAAM,aAAa,OAAO,cAAc,YAAY;AAEpD,QAAM,UACJ,cAAc,mBAAmB,aAAa,MAC1C;AAAA,IACE,KAAK,YAAY;AAAA,IACjB,KAAK;AAAA,EACP,IACC,QAAQ,qBAAqB,MAAM,EAAE;AAE5C,QAAM,UACJ,cAAc,mBAAmB,aAAa,MAC1C;AAAA,IACE,KAAK,YAAY;AAAA,IACjB,KAAK;AAAA,EACP,IACC,QAAQ,qBAAqB,MAAM,EAAE;AAE5C,QAAM,EAAE,IAAI,IAAI,IAAI,GAAG,IAAI;AAC3B,QAAM,EAAE,MAAM,OAAO,UAAU,UAAU,IACvC;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,oBAAoB,OAAO,OAAO;AAAA,EACpC;AAEF,QAAM,EAAE,MAAM,OAAO,UAAU,UAAU,IACvC;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,oBAAoB,OAAO,OAAO;AAAA,EACpC;AAEF,SAAO;AAAA,IACL,YAAY,MAAM;AAAA,IAClB,YAAY,MAAM;AAAA,IAClB,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,eAAe;AAAA,EACjB;AACF;",
+  "names": []
+}

package/esm/charts/xy-chart/components/tooltip/HoveredPointTooltip/hoveredPointTooltipHeaderUtils.js

@@ -0,0 +1,84 @@
+import { getDefaultAction } from "../../../../core/components/series-action/hooks/useDefaultAction.js";
+import { getFormatter } from "../../../../core/utils/get-formatter.js";
+import { safeGet } from "../../../../core/utils/safe-get.js";
+import { buildBarSeriesActionItem } from "../../../utils/build-series-action-item.js";
+import { getColorFromScaleAndData } from "../../../utils/coloring/get-color-from-scale-and-data.js";
+import {
+  isBarTooltipContext,
+  isRectTooltipContext
+} from "../../../utils/type-guards.js";
+const buildHoveredPointTooltipHeaderProps = ({
+  datapoint,
+  series,
+  seriesToMetadata,
+  seriesWithDatapoints,
+  datapointMetadataMap,
+  colorScaleMap,
+  truncationMode,
+  idFactory = () => crypto.randomUUID()
+}) => {
+  let content;
+  let valueToDisplay = "";
+  let colorToDisplay = "";
+  let actions;
+  const metadata = safeGet(seriesToMetadata, series);
+  const enrichedDatapoint = {
+    series,
+    datapoint,
+    metadata
+  };
+  if (isRectTooltipContext(enrichedDatapoint)) {
+    const colorScale = safeGet(colorScaleMap, series.id);
+    const datapointMetadata = safeGet(datapointMetadataMap, datapoint);
+    const rawValue = enrichedDatapoint.datapoint.value;
+    const { valueAccessorLabel, valueAccessor, valueFormatter, valueUnit } = enrichedDatapoint.metadata;
+    const tooltipName = valueAccessorLabel ?? valueAccessor ?? "";
+    content = {
+      id: idFactory(),
+      name: tooltipName
+    };
+    valueToDisplay = typeof rawValue === "number" ? getFormatter(valueFormatter)(rawValue, valueUnit) : rawValue?.toString() ?? "";
+    colorToDisplay = rawValue !== void 0 ? getColorFromScaleAndData(
+      colorScale,
+      enrichedDatapoint.datapoint.value,
+      datapointMetadata.colorOverride
+    ) ?? "" : "";
+    const metadataActions = enrichedDatapoint.metadata.actions;
+    actions = metadataActions ? () => metadataActions(enrichedDatapoint.datapoint) : void 0;
+  } else if (isBarTooltipContext(enrichedDatapoint)) {
+    const { color, name } = metadata;
+    content = {
+      id: idFactory(),
+      name: name ?? ""
+    };
+    colorToDisplay = color?.Default ?? "";
+    const metadataActions = enrichedDatapoint.metadata.actions;
+    actions = metadataActions ? () => {
+      const actionItem = buildBarSeriesActionItem({
+        datapoint: enrichedDatapoint.datapoint,
+        allSeries: seriesWithDatapoints,
+        seriesToMetadata,
+        datapointMetadataMap,
+        currentSeries: enrichedDatapoint.series
+      });
+      return metadataActions(actionItem);
+    } : void 0;
+  } else {
+    content = {
+      id: idFactory(),
+      name: ""
+    };
+  }
+  return {
+    color: colorToDisplay,
+    name: content.name,
+    value: valueToDisplay,
+    actions,
+    defaultActions: getDefaultAction(content),
+    truncationMode
+  };
+};
+export {
+  buildHoveredPointTooltipHeaderProps
+};
+//# sourceMappingURL=hoveredPointTooltipHeaderUtils.js.map

package/esm/charts/xy-chart/components/tooltip/HoveredPointTooltip/hoveredPointTooltipHeaderUtils.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../src/charts/xy-chart/components/tooltip/HoveredPointTooltip/hoveredPointTooltipHeaderUtils.ts"],
+  "sourcesContent": ["import { getDefaultAction } from '../../../../core/components/series-action/hooks/useDefaultAction.js';\nimport type { SeriesActionsTemplate } from '../../../../core/types/series-actions-template.js';\nimport { getFormatter } from '../../../../core/utils/get-formatter.js';\nimport { safeGet } from '../../../../core/utils/safe-get.js';\nimport type { SeriesIdToColorScale } from '../../../context/XYChartColorScales.context.js';\nimport type {\n  BarMetadata,\n  BarSeriesToMetadata,\n  BarSeriesWithDatapoints,\n  RectDatapointInternal,\n  MapDatapoints,\n} from '../../../types/xy-chart-internals.js';\nimport type { BarDatapoint } from '../../../types/xy-chart.js';\nimport { buildBarSeriesActionItem } from '../../../utils/build-series-action-item.js';\nimport { getColorFromScaleAndData } from '../../../utils/coloring/get-color-from-scale-and-data.js';\nimport {\n  type HoveredDatapoint,\n  type HoveredSeries,\n  isBarTooltipContext,\n  isRectTooltipContext,\n  type HoveredSeriesToMetadata,\n  type TooltipContextHoveredPoints,\n} from '../../../utils/type-guards.js';\nimport type { XYChartTooltipHeaderProps } from '../XYChartTooltipHeader/XYChartTooltipHeader.js';\n\nexport interface BuildHoveredPointTooltipHeaderPropsArgs<\n  T extends HoveredSeries,\n  K extends HoveredDatapoint<T>,\n> {\n  datapoint: K;\n  series: T;\n  seriesToMetadata: HoveredSeriesToMetadata<T>;\n  seriesWithDatapoints: BarSeriesWithDatapoints[];\n  datapointMetadataMap: MapDatapoints;\n  colorScaleMap: SeriesIdToColorScale;\n  truncationMode?: XYChartTooltipHeaderProps['truncationMode'];\n  idFactory?: () => string;\n}\n\ntype TooltipContent = {\n  id: string;\n  name: string;\n};\n\nexport const buildHoveredPointTooltipHeaderProps = <\n  T extends HoveredSeries,\n  K extends T extends BarSeriesWithDatapoints\n    ? BarDatapoint\n    : RectDatapointInternal,\n>({\n  datapoint,\n  series,\n  seriesToMetadata,\n  seriesWithDatapoints,\n  datapointMetadataMap,\n  colorScaleMap,\n  truncationMode,\n  idFactory = () => crypto.randomUUID(),\n}: BuildHoveredPointTooltipHeaderPropsArgs<\n  T,\n  K\n>): XYChartTooltipHeaderProps => {\n  let content: TooltipContent;\n  let valueToDisplay = '';\n  let colorToDisplay = '';\n  let actions: (() => SeriesActionsTemplate) | undefined;\n\n  const metadata = safeGet(seriesToMetadata, series);\n\n  const enrichedDatapoint: TooltipContextHoveredPoints = {\n    series,\n    datapoint,\n    metadata: metadata,\n  };\n\n  if (isRectTooltipContext(enrichedDatapoint)) {\n    const colorScale = safeGet(colorScaleMap, series.id);\n    const datapointMetadata = safeGet(datapointMetadataMap, datapoint);\n    const rawValue = enrichedDatapoint.datapoint.value;\n    const { valueAccessorLabel, valueAccessor, valueFormatter, valueUnit } =\n      enrichedDatapoint.metadata;\n\n    const tooltipName = valueAccessorLabel ?? valueAccessor ?? '';\n    content = {\n      id: idFactory(),\n      name: tooltipName,\n    };\n\n    valueToDisplay =\n      typeof rawValue === 'number'\n        ? getFormatter(valueFormatter)(rawValue, valueUnit)\n        : rawValue?.toString() ?? '';\n\n    colorToDisplay =\n      rawValue !== undefined\n        ? getColorFromScaleAndData(\n            colorScale,\n            enrichedDatapoint.datapoint.value,\n            datapointMetadata.colorOverride,\n          ) ?? ''\n        : '';\n\n    const metadataActions = enrichedDatapoint.metadata.actions;\n\n    actions = metadataActions\n      ? () => metadataActions(enrichedDatapoint.datapoint)\n      : undefined;\n  } else if (isBarTooltipContext(enrichedDatapoint)) {\n    const { color, name } = metadata as BarMetadata;\n\n    content = {\n      id: idFactory(),\n      name: name ?? '',\n    };\n\n    colorToDisplay = color?.Default ?? '';\n\n    const metadataActions = enrichedDatapoint.metadata.actions;\n    actions = metadataActions\n      ? () => {\n          const actionItem = buildBarSeriesActionItem({\n            datapoint: enrichedDatapoint.datapoint,\n            allSeries: seriesWithDatapoints,\n            seriesToMetadata:\n              seriesToMetadata as unknown as BarSeriesToMetadata,\n            datapointMetadataMap,\n            currentSeries: enrichedDatapoint.series,\n          });\n          return metadataActions(actionItem);\n        }\n      : undefined;\n  } else {\n    content = {\n      id: idFactory(),\n      name: '',\n    };\n  }\n\n  return {\n    color: colorToDisplay,\n    name: content.name,\n    value: valueToDisplay,\n    actions,\n    defaultActions: getDefaultAction(content),\n    truncationMode,\n  };\n};\n"],
+  "mappings": "AAAA,SAAS,wBAAwB;AAEjC,SAAS,oBAAoB;AAC7B,SAAS,eAAe;AAUxB,SAAS,gCAAgC;AACzC,SAAS,gCAAgC;AACzC;AAAA,EAGE;AAAA,EACA;AAAA,OAGK;AAsBA,MAAM,sCAAsC,CAKjD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY,MAAM,OAAO,WAAW;AACtC,MAGiC;AAC/B,MAAI;AACJ,MAAI,iBAAiB;AACrB,MAAI,iBAAiB;AACrB,MAAI;AAEJ,QAAM,WAAW,QAAQ,kBAAkB,MAAM;AAEjD,QAAM,oBAAiD;AAAA,IACrD;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,MAAI,qBAAqB,iBAAiB,GAAG;AAC3C,UAAM,aAAa,QAAQ,eAAe,OAAO,EAAE;AACnD,UAAM,oBAAoB,QAAQ,sBAAsB,SAAS;AACjE,UAAM,WAAW,kBAAkB,UAAU;AAC7C,UAAM,EAAE,oBAAoB,eAAe,gBAAgB,UAAU,IACnE,kBAAkB;AAEpB,UAAM,cAAc,sBAAsB,iBAAiB;AAC3D,cAAU;AAAA,MACR,IAAI,UAAU;AAAA,MACd,MAAM;AAAA,IACR;AAEA,qBACE,OAAO,aAAa,WAChB,aAAa,cAAc,EAAE,UAAU,SAAS,IAChD,UAAU,SAAS,KAAK;AAE9B,qBACE,aAAa,SACT;AAAA,MACE;AAAA,MACA,kBAAkB,UAAU;AAAA,MAC5B,kBAAkB;AAAA,IACpB,KAAK,KACL;AAEN,UAAM,kBAAkB,kBAAkB,SAAS;AAEnD,cAAU,kBACN,MAAM,gBAAgB,kBAAkB,SAAS,IACjD;AAAA,EACN,WAAW,oBAAoB,iBAAiB,GAAG;AACjD,UAAM,EAAE,OAAO,KAAK,IAAI;AAExB,cAAU;AAAA,MACR,IAAI,UAAU;AAAA,MACd,MAAM,QAAQ;AAAA,IAChB;AAEA,qBAAiB,OAAO,WAAW;AAEnC,UAAM,kBAAkB,kBAAkB,SAAS;AACnD,cAAU,kBACN,MAAM;AACJ,YAAM,aAAa,yBAAyB;AAAA,QAC1C,WAAW,kBAAkB;AAAA,QAC7B,WAAW;AAAA,QACX;AAAA,QAEA;AAAA,QACA,eAAe,kBAAkB;AAAA,MACnC,CAAC;AACD,aAAO,gBAAgB,UAAU;AAAA,IACnC,IACA;AAAA,EACN,OAAO;AACL,cAAU;AAAA,MACR,IAAI,UAAU;AAAA,MACd,MAAM;AAAA,IACR;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,IACP,MAAM,QAAQ;AAAA,IACd,OAAO;AAAA,IACP;AAAA,IACA,gBAAgB,iBAAiB,OAAO;AAAA,IACxC;AAAA,EACF;AACF;",
+  "names": []
+}

package/esm/charts/xy-chart/components/tooltip/XYChartTooltipTemplate/XYChartTooltipTemplate.css

@@ -1,4 +1,4 @@
-._fnoz5j0-3-0-1 {
+._fnoz5j0-3-1-0 {
   min-width: 225px;
   max-width: 300px;
 }

package/esm/charts/xy-chart/components/tooltip/XYChartTooltipTemplate/XYChartTooltipTemplate.sty.js

@@ -1,5 +1,5 @@
 import "./XYChartTooltipTemplate.css";
-var body = "_fnoz5j0-3-0-1";
+var body = "_fnoz5j0-3-1-0";
 export {
   body
 };

package/esm/charts/xy-chart/components/tooltip/XYChartTooltipTemplate/XYChartTooltipTemplate.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/tooltip/XYChartTooltipTemplate/XYChartTooltipTemplate.css.ts"],
-  "sourcesContent": ["import './XYChartTooltipTemplate.css';\nexport var body = '_fnoz5j0-3-0-1';"],
+  "sourcesContent": ["import './XYChartTooltipTemplate.css';\nexport var body = '_fnoz5j0-3-1-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,OAAO;",
   "names": []
 }

package/esm/charts/xy-chart/components/tooltip/utils/tooltip-styles.css

@@ -1,23 +1,23 @@
-._1u58xor0-3-0-1 {
+._1u58xor0-3-1-0 {
   display: flex;
   flex-wrap: wrap;
   overflow-wrap: anywhere;
   margin-left: var(--dt-spacings-size-4, 4px);
   margin-right: var(--dt-spacings-size-4, 4px);
 }
-._1u58xor1-3-0-1 {
+._1u58xor1-3-1-0 {
   font-weight: var(--dt-typography-text-small-emphasized-weight, 500);
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
 }
-._1u58xor1-3-0-1::after {
+._1u58xor1-3-1-0::after {
   content: " ";
   white-space: pre;
 }
-._1u58xor2-3-0-1 {
+._1u58xor2-3-1-0 {
   flex: 0 1 auto;
   font-weight: var(--dt-typography-text-small-default-weight, 400);
 }
-._1u58xor3-3-0-1 {
+._1u58xor3-3-1-0 {
   flex: 1 1 auto;
   font-weight: var(--dt-typography-text-small-default-weight, 400);
 }

package/esm/charts/xy-chart/components/tooltip/utils/tooltip-styles.sty.js

@@ -1,8 +1,8 @@
 import "./tooltip-styles.css";
-var axisName = "_1u58xor1-3-0-1";
-var axisValue = "_1u58xor2-3-0-1";
-var duration = "_1u58xor3-3-0-1";
-var wrapper = "_1u58xor0-3-0-1";
+var axisName = "_1u58xor1-3-1-0";
+var axisValue = "_1u58xor2-3-1-0";
+var duration = "_1u58xor3-3-1-0";
+var wrapper = "_1u58xor0-3-1-0";
 export {
   axisName,
   axisValue,

package/esm/charts/xy-chart/components/tooltip/utils/tooltip-styles.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/tooltip/utils/tooltip-styles.css.ts"],
-  "sourcesContent": ["import './tooltip-styles.css';\nexport var axisName = '_1u58xor1-3-0-1';\nexport var axisValue = '_1u58xor2-3-0-1';\nexport var duration = '_1u58xor3-3-0-1';\nexport var wrapper = '_1u58xor0-3-0-1';"],
+  "sourcesContent": ["import './tooltip-styles.css';\nexport var axisName = '_1u58xor1-3-1-0';\nexport var axisValue = '_1u58xor2-3-1-0';\nexport var duration = '_1u58xor3-3-1-0';\nexport var wrapper = '_1u58xor0-3-1-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,WAAW;AACf,IAAI,YAAY;AAChB,IAAI,WAAW;AACf,IAAI,UAAU;",
   "names": []
 }

package/esm/charts/xy-chart/constants/defaults.js

@@ -31,6 +31,7 @@ const initialState = {
   },
   thresholds: { hoveredThresholdId: void 0 },
   highlightedSeriesId: void 0,
+  filteredSeriesIds: void 0,
   annotations: initialSelectionState
 };
 const defaultLegend = {

package/esm/charts/xy-chart/constants/defaults.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/xy-chart/constants/defaults.ts"],
-  "sourcesContent": ["import { initialSelectionState } from '../../core/components/annotations/providers/AnnotationsDataInitialState.js';\nimport type { PointsDisplay } from '../../core/components/canvas/types/canvas-shape.js';\nimport { TRUNCATION_MODE } from '../../core/components/legend/range/constants.js';\nimport { defaultRatio } from '../../core/constants.js';\nimport { UndefinedContent, type XYChartState } from '../types/state.js';\nimport {\n  XYChartAxisProps,\n  XYChartChartLegendProps,\n  XYChartConfigProperties,\n  XYChartNumericalAxisProps,\n  XYChartToolbarConfigProps,\n} from '../types/xy-chart-props.js';\n\nexport const DEFAULT_CHART_HEIGHT = 300;\n\nexport const DEFAULT_COLOR_PALETTE = 'categorical';\nexport const DEFAULT_COLOR_PALETTE_RECT = 'blue';\n\nexport const DEFAULT_LOADING_STATE = false;\n\ntype XYChartAxisDefaults = Pick<XYChartAxisProps, 'hidden' | 'reversed'> &\n  Pick<XYChartNumericalAxisProps, 'min' | 'max'>;\n\nexport const DEFAULT_AXIS_CONFIG: XYChartAxisDefaults = {\n  hidden: false,\n  min: 'auto',\n  max: 'auto',\n  reversed: false,\n};\n\nexport const DEFAULT_LEGEND_RANGE_FORMATTER = {\n  maximumFractionDigits: 1,\n};\n\nexport const initialState: XYChartState = {\n  zoom: {\n    zoomInEnabled: true,\n    zoomOutEnabled: false,\n  },\n  currentDomain: undefined,\n  select: undefined,\n  interactionMode: 'explore',\n  explore: {\n    visible: false,\n    pinned: false,\n    position: undefined,\n    content: UndefinedContent,\n  },\n  thresholds: { hoveredThresholdId: undefined },\n  highlightedSeriesId: undefined,\n  annotations: initialSelectionState,\n};\n\nexport const defaultLegend: XYChartChartLegendProps = {\n  hidden: false,\n  position: 'auto',\n  ratio: defaultRatio,\n} as const;\n\nexport const defaultToolbar: XYChartToolbarConfigProps = {\n  hidden: false,\n  placement: 'top-right',\n  collapsed: false,\n  draggable: true,\n} as const;\n\nexport const defaultConfig: XYChartConfigProperties = {\n  legend: defaultLegend,\n  toolbar: defaultToolbar,\n  colorPalette: undefined,\n  truncationMode: TRUNCATION_MODE.Middle,\n  thresholdIndicators: [],\n  yAxes: [],\n  xAxes: [],\n  colorRules: [],\n};\n\nexport const XY_CHART_ARIA_LABEL = 'XY Chart';\n/** Annotations bottom padding in pixels */\nexport const ANNOTATIONS_PADDING_BOTTOM = 6;\n\nexport const DISPLAY_UNITS_LIMIT = 3;\n\nexport const DEFAULT_POINTS_DISPLAY = 'auto' as PointsDisplay;\n\nexport const RECT_STROKE_WIDTH = 1;\n\nexport const XY_CHART_BOTTOM_AXIS_LABEL = 'Bottom axis';\n\nexport const XY_CHART_TOP_AXIS_LABEL = 'Top axis';\n"],
-  "mappings": "AAAA,SAAS,6BAA6B;AAEtC,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AAC7B,SAAS,wBAA2C;AAS7C,MAAM,uBAAuB;AAE7B,MAAM,wBAAwB;AAC9B,MAAM,6BAA6B;AAEnC,MAAM,wBAAwB;AAK9B,MAAM,sBAA2C;AAAA,EACtD,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,KAAK;AAAA,EACL,UAAU;AACZ;AAEO,MAAM,iCAAiC;AAAA,EAC5C,uBAAuB;AACzB;AAEO,MAAM,eAA6B;AAAA,EACxC,MAAM;AAAA,IACJ,eAAe;AAAA,IACf,gBAAgB;AAAA,EAClB;AAAA,EACA,eAAe;AAAA,EACf,QAAQ;AAAA,EACR,iBAAiB;AAAA,EACjB,SAAS;AAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AAAA,EACA,YAAY,EAAE,oBAAoB,OAAU;AAAA,EAC5C,qBAAqB;AAAA,EACrB,aAAa;AACf;AAEO,MAAM,gBAAyC;AAAA,EACpD,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,OAAO;AACT;AAEO,MAAM,iBAA4C;AAAA,EACvD,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AACb;AAEO,MAAM,gBAAyC;AAAA,EACpD,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,cAAc;AAAA,EACd,gBAAgB,gBAAgB;AAAA,EAChC,qBAAqB,CAAC;AAAA,EACtB,OAAO,CAAC;AAAA,EACR,OAAO,CAAC;AAAA,EACR,YAAY,CAAC;AACf;AAEO,MAAM,sBAAsB;AAE5B,MAAM,6BAA6B;AAEnC,MAAM,sBAAsB;AAE5B,MAAM,yBAAyB;AAE/B,MAAM,oBAAoB;AAE1B,MAAM,6BAA6B;AAEnC,MAAM,0BAA0B;",
+  "sourcesContent": ["import { initialSelectionState } from '../../core/components/annotations/providers/AnnotationsDataInitialState.js';\nimport type { PointsDisplay } from '../../core/components/canvas/types/canvas-shape.js';\nimport { TRUNCATION_MODE } from '../../core/components/legend/range/constants.js';\nimport { defaultRatio } from '../../core/constants.js';\nimport { UndefinedContent, type XYChartState } from '../types/state.js';\nimport {\n  XYChartAxisProps,\n  XYChartChartLegendProps,\n  XYChartConfigProperties,\n  XYChartNumericalAxisProps,\n  XYChartToolbarConfigProps,\n} from '../types/xy-chart-props.js';\n\nexport const DEFAULT_CHART_HEIGHT = 300;\n\nexport const DEFAULT_COLOR_PALETTE = 'categorical';\nexport const DEFAULT_COLOR_PALETTE_RECT = 'blue';\n\nexport const DEFAULT_LOADING_STATE = false;\n\ntype XYChartAxisDefaults = Pick<XYChartAxisProps, 'hidden' | 'reversed'> &\n  Pick<XYChartNumericalAxisProps, 'min' | 'max'>;\n\nexport const DEFAULT_AXIS_CONFIG: XYChartAxisDefaults = {\n  hidden: false,\n  min: 'auto',\n  max: 'auto',\n  reversed: false,\n};\n\nexport const DEFAULT_LEGEND_RANGE_FORMATTER = {\n  maximumFractionDigits: 1,\n};\n\nexport const initialState: XYChartState = {\n  zoom: {\n    zoomInEnabled: true,\n    zoomOutEnabled: false,\n  },\n  currentDomain: undefined,\n  select: undefined,\n  interactionMode: 'explore',\n  explore: {\n    visible: false,\n    pinned: false,\n    position: undefined,\n    content: UndefinedContent,\n  },\n  thresholds: { hoveredThresholdId: undefined },\n  highlightedSeriesId: undefined,\n  filteredSeriesIds: undefined,\n  annotations: initialSelectionState,\n};\n\nexport const defaultLegend: XYChartChartLegendProps = {\n  hidden: false,\n  position: 'auto',\n  ratio: defaultRatio,\n} as const;\n\nexport const defaultToolbar: XYChartToolbarConfigProps = {\n  hidden: false,\n  placement: 'top-right',\n  collapsed: false,\n  draggable: true,\n} as const;\n\nexport const defaultConfig: XYChartConfigProperties = {\n  legend: defaultLegend,\n  toolbar: defaultToolbar,\n  colorPalette: undefined,\n  truncationMode: TRUNCATION_MODE.Middle,\n  thresholdIndicators: [],\n  yAxes: [],\n  xAxes: [],\n  colorRules: [],\n};\n\nexport const XY_CHART_ARIA_LABEL = 'XY Chart';\n/** Annotations bottom padding in pixels */\nexport const ANNOTATIONS_PADDING_BOTTOM = 6;\n\nexport const DISPLAY_UNITS_LIMIT = 3;\n\nexport const DEFAULT_POINTS_DISPLAY = 'auto' as PointsDisplay;\n\nexport const RECT_STROKE_WIDTH = 1;\n\nexport const XY_CHART_BOTTOM_AXIS_LABEL = 'Bottom axis';\n\nexport const XY_CHART_TOP_AXIS_LABEL = 'Top axis';\n"],
+  "mappings": "AAAA,SAAS,6BAA6B;AAEtC,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AAC7B,SAAS,wBAA2C;AAS7C,MAAM,uBAAuB;AAE7B,MAAM,wBAAwB;AAC9B,MAAM,6BAA6B;AAEnC,MAAM,wBAAwB;AAK9B,MAAM,sBAA2C;AAAA,EACtD,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,KAAK;AAAA,EACL,UAAU;AACZ;AAEO,MAAM,iCAAiC;AAAA,EAC5C,uBAAuB;AACzB;AAEO,MAAM,eAA6B;AAAA,EACxC,MAAM;AAAA,IACJ,eAAe;AAAA,IACf,gBAAgB;AAAA,EAClB;AAAA,EACA,eAAe;AAAA,EACf,QAAQ;AAAA,EACR,iBAAiB;AAAA,EACjB,SAAS;AAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AAAA,EACA,YAAY,EAAE,oBAAoB,OAAU;AAAA,EAC5C,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,aAAa;AACf;AAEO,MAAM,gBAAyC;AAAA,EACpD,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,OAAO;AACT;AAEO,MAAM,iBAA4C;AAAA,EACvD,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AACb;AAEO,MAAM,gBAAyC;AAAA,EACpD,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,cAAc;AAAA,EACd,gBAAgB,gBAAgB;AAAA,EAChC,qBAAqB,CAAC;AAAA,EACtB,OAAO,CAAC;AAAA,EACR,OAAO,CAAC;AAAA,EACR,YAAY,CAAC;AACf;AAEO,MAAM,sBAAsB;AAE5B,MAAM,6BAA6B;AAEnC,MAAM,sBAAsB;AAE5B,MAAM,yBAAyB;AAE/B,MAAM,oBAAoB;AAE1B,MAAM,6BAA6B;AAEnC,MAAM,0BAA0B;",
   "names": []
 }

package/esm/charts/xy-chart/context/XYChartData.context.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/xy-chart/context/XYChartData.context.ts"],
-  "sourcesContent": ["import { createContext } from 'react';\n\nimport type {\n  AxisIdToScaleDomain,\n  XYChartAxisInternal,\n  XYChartSeriesWithDatapoints,\n  MapDatapoints,\n  SeriesToMetadata,\n  AxisIdToDimension,\n} from '../types/xy-chart-internals.js';\n\nexport type XYChartDataContext = {\n  axesMetadata: {\n    isZoomEnabled: boolean;\n    isPanEnabled: boolean;\n    isInfinite: boolean;\n  };\n  axes: XYChartAxisInternal[];\n  seriesWithDatapoints: XYChartSeriesWithDatapoints[];\n  axisIdToScaleDomain: AxisIdToScaleDomain;\n  datapointMetadataMap: MapDatapoints;\n  seriesToMetadata: SeriesToMetadata;\n  axisIdToDimension: AxisIdToDimension;\n};\n\nexport const XYChartDataContext = createContext<XYChartDataContext | undefined>(\n  undefined,\n);\n\nXYChartDataContext['displayName'] = 'XYChartDataContext';\n"],
-  "mappings": "AAAA,SAAS,qBAAqB;AAyBvB,MAAM,qBAAqB;AAAA,EAChC;AACF;AAEA,mBAAmB,aAAa,IAAI;",
+  "sourcesContent": ["import { createContext } from 'react';\n\nimport type {\n  AxisIdToScaleDomain,\n  XYChartAxisInternal,\n  XYChartSeriesWithDatapoints,\n  MapDatapoints,\n  SeriesToMetadata,\n  AxisIdToDimension,\n} from '../types/xy-chart-internals.js';\n\nexport type XYChartDataContext = {\n  axesMetadata: {\n    isZoomEnabled: boolean;\n    isPanEnabled: boolean;\n    isInfinite: boolean;\n  };\n  axes: XYChartAxisInternal[];\n  seriesWithDatapoints: XYChartSeriesWithDatapoints[];\n  filteredSeriesWithDatapoints: XYChartSeriesWithDatapoints[];\n  axisIdToScaleDomain: AxisIdToScaleDomain;\n  datapointMetadataMap: MapDatapoints;\n  seriesToMetadata: SeriesToMetadata;\n  axisIdToDimension: AxisIdToDimension;\n};\n\nexport const XYChartDataContext = createContext<XYChartDataContext | undefined>(\n  undefined,\n);\n\nXYChartDataContext['displayName'] = 'XYChartDataContext';\n"],
+  "mappings": "AAAA,SAAS,qBAAqB;AA0BvB,MAAM,qBAAqB;AAAA,EAChC;AACF;AAEA,mBAAmB,aAAa,IAAI;",
   "names": []
 }

package/esm/charts/xy-chart/context/XYChartLinearSelection.context.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/xy-chart/context/XYChartLinearSelection.context.ts"],
-  "sourcesContent": ["import { createContext } from 'react';\n\nimport { AxisIdToScales } from './XYChartScales.context.js';\nimport { DataPoint } from '../../core/types/data-point.js';\nimport type { AxisIdToScaleDomain } from '../types/xy-chart-internals.js';\nimport type {\n  AxisSelectConfig,\n  XYChartSelectionDotMetadata,\n} from '../types/xy-chart-selection.js';\n\nexport interface XYChartLinearSelectionContextValue {\n  selectionConfigByAxisId: Map<string, AxisSelectConfig>;\n  searchAllAxisDatapoints: (\n    start: number,\n    end: number,\n    callback: (point: XYChartSelectionDotMetadata) => DataPoint | null,\n    axesIds: string | string[],\n    axisIdToScales: AxisIdToScales,\n    axisIdToScaleDomain: AxisIdToScaleDomain,\n    axisIdToIsRelative: Map<string, boolean>,\n  ) => {\n    axesCurrentSelection: Record<string, DataPoint[]>;\n    highlightedDatapoints: DataPoint[];\n  };\n}\n\nexport const XYChartLinearSelectionContext = createContext<\n  XYChartLinearSelectionContextValue | undefined\n>(undefined);\n"],
-  "mappings": "AAAA,SAAS,qBAAqB;AA0BvB,MAAM,gCAAgC,cAE3C,MAAS;",
+  "sourcesContent": ["import { createContext } from 'react';\n\nimport { AxisIdToScales } from './XYChartScales.context.js';\nimport { DataPoint } from '../../core/types/data-point.js';\nimport type { AxisIdToScaleDomain } from '../types/xy-chart-internals.js';\nimport type {\n  AxisSelectConfig,\n  XYChartSelectionDotMetadata,\n} from '../types/xy-chart-selection.js';\n\nexport interface XYChartLinearSelectionContextValue {\n  selectionConfigByAxisId: Map<string, AxisSelectConfig>;\n  searchAllAxisDatapoints: (\n    start: number,\n    end: number,\n    callback: (\n      point: XYChartSelectionDotMetadata,\n    ) => DataPoint | DataPoint[] | null,\n    axesIds: string | string[],\n    axisIdToScales: AxisIdToScales,\n    axisIdToScaleDomain: AxisIdToScaleDomain,\n    axisIdToIsRelative: Map<string, boolean>,\n  ) => {\n    axesCurrentSelection: Record<string, DataPoint[]>;\n    highlightedDatapoints: DataPoint[];\n  };\n}\n\nexport const XYChartLinearSelectionContext = createContext<\n  XYChartLinearSelectionContextValue | undefined\n>(undefined);\n"],
+  "mappings": "AAAA,SAAS,qBAAqB;AA4BvB,MAAM,gCAAgC,cAE3C,MAAS;",
   "names": []
 }

package/esm/charts/xy-chart/hooks/useAreaData.js

@@ -10,8 +10,8 @@ const useAreaData = () => {
   }
   const filteredContext = useMemo(() => {
     return {
-      ...context,
-      seriesWithDatapoints: context.seriesWithDatapoints.filter(
+      seriesToMetadata: context.seriesToMetadata,
+      filteredSeriesWithDatapoints: context.filteredSeriesWithDatapoints.filter(
         (series) => series.type === AREA_VARIANT
       )
     };

package/esm/charts/xy-chart/hooks/useAreaData.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/xy-chart/hooks/useAreaData.ts"],
-  "sourcesContent": ["import { useContext, useMemo } from 'react';\n\nimport { XYChartDataContext } from '../context/XYChartData.context.js';\nimport {\n  AREA_VARIANT,\n  type AreaSeriesToMetadata,\n  type AreaSeriesWithDatapoints,\n} from '../types/xy-chart-internals.js';\n\nexport interface AreaDataInternal {\n  seriesWithDatapoints: AreaSeriesWithDatapoints[];\n  seriesToMetadata: AreaSeriesToMetadata;\n}\n\nexport const useAreaData = () => {\n  const context = useContext(XYChartDataContext);\n\n  if (context === undefined) {\n    throw new Error('useAreaData must be used within a XYChartDataContext');\n  }\n\n  const filteredContext = useMemo(() => {\n    return {\n      ...context,\n      seriesWithDatapoints: context.seriesWithDatapoints.filter(\n        (series) => series.type === AREA_VARIANT,\n      ),\n    };\n  }, [context]);\n\n  return filteredContext as AreaDataInternal;\n};\n"],
-  "mappings": "AAAA,SAAS,YAAY,eAAe;AAEpC,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,OAGK;AAOA,MAAM,cAAc,MAAM;AAC/B,QAAM,UAAU,WAAW,kBAAkB;AAE7C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI,MAAM,sDAAsD;AAAA,EACxE;AAEA,QAAM,kBAAkB,QAAQ,MAAM;AACpC,WAAO;AAAA,MACL,GAAG;AAAA,MACH,sBAAsB,QAAQ,qBAAqB;AAAA,QACjD,CAAC,WAAW,OAAO,SAAS;AAAA,MAC9B;AAAA,IACF;AAAA,EACF,GAAG,CAAC,OAAO,CAAC;AAEZ,SAAO;AACT;",
+  "sourcesContent": ["import { useContext, useMemo } from 'react';\n\nimport { XYChartDataContext } from '../context/XYChartData.context.js';\nimport {\n  AREA_VARIANT,\n  type AreaSeriesToMetadata,\n  type AreaSeriesWithDatapoints,\n} from '../types/xy-chart-internals.js';\n\nexport interface AreaDataInternal {\n  filteredSeriesWithDatapoints: AreaSeriesWithDatapoints[];\n  seriesToMetadata: AreaSeriesToMetadata;\n}\n\nexport const useAreaData = () => {\n  const context = useContext(XYChartDataContext);\n\n  if (context === undefined) {\n    throw new Error('useAreaData must be used within a XYChartDataContext');\n  }\n\n  const filteredContext = useMemo(() => {\n    return {\n      seriesToMetadata: context.seriesToMetadata,\n      filteredSeriesWithDatapoints: context.filteredSeriesWithDatapoints.filter(\n        (series) => series.type === AREA_VARIANT,\n      ),\n    };\n  }, [context]);\n\n  return filteredContext as AreaDataInternal;\n};\n"],
+  "mappings": "AAAA,SAAS,YAAY,eAAe;AAEpC,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,OAGK;AAOA,MAAM,cAAc,MAAM;AAC/B,QAAM,UAAU,WAAW,kBAAkB;AAE7C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI,MAAM,sDAAsD;AAAA,EACxE;AAEA,QAAM,kBAAkB,QAAQ,MAAM;AACpC,WAAO;AAAA,MACL,kBAAkB,QAAQ;AAAA,MAC1B,8BAA8B,QAAQ,6BAA6B;AAAA,QACjE,CAAC,WAAW,OAAO,SAAS;AAAA,MAC9B;AAAA,IACF;AAAA,EACF,GAAG,CAAC,OAAO,CAAC;AAEZ,SAAO;AACT;",
   "names": []
 }

package/esm/charts/xy-chart/hooks/useBarData.js

@@ -10,8 +10,8 @@ const useBarData = () => {
   }
   const filteredContext = useMemo(() => {
     return {
-      ...context,
-      seriesWithDatapoints: context.seriesWithDatapoints.filter(
+      seriesToMetadata: context.seriesToMetadata,
+      filteredSeriesWithDatapoints: context.filteredSeriesWithDatapoints.filter(
         (series) => series.type === BAR_VARIANT
       )
     };

package/esm/charts/xy-chart/hooks/useBarData.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/xy-chart/hooks/useBarData.ts"],
-  "sourcesContent": ["import { useContext, useMemo } from 'react';\n\nimport { XYChartDataContext } from '../context/XYChartData.context.js';\nimport {\n  BAR_VARIANT,\n  type BarSeriesToMetadata,\n  type BarSeriesWithDatapoints,\n} from '../types/xy-chart-internals.js';\n\nexport interface BarDataInternal {\n  seriesWithDatapoints: BarSeriesWithDatapoints[];\n  seriesToMetadata: BarSeriesToMetadata;\n}\n\nexport const useBarData = () => {\n  const context = useContext(XYChartDataContext);\n\n  if (context === undefined) {\n    throw new Error('useBarData must be used within a XYChartDataContext');\n  }\n\n  const filteredContext = useMemo(() => {\n    return {\n      ...context,\n      seriesWithDatapoints: context.seriesWithDatapoints.filter(\n        (series) => series.type === BAR_VARIANT,\n      ),\n    };\n  }, [context]);\n\n  return filteredContext as BarDataInternal;\n};\n"],
-  "mappings": "AAAA,SAAS,YAAY,eAAe;AAEpC,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,OAGK;AAOA,MAAM,aAAa,MAAM;AAC9B,QAAM,UAAU,WAAW,kBAAkB;AAE7C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AAEA,QAAM,kBAAkB,QAAQ,MAAM;AACpC,WAAO;AAAA,MACL,GAAG;AAAA,MACH,sBAAsB,QAAQ,qBAAqB;AAAA,QACjD,CAAC,WAAW,OAAO,SAAS;AAAA,MAC9B;AAAA,IACF;AAAA,EACF,GAAG,CAAC,OAAO,CAAC;AAEZ,SAAO;AACT;",
+  "sourcesContent": ["import { useContext, useMemo } from 'react';\n\nimport { XYChartDataContext } from '../context/XYChartData.context.js';\nimport {\n  BAR_VARIANT,\n  type BarSeriesToMetadata,\n  type BarSeriesWithDatapoints,\n} from '../types/xy-chart-internals.js';\n\nexport interface BarDataInternal {\n  filteredSeriesWithDatapoints: BarSeriesWithDatapoints[];\n  seriesToMetadata: BarSeriesToMetadata;\n}\n\nexport const useBarData = () => {\n  const context = useContext(XYChartDataContext);\n\n  if (context === undefined) {\n    throw new Error('useBarData must be used within a XYChartDataContext');\n  }\n\n  const filteredContext = useMemo(() => {\n    return {\n      seriesToMetadata: context.seriesToMetadata,\n      filteredSeriesWithDatapoints: context.filteredSeriesWithDatapoints.filter(\n        (series) => series.type === BAR_VARIANT,\n      ),\n    };\n  }, [context]);\n\n  return filteredContext as BarDataInternal;\n};\n"],
+  "mappings": "AAAA,SAAS,YAAY,eAAe;AAEpC,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,OAGK;AAOA,MAAM,aAAa,MAAM;AAC9B,QAAM,UAAU,WAAW,kBAAkB;AAE7C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AAEA,QAAM,kBAAkB,QAAQ,MAAM;AACpC,WAAO;AAAA,MACL,kBAAkB,QAAQ;AAAA,MAC1B,8BAA8B,QAAQ,6BAA6B;AAAA,QACjE,CAAC,WAAW,OAAO,SAAS;AAAA,MAC9B;AAAA,IACF;AAAA,EACF,GAAG,CAAC,OAAO,CAAC;AAEZ,SAAO;AACT;",
   "names": []
 }

package/esm/charts/xy-chart/hooks/useBuildQuadtree.js

@@ -10,9 +10,9 @@ import {
   getDebouncedQuadtrees
 } from "../utils/query-closest-quadtree.js";
 function useBuildQuadtree() {
-  const { seriesWithDatapoints: dotSeriesWithDatapoints } = useDotData();
-  const { seriesWithDatapoints: lineSeriesWithDatapoints } = useLineData();
-  const { seriesWithDatapoints: areaSeriesWithDatapoints } = useAreaData();
+  const { filteredSeriesWithDatapoints: dotSeriesWithDatapoints } = useDotData();
+  const { filteredSeriesWithDatapoints: lineSeriesWithDatapoints } = useLineData();
+  const { filteredSeriesWithDatapoints: areaSeriesWithDatapoints } = useAreaData();
   const axisIdToScales = useXYChartScales();
   const { datapointMetadataMap, axisIdToScaleDomain, seriesToMetadata } = useXYChartData();
   const id = useId();

package/esm/charts/xy-chart/hooks/useBuildQuadtree.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/xy-chart/hooks/useBuildQuadtree.ts"],
-  "sourcesContent": ["import { useEffect, useState } from 'react';\n\n\nimport { useAreaData } from './useAreaData.js';\nimport { useDotData } from './useDotData.js';\nimport { useLineData } from './useLineData.js';\nimport { useXYChartData } from './useXYChartData.js';\nimport { useXYChartScales } from './useXYChartScales.js';\nimport { useId } from '../../../core/hooks/useId.js';\nimport type { SeriesToQuadtree } from '../context/XYChartOverlayPerformance.context.js';\nimport type { AnyLinearSeries } from '../types/xy-chart-internals.js';\nimport {\n  cancelDebouncedQuadtrees,\n  getDebouncedQuadtrees,\n} from '../utils/query-closest-quadtree.js';\n\nexport function useBuildQuadtree() {\n  const { seriesWithDatapoints: dotSeriesWithDatapoints } = useDotData();\n  const { seriesWithDatapoints: lineSeriesWithDatapoints } = useLineData();\n  const { seriesWithDatapoints: areaSeriesWithDatapoints } = useAreaData();\n  const axisIdToScales = useXYChartScales();\n  const { datapointMetadataMap, axisIdToScaleDomain, seriesToMetadata } =\n    useXYChartData();\n  const id = useId();\n  const [seriesIdToQuadtree, setSeriesIdToQuadtree] = useState<\n    SeriesToQuadtree | undefined\n  >(undefined);\n\n  useEffect(() => {\n    const linearSeries: AnyLinearSeries[] = [\n      ...dotSeriesWithDatapoints,\n      ...lineSeriesWithDatapoints,\n      ...areaSeriesWithDatapoints,\n    ];\n\n    const debounced = getDebouncedQuadtrees(id);\n\n    debounced(\n      linearSeries,\n      axisIdToScales,\n      datapointMetadataMap,\n      seriesToMetadata,\n      axisIdToScaleDomain,\n      setSeriesIdToQuadtree,\n    );\n\n    return () => {\n      cancelDebouncedQuadtrees(id);\n      setSeriesIdToQuadtree(undefined);\n    };\n  }, [\n    dotSeriesWithDatapoints,\n    lineSeriesWithDatapoints,\n    areaSeriesWithDatapoints,\n    datapointMetadataMap,\n    axisIdToScales,\n    axisIdToScaleDomain,\n    seriesToMetadata,\n    id,\n  ]);\n\n  return seriesIdToQuadtree;\n}\n"],
-  "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAGpC,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,wBAAwB;AACjC,SAAS,aAAa;AAGtB;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAEA,SAAS,mBAAmB;AACjC,QAAM,EAAE,sBAAsB,wBAAwB,IAAI,WAAW;AACrE,QAAM,EAAE,sBAAsB,yBAAyB,IAAI,YAAY;AACvE,QAAM,EAAE,sBAAsB,yBAAyB,IAAI,YAAY;AACvE,QAAM,iBAAiB,iBAAiB;AACxC,QAAM,EAAE,sBAAsB,qBAAqB,iBAAiB,IAClE,eAAe;AACjB,QAAM,KAAK,MAAM;AACjB,QAAM,CAAC,oBAAoB,qBAAqB,IAAI,SAElD,MAAS;AAEX,YAAU,MAAM;AACd,UAAM,eAAkC;AAAA,MACtC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAEA,UAAM,YAAY,sBAAsB,EAAE;AAE1C;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAEA,WAAO,MAAM;AACX,+BAAyB,EAAE;AAC3B,4BAAsB,MAAS;AAAA,IACjC;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
+  "sourcesContent": ["import { useEffect, useState } from 'react';\n\n\nimport { useAreaData } from './useAreaData.js';\nimport { useDotData } from './useDotData.js';\nimport { useLineData } from './useLineData.js';\nimport { useXYChartData } from './useXYChartData.js';\nimport { useXYChartScales } from './useXYChartScales.js';\nimport { useId } from '../../../core/hooks/useId.js';\nimport type { SeriesToQuadtree } from '../context/XYChartOverlayPerformance.context.js';\nimport type { AnyLinearSeries } from '../types/xy-chart-internals.js';\nimport {\n  cancelDebouncedQuadtrees,\n  getDebouncedQuadtrees,\n} from '../utils/query-closest-quadtree.js';\n\nexport function useBuildQuadtree() {\n  const { filteredSeriesWithDatapoints: dotSeriesWithDatapoints } =\n    useDotData();\n  const { filteredSeriesWithDatapoints: lineSeriesWithDatapoints } =\n    useLineData();\n  const { filteredSeriesWithDatapoints: areaSeriesWithDatapoints } =\n    useAreaData();\n  const axisIdToScales = useXYChartScales();\n  const { datapointMetadataMap, axisIdToScaleDomain, seriesToMetadata } =\n    useXYChartData();\n  const id = useId();\n  const [seriesIdToQuadtree, setSeriesIdToQuadtree] = useState<\n    SeriesToQuadtree | undefined\n  >(undefined);\n\n  useEffect(() => {\n    const linearSeries: AnyLinearSeries[] = [\n      ...dotSeriesWithDatapoints,\n      ...lineSeriesWithDatapoints,\n      ...areaSeriesWithDatapoints,\n    ];\n\n    const debounced = getDebouncedQuadtrees(id);\n\n    debounced(\n      linearSeries,\n      axisIdToScales,\n      datapointMetadataMap,\n      seriesToMetadata,\n      axisIdToScaleDomain,\n      setSeriesIdToQuadtree,\n    );\n\n    return () => {\n      cancelDebouncedQuadtrees(id);\n      setSeriesIdToQuadtree(undefined);\n    };\n  }, [\n    dotSeriesWithDatapoints,\n    lineSeriesWithDatapoints,\n    areaSeriesWithDatapoints,\n    datapointMetadataMap,\n    axisIdToScales,\n    axisIdToScaleDomain,\n    seriesToMetadata,\n    id,\n  ]);\n\n  return seriesIdToQuadtree;\n}\n"],
+  "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAGpC,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,wBAAwB;AACjC,SAAS,aAAa;AAGtB;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAEA,SAAS,mBAAmB;AACjC,QAAM,EAAE,8BAA8B,wBAAwB,IAC5D,WAAW;AACb,QAAM,EAAE,8BAA8B,yBAAyB,IAC7D,YAAY;AACd,QAAM,EAAE,8BAA8B,yBAAyB,IAC7D,YAAY;AACd,QAAM,iBAAiB,iBAAiB;AACxC,QAAM,EAAE,sBAAsB,qBAAqB,iBAAiB,IAClE,eAAe;AACjB,QAAM,KAAK,MAAM;AACjB,QAAM,CAAC,oBAAoB,qBAAqB,IAAI,SAElD,MAAS;AAEX,YAAU,MAAM;AACd,UAAM,eAAkC;AAAA,MACtC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAEA,UAAM,YAAY,sBAAsB,EAAE;AAE1C;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAEA,WAAO,MAAM;AACX,+BAAyB,EAAE;AAC3B,4BAAsB,MAAS;AAAA,IACjC;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
   "names": []
 }

package/esm/charts/xy-chart/hooks/useDotData.js

@@ -10,8 +10,8 @@ const useDotData = () => {
   }
   const filteredContext = useMemo(() => {
     return {
-      ...context,
-      seriesWithDatapoints: context.seriesWithDatapoints.filter(
+      seriesToMetadata: context.seriesToMetadata,
+      filteredSeriesWithDatapoints: context.filteredSeriesWithDatapoints.filter(
         (series) => series.type === DOT_VARIANT
       )
     };