@galaxy-io/dls 1.2.6 → 1.3.0

package/dist/charts/chartFormat.js

@@ -0,0 +1,59 @@
+import { ChartValueUnit } from "./types.js";
+import { match } from "ts-pattern";
+//#region src/charts/chartFormat.ts
+/**
+* Value and label formatting for the chart components.
+*
+* Resolving the formatter once, centrally, is what keeps axis ticks, value
+* labels and tooltip rows from drifting apart — a recurring problem when every
+* call site writes its own one-liner.
+*/
+/**
+* `Intl` formatters are comparatively expensive to construct, and the charts
+* format every tick and tooltip row on each render, so instances are cached per
+* unit.
+*/
+var FORMATTER_CACHE = /* @__PURE__ */ new Map();
+function getIntlFormatter(unit) {
+	const cached = FORMATTER_CACHE.get(unit);
+	if (cached) return cached;
+	const formatter = match(unit).with(ChartValueUnit.PLAIN, () => new Intl.NumberFormat(void 0, { maximumFractionDigits: 2 })).with(ChartValueUnit.CURRENCY, () => new Intl.NumberFormat(void 0, {
+		style: "currency",
+		currency: "USD",
+		maximumFractionDigits: 0
+	})).with(ChartValueUnit.PERCENT, () => new Intl.NumberFormat(void 0, { maximumFractionDigits: 1 })).with(ChartValueUnit.COMPACT, () => new Intl.NumberFormat(void 0, {
+		notation: "compact",
+		maximumFractionDigits: 1
+	})).exhaustive();
+	FORMATTER_CACHE.set(unit, formatter);
+	return formatter;
+}
+/**
+* Format a value with a built-in unit.
+*
+* `PERCENT` takes a 0–100 value rather than a 0–1 fraction, matching how
+* percentage data usually arrives, and appends the sign itself instead of using
+* `style: "percent"` (which would divide by 100).
+*/
+function formatChartValue(value, unit) {
+	if (!Number.isFinite(value)) return "—";
+	const formatted = getIntlFormatter(unit).format(value);
+	return unit === ChartValueUnit.PERCENT ? `${formatted}%` : formatted;
+}
+/**
+* Pick the effective value formatter.
+*
+* An explicit `valueFormatter` always wins; otherwise the unit supplies a
+* default, and `PLAIN` is the fallback when neither is given.
+*/
+function resolveValueFormatter(valueFormatter, unit) {
+	if (valueFormatter) return valueFormatter;
+	const resolvedUnit = unit ?? ChartValueUnit.PLAIN;
+	return (value) => formatChartValue(value, resolvedUnit);
+}
+/** Pick the effective label formatter, defaulting to identity. */
+function resolveLabelFormatter(labelFormatter) {
+	return labelFormatter ?? ((label) => label);
+}
+//#endregion
+export { formatChartValue, resolveLabelFormatter, resolveValueFormatter };

package/dist/charts/chartScales.d.ts

