@galaxy-io/dls 1.6.1 → 2.0.0

package/dist/charts/chartScales.js

@@ -1,165 +1,99 @@
-import { CAPTION_CHAR_WIDTH_PX, DEFAULT_CHART_MARGIN } from "./constants.js";
+import { AUTO_INSET_LEFT_STEP, AXIS_TITLE_BAND, AXIS_TITLE_GAP, CAPTION_CHAR_WIDTH_PX, CAPTION_LINE, MIN_AUTO_INSET_LEFT, MIN_CATEGORY_LABEL_GAP, MIN_VALUE_TICK_SPACING, PLOT_INSET_BOTTOM, PLOT_INSET_RIGHT, PLOT_INSET_TOP, VALUE_AXIS_TICK_GAP } from "./constants.js";
 import { 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.
+* @internal Scales, value domains, ticks and plot insets for the chart family. Pure arithmetic on
+* `d3-scale` (an optional peer, imported only by chart modules); no React, no DOM.
 */
+/** @internal Clamps `value` into `[min, max]`. */
 function clamp(value, min, max) {
 	return 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.
-*/
+/** @internal A finite number, or 0: one `NaN` in data must not blank every path. */
 function sanitizeValue(value) {
 	return 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.
-*
-* `defaults` exists because the cartesian default reserves axis gutters a
-* radial chart has no use for. Taking it as a parameter keeps the merge
-* per-field: a chart that substituted its own defaults with `margin ?? OWN`
-* would silently fall back to the *cartesian* defaults the moment a caller
-* passed a partial, handing an axis-less chart a 52px left gutter.
-*/
-function resolveMargin(partial, defaults = DEFAULT_CHART_MARGIN) {
-	return {
-		top: partial?.top ?? defaults.top,
-		right: partial?.right ?? defaults.right,
-		bottom: partial?.bottom ?? defaults.bottom,
-		left: partial?.left ?? defaults.left
-	};
-}
-/** Inner plot dimensions, never negative. */
-function getPlotDimensions(width, height, margin) {
-	return {
-		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.
-*/
-function addAxisTitleSpace(partial, { hasValueTitle, hasCategoryTitle }) {
-	if (!hasValueTitle && !hasCategoryTitle) return partial;
-	return {
-		...partial,
-		left: (partial?.left ?? DEFAULT_CHART_MARGIN.left) + (hasValueTitle ? 26 : 0),
-		bottom: (partial?.bottom ?? DEFAULT_CHART_MARGIN.bottom) + (hasCategoryTitle ? 18 : 0)
-	};
-}
-/**
-* Turn a raw data extent into the domain the axis and the marks both use.
-*
-* Applies the caller's override, then three behaviours worth knowing:
-*
-* - **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.
-* - **`nice()` rounds the ends outward** to values a reader would choose.
-*
-* Split out of {@link buildValueScale} so the domain is computed exactly once
-* per chart and then handed to both the tick list and the geometry. Building it
-* twice — once at a throwaway range to get ticks, once at the real range to
-* place marks — leaves two `nice()` calls that must agree forever.
-*
-* `nice()` deliberately takes **no argument**. The default count is 10, not the
-* five ticks {@link DEFAULT_VALUE_TICK_COUNT} asks for, and nicing to the tick
-* count instead would change the axis extent on every existing chart.
+* @internal The domain both the axis and the marks use: the override applied, zero always
+* included (a baseline to grow from), a zero-width domain widened to 0–1, and the ends `nice()`d.
 */
 function resolveValueDomain(raw, override) {
 	const min = override?.min ?? raw[0];
 	const max = override?.max ?? raw[1];
 	const lo = Math.min(0, min);
 	const hi = Math.max(0, max);
-	const [niceLo, niceHi] = scaleLinear().domain([lo, lo === hi ? hi + 1 : hi]).nice().domain();
+	const [niceLo = lo, niceHi = hi] = scaleLinear().domain([lo, lo === hi ? hi + 1 : hi]).nice().domain();
 	return [niceLo, niceHi];
 }
-/**
-* Linear scale over an already-resolved domain.
-*
-* Does no nicing and no zero-forcing — {@link resolveValueDomain} has done
-* both. Takes the domain rather than raw data so the same numbers drive the
-* axis, the ticks and every mark.
-*/
+/** @internal Linear scale over a resolved domain. */
 function buildValueScale(domain, range) {
 	return scaleLinear().domain(domain).range(range);
 }
-/** Point scale for categories, used by the line chart. */
+/** @internal Point scale for categories (LineChart, AreaChart). */
 function buildCategoryPointScale(labels, range, padding = 0) {
 	return scalePoint().domain(labels).range(range).padding(padding);
 }
+/** @internal Tick values for a resolved domain. Needs no dimensions, so it can size the gutter first. */
+function getValueTicks(domain, override) {
+	return scaleLinear().domain(domain).ticks(override?.tickCount ?? 5);
+}
+/** @internal How many value ticks fit a plot `plotHeight` tall, at least `MIN_VALUE_TICK_SPACING` apart. */
+function getMaxValueTicks(plotHeight) {
+	return Math.max(2, Math.floor(plotHeight / MIN_VALUE_TICK_SPACING) + 1);
+}
 /**
-* 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
-* and build-time evaluation. The estimate only has to be close: tick labels
-* right-align against the plot and ellipsize, so an underestimate truncates one
-* label rather than breaking the layout, and {@link MAX_AUTO_MARGIN_LEFT} caps
-* what a pathological formatter can take from the plot.
-*
-* Rounded up to {@link AUTO_MARGIN_LEFT_STEP} rather than used raw — see that
-* constant for why an exact fit is the wrong target.
-*
-* Safe to call before the chart has been measured: `nice()` and `ticks()` depend
-* on the domain and the requested count, never on the scale's range, so the tick
-* values here are the same ones the axis renders later.
+* @internal The value axis for a plot `plotHeight` tall (0 = not measured yet): the domain and its
+* ticks at the requested density, the ticks thinned until they sit at least
+* `MIN_VALUE_TICK_SPACING` apart so labels never touch on a short chart. The domain never grows to
+* suit the thinner ticks (a short chart keeps its marks tall; the top rule may sit below the top).
 */
-function estimateValueAxisMargin(ticks, formatter) {
-	let widest = 0;
-	for (const tick of ticks) widest = Math.max(widest, formatter(tick).length * CAPTION_CHAR_WIDTH_PX);
-	const needed = Math.ceil(widest) + 12;
-	return clamp(Math.ceil(needed / 8) * 8, 32, 96);
+function resolveValueAxis(raw, override, plotHeight) {
+	const requested = override?.tickCount ?? 5;
+	const domain = resolveValueDomain(raw, override);
+	let ticks = getValueTicks(domain, { tickCount: requested });
+	if (plotHeight <= 0) return {
+		domain,
+		ticks
+	};
+	const maxTicks = getMaxValueTicks(plotHeight);
+	for (let count = requested - 1; ticks.length > maxTicks && count >= 1; count -= 1) ticks = getValueTicks(domain, { tickCount: count });
+	return {
+		domain,
+		ticks
+	};
 }
 /**
-* 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.
+* @internal Left gutter that fits the widest formatted tick, estimated from character count (SSR
+* safe), rounded up to a step so plots stay aligned and do not shift as live data gains a digit.
 */
+function estimateValueAxisInset(ticks, formatter) {
+	let widest = 0;
+	for (const tick of ticks) widest = Math.max(widest, formatter(tick).length * CAPTION_CHAR_WIDTH_PX);
+	const needed = Math.ceil(widest) + VALUE_AXIS_TICK_GAP;
+	return clamp(Math.ceil(needed / AUTO_INSET_LEFT_STEP) * AUTO_INSET_LEFT_STEP, MIN_AUTO_INSET_LEFT, 96);
+}
+/** @internal The cartesian insets: the tick gutter, plus bands for the axis titles. */
+function getCartesianInsets(tickInset, { hasValueTitle, hasCategoryTitle }) {
+	return {
+		top: PLOT_INSET_TOP,
+		right: PLOT_INSET_RIGHT,
+		bottom: PLOT_INSET_BOTTOM + (hasCategoryTitle ? AXIS_TITLE_GAP + AXIS_TITLE_BAND : 0),
+		left: tickInset + (hasValueTitle ? AXIS_TITLE_BAND + AXIS_TITLE_GAP : 0)
+	};
+}
+/** @internal How many rows to skip between rendered row labels (Heatmap); 1 when every caption line fits. */
+function getRowLabelStride(step) {
+	if (step <= 0) return 1;
+	const required = CAPTION_LINE + MIN_CATEGORY_LABEL_GAP / 2;
+	return required <= step ? 1 : Math.ceil(required / step);
+}
+/** @internal How many categories to skip between rendered labels; 1 when every label fits. */
 function 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;
+	const required = widest + MIN_CATEGORY_LABEL_GAP;
 	return required <= step ? 1 : Math.ceil(required / step);
 }
-/**
-* Tick values for a resolved domain, honoring an explicit tick count.
-*
-* Needs no dimensions, which is what breaks the apparent circularity in the
-* layout: the left margin must fit the tick labels, the margin decides the plot
-* size, and the plot size builds the scale. Tick *values* fall out of the domain
-* alone, so they can be known before anything is measured.
-*/
-function getValueTicks(domain, override) {
-	return scaleLinear().domain(domain).ticks(override?.tickCount ?? 5);
-}
 //#endregion
-export { addAxisTitleSpace, buildCategoryPointScale, buildValueScale, clamp, estimateValueAxisMargin, getCategoryLabelStride, getPlotDimensions, getValueTicks, resolveMargin, resolveValueDomain, sanitizeValue };
+export { buildCategoryPointScale, buildValueScale, clamp, estimateValueAxisInset, getCartesianInsets, getCategoryLabelStride, getMaxValueTicks, getRowLabelStride, getValueTicks, resolveValueAxis, resolveValueDomain, sanitizeValue };

package/dist/charts/constants.d.ts

@@ -1,263 +1,103 @@
-import { ChartPalette } from "./types";
-import type { ChartMargin } from "./types";
-/**
- * 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 DEFAULT_CHART_MARGIN: ChartMargin;
-/**
- * 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. */
+/** @internal Height of one caption line (`caption` type step): every axis label and title. */
+export declare const CAPTION_LINE: number;
+/** @internal Clear space between an axis label (or title) and the plot, its grid, or the next label row. */
+export declare const AXIS_LABEL_GAP: number;
+/** @internal Grid lines extend this far past both plot edges: a short lead-in, clear of the labels. */
+export declare const GRID_LINE_BLEED: number;
+/** @internal Space above the plot: half a value label box (its text clears the top) plus air for a dot. */
+export declare const PLOT_INSET_TOP: number;
+/** @internal Space right of the plot: the grid bleed plus air for a line's end dot and cap. */
+export declare const PLOT_INSET_RIGHT: number;
+/** @internal Gap between a value tick label and the plot edge: the grid bleed plus the label gap. */
+export declare const VALUE_AXIS_TICK_GAP: number;
+/** @internal Height of a value tick label box: taller than the caption line so it centers on its tick. */
 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. */
+/** @internal Gap between the plot's bottom edge and the category labels. */
+export declare const CATEGORY_AXIS_LABEL_GAP: number;
+/** @internal Height of the category label box: one caption line, so the label gap is the visible gap. */
+export declare const CATEGORY_AXIS_LABEL_HEIGHT: number;
+/** @internal Space below the plot: label gap + label line. */
+export declare const PLOT_INSET_BOTTOM: number;
+/** @internal Band reserved for an axis title: a caption line with 2px of air each side, so a rotated title stays inside the chart. */
+export declare const AXIS_TITLE_BAND: number;
+/** @internal Clear space between an axis title and its tick labels. */
+export declare const AXIS_TITLE_GAP: number;
+/** @internal Minimum distance between value ticks (a caption line plus the label gap): closer ticks are thinned so labels never crowd. */
+export declare const MIN_VALUE_TICK_SPACING: number;
+/** @internal 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. */
+/** @internal Width of one caption character, for arithmetic label sizing (SSR-safe, no DOM). */
+export declare const CAPTION_CHAR_WIDTH_PX = 6.2;
+/** @internal Floor of the auto-sized left gutter. */
+export declare const MIN_AUTO_INSET_LEFT: number;
+/** @internal Ceiling of the auto-sized left gutter, so a wide formatter cannot eat the plot (no step). */
+export declare const MAX_AUTO_INSET_LEFT = 96;
+/** @internal The left gutter grows in steps of this, so plots stay aligned across charts. */
+export declare const AUTO_INSET_LEFT_STEP: number;
+/** @internal Minimum space between category labels before the axis thins them (rows: one caption line apart). */
+export declare const MIN_CATEGORY_LABEL_GAP: number;
+/** @internal Insets around a radial plot, which draws no axes. */
+export declare const RADIAL_PLOT_INSET: number;
+/** @internal Every line's stroke width (no stroke token; the 1.x weight). */
+export declare const LINE_STROKE_WIDTH = 1.5;
+/** @internal Radius of a point dot (the 1.x dot; no step). */
 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;
-/** React key used for the bucket that absorbs slices below the fold threshold. */
-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 the tooltip's fade and glide.
- *
- * 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;
-/**
- * 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 or
- * series.
- *
- * 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.
- */
+/** @internal Dash and gap of a dashed line. */
+export declare const LINE_DASH: number;
+/** @internal Opacity of an area fill (1.x `LINE_AREA_OPACITY`). */
+export declare const AREA_FILL_OPACITY = 0.12;
+/** @internal Opacity of a stacked area band: bands never overlap, so they carry a firmer fill (AreaChart). */
+export declare const AREA_STACKED_FILL_OPACITY = 0.24;
+/** @internal Opacity of `ChartMarkState.ACTIVE`. */
 export declare const CHART_MARK_OPACITY_ACTIVE = 1;
+/** @internal Opacity of `ChartMarkState.MUTED`: steep, so a filled mark visibly recedes. */
 export declare const CHART_MARK_OPACITY_MUTED = 0.1;
-/**
- * The whisper tier, for `ChartMarkState.DIMMED`.
- *
- * Deliberately far gentler than MUTED: it is used where another affordance —
- * BarChart's cursor band — already marks the hovered category, so the
- * off-category marks only need to step back, not disappear.
- */
+/** @internal Opacity of `ChartMarkState.DIMMED`: a whisper, where a cursor band already highlights. */
 export declare const CHART_MARK_OPACITY_DIMMED = 0.4;
-/** 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 = 200;
-/** Maximum width of the tooltip, in px. */
-export declare const CHART_TOOLTIP_MAX_WIDTH = 320;
-/** Gap in px between the plot box and a side-placed legend. */
-export declare const CHART_LEGEND_SIDE_GAP = 16;
-/**
- * Spacing in px between entries in a horizontal legend.
- *
- * Applied as each entry's *trailing padding*, not a flex gap on the row: a gap
- * is dead space between hover targets, and sweeping across it drops the series
- * isolation between every pair of entries. Because the padding lives inside
- * the entries, measured entry sizes already include the spacing and the fit
- * computation needs no separate gap term.
- */
-export declare const CHART_LEGEND_COLUMN_GAP = 16;
-/** Spacing in px between entries in a vertical legend. Same contract as
- * {@link CHART_LEGEND_COLUMN_GAP}: trailing padding on the entry, no flex gap. */
-export declare const CHART_LEGEND_VERTICAL_GAP = 8;
-/**
- * Ceiling on the collapsed-legend popover's height, in px.
- *
- * Roughly eight entries. Past that the list scrolls rather than growing into a
- * popover taller than the chart it annotates — the cap on *visible* entries is
- * the caller's `legendMaxItems`; this one only bounds the overflow list itself.
- */
+/** @internal Corner radius on the outer end of a wide bar. */
+export declare const BAR_RADIUS: number;
+/** @internal Corner radius of a bar narrower than `NARROW_BAR_WIDTH`. */
+export declare const BAR_RADIUS_NARROW: number;
+/** @internal Bars below this width use the smaller radius (1.x). */
+export declare const NARROW_BAR_WIDTH = 40;
+/** @internal Seam between stacked segments; whole pixels so every seam renders alike. */
+export declare const STACK_SEGMENT_GAP: number;
+/** @internal Minimum drawn length of a non-zero bar. */
+export declare const MIN_BAR_LENGTH: number;
+/**
+ * @internal The gap between categories as a share of the category band. Gaps are proportional so
+ * a narrow chart keeps its bars; this share and the in-group one below reproduce the 1.x look at
+ * 480px and up, where the bars also hit their 44px ceiling or the gaps hit theirs.
+ */
+export declare const CATEGORY_GAP_RATIO = 0.35;
+/** @internal Floor of the category gap, so neighbouring categories never touch. */
+export declare const MIN_CATEGORY_GAP: number;
+/**
+ * @internal Ceiling of the category gap. 1.x drew 24px plus 20% of each bar slot as air, so a wide
+ * grouped chart showed ~40px between groups; this ceiling keeps that look.
+ */
+export declare const MAX_CATEGORY_GAP: number;
+/** @internal The gap between bars in a group as a share of one bar's slot (the group gap binds a group). */
+export declare const BAR_GAP_RATIO = 0.2;
+/** @internal Floor of the in-group gap: one hairline of air (no step). */
+export declare const MIN_BAR_GAP = 1;
+/** @internal Ceiling of the in-group gap (the 1.x gap). */
+export declare const MAX_BAR_GAP: number;
+/** @internal Gap between heatmap cells as a share of a cell's step: proportional, like the bar gaps. */
+export declare const HEATMAP_CELL_GAP_RATIO = 0.1;
+/** @internal Floor of the heatmap cell gap: one hairline of air (no step). */
+export declare const MIN_HEATMAP_CELL_GAP = 1;
+/** @internal Ceiling of the heatmap cell gap (the 1.x gap). */
+export declare const MAX_HEATMAP_CELL_GAP: number;
+/** @internal Width of the seam between pie slices, constant in pixels at any radius (the stack seam). */
+export declare const PIE_SLICE_GAP: number;
+/** @internal Distance between the tooltip and its anchor. */
+export declare const CHART_TOOLTIP_OFFSET: number;
+/** @internal Rows the built-in tooltip body shows before "+N more". */
+export declare const CHART_TOOLTIP_MAX_ROWS = 8;
+/** @internal Gap between the plot box and a side-placed legend. */
+export declare const CHART_LEGEND_SIDE_GAP: number;
+/** @internal Height cap of the "+N more" legend list (about eight entries) before it scrolls. */
 export declare const CHART_LEGEND_OVERFLOW_MAX_HEIGHT = 208;
-/**
- * Floor on the collapsed-legend popover's width, in px, measured as the full
- * popover box — the list inside subtracts the Tooltip's 8px inset per side.
- * Without one, a couple of short labels shrink-wrap into a scrunched box.
- */
-export declare const CHART_LEGEND_OVERFLOW_MIN_WIDTH = 160;
-/**
- * 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;
-/**
- * Floor for an auto-sized left margin.
- *
- * Enough for a two- or three-character tick plus {@link VALUE_AXIS_TICK_GAP}, so
- * an axis labelled `0`–`5` still has its numbers clear of the container edge
- * rather than jammed against it.
- */
-export declare const MIN_AUTO_MARGIN_LEFT = 32;
-/**
- * Quantum for an auto-sized left margin, in px.
- *
- * Sizing the gutter to the widest tick means the plot origin moves whenever that
- * label's width changes — live data crossing 999 → 1000 gains a digit and would
- * shift every mark sideways. Rounding up to a step absorbs that: the margin only
- * moves when a label crosses a real threshold, and two charts with similar ticks
- * land on the *same* value, so stacked charts in a dashboard keep their plots
- * aligned instead of each choosing its own origin.
- */
-export declare const AUTO_MARGIN_LEFT_STEP = 8;
-/** 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[];
+/** @internal 2:1, the aspect-ratio fallback of cartesian charts and PieChart. */
+export declare const CHART_DEFAULT_ASPECT_RATIO = 2;