@dynatrace/strato-components 3.12.2 → 3.13.0

package/charts/sankey-chart/hooks/use-sankey-formatter.js

@@ -0,0 +1,27 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var use_sankey_formatter_exports = {};
+__export(use_sankey_formatter_exports, {
+  useSankeyFormatter: () => useSankeyFormatter
+});
+module.exports = __toCommonJS(use_sankey_formatter_exports);
+var import_get_formatter = require("../../core/utils/get-formatter.js");
+function useSankeyFormatter(formatter, unit) {
+  const resolved = (0, import_get_formatter.getFormatter)(formatter);
+  return (value) => resolved(value, unit);
+}

package/charts/sankey-chart/hooks/use-sankey-overlay-events.d.ts

@@ -1,9 +1,10 @@
-import { type PointerEvent as ReactPointerEvent } from 'react';
+import { type MouseEvent as ReactMouseEvent, type PointerEvent as ReactPointerEvent } from 'react';
 import type { Overlay } from '../../core/components/overlay-tooltip/types.js';
-import type { SankeyHoveredShape } from '../types/sankey-hover.js';
-export declare function isSameHoveredShape(prev: SankeyHoveredShape | undefined, next: SankeyHoveredShape | undefined): boolean;
+import type { SankeyShape } from '../types/sankey-shape.js';
+export declare function isSameHoveredShape(prev: SankeyShape | undefined, next: SankeyShape | undefined): boolean;
 export declare function useSankeyOverlayEvents(overlay: Overlay): {
     onPointerMove: (event: ReactPointerEvent<HTMLDivElement>) => void;
     onPointerLeave: () => void;
+    onClick: (event: ReactMouseEvent<HTMLDivElement>) => void;
 };
 //# sourceMappingURL=use-sankey-overlay-events.d.ts.map

package/charts/sankey-chart/hooks/use-sankey-overlay-events.js

