@lilt-ui/charts 0.1.0 → 0.2.0

package/dist/types.d.ts

@@ -72,6 +72,11 @@ export interface ChartBarLayout {
     /** Space between segments of a stack, in CSS pixels. Defaults to 0. */
     segmentGap?: number;
 }
+export interface ChartSeriesField<T> {
+    /** Shown beside the value in inspection, e.g. "High". */
+    label: string;
+    accessor: (row: T) => number | null;
+}
 export interface ChartSeries<T> {
     id: string;
     label: string;
@@ -79,13 +84,19 @@ export interface ChartSeries<T> {
     accessor: (row: T) => number | null;
     /** Explicit source status. The last row is never inferred to be provisional. */
     status?: (row: T) => ChartObservationStatus;
-    /** Supplied bounds in the same unit as accessor; Lilt does not infer confidence. */
-    interval?: {
-        lower: (row: T) => number | null;
-        upper: (row: T) => number | null;
-        meaning: string;
-    };
+    /**
+     * Companion values in the series' own unit, keyed by a stable ID: a candle's open, high and
+     * low, a range's ends, or quartiles. `accessor` stays the headline value. Fields fit the y
+     * range, appear in inspection, and range marks such as `IntervalBand` read them by ID. Lilt
+     * never infers them.
+     */
+    fields?: Readonly<Record<string, ChartSeriesField<T>>>;
     color?: string;
+    /**
+     * Color of one observation's discrete mark (a bar, candle, range mark, or point), such as a
+     * down day in red. Return `undefined` to keep the series color. Lines and areas stay one color.
+     */
+    colorAt?: (row: T) => string | undefined;
     line?: ChartLineStyle;
     area?: ChartAreaStyle;
     bar?: ChartBarStyle;
@@ -116,6 +127,13 @@ export interface CategoryXConfig<T> {
 }
 export type ChartXConfig<T> = TimeXConfig<T> | NumericXConfig<T> | CategoryXConfig<T>;
 export interface ChartYConfig {
+    /**
+     * `log` spaces values by ratio, so a doubling looks the same anywhere, as for prices over
+     * years. Every plotted value must be positive; bars, stacks and secondary scales need
+     * `linear` (the default).
+     */
+    scale?: 'linear' | 'log';
+    /** Ignored on a log scale, which cannot reach zero. */
     includeZero?: boolean;
     domain?: readonly [number, number];
     /** Values the fitted domain must contain, such as a target line. Ignored with `domain`. */
@@ -247,6 +265,11 @@ interface ChartPlotCommonProps {
      * their observations, as in a chart surrounded by padding. Defaults to 0.
      */
     labelOverhang?: number;
+    /**
+     * Give every observation a bar-width slot, as bars and column marks do, so a line pane lines
+     * up with a bar or candle pane synced beside it. Ignores `axisInset`.
+     */
+    slots?: boolean;
     /** Use 'fill' to size the plot from its flex container; otherwise use a pixel height. */
     height?: number | 'fill';
     compactHeight?: number;
@@ -321,8 +344,43 @@ export interface AreaProps {
     series: string;
     className?: string;
 }
+/** Range marks name the series they draw and the IDs of the fields they read. */
 export interface IntervalBandProps {
     series: string;
+    /** Field ID of the band's lower edge. */
+    lower: string;
+    /** Field ID of the band's upper edge. */
+    upper: string;
+    className?: string;
+}
+export interface RangeBarProps {
+    series: string;
+    /** Field ID of each bar's low end. */
+    low: string;
+    /** Field ID of each bar's high end. */
+    high: string;
+    className?: string;
+}
+export interface ErrorBarProps {
+    series: string;
+    /** Field ID of each whisker's low end. */
+    low: string;
+    /** Field ID of each whisker's high end. */
+    high: string;
+    /** Draw the series value as a dot between the whiskers. Defaults to true. */
+    point?: boolean;
+    className?: string;
+}
+export interface BoxPlotProps {
+    series: string;
+    /** Field IDs of the box edges; the series value is the median line. */
+    q1: string;
+    q3: string;
+    /** Field IDs of the whisker ends. */
+    min: string;
+    max: string;
+    /** Values beyond the whiskers for a row, drawn as dots. Fit them with `y.include`. */
+    outliers?(row: unknown): readonly number[];
     className?: string;
 }
 export interface PrimitiveProps {
@@ -371,6 +429,12 @@ export interface TooltipProps<Row = unknown, SeriesId extends string = string> e
     /** Opt in to comparison content in this tooltip. Omit to render it elsewhere. */
     renderComparison?: (context: ChartComparisonContext<SeriesId, Row>) => ReactNode;
 }
+export interface ChartTooltipField {
+    id: string;
+    label: string;
+    value: number | null;
+    formattedValue: string;
+}
 export interface ChartTooltipContext<Row = unknown, SeriesId extends string = string> {
     /** The series the pointer, keyboard, or legend currently points at, when there is one. */
     activeSeriesId?: SeriesId | null;
@@ -385,11 +449,8 @@ export interface ChartTooltipContext<Row = unknown, SeriesId extends string = st
         value: number | null;
         formattedValue: string;
         status: ChartObservationStatus;
-        interval: {
-            lower: number;
-            upper: number;
-            meaning: string;
-        } | null;
+        /** The series' companion values, in descriptor order; empty when it has none. */
+        fields: readonly ChartTooltipField[];
     }[];
 }
 export interface ChartLegendValue {
@@ -527,11 +588,17 @@ export interface AnnotationsProps extends PrimitiveProps {
     onSelectionChange?: (annotation: ChartAnnotation | null) => void;
 }
 export interface ReferenceBandProps extends PrimitiveProps {
-    /** Pass `-Infinity` or `Infinity` for an open end that runs to the plot's edge. */
+    /**
+     * The band's ends: x values by default, or y values with `axis="y"`. Pass `-Infinity` or
+     * `Infinity` for an open end that runs to the plot's edge.
+     */
     from: number | Date;
     to: number | Date;
-    label: string;
+    /** Shown inside the band. Optional for y bands, such as an RSI 30–70 range. */
+    label?: string;
     color?: string;
+    /** `x` (default) spans a range of observations; `y` spans a range of values. */
+    axis?: 'x' | 'y';
 }
 export interface ReferenceLineProps extends PrimitiveProps {
     /** The y value, in the primary scale's unit. */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lilt-ui/charts",
-  "version": "0.1.0",
-  "description": "Beautiful, key-typed React chart cards with linked hover, targets, forecasts, and calm motion.",
+  "version": "0.2.0",
+  "description": "Beautiful, key-typed React chart cards with linked hover, targets, forecasts, finance charts, and calm motion.",
   "keywords": [
     "react",
     "charts",
@@ -12,6 +12,9 @@
     "bar-chart",
     "line-chart",
     "sparkline",
+    "candlestick",
+    "finance",
+    "box-plot",
     "typescript"
   ],
   "author": "Lilt UI",
@@ -32,6 +35,11 @@
       "import": "./dist/data.js",
       "default": "./dist/data.js"
     },
+    "./finance": {
+      "types": "./dist/finance/index.d.ts",
+      "import": "./dist/finance.js",
+      "default": "./dist/finance.js"
+    },
     "./styles.css": "./dist/styles.css",
     "./package.json": "./package.json"
   },
@@ -39,6 +47,7 @@
     "dist",
     "media",
     "README.md",
+    "CHANGELOG.md",
     "LICENSE",
     "THIRD_PARTY_NOTICES.md"
   ],

package/dist/analysis-BLLWEKBw.js

@@ -1,105 +0,0 @@
-//#region src/data/chart-data.ts
-function e(e, t) {
-	let n = t.range;
-	if (n && (!Number.isFinite(n.startX) || !Number.isFinite(n.endX))) throw Error("Range bounds must be finite.");
-	let r = n ? Math.min(n.startX, n.endX) : -Infinity, i = n ? Math.max(n.startX, n.endX) : Infinity, a = 0, o = 0, s = 0, c = Infinity, l = -Infinity, u = Infinity, d = -Infinity, f = null, p = null, m = /* @__PURE__ */ new Set();
-	for (let n of e) {
-		let e = Number(t.x(n));
-		if (!Number.isFinite(e)) throw Error("Summary positions must be finite numbers or valid dates.");
-		if (e < r || e > i) continue;
-		if (m.has(e)) throw Error("Summary positions must be unique.");
-		m.add(e);
-		let h = t.value(n);
-		if (h !== null && (typeof h != "number" || !Number.isFinite(h))) throw Error("Summary values must be finite numbers or null.");
-		if (e < u && (u = e, f = h), e > d && (d = e, p = h), h === null) {
-			o++;
-			continue;
-		}
-		a++, s += h, c = Math.min(c, h), l = Math.max(l, h);
-	}
-	if (!Number.isFinite(s)) throw Error("Summary total exceeds the finite numeric range.");
-	return {
-		count: a,
-		missing: o,
-		total: a ? s : null,
-		mean: a ? s / a : null,
-		min: a ? c : null,
-		max: a ? l : null,
-		first: f,
-		last: p,
-		change: f === null || p === null ? null : p - f
-	};
-}
-function t(e, t) {
-	if (!t.length) throw Error("CSV needs at least one column.");
-	let n = (e) => {
-		if (typeof e == "number" && !Number.isFinite(e)) throw Error("CSV numbers must be finite.");
-		if (e instanceof Date && !Number.isFinite(e.getTime())) throw Error("CSV dates must be valid.");
-		let t = e === null ? "" : e instanceof Date ? e.toISOString() : String(e);
-		return typeof e == "string" && /^[\s]*[=+\-@]|^[\t\r\n]/.test(t) && (t = "'" + t), /[",\r\n]/.test(t) ? `"${t.replaceAll("\"", "\"\"")}"` : t;
-	};
-	return [t.map((e) => n(e.header)).join(","), ...e.map((e) => t.map((t) => n(t.value(e))).join(","))].join("\r\n") + "\r\n";
-}
-//#endregion
-//#region src/engine/ranking.ts
-function n(e, t, n) {
-	let r = /* @__PURE__ */ new Set();
-	return e.map((e, i) => {
-		let a = t.id(e), o = t.label(e), s = n(e);
-		if (typeof a != "string" || !a.trim()) throw Error(`Invalid category at row ${i + 1}: a non-empty string ID is required.`);
-		if (r.has(a)) throw Error(`Duplicate category ID "${a}".`);
-		if (typeof o != "string" || !o.trim()) throw Error(`Invalid label for category "${a}".`);
-		if (s !== null && (typeof s != "number" || !Number.isFinite(s))) throw Error(`Invalid value for category "${a}": expected a finite number or null.`);
-		return r.add(a), {
-			id: a,
-			label: o,
-			datum: e,
-			value: s
-		};
-	});
-}
-function r(e, t) {
-	return t === "input" ? [...e] : [...e].sort((e, n) => {
-		if (e.value === null && n.value !== null) return 1;
-		if (n.value === null && e.value !== null) return -1;
-		let r = (e.value ?? 0) - (n.value ?? 0);
-		return r ? r * (t === "descending" ? -1 : 1) : e.id < n.id ? -1 : +(e.id > n.id);
-	});
-}
-function i(e) {
-	let t = 0, n = 0;
-	for (let r of e) r.value !== null && (t = Math.min(t, r.value), n = Math.max(n, r.value));
-	return t === n ? [0, 1] : [t, n];
-}
-function a(e, t) {
-	let n = (e) => (e - t[0]) / (t[1] - t[0]) * 100, r = n(0), i = e === null ? r : n(e);
-	return {
-		zero: r,
-		left: Math.min(r, i),
-		width: Math.abs(i - r)
-	};
-}
-//#endregion
-//#region src/engine/analysis.ts
-function o(e, t) {
-	if (e !== null && (!Number.isFinite(e) || e < 0)) throw Error(`${t} must be a non-negative finite number or null.`);
-}
-function s(e) {
-	let t = n(e.data, e.category, e.value), r = Infinity;
-	for (let e of t) if (o(e.value, `Stage ${e.id}`), e.value !== null) {
-		if (e.value > r) throw Error(`Stage ${e.id} exceeds a preceding stage; cumulative funnel counts must not increase.`);
-		r = e.value;
-	}
-	let i = t[0]?.value;
-	return t.map((e, n) => {
-		let r = t[n - 1]?.value;
-		return {
-			...e,
-			share: e.value !== null && i != null && i > 0 ? e.value / i : null,
-			conversion: e.value !== null && r != null && r > 0 ? e.value / r : null,
-			drop: e.value !== null && r != null ? r - e.value : null
-		};
-	});
-}
-//#endregion
-export { i as a, a as i, n, e as o, r, t as s, s as t };