@@ -0,0 +1,84 @@
+import type { ChartMargin, ChartValueDomain, ChartValueFormatter } from "./types";
+/**
+ * Scale construction and axis sizing for the chart components.
+ *
+ * Pure arithmetic with no React and no theme access, so it can be unit-reasoned
+ * about and stays safe for Linaria's build-time evaluation.
+ */
+export declare const clamp: (value: number, min: number, max: number) => number;
+/**
+ * Coerce a datum value into something safe to feed a scale.
+ *
+ * A single `NaN` or `Infinity` in consumer data otherwise propagates into every
+ * path's `d` attribute and blanks the entire chart rather than one mark.
+ */
+export declare const sanitizeValue: (value: number | undefined | null) => number;
+/**
+ * Merge a partial margin over the defaults.
+ *
+ * Written per-field rather than as a spread: spreading an object that carries
+ * an explicit `undefined` overwrites the default with `undefined` rather than
+ * falling back to it, which is easy to trip over when the partial is assembled
+ * from separate optional values.
+ */
+export declare const resolveMargin: (partial?: Partial<ChartMargin>) => ChartMargin;
+/** Inner plot dimensions, never negative. */
+export declare const getPlotDimensions: (width: number, height: number, margin: ChartMargin) => {
+    plotWidth: number;
+    plotHeight: number;
+};
+/**
+ * Widen a margin to leave room for axis titles.
+ *
+ * The reservation has to happen here rather than inside the axis, because the
+ * margin is resolved before any axis renders — and with the root SVG set to
+ * `overflow: visible`, an unreserved title would paint outside the container and
+ * be clipped by whatever the consumer wraps the chart in.
+ *
+ * Applied to the caller's *partial* before {@link resolveMargin} fills in the
+ * defaults, so an explicit `margin.left` still governs the tick gutter and the
+ * title band is added on top of it rather than eating into it. Returns the input
+ * untouched when there are no titles, so the common case allocates nothing.
+ */
+export declare const addAxisTitleSpace: (partial: Partial<ChartMargin> | undefined, { hasValueTitle, hasCategoryTitle }: {
+    hasValueTitle: boolean;
+    hasCategoryTitle: boolean;
+}) => Partial<ChartMargin> | undefined;
+/**
+ * Build the value scale from a signed domain.
+ *
+ * Two behaviours worth knowing, both fixing defects in the V1 charts:
+ *
+ * - **Zero is always in the domain.** Bars need a baseline to grow from, and
+ *   without this a negative value maps outside the range and renders as a
+ *   rectangle with negative height, which paints nothing at all.
+ * - **A zero-width domain is widened to 0–1.** d3's `normalize()` returns a
+ *   constant `0.5` when the domain has no extent, so empty or all-zero data
+ *   would otherwise map every value to the middle of the plot and strand the
+ *   baseline halfway up.
+ */
+export declare const buildValueScale: ([min, max]: [number, number], range: [number, number]) => import("d3-scale").ScaleLinear<number, number, never>;
+/** Apply an explicit domain override on top of a computed domain. */
+export declare const applyDomainOverride: (computed: [number, number], override?: Partial<ChartValueDomain>) => [number, number];
+/** Band scale for categories, used by the bar chart. */
+export declare const buildCategoryBandScale: (labels: string[], range: [number, number], paddingInner: number, paddingOuter: number) => import("d3-scale").ScaleBand<string>;
+/** Point scale for categories, used by the line chart. */
+export declare const buildCategoryPointScale: (labels: string[], range: [number, number], padding?: number) => import("d3-scale").ScalePoint<string>;
+/**
+ * Estimate the left margin needed to fit the widest formatted tick label.
+ *
+ * Estimated from character count rather than measured from the DOM, mirroring
+ * `estimateColumnWidth` in `table/utils.ts`, so it works during server
+ * rendering. Clamped to at least the default margin, so it can only widen a
+ * chart, never shrink one.
+ */
+export declare const estimateValueAxisMargin: (ticks: number[], formatter: ChartValueFormatter) => number;
+/**
+ * How many categories to skip between rendered axis labels.
+ *
+ * Returns 1 when every label fits, so a chart that is not crowded renders
+ * exactly as it would with no skipping at all.
+ */
+export declare const getCategoryLabelStride: (labels: string[], step: number) => number;
+/** Tick values for the value axis, honoring an explicit tick count. */
+export declare const getValueTicks: (scale: ReturnType<typeof buildValueScale>, override?: Partial<ChartValueDomain>) => number[];

package/dist/charts/chartScales.js

