@wick-charts/vue 0.4.1 → 0.5.0

package/dist/core/dist/navigator/controller.js

@@ -0,0 +1,374 @@
+import { DEFAULT_LINE_ENTRY as w } from "../animation/config.js";
+import { XScale as T } from "../scales/x-scale.js";
+import { YScale as R } from "../scales/y-scale.js";
+import { decimateCandles as k, decimateLinear as C } from "./decimate.js";
+import { hitTest as y, computeSnapCenter as E, computePan as I, computeResize as M } from "./interactions.js";
+import { computeWindowGeometry as $, renderBackground as V, renderMiniCandlestick as L, renderMiniBar as N, renderMiniLine as P } from "./render.js";
+import { Animator as S } from "../animation/animator.js";
+import { easeOutCubic as z } from "../animation/easing.js";
+class G {
+  #s;
+  #t;
+  #z;
+  #e;
+  #o;
+  #d;
+  #r;
+  #l;
+  #a;
+  #c;
+  #x;
+  #v;
+  // Own scales — both cover the full data span. The main chart's scales move
+  // with the viewport; these don't.
+  #u = new T();
+  #F = new R();
+  #A = 0;
+  #m = 0;
+  #n = 1;
+  #p = null;
+  /** A full canvas render is owed. A queued frame with `#dirty === false`
+   *  came from {@link #markWindowDirty} and only repositions the window DOM. */
+  #T = !0;
+  /**
+   * Memoized decimation results keyed by source array ref. Cleared on
+   * `setData` (guards in-place mutation of a re-passed array); a buckets
+   * mismatch (resize) recomputes per entry.
+   */
+  #R = /* @__PURE__ */ new Map();
+  /**
+   * Eases the alpha of the trailing bar/candle/line-segment from 0 → 1 over
+   * `DEFAULT_LINE_ENTRY` whenever {@link setData} reports a new last point
+   * (a `time` we haven't seen before). Mirrors the per-point entrance
+   * animation that the main chart's series renderers run, so a streaming
+   * tick reads as a smooth fade-in here too instead of a redraw pop.
+   *
+   * `null` means "no entrance in flight, draw the tail at full alpha".
+   */
+  #h = null;
+  /** `time` of the last point we've ever seen — initialises after the first
+   * `setData`/render so the first paint doesn't trigger a fade-in. */
+  #k = null;
+  /** Series index in `lineSeriesList(data)` that owns the newest last-time,
+   * so the tail fade applies to the series that actually grew — not always
+   * the last entry in the stack. -1 for candlestick (single-series). */
+  #C = -1;
+  #E;
+  // Active-drag state — null when idle.
+  #g = null;
+  // Bound listeners so we can remove the same references on destroy.
+  #I;
+  #M;
+  #$;
+  #V;
+  #L;
+  #b;
+  #N;
+  constructor(t) {
+    this.#s = t.container, this.#e = t.chart, this.#x = t.data, this.#v = t.options ?? {}, window.getComputedStyle(this.#s).position === "static" && (this.#s.style.position = "relative"), this.#t = document.createElement("canvas"), this.#t.style.position = "absolute", this.#t.style.left = "0", this.#t.style.top = "0", this.#t.style.height = "100%", this.#t.style.touchAction = "none", this.#s.appendChild(this.#t);
+    const e = this.#t.getContext("2d", { alpha: !0 });
+    if (!e) throw new Error("NavigatorController: failed to acquire 2D context");
+    this.#z = e, this.#o = document.createElement("div"), this.#o.dataset.chartNavigatorOverlay = "", this.#o.style.cssText = "position:absolute;left:0;top:0;height:100%;pointer-events:none;", this.#d = document.createElement("div"), this.#d.style.cssText = "position:absolute;left:0;top:0;bottom:0;", this.#r = document.createElement("div"), this.#r.style.cssText = "position:absolute;top:0;bottom:0;", this.#l = document.createElement("div"), this.#l.style.cssText = "position:absolute;top:0;bottom:0;box-sizing:border-box;", this.#a = b(), this.#c = b(), this.#o.append(this.#d, this.#r, this.#l, this.#a, this.#c), this.#s.appendChild(this.#o), this.#I = () => this.#B(), this.#M = () => this.#f(), this.#$ = () => this.#B(), this.#e.on("viewportChange", this.#I), this.#e.on("overlayChange", this.#M), this.#e.on("tickFrame", this.#$), this.#V = (s) => this.#H(s), this.#L = (s) => this.#J(s), this.#b = (s) => this.#K(s), this.#N = () => {
+      this.#g === null && (this.#t.style.cursor = "default");
+    }, this.#t.addEventListener("pointerdown", this.#V), this.#t.addEventListener("pointermove", this.#L), this.#t.addEventListener("pointerup", this.#b), this.#t.addEventListener("pointercancel", this.#b), this.#t.addEventListener("pointerleave", this.#N), this.#E = new ResizeObserver((s) => this.#U(s[0])), this.#E.observe(this.#s), this.#D();
+    const i = this.#s.getBoundingClientRect();
+    i.width > 0 && i.height > 0 && this.#W(i.width, i.height), this.#f();
+  }
+  setData(t) {
+    const e = F(t), i = e?.time ?? null;
+    if (i !== null && this.#k !== null && i !== this.#k) {
+      const s = this.#h?.current ?? 0;
+      this.#h = new S({
+        initial: s,
+        duration: w,
+        easing: z,
+        lerp: (n, h, l) => n + (h - n) * l
+      }), this.#h.setTarget(1);
+    }
+    this.#k = i, this.#C = e?.seriesIndex ?? -1, this.#x = t, this.#R.clear(), this.#f();
+  }
+  setOptions(t) {
+    this.#v = t, this.#D(), this.#f();
+  }
+  /** Push `options.height` (when set) onto the container's CSS height so
+   *  direct core consumers see the option take effect. When the option is
+   *  absent we leave the container alone — framework wrappers manage their
+   *  own inline height via JSX, and overwriting it here would clobber the
+   *  caller's value during the first layout effect. */
+  #D() {
+    const t = this.#v.height;
+    t !== void 0 && (this.#s.style.height = `${t}px`);
+  }
+  destroy() {
+    this.#e.off("viewportChange", this.#I), this.#e.off("overlayChange", this.#M), this.#e.off("tickFrame", this.#$), this.#t.removeEventListener("pointerdown", this.#V), this.#t.removeEventListener("pointermove", this.#L), this.#t.removeEventListener("pointerup", this.#b), this.#t.removeEventListener("pointercancel", this.#b), this.#t.removeEventListener("pointerleave", this.#N), this.#E.disconnect(), this.#p !== null && (cancelAnimationFrame(this.#p), this.#p = null), this.#t.remove(), this.#o.remove();
+  }
+  /** CSS pixel height of the strip — theme default unless overridden. */
+  get height() {
+    return this.#v.height ?? this.#e.getTheme().navigator.height;
+  }
+  // --- internals ---------------------------------------------------------
+  /** Effective drawing width — the navigator reserves the main chart's
+   *  `yAxisWidth` on the right so its active zone lines up with the plot area. */
+  get #i() {
+    return Math.max(0, this.#A - this.#e.yAxisWidth);
+  }
+  #U(t) {
+    if (!t) return;
+    const e = t.contentBoxSize?.[0], i = e?.inlineSize ?? t.contentRect.width, s = e?.blockSize ?? t.contentRect.height;
+    i <= 0 || s <= 0 || (this.#W(i, s), this.#f());
+  }
+  #W(t, e) {
+    this.#A = t, this.#m = e, this.#n = window.devicePixelRatio || 1, this.#X();
+  }
+  /**
+   * Write canvas backing-store / CSS sizes only when they actually changed —
+   * any assignment to `canvas.width`/`height`, even with the same value,
+   * resets the backing store (full clear + realloc), which is pure waste on
+   * a repaint where nothing resized.
+   */
+  #X() {
+    const t = Math.round(this.#i * this.#n), e = Math.round(this.#m * this.#n);
+    this.#t.width !== t && (this.#t.width = t), this.#t.height !== e && (this.#t.height = e);
+    const i = `${this.#i}px`;
+    this.#t.style.width !== i && (this.#t.style.width = i, this.#o.style.width = i);
+  }
+  #f() {
+    this.#T = !0, this.#O();
+  }
+  /** Queue a window-DOM-only frame — a queued full render takes precedence. */
+  #B() {
+    this.#O();
+  }
+  #O() {
+    this.#p === null && (this.#p = requestAnimationFrame(() => {
+      this.#p = null;
+      const t = this.#T;
+      this.#T = !1, t ? this.#_() : this.#Q();
+    }));
+  }
+  // --- input -------------------------------------------------------------
+  /** Extract media-x from a pointer event, relative to the canvas. */
+  #w(t) {
+    const e = this.#t.getBoundingClientRect();
+    return t.clientX - e.left;
+  }
+  /** Keep scales synced with current data bounds + size. Safe to call ahead of
+   *  the first RAF-driven render — pointer handlers rely on this so hit-tests
+   *  compute against primed scales even on the opening gesture. */
+  #P() {
+    const t = this.#y(), e = this.#Z();
+    return this.#u.update(t, this.#i, this.#n), this.#F.update(e, this.#m, this.#n), { xRange: t, yRange: e };
+  }
+  /**
+   * X range for the brush window. While the user drags the brush we track the
+   * committed logical target so the window follows the cursor 1:1; otherwise we
+   * follow the engine's eased visual so the window glides with the canvas
+   * instead of snapping to a wheel-zoom / pan destination while the chart eases.
+   */
+  #Y() {
+    return this.#g !== null ? this.#e.getVisibleRange() : this.#e.getAnimationState().xRange;
+  }
+  #S() {
+    return this.#P(), $(this.#u, this.#Y(), this.#y());
+  }
+  #j() {
+    const t = this.#y(), e = t.to - t.from;
+    return e <= 0 || this.#i <= 0 ? 0 : this.#i / e;
+  }
+  #H(t) {
+    if (t.button !== void 0 && t.button !== 0) return;
+    const e = this.#w(t), i = this.#y();
+    if (i.to <= i.from) return;
+    const s = this.#S(), n = y(e, s), h = this.#j();
+    if (h === 0) return;
+    let l = this.#e.getVisibleRange();
+    if (n.snapToCenter) {
+      const r = this.#u.xToTime(e), a = E({ time: r, startVisible: l, xRange: i });
+      this.#e.setVisibleRange(a), l = a;
+    }
+    this.#g = {
+      pointerId: t.pointerId,
+      gesture: n.gesture,
+      startX: e,
+      startVisible: l,
+      pixelsPerTime: h
+    }, this.#t.setPointerCapture(t.pointerId), this.#t.style.cursor = v(
+      n.gesture,
+      /*dragging*/
+      !0
+    ), t.preventDefault();
+  }
+  #J(t) {
+    const e = this.#g;
+    if (e === null) {
+      this.#t.style.cursor = x(this.#w(t), this.#S());
+      return;
+    }
+    if (t.pointerId !== e.pointerId) return;
+    const i = this.#w(t) - e.startX, s = this.#y();
+    let n;
+    if (e.gesture === "pan")
+      n = I({
+        startVisible: e.startVisible,
+        deltaPx: i,
+        pixelsPerTime: e.pixelsPerTime,
+        dataRange: s
+      });
+    else {
+      const h = e.gesture === "resize-left" ? "left" : "right";
+      n = M({
+        edge: h,
+        startVisible: e.startVisible,
+        deltaPx: i,
+        pixelsPerTime: e.pixelsPerTime,
+        dataRange: s,
+        minSpan: 2 * this.#e.getDataInterval()
+      });
+    }
+    this.#e.setVisibleRange(n);
+  }
+  #K(t) {
+    const e = this.#g;
+    e === null || t.pointerId !== e.pointerId || (this.#g = null, this.#t.hasPointerCapture(t.pointerId) && this.#t.releasePointerCapture(t.pointerId), this.#t.style.cursor = x(this.#w(t), this.#S()));
+  }
+  // --- render ------------------------------------------------------------
+  #_() {
+    if (this.#i <= 0 || this.#m <= 0) return;
+    const t = this.#e.getTheme().navigator, { xRange: e } = this.#P();
+    this.#X();
+    const i = this.#z, s = this.#t.width, n = this.#t.height;
+    i.save(), i.clearRect(0, 0, s, n), i.scale(this.#n, this.#n);
+    const h = {
+      ctx: i,
+      timeScale: this.#u,
+      yScale: this.#F,
+      mediaWidth: this.#i,
+      mediaHeight: this.#m,
+      theme: t
+    };
+    this.#t.style.boxShadow = `inset 0 1px 0 ${t.borderColor}, inset 0 -1px 0 ${t.borderColor}`, V(h);
+    let l = 1;
+    this.#h !== null && (this.#h.tick(performance.now()), l = this.#h.current, this.#h.animating ? this.#f() : this.#h = null);
+    const r = Math.max(1, Math.round(this.#i)), a = this.#x;
+    if (a.type === "candlestick")
+      L(h, this.#q(a.points, r, k), l);
+    else {
+      const c = f(a), g = c.length === 1, d = this.#C >= 0 ? this.#C : c.length - 1;
+      for (let u = 0; u < c.length; u++) {
+        const p = this.#q(c[u], r, C), m = u === d ? l : 1;
+        a.type === "bar" ? N(h, p, m) : P(h, p, g, m);
+      }
+    }
+    i.restore(), this.#G(t, e);
+  }
+  /**
+   * Light per-frame path — reposition the window / masks / handles against
+   * the eased viewport without touching the canvas. Escalates to a full
+   * render when the canvas size went stale (e.g. `yAxisWidth` changed without
+   * a resize event).
+   */
+  #Q() {
+    if (this.#i <= 0 || this.#m <= 0) return;
+    const t = Math.round(this.#i * this.#n);
+    if (this.#t.width !== t) {
+      this.#_();
+      return;
+    }
+    const e = this.#e.getTheme().navigator, { xRange: i } = this.#P();
+    this.#G(e, i);
+  }
+  /** Decimate `points` into `buckets`, reusing the cached result while the
+   *  source array ref and bucket count are unchanged. */
+  #q(t, e, i) {
+    const s = this.#R.get(t);
+    if (s !== void 0 && s.buckets === e)
+      return s.result;
+    const n = i(t, e);
+    return this.#R.set(t, { buckets: e, result: n }), n;
+  }
+  #G(t, e) {
+    if (e.to <= e.from) return;
+    const i = this.#Y(), s = Math.max(e.from, Math.min(e.to, i.from)), n = Math.max(e.from, Math.min(e.to, i.to)), h = this.#u.timeToX(s), l = this.#u.timeToX(n), r = Math.min(h, l), a = Math.max(h, l), c = Math.max(1, a - r);
+    this.#d.style.width = `${r}px`, this.#d.style.background = t.mask.fill, this.#d.style.display = r > 0 ? "block" : "none";
+    const g = Math.max(0, this.#i - (r + c));
+    this.#r.style.left = `${r + c}px`, this.#r.style.width = `${g}px`, this.#r.style.background = t.mask.fill, this.#r.style.display = g > 0 ? "block" : "none", this.#l.style.left = `${r}px`, this.#l.style.width = `${c}px`, this.#l.style.background = t.window.fill, this.#l.style.border = t.window.borderWidth > 0 ? `${t.window.borderWidth}px solid ${t.window.border}` : "none";
+    const d = t.handle.width, u = Math.max(1, d / 2), p = this.#e.getTheme().background;
+    this.#a.style.left = `${r - d / 2}px`, this.#a.style.width = `${d}px`, this.#a.style.background = t.handle.color, this.#a.style.borderRadius = `${u}px`, this.#c.style.left = `${r + c - d / 2}px`, this.#c.style.width = `${d}px`, this.#c.style.background = t.handle.color, this.#c.style.borderRadius = `${u}px`;
+    for (const m of this.#a.children)
+      m.style.background = p;
+    for (const m of this.#c.children)
+      m.style.background = p;
+  }
+  #y() {
+    const t = this.#x;
+    let e = Number.POSITIVE_INFINITY, i = Number.NEGATIVE_INFINITY, s = 0;
+    if (t.type === "candlestick")
+      s = t.points.length, s > 0 && (e = t.points[0].time, i = t.points[s - 1].time);
+    else
+      for (const h of f(t))
+        h.length !== 0 && (s += h.length, h[0].time < e && (e = h[0].time), h[h.length - 1].time > i && (i = h[h.length - 1].time));
+    if (s >= 2 && i > e)
+      return { from: e, to: i };
+    if (s === 1)
+      return { ...this.#e.getVisibleRange() };
+    const n = this.#e.getDataRange();
+    return n && n.to > n.from ? n : { ...this.#e.getVisibleRange() };
+  }
+  #Z() {
+    const t = this.#x;
+    let e = 1 / 0, i = -1 / 0;
+    if (t.type === "candlestick")
+      for (const n of t.points)
+        n.low < e && (e = n.low), n.high > i && (i = n.high);
+    else
+      for (const n of f(t))
+        for (const h of n)
+          h.value < e && (e = h.value), h.value > i && (i = h.value);
+    if (!Number.isFinite(e) || !Number.isFinite(i)) return { min: 0, max: 1 };
+    if (e === i) {
+      const n = Math.abs(e) * 0.05 || 1;
+      return { min: e - n, max: i + n };
+    }
+    const s = (i - e) * 0.2;
+    return { min: e - s, max: i + s };
+  }
+}
+function f(o) {
+  return "series" in o ? o.series : [o.points];
+}
+function F(o) {
+  if (o.type === "candlestick") {
+    const s = o.points.length;
+    return s === 0 ? null : { time: o.points[s - 1].time, seriesIndex: -1 };
+  }
+  const t = "series" in o ? o.series : [o.points];
+  let e = null, i = -1;
+  for (let s = 0; s < t.length; s++) {
+    const n = t[s];
+    if (n.length === 0) continue;
+    const h = n[n.length - 1].time;
+    (e === null || h > e) && (e = h, i = s);
+  }
+  return e === null ? null : { time: e, seriesIndex: i };
+}
+function v(o, t) {
+  return o === "resize-left" || o === "resize-right" ? "ew-resize" : t ? "grabbing" : "grab";
+}
+function x(o, t) {
+  return v(A(o, t), !1);
+}
+function A(o, t) {
+  return y(o, t).gesture;
+}
+function b() {
+  const o = document.createElement("div");
+  o.style.cssText = "position:absolute;top:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;";
+  for (let t = 0; t < 3; t++) {
+    const e = document.createElement("div");
+    e.style.cssText = "width:2px;height:2px;border-radius:50%;flex-shrink:0;", o.appendChild(e);
+  }
+  return o;
+}
+export {
+  G as NavigatorController
+};

package/dist/core/dist/navigator/decimate.js

@@ -0,0 +1,44 @@
+function m(e, i) {
+  if (e.length <= i || i <= 0) return e;
+  const h = e[0].time, c = e[e.length - 1].time, r = c - h;
+  if (r <= 0) return e;
+  const f = r / i, u = [];
+  let o = 0;
+  for (let l = 0; l < i; l++) {
+    const g = l === i - 1 ? c + 1 : h + (l + 1) * f;
+    let t = null, n = null;
+    for (; o < e.length && e[o].time < g; ) {
+      const s = e[o];
+      (t === null || s.value < t.value) && (t = s), (n === null || s.value > n.value) && (n = s), o++;
+    }
+    if (!(t === null || n === null)) {
+      if (t === n) {
+        u.push(t);
+        continue;
+      }
+      t.time < n.time ? u.push(t, n) : u.push(n, t);
+    }
+  }
+  return u;
+}
+function a(e, i) {
+  if (e.length <= i || i <= 0) return e;
+  const h = e[0].time, c = e[e.length - 1].time, r = c - h;
+  if (r <= 0) return e;
+  const f = r / i, u = [];
+  let o = 0;
+  for (let l = 0; l < i; l++) {
+    const g = l === i - 1 ? c + 1 : h + (l + 1) * f;
+    let t = null;
+    for (; o < e.length && e[o].time < g; ) {
+      const n = e[o];
+      t === null ? t = { time: n.time, open: n.open, high: n.high, low: n.low, close: n.close } : (n.high > t.high && (t.high = n.high), n.low < t.low && (t.low = n.low), t.close = n.close), o++;
+    }
+    t !== null && u.push(t);
+  }
+  return u;
+}
+export {
+  a as decimateCandles,
+  m as decimateLinear
+};

package/dist/core/dist/navigator/interactions.js

@@ -0,0 +1,28 @@
+function p(a, o) {
+  return Math.abs(a - o.left) <= 8 ? { gesture: "resize-left", snapToCenter: !1 } : Math.abs(a - o.right) <= 8 ? { gesture: "resize-right", snapToCenter: !1 } : a > o.left && a < o.right ? { gesture: "pan", snapToCenter: !1 } : { gesture: "pan", snapToCenter: !0 };
+}
+function g(a) {
+  const { startVisible: o, deltaPx: f, pixelsPerTime: n, dataRange: r } = a, t = o.to - o.from, e = f / n;
+  let s = o.from + e, m = o.to + e;
+  return s < r.from && (s = r.from, m = s + t), m > r.to && (m = r.to, s = m - t), s < r.from && (s = r.from), { from: s, to: m };
+}
+function c(a) {
+  const { edge: o, startVisible: f, deltaPx: n, pixelsPerTime: r, dataRange: t, minSpan: e } = a, s = n / r;
+  if (o === "left") {
+    let l = f.from + s, u = f.to;
+    return l < t.from && (l = t.from), u - l < e && (l = u - e), l < t.from && (l = t.from, u = Math.min(t.to, l + e)), { from: l, to: u };
+  }
+  let m = f.from, i = f.to + s;
+  return i > t.to && (i = t.to), i - m < e && (i = m + e), i > t.to && (i = t.to, m = Math.max(t.from, i - e)), { from: m, to: i };
+}
+function h(a) {
+  const { time: o, startVisible: f, xRange: n } = a, r = f.to - f.from;
+  let t = o - r / 2, e = t + r;
+  return t < n.from && (t = n.from, e = t + r), e > n.to && (e = n.to, t = e - r), t < n.from && (t = n.from), { from: t, to: e };
+}
+export {
+  g as computePan,
+  c as computeResize,
+  h as computeSnapCenter,
+  p as hitTest
+};

package/dist/core/dist/navigator/render.js

@@ -0,0 +1,68 @@
+import { resolveCandlestickBodyColor as x } from "../theme/resolve.js";
+function k(d) {
+  const { ctx: o, theme: r, mediaWidth: t, mediaHeight: e } = d;
+  o.fillStyle = r.background, o.fillRect(0, 0, t, e);
+}
+function p(d, o, r = !0, t = 1) {
+  if (o.length < 2) return;
+  const { ctx: e, timeScale: a, yScale: h, mediaHeight: s, theme: n } = d, g = t < 1 && o.length >= 2, T = g ? o.length - 2 : o.length - 1;
+  if (r) {
+    const l = e.createLinearGradient(0, 0, 0, s);
+    l.addColorStop(0, n.line.areaTopColor), l.addColorStop(1, n.line.areaBottomColor), e.beginPath();
+    for (let i = 0; i <= T; i++) {
+      const c = o[i], m = a.timeToX(c.time), u = h.valueToY(c.value);
+      i === 0 ? e.moveTo(m, u) : e.lineTo(m, u);
+    }
+    if (e.lineTo(a.timeToX(o[T].time), s), e.lineTo(a.timeToX(o[0].time), s), e.closePath(), e.fillStyle = l, e.fill(), g) {
+      e.save(), e.globalAlpha = t, e.beginPath();
+      const i = o[T], c = o[o.length - 1], m = a.timeToX(i.time), u = a.timeToX(c.time);
+      e.moveTo(m, h.valueToY(i.value)), e.lineTo(u, h.valueToY(c.value)), e.lineTo(u, s), e.lineTo(m, s), e.closePath(), e.fillStyle = l, e.fill(), e.restore();
+    }
+  }
+  e.beginPath();
+  for (let l = 0; l <= T; l++) {
+    const i = o[l], c = a.timeToX(i.time), m = h.valueToY(i.value);
+    l === 0 ? e.moveTo(c, m) : e.lineTo(c, m);
+  }
+  if (e.strokeStyle = n.line.color, e.lineWidth = n.line.width, e.stroke(), g) {
+    e.save(), e.globalAlpha = t, e.beginPath();
+    const l = o[T], i = o[o.length - 1];
+    e.moveTo(a.timeToX(l.time), h.valueToY(l.value)), e.lineTo(a.timeToX(i.time), h.valueToY(i.value)), e.strokeStyle = n.line.color, e.lineWidth = n.line.width, e.stroke(), e.restore();
+  }
+}
+function Y(d, o, r = 1) {
+  if (o.length === 0) return;
+  const { ctx: t, timeScale: e, yScale: a, mediaHeight: h, theme: s } = d, n = Math.max(
+    1,
+    o.length > 1 ? Math.abs(e.timeToX(o[1].time) - e.timeToX(o[0].time)) * 0.8 : 2
+  ), g = r < 1, T = o.length - 1;
+  t.fillStyle = s.line.color;
+  for (let l = 0; l < o.length; l++) {
+    const i = o[l], c = e.timeToX(i.time), m = a.valueToY(i.value), u = Math.max(1, h - m);
+    g && l === T ? (t.save(), t.globalAlpha = r, t.fillRect(c - n / 2, m, n, u), t.restore()) : t.fillRect(c - n / 2, m, n, u);
+  }
+}
+function w(d, o, r = 1) {
+  if (o.length === 0) return;
+  const { ctx: t, timeScale: e, yScale: a, theme: h } = d, s = Math.max(
+    1,
+    o.length > 1 ? Math.abs(e.timeToX(o[1].time) - e.timeToX(o[0].time)) * 0.75 : 2
+  ), n = r < 1, g = o.length - 1;
+  for (let T = 0; T < o.length; T++) {
+    const l = o[T], i = l.close >= l.open ? h.candlestick.up : h.candlestick.down, c = x(i.body), m = e.timeToX(l.time), u = a.valueToY(l.open), f = a.valueToY(l.close), M = a.valueToY(l.high), S = a.valueToY(l.low), v = n && T === g;
+    v && (t.save(), t.globalAlpha = r), t.strokeStyle = i.wick, t.lineWidth = 1, t.beginPath(), t.moveTo(m, M), t.lineTo(m, S), t.stroke();
+    const X = Math.min(u, f), b = Math.max(1, Math.abs(f - u));
+    t.fillStyle = c, t.fillRect(m - s / 2, X, s, b), v && t.restore();
+  }
+}
+function C(d, o, r) {
+  const t = Math.max(r.from, Math.min(r.to, o.from)), e = Math.max(r.from, Math.min(r.to, o.to)), a = d.timeToX(t), h = d.timeToX(e), s = Math.min(a, h), n = Math.max(a, h);
+  return { left: s, right: n, width: Math.max(1, n - s) };
+}
+export {
+  C as computeWindowGeometry,
+  k as renderBackground,
+  Y as renderMiniBar,
+  w as renderMiniCandlestick,
+  p as renderMiniLine
+};

package/dist/core/dist/perf/counting-context.js

@@ -0,0 +1,19 @@
+function p(c, r) {
+  const o = /* @__PURE__ */ new Map();
+  return new Proxy(c, {
+    get(n, t) {
+      const e = Reflect.get(n, t, n);
+      if (typeof e != "function") return e;
+      const s = o.get(t);
+      if (s) return s;
+      const f = typeof t == "string" ? t : String(t), g = e, u = (...i) => (r.set(f, (r.get(f) ?? 0) + 1), g.apply(n, i));
+      return o.set(t, u), u;
+    },
+    set(n, t, e) {
+      return Reflect.set(n, t, e, n);
+    }
+  });
+}
+export {
+  p as createCountingContext
+};