@columenlabs/lumen-ui 0.0.0-stage → 0.2.1

package/dist/market/compare-chart.d.ts

@@ -0,0 +1,34 @@
+import { type ChartBar, type TimeSpan } from './price-chart.js';
+/** One symbol's line: its bars (closes are drawn) and its colour token (`var(--chart-1)`). */
+export interface CompareLine {
+    symbol: string;
+    color: string;
+    bars: ChartBar[];
+}
+/** An indicator line of one symbol: values per bar time, in its symbol's colour. */
+export interface CompareExtra {
+    key: string;
+    label: string;
+    symbol: string;
+    color: string;
+    values?: Map<string | number, number>;
+}
+export interface ComparePane {
+    id: string;
+    label: string;
+    domain?: [number, number];
+    refs?: number[];
+    lines: CompareExtra[];
+}
+export declare function CompareChart({ lines, mode, overlays, panes, timeZone, timeline, range, onRange, onOutside, }: {
+    lines: CompareLine[];
+    mode: 'pct' | 'price';
+    overlays: CompareExtra[];
+    panes: ComparePane[];
+    timeZone?: string;
+    /** The navigator's bars: the first symbol's whole history. */
+    timeline: ChartBar[];
+    range?: TimeSpan;
+    onRange?: (span: TimeSpan, byPerson: boolean) => void;
+    onOutside?: (span: TimeSpan) => void;
+}): import("react").JSX.Element;

package/dist/market/compare-chart.js

