@pharos-ds/charts 0.0.0-stage → 1.0.10

package/dist/formatters.js

@@ -0,0 +1,156 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file formatters.ts
+ * @output Built-in, locale-aware tick/value format utilities for common data types
+ * @position Utility; consumed by ChartAxis via tickFormat prop
+ *
+ * Formatters degrade gracefully: non-finite numbers (NaN/±Infinity) and
+ * unparseable values are passed through as-is rather than producing garbage
+ * like "InfinityB", and no input throws. Numeric/date formatting is delegated
+ * to cached `Intl` formatters so output is locale-aware and rounding is correct
+ * across the full magnitude range (K/M/B/T and beyond).
+ */
+
+/** Lazily create a value once and cache it — keeps `Intl` construction off the import path. */
+function once(create) {
+  let cached = null;
+  return () => (cached ??= {
+    value: create()
+  }).value;
+}
+const getCompactFormat = once(() => new Intl.NumberFormat(undefined, {
+  notation: 'compact',
+  maximumFractionDigits: 1
+}));
+const getPercentFormat = once(() => new Intl.NumberFormat(undefined, {
+  style: 'percent',
+  maximumFractionDigits: 1
+}));
+const getShortDateFormat = once(() => new Intl.DateTimeFormat(undefined, {
+  month: 'short',
+  day: 'numeric'
+}));
+const getMonthYearFormat = once(() => new Intl.DateTimeFormat(undefined, {
+  month: 'short',
+  year: 'numeric'
+}));
+
+/**
+ * Compact number formatter (e.g. 1200 → "1.2K", 1500000 → "1.5M", 1e12 → "1T").
+ *
+ * Non-numeric values (e.g. category labels) and non-finite numbers pass through
+ * unchanged, so it is safe to use as a general-purpose tick formatter.
+ */
+export function compactNumber(value) {
+  const n = Number(value);
+  if (!Number.isFinite(n)) {
+    return String(value);
+  }
+  return getCompactFormat().format(n);
+}
+
+/**
+ * Currency formatter factory. Returns a tick format function.
+ *
+ * The symbol prefixes the magnitude and the sign leads the symbol, so negatives
+ * read as "-$1.5K" rather than "$-1.5K". Large values use compact notation.
+ *
+ * @example
+ * ```
+ * <ChartAxis tickFormat={currency()} />       // $1.5K
+ * <ChartAxis tickFormat={currency('€')} />    // €1.5K
+ * <ChartAxis tickFormat={currency('¥')} />    // ¥1.5K
+ * ```
+ */
+export function currency(symbol = '$') {
+  return value => {
+    const n = Number(value);
+    if (!Number.isFinite(n)) {
+      return String(value);
+    }
+    const sign = n < 0 ? '-' : '';
+    const abs = Math.abs(n);
+    const body = abs >= 1000 ? getCompactFormat().format(abs) : abs.toLocaleString();
+    return `${sign}${symbol}${body}`;
+  };
+}
+
+/**
+ * Percent formatter (e.g. 0.45 → "45%", 1.2 → "120%", 0.005 → "0.5%").
+ *
+ * The input is a ratio; it is multiplied by 100 and localized. Whole percents
+ * render without a decimal, and up to one fractional digit is shown otherwise.
+ */
+export function percent(value) {
+  const n = Number(value);
+  if (!Number.isFinite(n)) {
+    return String(value);
+  }
+  return getPercentFormat().format(n);
+}
+
+/**
+ * Coerce a value into a Date.
+ *
+ * Accepts a `Date`, epoch milliseconds (number or numeric string), or a date
+ * string (ISO 8601, RFC 2822, …). Returns an invalid Date for anything else so
+ * callers can pass the original value through unchanged.
+ *
+ * Date-only ISO strings (`YYYY-MM-DD`) are constructed at local midnight rather
+ * than the spec's UTC midnight, so the calendar day survives local formatting
+ * in negative-offset timezones (`"2024-01-05"` stays "Jan 5", not "Jan 4").
+ */
+function toDate(value) {
+  if (value instanceof Date) {
+    return value;
+  }
+  if (typeof value === 'number') {
+    return new Date(value);
+  }
+  if (typeof value === 'string') {
+    const s = value.trim();
+    if (s === '') {
+      return new Date(NaN);
+    }
+    const dateOnly = /^(\d{4})-(\d{2})-(\d{2})$/.exec(s);
+    if (dateOnly) {
+      const year = Number(dateOnly[1]);
+      const month = Number(dateOnly[2]);
+      const day = Number(dateOnly[3]);
+      const local = new Date(year, month - 1, day);
+      // Reject out-of-range parts (e.g. "2024-02-31") that the Date constructor
+      // would otherwise silently roll into a different day; treat them as
+      // invalid so the raw value passes through unchanged.
+      if (local.getFullYear() !== year || local.getMonth() !== month - 1 || local.getDate() !== day) {
+        return new Date(NaN);
+      }
+      return local;
+    }
+    const asNumber = Number(s);
+    return new Date(Number.isFinite(asNumber) ? asNumber : s);
+  }
+  return new Date(NaN);
+}
+
+/**
+ * Date formatter — short date (e.g. "Jan 5", "Mar 12").
+ */
+export function shortDate(value) {
+  const d = toDate(value);
+  if (Number.isNaN(d.getTime())) {
+    return String(value);
+  }
+  return getShortDateFormat().format(d);
+}
+
+/**
+ * Date formatter — month/year (e.g. "Jan 2024", "Mar 2025").
+ */
+export function monthYear(value) {
+  const d = toDate(value);
+  if (Number.isNaN(d.getTime())) {
+    return String(value);
+  }
+  return getMonthYearFormat().format(d);
+}

