@gearbox-protocol/ui-kit 3.13.1 → 3.14.0-next.2
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.
- package/dist/cjs/components/composites/strategies-table/components/rewards-tooltip/tooltip-content.cjs +1 -1
- package/dist/cjs/components/graph/graph.cjs +1 -1
- package/dist/cjs/components/layout/main-aside-layout/main-aside-layout.cjs +1 -1
- package/dist/cjs/components/trading-view/trading-view.cjs +1 -1
- package/dist/esm/components/composites/strategies-table/components/rewards-tooltip/tooltip-content.js +131 -122
- package/dist/esm/components/graph/graph.js +339 -293
- package/dist/esm/components/layout/main-aside-layout/main-aside-layout.js +70 -22
- package/dist/esm/components/trading-view/trading-view.js +58 -58
- package/dist/globals.css +1 -1
- package/dist/types/components/graph/graph.d.ts +8 -1
- package/dist/types/components/layout/main-aside-layout/main-aside-layout.d.ts +46 -5
- package/dist/types/components/trading-view/trading-view.d.ts +7 -0
- package/package.json +3 -3
- package/src/styles/base.css +4 -2
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { createChart as
|
|
3
|
-
import * as
|
|
4
|
-
import { useRef as
|
|
5
|
-
import { useIsMobile as
|
|
6
|
-
import { cn as
|
|
7
|
-
import { resolveCSSColor as
|
|
8
|
-
import { getDefaultOptions as
|
|
9
|
-
import { getXFormatters as
|
|
10
|
-
import { GraphCurrentValue as
|
|
11
|
-
import { GraphTooltip as
|
|
12
|
-
import { VertLine as
|
|
13
|
-
function
|
|
14
|
-
const
|
|
1
|
+
import { jsxs as K, jsx as p } from "react/jsx-runtime";
|
|
2
|
+
import { createChart as We, CrosshairMode as Ye, AreaSeries as Ge } from "lightweight-charts";
|
|
3
|
+
import * as fe from "react";
|
|
4
|
+
import { useRef as L, useState as de, useEffect as $ } from "react";
|
|
5
|
+
import { useIsMobile as Be } from "../../hooks/use-media-query.js";
|
|
6
|
+
import { cn as he } from "../../utils/cn.js";
|
|
7
|
+
import { resolveCSSColor as Me, generateColorsFromBase as ee, hslToHex as je } from "../../utils/colors.js";
|
|
8
|
+
import { getDefaultOptions as Pe, getDefaultSeries as He, getDefaultVerticalLine as _e } from "./default-config.js";
|
|
9
|
+
import { getXFormatters as Te, createAdaptiveYAxisFormatter as Xe, formatExactValue as ge } from "./formatters.js";
|
|
10
|
+
import { GraphCurrentValue as qe } from "./graph-current-value.js";
|
|
11
|
+
import { GraphTooltip as Ke } from "./graph-tooltip.js";
|
|
12
|
+
import { VertLine as Je } from "./plugins/vertical-line.js";
|
|
13
|
+
function Qe(t, v, u) {
|
|
14
|
+
const D = t.labelText ?? "", g = t.value, N = g === void 0 ? "" : typeof g == "number" ? v === "$" ? `$${ge(g, void 0, u)}` : v === "%" ? `${ge(g, void 0, u)}%` : ge(
|
|
15
15
|
g,
|
|
16
|
-
|
|
16
|
+
v !== "none" && v !== "%" && v !== "$" ? v : void 0,
|
|
17
17
|
u
|
|
18
18
|
) : String(g);
|
|
19
|
-
return { labelText:
|
|
19
|
+
return { labelText: D, valueStr: N };
|
|
20
20
|
}
|
|
21
|
-
function
|
|
22
|
-
for (let u =
|
|
23
|
-
if (Number(
|
|
24
|
-
return
|
|
21
|
+
function Ze(t, v) {
|
|
22
|
+
for (let u = t.length - 1; u >= 0; u--)
|
|
23
|
+
if (Number(t[u].time) <= v)
|
|
24
|
+
return t[u].value;
|
|
25
25
|
return 0;
|
|
26
26
|
}
|
|
27
|
-
const
|
|
27
|
+
const me = [
|
|
28
28
|
// 0 green (emerald)
|
|
29
29
|
{
|
|
30
30
|
line: "#02c39a",
|
|
@@ -139,99 +139,145 @@ const gt = [
|
|
|
139
139
|
top: "rgba(71, 85, 105, 0.56)",
|
|
140
140
|
bottom: "rgba(71, 85, 105, 0.04)"
|
|
141
141
|
}
|
|
142
|
-
],
|
|
143
|
-
function
|
|
144
|
-
if (
|
|
145
|
-
return
|
|
146
|
-
const u = (
|
|
147
|
-
return { line:
|
|
142
|
+
], Ue = 137.5;
|
|
143
|
+
function Le(t) {
|
|
144
|
+
if (t < me.length)
|
|
145
|
+
return me[t];
|
|
146
|
+
const u = (t - me.length) * Ue % 360, D = je(u, 70, 50), { topColor: g, bottomColor: N } = ee(D);
|
|
147
|
+
return { line: D, top: g, bottom: N };
|
|
148
148
|
}
|
|
149
|
-
function
|
|
150
|
-
series:
|
|
151
|
-
className:
|
|
149
|
+
function ht({
|
|
150
|
+
series: t,
|
|
151
|
+
className: v,
|
|
152
152
|
showLegend: u = !1,
|
|
153
|
-
onUnselectSeries:
|
|
153
|
+
onUnselectSeries: D,
|
|
154
154
|
xMeasureUnit: g = "time",
|
|
155
155
|
yMeasureUnit: N = "token",
|
|
156
|
-
optionsOverrides:
|
|
156
|
+
optionsOverrides: _,
|
|
157
157
|
verticalLineOptions: x,
|
|
158
|
-
currentValueDecimals:
|
|
159
|
-
useSharedPriceScale:
|
|
160
|
-
showCurrentValue:
|
|
161
|
-
graphTitle:
|
|
162
|
-
yScaleMin:
|
|
163
|
-
yScaleMinMultiple:
|
|
164
|
-
visibleTimeFrom:
|
|
158
|
+
currentValueDecimals: te,
|
|
159
|
+
useSharedPriceScale: M = !1,
|
|
160
|
+
showCurrentValue: De = !0,
|
|
161
|
+
graphTitle: oe,
|
|
162
|
+
yScaleMin: be,
|
|
163
|
+
yScaleMinMultiple: pe,
|
|
164
|
+
visibleTimeFrom: E,
|
|
165
|
+
disableZoom: J = !1
|
|
165
166
|
}) {
|
|
166
|
-
const
|
|
167
|
+
const R = L(null), w = L(/* @__PURE__ */ new Map()), re = L(!1), ve = L(!0), ne = L(
|
|
167
168
|
null
|
|
168
|
-
),
|
|
169
|
-
if (
|
|
170
|
-
const
|
|
171
|
-
if (
|
|
172
|
-
return
|
|
169
|
+
), Ie = L(null), O = L(null), ae = L(null), Q = L(null), V = Be(), I = fe.useMemo(() => t.flatMap((e) => e.data), [t]), ze = fe.useMemo(() => {
|
|
170
|
+
if (t.length > 0) {
|
|
171
|
+
const e = t[t.length - 1];
|
|
172
|
+
if (e.data.length > 0)
|
|
173
|
+
return e.data[e.data.length - 1];
|
|
173
174
|
}
|
|
174
|
-
}, [
|
|
175
|
-
if (!
|
|
176
|
-
const
|
|
177
|
-
for (const a of
|
|
178
|
-
a.data.length > 0 &&
|
|
179
|
-
return
|
|
180
|
-
}), [
|
|
181
|
-
|
|
182
|
-
const
|
|
175
|
+
}, [t]), [Ce, le] = de(() => {
|
|
176
|
+
if (!ze) return;
|
|
177
|
+
const e = /* @__PURE__ */ new Map();
|
|
178
|
+
for (const a of t)
|
|
179
|
+
a.data.length > 0 && e.set(a.label, a.data[a.data.length - 1]);
|
|
180
|
+
return e;
|
|
181
|
+
}), [xe, z] = de(null), [Se, Ne] = de([]);
|
|
182
|
+
$(() => {
|
|
183
|
+
const e = () => {
|
|
183
184
|
try {
|
|
184
|
-
if (
|
|
185
|
-
const l =
|
|
186
|
-
|
|
185
|
+
if (R.current && O.current) {
|
|
186
|
+
const l = O.current.clientWidth, i = O.current.clientHeight;
|
|
187
|
+
R.current.resize(l, i);
|
|
187
188
|
}
|
|
188
189
|
} catch {
|
|
189
190
|
}
|
|
190
|
-
}, a =
|
|
191
|
-
return
|
|
192
|
-
a && r?.unobserve(a), r?.disconnect(),
|
|
191
|
+
}, a = O.current, r = a ? new ResizeObserver(e) : null;
|
|
192
|
+
return Q.current = r, a && r?.observe(a), () => {
|
|
193
|
+
a && r?.unobserve(a), r?.disconnect(), Q.current = null;
|
|
193
194
|
};
|
|
194
|
-
}, []),
|
|
195
|
-
if (!
|
|
196
|
-
const
|
|
195
|
+
}, []), $(() => {
|
|
196
|
+
if (!ae.current || re.current) return;
|
|
197
|
+
const e = Pe(), a = Me(
|
|
197
198
|
"hsl(var(--foreground))",
|
|
198
199
|
"rgb(0, 0, 0)"
|
|
199
|
-
), r =
|
|
200
|
-
|
|
200
|
+
), r = J ? {
|
|
201
|
+
handleScale: {
|
|
202
|
+
mouseWheel: !1,
|
|
203
|
+
pinch: !1,
|
|
204
|
+
axisPressedMouseMove: !1,
|
|
205
|
+
axisDoubleClickReset: !1
|
|
206
|
+
},
|
|
207
|
+
handleScroll: {
|
|
208
|
+
mouseWheel: !1,
|
|
209
|
+
pressedMouseMove: !1,
|
|
210
|
+
horzTouchDrag: !1,
|
|
211
|
+
vertTouchDrag: !1
|
|
212
|
+
}
|
|
213
|
+
} : {}, l = We(ae.current, {
|
|
214
|
+
...e,
|
|
201
215
|
rightPriceScale: {
|
|
202
|
-
...
|
|
203
|
-
visible: !
|
|
216
|
+
...e.rightPriceScale || {},
|
|
217
|
+
visible: !V,
|
|
204
218
|
textColor: a
|
|
205
219
|
},
|
|
206
|
-
...
|
|
220
|
+
...V && {
|
|
207
221
|
crosshair: {
|
|
208
|
-
...
|
|
209
|
-
mode:
|
|
222
|
+
...e.crosshair,
|
|
223
|
+
mode: Ye.Magnet
|
|
210
224
|
}
|
|
211
225
|
},
|
|
212
|
-
...
|
|
226
|
+
...r,
|
|
227
|
+
..._
|
|
213
228
|
});
|
|
214
|
-
return
|
|
215
|
-
|
|
229
|
+
return R.current = l, re.current = !0, () => {
|
|
230
|
+
Q.current?.disconnect(), Q.current = null, l.remove(), R.current = null, re.current = !1, w.current.clear();
|
|
216
231
|
};
|
|
217
|
-
}, [
|
|
218
|
-
const
|
|
219
|
-
|
|
220
|
-
|
|
232
|
+
}, [V, _, J]), $(() => {
|
|
233
|
+
const e = R.current;
|
|
234
|
+
e && e.applyOptions(
|
|
235
|
+
J ? {
|
|
236
|
+
handleScale: {
|
|
237
|
+
mouseWheel: !1,
|
|
238
|
+
pinch: !1,
|
|
239
|
+
axisPressedMouseMove: !1,
|
|
240
|
+
axisDoubleClickReset: !1
|
|
241
|
+
},
|
|
242
|
+
handleScroll: {
|
|
243
|
+
mouseWheel: !1,
|
|
244
|
+
pressedMouseMove: !1,
|
|
245
|
+
horzTouchDrag: !1,
|
|
246
|
+
vertTouchDrag: !1
|
|
247
|
+
}
|
|
248
|
+
} : {
|
|
249
|
+
handleScale: {
|
|
250
|
+
mouseWheel: !0,
|
|
251
|
+
pinch: !0,
|
|
252
|
+
axisPressedMouseMove: !0,
|
|
253
|
+
axisDoubleClickReset: !0
|
|
254
|
+
},
|
|
255
|
+
handleScroll: {
|
|
256
|
+
mouseWheel: !0,
|
|
257
|
+
pressedMouseMove: !0,
|
|
258
|
+
horzTouchDrag: !0,
|
|
259
|
+
vertTouchDrag: !0
|
|
260
|
+
}
|
|
261
|
+
}
|
|
262
|
+
);
|
|
263
|
+
}, [J]), $(() => {
|
|
264
|
+
const e = R.current;
|
|
265
|
+
if (!e || t.length === 0) return;
|
|
266
|
+
const r = t.filter((o) => o.data.length > 0).length <= 1 ? be : pe, l = g === "time" ? Te(g, I) : Te(g), i = I.map((o) => o.value), {
|
|
221
267
|
formatter: c,
|
|
222
268
|
tickmarksFormatter: f,
|
|
223
|
-
updateVisibleRange:
|
|
269
|
+
updateVisibleRange: P,
|
|
224
270
|
updateLastValues: m
|
|
225
|
-
} =
|
|
271
|
+
} = Xe(i, N, {
|
|
226
272
|
yScaleMin: r
|
|
227
273
|
});
|
|
228
|
-
|
|
229
|
-
const
|
|
230
|
-
m(
|
|
231
|
-
const
|
|
232
|
-
|
|
274
|
+
ne.current = P, Ie.current = m;
|
|
275
|
+
const T = t.filter((o) => o.data.length > 0).map((o) => o.data[o.data.length - 1].value);
|
|
276
|
+
m(T);
|
|
277
|
+
const k = Pe();
|
|
278
|
+
e.applyOptions({
|
|
233
279
|
localization: {
|
|
234
|
-
...
|
|
280
|
+
...k.localization || {},
|
|
235
281
|
// biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
|
|
236
282
|
timeFormatter: (o) => (
|
|
237
283
|
// biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
|
|
@@ -239,22 +285,22 @@ function me({
|
|
|
239
285
|
)
|
|
240
286
|
},
|
|
241
287
|
timeScale: {
|
|
242
|
-
...
|
|
288
|
+
...k.timeScale || {},
|
|
243
289
|
// biome-ignore lint/suspicious/noExplicitAny: External library type compatibility
|
|
244
290
|
tickMarkFormatter: l.tickMarkFormatter,
|
|
245
291
|
minBarSpacing: 0
|
|
246
292
|
}
|
|
247
293
|
});
|
|
248
|
-
const d = (
|
|
294
|
+
const d = (I.length > 0 ? Math.min(...I.map((o) => o.value)) : 0) < 0, S = I.some((o) => o.value === 0), h = !d && S, C = t.length > 1 && !M, b = t.length > 1 && !M || V, A = Me(
|
|
249
295
|
"hsl(var(--foreground))",
|
|
250
296
|
"rgb(0, 0, 0)"
|
|
251
297
|
);
|
|
252
|
-
|
|
298
|
+
e.applyOptions({
|
|
253
299
|
rightPriceScale: {
|
|
254
|
-
...
|
|
255
|
-
visible: !
|
|
256
|
-
textColor:
|
|
257
|
-
...
|
|
300
|
+
...k.rightPriceScale || {},
|
|
301
|
+
visible: !b,
|
|
302
|
+
textColor: A,
|
|
303
|
+
...h && {
|
|
258
304
|
scaleMargins: {
|
|
259
305
|
top: 0.3,
|
|
260
306
|
bottom: 0
|
|
@@ -262,85 +308,85 @@ function me({
|
|
|
262
308
|
}
|
|
263
309
|
}
|
|
264
310
|
});
|
|
265
|
-
const X = new Set(w.current.keys()),
|
|
311
|
+
const X = new Set(w.current.keys()), se = new Set(t.map((o) => o.label));
|
|
266
312
|
for (const o of X)
|
|
267
|
-
if (!
|
|
313
|
+
if (!se.has(o)) {
|
|
268
314
|
const n = w.current.get(o);
|
|
269
|
-
n && (
|
|
315
|
+
n && (e.removeSeries(n), w.current.delete(o));
|
|
270
316
|
}
|
|
271
|
-
const
|
|
272
|
-
let
|
|
273
|
-
for (let o = 0; o <
|
|
274
|
-
const n =
|
|
275
|
-
let
|
|
317
|
+
const Ae = He(), ie = [];
|
|
318
|
+
let U = 0;
|
|
319
|
+
for (let o = 0; o < t.length; o++) {
|
|
320
|
+
const n = t[o], q = Le(o), W = n.lineColor ?? n.color ?? q.line;
|
|
321
|
+
let F, Y;
|
|
276
322
|
if (n.lineColor ?? n.color)
|
|
277
323
|
if (n.topColor && n.bottomColor)
|
|
278
|
-
|
|
324
|
+
F = n.topColor, Y = n.bottomColor;
|
|
279
325
|
else if (n.topColor) {
|
|
280
|
-
const
|
|
281
|
-
|
|
326
|
+
const s = ee(W);
|
|
327
|
+
F = n.topColor, Y = s.bottomColor;
|
|
282
328
|
} else if (n.bottomColor)
|
|
283
|
-
|
|
329
|
+
F = ee(W).topColor, Y = n.bottomColor;
|
|
284
330
|
else {
|
|
285
|
-
const
|
|
286
|
-
|
|
331
|
+
const s = ee(W);
|
|
332
|
+
F = s.topColor, Y = s.bottomColor;
|
|
287
333
|
}
|
|
288
334
|
else
|
|
289
|
-
|
|
335
|
+
F = n.topColor || q.top, Y = n.bottomColor || q.bottom;
|
|
290
336
|
if (n.data.length === 0) {
|
|
291
|
-
const
|
|
292
|
-
|
|
337
|
+
const s = w.current.get(n.label);
|
|
338
|
+
s && (e.removeSeries(s), w.current.delete(n.label));
|
|
293
339
|
continue;
|
|
294
340
|
}
|
|
295
|
-
const
|
|
296
|
-
|
|
297
|
-
priceScaleId:
|
|
298
|
-
shouldPreventNegativeAxis:
|
|
299
|
-
seriesIndex:
|
|
341
|
+
const Fe = (n.data.length > 0 ? Math.min(...n.data.map((s) => s.value)) : 0) < 0, $e = n.data.some((s) => s.value === 0), Ee = !Fe && $e, Re = M || !C || U === 0 ? "right" : `scale-${U}`;
|
|
342
|
+
C && ie.push({
|
|
343
|
+
priceScaleId: Re || "right",
|
|
344
|
+
shouldPreventNegativeAxis: Ee,
|
|
345
|
+
seriesIndex: U
|
|
300
346
|
});
|
|
301
|
-
const
|
|
302
|
-
lineColor:
|
|
303
|
-
topColor:
|
|
304
|
-
bottomColor:
|
|
305
|
-
priceScaleId:
|
|
347
|
+
const Ve = (M || !C) && r !== void 0 && typeof r == "number", ke = {
|
|
348
|
+
lineColor: W,
|
|
349
|
+
topColor: F,
|
|
350
|
+
bottomColor: Y,
|
|
351
|
+
priceScaleId: Re,
|
|
306
352
|
priceFormat: {
|
|
307
353
|
type: "custom",
|
|
308
354
|
minMove: 0.01,
|
|
309
|
-
formatter:
|
|
310
|
-
|
|
355
|
+
formatter: Ve && typeof r == "number" ? (s) => c(
|
|
356
|
+
s < r ? r : s
|
|
311
357
|
) : c,
|
|
312
358
|
tickmarksFormatter: f
|
|
313
359
|
},
|
|
314
|
-
autoscaleInfoProvider: (
|
|
315
|
-
if (!
|
|
316
|
-
const
|
|
317
|
-
if (
|
|
318
|
-
const
|
|
319
|
-
|
|
360
|
+
autoscaleInfoProvider: (s) => {
|
|
361
|
+
if (!Ve) return s();
|
|
362
|
+
const j = s();
|
|
363
|
+
if (j?.priceRange) {
|
|
364
|
+
const H = r;
|
|
365
|
+
j.priceRange.minValue = H;
|
|
320
366
|
}
|
|
321
|
-
return
|
|
367
|
+
return j;
|
|
322
368
|
}
|
|
323
369
|
};
|
|
324
|
-
let
|
|
325
|
-
const
|
|
326
|
-
...
|
|
327
|
-
time:
|
|
370
|
+
let G = w.current.get(n.label);
|
|
371
|
+
const B = n.data.map((s) => ({
|
|
372
|
+
...s,
|
|
373
|
+
time: s.time
|
|
328
374
|
}));
|
|
329
|
-
if (
|
|
330
|
-
const
|
|
331
|
-
for (let
|
|
332
|
-
|
|
333
|
-
|
|
375
|
+
if (E !== void 0 && B.length > 0 && Number(B[0].time) > E) {
|
|
376
|
+
const s = Number(B[0].time), j = s - E, H = 86400, Oe = j > 180 * H ? 7 * H : j > 30 * H ? H : 6 * 3600, ye = [];
|
|
377
|
+
for (let ue = E; ue < s; ue += Oe)
|
|
378
|
+
ye.push({ time: ue });
|
|
379
|
+
B.unshift(...ye);
|
|
334
380
|
}
|
|
335
|
-
|
|
336
|
-
...
|
|
337
|
-
...
|
|
338
|
-
}),
|
|
381
|
+
G ? (G.applyOptions(ke), G.setData(B)) : (G = e.addSeries(Ge, {
|
|
382
|
+
...Ae,
|
|
383
|
+
...ke
|
|
384
|
+
}), G.setData(B), w.current.set(n.label, G)), U++;
|
|
339
385
|
}
|
|
340
|
-
if (
|
|
341
|
-
for (const o of
|
|
386
|
+
if (C && ie.length > 0)
|
|
387
|
+
for (const o of ie)
|
|
342
388
|
try {
|
|
343
|
-
const n =
|
|
389
|
+
const n = e.priceScale(o.priceScaleId);
|
|
344
390
|
n && n.applyOptions({
|
|
345
391
|
visible: !1,
|
|
346
392
|
autoScale: !0,
|
|
@@ -356,7 +402,7 @@ function me({
|
|
|
356
402
|
borderVisible: !0,
|
|
357
403
|
borderColor: "rgba(224, 227, 235, 0.1)",
|
|
358
404
|
entireTextOnly: !1,
|
|
359
|
-
textColor:
|
|
405
|
+
textColor: A
|
|
360
406
|
});
|
|
361
407
|
} catch (n) {
|
|
362
408
|
console.warn(
|
|
@@ -364,17 +410,17 @@ function me({
|
|
|
364
410
|
n
|
|
365
411
|
);
|
|
366
412
|
}
|
|
367
|
-
else if (!
|
|
413
|
+
else if (!C)
|
|
368
414
|
try {
|
|
369
|
-
const o =
|
|
415
|
+
const o = e.priceScale("right");
|
|
370
416
|
o && o.applyOptions({
|
|
371
|
-
visible: !
|
|
417
|
+
visible: !V,
|
|
372
418
|
autoScale: !0,
|
|
373
419
|
scaleMargins: {
|
|
374
420
|
top: 0.1,
|
|
375
421
|
// No bottom margin when yScaleMin is set so the scale doesn't extend below the minimum (avoids negative labels like -10M)
|
|
376
|
-
bottom: r !== void 0 ||
|
|
377
|
-
...
|
|
422
|
+
bottom: r !== void 0 || h ? 0 : 0.1,
|
|
423
|
+
...h && {
|
|
378
424
|
top: 0.3
|
|
379
425
|
}
|
|
380
426
|
},
|
|
@@ -382,217 +428,217 @@ function me({
|
|
|
382
428
|
borderVisible: !0,
|
|
383
429
|
borderColor: "rgba(224, 227, 235, 0.1)",
|
|
384
430
|
entireTextOnly: !1,
|
|
385
|
-
textColor:
|
|
431
|
+
textColor: A
|
|
386
432
|
});
|
|
387
433
|
} catch {
|
|
388
434
|
}
|
|
389
|
-
if (r !== void 0 && !
|
|
435
|
+
if (r !== void 0 && !V && (M || !C) && e.applyOptions({
|
|
390
436
|
handleScroll: {
|
|
391
437
|
vertTouchDrag: !1
|
|
392
438
|
}
|
|
393
|
-
}),
|
|
394
|
-
const o =
|
|
395
|
-
|
|
439
|
+
}), I.length > 0) {
|
|
440
|
+
const o = I.map((F) => Number(F.time)), n = Math.min(...o), q = E !== void 0 ? Math.min(E, n) : n, W = Math.max(...o);
|
|
441
|
+
e.timeScale().setVisibleRange({ from: q, to: W });
|
|
396
442
|
}
|
|
397
|
-
|
|
398
|
-
const
|
|
399
|
-
for (const o of
|
|
400
|
-
o.data.length > 0 &&
|
|
401
|
-
|
|
443
|
+
ve.current && (ve.current = !1);
|
|
444
|
+
const ce = /* @__PURE__ */ new Map();
|
|
445
|
+
for (const o of t)
|
|
446
|
+
o.data.length > 0 && ce.set(o.label, o.data[o.data.length - 1]);
|
|
447
|
+
le(ce.size > 0 ? ce : void 0);
|
|
402
448
|
}, [
|
|
403
|
-
|
|
404
|
-
|
|
449
|
+
t,
|
|
450
|
+
I,
|
|
405
451
|
g,
|
|
406
452
|
N,
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
]),
|
|
413
|
-
const
|
|
414
|
-
if (!
|
|
415
|
-
const a =
|
|
453
|
+
V,
|
|
454
|
+
M,
|
|
455
|
+
be,
|
|
456
|
+
pe,
|
|
457
|
+
E
|
|
458
|
+
]), $(() => {
|
|
459
|
+
const e = R.current;
|
|
460
|
+
if (!e || t.length === 0) return;
|
|
461
|
+
const a = t.length === 1;
|
|
416
462
|
let r;
|
|
417
|
-
for (const
|
|
418
|
-
if (
|
|
419
|
-
r =
|
|
463
|
+
for (const i of t)
|
|
464
|
+
if (i.data.length > 0) {
|
|
465
|
+
r = i.data[i.data.length - 1].time;
|
|
420
466
|
break;
|
|
421
467
|
}
|
|
422
468
|
if (!r) return;
|
|
423
|
-
const l = (
|
|
424
|
-
const { time: c = r, seriesData: f, point:
|
|
425
|
-
if (!
|
|
469
|
+
const l = (i) => {
|
|
470
|
+
const { time: c = r, seriesData: f, point: P } = i || {}, m = Array.from(w.current.values());
|
|
471
|
+
if (!P || !c) {
|
|
426
472
|
const y = /* @__PURE__ */ new Map();
|
|
427
|
-
for (const d of
|
|
473
|
+
for (const d of t)
|
|
428
474
|
d.data.length > 0 && y.set(d.label, d.data[d.data.length - 1]);
|
|
429
|
-
if (
|
|
430
|
-
|
|
475
|
+
if (le(y.size > 0 ? y : void 0), a || M)
|
|
476
|
+
z(null);
|
|
431
477
|
else if (m[0] && r) {
|
|
432
|
-
const S =
|
|
433
|
-
if (
|
|
434
|
-
const
|
|
435
|
-
S !== null &&
|
|
478
|
+
const S = e.timeScale().timeToCoordinate(r), h = t[0];
|
|
479
|
+
if (h.data.length > 0) {
|
|
480
|
+
const C = h.data[h.data.length - 1].value, b = m[0].priceToCoordinate(C);
|
|
481
|
+
S !== null && b !== null && z({ x: S, y: b });
|
|
436
482
|
}
|
|
437
483
|
}
|
|
438
484
|
return;
|
|
439
485
|
}
|
|
440
|
-
const
|
|
441
|
-
let
|
|
442
|
-
for (let y = 0; y <
|
|
443
|
-
const d =
|
|
486
|
+
const T = /* @__PURE__ */ new Map();
|
|
487
|
+
let k;
|
|
488
|
+
for (let y = 0; y < t.length; y++) {
|
|
489
|
+
const d = t[y], S = m[y];
|
|
444
490
|
if (!S) continue;
|
|
445
|
-
const
|
|
446
|
-
let
|
|
447
|
-
if (
|
|
448
|
-
|
|
491
|
+
const h = f?.get(S), C = h && "value" in h ? h.value : void 0;
|
|
492
|
+
let b;
|
|
493
|
+
if (C !== void 0)
|
|
494
|
+
b = C;
|
|
449
495
|
else if (a) {
|
|
450
|
-
const
|
|
451
|
-
|
|
496
|
+
const A = Number(c), X = d.data.length > 0 ? Number(d.data[0].time) : Number.POSITIVE_INFINITY;
|
|
497
|
+
A < X ? b = Number.NaN : b = d.data[d.data.length - 1]?.value ?? 0;
|
|
452
498
|
} else
|
|
453
|
-
|
|
454
|
-
Number.isNaN(
|
|
499
|
+
b = Ze(d.data, Number(c));
|
|
500
|
+
Number.isNaN(b) || (k === void 0 && (k = b), T.set(d.label, { value: b, time: c }));
|
|
455
501
|
}
|
|
456
|
-
if (
|
|
457
|
-
const d =
|
|
502
|
+
if (le(T), k !== void 0 && m[0]) {
|
|
503
|
+
const d = e.timeScale().timeToCoordinate(c), S = m[0].priceToCoordinate(k);
|
|
458
504
|
if (d !== null && S !== null) {
|
|
459
|
-
const
|
|
460
|
-
if (
|
|
461
|
-
const
|
|
505
|
+
const h = O.current;
|
|
506
|
+
if (h) {
|
|
507
|
+
const C = h.querySelector(
|
|
462
508
|
".LightweightChart"
|
|
463
509
|
);
|
|
464
|
-
if (
|
|
465
|
-
const
|
|
466
|
-
|
|
510
|
+
if (C) {
|
|
511
|
+
const b = C.getBoundingClientRect(), A = h.getBoundingClientRect(), X = d + (b.left - A.left), se = S + (b.top - A.top);
|
|
512
|
+
z({ x: X, y: se });
|
|
467
513
|
} else
|
|
468
|
-
|
|
514
|
+
z({ x: d, y: S });
|
|
469
515
|
} else
|
|
470
|
-
|
|
516
|
+
z({ x: d, y: S });
|
|
471
517
|
} else
|
|
472
|
-
|
|
518
|
+
z(null);
|
|
473
519
|
} else
|
|
474
|
-
|
|
520
|
+
z(null);
|
|
475
521
|
};
|
|
476
|
-
return
|
|
477
|
-
const
|
|
478
|
-
if (
|
|
479
|
-
const f =
|
|
480
|
-
f !== null && m !== null &&
|
|
522
|
+
return e.subscribeCrosshairMove(l), V && e.subscribeClick(l), !a && !M && requestAnimationFrame(() => {
|
|
523
|
+
const i = Array.from(w.current.values());
|
|
524
|
+
if (i[0] && r && t[0]?.data.length > 0) {
|
|
525
|
+
const f = e.timeScale().timeToCoordinate(r), P = t[0].data[t[0].data.length - 1].value, m = i[0].priceToCoordinate(P);
|
|
526
|
+
f !== null && m !== null && z({ x: f, y: m });
|
|
481
527
|
}
|
|
482
528
|
}), () => {
|
|
483
|
-
|
|
529
|
+
e.unsubscribeCrosshairMove(l), V && e.unsubscribeClick(l);
|
|
484
530
|
};
|
|
485
|
-
}, [
|
|
486
|
-
const
|
|
487
|
-
if (!
|
|
488
|
-
const a =
|
|
489
|
-
if (!
|
|
531
|
+
}, [t, M, V]), $(() => {
|
|
532
|
+
const e = R.current;
|
|
533
|
+
if (!e || t.length === 0) return;
|
|
534
|
+
const a = e.timeScale(), r = () => {
|
|
535
|
+
if (!ne.current) return;
|
|
490
536
|
const l = a.getVisibleRange();
|
|
491
537
|
if (!l) return;
|
|
492
|
-
const
|
|
493
|
-
for (const
|
|
494
|
-
for (const m of
|
|
495
|
-
const
|
|
496
|
-
|
|
538
|
+
const i = Number(l.from), c = Number(l.to), f = [];
|
|
539
|
+
for (const P of t)
|
|
540
|
+
for (const m of P.data) {
|
|
541
|
+
const T = Number(m.time);
|
|
542
|
+
T >= i && T <= c && f.push(m.value);
|
|
497
543
|
}
|
|
498
|
-
f.length > 0 &&
|
|
544
|
+
f.length > 0 && ne.current(f);
|
|
499
545
|
};
|
|
500
546
|
return a.subscribeVisibleLogicalRangeChange(r), () => {
|
|
501
547
|
a.unsubscribeVisibleLogicalRangeChange(
|
|
502
548
|
r
|
|
503
549
|
);
|
|
504
550
|
};
|
|
505
|
-
}, [
|
|
506
|
-
const
|
|
507
|
-
if (
|
|
508
|
-
const l =
|
|
551
|
+
}, [t]), $(() => {
|
|
552
|
+
const e = R.current, a = Array.from(w.current.values()), r = [];
|
|
553
|
+
if (e && a.length > 0 && x) {
|
|
554
|
+
const l = _e(), i = a[0];
|
|
509
555
|
for (const c of x) {
|
|
510
|
-
const f = new
|
|
556
|
+
const f = new Je(e, i, c.xCoordinate, {
|
|
511
557
|
...l,
|
|
512
558
|
...c.options || {}
|
|
513
559
|
});
|
|
514
|
-
|
|
560
|
+
i.attachPrimitive(f), r.push(f);
|
|
515
561
|
}
|
|
516
562
|
}
|
|
517
563
|
return () => {
|
|
518
564
|
if (a.length > 0) {
|
|
519
565
|
const l = a[0];
|
|
520
|
-
for (const
|
|
521
|
-
l.detachPrimitive(
|
|
566
|
+
for (const i of r)
|
|
567
|
+
l.detachPrimitive(i);
|
|
522
568
|
}
|
|
523
569
|
};
|
|
524
|
-
}, [x]),
|
|
525
|
-
const
|
|
526
|
-
if (!
|
|
527
|
-
|
|
570
|
+
}, [x, t]), $(() => {
|
|
571
|
+
const e = R.current;
|
|
572
|
+
if (!e || !x?.length) {
|
|
573
|
+
Ne([]);
|
|
528
574
|
return;
|
|
529
575
|
}
|
|
530
576
|
const a = () => {
|
|
531
|
-
const
|
|
532
|
-
|
|
577
|
+
const i = e.timeScale(), c = x.map((f) => i.timeToCoordinate(f.xCoordinate) ?? null);
|
|
578
|
+
Ne(c);
|
|
533
579
|
};
|
|
534
580
|
a();
|
|
535
|
-
const r =
|
|
581
|
+
const r = e.timeScale(), l = () => {
|
|
536
582
|
a();
|
|
537
583
|
};
|
|
538
584
|
return r.subscribeVisibleLogicalRangeChange(l), () => {
|
|
539
585
|
r.unsubscribeVisibleLogicalRangeChange(l);
|
|
540
586
|
};
|
|
541
|
-
}, [x]);
|
|
542
|
-
const
|
|
543
|
-
if (
|
|
544
|
-
const
|
|
545
|
-
if (
|
|
546
|
-
return
|
|
587
|
+
}, [x, t]);
|
|
588
|
+
const Z = t.length === 1, we = fe.useMemo(() => {
|
|
589
|
+
if (Z && t.length > 0) {
|
|
590
|
+
const e = t[0];
|
|
591
|
+
if (e.data.length > 0)
|
|
592
|
+
return e.data[e.data.length - 1];
|
|
547
593
|
}
|
|
548
|
-
}, [
|
|
549
|
-
return /* @__PURE__ */
|
|
594
|
+
}, [Z, t]);
|
|
595
|
+
return /* @__PURE__ */ K(
|
|
550
596
|
"div",
|
|
551
597
|
{
|
|
552
|
-
ref:
|
|
553
|
-
className:
|
|
598
|
+
ref: O,
|
|
599
|
+
className: he(
|
|
554
600
|
"relative z-[1] w-full h-full overflow-hidden p-0",
|
|
555
|
-
|
|
601
|
+
v
|
|
556
602
|
),
|
|
557
603
|
children: [
|
|
558
|
-
|
|
559
|
-
|
|
604
|
+
oe != null && oe !== !1 && Z ? /* @__PURE__ */ p("div", { className: "absolute top-2 left-2 right-2 z-[100] pointer-events-none", children: /* @__PURE__ */ p("div", { className: "text-xl sm:text-2xl font-semibold text-foreground whitespace-nowrap overflow-hidden text-ellipsis", children: oe }) }) : De && Z && we && /* @__PURE__ */ p(
|
|
605
|
+
qe,
|
|
560
606
|
{
|
|
561
|
-
point:
|
|
607
|
+
point: we,
|
|
562
608
|
xMeasureUnit: g,
|
|
563
609
|
yMeasureUnit: N,
|
|
564
|
-
decimals:
|
|
610
|
+
decimals: te
|
|
565
611
|
}
|
|
566
612
|
),
|
|
567
|
-
|
|
568
|
-
|
|
613
|
+
Ce && xe && /* @__PURE__ */ p(
|
|
614
|
+
Ke,
|
|
569
615
|
{
|
|
570
|
-
points:
|
|
616
|
+
points: Ce,
|
|
571
617
|
xMeasureUnit: g,
|
|
572
618
|
yMeasureUnit: N,
|
|
573
|
-
series:
|
|
574
|
-
position:
|
|
575
|
-
containerRef:
|
|
576
|
-
decimals:
|
|
619
|
+
series: t,
|
|
620
|
+
position: xe,
|
|
621
|
+
containerRef: O,
|
|
622
|
+
decimals: te
|
|
577
623
|
}
|
|
578
624
|
),
|
|
579
|
-
u && /* @__PURE__ */ p(
|
|
580
|
-
x && x.length > 0 &&
|
|
625
|
+
u && /* @__PURE__ */ p(et, { series: t, onUnselect: D }),
|
|
626
|
+
x && x.length > 0 && Se.length === x.length && /* @__PURE__ */ p(
|
|
581
627
|
"div",
|
|
582
628
|
{
|
|
583
629
|
className: "absolute inset-0 z-[5] pointer-events-none",
|
|
584
630
|
"aria-hidden": !0,
|
|
585
|
-
children: x.map((
|
|
586
|
-
const r =
|
|
587
|
-
if (r === null || !
|
|
588
|
-
const { labelText: c, valueStr: f } =
|
|
631
|
+
children: x.map((e, a) => {
|
|
632
|
+
const r = Se[a], l = e.options ?? {}, i = l.showLabel !== !1;
|
|
633
|
+
if (r === null || !i) return null;
|
|
634
|
+
const { labelText: c, valueStr: f } = Qe(
|
|
589
635
|
l,
|
|
590
636
|
N,
|
|
591
|
-
|
|
637
|
+
te
|
|
592
638
|
);
|
|
593
639
|
if (!(c || f)) return null;
|
|
594
|
-
const m = l.labelBackgroundColor ?? l.color ?? "hsl(var(--background))",
|
|
595
|
-
return /* @__PURE__ */
|
|
640
|
+
const m = l.labelBackgroundColor ?? l.color ?? "hsl(var(--background))", T = l.labelTextColor ?? "hsl(var(--foreground))", k = `${String(e.xCoordinate)}-${c}`;
|
|
641
|
+
return /* @__PURE__ */ K(
|
|
596
642
|
"div",
|
|
597
643
|
{
|
|
598
644
|
className: "absolute top-2 px-2 py-1 rounded text-xs font-medium whitespace-nowrap shadow-sm border border-border",
|
|
@@ -600,14 +646,14 @@ function me({
|
|
|
600
646
|
left: r,
|
|
601
647
|
transform: "translateX(-50%)",
|
|
602
648
|
backgroundColor: m,
|
|
603
|
-
color:
|
|
649
|
+
color: T
|
|
604
650
|
},
|
|
605
651
|
children: [
|
|
606
652
|
c && /* @__PURE__ */ p("span", { className: "block", children: c }),
|
|
607
|
-
f && /* @__PURE__ */ p("span", { className:
|
|
653
|
+
f && /* @__PURE__ */ p("span", { className: he("block", c && "mt-0.5"), children: f })
|
|
608
654
|
]
|
|
609
655
|
},
|
|
610
|
-
|
|
656
|
+
k
|
|
611
657
|
);
|
|
612
658
|
})
|
|
613
659
|
}
|
|
@@ -615,7 +661,7 @@ function me({
|
|
|
615
661
|
/* @__PURE__ */ p(
|
|
616
662
|
"div",
|
|
617
663
|
{
|
|
618
|
-
ref:
|
|
664
|
+
ref: ae,
|
|
619
665
|
className: "LightweightChart w-full h-full overflow-hidden"
|
|
620
666
|
}
|
|
621
667
|
)
|
|
@@ -623,18 +669,18 @@ function me({
|
|
|
623
669
|
}
|
|
624
670
|
);
|
|
625
671
|
}
|
|
626
|
-
function
|
|
627
|
-
series:
|
|
628
|
-
onUnselect:
|
|
672
|
+
function et({
|
|
673
|
+
series: t,
|
|
674
|
+
onUnselect: v
|
|
629
675
|
}) {
|
|
630
|
-
return /* @__PURE__ */ p("div", { className: "absolute top-0 left-2 z-[10] flex flex-wrap gap-2", children:
|
|
631
|
-
const g =
|
|
632
|
-
return /* @__PURE__ */
|
|
676
|
+
return /* @__PURE__ */ p("div", { className: "absolute top-0 left-2 z-[10] flex flex-wrap gap-2", children: t.map((u, D) => {
|
|
677
|
+
const g = Le(D), N = (u.lineColor ?? u.color) || g.line, _ = u.data.length === 0;
|
|
678
|
+
return /* @__PURE__ */ K(
|
|
633
679
|
"div",
|
|
634
680
|
{
|
|
635
|
-
className:
|
|
681
|
+
className: he(
|
|
636
682
|
"flex items-center gap-1.5 px-2 py-1 bg-background/80 backdrop-blur-sm rounded border border-border",
|
|
637
|
-
|
|
683
|
+
_ && "opacity-50"
|
|
638
684
|
),
|
|
639
685
|
children: [
|
|
640
686
|
/* @__PURE__ */ p(
|
|
@@ -644,20 +690,20 @@ function Ut({
|
|
|
644
690
|
style: { backgroundColor: N }
|
|
645
691
|
}
|
|
646
692
|
),
|
|
647
|
-
/* @__PURE__ */
|
|
693
|
+
/* @__PURE__ */ K("span", { className: "text-[10px] sm:text-xs font-medium text-foreground", children: [
|
|
648
694
|
u.label,
|
|
649
|
-
|
|
695
|
+
_ && " (no data)"
|
|
650
696
|
] }),
|
|
651
|
-
|
|
697
|
+
v && /* @__PURE__ */ p(
|
|
652
698
|
"button",
|
|
653
699
|
{
|
|
654
700
|
type: "button",
|
|
655
701
|
onClick: (x) => {
|
|
656
|
-
x.stopPropagation(),
|
|
702
|
+
x.stopPropagation(), v(u.label);
|
|
657
703
|
},
|
|
658
704
|
className: "ml-1 flex items-center justify-center w-4 h-4 rounded-sm hover:bg-muted transition-colors cursor-pointer",
|
|
659
705
|
"aria-label": `Remove ${u.label}`,
|
|
660
|
-
children: /* @__PURE__ */
|
|
706
|
+
children: /* @__PURE__ */ K(
|
|
661
707
|
"svg",
|
|
662
708
|
{
|
|
663
709
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -687,9 +733,9 @@ function Ut({
|
|
|
687
733
|
}) });
|
|
688
734
|
}
|
|
689
735
|
export {
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
736
|
+
me as DEFAULT_SERIES_COLORS,
|
|
737
|
+
ht as Graph,
|
|
738
|
+
Le as getSeriesColorPalette,
|
|
739
|
+
Ze as getStepForwardValue,
|
|
740
|
+
Qe as getVerticalLineTooltipContent
|
|
695
741
|
};
|