@wick-charts/vue 0.6.3 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/README.md +6 -6
  2. package/dist/BandSeries.vue.js +52 -0
  3. package/dist/BandSeries.vue2.js +4 -0
  4. package/dist/BarSeries.vue.js +15 -13
  5. package/dist/CandlestickSeries.vue.js +31 -29
  6. package/dist/ChartContainer.vue.js +75 -68
  7. package/dist/LineSeries.vue.js +19 -17
  8. package/dist/composables.js +46 -36
  9. package/dist/core/dist/animation/config.js +92 -75
  10. package/dist/core/dist/animation/viewport-engine.js +155 -96
  11. package/dist/core/dist/axis/dom-labels.js +56 -51
  12. package/dist/core/dist/chart/badge-animator.js +30 -22
  13. package/dist/core/dist/chart/edge-indicators.js +22 -21
  14. package/dist/core/dist/chart/last-value.js +33 -26
  15. package/dist/core/dist/chart/scale-guards.js +23 -5
  16. package/dist/core/dist/chart/x-guards.js +37 -0
  17. package/dist/core/dist/chart.js +1286 -842
  18. package/dist/core/dist/data/decimation.js +58 -39
  19. package/dist/core/dist/data/sync.js +37 -31
  20. package/dist/core/dist/navigator/controller.js +41 -41
  21. package/dist/core/dist/perf/perf-hud.js +3 -3
  22. package/dist/core/dist/scales/tick-tracker.js +2 -2
  23. package/dist/core/dist/scales/x-scale.js +167 -53
  24. package/dist/core/dist/scales/y-scale.js +36 -34
  25. package/dist/core/dist/series/band.js +723 -0
  26. package/dist/core/dist/series/bar.js +297 -291
  27. package/dist/core/dist/series/base-multi-layer.js +283 -237
  28. package/dist/core/dist/series/candlestick.js +32 -31
  29. package/dist/core/dist/series/heatmap.js +5 -5
  30. package/dist/core/dist/series/line-intro.js +47 -37
  31. package/dist/core/dist/series/line.js +489 -448
  32. package/dist/core/dist/series/painters/builtins.js +4 -4
  33. package/dist/core/dist/series/painters/canvas-path.js +64 -52
  34. package/dist/core/dist/series/register-builtins.js +9 -8
  35. package/dist/core/dist/snapshots.js +59 -46
  36. package/dist/core/dist/utils/point.js +10 -0
  37. package/dist/index.d.ts +552 -129
  38. package/dist/index.js +195 -191
  39. package/dist/ui/Crosshair.vue.js +51 -27
  40. package/dist/ui/InfoBar.vue.js +98 -79
  41. package/dist/ui/Marker.vue.js +14 -11
  42. package/dist/ui/Navigator.vue.js +23 -23
  43. package/dist/ui/ReferenceLine.vue.js +19 -16
  44. package/dist/ui/Tooltip.vue.js +116 -84
  45. package/dist/ui/XAxis.vue.js +48 -0
  46. package/dist/ui/XAxis.vue2.js +4 -0
  47. package/dist/ui/YAxis.vue.js +44 -28
  48. package/dist/ui/YLabel.vue.js +82 -85
  49. package/package.json +2 -2
  50. package/src/BandSeries.vue +92 -0
  51. package/src/BarSeries.vue +13 -6
  52. package/src/CandlestickSeries.vue +9 -5
  53. package/src/ChartContainer.vue +20 -0
  54. package/src/LineSeries.vue +13 -6
  55. package/src/composables.ts +23 -4
  56. package/src/index.ts +16 -1
  57. package/src/ui/Crosshair.vue +41 -1
  58. package/src/ui/InfoBar.vue +22 -2
  59. package/src/ui/Marker.vue +5 -1
  60. package/src/ui/Navigator.vue +2 -1
  61. package/src/ui/ReferenceLine.vue +5 -1
  62. package/src/ui/Tooltip.vue +43 -6
  63. package/src/ui/{TimeAxis.vue → XAxis.vue} +18 -5
  64. package/src/ui/YAxis.vue +66 -12
  65. package/src/ui/YLabel.vue +37 -18
  66. package/dist/ui/TimeAxis.vue.js +0 -44
  67. package/dist/ui/TimeAxis.vue2.js +0 -4