package/dist/getChartColors.d.ts

@@ -0,0 +1,67 @@
+/**
+ * @file getChartColors.ts
+ * @output Pure function to resolve chart colors from a theme — no React required
+ * @position Foundation utility; consumed by useChartColors and non-React contexts
+ *
+ * Takes a token resolver function (or a defined theme + mode) and returns
+ * the full chart colors API. The useChartColors hook wraps this.
+ *
+ * Palettes degrade gracefully for any count: the categorical scale wraps
+ * around its slots, and the sequential/diverging scales pick hand-tuned token
+ * stops when enough exist and interpolate across the ramp when more are asked
+ * for. The theme entry point resolves through the canonical token resolver, so
+ * data tokens fall back to their defaults even when a theme doesn't override
+ * them.
+ */
+import { type DefinedTheme } from '@pharos-ds/core/theme';
+/** Hue names available in the sequential ramps */
+export type SequentialHue = 'blue' | 'shamrock' | 'orange' | 'pink' | 'purple' | 'red' | 'teal' | 'yellow' | 'gray';
+/** The chart colors API returned by both getChartColors and useChartColors */
+export interface ChartColorsAPI {
+    categorical(n: number): string[];
+    sequential: Record<SequentialHue, (n: number) => string[]>;
+    diverging: {
+        positiveNegative(n: number): string[];
+        coldHot(n: number): string[];
+        custom(neg: SequentialHue, pos: SequentialHue, n: number, midpoint?: string): string[];
+    };
+    semantic: {
+        positive: string;
+        negative: string;
+        warning: string;
+        neutral: string;
+    };
+    /** Structural colors for chart chrome — axes, grid, ticks, labels */
+    structural: {
+        axis: string;
+        grid: string;
+        tick: string;
+        label: string;
+    };
+    alpha(hex: string, opacity: number): string;
+}
+/** A function that resolves a token name to its current value */
+export type TokenResolver = (name: string) => string;
+/**
+ * Build chart colors from a token resolver function.
+ * This is the lowest-level API — pass any function that maps token names to values.
+ */
+export declare function getChartColorsFromResolver(resolve: TokenResolver): ChartColorsAPI;
+/**
+ * Build chart colors from a defined theme and color mode.
+ *
+ * Use this in non-React contexts — WebGL setup, SSR, tests, Node scripts.
+ *
+ * Resolves through the canonical theme token resolver, so data tokens fall back
+ * to their defaults when the theme doesn't override them, and both
+ * `light-dark()` strings and `[light, dark]` tuples are handled for `mode`.
+ *
+ * @example
+ * ```
+ * import { neutralTheme } from '@pharos-ds/theme-neutral';
+ * const colors = getChartColors(neutralTheme, 'light');
+ * colors.categorical(5)
+ * ```
+ */
+export declare function getChartColors(theme: DefinedTheme, mode?: 'light' | 'dark'): ChartColorsAPI;
+//# sourceMappingURL=getChartColors.d.ts.map