@@ -0,0 +1,292 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The compare chart: two to eight symbols on
+ * one time axis. In % each line is its change from the left edge of what is visible, so panning,
+ * zooming or dragging the timeline moves the baseline and every % re-reads from there; in Price each
+ * symbol sits on its own scale. Overlays (SMA 50 on NVDA) follow their symbol's colour, dashed and,
+ * in %, measured from the same baseline as their symbol; panes draw one line per symbol.
+ */
+import { ColorType, CrosshairMode, LineSeries, createChart, } from 'lightweight-charts';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { AXIS, Navigator, OSC_PANE, PRICE_PANE, price, secOf, showSpan, timeText, useTheme, } from './price-chart.js';
+const MINUS = '−';
+const pct = (n) => `${n >= 0 ? '+' : MINUS}${Math.abs(n).toFixed(2)}%`;
+/** First index of `secs` at or after `t`; the last when none is. */
+function from(secs, t) {
+    let lo = 0;
+    let hi = secs.length;
+    while (lo < hi) {
+        const mid = (lo + hi) >> 1;
+        if (secs[mid] < t)
+            lo = mid + 1;
+        else
+            hi = mid;
+    }
+    return Math.min(lo, secs.length - 1);
+}
+/** Last index of `secs` at or before `t`; -1 when none is. */
+function upTo(secs, t) {
+    let lo = 0;
+    let hi = secs.length;
+    while (lo < hi) {
+        const mid = (lo + hi) >> 1;
+        if (secs[mid] <= t)
+            lo = mid + 1;
+        else
+            hi = mid;
+    }
+    return lo - 1;
+}
+export function CompareChart({ lines, mode, overlays, panes, timeZone = 'America/Los_Angeles', timeline, range, onRange, onOutside, }) {
+    const host = useRef(null);
+    const theme = useTheme();
+    // One time axis: every time any symbol has a bar.
+    const axis = useMemo(() => {
+        const seen = new Map();
+        for (const l of lines)
+            for (const b of l.bars)
+                seen.set(secOf(b.time), b.time);
+        return [...seen.entries()].sort((a, b) => a[0] - b[0]);
+    }, [lines]);
+    const secs = useMemo(() => axis.map(([s]) => s), [axis]);
+    const axisBars = useMemo(() => axis.map(([, t]) => ({ time: t, open: 0, high: 0, low: 0, close: 0 })), [axis]);
+    const own = useMemo(() => lines.map((l) => l.bars.map((b) => secOf(b.time))), [lines]);
+    const intraday = typeof axis[0]?.[1] === 'number';
+    const multiDay = intraday && secs.length > 1 && (secs.at(-1) ?? 0) - (secs[0] ?? 0) > 86_400;
+    const target = useRef(null);
+    const applied = useRef(undefined);
+    const touch = useRef({ down: false, at: 0 });
+    const report = useRef(onRange);
+    report.current = onRange;
+    const [api, setApi] = useState(null);
+    const live = useRef(null);
+    const [legend, setLegend] = useState({ date: '', rows: [] });
+    const height = PRICE_PANE + panes.length * OSC_PANE + AXIS;
+    // biome-ignore lint/correctness/useExhaustiveDependencies: range is applied by the effect below
+    useEffect(() => {
+        const el = host.current;
+        if (!el || !secs.length)
+            return;
+        const css = (c) => theme.css(c.replace(/^var\((.*)\)$/, '$1'));
+        const chart = createChart(el, {
+            autoSize: true,
+            layout: {
+                background: { type: ColorType.Solid, color: 'transparent' },
+                textColor: theme.text,
+                fontFamily: theme.css('--font-mono'),
+                fontSize: 11,
+                panes: { separatorColor: theme.border, enableResize: false },
+            },
+            grid: { vertLines: { visible: false }, horzLines: { color: theme.grid } },
+            rightPriceScale: { borderVisible: false },
+            timeScale: {
+                borderVisible: false,
+                rightOffset: 2,
+                minBarSpacing: 0.001,
+                timeVisible: intraday,
+                tickMarkFormatter: intraday ? (t) => timeText(t, timeZone, false) : undefined,
+            },
+            localization: { timeFormatter: (t) => timeText(t, timeZone, true) },
+            crosshair: { mode: CrosshairMode.Normal },
+            handleScale: { mouseWheel: true, pinch: true },
+            handleScroll: { mouseWheel: false },
+        });
+        const percent = mode === 'pct';
+        const format = percent
+            ? { type: 'custom', formatter: (v) => pct(v) }
+            : { type: 'price', precision: 2, minMove: 0.01 };
+        const scaleOf = (i) => (percent || i === 0 ? 'right' : `p${i}`);
+        // The price pane: each symbol, then its overlays, which take its baseline in %.
+        const priced = lines.map((l, i) => {
+            const s = chart.addSeries(LineSeries, {
+                color: css(l.color),
+                lineWidth: 2,
+                priceLineVisible: false,
+                lastValueVisible: true,
+                priceScaleId: scaleOf(i),
+                priceFormat: format,
+            }, 0);
+            if (scaleOf(i) !== 'right')
+                chart.priceScale(scaleOf(i)).applyOptions({ visible: false, borderVisible: false });
+            return s;
+        });
+        const over = overlays.map((o) => {
+            const i = lines.findIndex((l) => l.symbol === o.symbol);
+            return {
+                o,
+                i,
+                s: chart.addSeries(LineSeries, {
+                    color: css(o.color),
+                    lineWidth: 1,
+                    lineStyle: 2,
+                    priceLineVisible: false,
+                    lastValueVisible: false,
+                    crosshairMarkerVisible: false,
+                    priceScaleId: scaleOf(Math.max(0, i)),
+                    priceFormat: format,
+                }, 0),
+            };
+        });
+        if (percent)
+            priced[0]?.createPriceLine({
+                price: 0,
+                color: theme.text,
+                lineWidth: 1,
+                lineStyle: 2,
+                axisLabelVisible: false,
+            });
+        // Each symbol's baseline: its close at or after the axis bar `a`.
+        let base = -1;
+        const draw = (a) => {
+            if (a === base)
+                return;
+            base = a;
+            const t0 = secs[a] ?? 0;
+            const bases = lines.map((l, i) => {
+                const k = l.bars.length ? from(own[i] ?? [], t0) : -1;
+                return l.bars[k]?.close ?? 1;
+            });
+            const val = (v, i) => (percent ? (v / (bases[i] ?? 1) - 1) * 100 : v);
+            lines.forEach((l, i) => priced[i]?.setData(l.bars.map((b) => ({ time: b.time, value: val(b.close, i) }))));
+            for (const { o, i, s } of over) {
+                const bars = lines[i]?.bars ?? [];
+                s.setData(bars.flatMap((b) => {
+                    const v = o.values?.get(b.time);
+                    return v === undefined ? [] : [{ time: b.time, value: val(v, i) }];
+                }));
+            }
+        };
+        draw(0);
+        panes.forEach((p, n) => {
+            let anchor = null;
+            for (const x of p.lines) {
+                const bars = lines.find((l) => l.symbol === x.symbol)?.bars ?? [];
+                const s = chart.addSeries(LineSeries, { color: css(x.color), lineWidth: 2, priceLineVisible: false, lastValueVisible: false }, n + 1);
+                s.setData(bars.flatMap((b) => {
+                    const v = x.values?.get(b.time);
+                    return v === undefined ? [] : [{ time: b.time, value: v }];
+                }));
+                const domain = p.domain;
+                if (domain)
+                    s.applyOptions({
+                        autoscaleInfoProvider: () => ({
+                            priceRange: { minValue: domain[0], maxValue: domain[1] },
+                        }),
+                    });
+                anchor ??= s;
+            }
+            for (const r of p.refs ?? [])
+                anchor?.createPriceLine({
+                    price: r,
+                    color: theme.border,
+                    lineWidth: 1,
+                    lineStyle: 2,
+                    axisLabelVisible: false,
+                });
+        });
+        chart.panes()[0]?.setStretchFactor(PRICE_PANE);
+        panes.forEach((_, n) => chart.panes()[n + 1]?.setStretchFactor(OSC_PANE));
+        if (range && range !== applied.current) {
+            applied.current = range;
+            target.current = range;
+        }
+        target.current ??= range ?? { from: secs[0] ?? 0, to: Number.POSITIVE_INFINITY };
+        const show = () => target.current && showSpan(chart, secs, target.current);
+        show();
+        let frame = 0;
+        const sized = new ResizeObserver(() => {
+            cancelAnimationFrame(frame);
+            frame = requestAnimationFrame(show);
+        });
+        sized.observe(el);
+        const press = () => {
+            touch.current.down = true;
+        };
+        const release = () => {
+            if (touch.current.down)
+                touch.current = { down: false, at: performance.now() };
+        };
+        const wheel = () => {
+            touch.current.at = performance.now();
+        };
+        el.addEventListener('pointerdown', press);
+        el.addEventListener('wheel', wheel, { passive: true });
+        window.addEventListener('pointerup', release);
+        window.addEventListener('pointercancel', release);
+        // The values at the axis bar `i`: each symbol's last close at or before it.
+        let shownEnd = secs.length - 1;
+        const legendAt = (i) => {
+            const t = secs[i] ?? 0;
+            const rows = lines.map((l, k) => {
+                const j = upTo(own[k] ?? [], t);
+                const c = l.bars[j]?.close;
+                const b = l.bars[from(own[k] ?? [], secs[base] ?? 0)]?.close;
+                return {
+                    s: l.symbol,
+                    c: css(l.color),
+                    v: c === undefined ? '—' : percent && b ? pct((c / b - 1) * 100) : price(c),
+                };
+            });
+            const at = axis[i]?.[1];
+            setLegend({ date: at === undefined ? '' : timeText(at, timeZone, true), rows });
+        };
+        let pending = 0;
+        const moved = (r) => {
+            if (!r || !secs.length)
+                return;
+            const last = secs.length - 1;
+            const a = Math.max(0, Math.min(last, Math.round(r.from)));
+            const b = Math.max(a, Math.min(last, Math.round(r.to)));
+            shownEnd = b;
+            cancelAnimationFrame(pending);
+            pending = requestAnimationFrame(() => {
+                draw(a);
+                legendAt(shownEnd);
+            });
+            const span = { from: secs[a], to: secs[b] };
+            const person = touch.current.down || performance.now() - touch.current.at < 400;
+            if (person)
+                target.current = span;
+            report.current?.(span, person);
+        };
+        chart.timeScale().subscribeVisibleLogicalRangeChange(moved);
+        chart.subscribeCrosshairMove((p) => {
+            const i = p.time === undefined ? -1 : from(secs, secOf(p.time));
+            legendAt(i < 0 ? shownEnd : i);
+        });
+        legendAt(shownEnd);
+        live.current = chart;
+        setApi(chart);
+        return () => {
+            sized.disconnect();
+            cancelAnimationFrame(frame);
+            cancelAnimationFrame(pending);
+            el.removeEventListener('pointerdown', press);
+            el.removeEventListener('wheel', wheel);
+            window.removeEventListener('pointerup', release);
+            window.removeEventListener('pointercancel', release);
+            chart.remove();
+        };
+    }, [lines, own, secs, axis, mode, overlays, panes, theme, timeZone, intraday]);
+    useEffect(() => {
+        if (!api || !range || range === applied.current)
+            return;
+        applied.current = range;
+        target.current = range;
+        showSpan(api, secs, range);
+    }, [api, range, secs]);
+    const goTo = (span) => {
+        touch.current.at = performance.now();
+        const day = 86_400;
+        if (onOutside &&
+            secs.length &&
+            (span.from < secs[0] - day ||
+                (Number.isFinite(span.to) && span.to > secs.at(-1) + day))) {
+            onOutside(span);
+            return;
+        }
+        if (live.current)
+            showSpan(live.current, secs, span);
+    };
+    return (_jsxs("div", { "data-testid": "compare-chart", "data-mode": mode, className: "flex flex-col gap-1", children: [_jsxs("div", { className: "flex min-h-5 flex-wrap items-center gap-x-4 gap-y-0.5 px-2 text-xs", children: [_jsx("span", { className: "num text-muted-foreground", children: legend.date }), legend.rows.map((r) => (_jsxs("span", { className: "num flex items-center gap-1.5 whitespace-nowrap", children: [_jsx("span", { "aria-hidden": true, className: "inline-block size-2 rounded-full", style: { background: r.c } }), _jsx("span", { className: "text-muted-foreground", children: r.s }), _jsx("span", { className: r.v.startsWith('+') ? 'text-gain' : r.v.startsWith(MINUS) ? 'text-loss' : '', children: r.v })] }, r.s)))] }), _jsxs("div", { className: "relative", children: [_jsx("div", { ref: host, style: { height } }), _jsx("div", { className: "pointer-events-none absolute inset-0 text-muted-foreground text-xs", children: panes.map((p, n) => (_jsx("div", { className: "absolute inset-x-0", style: { top: PRICE_PANE + n * OSC_PANE, height: OSC_PANE }, children: _jsx("h3", { className: "px-2 pt-2", children: p.label }) }, p.id))) })] }), api && timeline.length > 2 && (_jsx(Navigator, { chart: api, bars: axisBars, secs: secs, timeline: timeline, theme: theme, timeZone: timeZone, multiDay: multiDay, goTo: goTo }))] }));
+}