@@ -2,7 +2,7 @@ import { hexToRgba as h } from "../../utils/color.js";
2
2
  import { fillRoundedRect as d, tracePath as n } from "./canvas-path.js";
3
3
  const c = 0.25, u = (e, t) => {
4
4
  n(e, { points: t.points, kind: "straight", settledOnly: !1 });
5
- }, x = (e, t) => {
5
+ }, m = (e, t) => {
6
6
  n(e, { points: t.points, kind: "stepped", settledOnly: !1 });
7
7
  }, y = (e, t) => {
8
8
  n(e, { points: t.points, kind: "smooth", settledOnly: t.grew });
@@ -16,7 +16,7 @@ const c = 0.25, u = (e, t) => {
16
16
  radius: l,
17
17
  corners: r
18
18
  });
19
- }, m = (e, t) => {
19
+ }, x = (e, t) => {
20
20
  const { ctx: i } = e, { geom: s, fillStyle: o, corners: r, radius: l } = t;
21
21
  i.fillStyle = o, d(i, {
22
22
  x: s.x,
@@ -29,8 +29,8 @@ const c = 0.25, u = (e, t) => {
29
29
  };
30
30
  export {
31
31
  f as roundedBarFill,
32
- m as roundedCandleFill,
32
+ x as roundedCandleFill,
33
33
  y as smoothCurve,
34
- x as steppedCurve,
34
+ m as steppedCurve,
35
35
  u as straightCurve
36
36
  };
@@ -1,79 +1,91 @@
1
- function p(t, u) {
2
- const { x: o, y: i, width: r, height: c, corners: e } = u, n = Math.min(u.radius, r / 2, c / 2);
3
- if (!(e.tl || e.tr || e.br || e.bl) || n < 1 || r <= 0 || c <= 0) {
4
- t.fillRect(o, i, r, c);
1
+ function b(n, l) {
2
+ const { x: t, y: r, width: o, height: c, corners: i } = l, e = Math.min(l.radius, o / 2, c / 2);
3
+ if (!(i.tl || i.tr || i.br || i.bl) || e < 1 || o <= 0 || c <= 0) {
4
+ n.fillRect(t, r, o, c);
5
5
  return;
6
6
  }
7
- const s = e.tl ? n : 0, x = e.tr ? n : 0, l = e.br ? n : 0, y = e.bl ? n : 0, f = o + r, h = i + c;
8
- t.beginPath(), t.moveTo(o + s, i), t.lineTo(f - x, i), x > 0 && t.arcTo(f, i, f, i + x, x), t.lineTo(f, h - l), l > 0 && t.arcTo(f, h, f - l, h, l), t.lineTo(o + y, h), y > 0 && t.arcTo(o, h, o, h - y, y), t.lineTo(o, i + s), s > 0 && t.arcTo(o, i, o + s, i, s), t.closePath(), t.fill();
7
+ const s = i.tl ? e : 0, y = i.tr ? e : 0, u = i.br ? e : 0, x = i.bl ? e : 0, f = t + o, p = r + c;
8
+ n.beginPath(), n.moveTo(t + s, r), n.lineTo(f - y, r), y > 0 && n.arcTo(f, r, f, r + y, y), n.lineTo(f, p - u), u > 0 && n.arcTo(f, p, f - u, p, u), n.lineTo(t + x, p), x > 0 && n.arcTo(t, p, t, p - x, x), n.lineTo(t, r + s), s > 0 && n.arcTo(t, r, t + s, r, s), n.closePath(), n.fill();
9
9
  }
10
- function a(t, u, o) {
11
- const i = [];
12
- if (t.length < 2) return i;
13
- if (u === "stepped") {
14
- for (let r = 1; r < t.length; r++)
15
- i.push({ kind: "line", x: t[r].x, y: t[r - 1].y }), i.push({ kind: "line", x: t[r].x, y: t[r].y });
16
- return i;
10
+ function a(n, l, t) {
11
+ const r = [];
12
+ if (n.length < 2) return r;
13
+ if (l === "stepped") {
14
+ for (let o = 1; o < n.length; o++)
15
+ r.push({ kind: "line", x: n[o].x, y: n[o - 1].y }), r.push({ kind: "line", x: n[o].x, y: n[o].y });
16
+ return r;
17
17
  }
18
- if (u === "straight" || t.length === 2) {
19
- for (let r = 1; r < t.length; r++)
20
- i.push({ kind: "line", x: t[r].x, y: t[r].y });
21
- return i;
18
+ if (l === "straight" || n.length === 2) {
19
+ for (let o = 1; o < n.length; o++)
20
+ r.push({ kind: "line", x: n[o].x, y: n[o].y });
21
+ return r;
22
22
  }
23
- return b(t, o);
23
+ return h(n, t);
24
24
  }
25
- function d(t, u) {
26
- const { ctx: o } = t, { points: i } = u;
27
- if (i.length === 0) return;
28
- o.moveTo(i[0].x, i[0].y);
29
- const r = a(i, u.kind, u.settledOnly);
30
- for (const c of r)
31
- c.kind === "line" ? o.lineTo(c.x, c.y) : o.bezierCurveTo(c.cp1x, c.cp1y, c.cp2x, c.cp2y, c.x, c.y);
25
+ function d(n, l) {
26
+ const { ctx: t } = n, { points: r } = l;
27
+ if (r.length === 0) return;
28
+ t.moveTo(r[0].x, r[0].y);
29
+ const o = a(r, l.kind, l.settledOnly);
30
+ for (const c of o)
31
+ c.kind === "line" ? t.lineTo(c.x, c.y) : t.bezierCurveTo(c.cp1x, c.cp1y, c.cp2x, c.cp2y, c.x, c.y);
32
32
  }
33
- function b(t, u) {
34
- const o = t.length, i = new Array(o - 1);
35
- for (let e = 0; e < o - 1; e++) {
36
- const n = t[e + 1].x - t[e].x;
37
- i[e] = n > 0 ? (t[e + 1].y - t[e].y) / n : Number.NaN;
33
+ function h(n, l) {
34
+ const t = n.length, r = new Array(t - 1);
35
+ for (let i = 0; i < t - 1; i++) {
36
+ const e = n[i + 1].x - n[i].x;
37
+ r[i] = e > 0 ? (n[i + 1].y - n[i].y) / e : Number.NaN;
38
38
  }
39
- const r = new Array(o);
40
- r[0] = Number.isFinite(i[0]) ? i[0] : 0;
41
- for (let e = 1; e < o - 1; e++) {
42
- const n = i[e - 1], s = i[e];
43
- !Number.isFinite(n) || !Number.isFinite(s) ? r[e] = Number.isFinite(n) ? n : Number.isFinite(s) ? s : 0 : n * s <= 0 ? r[e] = 0 : r[e] = (n + s) / 2;
39
+ const o = new Array(t);
40
+ o[0] = Number.isFinite(r[0]) ? r[0] : 0;
41
+ for (let i = 1; i < t - 1; i++) {
42
+ const e = r[i - 1], s = r[i];
43
+ !Number.isFinite(e) || !Number.isFinite(s) ? o[i] = Number.isFinite(e) ? e : Number.isFinite(s) ? s : 0 : e * s <= 0 ? o[i] = 0 : o[i] = (e + s) / 2;
44
44
  }
45
- r[o - 1] = Number.isFinite(i[o - 2]) ? i[o - 2] : 0;
46
- for (let e = 0; e < o - 1; e++) {
47
- const n = i[e];
48
- if (!Number.isFinite(n) || n === 0) continue;
49
- const s = r[e] / n, x = r[e + 1] / n, l = s * s + x * x;
50
- if (l > 9) {
51
- const y = 3 / Math.sqrt(l);
52
- r[e] = y * s * n, r[e + 1] = y * x * n;
45
+ o[t - 1] = Number.isFinite(r[t - 2]) ? r[t - 2] : 0;
46
+ for (let i = 0; i < t - 1; i++) {
47
+ const e = r[i];
48
+ if (!Number.isFinite(e) || e === 0) continue;
49
+ const s = o[i] / e, y = o[i + 1] / e, u = s * s + y * y;
50
+ if (u > 9) {
51
+ const x = 3 / Math.sqrt(u);
52
+ o[i] = x * s * e, o[i + 1] = x * y * e;
53
53
  }
54
54
  }
55
55
  const c = [];
56
- for (let e = 0; e < o - 1; e++) {
57
- const n = t[e], s = t[e + 1], x = e === o - 2;
58
- if (!Number.isFinite(i[e]) || u && x) {
56
+ for (let i = 0; i < t - 1; i++) {
57
+ const e = n[i], s = n[i + 1], y = i === t - 2;
58
+ if (!Number.isFinite(r[i]) || l && y) {
59
59
  c.push({ kind: "line", x: s.x, y: s.y });
60
60
  continue;
61
61
  }
62
- const l = s.x - n.x;
62
+ const u = s.x - e.x;
63
63
  c.push({
64
64
  kind: "bezier",
65
- cp1x: n.x + l / 3,
66
- cp1y: n.y + r[e] * l / 3,
67
- cp2x: s.x - l / 3,
68
- cp2y: s.y - r[e + 1] * l / 3,
65
+ cp1x: e.x + u / 3,
66
+ cp1y: e.y + o[i] * u / 3,
67
+ cp2x: s.x - u / 3,
68
+ cp2y: s.y - o[i + 1] * u / 3,
69
69
  x: s.x,
70
70
  y: s.y
71
71
  });
72
72
  }
73
73
  return c;
74
74
  }
75
+ function T(n, l) {
76
+ for (const t of l)
77
+ t.kind === "line" ? n.lineTo(t.x, t.y) : n.bezierCurveTo(t.cp1x, t.cp1y, t.cp2x, t.cp2y, t.x, t.y);
78
+ }
79
+ function m(n, l, t) {
80
+ for (let r = t.length - 1; r >= 0; r--) {
81
+ const o = t[r], c = r > 0 ? t[r - 1] : l[0];
82
+ o.kind === "line" ? n.lineTo(c.x, c.y) : n.bezierCurveTo(o.cp2x, o.cp2y, o.cp1x, o.cp1y, c.x, c.y);
83
+ }
84
+ }
75
85
  export {
76
86
  a as buildCurveSegments,
77
- p as fillRoundedRect,
87
+ b as fillRoundedRect,
88
+ T as replaySegmentsForward,
89
+ m as replaySegmentsReversed,
78
90
  d as tracePath
79
91
  };
@@ -1,12 +1,13 @@
1
- import { BarSeriesDef as r } from "./bar.js";
2
- import { CandlestickSeriesDef as i } from "./candlestick.js";
1
+ import { BandSeriesDef as r } from "./band.js";
2
+ import { BarSeriesDef as i } from "./bar.js";
3
+ import { CandlestickSeriesDef as t } from "./candlestick.js";
3
4
  import { registerSeriesDefinition as e } from "./definition.js";
4
- import { HeatmapSeriesDef as t } from "./heatmap.js";
5
- import { LineSeriesDef as s } from "./line.js";
6
- import { PieSeriesDef as o } from "./pie.js";
7
- function D() {
8
- e(i), e(s), e(r), e(o), e(t);
5
+ import { HeatmapSeriesDef as s } from "./heatmap.js";
6
+ import { LineSeriesDef as o } from "./line.js";
7
+ import { PieSeriesDef as f } from "./pie.js";
8
+ function B() {
9
+ e(t), e(o), e(i), e(r), e(f), e(s);
9
10
  }
10
11
  export {
11
- D as registerBuiltinSeries
12
+ B as registerBuiltinSeries
12
13
  };
@@ -1,24 +1,26 @@
1
+ import { pointValue as m } from "./utils/point.js";
1
2
  const f = /* @__PURE__ */ new WeakMap();
2
- function b(e, r) {
3
+ function y(e, r) {
3
4
  return f.get(e)?.get(r);
4
5
  }
5
- function g(e, r, o) {
6
- let n = f.get(e);
7
- n || (n = /* @__PURE__ */ new Map(), f.set(e, n)), n.set(r, o);
6
+ function I(e, r, n) {
7
+ let o = f.get(e);
8
+ o || (o = /* @__PURE__ */ new Map(), f.set(e, o)), o.set(r, n);
8
9
  }
9
- function y(e) {
10
- return "close" in e ? e.close : e.value;
10
+ function g(e) {
11
+ const r = e.low !== void 0 && e.high !== void 0 ? { time: e.time, low: e.low, high: e.high } : { time: e.time, value: e.value };
12
+ return e.x !== void 0 && (r.x = e.x), r;
11
13
  }
12
- function I(e, r) {
14
+ function h(e, r) {
13
15
  if (r === "none" || e.length <= 1) return e;
14
- const o = [...e];
15
- return o.sort((n, s) => {
16
- const i = y(n.data), l = y(s.data);
17
- return r === "asc" ? i - l : l - i;
18
- }), o;
16
+ const n = [...e];
17
+ return n.sort((o, a) => {
18
+ const s = m(o.data), i = m(a.data);
19
+ return r === "asc" ? s - i : i - s;
20
+ }), n;
19
21
  }
20
22
  function u(e) {
21
- const r = Object.freeze({ ...e.data }), o = {
23
+ const r = Object.freeze({ ...e.data }), n = {
22
24
  id: e.id,
23
25
  seriesId: e.seriesId,
24
26
  layerIndex: e.layerIndex,
@@ -26,33 +28,33 @@ function u(e) {
26
28
  data: r,
27
29
  color: e.color
28
30
  };
29
- return Object.freeze(o);
31
+ return Object.freeze(n);
30
32
  }
31
- function m(e, r) {
32
- const o = r.sort ?? "none", n = e.getOverlayVersion(), s = b(e, r.cacheKey);
33
- if (s && s.version === n && s.time === r.time && s.sort === o)
34
- return s.data;
35
- const i = [];
33
+ function S(e, r) {
34
+ const n = r.sort ?? "none", o = e.getOverlayVersion(), a = y(e, r.cacheKey);
35
+ if (a && a.version === o && a.time === r.time && a.sort === n)
36
+ return a.data;
37
+ const s = [];
36
38
  for (const t of e.getSeriesIds()) {
37
39
  if (!e.isSeriesVisible(t)) continue;
38
40
  if (e.getSeriesLayers(t) !== null) {
39
41
  const d = e.getLayerSnapshots(t, r.time);
40
42
  if (!d) continue;
41
- for (const a of d)
42
- i.push(
43
+ for (const l of d)
44
+ s.push(
43
45
  u({
44
- id: `${t}_layer${a.layerIndex}`,
46
+ id: `${t}_layer${l.layerIndex}`,
45
47
  seriesId: t,
46
- layerIndex: a.layerIndex,
47
- label: e.getLayerLabel(t, a.layerIndex),
48
- data: { time: a.time, value: a.value },
49
- color: a.color
48
+ layerIndex: l.layerIndex,
49
+ label: e.getLayerLabel(t, l.layerIndex),
50
+ data: g(l),
51
+ color: l.color
50
52
  })
51
53
  );
52
54
  continue;
53
55
  }
54
56
  const c = e.getDataAtTime(t, r.time);
55
- c && i.push(
57
+ c && s.push(
56
58
  u({
57
59
  id: t,
58
60
  seriesId: t,
@@ -62,33 +64,43 @@ function m(e, r) {
62
64
  })
63
65
  );
64
66
  }
65
- const l = Object.freeze(I(i, o));
66
- return g(e, r.cacheKey, { version: n, time: r.time, sort: o, data: l }), l;
67
+ const i = Object.freeze(h(s, n));
68
+ return I(e, r.cacheKey, { version: o, time: r.time, sort: n, data: i }), i;
67
69
  }
68
- function S(e, r) {
69
- const o = r.sort ?? "none", n = e.getOverlayVersion(), s = b(e, r.cacheKey);
70
- if (s && s.version === n && s.time === null && s.sort === o)
71
- return s.data;
72
- const i = [];
70
+ function p(e, r) {
71
+ const { time: n, snapshots: o, interval: a } = r;
72
+ if (e.timeScale.getType() !== "numeric") return e.timeScale.formatX(n, a);
73
+ let s = n, i = Number.POSITIVE_INFINITY;
74
+ for (const t of o) {
75
+ const c = Math.abs(t.data.time - n), d = c === i && t.data.time <= s;
76
+ c > i || d || (i = c, s = t.data.time);
77
+ }
78
+ return e.timeScale.formatPointX(s, a);
79
+ }
80
+ function x(e, r) {
81
+ const n = r.sort ?? "none", o = e.getOverlayVersion(), a = y(e, r.cacheKey);
82
+ if (a && a.version === o && a.time === null && a.sort === n)
83
+ return a.data;
84
+ const s = [];
73
85
  for (const t of e.getSeriesIds()) {
74
86
  if (!e.isSeriesVisible(t)) continue;
75
87
  const c = e.getLayerLastSnapshots(t);
76
88
  if (c) {
77
- for (const a of c)
78
- i.push(
89
+ for (const l of c)
90
+ s.push(
79
91
  u({
80
- id: `${t}_layer${a.layerIndex}`,
92
+ id: `${t}_layer${l.layerIndex}`,
81
93
  seriesId: t,
82
- layerIndex: a.layerIndex,
83
- label: e.getLayerLabel(t, a.layerIndex),
84
- data: { time: a.time, value: a.value },
85
- color: a.color
94
+ layerIndex: l.layerIndex,
95
+ label: e.getLayerLabel(t, l.layerIndex),
96
+ data: g(l),
97
+ color: l.color
86
98
  })
87
99
  );
88
100
  continue;
89
101
  }
90
102
  const d = e.getLastData(t);
91
- d && i.push(
103
+ d && s.push(
92
104
  u({
93
105
  id: t,
94
106
  seriesId: t,
@@ -98,10 +110,11 @@ function S(e, r) {
98
110
  })
99
111
  );
100
112
  }
101
- const l = Object.freeze(I(i, o));
102
- return g(e, r.cacheKey, { version: n, time: null, sort: o, data: l }), l;
113
+ const i = Object.freeze(h(s, n));
114
+ return I(e, r.cacheKey, { version: o, time: null, sort: n, data: i }), i;
103
115
  }
104
116
  export {
105
- m as buildHoverSnapshots,
106
- S as buildLastSnapshots
117
+ S as buildHoverSnapshots,
118
+ x as buildLastSnapshots,
119
+ p as formatHeaderX
107
120
  };
@@ -0,0 +1,10 @@
1
+ function i(n) {
2
+ return !("close" in n) && "high" in n;
3
+ }
4
+ function o(n) {
5
+ return "close" in n ? n.close : i(n) ? (n.low + n.high) / 2 : n.value;
6
+ }
7
+ export {
8
+ i as isBandPoint,
9
+ o as pointValue
10
+ };