@galaxy-io/dls 1.2.7 → 1.3.1

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,245 @@
-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;
+/** 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 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;
+/**
+ * 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[];

package/dist/charts/constants.js

@@ -1,38 +1,267 @@
+import { ChartPalette } from "./types.js";
 //#region src/charts/constants.ts
 /**
-* Theme-derived chart series color palette.
-* Purple first to match Galaxy brand aesthetic.
-*/
-var getChartPalette = (theme) => [
-	theme.color.text.purple,
-	theme.color.text.pink,
-	theme.color.text.blue,
-	theme.color.text.teal,
-	theme.color.text.lime,
-	theme.color.text.orange,
-	theme.color.text.yellow,
-	theme.color.text.success,
-	theme.color.text.error
-];
+* 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.
+*/
 var DEFAULT_CHART_MARGIN = {
-	top: 16,
+	top: 12,
 	right: 16,
-	bottom: 32,
-	left: 48
+	bottom: 36,
+	left: 52
+};
+/**
+* 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.
+*/
+var VALUE_AXIS_TICK_GAP = 12;
+/** Height of a value-axis tick label box in px. */
+var VALUE_AXIS_LABEL_HEIGHT = 20;
+/** Height of the category-axis label box in px. */
+var CATEGORY_AXIS_LABEL_HEIGHT = 24;
+/** Gap between the plot's bottom edge and the category labels, in px. */
+var CATEGORY_AXIS_LABEL_GAP = 8;
+/** Band reserved for an axis title, in px. Sized for one CAPTION line. */
+var 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.
+*/
+var AXIS_TITLE_GAP = 8;
+/** Default approximate tick count on the value axis. */
+var DEFAULT_VALUE_TICK_COUNT = 5;
+/** Corner radius applied to the outer end of a wide bar, in px. */
+var BAR_RADIUS = 4;
+/** Corner radius for bars narrower than {@link NARROW_BAR_WIDTH}, in px. */
+var BAR_RADIUS_NARROW = 2;
+/** Bars below this width use the smaller radius so the curve doesn't dominate. */
+var 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.
+*/
+var STACK_SEGMENT_GAP = 2;
+/** Minimum rendered height for a non-zero bar, in px. */
+var 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.
+*/
+var GROUP_GAP_COMFORTABLE = 24;
+var BAR_GAP_COMFORTABLE = 6;
+var GROUP_GAP_MEDIUM = 16;
+var BAR_GAP_MEDIUM = 4;
+var GROUP_GAP_TIGHT = 12;
+var 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.
+*/
+var BAR_WIDTH_RATIO = .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.
+*/
+var MAX_BAR_WIDTH = 44;
+/** Below this many bars the chart always uses comfortable spacing. */
+var 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.
+*/
+var MAX_GAP_SHARE = .3;
+/** Plot widths above this stay comfortable; below the tight threshold go tight. */
+var WIDTH_FOR_MEDIUM_SPACING = 650;
+var WIDTH_FOR_TIGHT_SPACING = 500;
+/** Grid lines extend this far past both plot edges, in px. */
+var GRID_LINE_BLEED = 12;
+var DEFAULT_LINE_STROKE_WIDTH = 1.5;
+/** Radius of the dot marking a point on a hovered category, in px. */
+var LINE_POINT_RADIUS = 3.5;
+/** Opacity of the area fill under a line. */
+var LINE_AREA_OPACITY = .12;
+/** Gap between slices, in radians. */
+var PIE_PAD_ANGLE = .012;
+/** Slice corner radius in px. */
+var PIE_CORNER_RADIUS = 2;
+/** Inner radius as a fraction of the outer radius, for donut mode. */
+var PIE_DONUT_INNER_RATIO = .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.
+*/
+var PIE_MAX_INSET_SHARE = .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.
+*/
+var PIE_MAX_AUTO_INNER_RATIO = .06;
+/** How far outside the arc the tooltip anchors, in px. */
+var 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.
+*/
+var PIE_MIN_SLICE_SHARE = .02;
+/** React key used for the bucket that absorbs slices below the fold threshold. */
+var AGGREGATED_SLICE_KEY = "__other__";
+/** Margin around a pie, which needs no axis gutters. */
+var PIE_CHART_MARGIN = {
+	top: 8,
+	right: 8,
+	bottom: 8,
+	left: 8
 };
-/** Spacing between bars within a group (fraction of bandwidth, 0-1) */
-var DEFAULT_BAR_PADDING_INNER = .2;
-/** Spacing around bar groups (fraction of step, 0-1) */
-var DEFAULT_BAR_PADDING_OUTER = .1;
-/** Default bar top-corner radius in px */
-var DEFAULT_BAR_RADIUS = 4;
-/** Default line stroke width in px */
-var DEFAULT_LINE_STROKE_WIDTH = 2;
-/** Default data-point dot radius in px */
-var DEFAULT_LINE_DOT_RADIUS = 4;
-/** Transition duration in ms for hover effects */
-var CHART_TRANSITION_MS = 150;
-/** Default number of y-axis ticks */
-var DEFAULT_Y_TICK_COUNT = 5;
+/**
+* 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.
+*/
+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
+* 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.
+*/
+var CHART_MARK_OPACITY_ACTIVE = 1;
+var CHART_MARK_OPACITY_MUTED = .1;
+var CHART_MARK_OPACITY_FADED = .04;
+/** Distance in px between the tooltip and its anchor. */
+var CHART_TOOLTIP_OFFSET = 10;
+/** Minimum width of the tooltip, in px. */
+var CHART_TOOLTIP_MIN_WIDTH = 168;
+/** Maximum width of the tooltip, in px. */
+var 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.
+*/
+var CAPTION_CHAR_WIDTH_PX = 6.2;
+/** Ceiling for an auto-sized left margin, so a wide formatter can't eat the plot. */
+var 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.
+*/
+var 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.
+*/
+var AUTO_MARGIN_LEFT_STEP = 8;
+/** Minimum px between category labels before AUTO mode starts skipping them. */
+var 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.
+*/
+var CHART_PALETTE_ORDER = [
+	ChartPalette.PURPLE,
+	ChartPalette.PINK,
+	ChartPalette.BLUE,
+	ChartPalette.TEAL,
+	ChartPalette.LIME,
+	ChartPalette.ORANGE,
+	ChartPalette.YELLOW,
+	ChartPalette.GREEN,
+	ChartPalette.RED
+];
 //#endregion
-export { CHART_TRANSITION_MS, DEFAULT_BAR_PADDING_INNER, DEFAULT_BAR_PADDING_OUTER, DEFAULT_BAR_RADIUS, DEFAULT_CHART_MARGIN, DEFAULT_LINE_DOT_RADIUS, DEFAULT_LINE_STROKE_WIDTH, DEFAULT_Y_TICK_COUNT, getChartPalette };
+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_MARK_OPACITY_ACTIVE, CHART_MARK_OPACITY_FADED, 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 };