package/dist/market/indicator-picker.d.ts

@@ -0,0 +1,29 @@
+import { type ChartFormula } from '@columenlabs/lumen-ui-types/chart-formula';
+import { type ChartIndicator } from './indicators.js';
+/** "For" in the compare chart: every symbol shown, or one of them. */
+export declare const ALL_SHOWN = "all";
+/** Saved formulas the picker lists first, and how to keep a new one. */
+type Mine = {
+    list: ChartIndicator[];
+    save?: (f: ChartFormula) => Promise<void>;
+    remove?: (id: string) => Promise<void>;
+};
+/** "Indicators" button and a searchable list of everything the chart can draw. */
+export declare function IndicatorPicker({ selected, available, reasons, targets, target, onTarget, onToggle, mine, onAdd, }: {
+    /** Indicator ids picked (for the current `target`). */
+    selected: string[];
+    /** Indicator ids this chart has values for. */
+    available: Set<string>;
+    /** Why an indicator is not available here, by id; left out: "no values". */
+    reasons?: Map<string, string>;
+    /** The symbols on a compare chart: the "For" picker shows All shown and each of them. */
+    targets?: string[];
+    target?: string;
+    onTarget?: (target: string) => void;
+    onToggle: (id: string) => void;
+    /** The person's saved formulas (Mine); left out: none. */
+    mine?: Mine;
+    /** Adds a built-in with its own window or a formula; left out: only the catalog is offered. */
+    onAdd?: (i: ChartIndicator) => void;
+}): import("react").JSX.Element;
+export {};