package/dist/getChartColors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getChartColors.d.ts","sourceRoot":"","sources":["../src/getChartColors.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAqB,KAAK,YAAY,EAAC,MAAM,uBAAuB,CAAC;AAY5E,kDAAkD;AAClD,MAAM,MAAM,aAAa,GACrB,MAAM,GACN,UAAU,GACV,QAAQ,GACR,MAAM,GACN,QAAQ,GACR,KAAK,GACL,MAAM,GACN,QAAQ,GACR,MAAM,CAAC;AAEX,8EAA8E;AAC9E,MAAM,WAAW,cAAc;IAC7B,WAAW,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACjC,UAAU,EAAE,MAAM,CAAC,aAAa,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC,CAAC;IAC3D,SAAS,EAAE;QACT,gBAAgB,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QACtC,OAAO,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QAC7B,MAAM,CACJ,GAAG,EAAE,aAAa,EAClB,GAAG,EAAE,aAAa,EAClB,CAAC,EAAE,MAAM,EACT,QAAQ,CAAC,EAAE,MAAM,GAChB,MAAM,EAAE,CAAC;KACb,CAAC;IACF,QAAQ,EAAE;QACR,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;QACjB,OAAO,EAAE,MAAM,CAAC;QAChB,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,qEAAqE;IACrE,UAAU,EAAE;QACV,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC;CAC7C;AAED,iEAAiE;AACjE,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;AAoGrD;;;GAGG;AACH,wBAAgB,0BAA0B,CACxC,OAAO,EAAE,aAAa,GACrB,cAAc,CA8EhB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,cAAc,CAC5B,KAAK,EAAE,YAAY,EACnB,IAAI,GAAE,OAAO,GAAG,MAAgB,GAC/B,cAAc,CAGhB"}

package/dist/getChartColors.js

