@dynatrace/strato-components 3.0.1 → 3.1.0

package/esm/charts/xy-chart/components/legend/XYChartLegend.js

@@ -1,28 +1,33 @@
 import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
 import { RectRangeLegend } from "./RectRangeLegend/RectRangeLegend.js";
 import { XYLegend } from "./XYLegend/XYLegend.js";
 import { safeGet } from "../../../core/utils/safe-get.js";
-import { useRectData } from "../../hooks/useRectData.js";
 import { useXYChartData } from "../../hooks/useXYChartData.js";
 import { isRangeLegend } from "../../utils/is-range-legend.js";
 import { isRectSeries } from "../../utils/type-guards.js";
+function buildLegendIdentityKey(series) {
+  return series.map((s) => s.id).join(",");
+}
 const XYChartLegend = () => {
-  const { seriesWithDatapoints } = useXYChartData();
-  const { seriesToMetadata } = useRectData();
-  const firstSeries = seriesWithDatapoints[0];
+  const { seriesWithDatapoints, seriesToMetadata: fullSeriesToMetadata } = useXYChartData();
+  const identityKey = buildLegendIdentityKey(seriesWithDatapoints);
+  const stableSeries = useMemo(() => seriesWithDatapoints, [identityKey]);
+  const stableMetadata = useMemo(() => fullSeriesToMetadata, [identityKey]);
+  const firstSeries = stableSeries[0];
   if (isRectSeries(firstSeries)) {
     const { valueType: firstSeriesValueType } = safeGet(
-      seriesToMetadata,
+      stableMetadata,
       firstSeries
     );
     if (!firstSeriesValueType) {
       return null;
     }
-    if (isRangeLegend(seriesToMetadata, firstSeries)) {
+    if (isRangeLegend(stableMetadata, firstSeries)) {
       return /* @__PURE__ */ jsx(RectRangeLegend, { series: firstSeries });
     }
   }
-  return /* @__PURE__ */ jsx(XYLegend, {});
+  return /* @__PURE__ */ jsx(XYLegend, { series: stableSeries, seriesToMetadata: stableMetadata });
 };
 export {
   XYChartLegend

package/esm/charts/xy-chart/components/legend/XYChartLegend.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/xy-chart/components/legend/XYChartLegend.tsx"],
-  "sourcesContent": ["import { RectRangeLegend } from './RectRangeLegend/RectRangeLegend.js';\nimport { XYLegend } from './XYLegend/XYLegend.js';\nimport { safeGet } from '../../../core/utils/safe-get.js';\nimport { useRectData } from '../../hooks/useRectData.js';\nimport { useXYChartData } from '../../hooks/useXYChartData.js';\nimport { isRangeLegend } from '../../utils/is-range-legend.js';\nimport { isRectSeries } from '../../utils/type-guards.js';\n\nexport const XYChartLegend = () => {\n  const { seriesWithDatapoints } = useXYChartData();\n  const { seriesToMetadata } = useRectData();\n\n  const firstSeries = seriesWithDatapoints[0];\n\n  if (isRectSeries(firstSeries)) {\n    const { valueType: firstSeriesValueType } = safeGet(\n      seriesToMetadata,\n      firstSeries,\n    );\n\n    if (!firstSeriesValueType) {\n      return null;\n    }\n\n    if (isRangeLegend(seriesToMetadata, firstSeries)) {\n      return <RectRangeLegend series={firstSeries} />;\n    }\n  }\n\n  return <XYLegend />;\n};\n"],
-  "mappings": "AAyBa;AAzBb,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AACzB,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,qBAAqB;AAC9B,SAAS,oBAAoB;AAEtB,MAAM,gBAAgB,MAAM;AACjC,QAAM,EAAE,qBAAqB,IAAI,eAAe;AAChD,QAAM,EAAE,iBAAiB,IAAI,YAAY;AAEzC,QAAM,cAAc,qBAAqB,CAAC;AAE1C,MAAI,aAAa,WAAW,GAAG;AAC7B,UAAM,EAAE,WAAW,qBAAqB,IAAI;AAAA,MAC1C;AAAA,MACA;AAAA,IACF;AAEA,QAAI,CAAC,sBAAsB;AACzB,aAAO;AAAA,IACT;AAEA,QAAI,cAAc,kBAAkB,WAAW,GAAG;AAChD,aAAO,oBAAC,mBAAgB,QAAQ,aAAa;AAAA,IAC/C;AAAA,EACF;AAEA,SAAO,oBAAC,YAAS;AACnB;",
+  "sourcesContent": ["import { useMemo } from 'react';\n\nimport { RectRangeLegend } from './RectRangeLegend/RectRangeLegend.js';\nimport { XYLegend } from './XYLegend/XYLegend.js';\nimport { safeGet } from '../../../core/utils/safe-get.js';\nimport { useXYChartData } from '../../hooks/useXYChartData.js';\nimport type { XYChartSeriesWithDatapoints } from '../../types/xy-chart-internals.js';\nimport { isRangeLegend } from '../../utils/is-range-legend.js';\nimport { isRectSeries } from '../../utils/type-guards.js';\n\n/**\n * Builds a stable identity key from series that changes only when the consumer\n * provides different series (added/removed/reordered). Uses only series IDs\n * (not data.length) because hidden series have empty data arrays \u2014 their\n * datapoints are not registered during processing to avoid unnecessary work.\n */\nfunction buildLegendIdentityKey(series: XYChartSeriesWithDatapoints[]): string {\n  return series.map((s) => s.id).join(',');\n}\n\nexport const XYChartLegend = () => {\n  const { seriesWithDatapoints, seriesToMetadata: fullSeriesToMetadata } =\n    useXYChartData();\n\n  const identityKey = buildLegendIdentityKey(seriesWithDatapoints);\n\n  // Deps use identityKey (not the object references) intentionally \u2014 we want\n  // stable references that only change when series are added/removed/reordered.\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  const stableSeries = useMemo(() => seriesWithDatapoints, [identityKey]);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  const stableMetadata = useMemo(() => fullSeriesToMetadata, [identityKey]);\n\n  const firstSeries = stableSeries[0];\n\n  if (isRectSeries(firstSeries)) {\n    const { valueType: firstSeriesValueType } = safeGet(\n      stableMetadata,\n      firstSeries,\n    );\n\n    if (!firstSeriesValueType) {\n      return null;\n    }\n\n    if (isRangeLegend(stableMetadata, firstSeries)) {\n      return <RectRangeLegend series={firstSeries} />;\n    }\n  }\n\n  return <XYLegend series={stableSeries} seriesToMetadata={stableMetadata} />;\n};\n"],
+  "mappings": "AA8Ca;AA9Cb,SAAS,eAAe;AAExB,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AACzB,SAAS,eAAe;AACxB,SAAS,sBAAsB;AAE/B,SAAS,qBAAqB;AAC9B,SAAS,oBAAoB;AAQ7B,SAAS,uBAAuB,QAA+C;AAC7E,SAAO,OAAO,IAAI,CAAC,MAAM,EAAE,EAAE,EAAE,KAAK,GAAG;AACzC;AAEO,MAAM,gBAAgB,MAAM;AACjC,QAAM,EAAE,sBAAsB,kBAAkB,qBAAqB,IACnE,eAAe;AAEjB,QAAM,cAAc,uBAAuB,oBAAoB;AAK/D,QAAM,eAAe,QAAQ,MAAM,sBAAsB,CAAC,WAAW,CAAC;AAEtE,QAAM,iBAAiB,QAAQ,MAAM,sBAAsB,CAAC,WAAW,CAAC;AAExE,QAAM,cAAc,aAAa,CAAC;AAElC,MAAI,aAAa,WAAW,GAAG;AAC7B,UAAM,EAAE,WAAW,qBAAqB,IAAI;AAAA,MAC1C;AAAA,MACA;AAAA,IACF;AAEA,QAAI,CAAC,sBAAsB;AACzB,aAAO;AAAA,IACT;AAEA,QAAI,cAAc,gBAAgB,WAAW,GAAG;AAC9C,aAAO,oBAAC,mBAAgB,QAAQ,aAAa;AAAA,IAC/C;AAAA,EACF;AAEA,SAAO,oBAAC,YAAS,QAAQ,cAAc,kBAAkB,gBAAgB;AAC3E;",
   "names": []
 }

package/esm/charts/xy-chart/components/legend/XYLegend/XYLegend.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { useCallback, useMemo } from "react";
 import { getXYLegendActions } from "./utils/getXYLegendActions.js";
 import {
   AREA_CHART_ICON_SHAPE,
@@ -12,11 +12,10 @@ import { useChartLayoutOrientation } from "../../../../core/components/chart-lay
 import { getLegendOrientation } from "../../../../core/components/chart-layout/utils/orientation.js";
 import { ChartLegend } from "../../../../core/components/legend/categorical/ChartLegend.js";
 import { buildCategoricalItemsFromScale } from "../../../../core/utils/build-categorical-items-from-scale.js";
-import { isFeatureEnabled } from "../../../../core/utils/is-feature-enabled.js";
 import { safeGet } from "../../../../core/utils/safe-get.js";
 import { useXYChartColorScales } from "../../../hooks/useXYChartColorScales.js";
-import { useXYChartData } from "../../../hooks/useXYChartData.js";
 import { useXYChartTruncationMode } from "../../../hooks/useXYChartTruncationMode.js";
+import { reduceFilterSeries } from "../../../store/reducer-filter-series.js";
 import { useSetState } from "../../../store/selectors.js";
 import {
   AREA_VARIANT,
@@ -65,32 +64,35 @@ function getLegendItems(series, metadata, isMixedSeries, scaleColorMap, isCatego
     }
   });
 }