package/dist/market/indicator-picker.js

@@ -0,0 +1,125 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { parseChartFormula } from '@columenlabs/lumen-ui-types/chart-formula';
+import { PlusIcon, SaveIcon, Trash2Icon } from 'lucide-react';
+import { useState } from 'react';
+import { LumenConfirm } from '../confirm.js';
+import { IconButton } from '../icon-button.js';
+import { LumenSelector } from '../lumen-selector.js';
+import { Field, FieldDescription, FieldLabel } from '../ui/field.js';
+import { Input } from '../ui/input.js';
+import { ToggleGroup, ToggleGroupItem } from '../ui/toggle-group.js';
+import { CHART_INDICATORS, formulaIndicator, resolveIndicator, } from './indicators.js';
+const GROUPS = [
+    { heading: 'On price', has: (i) => !i.sourced && i.where === 'overlay' },
+    { heading: 'Below price', has: (i) => !i.sourced && i.where === 'pane' },
+    { heading: 'From market data', has: (i) => !!i.sourced },
+];
+/** "For" in the compare chart: every symbol shown, or one of them. */
+export const ALL_SHOWN = 'all';
+/**
+ * A built-in with its own window, typed in the search (`ema 13`, `rsi 7`, `bollinger 20 2.5`,
+ * `macd 8 21 5`); null when the search is not one.
+ */
+function typedBuiltin(search) {
+    const m = /^\s*(sma|ema|rsi|atr|bollinger|bb|macd)[\s_,]+([\d.\s,_]+)$/i.exec(search);
+    if (!m)
+        return null;
+    const kind = m[1].toLowerCase() === 'bb' ? 'bollinger' : m[1].toLowerCase();
+    const nums = m[2].split(/[\s,_]+/).filter(Boolean);
+    const id = [kind, ...nums.map((n) => n.replace('.', 'p'))].join('_');
+    const i = resolveIndicator(id);
+    return i && !i.sourced ? i : null;
+}
+/** "Indicators" button and a searchable list of everything the chart can draw. */
+export function IndicatorPicker({ selected, available, reasons, targets, target = ALL_SHOWN, onTarget, onToggle, mine, onAdd, }) {
+    const [label, setLabel] = useState('');
+    const [f, setF] = useState('');
+    const [busy, setBusy] = useState(false);
+    const [error, setError] = useState(null);
+    const [removing, setRemoving] = useState(null);
+    // The new formula checked as it is typed: how many bars it needs first, or why it can't run.
+    let check = null;
+    if (f.trim()) {
+        try {
+            const { lookback } = parseChartFormula(f);
+            check = { ok: true, text: `Checks out · needs ${lookback} bars before its first value` };
+        }
+        catch (e) {
+            check = { ok: false, text: e instanceof Error ? e.message : String(e) };
+        }
+    }
+    const formula = check?.ok && label.trim() ? { label: label.trim(), f: f.trim() } : null;
+    const addFormula = () => {
+        if (!formula || !onAdd)
+            return;
+        onAdd(formulaIndicator(formula));
+        setLabel('');
+        setF('');
+    };
+    const saveFormula = () => {
+        if (!formula || !mine?.save)
+            return;
+        setBusy(true);
+        setError(null);
+        mine
+            .save(formula)
+            .then(() => {
+            setLabel('');
+            setF('');
+        })
+            .catch((e) => setError(e.message))
+            .finally(() => setBusy(false));
+    };
+    const byId = new Map([...(mine?.list ?? []), ...CHART_INDICATORS].map((i) => [i.id, i]));
+    const option = (i, extra) => {
+        const has = available.has(i.id) || !CHART_INDICATORS.some((c) => c.id === i.id);
+        return {
+            value: i.id,
+            label: i.formula ? `ƒ ${i.label}` : i.label,
+            keywords: i.f ? [i.f] : undefined,
+            disabled: has ? false : (reasons?.get(i.id) ?? 'no values'),
+            detail: has ? undefined : (reasons?.get(i.id) ?? 'no values'),
+            content: (_jsxs("span", { className: "flex min-w-0 items-center gap-2", children: [_jsx("span", { className: "shrink-0", children: i.formula ? `ƒ ${i.label}` : i.label }), i.f && _jsx("span", { className: "truncate font-mono text-xs text-muted-foreground", children: i.f }), extra] })),
+        };
+    };
+    const groups = [
+        ...(mine && mine.list.length > 0
+            ? [
+                {
+                    label: 'Mine',
+                    options: mine.list.map((i) => option(i, mine.remove && (_jsx(IconButton, { icon: Trash2Icon, size: "icon-xs", label: `Delete ${i.label}`, className: "ml-auto text-muted-foreground hover:text-destructive", onPointerDown: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onClick: (e) => {
+                            e.stopPropagation();
+                            e.preventDefault();
+                            setRemoving(i);
+                        } })))),
+                },
+            ]
+            : []),
+        ...GROUPS.map((g) => ({
+            label: g.heading,
+            options: CHART_INDICATORS.filter(g.has).map((i) => option(i)),
+        })),
+    ];
+    // A picked row adds a built-in with its own window (or toggles one already on); unpicking turns
+    // it off, as the list's rows did.
+    const change = (next) => {
+        for (const id of selected)
+            if (!next.includes(id))
+                onToggle(id);
+        for (const id of next) {
+            if (selected.includes(id))
+                continue;
+            const i = byId.get(id) ?? resolveIndicator(id, mine?.list);
+            if (onAdd && i)
+                onAdd(i);
+            else
+                onToggle(id);
+        }
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(LumenSelector, { multiple: true, trigger: "icon", icon: PlusIcon, label: "Add indicators", align: "end", search: true, empty: "No indicator matches.", groups: groups, value: selected, onChange: change, create: onAdd ? (q) => typedBuiltin(q)?.id ?? null : undefined, createLabel: (q) => typedBuiltin(q)?.label ?? 'Type a window: ema 13, rsi 7', header: _jsxs(_Fragment, { children: [targets && targets.length > 1 && onTarget && (_jsxs("div", { className: "flex items-center gap-2 border-b px-3 py-2 text-xs text-muted-foreground", children: ["For", _jsxs(ToggleGroup, { type: "single", size: "sm", variant: "outline", spacing: 0, value: target, onValueChange: (v) => v && onTarget(v), "aria-label": "For", className: "flex-wrap", children: [_jsx(ToggleGroupItem, { value: ALL_SHOWN, className: "px-2.5", children: "All shown" }), targets.map((t) => (_jsx(ToggleGroupItem, { value: t, className: "px-2.5 font-mono", children: t }, t)))] })] })), onAdd && (_jsx("div", { className: "flex flex-col gap-2 border-b p-3", children: _jsxs(Field, { children: [_jsx(FieldLabel, { children: "New formula" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { "aria-label": "Name", placeholder: "Name", className: "h-8 flex-1", value: label, maxLength: 60, onChange: (e) => setLabel(e.target.value) }), _jsx(IconButton, { icon: PlusIcon, label: "Add to the chart", variant: "outline", disabled: !formula, onClick: addFormula }), mine?.save && (_jsx(IconButton, { icon: SaveIcon, label: "Save to Mine", variant: "outline", disabled: !formula || busy, busy: busy, onClick: saveFormula }))] }), _jsx(Input, { "aria-label": "Formula", placeholder: "(ema(close, 9) - ema(close, 21)) / close * 100", className: "h-8 font-mono", value: f, maxLength: 400, onChange: (e) => setF(e.target.value), onKeyDown: (e) => e.key === 'Enter' && addFormula() }), _jsx(FieldDescription, { className: check && !check.ok ? 'text-loss' : undefined, children: error ??
+                                            check?.text ??
+                                            'Fields open high low close · sma ema rsi stdev highest lowest sum ref change (x, n) · atr(n) · abs min max' })] }) }))] }) }), removing && mine?.remove && (_jsx(LumenConfirm, { open: true, onOpenChange: (o) => !o && setRemoving(null), title: `Delete ${removing.label}?`, description: "It leaves Mine on every desk.", onConfirm: () => {
+                    void mine.remove?.(removing.id).catch((e) => setError(e.message));
+                    setRemoving(null);
+                } }))] }));
+}