@@ -0,0 +1,111 @@
+import { CAPTION_CHAR_WIDTH_PX, DEFAULT_CHART_MARGIN } from "./constants.js";
+import { scaleBand, scaleLinear, scalePoint } from "d3-scale";
+//#region src/charts/chartScales.ts
+/**
+* Scale construction and axis sizing for the chart components.
+*
+* Pure arithmetic with no React and no theme access, so it can be unit-reasoned
+* about and stays safe for Linaria's build-time evaluation.
+*/
+var clamp = (value, min, max) => Math.min(Math.max(value, min), max);
+/**
+* Coerce a datum value into something safe to feed a scale.
+*
+* A single `NaN` or `Infinity` in consumer data otherwise propagates into every
+* path's `d` attribute and blanks the entire chart rather than one mark.
+*/
+var sanitizeValue = (value) => typeof value === "number" && Number.isFinite(value) ? value : 0;
+/**
+* Merge a partial margin over the defaults.
+*
+* Written per-field rather than as a spread: spreading an object that carries
+* an explicit `undefined` overwrites the default with `undefined` rather than
+* falling back to it, which is easy to trip over when the partial is assembled
+* from separate optional values.
+*/
+var resolveMargin = (partial) => ({
+	top: partial?.top ?? DEFAULT_CHART_MARGIN.top,
+	right: partial?.right ?? DEFAULT_CHART_MARGIN.right,
+	bottom: partial?.bottom ?? DEFAULT_CHART_MARGIN.bottom,
+	left: partial?.left ?? DEFAULT_CHART_MARGIN.left
+});
+/** Inner plot dimensions, never negative. */
+var getPlotDimensions = (width, height, margin) => ({
+	plotWidth: Math.max(0, width - margin.left - margin.right),
+	plotHeight: Math.max(0, height - margin.top - margin.bottom)
+});
+/**
+* Widen a margin to leave room for axis titles.
+*
+* The reservation has to happen here rather than inside the axis, because the
+* margin is resolved before any axis renders — and with the root SVG set to
+* `overflow: visible`, an unreserved title would paint outside the container and
+* be clipped by whatever the consumer wraps the chart in.
+*
+* Applied to the caller's *partial* before {@link resolveMargin} fills in the
+* defaults, so an explicit `margin.left` still governs the tick gutter and the
+* title band is added on top of it rather than eating into it. Returns the input
+* untouched when there are no titles, so the common case allocates nothing.
+*/
+var addAxisTitleSpace = (partial, { hasValueTitle, hasCategoryTitle }) => {
+	if (!hasValueTitle && !hasCategoryTitle) return partial;
+	return {
+		...partial,
+		left: (partial?.left ?? DEFAULT_CHART_MARGIN.left) + (hasValueTitle ? 18 : 0),
+		bottom: (partial?.bottom ?? DEFAULT_CHART_MARGIN.bottom) + (hasCategoryTitle ? 18 : 0)
+	};
+};
+/**
+* Build the value scale from a signed domain.
+*
+* Two behaviours worth knowing, both fixing defects in the V1 charts:
+*
+* - **Zero is always in the domain.** Bars need a baseline to grow from, and
+*   without this a negative value maps outside the range and renders as a
+*   rectangle with negative height, which paints nothing at all.
+* - **A zero-width domain is widened to 0–1.** d3's `normalize()` returns a
+*   constant `0.5` when the domain has no extent, so empty or all-zero data
+*   would otherwise map every value to the middle of the plot and strand the
+*   baseline halfway up.
+*/
+var buildValueScale = ([min, max], range) => {
+	const lo = Math.min(0, min);
+	const hi = Math.max(0, max);
+	return scaleLinear().domain([lo, lo === hi ? hi + 1 : hi]).nice().range(range);
+};
+/** Apply an explicit domain override on top of a computed domain. */
+var applyDomainOverride = (computed, override) => [override?.min ?? computed[0], override?.max ?? computed[1]];
+/** Band scale for categories, used by the bar chart. */
+var buildCategoryBandScale = (labels, range, paddingInner, paddingOuter) => scaleBand().domain(labels).range(range).paddingInner(paddingInner).paddingOuter(paddingOuter);
+/** Point scale for categories, used by the line chart. */
+var buildCategoryPointScale = (labels, range, padding = 0) => scalePoint().domain(labels).range(range).padding(padding);
+/**
+* Estimate the left margin needed to fit the widest formatted tick label.
+*
+* Estimated from character count rather than measured from the DOM, mirroring
+* `estimateColumnWidth` in `table/utils.ts`, so it works during server
+* rendering. Clamped to at least the default margin, so it can only widen a
+* chart, never shrink one.
+*/
+var estimateValueAxisMargin = (ticks, formatter) => {
+	let widest = 0;
+	for (const tick of ticks) widest = Math.max(widest, formatter(tick).length * CAPTION_CHAR_WIDTH_PX);
+	return clamp(Math.ceil(widest) + 12, DEFAULT_CHART_MARGIN.left, 96);
+};
+/**
+* How many categories to skip between rendered axis labels.
+*
+* Returns 1 when every label fits, so a chart that is not crowded renders
+* exactly as it would with no skipping at all.
+*/
+var getCategoryLabelStride = (labels, step) => {
+	if (labels.length === 0 || step <= 0) return 1;
+	let widest = 0;
+	for (const label of labels) widest = Math.max(widest, label.length * CAPTION_CHAR_WIDTH_PX);
+	const required = widest + 8;
+	return required <= step ? 1 : Math.ceil(required / step);
+};
+/** Tick values for the value axis, honoring an explicit tick count. */
+var getValueTicks = (scale, override) => scale.ticks(override?.tickCount ?? 5);
+//#endregion
+export { addAxisTitleSpace, applyDomainOverride, buildCategoryBandScale, buildCategoryPointScale, buildValueScale, clamp, estimateValueAxisMargin, getCategoryLabelStride, getPlotDimensions, getValueTicks, resolveMargin, sanitizeValue };

