@wick-charts/vue 0.4.2 → 0.5.0

package/dist/core/dist/scales/tick-tracker.js

@@ -0,0 +1,110 @@
+import { DEFAULT_TICKS_MS as a } from "../animation/config.js";
+import { Animator as h } from "../animation/animator.js";
+const u = { entries: [], isAnimating: !1 }, c = (s, t, e) => s + (t - s) * e;
+function f(s, t) {
+  if (s === t) return !0;
+  if (s.length !== t.length) return !1;
+  for (let e = 0; e < s.length; e++)
+    if (s[e] !== t[e]) return !1;
+  return !0;
+}
+class m {
+  #e = [];
+  #r = [];
+  #t = /* @__PURE__ */ new Map();
+  #i;
+  /**
+   * `false` during the initial mount phase: `setCurrentTicks` snaps each
+   * entering/exiting animator to its target (duration `0`) so the very
+   * first niceTickValues sets land at full opacity with no fade. The
+   * chart's renderMain flips this once the chart has reached a settled
+   * frame.
+   */
+  #s = !1;
+  constructor(t = {}) {
+    this.#i = t.fadeMs ?? a;
+  }
+  /**
+   * Record the latest tick set. Diffs against the current set and either
+   * starts a `0 → 1` fade-in for new values or a `1 → 0` fade-out for
+   * dropped ones. Idempotent on element-wise equal arrays.
+   *
+   * Callers must invoke {@link tick} every frame to advance the animators —
+   * `snapshot()` reads the current state but does not advance time.
+   */
+  setCurrentTicks(t) {
+    if (f(t, this.#e)) return;
+    const e = this.#s ? this.#i : 0, o = new Set(t), r = new Set(this.#e);
+    for (const i of t) {
+      if (r.has(i)) continue;
+      let n = this.#t.get(i);
+      n === void 0 && (n = new h({ initial: 0, duration: this.#i, lerp: c }), this.#t.set(i, n)), n.setTarget(1, { duration: e });
+    }
+    for (const i of this.#e) {
+      if (o.has(i)) continue;
+      const n = this.#t.get(i);
+      n !== void 0 && n.setTarget(0, { duration: e });
+    }
+    this.#r = this.#e, this.#e = t.slice();
+  }
+  /**
+   * Advance each tracked animator against `now`. Animators that settle
+   * at zero are dropped from the map; non-zero settled animators stay so
+   * a subsequent re-entering tick can pick them up without a flicker.
+   * Returns `true` while any animator is still in flight.
+   */
+  tick(t) {
+    let e = !1;
+    for (const [o, r] of this.#t) {
+      if (r.tick(t)) {
+        e = !0;
+        continue;
+      }
+      r.current === 0 && this.#t.delete(o);
+    }
+    return e;
+  }
+  /**
+   * Build a renderer-ready snapshot from the tracker's own animator state.
+   * No external opacity map is consulted — `setCurrentTicks` + `tick(now)`
+   * are the only inputs.
+   */
+  snapshot() {
+    if (this.#t.size === 0) return u;
+    const t = [];
+    let e = !1;
+    for (const [o, r] of this.#t) {
+      const i = r.current;
+      i <= 0 || (t.push({ value: o, opacity: i }), r.animating && (e = !0));
+    }
+    return { entries: t, isAnimating: e };
+  }
+  getCurrentTicks() {
+    return this.#e;
+  }
+  getPreviousTicks() {
+    return this.#r;
+  }
+  /**
+   * Reconfigure the cross-fade duration. Chart calls this after resolving
+   * `animations.axis.ticks` so the tracker honors the user's config
+   * without plumbing options through the scale constructors.
+   */
+  setFadeMs(t) {
+    this.#i = t;
+  }
+  /** Whether subsequent tick-set changes should fade-in or snap. */
+  markArmed() {
+    this.#s = !0;
+  }
+  get isArmed() {
+    return this.#s;
+  }
+  /** Drop all tracked ticks. Use after dataset swap so stale values don't linger. */
+  reset() {
+    this.#e = [], this.#r = [], this.#t.clear(), this.#s = !1;
+  }
+}
+export {
+  m as AxisTickTracker
+};

package/dist/core/dist/scales/x-scale.js

@@ -0,0 +1,145 @@
+import { niceTimeIntervals as u } from "../utils/time.js";
+import { AxisTickTracker as m } from "./tick-tracker.js";
+const c = 50, f = 80;
+class p {
+  /**
+   * Shared fade state for time ticks. Grid lines (canvas) and DOM tick labels
+   * read opacity from the same tracker, so a tick fading in/out looks
+   * identical on both surfaces.
+   */
+  tickTracker = new m();
+  from = 0;
+  to = 0;
+  width = 1;
+  pixelRatio = 1;
+  dataInterval = null;
+  // Label density knobs — written by <TimeAxis labelCount=… minLabelSpacing=…>.
+  labelCountHintValue = null;
+  minSpacingValue = null;
+  resolvedInterval = null;
+  lastInterval = null;
+  /**
+   * "want" (desired interval post-floor) at the time lastInterval was snapped.
+   * Hysteresis band anchors to this so micro range drift back across a tier
+   * boundary doesn't flip the label density — mirrors YScale, see there for
+   * the full reasoning.
+   */
+  lastWant = null;
+  /** Identifies the dataInterval bucket whose tier list drove lastInterval. */
+  lastBucketKey = null;
+  get labelCountHint() {
+    return this.labelCountHintValue;
+  }
+  get minLabelSpacing() {
+    return this.minSpacingValue ?? f;
+  }
+  update(t, s, a, e) {
+    if (this.from = t.from, this.to = t.to, this.width = s, this.pixelRatio = a, e !== void 0 && e > 0) {
+      const n = h(e);
+      this.lastBucketKey !== null && this.lastBucketKey !== n && this.resetHysteresis(), this.lastBucketKey = n, this.dataInterval = e;
+    }
+    this.resolveInterval();
+  }
+  setLabelCount(t) {
+    this.labelCountHintValue = v(t), this.resetHysteresis(), this.resolveInterval();
+  }
+  setMinSpacing(t) {
+    this.minSpacingValue = d(t), this.resetHysteresis(), this.resolveInterval();
+  }
+  resetHysteresis() {
+    this.lastInterval = null, this.lastWant = null;
+  }
+  timeToX(t) {
+    return this.to <= this.from ? 0 : (t - this.from) / (this.to - this.from) * this.width;
+  }
+  timeToBitmapX(t) {
+    return Math.round(this.timeToX(t) * this.pixelRatio);
+  }
+  xToTime(t) {
+    return this.to <= this.from ? this.from : this.from + t / this.width * (this.to - this.from);
+  }
+  pixelDeltaToTimeDelta(t) {
+    return this.to <= this.from ? 0 : t / this.width * (this.to - this.from);
+  }
+  barWidthMedia(t) {
+    return this.to <= this.from ? 0 : t / (this.to - this.from) * this.width;
+  }
+  barWidthBitmap(t) {
+    return Math.max(1, Math.round(this.barWidthMedia(t) * this.pixelRatio));
+  }
+  /**
+   * Evenly spaced "nice" tick times. Resolution uses the cached
+   * `dataInterval` set by `update()`; callers that bypass `update()` can
+   * still pass it here for back-compat.
+   */
+  niceTickValues(t) {
+    if (this.to <= this.from) return { ticks: [], tickInterval: 0 };
+    if (this.dataInterval !== t) {
+      const r = h(t);
+      this.lastBucketKey !== null && this.lastBucketKey !== r && this.resetHysteresis(), this.lastBucketKey = r, this.dataInterval = t, this.resolveInterval();
+    }
+    if (this.resolvedInterval == null) return { ticks: [], tickInterval: 0 };
+    const s = this.resolvedInterval, a = Math.ceil(this.from / s) * s, e = Math.max(0, Math.min(c, Math.floor((this.to - a) / s) + 1)), n = [];
+    for (let r = 0; r < e; r++) n.push(a + r * s);
+    return { ticks: n, tickInterval: s };
+  }
+  getRange() {
+    return { from: this.from, to: this.to };
+  }
+  getMediaWidth() {
+    return this.width;
+  }
+  /**
+   * Resolve the next tick interval. Walks `niceTimeIntervals(dataInterval)`
+   * looking for the smallest tier ≥ desired spacing; retains the previous
+   * tier inside a ratio band so micro pan/zoom doesn't flip label density.
+   */
+  resolveInterval() {
+    if (this.to <= this.from || this.width <= 0 || this.dataInterval == null || this.dataInterval <= 0) {
+      this.resolvedInterval = null;
+      return;
+    }
+    const t = u(this.dataInterval), s = this.to - this.from, a = s / this.width * this.minLabelSpacing;
+    let e;
+    if (this.labelCountHint != null) {
+      const l = Math.max(1, this.labelCountHint);
+      e = Math.max(s / l, a);
+    } else
+      e = a;
+    if (this.lastInterval != null && this.lastWant != null && t.includes(this.lastInterval)) {
+      const l = e >= this.lastWant * 0.8 && e <= this.lastWant * 1.25, o = this.lastInterval >= a;
+      if (l && o) {
+        this.resolvedInterval = this.lastInterval;
+        return;
+      }
+    }
+    let n = t[t.length - 1], r = t.length - 1;
+    for (let l = 0; l < t.length; l++)
+      if (t[l] >= e) {
+        n = t[l], r = l;
+        break;
+      }
+    if (this.labelCountHint != null && r > 0 && this.countTicks(n) < this.labelCountHint) {
+      const l = t[r - 1];
+      l >= a && (n = l);
+    }
+    this.resolvedInterval = n, this.lastInterval = n, this.lastWant = e;
+  }
+  countTicks(t) {
+    if (!(t > 0)) return 0;
+    const s = Math.ceil(this.from / t) * t;
+    return Math.max(0, Math.floor((this.to - s) / t) + 1);
+  }
+}
+function h(i) {
+  return i < 6e4 ? 0 : i < 36e5 ? 1 : i < 864e5 ? 2 : 3;
+}
+function v(i) {
+  return typeof i == "number" && Number.isFinite(i) && i >= 2 ? Math.floor(i) : null;
+}
+function d(i) {
+  return typeof i == "number" && Number.isFinite(i) && i > 0 ? i : null;
+}
+export {
+  p as XScale
+};

package/dist/core/dist/scales/y-scale.js

@@ -0,0 +1,156 @@
+import { formatCompact as h } from "../utils/format.js";
+import { AxisTickTracker as o } from "./tick-tracker.js";
+function u(n) {
+  if (!Number.isFinite(n) || n <= 0) return 1;
+  const t = 10 ** Math.floor(Math.log10(n)), i = n / t;
+  return (i <= 1 ? 1 : i <= 2 ? 2 : i <= 5 ? 5 : 10) * t;
+}
+function m(n) {
+  if (!Number.isFinite(n) || n <= 0) return 1;
+  const t = 10 ** Math.floor(Math.log10(n)), i = n / t;
+  return (i >= 5 ? 5 : i >= 2 ? 2 : 1) * t;
+}
+const c = 50, v = 50;
+class M {
+  /** Shared fade state for Y ticks; see {@link TimeScale.tickTracker}. */
+  tickTracker = new o();
+  min = 0;
+  max = 0;
+  height = 1;
+  pixelRatio = 1;
+  // Label density knobs — written by <YAxis labelCount=… minLabelSpacing=…>.
+  labelCountHintValue = null;
+  minSpacingValue = null;
+  /** Cached {1,2,5}×10^k interval resolved at update-time; null when degenerate. */
+  resolvedInterval = null;
+  /** Previous resolved interval — drives the ratio-band hysteresis. */
+  lastInterval = null;
+  /**
+   * rawInterval at the moment `lastInterval` was snapped. Anchoring the
+   * hysteresis band to *raw-at-snap* (not `lastInterval`) is what creates
+   * naturally asymmetric tier hysteresis: after an escalation the band
+   * starts just above the tier boundary, so live range drift back across
+   * the boundary doesn't instantly flip back.
+   */
+  lastRawInterval = null;
+  /** Custom formatter (driven by `<YAxis format=…>`). */
+  customFormat = null;
+  get labelCountHint() {
+    return this.labelCountHintValue;
+  }
+  get minLabelSpacing() {
+    return this.minSpacingValue ?? v;
+  }
+  /** Recalculate the scale with a new Y range, chart height, and device pixel ratio. */
+  update(t, i, a) {
+    this.min = t.min, this.max = t.max, this.height = i, this.pixelRatio = a, this.resolveInterval();
+  }
+  /** Desired label count. Invalid values (NaN, <2, Infinity) clear the hint. */
+  setLabelCount(t) {
+    this.labelCountHintValue = f(t), this.resetHysteresis(), this.resolveInterval();
+  }
+  /** Minimum pixel gap between adjacent labels. */
+  setMinSpacing(t) {
+    this.minSpacingValue = g(t), this.resetHysteresis(), this.resolveInterval();
+  }
+  resetHysteresis() {
+    this.lastInterval = null, this.lastRawInterval = null;
+  }
+  /** Install (or clear) a custom formatter. */
+  setFormat(t) {
+    this.customFormat = t;
+  }
+  /** Read back the currently installed formatter — null when the built-in is active. */
+  getFormat() {
+    return this.customFormat;
+  }
+  /** Convert a value to a Y position in CSS (media) pixels. */
+  valueToY(t) {
+    const i = this.max - this.min;
+    return i === 0 ? this.height / 2 : (1 - (t - this.min) / i) * this.height;
+  }
+  /** Convert a value to a Y position in physical (bitmap) pixels. */
+  valueToBitmapY(t) {
+    return Math.round(this.valueToY(t) * this.pixelRatio);
+  }
+  /** Convert a Y position in CSS pixels back to a value. */
+  yToValue(t) {
+    const i = this.max - this.min;
+    return i === 0 ? this.min : this.max - t / this.height * i;
+  }
+  /**
+   * Generate evenly spaced "nice" tick values for the current range and
+   * chart height. Pure read — resolution happens in `update()`.
+   */
+  niceTickValues() {
+    if (this.resolvedInterval == null) return [];
+    const t = this.resolvedInterval, i = Math.ceil(this.min / t) * t, a = Math.max(0, Math.min(c, Math.floor((this.max - i) / t) + 1)), e = [];
+    for (let s = 0; s < a; s++) e.push(i + s * t);
+    return e;
+  }
+  getRange() {
+    return { min: this.min, max: this.max };
+  }
+  getMediaHeight() {
+    return this.height;
+  }
+  /**
+   * Format a tick value for display. When a custom formatter is installed
+   * (via {@link setFormat} or the `format` prop on `<YAxis>`), it wins;
+   * otherwise decimals are driven by the resolved tick interval — so
+   * ticks at step 100 never render as "42000.0" just because the visible
+   * range happens to be < 1000.
+   */
+  formatY(t) {
+    if (this.customFormat) return this.customFormat(t);
+    if (this.max - this.min >= 1e6) return h(t);
+    const i = this.resolvedInterval, a = i != null && i > 0 ? Math.max(0, -Math.floor(Math.log10(i))) : 1;
+    return t.toFixed(a);
+  }
+  /**
+   * Resolve the interval to a {1,2,5}×10^k tick size that satisfies the pixel
+   * floor and (optionally) targets `labelCountHint` labels.
+   *
+   * Hysteresis: the band [0.8×, 1.25×] is anchored to **rawInterval at last
+   * snap**, not to `lastInterval`. After an escalation (e.g. 100 → 200),
+   * `lastRawInterval` sits just past the tier boundary, so typical live
+   * range drift back across the boundary stays inside the band and does
+   * *not* de-escalate. This prevents the 2-tier flicker users see when new
+   * candles nudge the Y range across a raw-interval threshold.
+   */
+  resolveInterval() {
+    if (this.max <= this.min || this.height <= 0) {
+      this.resolvedInterval = null;
+      return;
+    }
+    const t = this.max - this.min, i = t * this.minLabelSpacing / this.height, a = this.labelCountHint != null ? Math.max(1, this.labelCountHint) : Math.max(1, Math.floor(this.height / this.minLabelSpacing));
+    let e = t / a;
+    if (e < i && (e = i), this.lastInterval != null && this.lastRawInterval != null) {
+      const l = e >= this.lastRawInterval * 0.8 && e <= this.lastRawInterval * 1.25, r = this.lastInterval >= i;
+      if (l && r) {
+        this.resolvedInterval = this.lastInterval;
+        return;
+      }
+    }
+    let s = u(e);
+    if (this.labelCountHint != null && this.countTicks(s) < this.labelCountHint) {
+      const l = m(e);
+      l >= i && l > 0 && (s = l);
+    }
+    this.resolvedInterval = s, this.lastInterval = s, this.lastRawInterval = e;
+  }
+  countTicks(t) {
+    if (!(t > 0)) return 0;
+    const i = Math.ceil(this.min / t) * t;
+    return Math.max(0, Math.floor((this.max - i) / t) + 1);
+  }
+}
+function f(n) {
+  return typeof n == "number" && Number.isFinite(n) && n >= 2 ? Math.floor(n) : null;
+}
+function g(n) {
+  return typeof n == "number" && Number.isFinite(n) && n > 0 ? n : null;
+}
+export {
+  M as YScale
+};