@@ -0,0 +1,191 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file getChartColors.ts
+ * @output Pure function to resolve chart colors from a theme — no React required
+ * @position Foundation utility; consumed by useChartColors and non-React contexts
+ *
+ * Takes a token resolver function (or a defined theme + mode) and returns
+ * the full chart colors API. The useChartColors hook wraps this.
+ *
+ * Palettes degrade gracefully for any count: the categorical scale wraps
+ * around its slots, and the sequential/diverging scales pick hand-tuned token
+ * stops when enough exist and interpolate across the ramp when more are asked
+ * for. The theme entry point resolves through the canonical token resolver, so
+ * data tokens fall back to their defaults even when a theme doesn't override
+ * them.
+ */
+
+import { resolveThemeTokens } from '@pharos-ds/core/theme';
+import { parseHex, parseColor, formatHex, formatColor } from '@pharos-ds/core/utils';
+
+// =============================================================================
+// Types
+// =============================================================================
+
+/** Hue names available in the sequential ramps */
+
+/** The chart colors API returned by both getChartColors and useChartColors */
+
+/** A function that resolves a token name to its current value */
+
+// =============================================================================
+// Internals
+// =============================================================================
+
+const CATEGORICAL_TOKENS = ['--color-data-categorical-blue', '--color-data-categorical-purple', '--color-data-categorical-orange', '--color-data-categorical-yellow', '--color-data-categorical-gray', '--color-data-categorical-green', '--color-data-categorical-pink', '--color-data-categorical-cyan', '--color-data-categorical-red', '--color-data-categorical-teal', '--color-data-categorical-brown', '--color-data-categorical-indigo'];
+const SEQUENTIAL_HUES = ['blue', 'shamrock', 'orange', 'pink', 'purple', 'red', 'teal', 'yellow', 'gray'];
+
+/** Interpolate between two hex colors in sRGB. Non-hex input falls back to the nearer endpoint. */
+function lerpHex(a, b, t) {
+  const ca = parseHex(a);
+  const cb = parseHex(b);
+  if (ca === null || cb === null) {
+    return t < 0.5 ? a : b;
+  }
+  const mix = (x, y) => x + (y - x) * t;
+  return formatHex(mix(ca.r, cb.r), mix(ca.g, cb.g), mix(ca.b, cb.b));
+}
+
+/**
+ * Sample `n` colors from an ordered ramp of stops.
+ * - `n <= stops.length` → picks the nearest exact stops, preserving the
+ *   hand-tuned design-token values.
+ * - `n > stops.length` → interpolates across the ramp so any count is supported
+ *   instead of silently capping at the number of stops.
+ * - `n === 1` → the middle stop, a single representative tone.
+ */
+function sampleRamp(stops, n) {
+  const len = stops.length;
+  // A non-finite count (e.g. Infinity) would make the Array.from calls below
+  // attempt a ~2**53 element allocation and hang, so treat it as empty.
+  if (!Number.isFinite(n) || n <= 0 || len === 0) {
+    return [];
+  }
+  if (n === 1) {
+    return [stops[Math.floor((len - 1) / 2)]];
+  }
+  if (len === 1) {
+    return Array.from({
+      length: n
+    }, () => stops[0]);
+  }
+  if (n <= len) {
+    return Array.from({
+      length: n
+    }, (_, i) => stops[Math.round(i * (len - 1) / (n - 1))]);
+  }
+  return Array.from({
+    length: n
+  }, (_, i) => {
+    const t = i * (len - 1) / (n - 1);
+    const lo = Math.floor(t);
+    const frac = t - lo;
+    return frac === 0 ? stops[lo] : lerpHex(stops[lo], stops[lo + 1], frac);
+  });
+}
+
+/**
+ * Apply an opacity to a concrete CSS color (hex — with or without the leading
+ * `#` — `rgb()`/`rgba()`, named). The `opacity` argument always wins over any
+ * alpha already in the color. Unparseable input (e.g. `var()`) is returned
+ * unchanged.
+ */
+function hexAlpha(hex, opacity) {
+  // parseColor requires the `#` for hex; fall back to parseHex so bare hex
+  // strings (`0064E0`) keep working as they did before #3739.
+  const rgba = parseColor(hex) ?? parseHex(hex);
+  if (rgba === null) {
+    return hex;
+  }
+  const a = Number.isFinite(opacity) ? Math.max(0, Math.min(1, opacity)) : 1;
+  return formatColor({
+    ...rgba,
+    a
+  });
+}
+
+// =============================================================================
+// Public API
+// =============================================================================
+
+/**
+ * Build chart colors from a token resolver function.
+ * This is the lowest-level API — pass any function that maps token names to values.
+ */
+export function getChartColorsFromResolver(resolve) {
+  const categorical = CATEGORICAL_TOKENS.map(t => resolve(t));
+  const ramp = hue => [5, 4, 3, 2, 1].map(step => resolve(`--color-data-${hue}-${step}`));
+  const gray1 = resolve('--color-data-gray-1');
+  function buildDiverging(negHue, posHue, n, midpoint = gray1) {
+    if (n <= 0) {
+      return [];
+    }
+    if (n === 1) {
+      return [midpoint];
+    }
+    const half = Math.floor(n / 2);
+    const hasCenter = n % 2 === 1;
+    const negSide = sampleRamp(ramp(negHue), half);
+    const posSide = sampleRamp(ramp(posHue), half).reverse();
+    if (hasCenter) {
+      return [...negSide, midpoint, ...posSide];
+    }
+    return [...negSide, ...posSide];
+  }
+  return {
+    categorical(n) {
+      // A non-finite count (e.g. Infinity) would make the wrap-around Array.from
+      // below attempt a ~2**53 element allocation and hang, so treat it as empty.
+      if (!Number.isFinite(n) || n <= 0 || categorical.length === 0) {
+        return [];
+      }
+      // Wrap around the palette so any series count gets a deterministic color.
+      return Array.from({
+        length: n
+      }, (_, i) => categorical[i % categorical.length]);
+    },
+    sequential: Object.fromEntries(SEQUENTIAL_HUES.map(hue => [hue, n => sampleRamp(ramp(hue), n)])),
+    diverging: {
+      positiveNegative: n => buildDiverging('shamrock', 'red', n),
+      coldHot: n => buildDiverging('blue', 'red', n),
+      custom: (neg, pos, n, mid) => buildDiverging(neg, pos, n, mid)
+    },
+    semantic: {
+      positive: resolve('--color-data-categorical-green'),
+      negative: resolve('--color-data-categorical-red'),
+      warning: resolve('--color-data-categorical-orange'),
+      neutral: resolve('--color-data-neutral')
+    },
+    structural: {
+      axis: resolve('--color-border-emphasized'),
+      grid: resolve('--color-border'),
+      tick: resolve('--color-border-emphasized'),
+      label: resolve('--color-text-secondary')
+    },
+    alpha: hexAlpha
+  };
+}
+
+/**
+ * Build chart colors from a defined theme and color mode.
+ *
+ * Use this in non-React contexts — WebGL setup, SSR, tests, Node scripts.
+ *
+ * Resolves through the canonical theme token resolver, so data tokens fall back
+ * to their defaults when the theme doesn't override them, and both
+ * `light-dark()` strings and `[light, dark]` tuples are handled for `mode`.
+ *
+ * @example
+ * ```
+ * import { neutralTheme } from '@pharos-ds/theme-neutral';
+ * const colors = getChartColors(neutralTheme, 'light');
+ * colors.categorical(5)
+ * ```
+ */
+export function getChartColors(theme, mode = 'light') {
+  const tokens = resolveThemeTokens(theme, {
+    mode
+  });
+  return getChartColorsFromResolver(name => tokens[name] ?? '');
+}