package/dist/charts/chartTheme.d.ts

@@ -0,0 +1,18 @@
+import type { Theme } from "../theme/types";
+import { ChartPalette } from "./types";
+/**
+ * Palette resolution for the chart components.
+ *
+ * Consumer data names a {@link ChartPalette} slot; the concrete color is looked
+ * up here against the active theme. That keeps raw hex out of application data
+ * and guarantees both themes render correctly.
+ *
+ * Linaria evaluates this module at build time, so it must not import components.
+ */
+/** Resolve a palette slot to a concrete color for the active theme. */
+export declare function resolveChartPaletteColor(theme: Theme, palette: ChartPalette): string;
+/**
+ * Resolve the color for a series, honoring an explicit slot and otherwise
+ * falling back to the series' position in the default palette order.
+ */
+export declare function resolveSeriesColor(theme: Theme, index: number, palette?: ChartPalette): string;

package/dist/charts/chartTheme.js

@@ -0,0 +1,26 @@
+import { ChartPalette } from "./types.js";
+import { CHART_PALETTE_ORDER } from "./constants.js";
+import { match } from "ts-pattern";
+//#region src/charts/chartTheme.ts
+/**
+* Palette resolution for the chart components.
+*
+* Consumer data names a {@link ChartPalette} slot; the concrete color is looked
+* up here against the active theme. That keeps raw hex out of application data
+* and guarantees both themes render correctly.
+*
+* Linaria evaluates this module at build time, so it must not import components.
+*/
+/** Resolve a palette slot to a concrete color for the active theme. */
+function resolveChartPaletteColor(theme, palette) {
+	return match(palette).with(ChartPalette.PURPLE, () => theme.color.icon.purple).with(ChartPalette.PINK, () => theme.color.icon.pink).with(ChartPalette.BLUE, () => theme.color.icon.blue).with(ChartPalette.TEAL, () => theme.color.icon.teal).with(ChartPalette.LIME, () => theme.color.icon.lime).with(ChartPalette.ORANGE, () => theme.color.icon.orange).with(ChartPalette.YELLOW, () => theme.color.icon.yellow).with(ChartPalette.GREEN, () => theme.color.icon.success).with(ChartPalette.RED, () => theme.color.icon.error).exhaustive();
+}
+/**
+* Resolve the color for a series, honoring an explicit slot and otherwise
+* falling back to the series' position in the default palette order.
+*/
+function resolveSeriesColor(theme, index, palette) {
+	return resolveChartPaletteColor(theme, palette ?? CHART_PALETTE_ORDER[index % CHART_PALETTE_ORDER.length]);
+}
+//#endregion
+export { resolveChartPaletteColor, resolveSeriesColor };