-function XYLegend() {
+function XYLegend({ series, seriesToMetadata }) {
   const { orientation: layoutOrientation } = useChartLayoutOrientation();
   const orientation = getLegendOrientation(layoutOrientation);
-  const { seriesWithDatapoints, seriesToMetadata } = useXYChartData();
   const setState = useSetState();
   const scaleColorMap = useXYChartColorScales();
   const { truncationMode } = useXYChartTruncationMode();
-  const firstSeries = seriesWithDatapoints[0];
-  const isCategoricalRectOnly = isRectSeries(firstSeries) && seriesWithDatapoints.every(isRectSeries) && !isRangeLegend(seriesToMetadata, firstSeries);
+  const firstSeries = series[0];
+  const isCategoricalRectOnly = isRectSeries(firstSeries) && series.every(isRectSeries) && !isRangeLegend(seriesToMetadata, firstSeries);
   const isMixedSeries = useMemo(() => {
-    const typeSet = new Set(seriesWithDatapoints.map((series) => series.type));
+    const typeSet = new Set(series.map((s) => s.type));
     return typeSet.size >= 2;
-  }, [seriesWithDatapoints]);
-  const legendItems = getLegendItems(
-    seriesWithDatapoints,
-    seriesToMetadata,
-    isMixedSeries,
-    scaleColorMap,
-    isCategoricalRectOnly
+  }, [series]);
+  const legendItems = useMemo(
+    () => getLegendItems(
+      series,
+      seriesToMetadata,
+      isMixedSeries,
+      scaleColorMap,
+      isCategoricalRectOnly
+    ),
+    [series, seriesToMetadata]
   );
-  const legendActions = getXYLegendActions(
-    seriesWithDatapoints,
-    seriesToMetadata
-  );
-  const interactionsDisabled = !isFeatureEnabled(
-    "areLegendInteractionsEnabled"
+  const legendActions = getXYLegendActions(series, seriesToMetadata);
+  const updateVisibleSeries = useCallback(
+    (visibleItems) => {
+      const visibleIds = new Set(visibleItems.map((item) => item.id));
+      setState(reduceFilterSeries(visibleIds));
+    },
+    [setState]
   );
   const updateHighlightedSeriesId = (legendItemId) => {
     setState((prev) => ({ ...prev, highlightedSeriesId: legendItemId }));
@@ -98,12 +100,12 @@ function XYLegend() {
   return /* @__PURE__ */ jsx(
     ChartLegend,
     {
-      interactionsDisabled,
       items: legendItems,
       orientation,
       truncationMode,
-      onSeriesAction: interactionsDisabled ? void 0 : legendActions,
-      onHover: interactionsDisabled ? void 0 : (legendItem) => updateHighlightedSeriesId(legendItem?.id)
+      onSeriesAction: legendActions,
+      onHover: (legendItem) => updateHighlightedSeriesId(legendItem?.id),
+      onClick: updateVisibleSeries
     }
   );
 }

package/esm/charts/xy-chart/components/legend/XYLegend/XYLegend.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/legend/XYLegend/XYLegend.tsx"],
-  "sourcesContent": ["import type { ScaleOrdinal } from 'd3-scale';\nimport { useMemo } from 'react';\n\nimport { getXYLegendActions } from './utils/getXYLegendActions.js';\nimport {\n  AREA_CHART_ICON_SHAPE,\n  BAR_CHART_ICON_SHAPE,\n  LINE_CHART_ICON_SHAPE,\n  RECT_CHART_ICON_SHAPE,\n  XYLegendIcon,\n} from './XYLegendIcon.js';\nimport { useChartLayoutOrientation } from '../../../../core/components/chart-layout/hooks/useChartLayoutOrientation.js';\nimport { getLegendOrientation } from '../../../../core/components/chart-layout/utils/orientation.js';\nimport { ChartLegend } from '../../../../core/components/legend/categorical/ChartLegend.js';\nimport type { LegendItem } from '../../../../core/components/legend/categorical/types/legend.js';\nimport { buildCategoricalItemsFromScale } from '../../../../core/utils/build-categorical-items-from-scale.js';\nimport { isFeatureEnabled } from '../../../../core/utils/is-feature-enabled.js';\nimport { safeGet } from '../../../../core/utils/safe-get.js';\nimport type { SeriesIdToColorScale } from '../../../context/XYChartColorScales.context.js';\nimport { useXYChartColorScales } from '../../../hooks/useXYChartColorScales.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartTruncationMode } from '../../../hooks/useXYChartTruncationMode.js';\nimport { useSetState } from '../../../store/selectors.js';\nimport {\n  AREA_VARIANT,\n  type AreaSeriesWithDatapoints,\n  BAR_VARIANT,\n  type BarSeriesWithDatapoints,\n  DOT_VARIANT,\n  type DotSeriesWithDatapoints,\n  LINE_VARIANT,\n  type LineSeriesWithDatapoints,\n  RECT_VARIANT,\n  type RectSeriesWithDatapoints,\n  type SeriesToMetadata,\n} from '../../../types/xy-chart-internals.js';\nimport { isRangeLegend } from '../../../utils/is-range-legend.js';\nimport { isRectSeries } from '../../../utils/type-guards.js';\n\nconst CHART_ICONS = {\n  [LINE_VARIANT]: LINE_CHART_ICON_SHAPE,\n  [BAR_VARIANT]: BAR_CHART_ICON_SHAPE,\n  [RECT_VARIANT]: RECT_CHART_ICON_SHAPE,\n  [AREA_VARIANT]: AREA_CHART_ICON_SHAPE,\n} as const;\n\nfunction getLegendItems(\n  series: (\n    | DotSeriesWithDatapoints\n    | LineSeriesWithDatapoints\n    | BarSeriesWithDatapoints\n    | RectSeriesWithDatapoints\n    | AreaSeriesWithDatapoints\n  )[],\n  metadata: SeriesToMetadata,\n  isMixedSeries: boolean,\n  scaleColorMap: SeriesIdToColorScale,\n  isCategoricalRectOnly: boolean,\n) {\n  return series.flatMap((series) => {\n    if (series.type === RECT_VARIANT) {\n      if (isRangeLegend(metadata, series)) {\n        return [];\n      }\n\n      const scale = safeGet(scaleColorMap, series.id) as ScaleOrdinal<\n        string,\n        string\n      >;\n      const overrideItems = safeGet(metadata, series).categoricalColorOverrides;\n\n      const shape = isCategoricalRectOnly ? 'circle' : CHART_ICONS[series.type];\n\n      const items = buildCategoricalItemsFromScale(\n        scale,\n        overrideItems,\n        //We need to compare exactly the same id when an action is selected\n        //In RectSeries, categories are unique per series.\n        (category: string) => `${series.id}--${category}`,\n      );\n\n      return items.map((item: LegendItem) => ({\n        ...item,\n        icon: <XYLegendIcon color={item.color.Default} shape={shape} />,\n      }));\n    } else {\n      const { name, color, shape = 'circle' } = safeGet(metadata, series);\n      const iconShape =\n        isMixedSeries && series.type !== DOT_VARIANT\n          ? CHART_ICONS[series.type]\n          : shape;\n\n      return {\n        id: series.id,\n        color,\n        name,\n        icon: <XYLegendIcon color={color.Default} shape={iconShape} />,\n      };\n    }\n  });\n}\n\nexport function XYLegend() {\n  const { orientation: layoutOrientation } = useChartLayoutOrientation();\n  const orientation = getLegendOrientation(layoutOrientation);\n  const { seriesWithDatapoints, seriesToMetadata } = useXYChartData();\n\n  const setState = useSetState();\n  const scaleColorMap = useXYChartColorScales();\n\n  const { truncationMode } = useXYChartTruncationMode();\n\n  const firstSeries = seriesWithDatapoints[0];\n  const isCategoricalRectOnly =\n    isRectSeries(firstSeries) &&\n    seriesWithDatapoints.every(isRectSeries) &&\n    !isRangeLegend(seriesToMetadata, firstSeries);\n\n  const isMixedSeries = useMemo(() => {\n    const typeSet = new Set(seriesWithDatapoints.map((series) => series.type));\n    return typeSet.size >= 2;\n  }, [seriesWithDatapoints]);\n\n  const legendItems = getLegendItems(\n    seriesWithDatapoints,\n    seriesToMetadata,\n    isMixedSeries,\n    scaleColorMap,\n    isCategoricalRectOnly,\n  );\n\n  const legendActions = getXYLegendActions(\n    seriesWithDatapoints,\n    seriesToMetadata,\n  );\n\n  //TODO: Remove feature flag in APPDEV-16183\n  const interactionsDisabled = !isFeatureEnabled(\n    'areLegendInteractionsEnabled',\n  );\n\n  const updateHighlightedSeriesId = (legendItemId?: string) => {\n    setState((prev) => ({ ...prev, highlightedSeriesId: legendItemId }));\n  };\n\n  return (\n    <ChartLegend\n      //TODO: Remove feature flag in APPDEV-16183\n      interactionsDisabled={interactionsDisabled}\n      items={legendItems}\n      orientation={orientation}\n      truncationMode={truncationMode}\n      //TODO: Remove feature flag in APPDEV-16183\n      onSeriesAction={interactionsDisabled ? undefined : legendActions}\n      onHover={\n        interactionsDisabled\n          ? undefined\n          : (legendItem) => updateHighlightedSeriesId(legendItem?.id)\n      }\n    />\n  );\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import type { ScaleOrdinal } from 'd3-scale';\nimport { useCallback, useMemo } from 'react';\n\nimport { getXYLegendActions } from './utils/getXYLegendActions.js';\nimport {\n  AREA_CHART_ICON_SHAPE,\n  BAR_CHART_ICON_SHAPE,\n  LINE_CHART_ICON_SHAPE,\n  RECT_CHART_ICON_SHAPE,\n  XYLegendIcon,\n} from './XYLegendIcon.js';\nimport { useChartLayoutOrientation } from '../../../../core/components/chart-layout/hooks/useChartLayoutOrientation.js';\nimport { getLegendOrientation } from '../../../../core/components/chart-layout/utils/orientation.js';\nimport { ChartLegend } from '../../../../core/components/legend/categorical/ChartLegend.js';\nimport type { LegendItem } from '../../../../core/components/legend/categorical/types/legend.js';\nimport { buildCategoricalItemsFromScale } from '../../../../core/utils/build-categorical-items-from-scale.js';\nimport { safeGet } from '../../../../core/utils/safe-get.js';\nimport type { SeriesIdToColorScale } from '../../../context/XYChartColorScales.context.js';\nimport { useXYChartColorScales } from '../../../hooks/useXYChartColorScales.js';\nimport { useXYChartTruncationMode } from '../../../hooks/useXYChartTruncationMode.js';\nimport { reduceFilterSeries } from '../../../store/reducer-filter-series.js';\nimport { useSetState } from '../../../store/selectors.js';\nimport {\n  AREA_VARIANT,\n  type AreaSeriesWithDatapoints,\n  BAR_VARIANT,\n  type BarSeriesWithDatapoints,\n  DOT_VARIANT,\n  type DotSeriesWithDatapoints,\n  LINE_VARIANT,\n  type LineSeriesWithDatapoints,\n  RECT_VARIANT,\n  type RectSeriesWithDatapoints,\n  type SeriesToMetadata,\n  type XYChartSeriesWithDatapoints,\n} from '../../../types/xy-chart-internals.js';\nimport { isRangeLegend } from '../../../utils/is-range-legend.js';\nimport { isRectSeries } from '../../../utils/type-guards.js';\n\nconst CHART_ICONS = {\n  [LINE_VARIANT]: LINE_CHART_ICON_SHAPE,\n  [BAR_VARIANT]: BAR_CHART_ICON_SHAPE,\n  [RECT_VARIANT]: RECT_CHART_ICON_SHAPE,\n  [AREA_VARIANT]: AREA_CHART_ICON_SHAPE,\n} as const;\n\nfunction getLegendItems(\n  series: (\n    | DotSeriesWithDatapoints\n    | LineSeriesWithDatapoints\n    | BarSeriesWithDatapoints\n    | RectSeriesWithDatapoints\n    | AreaSeriesWithDatapoints\n  )[],\n  metadata: SeriesToMetadata,\n  isMixedSeries: boolean,\n  scaleColorMap: SeriesIdToColorScale,\n  isCategoricalRectOnly: boolean,\n) {\n  return series.flatMap((series) => {\n    if (series.type === RECT_VARIANT) {\n      if (isRangeLegend(metadata, series)) {\n        return [];\n      }\n      const scale = safeGet(scaleColorMap, series.id) as ScaleOrdinal<\n        string,\n        string\n      >;\n      const overrideItems = safeGet(metadata, series).categoricalColorOverrides;\n\n      const shape = isCategoricalRectOnly ? 'circle' : CHART_ICONS[series.type];\n\n      const items = buildCategoricalItemsFromScale(\n        scale,\n        overrideItems,\n        //We need to compare exactly the same id when an action is selected\n        //In RectSeries, categories are unique per series.\n        (category: string) => `${series.id}--${category}`,\n      );\n\n      return items.map((item: LegendItem) => ({\n        ...item,\n        icon: <XYLegendIcon color={item.color.Default} shape={shape} />,\n      }));\n    } else {\n      const { name, color, shape = 'circle' } = safeGet(metadata, series);\n      const iconShape =\n        isMixedSeries && series.type !== DOT_VARIANT\n          ? CHART_ICONS[series.type]\n          : shape;\n\n      return {\n        id: series.id,\n        color,\n        name,\n        icon: <XYLegendIcon color={color.Default} shape={iconShape} />,\n      };\n    }\n  });\n}\n\ninterface XYLegendProps {\n  series: XYChartSeriesWithDatapoints[];\n  seriesToMetadata: SeriesToMetadata;\n}\n\nexport function XYLegend({ series, seriesToMetadata }: XYLegendProps) {\n  const { orientation: layoutOrientation } = useChartLayoutOrientation();\n  const orientation = getLegendOrientation(layoutOrientation);\n  const setState = useSetState();\n\n  const scaleColorMap = useXYChartColorScales();\n\n  const { truncationMode } = useXYChartTruncationMode();\n\n  const firstSeries = series[0];\n  const isCategoricalRectOnly =\n    isRectSeries(firstSeries) &&\n    series.every(isRectSeries) &&\n    !isRangeLegend(seriesToMetadata, firstSeries);\n\n  const isMixedSeries = useMemo(() => {\n    const typeSet = new Set(series.map((s) => s.type));\n    return typeSet.size >= 2;\n  }, [series]);\n\n  const legendItems = useMemo(\n    () =>\n      getLegendItems(\n        series,\n        seriesToMetadata,\n        isMixedSeries,\n        scaleColorMap,\n        isCategoricalRectOnly,\n      ),\n    [series, seriesToMetadata],\n  );\n\n  const legendActions = getXYLegendActions(series, seriesToMetadata);\n\n  const updateVisibleSeries = useCallback(\n    (visibleItems: LegendItem[]) => {\n      const visibleIds = new Set(visibleItems.map((item) => item.id));\n\n      setState(reduceFilterSeries(visibleIds));\n    },\n    [setState],\n  );\n\n  const updateHighlightedSeriesId = (legendItemId?: string) => {\n    setState((prev) => ({ ...prev, highlightedSeriesId: legendItemId }));\n  };\n\n  return (\n    <ChartLegend\n      items={legendItems}\n      orientation={orientation}\n      truncationMode={truncationMode}\n      onSeriesAction={legendActions}\n      onHover={(legendItem) => updateHighlightedSeriesId(legendItem?.id)}\n      onClick={updateVisibleSeries}\n    />\n  );\n}\n"],
+  "mappings": "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",
   "names": ["series"]
 }

package/esm/charts/xy-chart/components/legend/XYLegend/utils/getXYLegendActions.js

@@ -2,6 +2,8 @@ import { Fragment } from "react";
 import { ChartSeriesAction } from "../../../../../core/components/series-action/ChartSeriesAction.js";
 import { safeGet } from "../../../../../core/utils/safe-get.js";
 import {
+  AREA_VARIANT,
+  BAR_VARIANT,
   RECT_VARIANT
 } from "../../../../types/xy-chart-internals.js";
 function filterRectDatapointsByCategory(series, categoryName) {
@@ -21,9 +23,11 @@ function getXYLegendActions(seriesWithDatapoints, seriesToMetadata) {
     if (currentSeries) {
       const metadata = safeGet(seriesToMetadata, currentSeries);
       const datapoints = currentSeries.type === RECT_VARIANT ? filterRectDatapointsByCategory(currentSeries, item.name) : currentSeries.data;
+      const isAreaOrBarSeries = currentSeries.type === AREA_VARIANT || currentSeries.type === BAR_VARIANT;
       const firstDatapoint = datapoints[0];
+      const datapointElement = isAreaOrBarSeries ? { datapoint: firstDatapoint, name: item.name } : firstDatapoint;
       const seriesActions = metadata.actions?.(
-        firstDatapoint,
+        datapointElement,
         { datapoints, name: item.name }
       );
       if (seriesActions) {

package/esm/charts/xy-chart/components/legend/XYLegend/utils/getXYLegendActions.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/xy-chart/components/legend/XYLegend/utils/getXYLegendActions.ts"],
-  "sourcesContent": ["import { Fragment } from 'react';\n\nimport type { LegendItem } from '../../../../../core/components/legend/categorical/types/legend.js';\nimport { ChartSeriesAction } from '../../../../../core/components/series-action/ChartSeriesAction.js';\nimport type { SeriesActionsTemplate } from '../../../../../core/types/series-actions-template.js';\nimport { safeGet } from '../../../../../core/utils/safe-get.js';\nimport {\n  RECT_VARIANT,\n  type RectSeriesWithDatapoints,\n  type SeriesToMetadata,\n  type XYChartSeriesWithDatapoints,\n} from '../../../../types/xy-chart-internals.js';\n\n/**\n * Filters rect series datapoints to only those matching the selected category.\n * For categorical RectSeries, each legend item represents a category.\n */\nfunction filterRectDatapointsByCategory(\n  series: RectSeriesWithDatapoints,\n  categoryName: string,\n) {\n  return series.data.filter((datapoint) => datapoint.value === categoryName);\n}\n\nexport function getXYLegendActions(\n  seriesWithDatapoints: XYChartSeriesWithDatapoints[],\n  seriesToMetadata: SeriesToMetadata,\n) {\n  return (item?: LegendItem) => {\n    if (!item) {\n      return;\n    }\n\n    const currentSeries = seriesWithDatapoints.find((s) => {\n      if (s.type === RECT_VARIANT) {\n        return item.id === `${s.id}--${item.name}`;\n      }\n      return s.id === item.id;\n    });\n\n    if (currentSeries) {\n      const metadata = safeGet(seriesToMetadata, currentSeries);\n\n      const datapoints =\n        currentSeries.type === RECT_VARIANT\n          ? filterRectDatapointsByCategory(currentSeries, item.name)\n          : currentSeries.data;\n\n      const firstDatapoint = datapoints[0];\n\n      const seriesActions: SeriesActionsTemplate = metadata.actions?.(\n        firstDatapoint,\n        { datapoints, name: item.name },\n      );\n\n      if (seriesActions) {\n        if (\n          seriesActions instanceof Promise ||\n          seriesActions.type === ChartSeriesAction ||\n          seriesActions.type === Fragment\n        ) {\n          return seriesActions;\n        } else {\n          throw new Error('Invalid type passed for getXYLegendActions!');\n        }\n      }\n    }\n  };\n}\n"],
-  "mappings": "AAAA,SAAS,gBAAgB;AAGzB,SAAS,yBAAyB;AAElC,SAAS,eAAe;AACxB;AAAA,EACE;AAAA,OAIK;AAMP,SAAS,+BACP,QACA,cACA;AACA,SAAO,OAAO,KAAK,OAAO,CAAC,cAAc,UAAU,UAAU,YAAY;AAC3E;AAEO,SAAS,mBACd,sBACA,kBACA;AACA,SAAO,CAAC,SAAsB;AAC5B,QAAI,CAAC,MAAM;AACT;AAAA,IACF;AAEA,UAAM,gBAAgB,qBAAqB,KAAK,CAAC,MAAM;AACrD,UAAI,EAAE,SAAS,cAAc;AAC3B,eAAO,KAAK,OAAO,GAAG,EAAE,EAAE,KAAK,KAAK,IAAI;AAAA,MAC1C;AACA,aAAO,EAAE,OAAO,KAAK;AAAA,IACvB,CAAC;AAED,QAAI,eAAe;AACjB,YAAM,WAAW,QAAQ,kBAAkB,aAAa;AAExD,YAAM,aACJ,cAAc,SAAS,eACnB,+BAA+B,eAAe,KAAK,IAAI,IACvD,cAAc;AAEpB,YAAM,iBAAiB,WAAW,CAAC;AAEnC,YAAM,gBAAuC,SAAS;AAAA,QACpD;AAAA,QACA,EAAE,YAAY,MAAM,KAAK,KAAK;AAAA,MAChC;AAEA,UAAI,eAAe;AACjB,YACE,yBAAyB,WACzB,cAAc,SAAS,qBACvB,cAAc,SAAS,UACvB;AACA,iBAAO;AAAA,QACT,OAAO;AACL,gBAAM,IAAI,MAAM,6CAA6C;AAAA,QAC/D;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;",
+  "sourcesContent": ["import { Fragment } from 'react';\n\nimport type { LegendItem } from '../../../../../core/components/legend/categorical/types/legend.js';\nimport { ChartSeriesAction } from '../../../../../core/components/series-action/ChartSeriesAction.js';\nimport type { SeriesActionsTemplate } from '../../../../../core/types/series-actions-template.js';\nimport { safeGet } from '../../../../../core/utils/safe-get.js';\nimport {\n  AREA_VARIANT,\n  BAR_VARIANT,\n  RECT_VARIANT,\n  type RectSeriesWithDatapoints,\n  type SeriesToMetadata,\n  type XYChartSeriesWithDatapoints,\n} from '../../../../types/xy-chart-internals.js';\n\n/**\n * Filters rect series datapoints to only those matching the selected category.\n * For categorical RectSeries, each legend item represents a category.\n */\nfunction filterRectDatapointsByCategory(\n  series: RectSeriesWithDatapoints,\n  categoryName: string,\n) {\n  return series.data.filter((datapoint) => datapoint.value === categoryName);\n}\n\nexport function getXYLegendActions(\n  seriesWithDatapoints: XYChartSeriesWithDatapoints[],\n  seriesToMetadata: SeriesToMetadata,\n) {\n  return (item?: LegendItem) => {\n    if (!item) {\n      return;\n    }\n\n    const currentSeries = seriesWithDatapoints.find((s) => {\n      if (s.type === RECT_VARIANT) {\n        return item.id === `${s.id}--${item.name}`;\n      }\n      return s.id === item.id;\n    });\n\n    if (currentSeries) {\n      const metadata = safeGet(seriesToMetadata, currentSeries);\n\n      const datapoints =\n        currentSeries.type === RECT_VARIANT\n          ? filterRectDatapointsByCategory(currentSeries, item.name)\n          : currentSeries.data;\n\n      const isAreaOrBarSeries =\n        currentSeries.type === AREA_VARIANT ||\n        currentSeries.type === BAR_VARIANT;\n\n      const firstDatapoint = datapoints[0];\n\n      const datapointElement = isAreaOrBarSeries\n        ? { datapoint: firstDatapoint, name: item.name }\n        : firstDatapoint;\n\n      const seriesActions: SeriesActionsTemplate = metadata.actions?.(\n        datapointElement,\n        { datapoints, name: item.name },\n      );\n\n      if (seriesActions) {\n        if (\n          seriesActions instanceof Promise ||\n          seriesActions.type === ChartSeriesAction ||\n          seriesActions.type === Fragment\n        ) {\n          return seriesActions;\n        } else {\n          throw new Error('Invalid type passed for getXYLegendActions!');\n        }\n      }\n    }\n  };\n}\n"],
+  "mappings": "AAAA,SAAS,gBAAgB;AAGzB,SAAS,yBAAyB;AAElC,SAAS,eAAe;AACxB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AAMP,SAAS,+BACP,QACA,cACA;AACA,SAAO,OAAO,KAAK,OAAO,CAAC,cAAc,UAAU,UAAU,YAAY;AAC3E;AAEO,SAAS,mBACd,sBACA,kBACA;AACA,SAAO,CAAC,SAAsB;AAC5B,QAAI,CAAC,MAAM;AACT;AAAA,IACF;AAEA,UAAM,gBAAgB,qBAAqB,KAAK,CAAC,MAAM;AACrD,UAAI,EAAE,SAAS,cAAc;AAC3B,eAAO,KAAK,OAAO,GAAG,EAAE,EAAE,KAAK,KAAK,IAAI;AAAA,MAC1C;AACA,aAAO,EAAE,OAAO,KAAK;AAAA,IACvB,CAAC;AAED,QAAI,eAAe;AACjB,YAAM,WAAW,QAAQ,kBAAkB,aAAa;AAExD,YAAM,aACJ,cAAc,SAAS,eACnB,+BAA+B,eAAe,KAAK,IAAI,IACvD,cAAc;AAEpB,YAAM,oBACJ,cAAc,SAAS,gBACvB,cAAc,SAAS;AAEzB,YAAM,iBAAiB,WAAW,CAAC;AAEnC,YAAM,mBAAmB,oBACrB,EAAE,WAAW,gBAAgB,MAAM,KAAK,KAAK,IAC7C;AAEJ,YAAM,gBAAuC,SAAS;AAAA,QACpD;AAAA,QACA,EAAE,YAAY,MAAM,KAAK,KAAK;AAAA,MAChC;AAEA,UAAI,eAAe;AACjB,YACE,yBAAyB,WACzB,cAAc,SAAS,qBACvB,cAAc,SAAS,UACvB;AACA,iBAAO;AAAA,QACT,OAAO;AACL,gBAAM,IAAI,MAAM,6CAA6C;AAAA,QAC/D;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;",
   "names": []
 }

package/esm/charts/xy-chart/components/legend/XYLegend/xy-legend.css

@@ -1,3 +1,3 @@
-._1lwufqz0-3-0-1 {
+._1lwufqz0-3-1-0 {
   margin: var(--dt-spacings-size-2, 2px);
 }

package/esm/charts/xy-chart/components/legend/XYLegend/xy-legend.sty.js

@@ -1,5 +1,5 @@
 import "./xy-legend.css";
-var shapeIconWrapper = "_1lwufqz0-3-0-1";
+var shapeIconWrapper = "_1lwufqz0-3-1-0";
 export {
   shapeIconWrapper
 };

package/esm/charts/xy-chart/components/legend/XYLegend/xy-legend.sty.js.map

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

package/esm/charts/xy-chart/components/overlay/explore/XYChartCrosshair.css

@@ -1,4 +1,4 @@
-._1bbe5uo0-3-0-1 {
+._1bbe5uo0-3-1-0 {
   overflow: visible;
   cursor: crosshair;
   z-index: 1;

package/esm/charts/xy-chart/components/overlay/explore/XYChartCrosshair.sty.js

@@ -1,5 +1,5 @@
 import "./XYChartCrosshair.css";
-var crosshair = "_1bbe5uo0-3-0-1";
+var crosshair = "_1bbe5uo0-3-1-0";
 export {
   crosshair
 };

package/esm/charts/xy-chart/components/overlay/explore/XYChartCrosshair.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/overlay/explore/XYChartCrosshair.css.ts"],
-  "sourcesContent": ["import './XYChartCrosshair.css';\nexport var crosshair = '_1bbe5uo0-3-0-1';"],
+  "sourcesContent": ["import './XYChartCrosshair.css';\nexport var crosshair = '_1bbe5uo0-3-1-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,YAAY;",
   "names": []
 }

package/esm/charts/xy-chart/components/overlay/explore/XYChartExplore.css

@@ -1,4 +1,4 @@
-._cd1yys0-3-0-1 {
+._cd1yys0-3-1-0 {
   top: -11px;
   left: -11px;
   width: calc(100% + 22px);
@@ -6,7 +6,7 @@
   z-index: 2;
   pointer-events: none;
 }
-._cd1yys1-3-0-1 {
+._cd1yys1-3-1-0 {
   top: 0px;
   left: 0px;
   width: calc(100% + 1px);

package/esm/charts/xy-chart/components/overlay/explore/XYChartExplore.sty.js

@@ -1,7 +1,7 @@
 import "../../../../core/components/chart-grid/ChartGrid.css";
 import "./XYChartExplore.css";
-var datapointIndicatorLayout = "_cd1yys1-3-0-1 _13lzg4k0-3-0-1";
-var datapointIndicatorShiftedLayout = "_cd1yys0-3-0-1 _13lzg4k0-3-0-1";
+var datapointIndicatorLayout = "_cd1yys1-3-1-0 _13lzg4k0-3-1-0";
+var datapointIndicatorShiftedLayout = "_cd1yys0-3-1-0 _13lzg4k0-3-1-0";
 export {
   datapointIndicatorLayout,
   datapointIndicatorShiftedLayout

package/esm/charts/xy-chart/components/overlay/explore/XYChartExplore.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/overlay/explore/XYChartExplore.css.ts"],
-  "sourcesContent": ["import '../../../../core/components/chart-grid/ChartGrid.css';\nimport './XYChartExplore.css';\nexport var datapointIndicatorLayout = '_cd1yys1-3-0-1 _13lzg4k0-3-0-1';\nexport var datapointIndicatorShiftedLayout = '_cd1yys0-3-0-1 _13lzg4k0-3-0-1';"],
+  "sourcesContent": ["import '../../../../core/components/chart-grid/ChartGrid.css';\nimport './XYChartExplore.css';\nexport var datapointIndicatorLayout = '_cd1yys1-3-1-0 _13lzg4k0-3-1-0';\nexport var datapointIndicatorShiftedLayout = '_cd1yys0-3-1-0 _13lzg4k0-3-1-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACA,IAAI,2BAA2B;AAC/B,IAAI,kCAAkC;",
   "names": []
 }

package/esm/charts/xy-chart/components/overlay/explore/XYChartLinearPoint.js

@@ -28,13 +28,16 @@ const XYChartLinearPoint = memo(() => {
   const { axes, datapointMetadataMap } = useXYChartData();
   const {
     seriesToMetadata: dotSeriesMeta,
-    seriesWithDatapoints: dotSeriesWithDatapoints
+    filteredSeriesWithDatapoints: dotSeriesWithDatapoints
   } = useDotData();
   const {
     seriesToMetadata: lineSeriesMeta,
-    seriesWithDatapoints: lineSeriesWithDatapoints
+    filteredSeriesWithDatapoints: lineSeriesWithDatapoints
   } = useLineData();
-  const { seriesToMetadata: areaSeriesMeta } = useAreaData();
+  const {
+    seriesToMetadata: areaSeriesMeta,
+    filteredSeriesWithDatapoints: areaSeriesWithDatapoints
+  } = useAreaData();
   const showContentPoint = hasLinearContentPoint(contentState);
   const showPoint = !showContentPoint && (!selectState || linearSelection.selectionConfigByAxisId.size === 0);
   if (showPoint) {
@@ -47,10 +50,13 @@ const XYChartLinearPoint = memo(() => {
     axisIdToScales,
     dotSeriesWithDatapoints,
     lineSeriesWithDatapoints,
+    areaSeriesWithDatapoints,
     dotSeriesMeta,
     lineSeriesMeta,
+    areaSeriesMeta,
     axisIdToScaleDomain,
-    axes
+    axes,
+    datapointMetadataMap
   });
   const contentPoints = showContentPoint ? buildContentHighlightedPoint({
     contentState,

package/esm/charts/xy-chart/components/overlay/explore/XYChartLinearPoint.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/overlay/explore/XYChartLinearPoint.tsx"],
-  "sourcesContent": ["import { memo, type MutableRefObject } from 'react';\n\nimport { HighlightedPointCanvas } from './HighlightedPointCanvas.js';\nimport { datapointIndicatorShiftedLayout } from './XYChartExplore.sty.js';\nimport { Canvas } from '../../../../core/components/canvas/Canvas.js';\nimport { CanvasContext } from '../../../../core/components/canvas/CanvasContext.js';\nimport type { CanvasShape } from '../../../../core/components/canvas/types/canvas-shape.js';\nimport { useGridPlotSize } from '../../../../core/components/chart-grid/hooks/useGridPlotSize.js';\nimport { POINT_OVERLAY_PADDING } from '../../../../core/components/data-point/constants.js';\nimport { useAreaData } from '../../../hooks/useAreaData.js';\nimport { useDotData } from '../../../hooks/useDotData.js';\nimport { useLineData } from '../../../hooks/useLineData.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartLinearSelection } from '../../../hooks/useXYChartLinearSelection.js';\nimport { useXYChartScales } from '../../../hooks/useXYChartScales.js';\nimport { useContentState, useSelectState } from '../../../store/selectors.js';\nimport { type HighlightedLinearPoint } from '../../../types/xy-chart-internals.js';\nimport {\n  buildContentHighlightedPoint,\n  buildSelectionHighlightedPoints,\n  hasLinearContentPoint,\n} from '../utils/get-selected-datapoints.js';\n\nexport const XYChartLinearPoint = memo(() => {\n  const contentState = useContentState();\n  const selectState = useSelectState();\n  const { width, height } = useGridPlotSize();\n  const axisIdToScales = useXYChartScales();\n  const linearSelection = useXYChartLinearSelection();\n  const { axisIdToScaleDomain } = useXYChartData();\n  const { axes, datapointMetadataMap } = useXYChartData();\n\n  const {\n    seriesToMetadata: dotSeriesMeta,\n    seriesWithDatapoints: dotSeriesWithDatapoints,\n  } = useDotData();\n  const {\n    seriesToMetadata: lineSeriesMeta,\n    seriesWithDatapoints: lineSeriesWithDatapoints,\n  } = useLineData();\n  const { seriesToMetadata: areaSeriesMeta } = useAreaData();\n\n  const showContentPoint = hasLinearContentPoint(contentState);\n\n  const showPoint =\n    !showContentPoint &&\n    (!selectState || linearSelection.selectionConfigByAxisId.size === 0);\n\n  if (showPoint) {\n    return null;\n  }\n\n  const selectionPoints = buildSelectionHighlightedPoints({\n    selectState,\n    linearSelection,\n    width,\n    axisIdToScales,\n    dotSeriesWithDatapoints,\n    lineSeriesWithDatapoints,\n    dotSeriesMeta,\n    lineSeriesMeta,\n    axisIdToScaleDomain,\n    axes,\n  });\n\n  const contentPoints = showContentPoint\n    ? buildContentHighlightedPoint({\n        contentState,\n        axisIdToScales,\n        dotSeriesMeta,\n        lineSeriesMeta,\n        areaSeriesMeta,\n        axisIdToScaleDomain,\n        datapointMetadataMap,\n      })\n    : [];\n\n  const highlightedPoints: HighlightedLinearPoint[] = [\n    ...selectionPoints,\n    ...contentPoints,\n  ];\n\n  if (!highlightedPoints.length) {\n    return null;\n  }\n\n  return (\n    <div className={datapointIndicatorShiftedLayout}>\n      <CanvasContext.Provider\n        value={{\n          shapeRefs: new Map<string, MutableRefObject<CanvasShape>>(),\n        }}\n      >\n        <Canvas\n          width={width + 2 * POINT_OVERLAY_PADDING}\n          height={height + 2 * POINT_OVERLAY_PADDING}\n        >\n          <HighlightedPointCanvas points={highlightedPoints} />\n        </Canvas>\n      </CanvasContext.Provider>\n    </div>\n  );\n});\n\nXYChartLinearPoint['displayName'] = 'XYChartLinearPoint';\n"],
-  "mappings": "AAiGU;AAjGV,SAAS,YAAmC;AAE5C,SAAS,8BAA8B;AACvC,SAAS,uCAAuC;AAChD,SAAS,cAAc;AACvB,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;AACtC,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,iCAAiC;AAC1C,SAAS,wBAAwB;AACjC,SAAS,iBAAiB,sBAAsB;AAEhD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,MAAM,qBAAqB,KAAK,MAAM;AAC3C,QAAM,eAAe,gBAAgB;AACrC,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,OAAO,OAAO,IAAI,gBAAgB;AAC1C,QAAM,iBAAiB,iBAAiB;AACxC,QAAM,kBAAkB,0BAA0B;AAClD,QAAM,EAAE,oBAAoB,IAAI,eAAe;AAC/C,QAAM,EAAE,MAAM,qBAAqB,IAAI,eAAe;AAEtD,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,sBAAsB;AAAA,EACxB,IAAI,WAAW;AACf,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,sBAAsB;AAAA,EACxB,IAAI,YAAY;AAChB,QAAM,EAAE,kBAAkB,eAAe,IAAI,YAAY;AAEzD,QAAM,mBAAmB,sBAAsB,YAAY;AAE3D,QAAM,YACJ,CAAC,qBACA,CAAC,eAAe,gBAAgB,wBAAwB,SAAS;AAEpE,MAAI,WAAW;AACb,WAAO;AAAA,EACT;AAEA,QAAM,kBAAkB,gCAAgC;AAAA,IACtD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,mBAClB,6BAA6B;AAAA,IAC3B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,IACD,CAAC;AAEL,QAAM,oBAA8C;AAAA,IAClD,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAEA,MAAI,CAAC,kBAAkB,QAAQ;AAC7B,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,SAAI,WAAW,iCACd;AAAA,IAAC,cAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL,WAAW,oBAAI,IAA2C;AAAA,MAC5D;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,QAAQ,IAAI;AAAA,UACnB,QAAQ,SAAS,IAAI;AAAA,UAErB,8BAAC,0BAAuB,QAAQ,mBAAmB;AAAA;AAAA,MACrD;AAAA;AAAA,EACF,GACF;AAEJ,CAAC;AAED,mBAAmB,aAAa,IAAI;",
+  "sourcesContent": ["import { memo, type MutableRefObject } from 'react';\n\nimport { HighlightedPointCanvas } from './HighlightedPointCanvas.js';\nimport { datapointIndicatorShiftedLayout } from './XYChartExplore.sty.js';\nimport { Canvas } from '../../../../core/components/canvas/Canvas.js';\nimport { CanvasContext } from '../../../../core/components/canvas/CanvasContext.js';\nimport type { CanvasShape } from '../../../../core/components/canvas/types/canvas-shape.js';\nimport { useGridPlotSize } from '../../../../core/components/chart-grid/hooks/useGridPlotSize.js';\nimport { POINT_OVERLAY_PADDING } from '../../../../core/components/data-point/constants.js';\nimport { useAreaData } from '../../../hooks/useAreaData.js';\nimport { useDotData } from '../../../hooks/useDotData.js';\nimport { useLineData } from '../../../hooks/useLineData.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartLinearSelection } from '../../../hooks/useXYChartLinearSelection.js';\nimport { useXYChartScales } from '../../../hooks/useXYChartScales.js';\nimport { useContentState, useSelectState } from '../../../store/selectors.js';\nimport { type HighlightedLinearPoint } from '../../../types/xy-chart-internals.js';\nimport {\n  buildContentHighlightedPoint,\n  buildSelectionHighlightedPoints,\n  hasLinearContentPoint,\n} from '../utils/get-selected-datapoints.js';\n\nexport const XYChartLinearPoint = memo(() => {\n  const contentState = useContentState();\n  const selectState = useSelectState();\n  const { width, height } = useGridPlotSize();\n  const axisIdToScales = useXYChartScales();\n  const linearSelection = useXYChartLinearSelection();\n  const { axisIdToScaleDomain } = useXYChartData();\n  const { axes, datapointMetadataMap } = useXYChartData();\n\n  const {\n    seriesToMetadata: dotSeriesMeta,\n    filteredSeriesWithDatapoints: dotSeriesWithDatapoints,\n  } = useDotData();\n  const {\n    seriesToMetadata: lineSeriesMeta,\n    filteredSeriesWithDatapoints: lineSeriesWithDatapoints,\n  } = useLineData();\n  const {\n    seriesToMetadata: areaSeriesMeta,\n    filteredSeriesWithDatapoints: areaSeriesWithDatapoints,\n  } = useAreaData();\n\n  const showContentPoint = hasLinearContentPoint(contentState);\n\n  const showPoint =\n    !showContentPoint &&\n    (!selectState || linearSelection.selectionConfigByAxisId.size === 0);\n\n  if (showPoint) {\n    return null;\n  }\n\n  const selectionPoints = buildSelectionHighlightedPoints({\n    selectState,\n    linearSelection,\n    width,\n    axisIdToScales,\n    dotSeriesWithDatapoints,\n    lineSeriesWithDatapoints,\n    areaSeriesWithDatapoints,\n    dotSeriesMeta,\n    lineSeriesMeta,\n    areaSeriesMeta,\n    axisIdToScaleDomain,\n    axes,\n    datapointMetadataMap,\n  });\n\n  const contentPoints = showContentPoint\n    ? buildContentHighlightedPoint({\n        contentState,\n        axisIdToScales,\n        dotSeriesMeta,\n        lineSeriesMeta,\n        areaSeriesMeta,\n        axisIdToScaleDomain,\n        datapointMetadataMap,\n      })\n    : [];\n\n  const highlightedPoints: HighlightedLinearPoint[] = [\n    ...selectionPoints,\n    ...contentPoints,\n  ];\n\n  if (!highlightedPoints.length) {\n    return null;\n  }\n\n  return (\n    <div className={datapointIndicatorShiftedLayout}>\n      <CanvasContext.Provider\n        value={{\n          shapeRefs: new Map<string, MutableRefObject<CanvasShape>>(),\n        }}\n      >\n        <Canvas\n          width={width + 2 * POINT_OVERLAY_PADDING}\n          height={height + 2 * POINT_OVERLAY_PADDING}\n        >\n          <HighlightedPointCanvas points={highlightedPoints} />\n        </Canvas>\n      </CanvasContext.Provider>\n    </div>\n  );\n});\n\nXYChartLinearPoint['displayName'] = 'XYChartLinearPoint';\n"],
+  "mappings": "AAuGU;AAvGV,SAAS,YAAmC;AAE5C,SAAS,8BAA8B;AACvC,SAAS,uCAAuC;AAChD,SAAS,cAAc;AACvB,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;AACtC,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,iCAAiC;AAC1C,SAAS,wBAAwB;AACjC,SAAS,iBAAiB,sBAAsB;AAEhD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,MAAM,qBAAqB,KAAK,MAAM;AAC3C,QAAM,eAAe,gBAAgB;AACrC,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,OAAO,OAAO,IAAI,gBAAgB;AAC1C,QAAM,iBAAiB,iBAAiB;AACxC,QAAM,kBAAkB,0BAA0B;AAClD,QAAM,EAAE,oBAAoB,IAAI,eAAe;AAC/C,QAAM,EAAE,MAAM,qBAAqB,IAAI,eAAe;AAEtD,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,8BAA8B;AAAA,EAChC,IAAI,WAAW;AACf,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,8BAA8B;AAAA,EAChC,IAAI,YAAY;AAChB,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,8BAA8B;AAAA,EAChC,IAAI,YAAY;AAEhB,QAAM,mBAAmB,sBAAsB,YAAY;AAE3D,QAAM,YACJ,CAAC,qBACA,CAAC,eAAe,gBAAgB,wBAAwB,SAAS;AAEpE,MAAI,WAAW;AACb,WAAO;AAAA,EACT;AAEA,QAAM,kBAAkB,gCAAgC;AAAA,IACtD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,mBAClB,6BAA6B;AAAA,IAC3B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,IACD,CAAC;AAEL,QAAM,oBAA8C;AAAA,IAClD,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAEA,MAAI,CAAC,kBAAkB,QAAQ;AAC7B,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,SAAI,WAAW,iCACd;AAAA,IAAC,cAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL,WAAW,oBAAI,IAA2C;AAAA,MAC5D;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,QAAQ,IAAI;AAAA,UACnB,QAAQ,SAAS,IAAI;AAAA,UAErB,8BAAC,0BAAuB,QAAQ,mBAAmB;AAAA;AAAA,MACrD;AAAA;AAAA,EACF,GACF;AAEJ,CAAC;AAED,mBAAmB,aAAa,IAAI;",
   "names": []
 }

package/esm/charts/xy-chart/components/overlay/explore/XYChartRectanglePoint.js

@@ -23,11 +23,11 @@ const XYChartRectanglePoint = memo(() => {
   const { axisIdToScaleDomain, axes } = useXYChartData();
   const {
     seriesToMetadata: barSeriesMeta,
-    seriesWithDatapoints: barSeriesWithDatapoints
+    filteredSeriesWithDatapoints: barSeriesWithDatapoints
   } = useBarData();
   const {
     seriesToMetadata: rectSeriesMeta,
-    seriesWithDatapoints: rectSeriesWithDatapoints
+    filteredSeriesWithDatapoints: rectSeriesWithDatapoints
   } = useRectData();
   const highlightedRects = buildRectangleHighlightedPoints({
     contentState,

package/esm/charts/xy-chart/components/overlay/explore/XYChartRectanglePoint.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/overlay/explore/XYChartRectanglePoint.tsx"],
-  "sourcesContent": ["import { memo, type MutableRefObject } from 'react';\n\nimport { HighlightedRectangleCanvas } from './HighlightedRectangleCanvas.js';\nimport { datapointIndicatorLayout } from './XYChartExplore.sty.js';\nimport { Canvas } from '../../../../core/components/canvas/Canvas.js';\nimport { CanvasContext } from '../../../../core/components/canvas/CanvasContext.js';\nimport type { CanvasShape } from '../../../../core/components/canvas/types/canvas-shape.js';\nimport { useGridPlotSize } from '../../../../core/components/chart-grid/hooks/useGridPlotSize.js';\nimport { RECT_STROKE_WIDTH } from '../../../constants/defaults.js';\nimport { useBarData } from '../../../hooks/useBarData.js';\nimport { useRectData } from '../../../hooks/useRectData.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartRectSelection } from '../../../hooks/useXYChartRectSelection.js';\nimport { useXYChartScales } from '../../../hooks/useXYChartScales.js';\nimport { useContentState, useSelectState } from '../../../store/selectors.js';\nimport { buildRectangleHighlightedPoints } from '../utils/get-selected-datapoints.js';\n\nexport const XYChartRectanglePoint = memo(() => {\n  const contentState = useContentState();\n  const selectState = useSelectState();\n  const { width, height } = useGridPlotSize();\n  const axisIdToScales = useXYChartScales();\n  const rectSelection = useXYChartRectSelection();\n  const { datapointMetadataMap } = useXYChartData();\n  const { axisIdToScaleDomain, axes } = useXYChartData();\n\n  const {\n    seriesToMetadata: barSeriesMeta,\n    seriesWithDatapoints: barSeriesWithDatapoints,\n  } = useBarData();\n  const {\n    seriesToMetadata: rectSeriesMeta,\n    seriesWithDatapoints: rectSeriesWithDatapoints,\n  } = useRectData();\n\n  const highlightedRects = buildRectangleHighlightedPoints({\n    contentState,\n    selectState,\n    rectSelection,\n    width,\n    rectSeriesWithDatapoints,\n    barSeriesWithDatapoints,\n    axisIdToScales,\n    barSeriesMeta,\n    rectSeriesMeta,\n    datapointMetadataMap,\n    axisIdToScaleDomain,\n    axes,\n  });\n\n  if (!highlightedRects.length) {\n    return null;\n  }\n\n  return (\n    <div className={datapointIndicatorLayout}>\n      <CanvasContext.Provider\n        value={{\n          shapeRefs: new Map<string, MutableRefObject<CanvasShape>>(),\n        }}\n      >\n        <Canvas\n          width={width + RECT_STROKE_WIDTH}\n          height={height + RECT_STROKE_WIDTH}\n        >\n          <HighlightedRectangleCanvas points={highlightedRects} />\n        </Canvas>\n      </CanvasContext.Provider>\n    </div>\n  );\n});\n\nXYChartRectanglePoint.displayName = 'XYChartRectanglePoint';\n"],
-  "mappings": "AAiEU;AAjEV,SAAS,YAAmC;AAE5C,SAAS,kCAAkC;AAC3C,SAAS,gCAAgC;AACzC,SAAS,cAAc;AACvB,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,yBAAyB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,+BAA+B;AACxC,SAAS,wBAAwB;AACjC,SAAS,iBAAiB,sBAAsB;AAChD,SAAS,uCAAuC;AAEzC,MAAM,wBAAwB,KAAK,MAAM;AAC9C,QAAM,eAAe,gBAAgB;AACrC,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,OAAO,OAAO,IAAI,gBAAgB;AAC1C,QAAM,iBAAiB,iBAAiB;AACxC,QAAM,gBAAgB,wBAAwB;AAC9C,QAAM,EAAE,qBAAqB,IAAI,eAAe;AAChD,QAAM,EAAE,qBAAqB,KAAK,IAAI,eAAe;AAErD,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,sBAAsB;AAAA,EACxB,IAAI,WAAW;AACf,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,sBAAsB;AAAA,EACxB,IAAI,YAAY;AAEhB,QAAM,mBAAmB,gCAAgC;AAAA,IACvD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,MAAI,CAAC,iBAAiB,QAAQ;AAC5B,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,SAAI,WAAW,0BACd;AAAA,IAAC,cAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL,WAAW,oBAAI,IAA2C;AAAA,MAC5D;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,QAAQ;AAAA,UACf,QAAQ,SAAS;AAAA,UAEjB,8BAAC,8BAA2B,QAAQ,kBAAkB;AAAA;AAAA,MACxD;AAAA;AAAA,EACF,GACF;AAEJ,CAAC;AAED,sBAAsB,cAAc;",
+  "sourcesContent": ["import { memo, type MutableRefObject } from 'react';\n\nimport { HighlightedRectangleCanvas } from './HighlightedRectangleCanvas.js';\nimport { datapointIndicatorLayout } from './XYChartExplore.sty.js';\nimport { Canvas } from '../../../../core/components/canvas/Canvas.js';\nimport { CanvasContext } from '../../../../core/components/canvas/CanvasContext.js';\nimport type { CanvasShape } from '../../../../core/components/canvas/types/canvas-shape.js';\nimport { useGridPlotSize } from '../../../../core/components/chart-grid/hooks/useGridPlotSize.js';\nimport { RECT_STROKE_WIDTH } from '../../../constants/defaults.js';\nimport { useBarData } from '../../../hooks/useBarData.js';\nimport { useRectData } from '../../../hooks/useRectData.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartRectSelection } from '../../../hooks/useXYChartRectSelection.js';\nimport { useXYChartScales } from '../../../hooks/useXYChartScales.js';\nimport { useContentState, useSelectState } from '../../../store/selectors.js';\nimport { buildRectangleHighlightedPoints } from '../utils/get-selected-datapoints.js';\n\nexport const XYChartRectanglePoint = memo(() => {\n  const contentState = useContentState();\n  const selectState = useSelectState();\n  const { width, height } = useGridPlotSize();\n  const axisIdToScales = useXYChartScales();\n  const rectSelection = useXYChartRectSelection();\n  const { datapointMetadataMap } = useXYChartData();\n  const { axisIdToScaleDomain, axes } = useXYChartData();\n\n  const {\n    seriesToMetadata: barSeriesMeta,\n    filteredSeriesWithDatapoints: barSeriesWithDatapoints,\n  } = useBarData();\n  const {\n    seriesToMetadata: rectSeriesMeta,\n    filteredSeriesWithDatapoints: rectSeriesWithDatapoints,\n  } = useRectData();\n\n  const highlightedRects = buildRectangleHighlightedPoints({\n    contentState,\n    selectState,\n    rectSelection,\n    width,\n    rectSeriesWithDatapoints,\n    barSeriesWithDatapoints,\n    axisIdToScales,\n    barSeriesMeta,\n    rectSeriesMeta,\n    datapointMetadataMap,\n    axisIdToScaleDomain,\n    axes,\n  });\n\n  if (!highlightedRects.length) {\n    return null;\n  }\n\n  return (\n    <div className={datapointIndicatorLayout}>\n      <CanvasContext.Provider\n        value={{\n          shapeRefs: new Map<string, MutableRefObject<CanvasShape>>(),\n        }}\n      >\n        <Canvas\n          width={width + RECT_STROKE_WIDTH}\n          height={height + RECT_STROKE_WIDTH}\n        >\n          <HighlightedRectangleCanvas points={highlightedRects} />\n        </Canvas>\n      </CanvasContext.Provider>\n    </div>\n  );\n});\n\nXYChartRectanglePoint.displayName = 'XYChartRectanglePoint';\n"],
+  "mappings": "AAiEU;AAjEV,SAAS,YAAmC;AAE5C,SAAS,kCAAkC;AAC3C,SAAS,gCAAgC;AACzC,SAAS,cAAc;AACvB,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,yBAAyB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,+BAA+B;AACxC,SAAS,wBAAwB;AACjC,SAAS,iBAAiB,sBAAsB;AAChD,SAAS,uCAAuC;AAEzC,MAAM,wBAAwB,KAAK,MAAM;AAC9C,QAAM,eAAe,gBAAgB;AACrC,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,OAAO,OAAO,IAAI,gBAAgB;AAC1C,QAAM,iBAAiB,iBAAiB;AACxC,QAAM,gBAAgB,wBAAwB;AAC9C,QAAM,EAAE,qBAAqB,IAAI,eAAe;AAChD,QAAM,EAAE,qBAAqB,KAAK,IAAI,eAAe;AAErD,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,8BAA8B;AAAA,EAChC,IAAI,WAAW;AACf,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,8BAA8B;AAAA,EAChC,IAAI,YAAY;AAEhB,QAAM,mBAAmB,gCAAgC;AAAA,IACvD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,MAAI,CAAC,iBAAiB,QAAQ;AAC5B,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,SAAI,WAAW,0BACd;AAAA,IAAC,cAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL,WAAW,oBAAI,IAA2C;AAAA,MAC5D;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,QAAQ;AAAA,UACf,QAAQ,SAAS;AAAA,UAEjB,8BAAC,8BAA2B,QAAQ,kBAAkB;AAAA;AAAA,MACxD;AAAA;AAAA,EACF,GACF;AAEJ,CAAC;AAED,sBAAsB,cAAc;",
   "names": []
 }

package/esm/charts/xy-chart/components/overlay/hooks/useOverlayEvents.js

@@ -107,11 +107,11 @@ function reduceTooltipContentByType(hoveredDatapoint) {
   }
 }
 const useOverlayEvents = () => {
-  const { seriesWithDatapoints: rectSeriesData } = useRectData();
-  const { seriesWithDatapoints: barSeriesData } = useBarData();
-  const { seriesWithDatapoints: dotSeriesData } = useDotData();
-  const { seriesWithDatapoints: lineSeriesData } = useLineData();
-  const { seriesWithDatapoints: areaSeriesData } = useAreaData();
+  const { filteredSeriesWithDatapoints: rectSeriesData } = useRectData();
+  const { filteredSeriesWithDatapoints: barSeriesData } = useBarData();
+  const { filteredSeriesWithDatapoints: dotSeriesData } = useDotData();
+  const { filteredSeriesWithDatapoints: lineSeriesData } = useLineData();
+  const { filteredSeriesWithDatapoints: areaSeriesData } = useAreaData();
   const zoomToSelection = useZoomToSelection();
   const setState = useSetState();
   const mode = useInteractionModeState();

package/esm/charts/xy-chart/components/overlay/hooks/useOverlayEvents.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/overlay/hooks/useOverlayEvents.ts"],
-  "sourcesContent": ["import type { RefObject } from 'react';\n\nimport { useApplyPanDelta } from './useApplyPanDelta.js';\nimport { useApplyZoomDelta } from './useApplyZoomDelta.js';\nimport { useResetInteractions } from './useResetInteractions.js';\nimport { useZoomToSelection } from './useZoomToSelection.js';\nimport { useGridPlotSize } from '../../../../core/components/chart-grid/hooks/useGridPlotSize.js';\nimport {\n  INTERACTION_MODE,\n  type InteractionMode,\n  type InteractionTriggers,\n  isSelectCancelled,\n  type ZoomBehavior,\n} from '../../../../core/components/interactions-overlay/types.js';\nimport {\n  reduceExploreCancelAll,\n  reduceExploreCancelSelect,\n  reduceExploreEnd,\n  reduceExplorePin,\n  reduceExplorePosition,\n  reduceExploreReset,\n  reduceExploreSelect,\n  reduceExploreUnPin,\n} from '../../../../core/components/interactions-state-helpers/reducers/explore-reducers.js';\nimport { reduceInteractionMode } from '../../../../core/components/interactions-state-helpers/reducers/mode-reducers.js';\nimport type {\n  _SelectionRef,\n  SelectionAreaVariant,\n} from '../../../../core/components/selection-area/types.js';\nimport { useSynchronizedCrosshair } from '../../../../core/components/shared-chart-interactions/hooks/useSynchronizedCrosshair.js';\nimport { useSynchronizedSelection } from '../../../../core/components/shared-chart-interactions/hooks/useSynchronizedSelection.js';\nimport type { RelativeAbsolutePosition } from '../../../../core/types/pointer-events.js';\nimport { ZOOM_CHANGE_TYPE } from '../../../../core/types/zoom.js';\nimport { getPercentageFromPixel } from '../../../../core/utils/get-percentage-from-pixel.js';\nimport type {\n  QueryClosest,\n  QueryHovered,\n  SeriesQueryResult,\n} from '../../../context/XYChartOverlayPerformance.context.js';\nimport { useAreaData } from '../../../hooks/useAreaData.js';\nimport { useBarData } from '../../../hooks/useBarData.js';\nimport { useDotData } from '../../../hooks/useDotData.js';\nimport { useLineData } from '../../../hooks/useLineData.js';\nimport { useOverlayPerformance } from '../../../hooks/useOverlayPerformance.js';\nimport { useRectData } from '../../../hooks/useRectData.js';\nimport { useSyncedXScaleByPriority } from '../../../hooks/useSyncedXScaleByPriority.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartId } from '../../../hooks/useXYChartId.js';\nimport {\n  reduceAreaTooltipContent,\n  reduceBarTooltipContent,\n  reduceDotTooltipContent,\n  reduceLineTooltipContent,\n  reduceRectTooltipContent,\n  reduceUndefinedTooltipContent,\n} from '../../../store/reducer-tooltip.js';\nimport {\n  useInteractionModeState,\n  useSetState,\n  useZoomState,\n} from '../../../store/selectors.js';\nimport {\n  AREA_VARIANT,\n  BAR_VARIANT,\n  DOT_VARIANT,\n  DotSeriesWithDatapoints,\n  LINE_VARIANT,\n  LineSeriesWithDatapoints,\n  RECT_VARIANT,\n  RectSeriesWithDatapoints,\n  type AreaSeriesWithDatapoints,\n  type BarSeriesWithDatapoints,\n} from '../../../types/xy-chart-internals.js';\nimport { getPrevailingShapeType } from '../utils/get-prevailing-shape-type.js';\n\nfunction getHoveredDatapoint(\n  position: RelativeAbsolutePosition,\n  dotSeriesData: DotSeriesWithDatapoints[],\n  lineSeriesData: LineSeriesWithDatapoints[],\n  areaSeriesData: AreaSeriesWithDatapoints[],\n  rectData: RectSeriesWithDatapoints[],\n  barData: BarSeriesWithDatapoints[],\n  queryClosest: QueryClosest,\n  queryHovered: QueryHovered,\n) {\n  const dotRes = queryClosest(dotSeriesData, position.relative);\n  const lineRes = queryClosest(lineSeriesData, position.relative);\n  const areaRes = queryClosest(areaSeriesData, position.relative);\n  const rectRes = queryHovered(rectData, position.relative);\n  const barRes = queryHovered(barData, position.relative);\n\n  const prevailing = getPrevailingShapeType(\n    dotRes?.distance,\n    lineRes?.distance,\n    areaRes?.distance,\n    !!rectRes,\n    !!barRes,\n  );\n\n  if (prevailing === DOT_VARIANT && dotRes) {\n    return dotRes;\n  } else if (prevailing === LINE_VARIANT && lineRes) {\n    return lineRes;\n  } else if (prevailing === AREA_VARIANT && areaRes) {\n    return areaRes;\n  } else if (prevailing === RECT_VARIANT && rectRes) {\n    return rectRes;\n  } else if (prevailing === BAR_VARIANT && barRes) {\n    return barRes;\n  }\n\n  return undefined;\n}\n\nfunction reduceTooltipContentByType(hoveredDatapoint: SeriesQueryResult) {\n  if (hoveredDatapoint.type === DOT_VARIANT) {\n    return reduceDotTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  } else if (hoveredDatapoint.type === LINE_VARIANT) {\n    return reduceLineTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  } else if (hoveredDatapoint.type === AREA_VARIANT) {\n    return reduceAreaTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  } else if (hoveredDatapoint.type === RECT_VARIANT) {\n    return reduceRectTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  } else {\n    return reduceBarTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  }\n}\n\nexport const useOverlayEvents = () => {\n  const { seriesWithDatapoints: rectSeriesData } = useRectData();\n  const { seriesWithDatapoints: barSeriesData } = useBarData();\n  const { seriesWithDatapoints: dotSeriesData } = useDotData();\n  const { seriesWithDatapoints: lineSeriesData } = useLineData();\n  const { seriesWithDatapoints: areaSeriesData } = useAreaData();\n  const zoomToSelection = useZoomToSelection();\n  const setState = useSetState();\n  const mode = useInteractionModeState();\n  const applyPanDelta = useApplyPanDelta();\n  const applyReset = useResetInteractions();\n  const applyZoomDelta = useApplyZoomDelta();\n  const zoomState = useZoomState();\n  const { queryClosest, queryHovered } = useOverlayPerformance();\n  const { axesMetadata } = useXYChartData();\n  const chartId = useXYChartId();\n  const synchronizedCrosshair = useSynchronizedCrosshair();\n  const { width } = useGridPlotSize();\n  const {\n    updateSelectionState: updateSynchronizedSelection,\n    resetSelectionState: resetSynchronizedSelection,\n  } = useSynchronizedSelection();\n  const syncedXScale = useSyncedXScaleByPriority();\n\n  const {\n    updateHoverState: updateSynchronizedCrosshair,\n    setDisabled: disableSynchronizedCrosshair,\n  } = synchronizedCrosshair ?? {};\n\n  const handleModeChange = (event: {\n    mode: InteractionMode;\n    keyboard: boolean;\n  }) => {\n    const canPan = axesMetadata.isPanEnabled && zoomState.zoomOutEnabled;\n    const shouldSwitchToPanMode = event.mode === 'pan' && canPan;\n    const shouldSwitchToZoomMode =\n      event.mode === 'zoom' && axesMetadata.isZoomEnabled;\n\n    if (shouldSwitchToPanMode || shouldSwitchToZoomMode) {\n      resetSynchronizedSelection?.();\n      setState(reduceInteractionMode(event.mode));\n      setState(reduceExploreReset);\n    } else if (event.mode === 'explore') {\n      setState(reduceInteractionMode(INTERACTION_MODE.Explore));\n    }\n  };\n\n  const handleHover = ({\n    position,\n  }: {\n    triggeredBy: InteractionTriggers;\n    position: RelativeAbsolutePosition;\n  }) => {\n    if (mode === INTERACTION_MODE.Explore) {\n      setState(reduceExplorePosition(position));\n    }\n\n    if (syncedXScale) {\n      const hoveredDate = syncedXScale.invert(position.relative.x);\n      disableSynchronizedCrosshair?.(false);\n      updateSynchronizedCrosshair?.(chartId, hoveredDate.valueOf());\n    }\n\n    const hoveredDatapoint = getHoveredDatapoint(\n      position,\n      dotSeriesData,\n      lineSeriesData,\n      areaSeriesData,\n      rectSeriesData,\n      barSeriesData,\n      queryClosest,\n      queryHovered,\n    );\n\n    if (hoveredDatapoint) {\n      setState(reduceTooltipContentByType(hoveredDatapoint));\n    } else {\n      setState(reduceUndefinedTooltipContent);\n    }\n  };\n\n  const handleTogglePin = (\n    pin: boolean,\n    position: RelativeAbsolutePosition | undefined,\n  ) => {\n    if (pin) {\n      handlePin(position);\n      updateSynchronizedCrosshair?.(undefined);\n    } else {\n      handleUnPin(position);\n    }\n  };\n\n  const handleUnPin = (position: RelativeAbsolutePosition | undefined) => {\n    setState(reduceExploreUnPin(position));\n\n    if (position) {\n      const hoveredDatapoint = getHoveredDatapoint(\n        position,\n        dotSeriesData,\n        lineSeriesData,\n        areaSeriesData,\n        rectSeriesData,\n        barSeriesData,\n        queryClosest,\n        queryHovered,\n      );\n\n      if (hoveredDatapoint) {\n        setState(reduceTooltipContentByType(hoveredDatapoint));\n      } else {\n        setState(reduceUndefinedTooltipContent);\n      }\n    }\n  };\n\n  const handlePin = (position: RelativeAbsolutePosition | undefined) => {\n    if (!position) {\n      return;\n    }\n\n    const hoveredDatapoint = getHoveredDatapoint(\n      position,\n      dotSeriesData,\n      lineSeriesData,\n      areaSeriesData,\n      rectSeriesData,\n      barSeriesData,\n      queryClosest,\n      queryHovered,\n    );\n    if (hoveredDatapoint) {\n      setState(reduceTooltipContentByType(hoveredDatapoint));\n      setState(reduceExplorePin(position, hoveredDatapoint.series.id));\n    } else {\n      setState(reduceUndefinedTooltipContent);\n    }\n  };\n\n  const handleReset = (event: {\n    triggeredBy: InteractionTriggers;\n    mousePosition?: RelativeAbsolutePosition;\n  }) => {\n    const { mousePosition: position } = event;\n    applyReset({ position });\n    disableSynchronizedCrosshair?.(false);\n    resetSynchronizedSelection?.();\n\n    if (!position) {\n      setState(reduceUndefinedTooltipContent);\n      setState(reduceExploreCancelAll);\n\n      return;\n    }\n\n    setState(reduceExploreCancelAll);\n    setState(reduceExplorePosition(position));\n\n    const hoveredDatapoint = getHoveredDatapoint(\n      position,\n      dotSeriesData,\n      lineSeriesData,\n      areaSeriesData,\n      rectSeriesData,\n      barSeriesData,\n      queryClosest,\n      queryHovered,\n    );\n    if (hoveredDatapoint) {\n      setState(reduceTooltipContentByType(hoveredDatapoint));\n    } else {\n      setState(reduceUndefinedTooltipContent);\n    }\n  };\n\n  const handleLeave = (_: { triggeredBy: InteractionTriggers }) => {\n    setState(reduceExploreEnd);\n    updateSynchronizedCrosshair?.(undefined);\n  };\n\n  const handlePanChange = (event: {\n    triggeredBy: InteractionTriggers;\n    delta: number;\n  }) => {\n    applyPanDelta(event.delta);\n  };\n\n  const handleSelectStart = (event: {\n    triggeredBy: InteractionTriggers;\n    position: RelativeAbsolutePosition;\n  }) => {\n    if (mode === 'explore') {\n      disableSynchronizedCrosshair?.(true);\n      updateSynchronizedSelection?.();\n    }\n    setState(reduceUndefinedTooltipContent);\n  };\n\n  const handleSelectChange = (event: {\n    triggeredBy: InteractionTriggers;\n    start: RelativeAbsolutePosition;\n    end: RelativeAbsolutePosition;\n    mode: 'explore' | 'zoom';\n  }): void => {\n    const variant: SelectionAreaVariant =\n      event.mode === 'explore' ? 'select' : 'zoom';\n\n    setState(\n      reduceExploreSelect({\n        start: event.start,\n        end: event.end,\n        finished: false,\n        accessible: false,\n        variant,\n        selectionPercentage: getPercentageFromPixel(\n          [event.start, event.end],\n          width,\n        ),\n      }),\n    );\n    if (mode === 'explore' && syncedXScale) {\n      updateSynchronizedSelection?.({\n        selection: [event.start, event.end],\n        chartId,\n        scale: syncedXScale,\n      });\n    }\n  };\n\n  const handleSelectEnd = (\n    event:\n      | {\n          triggeredBy: InteractionTriggers;\n          start: RelativeAbsolutePosition;\n          end: RelativeAbsolutePosition;\n        }\n      | { cancelled: true },\n    ref: RefObject<_SelectionRef>,\n  ): void => {\n    if (isSelectCancelled(event)) {\n      setState(reduceExploreCancelSelect);\n      resetSynchronizedSelection?.();\n    } else if (mode === 'explore') {\n      setState(\n        reduceExploreSelect({\n          start: event.start,\n          end: event.end,\n          finished: true,\n          accessible: false,\n          selectionPercentage: getPercentageFromPixel(\n            [event.start, event.end],\n            width,\n          ),\n        }),\n      );\n      ref.current?.focus();\n      if (syncedXScale) {\n        updateSynchronizedSelection?.({\n          selection: [event.start, event.end],\n          chartId,\n          scale: syncedXScale,\n        });\n      }\n    } else {\n      // in case select is disabled and zoomX is enabled, only zoom to selection interaction is possible\n      zoomToSelection();\n    }\n  };\n\n  const handleZoomChange = (event: {\n    triggeredBy: InteractionTriggers;\n    deltaStart: number;\n    deltaEnd: number;\n    behavior: ZoomBehavior;\n  }) => {\n    const canZoomIn =\n      event.behavior === ZOOM_CHANGE_TYPE.ZoomIn && zoomState?.zoomInEnabled;\n    const canZoomOut =\n      event.behavior === ZOOM_CHANGE_TYPE.ZoomOut && zoomState.zoomOutEnabled;\n    const canZoomX = event.behavior === ZOOM_CHANGE_TYPE.ZoomX;\n\n    const canZoom = canZoomIn || canZoomOut || canZoomX;\n\n    if (canZoom && axesMetadata.isZoomEnabled) {\n      setState(reduceExploreCancelAll);\n\n      applyZoomDelta(event.deltaStart, event.deltaEnd, event.behavior);\n    }\n  };\n\n  return {\n    handleModeChange,\n    handleHover,\n    handleTogglePin,\n    handleReset,\n    handleLeave,\n    handlePanChange,\n    handleSelectChange,\n    handleSelectEnd,\n    handleZoomChange,\n    handleSelectStart,\n  };\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import type { RefObject } from 'react';\n\nimport { useApplyPanDelta } from './useApplyPanDelta.js';\nimport { useApplyZoomDelta } from './useApplyZoomDelta.js';\nimport { useResetInteractions } from './useResetInteractions.js';\nimport { useZoomToSelection } from './useZoomToSelection.js';\nimport { useGridPlotSize } from '../../../../core/components/chart-grid/hooks/useGridPlotSize.js';\nimport {\n  INTERACTION_MODE,\n  type InteractionMode,\n  type InteractionTriggers,\n  isSelectCancelled,\n  type ZoomBehavior,\n} from '../../../../core/components/interactions-overlay/types.js';\nimport {\n  reduceExploreCancelAll,\n  reduceExploreCancelSelect,\n  reduceExploreEnd,\n  reduceExplorePin,\n  reduceExplorePosition,\n  reduceExploreReset,\n  reduceExploreSelect,\n  reduceExploreUnPin,\n} from '../../../../core/components/interactions-state-helpers/reducers/explore-reducers.js';\nimport { reduceInteractionMode } from '../../../../core/components/interactions-state-helpers/reducers/mode-reducers.js';\nimport type {\n  _SelectionRef,\n  SelectionAreaVariant,\n} from '../../../../core/components/selection-area/types.js';\nimport { useSynchronizedCrosshair } from '../../../../core/components/shared-chart-interactions/hooks/useSynchronizedCrosshair.js';\nimport { useSynchronizedSelection } from '../../../../core/components/shared-chart-interactions/hooks/useSynchronizedSelection.js';\nimport type { RelativeAbsolutePosition } from '../../../../core/types/pointer-events.js';\nimport { ZOOM_CHANGE_TYPE } from '../../../../core/types/zoom.js';\nimport { getPercentageFromPixel } from '../../../../core/utils/get-percentage-from-pixel.js';\nimport type {\n  QueryClosest,\n  QueryHovered,\n  SeriesQueryResult,\n} from '../../../context/XYChartOverlayPerformance.context.js';\nimport { useAreaData } from '../../../hooks/useAreaData.js';\nimport { useBarData } from '../../../hooks/useBarData.js';\nimport { useDotData } from '../../../hooks/useDotData.js';\nimport { useLineData } from '../../../hooks/useLineData.js';\nimport { useOverlayPerformance } from '../../../hooks/useOverlayPerformance.js';\nimport { useRectData } from '../../../hooks/useRectData.js';\nimport { useSyncedXScaleByPriority } from '../../../hooks/useSyncedXScaleByPriority.js';\nimport { useXYChartData } from '../../../hooks/useXYChartData.js';\nimport { useXYChartId } from '../../../hooks/useXYChartId.js';\nimport {\n  reduceAreaTooltipContent,\n  reduceBarTooltipContent,\n  reduceDotTooltipContent,\n  reduceLineTooltipContent,\n  reduceRectTooltipContent,\n  reduceUndefinedTooltipContent,\n} from '../../../store/reducer-tooltip.js';\nimport {\n  useInteractionModeState,\n  useSetState,\n  useZoomState,\n} from '../../../store/selectors.js';\nimport {\n  AREA_VARIANT,\n  BAR_VARIANT,\n  DOT_VARIANT,\n  DotSeriesWithDatapoints,\n  LINE_VARIANT,\n  LineSeriesWithDatapoints,\n  RECT_VARIANT,\n  RectSeriesWithDatapoints,\n  type AreaSeriesWithDatapoints,\n  type BarSeriesWithDatapoints,\n} from '../../../types/xy-chart-internals.js';\nimport { getPrevailingShapeType } from '../utils/get-prevailing-shape-type.js';\n\nfunction getHoveredDatapoint(\n  position: RelativeAbsolutePosition,\n  dotSeriesData: DotSeriesWithDatapoints[],\n  lineSeriesData: LineSeriesWithDatapoints[],\n  areaSeriesData: AreaSeriesWithDatapoints[],\n  rectData: RectSeriesWithDatapoints[],\n  barData: BarSeriesWithDatapoints[],\n  queryClosest: QueryClosest,\n  queryHovered: QueryHovered,\n) {\n  const dotRes = queryClosest(dotSeriesData, position.relative);\n  const lineRes = queryClosest(lineSeriesData, position.relative);\n  const areaRes = queryClosest(areaSeriesData, position.relative);\n  const rectRes = queryHovered(rectData, position.relative);\n  const barRes = queryHovered(barData, position.relative);\n\n  const prevailing = getPrevailingShapeType(\n    dotRes?.distance,\n    lineRes?.distance,\n    areaRes?.distance,\n    !!rectRes,\n    !!barRes,\n  );\n\n  if (prevailing === DOT_VARIANT && dotRes) {\n    return dotRes;\n  } else if (prevailing === LINE_VARIANT && lineRes) {\n    return lineRes;\n  } else if (prevailing === AREA_VARIANT && areaRes) {\n    return areaRes;\n  } else if (prevailing === RECT_VARIANT && rectRes) {\n    return rectRes;\n  } else if (prevailing === BAR_VARIANT && barRes) {\n    return barRes;\n  }\n\n  return undefined;\n}\n\nfunction reduceTooltipContentByType(hoveredDatapoint: SeriesQueryResult) {\n  if (hoveredDatapoint.type === DOT_VARIANT) {\n    return reduceDotTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  } else if (hoveredDatapoint.type === LINE_VARIANT) {\n    return reduceLineTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  } else if (hoveredDatapoint.type === AREA_VARIANT) {\n    return reduceAreaTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  } else if (hoveredDatapoint.type === RECT_VARIANT) {\n    return reduceRectTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  } else {\n    return reduceBarTooltipContent(\n      hoveredDatapoint.datapoint,\n      hoveredDatapoint.series,\n    );\n  }\n}\n\nexport const useOverlayEvents = () => {\n  const { filteredSeriesWithDatapoints: rectSeriesData } = useRectData();\n  const { filteredSeriesWithDatapoints: barSeriesData } = useBarData();\n  const { filteredSeriesWithDatapoints: dotSeriesData } = useDotData();\n  const { filteredSeriesWithDatapoints: lineSeriesData } = useLineData();\n  const { filteredSeriesWithDatapoints: areaSeriesData } = useAreaData();\n  const zoomToSelection = useZoomToSelection();\n  const setState = useSetState();\n  const mode = useInteractionModeState();\n  const applyPanDelta = useApplyPanDelta();\n  const applyReset = useResetInteractions();\n  const applyZoomDelta = useApplyZoomDelta();\n  const zoomState = useZoomState();\n  const { queryClosest, queryHovered } = useOverlayPerformance();\n  const { axesMetadata } = useXYChartData();\n  const chartId = useXYChartId();\n  const synchronizedCrosshair = useSynchronizedCrosshair();\n  const { width } = useGridPlotSize();\n  const {\n    updateSelectionState: updateSynchronizedSelection,\n    resetSelectionState: resetSynchronizedSelection,\n  } = useSynchronizedSelection();\n  const syncedXScale = useSyncedXScaleByPriority();\n\n  const {\n    updateHoverState: updateSynchronizedCrosshair,\n    setDisabled: disableSynchronizedCrosshair,\n  } = synchronizedCrosshair ?? {};\n\n  const handleModeChange = (event: {\n    mode: InteractionMode;\n    keyboard: boolean;\n  }) => {\n    const canPan = axesMetadata.isPanEnabled && zoomState.zoomOutEnabled;\n    const shouldSwitchToPanMode = event.mode === 'pan' && canPan;\n    const shouldSwitchToZoomMode =\n      event.mode === 'zoom' && axesMetadata.isZoomEnabled;\n\n    if (shouldSwitchToPanMode || shouldSwitchToZoomMode) {\n      resetSynchronizedSelection?.();\n      setState(reduceInteractionMode(event.mode));\n      setState(reduceExploreReset);\n    } else if (event.mode === 'explore') {\n      setState(reduceInteractionMode(INTERACTION_MODE.Explore));\n    }\n  };\n\n  const handleHover = ({\n    position,\n  }: {\n    triggeredBy: InteractionTriggers;\n    position: RelativeAbsolutePosition;\n  }) => {\n    if (mode === INTERACTION_MODE.Explore) {\n      setState(reduceExplorePosition(position));\n    }\n\n    if (syncedXScale) {\n      const hoveredDate = syncedXScale.invert(position.relative.x);\n      disableSynchronizedCrosshair?.(false);\n      updateSynchronizedCrosshair?.(chartId, hoveredDate.valueOf());\n    }\n\n    const hoveredDatapoint = getHoveredDatapoint(\n      position,\n      dotSeriesData,\n      lineSeriesData,\n      areaSeriesData,\n      rectSeriesData,\n      barSeriesData,\n      queryClosest,\n      queryHovered,\n    );\n\n    if (hoveredDatapoint) {\n      setState(reduceTooltipContentByType(hoveredDatapoint));\n    } else {\n      setState(reduceUndefinedTooltipContent);\n    }\n  };\n\n  const handleTogglePin = (\n    pin: boolean,\n    position: RelativeAbsolutePosition | undefined,\n  ) => {\n    if (pin) {\n      handlePin(position);\n      updateSynchronizedCrosshair?.(undefined);\n    } else {\n      handleUnPin(position);\n    }\n  };\n\n  const handleUnPin = (position: RelativeAbsolutePosition | undefined) => {\n    setState(reduceExploreUnPin(position));\n\n    if (position) {\n      const hoveredDatapoint = getHoveredDatapoint(\n        position,\n        dotSeriesData,\n        lineSeriesData,\n        areaSeriesData,\n        rectSeriesData,\n        barSeriesData,\n        queryClosest,\n        queryHovered,\n      );\n\n      if (hoveredDatapoint) {\n        setState(reduceTooltipContentByType(hoveredDatapoint));\n      } else {\n        setState(reduceUndefinedTooltipContent);\n      }\n    }\n  };\n\n  const handlePin = (position: RelativeAbsolutePosition | undefined) => {\n    if (!position) {\n      return;\n    }\n\n    const hoveredDatapoint = getHoveredDatapoint(\n      position,\n      dotSeriesData,\n      lineSeriesData,\n      areaSeriesData,\n      rectSeriesData,\n      barSeriesData,\n      queryClosest,\n      queryHovered,\n    );\n    if (hoveredDatapoint) {\n      setState(reduceTooltipContentByType(hoveredDatapoint));\n      setState(reduceExplorePin(position, hoveredDatapoint.series.id));\n    } else {\n      setState(reduceUndefinedTooltipContent);\n    }\n  };\n\n  const handleReset = (event: {\n    triggeredBy: InteractionTriggers;\n    mousePosition?: RelativeAbsolutePosition;\n  }) => {\n    const { mousePosition: position } = event;\n    applyReset({ position });\n    disableSynchronizedCrosshair?.(false);\n    resetSynchronizedSelection?.();\n\n    if (!position) {\n      setState(reduceUndefinedTooltipContent);\n      setState(reduceExploreCancelAll);\n\n      return;\n    }\n\n    setState(reduceExploreCancelAll);\n    setState(reduceExplorePosition(position));\n\n    const hoveredDatapoint = getHoveredDatapoint(\n      position,\n      dotSeriesData,\n      lineSeriesData,\n      areaSeriesData,\n      rectSeriesData,\n      barSeriesData,\n      queryClosest,\n      queryHovered,\n    );\n    if (hoveredDatapoint) {\n      setState(reduceTooltipContentByType(hoveredDatapoint));\n    } else {\n      setState(reduceUndefinedTooltipContent);\n    }\n  };\n\n  const handleLeave = (_: { triggeredBy: InteractionTriggers }) => {\n    setState(reduceExploreEnd);\n    updateSynchronizedCrosshair?.(undefined);\n  };\n\n  const handlePanChange = (event: {\n    triggeredBy: InteractionTriggers;\n    delta: number;\n  }) => {\n    applyPanDelta(event.delta);\n  };\n\n  const handleSelectStart = (event: {\n    triggeredBy: InteractionTriggers;\n    position: RelativeAbsolutePosition;\n  }) => {\n    if (mode === 'explore') {\n      disableSynchronizedCrosshair?.(true);\n      updateSynchronizedSelection?.();\n    }\n    setState(reduceUndefinedTooltipContent);\n  };\n\n  const handleSelectChange = (event: {\n    triggeredBy: InteractionTriggers;\n    start: RelativeAbsolutePosition;\n    end: RelativeAbsolutePosition;\n    mode: 'explore' | 'zoom';\n  }): void => {\n    const variant: SelectionAreaVariant =\n      event.mode === 'explore' ? 'select' : 'zoom';\n\n    setState(\n      reduceExploreSelect({\n        start: event.start,\n        end: event.end,\n        finished: false,\n        accessible: false,\n        variant,\n        selectionPercentage: getPercentageFromPixel(\n          [event.start, event.end],\n          width,\n        ),\n      }),\n    );\n    if (mode === 'explore' && syncedXScale) {\n      updateSynchronizedSelection?.({\n        selection: [event.start, event.end],\n        chartId,\n        scale: syncedXScale,\n      });\n    }\n  };\n\n  const handleSelectEnd = (\n    event:\n      | {\n          triggeredBy: InteractionTriggers;\n          start: RelativeAbsolutePosition;\n          end: RelativeAbsolutePosition;\n        }\n      | { cancelled: true },\n    ref: RefObject<_SelectionRef>,\n  ): void => {\n    if (isSelectCancelled(event)) {\n      setState(reduceExploreCancelSelect);\n      resetSynchronizedSelection?.();\n    } else if (mode === 'explore') {\n      setState(\n        reduceExploreSelect({\n          start: event.start,\n          end: event.end,\n          finished: true,\n          accessible: false,\n          selectionPercentage: getPercentageFromPixel(\n            [event.start, event.end],\n            width,\n          ),\n        }),\n      );\n      ref.current?.focus();\n      if (syncedXScale) {\n        updateSynchronizedSelection?.({\n          selection: [event.start, event.end],\n          chartId,\n          scale: syncedXScale,\n        });\n      }\n    } else {\n      // in case select is disabled and zoomX is enabled, only zoom to selection interaction is possible\n      zoomToSelection();\n    }\n  };\n\n  const handleZoomChange = (event: {\n    triggeredBy: InteractionTriggers;\n    deltaStart: number;\n    deltaEnd: number;\n    behavior: ZoomBehavior;\n  }) => {\n    const canZoomIn =\n      event.behavior === ZOOM_CHANGE_TYPE.ZoomIn && zoomState?.zoomInEnabled;\n    const canZoomOut =\n      event.behavior === ZOOM_CHANGE_TYPE.ZoomOut && zoomState.zoomOutEnabled;\n    const canZoomX = event.behavior === ZOOM_CHANGE_TYPE.ZoomX;\n\n    const canZoom = canZoomIn || canZoomOut || canZoomX;\n\n    if (canZoom && axesMetadata.isZoomEnabled) {\n      setState(reduceExploreCancelAll);\n\n      applyZoomDelta(event.deltaStart, event.deltaEnd, event.behavior);\n    }\n  };\n\n  return {\n    handleModeChange,\n    handleHover,\n    handleTogglePin,\n    handleReset,\n    handleLeave,\n    handlePanChange,\n    handleSelectChange,\n    handleSelectEnd,\n    handleZoomChange,\n    handleSelectStart,\n  };\n};\n"],
+  "mappings": "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",
   "names": []
 }