package/dist/market/indicators.d.ts

@@ -0,0 +1,63 @@
+/**
+ * Indicators the chart can draw (moved from an app's Chart tab, 2026-10-12). `lines` are output
+ * series keyed like an app's stored `indicators_1d` names, so an app with stored values (an app's
+ * daily chart) passes those. The chart dialog makes each one only when it is added: `computed` ones in the browser with indicatorts over warm-up bars before the window,
+ * `sourced` ones (P/E, IV, EPS estimate) read once from market data, since bars cannot give them.
+ */
+import { type ChartFormula, type ChartIndicatorId, type FormulaNode, type IndicatorSpec } from '@columenlabs/lumen-ui-types/chart-formula';
+export type ChartIndicator = {
+    id: string;
+    label: string;
+    /** overlay: drawn on the price; pane: its own chart under the price. */
+    where: 'overlay' | 'pane';
+    lines: {
+        key: string;
+        label: string;
+        bar?: boolean;
+    }[];
+    /** Reference levels drawn as dashed lines in a pane. */
+    refs?: number[];
+    /** Fixed value axis for a pane; otherwise it follows the data. */
+    domain?: [number, number];
+    /** The browser can work it out from bars alone (no volume). */
+    computed?: boolean;
+    /** Read from market data when added (`market/indicators`); daily, stocks and ETFs only. */
+    sourced?: boolean;
+    /** Only on daily bars (52 weeks is a count of days). */
+    daily?: boolean;
+    /** A formula's tree (the assistant's or the person's), run over the bars; `lookback` bars come first. */
+    formula?: FormulaNode;
+    /** A saved formula's text, for the picker and the assistant. */
+    f?: string;
+};
+/** Every catalog id is in `CHART_INDICATOR_IDS`, which the server checks the assistant's specs against. */
+export declare const CHART_INDICATORS: (ChartIndicator & {
+    id: ChartIndicatorId;
+})[];
+/** Colour of each line, fixed by its place in the catalog so a new pick never recolours the others. */
+export declare const LINE_COLOR: Record<string, string>;
+/** A line's colour: its catalog place, else one picked from its key so it stays put. */
+export declare function lineColor(key: string): string;
+/** A formula's id on the chart: the same label and formula are the same line. */
+export declare function formulaId(f: ChartFormula): string;
+/** A formula as a chart line; throws with why it can't run. */
+export declare function formulaIndicator(f: ChartFormula, id?: string): ChartIndicator;
+/**
+ * What a spec draws: a catalog indicator, a built-in with any window, a saved formula (`mine:<id>`,
+ * looked up in `mine`) or a formula; null when it is none of them.
+ */
+export declare function resolveIndicator(spec: IndicatorSpec, mine?: ChartIndicator[]): ChartIndicator | null;
+/** Values per line key, per bar time. */
+export type IndicatorValues = Record<string, Map<string | number, number>>;
+interface Ohlc {
+    time: string | number;
+    open: number;
+    high: number;
+    low: number;
+    close: number;
+}
+/** A formula's values per bar (NaN where it has none yet), with indicatorts doing the series math. */
+export declare function runFormula(node: FormulaNode, bars: Ohlc[]): number[];
+/** The chosen indicators' lines worked out from `bars`, skipping each one's warm-up bars. */
+export declare function computeIndicators(bars: Ohlc[], chosen: ChartIndicator[]): IndicatorValues;
+export {};