package/dist/charts/constants.d.ts

@@ -1,22 +1,229 @@
-import type { Theme } from "../theme/types";
+import { ChartPalette } from "./types";
 import type { ChartMargin } from "./types";
 /**
- * Theme-derived chart series color palette.
- * Purple first to match Galaxy brand aesthetic.
+ * Layout and motion tokens for the chart components.
+ *
+ * This module is evaluated by Linaria at build time — its constants are
+ * interpolated statically into styled templates — so it must stay free of
+ * component imports. Pulling React, framer-motion or Phosphor in here would
+ * drag them into build-time evaluation.
  */
-export declare const getChartPalette: (theme: Theme) => string[];
 export declare const DEFAULT_CHART_MARGIN: ChartMargin;
-/** Spacing between bars within a group (fraction of bandwidth, 0-1) */
-export declare const DEFAULT_BAR_PADDING_INNER = 0.2;
-/** Spacing around bar groups (fraction of step, 0-1) */
-export declare const DEFAULT_BAR_PADDING_OUTER = 0.1;
-/** Default bar top-corner radius in px */
-export declare const DEFAULT_BAR_RADIUS = 4;
-/** Default line stroke width in px */
-export declare const DEFAULT_LINE_STROKE_WIDTH = 2;
-/** Default data-point dot radius in px */
-export declare const DEFAULT_LINE_DOT_RADIUS = 4;
-/** Transition duration in ms for hover effects */
-export declare const CHART_TRANSITION_MS = 150;
-/** Default number of y-axis ticks */
-export declare const DEFAULT_Y_TICK_COUNT = 5;
+/**
+ * Gap between a value-axis tick label and the plot edge.
+ *
+ * The label box is `margin.left - VALUE_AXIS_TICK_GAP` wide, so the axis
+ * geometry follows the margin instead of hardcoding an offset.
+ */
+export declare const VALUE_AXIS_TICK_GAP = 12;
+/** Height of a value-axis tick label box in px. */
+export declare const VALUE_AXIS_LABEL_HEIGHT = 20;
+/** Height of the category-axis label box in px. */
+export declare const CATEGORY_AXIS_LABEL_HEIGHT = 24;
+/** Gap between the plot's bottom edge and the category labels, in px. */
+export declare const CATEGORY_AXIS_LABEL_GAP = 8;
+/** Band reserved for an axis title, in px. Sized for one CAPTION line. */
+export declare const AXIS_TITLE_BAND = 18;
+/**
+ * Clear space between an axis title and its tick labels, in px.
+ *
+ * The category axis gets this for free: its labels sit in a 24px box and its
+ * title in an 18px band, and centring a CAPTION line in each leaves roughly this
+ * much air between the two. The value axis has no such slack — its title band
+ * abuts the label box exactly — so without reserving it here a wide tick number
+ * runs straight into the rotated title, and the two axes visibly disagree.
+ */
+export declare const AXIS_TITLE_GAP = 8;
+/** Default approximate tick count on the value axis. */
+export declare const DEFAULT_VALUE_TICK_COUNT = 5;
+/** Corner radius applied to the outer end of a wide bar, in px. */
+export declare const BAR_RADIUS = 4;
+/** Corner radius for bars narrower than {@link NARROW_BAR_WIDTH}, in px. */
+export declare const BAR_RADIUS_NARROW = 2;
+/** Bars below this width use the smaller radius so the curve doesn't dominate. */
+export declare const NARROW_BAR_WIDTH = 40;
+/**
+ * Px shaved off a stacked segment's covered edge to separate it from its
+ * neighbour.
+ *
+ * Keep this a whole number. The geometry snaps every stack boundary to a whole
+ * pixel first, so an integer gap renders at exactly the same size at every seam;
+ * a fractional one would land differently against the device pixel grid from one
+ * boundary to the next and read as uneven.
+ *
+ * Applied to every segment except the one sitting on the baseline, so each seam
+ * gets a gap and the bar still meets the axis flush.
+ */
+export declare const STACK_SEGMENT_GAP = 2;
+/** Minimum rendered height for a non-zero bar, in px. */
+export declare const MIN_BAR_LENGTH = 2;
+/**
+ * Target gaps in px between groups, and between bars within a group.
+ *
+ * The within-group gap must stay clearly smaller than the between-group gap —
+ * that ratio is the only thing making a group read as a group. When the two are
+ * close, the eye has nothing to bind a group's bars together and the chart reads
+ * as one long row of unrelated bars.
+ */
+export declare const GROUP_GAP_COMFORTABLE = 24;
+export declare const BAR_GAP_COMFORTABLE = 6;
+export declare const GROUP_GAP_MEDIUM = 16;
+export declare const BAR_GAP_MEDIUM = 4;
+export declare const GROUP_GAP_TIGHT = 12;
+export declare const BAR_GAP_TIGHT = 3;
+/**
+ * Fraction of its available slot a bar actually fills.
+ *
+ * Bars sized to consume every last pixel of their group read as heavy, and the
+ * chart becomes a wall of colour rather than a set of measurements. Holding them
+ * back leaves air on both sides of each group without touching the gap between
+ * neighbouring bars.
+ */
+export declare const BAR_WIDTH_RATIO = 0.8;
+/**
+ * Ceiling on a single bar's thickness, in px.
+ *
+ * Without it a two- or three-category chart divides the whole plot between a
+ * handful of bars and produces slabs — the width stops carrying information the
+ * moment it exceeds what the eye needs to compare heights.
+ */
+export declare const MAX_BAR_WIDTH = 44;
+/** Below this many bars the chart always uses comfortable spacing. */
+export declare const MIN_BARS_FOR_TIGHT_SPACING = 13;
+/**
+ * Ceiling on a gap, as a share of the space it divides.
+ *
+ * The gaps above are absolute pixel values chosen from chart-wide density, which
+ * says nothing about how much room a *single* category actually got. Forty
+ * categories in a 650px plot leave a 16px step, and a 24px gap subtracted from
+ * that goes negative — the width lands on its 1px floor and every bar renders as
+ * a hairline. Capping the gap proportionally keeps it honest at any density: it
+ * stays exactly as specified whenever there is room, and degrades smoothly when
+ * there is not.
+ */
+export declare const MAX_GAP_SHARE = 0.3;
+/** Plot widths above this stay comfortable; below the tight threshold go tight. */
+export declare const WIDTH_FOR_MEDIUM_SPACING = 650;
+export declare const WIDTH_FOR_TIGHT_SPACING = 500;
+/** Grid lines extend this far past both plot edges, in px. */
+export declare const GRID_LINE_BLEED = 12;
+export declare const DEFAULT_LINE_STROKE_WIDTH = 1.5;
+/** Radius of the dot marking a point on a hovered category, in px. */
+export declare const LINE_POINT_RADIUS = 3.5;
+/** Opacity of the area fill under a line. */
+export declare const LINE_AREA_OPACITY = 0.12;
+/** Gap between slices, in radians. */
+export declare const PIE_PAD_ANGLE = 0.012;
+/** Slice corner radius in px. */
+export declare const PIE_CORNER_RADIUS = 2;
+/** Inner radius as a fraction of the outer radius, for donut mode. */
+export declare const PIE_DONUT_INNER_RATIO = 0.62;
+/**
+ * Share of the narrowest slice that its two inner pad insets may consume.
+ *
+ * d3 turns {@link PIE_PAD_ANGLE} into a *constant linear* gap, and holding that
+ * width at radius `r` costs an angular inset of `asin(gap / 2r)` — unbounded as
+ * `r` approaches zero. When the two insets no longer fit inside a slice's own
+ * span, d3 collapses that slice's inner edge rather than sweeping backwards. The
+ * collapse is what makes a hole-less pie look wrong: the gap edge stops being
+ * radial, so gaps sit at visibly different widths and lean at slight angles, and
+ * it bites hardest between the *narrowest* slices, where the span runs out
+ * first.
+ *
+ * So the inner radius is solved for rather than guessed: pick the radius that
+ * keeps both insets inside the narrowest slice, with this much of it spent. At
+ * 0.7 the measured gap spread is 1.01× (against 1.46× when the inner edge is
+ * left to collapse), and the remaining 30% is what absorbs the corner radius.
+ */
+export declare const PIE_MAX_INSET_SHARE = 0.7;
+/**
+ * Ceiling on the auto-derived inner radius, as a share of the outer radius.
+ *
+ * The radius needed grows without bound as the narrowest slice shrinks, so a
+ * single sliver would otherwise turn a pie into a donut. Past this point the
+ * hole is doing more visual damage than the uneven gap it fixes, so the gap is
+ * allowed to degrade instead — never worse than it renders today.
+ */
+export declare const PIE_MAX_AUTO_INNER_RATIO = 0.06;
+/** How far outside the arc the tooltip anchors, in px. */
+export declare const PIE_TOOLTIP_ANCHOR_INSET = 8;
+/**
+ * Default share below which a slice is folded into an "Other" bucket.
+ *
+ * Slivers this thin are unreadable and effectively unhoverable, so grouping
+ * them communicates more than rendering each faithfully.
+ */
+export declare const PIE_MIN_SLICE_SHARE = 0.02;
+/** Margin around a pie, which needs no axis gutters. */
+export declare const PIE_CHART_MARGIN: {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+};
+/**
+ * Duration in ms for hover, dim and tooltip transitions.
+ *
+ * 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.
+ */
+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.
+ *
+ * The grammar is inherited from the reference charts and is the opposite of the
+ * obvious one: hovering does not brighten the hovered mark, it *softens*
+ * everything else. `MUTED` applies to marks outside the hovered category;
+ * `FADED` to marks outside a *pinned* one.
+ *
+ * The step down from ACTIVE is deliberately steep. These are large filled areas
+ * — bars and arcs — and a filled shape still reads as present at an opacity
+ * where a hairline would have vanished, so a timid step barely registers as a
+ * highlight at all.
+ *
+ * Keep `FADED` below `MUTED`, or pinning becomes visually indistinguishable
+ * from hovering — the pin exists to say "I am holding this one", which only
+ * reads if the rest recede further than they do on hover.
+ */
+export declare const CHART_MARK_OPACITY_ACTIVE = 1;
+export declare const CHART_MARK_OPACITY_MUTED = 0.1;
+export declare const CHART_MARK_OPACITY_FADED = 0.04;
+/** Distance in px between the tooltip and its anchor. */
+export declare const CHART_TOOLTIP_OFFSET = 10;
+/** Minimum width of the tooltip, in px. */
+export declare const CHART_TOOLTIP_MIN_WIDTH = 168;
+/** Maximum width of the tooltip, in px. */
+export declare const CHART_TOOLTIP_MAX_WIDTH = 320;
+/**
+ * Approximate width of one CAPTION-size character.
+ *
+ * Axis sizing estimates label widths arithmetically rather than measuring the
+ * DOM, so it stays correct during build-time evaluation and server rendering.
+ */
+export declare const CAPTION_CHAR_WIDTH_PX = 6.2;
+/** Ceiling for an auto-sized left margin, so a wide formatter can't eat the plot. */
+export declare const MAX_AUTO_MARGIN_LEFT = 96;
+/** Minimum px between category labels before AUTO mode starts skipping them. */
+export declare const MIN_CATEGORY_LABEL_GAP = 8;
+/**
+ * Default assignment order for series colors.
+ *
+ * Purple leads to match the Galaxy brand. Galaxy blue is deliberately absent —
+ * it is structural only, reserved for primary actions and selection.
+ */
+export declare const CHART_PALETTE_ORDER: ChartPalette[];