package/dist/index.d.ts

@@ -0,0 +1,17 @@
+export { Chart, type ChartProps } from './Chart';
+export { ChartAxis, type ChartAxisProps } from './ChartAxis';
+export { ChartGrid, type ChartGridProps } from './ChartGrid';
+export { ChartLegend, type ChartLegendProps, type LegendPosition, type LegendAlignment, } from './ChartLegend';
+export { type LegendItem } from './legend';
+export { ChartSwatch, swatchVariantForType, type ChartSwatchProps, type ChartSwatchVariant, } from './ChartSwatch';
+export { ChartTooltip, type ChartTooltipProps, type ChartTooltipPlacement, } from './ChartTooltip';
+export { type TooltipSeriesValue } from './tooltip';
+export { bar, line, dot, area, band, candlestick, errorBar, referenceLine, dotGL, dotGLInteractive, heatmapGL, streamGL, } from './marks';
+export type { BarOptions, LineOptions, DotOptions, AreaOptions, BandOptions, CandlestickOptions, ErrorBarOptions, ReferenceLineOptions, DotGLOptions, DotGLInteractiveOptions, HeatmapGLOptions, StreamGLOptions, StreamGLHandle, } from './marks';
+export { useChart } from './ChartContext';
+export type { SeriesDef, ChartContext, ChartPointerEvent, ResolvedPoint, ResolvedPositions, SeriesContext, ChartMargin, ChartScale, YBaseline, ColorAccessor, } from './types';
+export { useChartColors } from './useChartColors';
+export { getChartColors, getChartColorsFromResolver, type ChartColorsAPI, type SequentialHue, type TokenResolver, } from './getChartColors';
+export { compactNumber, currency, percent, shortDate, monthYear, } from './formatters';
+export { isBandScale, xPixel } from './utils';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,KAAK,EAAE,KAAK,UAAU,EAAC,MAAM,SAAS,CAAC;AAC/C,OAAO,EAAC,SAAS,EAAE,KAAK,cAAc,EAAC,MAAM,aAAa,CAAC;AAC3D,OAAO,EAAC,SAAS,EAAE,KAAK,cAAc,EAAC,MAAM,aAAa,CAAC;AAC3D,OAAO,EACL,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,cAAc,EACnB,KAAK,eAAe,GACrB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAC,KAAK,UAAU,EAAC,MAAM,UAAU,CAAC;AACzC,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,KAAK,gBAAgB,EACrB,KAAK,kBAAkB,GACxB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACtB,KAAK,qBAAqB,GAC3B,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAC,KAAK,kBAAkB,EAAC,MAAM,WAAW,CAAC;AAClD,OAAO,EACL,GAAG,EACH,IAAI,EACJ,GAAG,EACH,IAAI,EACJ,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,aAAa,EACb,KAAK,EACL,gBAAgB,EAChB,SAAS,EACT,QAAQ,GACT,MAAM,SAAS,CAAC;AACjB,YAAY,EACV,UAAU,EACV,WAAW,EACX,UAAU,EACV,WAAW,EACX,WAAW,EACX,kBAAkB,EAClB,eAAe,EACf,oBAAoB,EACpB,YAAY,EACZ,uBAAuB,EACvB,gBAAgB,EAChB,eAAe,EACf,cAAc,GACf,MAAM,SAAS,CAAC;AACjB,OAAO,EAAC,QAAQ,EAAC,MAAM,gBAAgB,CAAC;AACxC,YAAY,EACV,SAAS,EACT,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,iBAAiB,EACjB,aAAa,EACb,WAAW,EACX,UAAU,EACV,SAAS,EACT,aAAa,GACd,MAAM,SAAS,CAAC;AAGjB,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,OAAO,EACL,cAAc,EACd,0BAA0B,EAC1B,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,aAAa,GACnB,MAAM,kBAAkB,CAAC;AAG1B,OAAO,EACL,aAAa,EACb,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,GACV,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAC,WAAW,EAAE,MAAM,EAAC,MAAM,SAAS,CAAC"}

