@galaxy-io/dls 1.4.9 → 1.4.11

package/dist/charts/ChartPrimitives.js

@@ -22,12 +22,10 @@ import { styled } from "@linaria/react";
 * HOC's return type erases the element type, so a mismatched ref would compile.
 */
 /**
-* Shared emphasis ramp.
+* Shared emphasis states.
 *
-* The delay asymmetry is deliberate and load-bearing: highlighting is instant,
-* but restoring waits, so sweeping the pointer across categories reads as one
-* gesture instead of a strobe. The plot sets `data-active` while any category is
-* engaged, which cancels the delay for the whole subtree.
+* Deliberately no transition: emphasis is feedback, and feedback that eases in
+* reads as lag. The states snap.
 */
 /**
 * Outer container. Receives the measurement ref.
@@ -104,38 +102,29 @@ var ChartSvg = /*#__PURE__*/ styled("svg")({
 	class: "c10uj5yt",
 	propsAsIs: false
 });
-/**
-* Cancels the restore delay for every mark beneath it while a category is
-* engaged. See {@link markState}.
-*/
-var ChartPlotGroup = /*#__PURE__*/ styled("g")({
-	name: "ChartPlotGroup",
-	class: "cyuty3o",
-	propsAsIs: true
-});
 var ChartBarPath = /*#__PURE__*/ styled("path")({
 	name: "ChartBarPath",
-	class: "c1ob2op2",
+	class: "cyuty3o",
 	propsAsIs: true
 });
 var ChartLinePath = /*#__PURE__*/ styled("path")({
 	name: "ChartLinePath",
-	class: "c8c506o",
+	class: "c1ob2op2",
 	propsAsIs: true
 });
 var ChartAreaPath = /*#__PURE__*/ styled("path")({
 	name: "ChartAreaPath",
-	class: "ceqlpek",
+	class: "c8c506o",
 	propsAsIs: true
 });
 var ChartPointCircle = /*#__PURE__*/ styled("circle")({
 	name: "ChartPointCircle",
-	class: "c1fcbddl",
+	class: "ceqlpek",
 	propsAsIs: true
 });
 var ChartArcPath = /*#__PURE__*/ styled("path")({
 	name: "ChartArcPath",
-	class: "cpcxr59",
+	class: "c1fcbddl",
 	propsAsIs: true
 });
 /**
@@ -151,7 +140,7 @@ var ChartArcPath = /*#__PURE__*/ styled("path")({
 */
 var ChartHitTarget = /*#__PURE__*/ styled("rect")({
 	name: "ChartHitTarget",
-	class: "c1wvzvu4",
+	class: "cpcxr59",
 	propsAsIs: true
 });
 /**
@@ -164,7 +153,7 @@ var ChartHitTarget = /*#__PURE__*/ styled("rect")({
 */
 var ChartHitTargetPath = /*#__PURE__*/ styled("path")({
 	name: "ChartHitTargetPath",
-	class: "c17guewt",
+	class: "c1wvzvu4",
 	propsAsIs: true
 });
 /**
@@ -175,21 +164,21 @@ var ChartHitTargetPath = /*#__PURE__*/ styled("path")({
 var _exp15 = () => ({ theme }) => theme.color.border.primary;
 var ChartGridLine = withTheme(/*#__PURE__*/ styled("line")({
 	name: "ChartGridLine",
-	class: "cblgiyf",
+	class: "c17guewt",
 	propsAsIs: true,
-	vars: { "cblgiyf-0": [_exp15()] }
+	vars: { "c17guewt-0": [_exp15()] }
 }));
 /** Vertical rule marking the hovered category on a line chart. */
 var _exp16 = () => ({ theme }) => theme.color.border.secondary;
 var ChartCursorLine = withTheme(/*#__PURE__*/ styled("line")({
 	name: "ChartCursorLine",
-	class: "c1lr03cc",
+	class: "cblgiyf",
 	propsAsIs: true,
-	vars: { "c1lr03cc-0": [_exp16()] }
+	vars: { "cblgiyf-0": [_exp16()] }
 }));
 var ChartAxisLabelBox = /*#__PURE__*/ styled("foreignObject")({
 	name: "ChartAxisLabelBox",
-	class: "cizy1s8",
+	class: "c1lr03cc",
 	propsAsIs: true
 });
 /**
@@ -206,14 +195,14 @@ var _exp22 = () => ({ theme }) => theme.color.background.tertiary;
 var _exp23 = () => ({ $isVisible }) => $isVisible ? 1 : 0;
 var ChartTooltipPositioner = withTheme(/*#__PURE__*/ styled("div")({
 	name: "ChartTooltipPositioner",
-	class: "c1ukq11d",
+	class: "cizy1s8",
 	propsAsIs: false,
 	vars: {
-		"c1ukq11d-0": [_exp17()],
-		"c1ukq11d-1": [_exp18()],
-		"c1ukq11d-2": [_exp21()],
-		"c1ukq11d-3": [_exp22()],
-		"c1ukq11d-4": [_exp23()]
+		"cizy1s8-0": [_exp17()],
+		"cizy1s8-1": [_exp18()],
+		"cizy1s8-2": [_exp21()],
+		"cizy1s8-3": [_exp22()],
+		"cizy1s8-4": [_exp23()]
 	}
 }));
 /**
@@ -227,19 +216,19 @@ var ChartTooltipPositioner = withTheme(/*#__PURE__*/ styled("div")({
 */
 var ChartTooltipGrid = /*#__PURE__*/ styled("div")({
 	name: "ChartTooltipGrid",
-	class: "cwcko2m",
+	class: "c1ukq11d",
 	propsAsIs: false
 });
 /** Swatch + label. `min-width: 0` is what lets the label actually ellipsize. */
 var ChartTooltipLabelCell = /*#__PURE__*/ styled("div")({
 	name: "ChartTooltipLabelCell",
-	class: "cqwhvyz",
+	class: "cwcko2m",
 	propsAsIs: false
 });
 /** Right-aligned and never wrapped — the value always shows in full. */
 var ChartTooltipValueCell = /*#__PURE__*/ styled("div")({
 	name: "ChartTooltipValueCell",
-	class: "c1iaray",
+	class: "cqwhvyz",
 	propsAsIs: false
 });
 /**
@@ -255,12 +244,12 @@ var _exp28 = () => ({ $centerY }) => `${$centerY}px`;
 var _exp30 = () => ({ $diameter }) => `${$diameter}px`;
 var ChartCenterBox = /*#__PURE__*/ styled("div")({
 	name: "ChartCenterBox",
-	class: "cz6jod1",
+	class: "c1iaray",
 	propsAsIs: false,
 	vars: {
-		"cz6jod1-0": [_exp27()],
-		"cz6jod1-1": [_exp28()],
-		"cz6jod1-2": [_exp30()]
+		"c1iaray-0": [_exp27()],
+		"c1iaray-1": [_exp28()],
+		"c1iaray-2": [_exp30()]
 	}
 });
 /**
@@ -271,21 +260,15 @@ var _exp31 = () => ({ theme }) => theme.color.border.primary;
 var _exp32 = () => ({ theme }) => theme.color.background.primary;
 var ChartEmptyOverlay = withTheme(/*#__PURE__*/ styled("div")({
 	name: "ChartEmptyOverlay",
-	class: "c1de5mqk",
+	class: "cz6jod1",
 	propsAsIs: false,
 	vars: {
-		"c1de5mqk-0": [_exp31()],
-		"c1de5mqk-1": [_exp32()]
+		"cz6jod1-0": [_exp31()],
+		"cz6jod1-1": [_exp32()]
 	}
 }));
 /**
 * Aligns the legend under the plot rather than the value-axis gutter.
-*
-* Also cancels the restore delay for its entries while the legend is dimming,
-* exactly as {@link ChartPlotGroup} does for the marks. The legend renders
-* *outside* the SVG, so the plot group's selector cannot reach it — without this
-* the marks dim instantly while their legend entries sit through the full
-* {@link CHART_RESTORE_DELAY_MS}, and the two visibly fall out of step.
 */
 var _exp33 = () => ({ $vertical }) => $vertical ? "column" : "row";
 var _exp34 = () => ({ $vertical }) => $vertical ? "flex-start" : "center";
@@ -298,18 +281,18 @@ var _exp40 = () => ({ $vertical }) => $vertical ? "0" : "10px";
 var _exp41 = () => ({ $inset }) => `${$inset}px`;
 var ChartLegendRow = /*#__PURE__*/ styled("div")({
 	name: "ChartLegendRow",
-	class: "cjirv6a",
+	class: "c1de5mqk",
 	propsAsIs: false,
 	vars: {
-		"cjirv6a-0": [_exp33()],
-		"cjirv6a-1": [_exp34()],
-		"cjirv6a-2": [_exp35()],
-		"cjirv6a-3": [_exp36()],
-		"cjirv6a-4": [_exp37()],
-		"cjirv6a-5": [_exp38()],
-		"cjirv6a-6": [_exp39()],
-		"cjirv6a-7": [_exp40()],
-		"cjirv6a-8": [_exp41()]
+		"c1de5mqk-0": [_exp33()],
+		"c1de5mqk-1": [_exp34()],
+		"c1de5mqk-2": [_exp35()],
+		"c1de5mqk-3": [_exp36()],
+		"c1de5mqk-4": [_exp37()],
+		"c1de5mqk-5": [_exp38()],
+		"c1de5mqk-6": [_exp39()],
+		"c1de5mqk-7": [_exp40()],
+		"c1de5mqk-8": [_exp41()]
 	}
 });
 /**
@@ -325,12 +308,12 @@ var _exp43 = () => ({ $vertical }) => $vertical ? "flex-start" : "center";
 var _exp44 = () => ({ $vertical }) => $vertical ? `8px` : `16px`;
 var ChartLegendMeasure = /*#__PURE__*/ styled("div")({
 	name: "ChartLegendMeasure",
-	class: "c1armna5",
+	class: "cjirv6a",
 	propsAsIs: false,
 	vars: {
-		"c1armna5-0": [_exp42()],
-		"c1armna5-1": [_exp43()],
-		"c1armna5-2": [_exp44()]
+		"cjirv6a-0": [_exp42()],
+		"cjirv6a-1": [_exp43()],
+		"cjirv6a-2": [_exp44()]
 	}
 });
 /**
@@ -338,13 +321,11 @@ var ChartLegendMeasure = /*#__PURE__*/ styled("div")({
 * the body of an interactive tooltip.
 *
 * Scrolls past {@link CHART_LEGEND_OVERFLOW_MAX_HEIGHT} so a fifty-series chart
-* gets a bounded popover rather than one taller than the plot. Carries its own
-* `data-active` delay-cancel rule: the tooltip content mounts outside
-* {@link ChartLegendRow}, where the row's selector cannot reach it.
+* gets a bounded popover rather than one taller than the plot.
 */
 var ChartLegendOverflowList = /*#__PURE__*/ styled("div")({
 	name: "ChartLegendOverflowList",
-	class: "cgd77rv",
+	class: "c1armna5",
 	propsAsIs: false
 });
 /**
@@ -361,14 +342,14 @@ var ChartLegendOverflowList = /*#__PURE__*/ styled("div")({
 */
 var ChartLegendItemButton = /*#__PURE__*/ styled("button")({
 	name: "ChartLegendItemButton",
-	class: "cutidpi",
+	class: "cgd77rv",
 	propsAsIs: false
 });
 /** The same row, when the legend is inert — no button semantics to announce. */
 var ChartLegendItemStatic = /*#__PURE__*/ styled("div")({
 	name: "ChartLegendItemStatic",
-	class: "ccpczg",
+	class: "cutidpi",
 	propsAsIs: false
 });
 //#endregion
-export { ChartArcPath, ChartAreaPath, ChartAxisLabelBox, ChartBarPath, ChartCenterBox, ChartCursorLine, ChartEmptyOverlay, ChartGridLine, ChartHitTarget, ChartHitTargetPath, ChartLegendItemButton, ChartLegendItemStatic, ChartLegendMeasure, ChartLegendOverflowList, ChartLegendRow, ChartLinePath, ChartPlotBox, ChartPlotGroup, ChartPointCircle, ChartRoot, ChartSvg, ChartTooltipGrid, ChartTooltipLabelCell, ChartTooltipPositioner, ChartTooltipValueCell };
+export { ChartArcPath, ChartAreaPath, ChartAxisLabelBox, ChartBarPath, ChartCenterBox, ChartCursorLine, ChartEmptyOverlay, ChartGridLine, ChartHitTarget, ChartHitTargetPath, ChartLegendItemButton, ChartLegendItemStatic, ChartLegendMeasure, ChartLegendOverflowList, ChartLegendRow, ChartLinePath, ChartPlotBox, ChartPointCircle, ChartRoot, ChartSvg, ChartTooltipGrid, ChartTooltipLabelCell, ChartTooltipPositioner, ChartTooltipValueCell };

package/dist/charts/DashboardProvider.d.ts

@@ -0,0 +1,47 @@
+import { type PropsWithChildren } from "react";
+/**
+ * The category one chart's pointer is currently over, broadcast to its
+ * siblings.
+ */
+export interface DashboardSyncEntry {
+    /** `useId` of the chart whose pointer produced this entry. */
+    sourceId: string;
+    /**
+     * The raw category label under the pointer — never `labelFormatter` output,
+     * so two charts formatting the same label differently still match.
+     */
+    categoryKey: string;
+}
+export interface DashboardContextValue {
+    activeEntry: DashboardSyncEntry | null;
+    setActive: (entry: DashboardSyncEntry) => void;
+    /** Clears only if the current entry belongs to `sourceId`. */
+    clearActive: (sourceId: string) => void;
+}
+export declare const DashboardContext: import("react").Context<DashboardContextValue | null>;
+/**
+ * Shares the hovered category between the cartesian charts inside it.
+ *
+ * Hovering a category in one chart shows the same category emphasized in every
+ * sibling — matched by raw category label, so charts whose category sets only
+ * partially overlap simply show nothing for the labels they lack. The tooltip
+ * stays local to the chart under the pointer; siblings get the quiet emphasis
+ * only (LineChart its cursor line and dots, BarChart its category muting).
+ *
+ * Scope, deliberately narrow:
+ * - Only the category axis syncs. Legend (series) hover stays local.
+ * - PieChart never participates — it has no category axis.
+ * - There is no per-chart opt-out prop. The opt-out is rendering the chart
+ *   outside the provider, and nesting a second provider isolates a subset —
+ *   charts sync with their nearest ancestor.
+ *
+ * Renders no DOM and holds no layout opinion — unlike `OverlayProvider` it is
+ * not a page-root singleton, and several can coexist on a page.
+ *
+ * Plain context state is the right transport here: entries change at category
+ * granularity (once per hit band crossed, not per mousemove), so a sweep
+ * across a chart re-renders the group a handful of times. No subscription or
+ * selector machinery is warranted.
+ */
+export declare const DashboardProvider: ({ children }: PropsWithChildren) => import("react").JSX.Element;
+export default DashboardProvider;

package/dist/charts/DashboardProvider.js

@@ -0,0 +1,52 @@
+import { createContext, useCallback, useMemo, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/charts/DashboardProvider.tsx
+var DashboardContext = createContext(null);
+/**
+* Shares the hovered category between the cartesian charts inside it.
+*
+* Hovering a category in one chart shows the same category emphasized in every
+* sibling — matched by raw category label, so charts whose category sets only
+* partially overlap simply show nothing for the labels they lack. The tooltip
+* stays local to the chart under the pointer; siblings get the quiet emphasis
+* only (LineChart its cursor line and dots, BarChart its category muting).
+*
+* Scope, deliberately narrow:
+* - Only the category axis syncs. Legend (series) hover stays local.
+* - PieChart never participates — it has no category axis.
+* - There is no per-chart opt-out prop. The opt-out is rendering the chart
+*   outside the provider, and nesting a second provider isolates a subset —
+*   charts sync with their nearest ancestor.
+*
+* Renders no DOM and holds no layout opinion — unlike `OverlayProvider` it is
+* not a page-root singleton, and several can coexist on a page.
+*
+* Plain context state is the right transport here: entries change at category
+* granularity (once per hit band crossed, not per mousemove), so a sweep
+* across a chart re-renders the group a handful of times. No subscription or
+* selector machinery is warranted.
+*/
+var DashboardProvider = ({ children }) => {
+	const [activeEntry, setActiveEntry] = useState(null);
+	const setActive = useCallback((entry) => {
+		setActiveEntry((prev) => prev !== null && prev.sourceId === entry.sourceId && prev.categoryKey === entry.categoryKey ? prev : entry);
+	}, []);
+	const clearActive = useCallback((sourceId) => {
+		setActiveEntry((prev) => prev !== null && prev.sourceId === sourceId ? null : prev);
+	}, []);
+	const contextValue = useMemo(() => ({
+		activeEntry,
+		setActive,
+		clearActive
+	}), [
+		activeEntry,
+		setActive,
+		clearActive
+	]);
+	return /* @__PURE__ */ jsx(DashboardContext.Provider, {
+		value: contextValue,
+		children
+	});
+};
+//#endregion
+export { DashboardContext, DashboardProvider, DashboardProvider as default };

package/dist/charts/LineChart.js

@@ -68,6 +68,7 @@ var LineChart = ({ series, lines, categories, width, height, fillWidth, fillHeig
 	const interaction = useChartInteraction({
 		categoryCount: geometry.columns.length,
 		seriesKeys: legendKeys,
+		categoryKeys: geometry.categories,
 		disabled: noTooltip || isLoading || isEmpty,
 		isLoading
 	});

package/dist/charts/ProgressBar.d.ts

@@ -1,3 +1,4 @@
+/** Fill color. Signals what the progress *means* — neutral, healthy, at risk. */
 export declare enum ProgressBarVariant {
     PRIMARY = "PRIMARY",
     SECONDARY = "SECONDARY",
@@ -6,12 +7,23 @@ export declare enum ProgressBarVariant {
     WARNING = "WARNING",
     ERROR = "ERROR"
 }
-interface ProgressBarProps {
+export interface ProgressBarProps {
+    /** Fill, 0–100. Values outside that range render empty rather than clamping. */
     percentage: number;
+    /** @default ProgressBarVariant.PRIMARY */
     variant?: ProgressBarVariant;
+    /** Bar thickness in px. @default 4 */
     height?: number;
+    /** Render 0% as truly empty instead of the default hairline sliver. */
     noSliverOnZero?: boolean;
+    /** Drop the pulse on the fill. */
     noAnimation?: boolean;
 }
+/**
+ * A horizontal completion bar.
+ *
+ * At 0% it leaves a 0.5px sliver so the track still reads as a bar rather than
+ * an empty box — set `noSliverOnZero` when exact emptiness matters.
+ */
 declare const ProgressBar: ({ percentage, variant, height, noSliverOnZero, noAnimation, }: ProgressBarProps) => import("react").JSX.Element;
 export default ProgressBar;

package/dist/charts/ProgressBar.js

@@ -5,6 +5,7 @@ import { match } from "ts-pattern";
 import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/charts/ProgressBar.tsx
+/** Fill color. Signals what the progress *means* — neutral, healthy, at risk. */
 var ProgressBarVariant = /* @__PURE__ */ function(ProgressBarVariant) {
 	ProgressBarVariant["PRIMARY"] = "PRIMARY";
 	ProgressBarVariant["SECONDARY"] = "SECONDARY";
@@ -40,6 +41,12 @@ var ProgressBarFill = withTheme(/*#__PURE__*/ styled("div")({
 		"p1sc05jm-2": [_exp6()]
 	}
 }));
+/**
+* A horizontal completion bar.
+*
+* At 0% it leaves a 0.5px sliver so the track still reads as a bar rather than
+* an empty box — set `noSliverOnZero` when exact emptiness matters.
+*/
 var ProgressBar = ({ percentage, variant = "PRIMARY", height = 4, noSliverOnZero = false, noAnimation = false }) => {
 	return /* @__PURE__ */ jsx(StyledProgressBar, {
 		$height: height,

package/dist/charts/StatChart.d.ts

@@ -1,15 +1,24 @@
 import type { ReactNode } from "react";
+/** Surface treatment of the stat tile. */
 export declare enum StatChartVariant {
     BASE = "BASE",
     PRIMARY = "PRIMARY",
     SECONDARY = "SECONDARY",
     TERTIARY = "TERTIARY"
 }
-interface StatChartProps {
+export interface StatChartProps {
+    /** What the number means. Rendered small and secondary above the value. */
     label: string;
+    /** The headline figure. A node, so it can carry a unit or a trend indicator. */
     value: ReactNode;
+    /** @default StatChartVariant.PRIMARY */
     variant?: StatChartVariant;
+    /** Drop the hairline border — for tiles inside an already-bordered container. */
     noBorder?: boolean;
 }
+/**
+ * A single-number stat tile — the KPI card. Fixed 140px minimum width so a row
+ * of them lines up without you setting widths.
+ */
 declare const StatChart: ({ label, value, variant, noBorder, }: StatChartProps) => import("react").JSX.Element;
 export default StatChart;

package/dist/charts/StatChart.js

@@ -6,6 +6,7 @@ import { styled } from "@linaria/react";
 import { match } from "ts-pattern";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/charts/StatChart.tsx
+/** Surface treatment of the stat tile. */
 var StatChartVariant = /* @__PURE__ */ function(StatChartVariant) {
 	StatChartVariant["BASE"] = "BASE";
 	StatChartVariant["PRIMARY"] = "PRIMARY";
@@ -24,6 +25,10 @@ var StatChartWrapper = withTheme(/*#__PURE__*/ styled("div")({
 		"slaxlp8-1": [_exp2()]
 	}
 }));
+/**
+* A single-number stat tile — the KPI card. Fixed 140px minimum width so a row
+* of them lines up without you setting widths.
+*/
 var StatChart = ({ label, value, variant = "PRIMARY", noBorder }) => {
 	return /* @__PURE__ */ jsx(StatChartWrapper, {
 		$variant: variant,

package/dist/charts/constants.d.ts

@@ -159,27 +159,13 @@ export declare const AGGREGATED_SLICE_KEY = "__other__";
 /** Margin around a pie, which needs no axis gutters. */
 export declare const PIE_CHART_MARGIN: ChartMargin;
 /**
- * Duration in ms for hover, dim and tooltip transitions.
+ * Duration in ms for the tooltip's fade and glide.
  *
- * Sits inside the 75–150ms band the DLS uses everywhere else. Hover feedback is
- * a response, not an animation — anything long enough to *watch* reads as the
- * chart being slow rather than the chart being smooth.
+ * Sits inside the 75–150ms band the DLS uses everywhere else. Only the tooltip
+ * transitions — mark and legend emphasis snaps, because emphasis is feedback
+ * and feedback that eases in reads as lag.
  */
 export declare const CHART_TRANSITION_MS = 100;
-/**
- * Delay in ms before marks return to full strength after the pointer leaves.
- *
- * Restoring immediately makes the whole chart flash while the pointer sweeps
- * across categories. Highlighting stays instant (no delay) — only the
- * *un*-highlight waits, so a sweep reads as one continuous gesture.
- *
- * Kept short because it does less work than it looks: while the pointer is
- * anywhere in the plot the chart is still engaged, so `ChartPlotGroup` and
- * `ChartLegendRow` zero this out and category-to-category sweeping is already
- * instant. All this actually covers is the moment the pointer leaves entirely,
- * where a long delay just feels like lag.
- */
-export declare const CHART_RESTORE_DELAY_MS = 200;
 /**
  * Opacity ramp for the mark states.
  *

package/dist/charts/constants.js

@@ -169,28 +169,14 @@ var PIE_CHART_MARGIN = {
 	left: 8
 };
 /**
-* Duration in ms for hover, dim and tooltip transitions.
+* Duration in ms for the tooltip's fade and glide.
 *
-* Sits inside the 75–150ms band the DLS uses everywhere else. Hover feedback is
-* a response, not an animation — anything long enough to *watch* reads as the
-* chart being slow rather than the chart being smooth.
+* Sits inside the 75–150ms band the DLS uses everywhere else. Only the tooltip
+* transitions — mark and legend emphasis snaps, because emphasis is feedback
+* and feedback that eases in reads as lag.
 */
 var CHART_TRANSITION_MS = 100;
 /**
-* Delay in ms before marks return to full strength after the pointer leaves.
-*
-* Restoring immediately makes the whole chart flash while the pointer sweeps
-* across categories. Highlighting stays instant (no delay) — only the
-* *un*-highlight waits, so a sweep reads as one continuous gesture.
-*
-* Kept short because it does less work than it looks: while the pointer is
-* anywhere in the plot the chart is still engaged, so `ChartPlotGroup` and
-* `ChartLegendRow` zero this out and category-to-category sweeping is already
-* instant. All this actually covers is the moment the pointer leaves entirely,
-* where a long delay just feels like lag.
-*/
-var CHART_RESTORE_DELAY_MS = 200;
-/**
 * Opacity ramp for the mark states.
 *
 * The grammar is inherited from the reference charts and is the opposite of the
@@ -280,4 +266,4 @@ var CHART_PALETTE_ORDER = [
 	ChartPalette.RED
 ];
 //#endregion
-export { AGGREGATED_SLICE_KEY, AUTO_MARGIN_LEFT_STEP, AXIS_TITLE_BAND, AXIS_TITLE_GAP, BAR_GAP_COMFORTABLE, BAR_GAP_MEDIUM, BAR_GAP_TIGHT, BAR_RADIUS, BAR_RADIUS_NARROW, BAR_WIDTH_RATIO, CAPTION_CHAR_WIDTH_PX, CATEGORY_AXIS_LABEL_GAP, CATEGORY_AXIS_LABEL_HEIGHT, CHART_LEGEND_COLUMN_GAP, CHART_LEGEND_OVERFLOW_MAX_HEIGHT, CHART_LEGEND_SIDE_GAP, CHART_LEGEND_VERTICAL_GAP, CHART_MARK_OPACITY_ACTIVE, CHART_MARK_OPACITY_MUTED, CHART_PALETTE_ORDER, CHART_RESTORE_DELAY_MS, CHART_TOOLTIP_MAX_WIDTH, CHART_TOOLTIP_MIN_WIDTH, CHART_TOOLTIP_OFFSET, CHART_TRANSITION_MS, DEFAULT_CHART_MARGIN, DEFAULT_LINE_STROKE_WIDTH, DEFAULT_VALUE_TICK_COUNT, GRID_LINE_BLEED, GROUP_GAP_COMFORTABLE, GROUP_GAP_MEDIUM, GROUP_GAP_TIGHT, LINE_AREA_OPACITY, LINE_POINT_RADIUS, MAX_AUTO_MARGIN_LEFT, MAX_BAR_WIDTH, MAX_GAP_SHARE, MIN_AUTO_MARGIN_LEFT, MIN_BARS_FOR_TIGHT_SPACING, MIN_BAR_LENGTH, MIN_CATEGORY_LABEL_GAP, NARROW_BAR_WIDTH, PIE_CHART_MARGIN, PIE_CORNER_RADIUS, PIE_DONUT_INNER_RATIO, PIE_MAX_AUTO_INNER_RATIO, PIE_MAX_INSET_SHARE, PIE_MIN_SLICE_SHARE, PIE_PAD_ANGLE, PIE_TOOLTIP_ANCHOR_INSET, STACK_SEGMENT_GAP, VALUE_AXIS_LABEL_HEIGHT, VALUE_AXIS_TICK_GAP, WIDTH_FOR_MEDIUM_SPACING, WIDTH_FOR_TIGHT_SPACING };
+export { AGGREGATED_SLICE_KEY, AUTO_MARGIN_LEFT_STEP, AXIS_TITLE_BAND, AXIS_TITLE_GAP, BAR_GAP_COMFORTABLE, BAR_GAP_MEDIUM, BAR_GAP_TIGHT, BAR_RADIUS, BAR_RADIUS_NARROW, BAR_WIDTH_RATIO, CAPTION_CHAR_WIDTH_PX, CATEGORY_AXIS_LABEL_GAP, CATEGORY_AXIS_LABEL_HEIGHT, CHART_LEGEND_COLUMN_GAP, CHART_LEGEND_OVERFLOW_MAX_HEIGHT, CHART_LEGEND_SIDE_GAP, CHART_LEGEND_VERTICAL_GAP, CHART_MARK_OPACITY_ACTIVE, CHART_MARK_OPACITY_MUTED, CHART_PALETTE_ORDER, CHART_TOOLTIP_MAX_WIDTH, CHART_TOOLTIP_MIN_WIDTH, CHART_TOOLTIP_OFFSET, CHART_TRANSITION_MS, DEFAULT_CHART_MARGIN, DEFAULT_LINE_STROKE_WIDTH, DEFAULT_VALUE_TICK_COUNT, GRID_LINE_BLEED, GROUP_GAP_COMFORTABLE, GROUP_GAP_MEDIUM, GROUP_GAP_TIGHT, LINE_AREA_OPACITY, LINE_POINT_RADIUS, MAX_AUTO_MARGIN_LEFT, MAX_BAR_WIDTH, MAX_GAP_SHARE, MIN_AUTO_MARGIN_LEFT, MIN_BARS_FOR_TIGHT_SPACING, MIN_BAR_LENGTH, MIN_CATEGORY_LABEL_GAP, NARROW_BAR_WIDTH, PIE_CHART_MARGIN, PIE_CORNER_RADIUS, PIE_DONUT_INNER_RATIO, PIE_MAX_AUTO_INNER_RATIO, PIE_MAX_INSET_SHARE, PIE_MIN_SLICE_SHARE, PIE_PAD_ANGLE, PIE_TOOLTIP_ANCHOR_INSET, STACK_SEGMENT_GAP, VALUE_AXIS_LABEL_HEIGHT, VALUE_AXIS_TICK_GAP, WIDTH_FOR_MEDIUM_SPACING, WIDTH_FOR_TIGHT_SPACING };

package/dist/charts/useChartInteraction.d.ts

@@ -9,10 +9,13 @@ import { ChartMarkState } from "./types";
  * - **Series** — a legend key. Hovering (or focusing) a legend entry isolates
  *   that series.
  *
- * Both live here rather than one of them in the charts, so there is a single
- * `isEngaged` boolean. That matters more than it looks: `ChartPlotGroup` uses it
- * to cancel the mark restore delay, and a second hover source that didn't feed
- * it would sit through that delay before muting anything and feel broken.
+ * Plus one read-only source: inside a `DashboardProvider`, a chart that
+ * supplies {@link UseChartInteractionOptions.categoryKeys} follows the category
+ * hovered in a sibling chart, matched by raw label. Following emphasizes — it
+ * never opens the tooltip, which is what {@link ChartInteraction.hasLocalHover}
+ * distinguishes. The series axis deliberately does not sync: series keys are
+ * chart-local vocabulary, and isolating "Delivered" in a chart that happens to
+ * share the name would correlate nothing.
  *
  * Deliberately no click layer. Clicking used to pin the hover so it survived
  * the pointer leaving, and it read as the chart getting stuck — the emphasis
@@ -23,6 +26,13 @@ interface UseChartInteractionOptions {
     categoryCount: number;
     /** Legend keys currently rendered. A key that disappears clears stale hover. */
     seriesKeys?: string[];
+    /**
+     * Raw category labels, index-aligned with {@link categoryCount}. Supplying
+     * them opts the chart into `DashboardProvider` crosshair sync; omit (as
+     * PieChart does) to stay out. Raw labels, never `labelFormatter` output —
+     * two charts formatting the same label differently must still match.
+     */
+    categoryKeys?: string[];
     /** Suppress all interaction — used while loading and when the tooltip is off. */
     disabled?: boolean;
     /**
@@ -43,11 +53,18 @@ interface MarkStateArgs {
     seriesKey?: string;
 }
 export interface ChartInteraction {
-    /** The hovered category — what the tooltip follows. */
+    /**
+     * The active category — this chart's own hover, or failing that the category
+     * a `DashboardProvider` sibling is hovering, resolved to a local index.
+     */
     activeIndex: number | null;
+    /**
+     * True when {@link activeIndex} comes from this chart's own pointer rather
+     * than a synced sibling. Gates the tooltip: only the chart under the pointer
+     * opens one.
+     */
+    hasLocalHover: boolean;
     hoveredSeriesKey: string | null;
-    /** True while *either* axis is engaged; cancels the mark restore delay. */
-    isEngaged: boolean;
     /**
      * Emphasis for one mark, composed from both axes.
      *
@@ -65,5 +82,5 @@ export interface ChartInteraction {
     onSeriesEnter: (seriesKey: string) => void;
     onSeriesLeave: () => void;
 }
-export declare function useChartInteraction({ categoryCount, seriesKeys, disabled, isLoading, }: UseChartInteractionOptions): ChartInteraction;
+export declare function useChartInteraction({ categoryCount, seriesKeys, categoryKeys, disabled, isLoading, }: UseChartInteractionOptions): ChartInteraction;
 export {};