@@ -27,28 +27,20 @@ var import_useGraphSize = require("../../core/components/chart-layout/hooks/useG
 var import_throttleRaf = require("../../core/utils/throttleRaf.js");
 var import_store = require("../store/store.js");
 var import_find_hovered_shape = require("../utils/find-hovered-shape.js");
+var import_is_same_sankey_shape = require("../utils/is-same-sankey-shape.js");
 function isSameHoveredShape(prev, next) {
-  if (prev === next) {
-    return true;
-  }
-  if (prev === void 0 || next === void 0) {
-    return false;
-  }
-  if (prev.type === "node" && next.type === "node") {
-    return prev.node === next.node;
-  }
-  if (prev.type === "link" && next.type === "link") {
-    return prev.link === next.link;
-  }
-  return false;
+  return (0, import_is_same_sankey_shape.isSameSankeyShape)(prev, next);
 }
 function useSankeyOverlayEvents(overlay) {
   const layout = (0, import_use_sankey_layout.useSankeyLayout)();
   const setHoveredShape = (0, import_store.useSetHoveredShape)();
   const clearHoveredShape = (0, import_store.useClearHoveredShape)();
+  const toggleSelected = (0, import_store.useToggleSelected)();
+  const clearSelected = (0, import_store.useClearSelected)();
   const { width, height } = (0, import_useGraphSize.useGraphSize)();
   const latestPointRef = (0, import_react.useRef)({ clientX: 0, clientY: 0 });
   const lastHoveredRef = (0, import_react.useRef)(void 0);
+  const pointerInsideRef = (0, import_react.useRef)(false);
   const publishHoveredShape = (0, import_react.useCallback)(
     (shape) => {
       if (isSameHoveredShape(lastHoveredRef.current, shape)) {
@@ -64,6 +56,9 @@ function useSankeyOverlayEvents(overlay) {
     [setHoveredShape, clearHoveredShape]
   );
   const hitTest = (0, import_react.useCallback)(() => {
+    if (!pointerInsideRef.current) {
+      return;
+    }
     const { clientX, clientY } = latestPointRef.current;
     const { relativeX, relativeY } = overlay.getAdjustedPositionsFromAbsolute(
       clientX,
@@ -75,6 +70,7 @@ function useSankeyOverlayEvents(overlay) {
   const throttledHitTest = (0, import_react.useMemo)(() => (0, import_throttleRaf.throttleRaf)(hitTest), [hitTest]);
   const onPointerMove = (0, import_react.useCallback)(
     (event) => {
+      pointerInsideRef.current = true;
       latestPointRef.current = {
         clientX: event.clientX,
         clientY: event.clientY
@@ -84,11 +80,29 @@ function useSankeyOverlayEvents(overlay) {
     [throttledHitTest]
   );
   const onPointerLeave = (0, import_react.useCallback)(() => {
+    pointerInsideRef.current = false;
     publishHoveredShape(void 0);
     overlay.clear();
   }, [publishHoveredShape, overlay]);
+  const onClick = (0, import_react.useCallback)(
+    (event) => {
+      const { clientX, clientY } = event;
+      const { relativeX, relativeY } = overlay.getAdjustedPositionsFromAbsolute(
+        clientX,
+        clientY
+      );
+      const point = { x: relativeX ?? 0, y: relativeY ?? 0 };
+      const hovered = (0, import_find_hovered_shape.findHoveredShape)(layout, point);
+      if (hovered) {
+        toggleSelected(hovered);
+      } else {
+        clearSelected();
+      }
+    },
+    [overlay, layout, toggleSelected, clearSelected]
+  );
   (0, import_react.useEffect)(() => {
     overlay.clear();
   }, [overlay, width, height]);
-  return { onPointerMove, onPointerLeave };
+  return { onPointerMove, onPointerLeave, onClick };
 }

package/charts/sankey-chart/providers/SankeyFormatterProvider.d.ts

@@ -0,0 +1,17 @@
+import { type PropsWithChildren } from 'react';
+import type { ConvertibleUnit, FormatOptions, Unit } from '@dynatrace-sdk/units';
+import type { ChartUnit } from '../../core/types/chart-unit.js';
+import type { Formatter } from '../../core/types/formatter.js';
+interface SankeyFormatterProviderProps {
+    formatter?: Formatter | FormatOptions<Unit, ConvertibleUnit>;
+    unit?: ChartUnit;
+}
+/**
+ * @internal
+ */
+export declare const SankeyFormatterProvider: {
+    ({ formatter, unit, children, }: PropsWithChildren<SankeyFormatterProviderProps>): import("react").JSX.Element;
+    displayName: string;
+};
+export {};
+//# sourceMappingURL=SankeyFormatterProvider.d.ts.map

package/charts/sankey-chart/providers/SankeyFormatterProvider.js

@@ -0,0 +1,34 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var SankeyFormatterProvider_exports = {};
+__export(SankeyFormatterProvider_exports, {
+  SankeyFormatterProvider: () => SankeyFormatterProvider
+});
+module.exports = __toCommonJS(SankeyFormatterProvider_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_SankeyFormatter_context = require("../context/SankeyFormatter.context.js");
+var import_use_sankey_formatter = require("../hooks/use-sankey-formatter.js");
+const SankeyFormatterProvider = ({
+  formatter,
+  unit,
+  children
+}) => {
+  const resolvedFormatter = (0, import_use_sankey_formatter.useSankeyFormatter)(formatter, unit);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SankeyFormatter_context.SankeyFormatterContext.Provider, { value: resolvedFormatter, children });
+};
+SankeyFormatterProvider.displayName = "SankeyFormatterProvider";

package/charts/sankey-chart/providers/{SankeyHoverStoreProvider.d.ts → SankeyStoreProvider.d.ts}

@@ -1,6 +1,6 @@
 import { type PropsWithChildren } from 'react';
-export declare const SankeyHoverStoreProvider: {
+export declare const SankeyStoreProvider: {
     ({ children }: PropsWithChildren): import("react").JSX.Element;
     displayName: string;
 };
-//# sourceMappingURL=SankeyHoverStoreProvider.d.ts.map
+//# sourceMappingURL=SankeyStoreProvider.d.ts.map

package/charts/sankey-chart/providers/{SankeyHoverStoreProvider.js → SankeyStoreProvider.js}

@@ -15,19 +15,19 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var SankeyHoverStoreProvider_exports = {};
-__export(SankeyHoverStoreProvider_exports, {
-  SankeyHoverStoreProvider: () => SankeyHoverStoreProvider
+var SankeyStoreProvider_exports = {};
+__export(SankeyStoreProvider_exports, {
+  SankeyStoreProvider: () => SankeyStoreProvider
 });
-module.exports = __toCommonJS(SankeyHoverStoreProvider_exports);
+module.exports = __toCommonJS(SankeyStoreProvider_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_store = require("../../../core/store/store.js");
 var import_constants = require("../constants.js");
-var import_SankeyHoverStore_context = require("../context/SankeyHoverStore.context.js");
-const SankeyHoverStoreProvider = ({ children }) => {
+var import_SankeyStore_context = require("../context/SankeyStore.context.js");
+const SankeyStoreProvider = ({ children }) => {
   const storeRef = (0, import_react.useRef)(null);
-  storeRef.current ??= (0, import_store.createStore)(import_constants.INITIAL_HOVER_STATE);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SankeyHoverStore_context.SankeyHoverStoreContext.Provider, { value: storeRef.current, children });
+  storeRef.current ??= (0, import_store.createStore)(import_constants.INITIAL_SANKEY_STATE);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SankeyStore_context.SankeyStoreContext.Provider, { value: storeRef.current, children });
 };
-SankeyHoverStoreProvider.displayName = "SankeyHoverStoreProvider";
+SankeyStoreProvider.displayName = "SankeyStoreProvider";

package/charts/sankey-chart/store/selectors.d.ts

@@ -1,10 +1,17 @@
-import type { SankeyHoverState } from '../types/sankey-hover.js';
+import type { SankeyState } from '../types/sankey-state.js';
 /**
- * Compares by reference rather than deeply: a hovered shape holds layout nodes
- * whose `sourceLinks`/`targetLinks` reference back into the whole graph, so a
- * deep comparison would traverse it on every pointer move. Writers only publish
- * a new shape when the hovered identity actually changes.
+ * Compares by reference rather than deeply: both hovered and selected shapes
+ * carry only string ids, so reference comparison is correct and cheap.
+ * Writers only publish a new shape when the identity actually changes.
  */
-export declare const useSankeyHoverSelector: <T>(selector: (state: SankeyHoverState) => T) => T;
-export declare const useSankeyHoveredShape: () => import("../types/sankey-hover.js").SankeyHoveredShape | undefined;
+export declare const useSankeySelector: <T>(selector: (state: SankeyState) => T) => T;
+export declare const useSankeyHoveredShape: () => import("../types/sankey-shape.js").SankeyShape | undefined;
+export declare const useSankeySelectedShape: () => import("../types/sankey-shape.js").SankeyShape | undefined;
+/**
+ * The active highlight set — the nodes and links to keep emphasized while every
+ * other shape dims. Derived state: computed once from `hovered`/`selected`
+ * against the current layout and shared via `SankeyHighlightContext`. Returns
+ * `undefined` when nothing is highlighted.
+ */
+export declare const useSankeyActiveHighlight: () => import("../utils/get-active-connected-set.js").ActiveConnectedSet | undefined;
 //# sourceMappingURL=selectors.d.ts.map

package/charts/sankey-chart/store/selectors.js

@@ -17,11 +17,17 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var selectors_exports = {};
 __export(selectors_exports, {
-  useSankeyHoverSelector: () => useSankeyHoverSelector,
-  useSankeyHoveredShape: () => useSankeyHoveredShape
+  useSankeyActiveHighlight: () => useSankeyActiveHighlight,
+  useSankeyHoveredShape: () => useSankeyHoveredShape,
+  useSankeySelectedShape: () => useSankeySelectedShape,
+  useSankeySelector: () => useSankeySelector
 });
 module.exports = __toCommonJS(selectors_exports);
+var import_react = require("react");
 var import_selector = require("../../../core/store/selector.js");
-var import_SankeyHoverStore_context = require("../context/SankeyHoverStore.context.js");
-const useSankeyHoverSelector = (selector) => (0, import_selector.useStoreSelector)(import_SankeyHoverStore_context.SankeyHoverStoreContext, selector);
-const useSankeyHoveredShape = () => useSankeyHoverSelector((state) => state.hovered);
+var import_SankeyHighlight_context = require("../context/SankeyHighlight.context.js");
+var import_SankeyStore_context = require("../context/SankeyStore.context.js");
+const useSankeySelector = (selector) => (0, import_selector.useStoreSelector)(import_SankeyStore_context.SankeyStoreContext, selector);
+const useSankeyHoveredShape = () => useSankeySelector((state) => state.hovered);
+const useSankeySelectedShape = () => useSankeySelector((state) => state.selected);
+const useSankeyActiveHighlight = () => (0, import_react.useContext)(import_SankeyHighlight_context.SankeyHighlightContext);

package/charts/sankey-chart/store/store.d.ts

@@ -1,4 +1,7 @@
-import type { SankeyHoveredShape } from '../types/sankey-hover.js';
-export declare const useSetHoveredShape: () => (shape: SankeyHoveredShape) => void;
+import type { SankeyShape } from '../types/sankey-shape.js';
+export declare const useSetHoveredShape: () => (shape: SankeyShape) => void;
+export declare const useSetSelected: () => (shape: SankeyShape) => void;
 export declare const useClearHoveredShape: () => () => void;
+export declare const useClearSelected: () => () => void;
+export declare const useToggleSelected: () => (shape: SankeyShape) => void;
 //# sourceMappingURL=store.d.ts.map

package/charts/sankey-chart/store/store.js

@@ -18,27 +18,49 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var store_exports = {};
 __export(store_exports, {
   useClearHoveredShape: () => useClearHoveredShape,
-  useSetHoveredShape: () => useSetHoveredShape
+  useClearSelected: () => useClearSelected,
+  useSetHoveredShape: () => useSetHoveredShape,
+  useSetSelected: () => useSetSelected,
+  useToggleSelected: () => useToggleSelected
 });
 module.exports = __toCommonJS(store_exports);
 var import_react = require("react");
-var import_SankeyHoverStore_context = require("../context/SankeyHoverStore.context.js");
+var import_SankeyStore_context = require("../context/SankeyStore.context.js");
+var import_is_same_sankey_shape = require("../utils/is-same-sankey-shape.js");
 const useSetState = () => {
-  const { setState } = (0, import_react.useContext)(import_SankeyHoverStore_context.SankeyHoverStoreContext);
+  const { setState } = (0, import_react.useContext)(import_SankeyStore_context.SankeyStoreContext);
   return setState;
 };
-const useSetHoveredShape = () => {
+const createShapeSetter = (field) => () => {
   const setState = useSetState();
   return (0, import_react.useCallback)(
     (shape) => {
-      setState((prev) => ({ ...prev, hovered: shape }));
+      setState((prev) => ({ ...prev, [field]: shape }));
     },
     [setState]
   );
 };
-const useClearHoveredShape = () => {
+const useSetHoveredShape = createShapeSetter("hovered");
+const useSetSelected = createShapeSetter("selected");
+const createShapeClearer = (field) => () => {
   const setState = useSetState();
   return (0, import_react.useCallback)(() => {
-    setState((prev) => ({ ...prev, hovered: void 0 }));
+    setState((prev) => ({ ...prev, [field]: void 0 }));
   }, [setState]);
 };
+const useClearHoveredShape = createShapeClearer("hovered");
+const useClearSelected = createShapeClearer("selected");
+const useToggleSelected = () => {
+  const setState = useSetState();
+  return (0, import_react.useCallback)(
+    (shape) => {
+      setState((prev) => {
+        if (prev.selected !== void 0 && (0, import_is_same_sankey_shape.isSameSankeyShape)(prev.selected, shape)) {
+          return { ...prev, selected: void 0 };
+        }
+        return { ...prev, selected: shape };
+      });
+    },
+    [setState]
+  );
+};

package/charts/sankey-chart/types/sankey-props.d.ts

@@ -1,4 +1,5 @@
 import type { ReactNode } from 'react';
+import type { ConvertibleUnit, FormatOptions, Unit } from '@dynatrace-sdk/units';
 import type { SankeyNodeAlignment } from './sankey.js';
 import type { BehaviorTrackingProps } from '../../../core/types/behavior-tracking-props.js';
 import type { DataTestId } from '../../../core/types/data-props.js';
@@ -6,7 +7,9 @@ import type { MaskingProps } from '../../../core/types/masking-props.js';
 import type { StylingProps } from '../../../core/types/styling-props.js';
 import type { TruncationMode } from '../../../typography/text-ellipsis/TextEllipsis.js';
 import type { ChartData } from '../../core/types/chart-data.js';
+import type { ChartUnit } from '../../core/types/chart-unit.js';
 import type { ColorPalette, CustomColorPalette } from '../../core/types/color-palette.js';
+import type { Formatter } from '../../core/types/formatter.js';
 /**
  * @internal
  */
@@ -39,6 +42,14 @@ export interface SankeyChartBaseProps extends MaskingProps, StylingProps, DataTe
      * @defaultValue 'categorical'
      */
     colorPalette?: ColorPalette | CustomColorPalette;
+    /**
+     * Custom formatter for numeric volume values.
+     */
+    formatter?: Formatter | FormatOptions<Unit, ConvertibleUnit>;
+    /**
+     * Unit for numeric volume values.
+     */
+    unit?: ChartUnit;
     children?: ReactNode;
 }
 /**

package/charts/sankey-chart/types/sankey-shape.d.ts

@@ -0,0 +1,22 @@
+/**
+ * A shape in the sankey graph area, stored as a stable identity so that
+ * references survive layout recomputation on resize or data updates.
+ * Resolution against the current layout happens at render time
+ * in `getActiveConnectedSet`.
+ *
+ * - `node`: identified by the node id.
+ * - `link`: identified by the source node id, the target node id, and the
+ *   per-layout link index. All three are needed because parallel links
+ *   (multiple links between the same node pair) share the same source and
+ *   target ids but carry distinct indices assigned by the layout pass.
+ */
+export type SankeyShape = {
+    type: 'node';
+    nodeId: string;
+} | {
+    type: 'link';
+    sourceId: string;
+    targetId: string;
+    linkIndex: number;
+};
+//# sourceMappingURL=sankey-shape.d.ts.map

package/charts/sankey-chart/types/{sankey-hover.js → sankey-shape.js}

@@ -11,5 +11,5 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var sankey_hover_exports = {};
-module.exports = __toCommonJS(sankey_hover_exports);
+var sankey_shape_exports = {};
+module.exports = __toCommonJS(sankey_shape_exports);

package/charts/sankey-chart/types/sankey-state.d.ts

@@ -0,0 +1,12 @@
+import type { SankeyShape } from './sankey-shape.js';
+/**
+ * The Sankey chart's interaction state and single source of truth for
+ * highlighting. `hovered` tracks the shape under the pointer; `selected` tracks
+ * the shape locked in by a click. Both feed the highlight rendering, with click
+ * selection taking visual precedence over hover.
+ */
+export interface SankeyState {
+    hovered: SankeyShape | undefined;
+    selected: SankeyShape | undefined;
+}
+//# sourceMappingURL=sankey-state.d.ts.map

package/charts/sankey-chart/types/sankey-state.js

@@ -0,0 +1,15 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var sankey_state_exports = {};
+module.exports = __toCommonJS(sankey_state_exports);

package/charts/sankey-chart/utils/find-connected-shapes.d.ts

@@ -0,0 +1,35 @@
+import type { SankeyLayoutLink, SankeyLayoutNode } from '../types/sankey-internal.js';
+interface ConnectedShapes {
+    nodes: ReadonlySet<SankeyLayoutNode>;
+    links: ReadonlySet<SankeyLayoutLink>;
+}
+/**
+ * A resolved layout selection ready for connected-shape computation.
+ *
+ * - `node`: the clicked layout node (source/target links are already
+ *   populated by d3-sankey).
+ * - `link`: the clicked layout link with its endpoint nodes already resolved
+ *   to objects by the caller; callers must guard with `isResolvedNode` before
+ *   passing here so the function never needs to cast.
+ */
+type ResolvedShape = {
+    type: 'node';
+    node: SankeyLayoutNode;
+} | {
+    type: 'link';
+    link: SankeyLayoutLink;
+    source: SankeyLayoutNode;
+    target: SankeyLayoutNode;
+};
+/**
+ * Computes the 1-hop connected set for a resolved layout shape.
+ *
+ * - **Node**: the node, all of its direct source/target links, and the
+ *   other-end nodes of those links. Does not traverse further hops.
+ * - **Link**: the link and its two endpoint nodes.
+ *
+ * Handles isolated nodes (no `sourceLinks`/`targetLinks`) without throwing.
+ */
+export declare function findConnectedShapes(shape: ResolvedShape): ConnectedShapes;
+export {};
+//# sourceMappingURL=find-connected-shapes.d.ts.map

package/charts/sankey-chart/utils/find-connected-shapes.js

@@ -0,0 +1,44 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var find_connected_shapes_exports = {};
+__export(find_connected_shapes_exports, {
+  findConnectedShapes: () => findConnectedShapes
+});
+module.exports = __toCommonJS(find_connected_shapes_exports);
+function findConnectedShapes(shape) {
+  if (shape.type === "link") {
+    return {
+      nodes: /* @__PURE__ */ new Set([shape.source, shape.target]),
+      links: /* @__PURE__ */ new Set([shape.link])
+    };
+  }
+  const { node } = shape;
+  const sourceLinks = node.sourceLinks ?? [];
+  const targetLinks = node.targetLinks ?? [];
+  const nodes = /* @__PURE__ */ new Set([node]);
+  const links = /* @__PURE__ */ new Set();
+  for (const link of sourceLinks) {
+    links.add(link);
+    nodes.add(link.target);
+  }
+  for (const link of targetLinks) {
+    links.add(link);
+    nodes.add(link.source);
+  }
+  return { nodes, links };
+}

package/charts/sankey-chart/utils/find-hovered-shape.d.ts

@@ -1,6 +1,6 @@
 import type { Point } from '../../core/types/point.js';
-import type { SankeyHoveredShape } from '../types/sankey-hover.js';
 import type { SankeyLayoutLink, SankeyLayoutModel, SankeyLayoutNode } from '../types/sankey-internal.js';
+import type { SankeyShape } from '../types/sankey-shape.js';
 export declare function isPointInNode(node: SankeyLayoutNode, point: Point): boolean;
 export declare function isPointInLinkRibbon(link: SankeyLayoutLink, point: Point): boolean;
 /**
@@ -10,5 +10,5 @@ export declare function isPointInLinkRibbon(link: SankeyLayoutLink, point: Point
  * that the wider ribbons converging on them would otherwise swallow. Within
  * each category, the first match in layout order wins.
  */
-export declare function findHoveredShape(layout: SankeyLayoutModel, point: Point): SankeyHoveredShape | undefined;
+export declare function findHoveredShape(layout: SankeyLayoutModel, point: Point): SankeyShape | undefined;
 //# sourceMappingURL=find-hovered-shape.d.ts.map

package/charts/sankey-chart/utils/find-hovered-shape.js

@@ -22,7 +22,6 @@ __export(find_hovered_shape_exports, {
   isPointInNode: () => isPointInNode
 });
 module.exports = __toCommonJS(find_hovered_shape_exports);
-var import_get_related_sankey_flow = require("./get-related-sankey-flow.js");
 var import_is_resolved_sankey_node = require("./is-resolved-sankey-node.js");
 const BISECTION_ITERATIONS = 24;
 function isPointInNode(node, point) {
@@ -70,22 +69,16 @@ function isPointInLinkRibbon(link, point) {
 function findHoveredShape(layout, point) {
   for (const node of layout.nodes) {
     if (isPointInNode(node, point)) {
-      const { nodes: relatedNodes, links: relatedLinks } = (0, import_get_related_sankey_flow.getRelatedSankeyFlow)(node);
-      return {
-        type: "node",
-        node,
-        relatedNodes,
-        relatedLinks
-      };
+      return { type: "node", nodeId: node.id };
     }
   }
   for (const link of layout.links) {
     if ((0, import_is_resolved_sankey_node.isResolvedNode)(link.source) && (0, import_is_resolved_sankey_node.isResolvedNode)(link.target) && isPointInLinkRibbon(link, point)) {
       return {
         type: "link",
-        link,
-        source: link.source,
-        target: link.target
+        sourceId: link.source.id,
+        targetId: link.target.id,
+        linkIndex: link.index ?? 0
       };
     }
   }

package/charts/sankey-chart/utils/generate-sankey-layout.js

@@ -20,6 +20,7 @@ __export(generate_sankey_layout_exports, {
   generateSankeyLayout: () => generateSankeyLayout
 });
 module.exports = __toCommonJS(generate_sankey_layout_exports);
+var import_layout_index = require("./layout-index.js");
 var import_constants = require("../constants.js");
 var import_d3_sankey = require("../vendor/d3-sankey/index.js");
 const alignmentMap = {
@@ -35,8 +36,16 @@ const generateSankeyLayout = (graph, width, height, nodeWidth = import_constants
     [import_constants.LAYOUT_MARGIN, import_constants.LAYOUT_MARGIN],
     [width - import_constants.LAYOUT_MARGIN, height - import_constants.LAYOUT_MARGIN]
   ]).nodeAlign(alignmentMap[nodeAlignment ?? "justify"]);
-  return generator({
+  const layout = generator({
     nodes: graph.nodes.map((node) => ({ ...node })),
     links: graph.links.map((link) => ({ ...link }))
   });
+  const indexed = layout;
+  if (indexed.nodeById && indexed.linkBySource) {
+    (0, import_layout_index.primeLayoutIndex)(layout, {
+      nodesById: indexed.nodeById,
+      linksBySource: indexed.linkBySource
+    });
+  }
+  return layout;
 };

package/charts/sankey-chart/utils/get-active-connected-set.d.ts

@@ -0,0 +1,27 @@
+import type { SankeyLayoutLink, SankeyLayoutModel, SankeyLayoutNode } from '../types/sankey-internal.js';
+import type { SankeyShape } from '../types/sankey-shape.js';
+/**
+ * The set of nodes and links that should be visually emphasized in the active
+ * interaction state. All other nodes and links are dimmed.
+ */
+export interface ActiveConnectedSet {
+    nodes: SankeyLayoutNode[];
+    links: SankeyLayoutLink[];
+}
+/**
+ * Resolves the active visual connected set from the current click-selection and
+ * hover state, applying click-over-hover precedence.
+ *
+ * Click selection always takes visual precedence: when `selected` is defined
+ * and its identity resolves in the current `layout`, `hovered` is ignored for
+ * visual rendering purposes. When the selected identity is no longer present
+ * (data changed), the function falls through to hover state so the pointer can
+ * recover visually without requiring an explicit deselect. With neither
+ * interaction it returns `undefined` (no dimming).
+ *
+ * Both `selected` and `hovered` carry only stable ids (not layout-object
+ * references) so this function always reads from the current layout, never
+ * stale geometry.
+ */
+export declare function getActiveConnectedSet(layout: SankeyLayoutModel, selected: SankeyShape | undefined, hovered: SankeyShape | undefined): ActiveConnectedSet | undefined;
+//# sourceMappingURL=get-active-connected-set.d.ts.map