package/dist/index.js

@@ -0,0 +1,19 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+export { Chart } from "./Chart.js";
+export { ChartAxis } from "./ChartAxis.js";
+export { ChartGrid } from "./ChartGrid.js";
+export { ChartLegend } from "./ChartLegend.js";
+export { ChartSwatch, swatchVariantForType } from "./ChartSwatch.js";
+export { ChartTooltip } from "./ChartTooltip.js";
+export { bar, line, dot, area, band, candlestick, errorBar, referenceLine, dotGL, dotGLInteractive, heatmapGL, streamGL } from "./marks/index.js";
+export { useChart } from "./ChartContext.js";
+// Color palette — theme-aware data-visualization colors
+export { useChartColors } from "./useChartColors.js";
+export { getChartColors, getChartColorsFromResolver } from "./getChartColors.js";
+
+// Tick / value formatters
+export { compactNumber, currency, percent, shortDate, monthYear } from "./formatters.js";
+
+// Scale utilities
+export { isBandScale, xPixel } from "./utils.js";

package/dist/layout.d.ts

@@ -0,0 +1,40 @@
+/**
+ * @file layout.ts
+ * @output Computes scales, stacking, grouping, then delegates to each series.resolve()
+ * @position Called by Chart root — the single layout pass
+ *
+ * The layout engine does NOT know about specific mark types.
+ * It handles cross-series coordination (scales, stacking, grouping)
+ * then calls each series' own resolve() method.
+ */
+import { scaleLinear, scaleBand } from 'd3-scale';
+import type { SeriesDef, ChartScale, ResolvedPoint, YBaseline } from './types';
+export interface LayoutInput {
+    data: Record<string, unknown>[];
+    xKey: string;
+    series: SeriesDef[];
+    width: number;
+    height: number;
+    /** How the y-domain is derived when `yDomain` is not provided. Default 'auto'. */
+    yBaseline?: YBaseline;
+    /** Explicit y-domain [min, max]. Authoritative — no baseline/headroom/nice(). */
+    yDomain?: [number, number];
+    /**
+     * Explicit x-domain [min, max] for numeric/linear x. Authoritative and honored
+     * even when `data` is empty (stable streaming window). Ignored for band scales.
+     */
+    xDomain?: [number, number];
+}
+export interface LayoutResult {
+    xScale: ChartScale;
+    yScale: ReturnType<typeof scaleLinear<number, number>>;
+    /**
+     * Categorical y band scale, built when a series declares `layout.yBandKey`
+     * (e.g. a heatmap's rows). When present the y-axis is categorical and the
+     * linear `yScale` is unused.
+     */
+    yBandScale?: ReturnType<typeof scaleBand<string>>;
+    resolved: Map<string, ResolvedPoint[]>;
+}
+export declare function computeLayout({ data, xKey, series, width, height, yBaseline, yDomain, xDomain, }: LayoutInput): LayoutResult;
+//# sourceMappingURL=layout.d.ts.map

package/dist/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,EAAC,WAAW,EAAE,SAAS,EAAC,MAAM,UAAU,CAAC;AAEhD,OAAO,KAAK,EACV,SAAS,EACT,UAAU,EACV,aAAa,EAEb,SAAS,EACV,MAAM,SAAS,CAAC;AASjB,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,kFAAkF;IAClF,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,iFAAiF;IACjF,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAC5B;AAED,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,UAAU,CAAC;IACnB,MAAM,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IACvD;;;;OAIG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC,OAAO,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC;IAClD,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,aAAa,EAAE,CAAC,CAAC;CACxC;AAqCD,wBAAgB,aAAa,CAAC,EAC5B,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,KAAK,EACL,MAAM,EACN,SAAS,EACT,OAAO,EACP,OAAO,GACR,EAAE,WAAW,GAAG,YAAY,CA6Q5B"}