hyperprop-charting-library 0.1.153 → 0.1.155
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/hyperprop-charting-library.cjs +195 -18
- package/dist/hyperprop-charting-library.d.ts +40 -1
- package/dist/hyperprop-charting-library.js +192 -18
- package/dist/index.cjs +195 -18
- package/dist/index.d.cts +40 -1
- package/dist/index.d.ts +40 -1
- package/dist/index.js +192 -18
- package/package.json +1 -1
|
@@ -22,6 +22,9 @@ var index_exports = {};
|
|
|
22
22
|
__export(index_exports, {
|
|
23
23
|
CHART_THEMES: () => CHART_THEMES,
|
|
24
24
|
CHART_THEME_NAMES: () => CHART_THEME_NAMES,
|
|
25
|
+
DRAWING_ICON_STROKE_WIDTH: () => DRAWING_ICON_STROKE_WIDTH,
|
|
26
|
+
DRAWING_ICON_VIEWBOX: () => DRAWING_ICON_VIEWBOX,
|
|
27
|
+
DRAWING_TOOL_ICONS: () => DRAWING_TOOL_ICONS,
|
|
25
28
|
FIB_DEFAULT_PALETTE: () => FIB_DEFAULT_PALETTE,
|
|
26
29
|
POSITION_DEFAULT_COLORS: () => POSITION_DEFAULT_COLORS,
|
|
27
30
|
SCRIPT_SOURCE_INPUT_VALUES: () => SCRIPT_SOURCE_INPUT_VALUES,
|
|
@@ -3168,6 +3171,177 @@ var compileScriptIndicator = (definition) => {
|
|
|
3168
3171
|
return plugin;
|
|
3169
3172
|
};
|
|
3170
3173
|
|
|
3174
|
+
// src/icons.ts
|
|
3175
|
+
var DRAWING_ICON_VIEWBOX = 28;
|
|
3176
|
+
var DRAWING_ICON_STROKE_WIDTH = 1.6;
|
|
3177
|
+
var dot = (cx, cy) => ({ kind: "circle", cx, cy, r: 2.1 });
|
|
3178
|
+
var path = (d, extra) => ({
|
|
3179
|
+
kind: "path",
|
|
3180
|
+
d,
|
|
3181
|
+
...extra
|
|
3182
|
+
});
|
|
3183
|
+
var DRAWING_TOOL_ICONS = {
|
|
3184
|
+
"cursor-cross": [path("M14 4v6.5M14 17.5V24M4 14h6.5M17.5 14H24")],
|
|
3185
|
+
"cursor-dot": [{ kind: "circle", cx: 14, cy: 14, r: 2.6, fill: true }],
|
|
3186
|
+
"cursor-arrow": [path("M10 4.5v16.4l4.3-4.1 3 6.7 2.9-1.3-3-6.7h5.9L10 4.5Z")],
|
|
3187
|
+
trendline: [dot(7, 21), dot(21, 7), path("M8.6 19.4 19.4 8.6")],
|
|
3188
|
+
"horizontal-line": [dot(14, 14), path("M3.5 14h8.4M16.1 14h8.4")],
|
|
3189
|
+
"vertical-line": [dot(14, 14), path("M14 3.5v8.4M14 16.1v8.4")],
|
|
3190
|
+
ray: [dot(7.5, 20.5), path("M9 19 24 4")],
|
|
3191
|
+
arrow: [dot(6, 22), path("M7.6 20.4 21.4 6.6"), path("M14.6 6.2h7.2v7.2")],
|
|
3192
|
+
"parallel-channel": [dot(6, 17), dot(17, 6), path("M7.5 15.5 15.5 7.5"), path("M11 23.5 23.5 11")],
|
|
3193
|
+
"fib-retracement": [
|
|
3194
|
+
dot(6, 7),
|
|
3195
|
+
path("M9.6 7h14.9"),
|
|
3196
|
+
path("M3.5 14h21"),
|
|
3197
|
+
dot(6, 21),
|
|
3198
|
+
path("M9.6 21h14.9")
|
|
3199
|
+
],
|
|
3200
|
+
"fib-extension": [
|
|
3201
|
+
dot(6.5, 21.5),
|
|
3202
|
+
dot(12.5, 6.5),
|
|
3203
|
+
path("M7.5 19.1l4-9.2"),
|
|
3204
|
+
path("M17 7h7.5M17 14h7.5M17 21h7.5")
|
|
3205
|
+
],
|
|
3206
|
+
// Long/short: three price levels (target, entry, stop) with anchor dots and
|
|
3207
|
+
// a dotted "price path" diagonal running from entry toward the target.
|
|
3208
|
+
"long-position": [
|
|
3209
|
+
dot(5, 6.5),
|
|
3210
|
+
path("M8.6 6.5h15.9"),
|
|
3211
|
+
dot(5, 16),
|
|
3212
|
+
path("M8.6 16h10.3"),
|
|
3213
|
+
dot(21, 16),
|
|
3214
|
+
path("M8.6 22.5h15.9"),
|
|
3215
|
+
dot(5, 22.5),
|
|
3216
|
+
path("M10.5 14 22 7.8", { dash: "2 3.2" })
|
|
3217
|
+
],
|
|
3218
|
+
"short-position": [
|
|
3219
|
+
dot(5, 21.5),
|
|
3220
|
+
path("M8.6 21.5h15.9"),
|
|
3221
|
+
dot(5, 12),
|
|
3222
|
+
path("M8.6 12h10.3"),
|
|
3223
|
+
dot(21, 12),
|
|
3224
|
+
path("M8.6 5.5h15.9"),
|
|
3225
|
+
dot(5, 5.5),
|
|
3226
|
+
path("M10.5 14 22 20.2", { dash: "2 3.2" })
|
|
3227
|
+
],
|
|
3228
|
+
"price-range": [
|
|
3229
|
+
path("M8 5h12M8 23h12"),
|
|
3230
|
+
path("M14 7v14"),
|
|
3231
|
+
path("M11.2 9.8 14 7l2.8 2.8M11.2 18.2 14 21l2.8-2.8")
|
|
3232
|
+
],
|
|
3233
|
+
// Fixed range VP: two vertical range anchors with the profile bars attached
|
|
3234
|
+
// to the left one.
|
|
3235
|
+
"fixed-range-volume-profile": [
|
|
3236
|
+
path("M5 3.5v15.4"),
|
|
3237
|
+
dot(5, 21.5),
|
|
3238
|
+
dot(23, 6.5),
|
|
3239
|
+
path("M23 9.1v15.4"),
|
|
3240
|
+
{ kind: "rect", x: 5, y: 6, width: 7, height: 3.2 },
|
|
3241
|
+
{ kind: "rect", x: 5, y: 11, width: 10.5, height: 3.2 },
|
|
3242
|
+
{ kind: "rect", x: 5, y: 16, width: 4.5, height: 3.2 }
|
|
3243
|
+
],
|
|
3244
|
+
measure: [
|
|
3245
|
+
path("M4.5 18.5 18.5 4.5l5 5L9.5 23.5Z"),
|
|
3246
|
+
path("m8 15 1.8 1.8M11.5 11.5 14 14M15 8l1.8 1.8")
|
|
3247
|
+
],
|
|
3248
|
+
rectangle: [
|
|
3249
|
+
dot(6, 8),
|
|
3250
|
+
dot(22, 8),
|
|
3251
|
+
dot(22, 20),
|
|
3252
|
+
dot(6, 20),
|
|
3253
|
+
path("M8.1 8h11.8M8.1 20h11.8M6 10.1v7.8M22 10.1v7.8")
|
|
3254
|
+
],
|
|
3255
|
+
ellipse: [path("M6.1 14a7.9 6.9 0 1 0 15.8 0 7.9 6.9 0 1 0-15.8 0"), dot(4, 14), dot(24, 14)],
|
|
3256
|
+
brush: [dot(5, 20), path("M6.9 18.4c2.6-6 5-.6 8.4-3.2 3-2.3 5.4-6 8.2-7.9")],
|
|
3257
|
+
text: [path("M7 8.5V6h14v2.5"), path("M14 6v16M11 22h6")],
|
|
3258
|
+
note: [path("M5.5 5h17v11.5l-6 6h-11V5Z"), path("M22.5 16.5h-6v6")],
|
|
3259
|
+
callout: [path("M4.5 6h19v11.5H13L8 22.5v-5H4.5V6Z")],
|
|
3260
|
+
// --- Chart-UI utilities ----------------------------------------------------
|
|
3261
|
+
magnet: [
|
|
3262
|
+
path("M8.5 4.5h4v8.5a1.5 1.5 0 0 0 3 0V4.5h4V13a5.5 5.5 0 0 1-11 0V4.5Z"),
|
|
3263
|
+
path("M8.5 8.5h4M15.5 8.5h4")
|
|
3264
|
+
],
|
|
3265
|
+
trash: [
|
|
3266
|
+
path("M6.5 8h15"),
|
|
3267
|
+
path("M11 8V5.5h6V8"),
|
|
3268
|
+
path("M8.5 8l.9 14h9.2l.9-14"),
|
|
3269
|
+
path("M12 12v6.5M16 12v6.5")
|
|
3270
|
+
],
|
|
3271
|
+
pencil: [path("M5 23l.9-3.9L19 6a2.1 2.1 0 0 1 3 3L8.9 22.1 5 23Z"), path("M17.5 7.5l3 3")],
|
|
3272
|
+
"eye-off": [
|
|
3273
|
+
path("M4 14c2.6-4.6 6-6.9 10-6.9s7.4 2.3 10 6.9c-2.6 4.6-6 6.9-10 6.9S6.6 18.6 4 14Z"),
|
|
3274
|
+
{ kind: "circle", cx: 14, cy: 14, r: 3 },
|
|
3275
|
+
path("M6.5 22.5l15-17")
|
|
3276
|
+
],
|
|
3277
|
+
lock: [
|
|
3278
|
+
path("M10 12V8.8a4 4 0 0 1 8 0V12"),
|
|
3279
|
+
{ kind: "rect", x: 7, y: 12, width: 14, height: 10.5 },
|
|
3280
|
+
{ kind: "circle", cx: 14, cy: 17, r: 1.4 }
|
|
3281
|
+
],
|
|
3282
|
+
unlock: [
|
|
3283
|
+
path("M10 12V8.8a4 4 0 0 1 7.7-1.5"),
|
|
3284
|
+
{ kind: "rect", x: 7, y: 12, width: 14, height: 10.5 },
|
|
3285
|
+
{ kind: "circle", cx: 14, cy: 17, r: 1.4 }
|
|
3286
|
+
],
|
|
3287
|
+
clone: [
|
|
3288
|
+
{ kind: "rect", x: 10, y: 10, width: 12.5, height: 12.5 },
|
|
3289
|
+
path("M5.5 18V7a1.5 1.5 0 0 1 1.5-1.5h11")
|
|
3290
|
+
],
|
|
3291
|
+
// Sliders, drawn with the pack's anchor-dot knobs.
|
|
3292
|
+
settings: [
|
|
3293
|
+
path("M4 10h5.4"),
|
|
3294
|
+
dot(11.5, 10),
|
|
3295
|
+
path("M13.6 10H24"),
|
|
3296
|
+
path("M4 18h9.4"),
|
|
3297
|
+
dot(15.5, 18),
|
|
3298
|
+
path("M17.6 18H24")
|
|
3299
|
+
],
|
|
3300
|
+
"source-code": [path("M10.5 8 4.5 14l6 6"), path("M17.5 8l6 6-6 6")],
|
|
3301
|
+
"go-to-realtime": [path("M23.5 5.5v17"), path("M3.5 14h14.2"), path("M13.2 9.5 17.7 14l-4.5 4.5")],
|
|
3302
|
+
"fit-bars": [
|
|
3303
|
+
path("M4.5 5.5v17M23.5 5.5v17"),
|
|
3304
|
+
path("M8.5 14h11"),
|
|
3305
|
+
path("M12 10.5 8.5 14l3.5 3.5M16 10.5l3.5 3.5-3.5 3.5")
|
|
3306
|
+
],
|
|
3307
|
+
reset: [
|
|
3308
|
+
path("M3.5 14a10.5 10.5 0 1 0 10.5-10.5c-3 0-5.8 1.3-7.9 3.2L3.5 9.3"),
|
|
3309
|
+
path("M3.5 3.5v5.8h5.8")
|
|
3310
|
+
],
|
|
3311
|
+
"log-scale": [path("M5 4.5V23.5H24"), path("M7.5 21C13 19.5 19 13.5 21.5 6.5")],
|
|
3312
|
+
"percent-scale": [
|
|
3313
|
+
{ kind: "circle", cx: 9, cy: 9, r: 2.7 },
|
|
3314
|
+
{ kind: "circle", cx: 19, cy: 19, r: 2.7 },
|
|
3315
|
+
path("M6 22 22 6")
|
|
3316
|
+
],
|
|
3317
|
+
"invert-scale": [
|
|
3318
|
+
path("M9.5 22V6.5"),
|
|
3319
|
+
path("M5.5 10.5 9.5 6.5l4 4"),
|
|
3320
|
+
path("M18.5 6v15.5"),
|
|
3321
|
+
path("M14.5 17.5l4 4 4-4")
|
|
3322
|
+
],
|
|
3323
|
+
"arrow-up": [path("M14 22.5V6"), path("M7.5 12.5 14 6l6.5 6.5")],
|
|
3324
|
+
"arrow-down": [path("M14 5.5V22"), path("M7.5 15.5 14 22l6.5-6.5")],
|
|
3325
|
+
replay: [path("M4.5 5.5v17"), path("M9.3 14H24"), path("M13.8 9.5 9.3 14l4.5 4.5")],
|
|
3326
|
+
play: [path("M10 6.3v15.4L22.5 14 10 6.3Z")],
|
|
3327
|
+
pause: [path("M10.5 6.5v15M17.5 6.5v15")],
|
|
3328
|
+
"skip-back": [path("M7 6.5v15"), path("M21 6.9v14.2L10 14 21 6.9Z")],
|
|
3329
|
+
"skip-forward": [path("M21 6.5v15"), path("M7 6.9v14.2L18 14 7 6.9Z")],
|
|
3330
|
+
// Alarm clock — the alert metaphor traders know from other platforms.
|
|
3331
|
+
alert: [
|
|
3332
|
+
{ kind: "circle", cx: 14, cy: 15.5, r: 7.5 },
|
|
3333
|
+
path("M14 11.5v4l3 1.8"),
|
|
3334
|
+
path("M4.9 8.4 8 5.6M23.1 8.4 20 5.6")
|
|
3335
|
+
],
|
|
3336
|
+
anchor: [
|
|
3337
|
+
{ kind: "circle", cx: 14, cy: 5.8, r: 2.1 },
|
|
3338
|
+
path("M14 7.9V23.5"),
|
|
3339
|
+
path("M9.5 11.5h9"),
|
|
3340
|
+
path("M5 14.5a9 9 0 0 0 18 0")
|
|
3341
|
+
],
|
|
3342
|
+
indicators: [path("M4 19.5l5.5-6.5 4.5 4.5 9.5-11")]
|
|
3343
|
+
};
|
|
3344
|
+
|
|
3171
3345
|
// src/themes.ts
|
|
3172
3346
|
var CHART_THEMES = {
|
|
3173
3347
|
midnight: {
|
|
@@ -4690,9 +4864,9 @@ function createChart(element, options = {}) {
|
|
|
4690
4864
|
const groupThousands = (value, decimals) => {
|
|
4691
4865
|
const negative = value < 0;
|
|
4692
4866
|
const fixed = Math.abs(value).toFixed(decimals);
|
|
4693
|
-
const
|
|
4694
|
-
const intPart =
|
|
4695
|
-
const decPart =
|
|
4867
|
+
const dot2 = fixed.indexOf(".");
|
|
4868
|
+
const intPart = dot2 === -1 ? fixed : fixed.slice(0, dot2);
|
|
4869
|
+
const decPart = dot2 === -1 ? "" : fixed.slice(dot2);
|
|
4696
4870
|
const grouped = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
4697
4871
|
return `${negative ? "-" : ""}${grouped}${decPart}`;
|
|
4698
4872
|
};
|
|
@@ -7272,12 +7446,12 @@ function createChart(element, options = {}) {
|
|
|
7272
7446
|
const upColumns = new Path2D();
|
|
7273
7447
|
const downColumns = new Path2D();
|
|
7274
7448
|
for (const column of seriesColumns) {
|
|
7275
|
-
const
|
|
7449
|
+
const path2 = column.close >= column.open ? upColumns : downColumns;
|
|
7276
7450
|
const x = column.x + 0.5;
|
|
7277
7451
|
const top = crisp(yFromPrice(column.high));
|
|
7278
7452
|
const bottom = crisp(yFromPrice(column.low));
|
|
7279
|
-
|
|
7280
|
-
|
|
7453
|
+
path2.moveTo(x, top);
|
|
7454
|
+
path2.lineTo(x, bottom === top ? bottom + 1 : bottom);
|
|
7281
7455
|
}
|
|
7282
7456
|
ctx.lineWidth = 1;
|
|
7283
7457
|
ctx.strokeStyle = mergedOptions.upColor;
|
|
@@ -7420,16 +7594,16 @@ function createChart(element, options = {}) {
|
|
|
7420
7594
|
const displayLow = isLastCandle && actualDirection === "down" ? Math.min(point.l, displayClose) : point.l;
|
|
7421
7595
|
const roundedCenterX = Math.round(chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth);
|
|
7422
7596
|
const direction = isLastCandle ? actualDirection : getCandleDirectionByIndex(index);
|
|
7423
|
-
const
|
|
7597
|
+
const path2 = direction === "up" ? upBars : downBars;
|
|
7424
7598
|
const centerX = roundedCenterX + 0.5;
|
|
7425
|
-
|
|
7426
|
-
|
|
7599
|
+
path2.moveTo(centerX, crisp(yFromPrice(displayHigh)));
|
|
7600
|
+
path2.lineTo(centerX, crisp(yFromPrice(displayLow)));
|
|
7427
7601
|
const openY = crisp(yFromPrice(point.o));
|
|
7428
7602
|
const closeY = crisp(yFromPrice(displayClose));
|
|
7429
|
-
|
|
7430
|
-
|
|
7431
|
-
|
|
7432
|
-
|
|
7603
|
+
path2.moveTo(centerX - tickLength, openY);
|
|
7604
|
+
path2.lineTo(centerX, openY);
|
|
7605
|
+
path2.moveTo(centerX, closeY);
|
|
7606
|
+
path2.lineTo(centerX + tickLength, closeY);
|
|
7433
7607
|
}
|
|
7434
7608
|
ctx.lineWidth = Math.max(1, candleWickWidth);
|
|
7435
7609
|
ctx.strokeStyle = mergedOptions.upColor;
|
|
@@ -7497,7 +7671,7 @@ function createChart(element, options = {}) {
|
|
|
7497
7671
|
for (const plan of comparePlans) {
|
|
7498
7672
|
const color = plan.state.options.color ?? "#f59e0b";
|
|
7499
7673
|
const lineWidth = Math.max(1, plan.state.options.lineWidth ?? 1.5);
|
|
7500
|
-
const
|
|
7674
|
+
const path2 = new Path2D();
|
|
7501
7675
|
let started = false;
|
|
7502
7676
|
let firstX = 0;
|
|
7503
7677
|
let lastX = 0;
|
|
@@ -7505,11 +7679,11 @@ function createChart(element, options = {}) {
|
|
|
7505
7679
|
let lastPrice = Number.NaN;
|
|
7506
7680
|
const emit = (x, y) => {
|
|
7507
7681
|
if (!started) {
|
|
7508
|
-
|
|
7682
|
+
path2.moveTo(x, y);
|
|
7509
7683
|
firstX = x;
|
|
7510
7684
|
started = true;
|
|
7511
7685
|
} else {
|
|
7512
|
-
|
|
7686
|
+
path2.lineTo(x, y);
|
|
7513
7687
|
}
|
|
7514
7688
|
lastX = x;
|
|
7515
7689
|
lastY = y;
|
|
@@ -7567,7 +7741,7 @@ function createChart(element, options = {}) {
|
|
|
7567
7741
|
}
|
|
7568
7742
|
if (!started) continue;
|
|
7569
7743
|
if (plan.state.options.style === "area") {
|
|
7570
|
-
const fillPath = new Path2D(
|
|
7744
|
+
const fillPath = new Path2D(path2);
|
|
7571
7745
|
fillPath.lineTo(lastX, chartBottom);
|
|
7572
7746
|
fillPath.lineTo(firstX, chartBottom);
|
|
7573
7747
|
fillPath.closePath();
|
|
@@ -7581,7 +7755,7 @@ function createChart(element, options = {}) {
|
|
|
7581
7755
|
ctx.strokeStyle = color;
|
|
7582
7756
|
ctx.lineWidth = lineWidth;
|
|
7583
7757
|
ctx.lineJoin = "round";
|
|
7584
|
-
ctx.stroke(
|
|
7758
|
+
ctx.stroke(path2);
|
|
7585
7759
|
ctx.restore();
|
|
7586
7760
|
if (Number.isFinite(lastPrice)) {
|
|
7587
7761
|
const label = plan.state.options.label ?? plan.state.options.id;
|
|
@@ -12386,6 +12560,9 @@ function createChart(element, options = {}) {
|
|
|
12386
12560
|
0 && (module.exports = {
|
|
12387
12561
|
CHART_THEMES,
|
|
12388
12562
|
CHART_THEME_NAMES,
|
|
12563
|
+
DRAWING_ICON_STROKE_WIDTH,
|
|
12564
|
+
DRAWING_ICON_VIEWBOX,
|
|
12565
|
+
DRAWING_TOOL_ICONS,
|
|
12389
12566
|
FIB_DEFAULT_PALETTE,
|
|
12390
12567
|
POSITION_DEFAULT_COLORS,
|
|
12391
12568
|
SCRIPT_SOURCE_INPUT_VALUES,
|
|
@@ -1441,6 +1441,45 @@ declare const validateScriptSource: (source: string) => string | null;
|
|
|
1441
1441
|
*/
|
|
1442
1442
|
declare const compileScriptIndicator: (definition: ScriptIndicatorDefinition) => IndicatorPlugin;
|
|
1443
1443
|
|
|
1444
|
+
/**
|
|
1445
|
+
* Hyperprop drawing-tool icon pack — framework-agnostic geometry.
|
|
1446
|
+
*
|
|
1447
|
+
* Original artwork drawn in the visual language traders know from desktop
|
|
1448
|
+
* charting platforms: a 28x28 grid, thin round-capped outlines, and hollow
|
|
1449
|
+
* "anchor" dots on anything line-based (a dot marks a draggable point of the
|
|
1450
|
+
* tool). The data here is plain shape descriptions so every consumer renders
|
|
1451
|
+
* the identical set: the web terminal maps it to DOM `<svg>` elements and the
|
|
1452
|
+
* mobile app to react-native-svg components.
|
|
1453
|
+
*
|
|
1454
|
+
* Design rules when adding icons:
|
|
1455
|
+
* - viewBox 0 0 28 28, strokeWidth 1.6, round caps/joins, no fill (except
|
|
1456
|
+
* shapes marked `fill: true`).
|
|
1457
|
+
* - Anchor dots are hollow circles r=2.1; lines stop ~1.5px short of them.
|
|
1458
|
+
* - Keep 3.5px padding to the edges so glyphs optically match.
|
|
1459
|
+
*/
|
|
1460
|
+
type DrawingIconShape = {
|
|
1461
|
+
kind: "path";
|
|
1462
|
+
d: string;
|
|
1463
|
+
dash?: string;
|
|
1464
|
+
fill?: boolean;
|
|
1465
|
+
} | {
|
|
1466
|
+
kind: "circle";
|
|
1467
|
+
cx: number;
|
|
1468
|
+
cy: number;
|
|
1469
|
+
r: number;
|
|
1470
|
+
fill?: boolean;
|
|
1471
|
+
} | {
|
|
1472
|
+
kind: "rect";
|
|
1473
|
+
x: number;
|
|
1474
|
+
y: number;
|
|
1475
|
+
width: number;
|
|
1476
|
+
height: number;
|
|
1477
|
+
};
|
|
1478
|
+
type DrawingIconName = "cursor-cross" | "cursor-dot" | "cursor-arrow" | "trendline" | "horizontal-line" | "vertical-line" | "ray" | "arrow" | "parallel-channel" | "fib-retracement" | "fib-extension" | "long-position" | "short-position" | "price-range" | "fixed-range-volume-profile" | "measure" | "rectangle" | "ellipse" | "brush" | "text" | "note" | "callout" | "magnet" | "trash" | "pencil" | "eye-off" | "lock" | "unlock" | "clone" | "settings" | "source-code" | "go-to-realtime" | "fit-bars" | "reset" | "log-scale" | "percent-scale" | "invert-scale" | "arrow-up" | "arrow-down" | "replay" | "play" | "pause" | "skip-back" | "skip-forward" | "alert" | "anchor" | "indicators";
|
|
1479
|
+
declare const DRAWING_ICON_VIEWBOX = 28;
|
|
1480
|
+
declare const DRAWING_ICON_STROKE_WIDTH = 1.6;
|
|
1481
|
+
declare const DRAWING_TOOL_ICONS: Record<DrawingIconName, DrawingIconShape[]>;
|
|
1482
|
+
|
|
1444
1483
|
/**
|
|
1445
1484
|
* Built-in palettes.
|
|
1446
1485
|
*
|
|
@@ -1465,4 +1504,4 @@ declare const SESSION_PRESETS: Record<SessionPresetName, SessionSpec>;
|
|
|
1465
1504
|
|
|
1466
1505
|
declare function createChart(element: HTMLElement, options?: ChartOptions): ChartInstance;
|
|
1467
1506
|
|
|
1468
|
-
export { type AccessibilityOptions, type AlertActionEvent, type AlertCondition, type AlertOptions, type AlertTriggerEvent, type AnimationOptions, type AxisOptions, type BarMarkOptions, type BuiltInIndicatorInfo, CHART_THEMES, CHART_THEME_NAMES, type ChartClickEvent, type ChartContextMenuEvent, type ChartContextMenuRegion, type ChartDatafeed, type ChartInstance, type ChartKeyboardAction, type ChartKeyboardShortcutEvent, type ChartLongPressEvent, type ChartOptions, type ChartSavedState, type ChartTheme, type ChartThemeName, type ChartTimezone, type ChartType, type CompareSeriesOptions, type CrosshairMoveEvent, type CrosshairOptions, type CrosshairPriceActionEvent, type DashPatternOptions, type DataLineOptions, type DatafeedBarsRequest, type DatafeedOptions, type DownsamplingOptions, type DrawingBounds, type DrawingDefaults, type DrawingHoverEvent, type DrawingObjectOptions, type DrawingPoint, type DrawingSelectEvent, type DrawingSelectionChangeEvent, type DrawingToolType, FIB_DEFAULT_PALETTE, type GridOptions, type HistoryOptions, type IndicatorInstanceOptions, type IndicatorPane, type IndicatorPaneActionEvent, type IndicatorPaneAxisOptions, type IndicatorPaneGuideLine, type IndicatorPaneHeightChangeEvent, type IndicatorPaneRenderInfo, type IndicatorPaneValue, type IndicatorPaneValueLabel, type IndicatorPlugin, type IndicatorRenderContext, type IndicatorUpdateOptions, type KeyboardOptions, type LabelsOptions, type MarkClickEvent, type MarkHoverEvent, type MarkShape, type OhlcDataPoint, type OrderActionButton, type OrderActionEvent, type OrderLineOptions, POSITION_DEFAULT_COLORS, type PriceLineOptions, type PriceScaleMode, type PriceScaleOptions, type ReplayStartOptions, type ReplayState, SCRIPT_SOURCE_INPUT_VALUES, SESSION_PRESETS, type ScriptComputeResult, type ScriptIndicatorDefinition, type ScriptIndicatorInputDef, type ScriptInputHelper, type ScriptInputOptions, type ScriptPlotSpec, type SessionOptions, type SessionPresetName, type SessionSegment, type SessionSpec, type TickerLineOptions, type TimeFormat, type TimescaleMarkOptions, type TouchOptions, type TradeMarkerOptions, type UndoRedoState, type ViewportState, type WatermarkOptions, compileScriptIndicator, createChart, extractScriptInputs, isValidTimeZone, validateScriptSource };
|
|
1507
|
+
export { type AccessibilityOptions, type AlertActionEvent, type AlertCondition, type AlertOptions, type AlertTriggerEvent, type AnimationOptions, type AxisOptions, type BarMarkOptions, type BuiltInIndicatorInfo, CHART_THEMES, CHART_THEME_NAMES, type ChartClickEvent, type ChartContextMenuEvent, type ChartContextMenuRegion, type ChartDatafeed, type ChartInstance, type ChartKeyboardAction, type ChartKeyboardShortcutEvent, type ChartLongPressEvent, type ChartOptions, type ChartSavedState, type ChartTheme, type ChartThemeName, type ChartTimezone, type ChartType, type CompareSeriesOptions, type CrosshairMoveEvent, type CrosshairOptions, type CrosshairPriceActionEvent, DRAWING_ICON_STROKE_WIDTH, DRAWING_ICON_VIEWBOX, DRAWING_TOOL_ICONS, type DashPatternOptions, type DataLineOptions, type DatafeedBarsRequest, type DatafeedOptions, type DownsamplingOptions, type DrawingBounds, type DrawingDefaults, type DrawingHoverEvent, type DrawingIconName, type DrawingIconShape, type DrawingObjectOptions, type DrawingPoint, type DrawingSelectEvent, type DrawingSelectionChangeEvent, type DrawingToolType, FIB_DEFAULT_PALETTE, type GridOptions, type HistoryOptions, type IndicatorInstanceOptions, type IndicatorPane, type IndicatorPaneActionEvent, type IndicatorPaneAxisOptions, type IndicatorPaneGuideLine, type IndicatorPaneHeightChangeEvent, type IndicatorPaneRenderInfo, type IndicatorPaneValue, type IndicatorPaneValueLabel, type IndicatorPlugin, type IndicatorRenderContext, type IndicatorUpdateOptions, type KeyboardOptions, type LabelsOptions, type MarkClickEvent, type MarkHoverEvent, type MarkShape, type OhlcDataPoint, type OrderActionButton, type OrderActionEvent, type OrderLineOptions, POSITION_DEFAULT_COLORS, type PriceLineOptions, type PriceScaleMode, type PriceScaleOptions, type ReplayStartOptions, type ReplayState, SCRIPT_SOURCE_INPUT_VALUES, SESSION_PRESETS, type ScriptComputeResult, type ScriptIndicatorDefinition, type ScriptIndicatorInputDef, type ScriptInputHelper, type ScriptInputOptions, type ScriptPlotSpec, type SessionOptions, type SessionPresetName, type SessionSegment, type SessionSpec, type TickerLineOptions, type TimeFormat, type TimescaleMarkOptions, type TouchOptions, type TradeMarkerOptions, type UndoRedoState, type ViewportState, type WatermarkOptions, compileScriptIndicator, createChart, extractScriptInputs, isValidTimeZone, validateScriptSource };
|
|
@@ -3132,6 +3132,177 @@ var compileScriptIndicator = (definition) => {
|
|
|
3132
3132
|
return plugin;
|
|
3133
3133
|
};
|
|
3134
3134
|
|
|
3135
|
+
// src/icons.ts
|
|
3136
|
+
var DRAWING_ICON_VIEWBOX = 28;
|
|
3137
|
+
var DRAWING_ICON_STROKE_WIDTH = 1.6;
|
|
3138
|
+
var dot = (cx, cy) => ({ kind: "circle", cx, cy, r: 2.1 });
|
|
3139
|
+
var path = (d, extra) => ({
|
|
3140
|
+
kind: "path",
|
|
3141
|
+
d,
|
|
3142
|
+
...extra
|
|
3143
|
+
});
|
|
3144
|
+
var DRAWING_TOOL_ICONS = {
|
|
3145
|
+
"cursor-cross": [path("M14 4v6.5M14 17.5V24M4 14h6.5M17.5 14H24")],
|
|
3146
|
+
"cursor-dot": [{ kind: "circle", cx: 14, cy: 14, r: 2.6, fill: true }],
|
|
3147
|
+
"cursor-arrow": [path("M10 4.5v16.4l4.3-4.1 3 6.7 2.9-1.3-3-6.7h5.9L10 4.5Z")],
|
|
3148
|
+
trendline: [dot(7, 21), dot(21, 7), path("M8.6 19.4 19.4 8.6")],
|
|
3149
|
+
"horizontal-line": [dot(14, 14), path("M3.5 14h8.4M16.1 14h8.4")],
|
|
3150
|
+
"vertical-line": [dot(14, 14), path("M14 3.5v8.4M14 16.1v8.4")],
|
|
3151
|
+
ray: [dot(7.5, 20.5), path("M9 19 24 4")],
|
|
3152
|
+
arrow: [dot(6, 22), path("M7.6 20.4 21.4 6.6"), path("M14.6 6.2h7.2v7.2")],
|
|
3153
|
+
"parallel-channel": [dot(6, 17), dot(17, 6), path("M7.5 15.5 15.5 7.5"), path("M11 23.5 23.5 11")],
|
|
3154
|
+
"fib-retracement": [
|
|
3155
|
+
dot(6, 7),
|
|
3156
|
+
path("M9.6 7h14.9"),
|
|
3157
|
+
path("M3.5 14h21"),
|
|
3158
|
+
dot(6, 21),
|
|
3159
|
+
path("M9.6 21h14.9")
|
|
3160
|
+
],
|
|
3161
|
+
"fib-extension": [
|
|
3162
|
+
dot(6.5, 21.5),
|
|
3163
|
+
dot(12.5, 6.5),
|
|
3164
|
+
path("M7.5 19.1l4-9.2"),
|
|
3165
|
+
path("M17 7h7.5M17 14h7.5M17 21h7.5")
|
|
3166
|
+
],
|
|
3167
|
+
// Long/short: three price levels (target, entry, stop) with anchor dots and
|
|
3168
|
+
// a dotted "price path" diagonal running from entry toward the target.
|
|
3169
|
+
"long-position": [
|
|
3170
|
+
dot(5, 6.5),
|
|
3171
|
+
path("M8.6 6.5h15.9"),
|
|
3172
|
+
dot(5, 16),
|
|
3173
|
+
path("M8.6 16h10.3"),
|
|
3174
|
+
dot(21, 16),
|
|
3175
|
+
path("M8.6 22.5h15.9"),
|
|
3176
|
+
dot(5, 22.5),
|
|
3177
|
+
path("M10.5 14 22 7.8", { dash: "2 3.2" })
|
|
3178
|
+
],
|
|
3179
|
+
"short-position": [
|
|
3180
|
+
dot(5, 21.5),
|
|
3181
|
+
path("M8.6 21.5h15.9"),
|
|
3182
|
+
dot(5, 12),
|
|
3183
|
+
path("M8.6 12h10.3"),
|
|
3184
|
+
dot(21, 12),
|
|
3185
|
+
path("M8.6 5.5h15.9"),
|
|
3186
|
+
dot(5, 5.5),
|
|
3187
|
+
path("M10.5 14 22 20.2", { dash: "2 3.2" })
|
|
3188
|
+
],
|
|
3189
|
+
"price-range": [
|
|
3190
|
+
path("M8 5h12M8 23h12"),
|
|
3191
|
+
path("M14 7v14"),
|
|
3192
|
+
path("M11.2 9.8 14 7l2.8 2.8M11.2 18.2 14 21l2.8-2.8")
|
|
3193
|
+
],
|
|
3194
|
+
// Fixed range VP: two vertical range anchors with the profile bars attached
|
|
3195
|
+
// to the left one.
|
|
3196
|
+
"fixed-range-volume-profile": [
|
|
3197
|
+
path("M5 3.5v15.4"),
|
|
3198
|
+
dot(5, 21.5),
|
|
3199
|
+
dot(23, 6.5),
|
|
3200
|
+
path("M23 9.1v15.4"),
|
|
3201
|
+
{ kind: "rect", x: 5, y: 6, width: 7, height: 3.2 },
|
|
3202
|
+
{ kind: "rect", x: 5, y: 11, width: 10.5, height: 3.2 },
|
|
3203
|
+
{ kind: "rect", x: 5, y: 16, width: 4.5, height: 3.2 }
|
|
3204
|
+
],
|
|
3205
|
+
measure: [
|
|
3206
|
+
path("M4.5 18.5 18.5 4.5l5 5L9.5 23.5Z"),
|
|
3207
|
+
path("m8 15 1.8 1.8M11.5 11.5 14 14M15 8l1.8 1.8")
|
|
3208
|
+
],
|
|
3209
|
+
rectangle: [
|
|
3210
|
+
dot(6, 8),
|
|
3211
|
+
dot(22, 8),
|
|
3212
|
+
dot(22, 20),
|
|
3213
|
+
dot(6, 20),
|
|
3214
|
+
path("M8.1 8h11.8M8.1 20h11.8M6 10.1v7.8M22 10.1v7.8")
|
|
3215
|
+
],
|
|
3216
|
+
ellipse: [path("M6.1 14a7.9 6.9 0 1 0 15.8 0 7.9 6.9 0 1 0-15.8 0"), dot(4, 14), dot(24, 14)],
|
|
3217
|
+
brush: [dot(5, 20), path("M6.9 18.4c2.6-6 5-.6 8.4-3.2 3-2.3 5.4-6 8.2-7.9")],
|
|
3218
|
+
text: [path("M7 8.5V6h14v2.5"), path("M14 6v16M11 22h6")],
|
|
3219
|
+
note: [path("M5.5 5h17v11.5l-6 6h-11V5Z"), path("M22.5 16.5h-6v6")],
|
|
3220
|
+
callout: [path("M4.5 6h19v11.5H13L8 22.5v-5H4.5V6Z")],
|
|
3221
|
+
// --- Chart-UI utilities ----------------------------------------------------
|
|
3222
|
+
magnet: [
|
|
3223
|
+
path("M8.5 4.5h4v8.5a1.5 1.5 0 0 0 3 0V4.5h4V13a5.5 5.5 0 0 1-11 0V4.5Z"),
|
|
3224
|
+
path("M8.5 8.5h4M15.5 8.5h4")
|
|
3225
|
+
],
|
|
3226
|
+
trash: [
|
|
3227
|
+
path("M6.5 8h15"),
|
|
3228
|
+
path("M11 8V5.5h6V8"),
|
|
3229
|
+
path("M8.5 8l.9 14h9.2l.9-14"),
|
|
3230
|
+
path("M12 12v6.5M16 12v6.5")
|
|
3231
|
+
],
|
|
3232
|
+
pencil: [path("M5 23l.9-3.9L19 6a2.1 2.1 0 0 1 3 3L8.9 22.1 5 23Z"), path("M17.5 7.5l3 3")],
|
|
3233
|
+
"eye-off": [
|
|
3234
|
+
path("M4 14c2.6-4.6 6-6.9 10-6.9s7.4 2.3 10 6.9c-2.6 4.6-6 6.9-10 6.9S6.6 18.6 4 14Z"),
|
|
3235
|
+
{ kind: "circle", cx: 14, cy: 14, r: 3 },
|
|
3236
|
+
path("M6.5 22.5l15-17")
|
|
3237
|
+
],
|
|
3238
|
+
lock: [
|
|
3239
|
+
path("M10 12V8.8a4 4 0 0 1 8 0V12"),
|
|
3240
|
+
{ kind: "rect", x: 7, y: 12, width: 14, height: 10.5 },
|
|
3241
|
+
{ kind: "circle", cx: 14, cy: 17, r: 1.4 }
|
|
3242
|
+
],
|
|
3243
|
+
unlock: [
|
|
3244
|
+
path("M10 12V8.8a4 4 0 0 1 7.7-1.5"),
|
|
3245
|
+
{ kind: "rect", x: 7, y: 12, width: 14, height: 10.5 },
|
|
3246
|
+
{ kind: "circle", cx: 14, cy: 17, r: 1.4 }
|
|
3247
|
+
],
|
|
3248
|
+
clone: [
|
|
3249
|
+
{ kind: "rect", x: 10, y: 10, width: 12.5, height: 12.5 },
|
|
3250
|
+
path("M5.5 18V7a1.5 1.5 0 0 1 1.5-1.5h11")
|
|
3251
|
+
],
|
|
3252
|
+
// Sliders, drawn with the pack's anchor-dot knobs.
|
|
3253
|
+
settings: [
|
|
3254
|
+
path("M4 10h5.4"),
|
|
3255
|
+
dot(11.5, 10),
|
|
3256
|
+
path("M13.6 10H24"),
|
|
3257
|
+
path("M4 18h9.4"),
|
|
3258
|
+
dot(15.5, 18),
|
|
3259
|
+
path("M17.6 18H24")
|
|
3260
|
+
],
|
|
3261
|
+
"source-code": [path("M10.5 8 4.5 14l6 6"), path("M17.5 8l6 6-6 6")],
|
|
3262
|
+
"go-to-realtime": [path("M23.5 5.5v17"), path("M3.5 14h14.2"), path("M13.2 9.5 17.7 14l-4.5 4.5")],
|
|
3263
|
+
"fit-bars": [
|
|
3264
|
+
path("M4.5 5.5v17M23.5 5.5v17"),
|
|
3265
|
+
path("M8.5 14h11"),
|
|
3266
|
+
path("M12 10.5 8.5 14l3.5 3.5M16 10.5l3.5 3.5-3.5 3.5")
|
|
3267
|
+
],
|
|
3268
|
+
reset: [
|
|
3269
|
+
path("M3.5 14a10.5 10.5 0 1 0 10.5-10.5c-3 0-5.8 1.3-7.9 3.2L3.5 9.3"),
|
|
3270
|
+
path("M3.5 3.5v5.8h5.8")
|
|
3271
|
+
],
|
|
3272
|
+
"log-scale": [path("M5 4.5V23.5H24"), path("M7.5 21C13 19.5 19 13.5 21.5 6.5")],
|
|
3273
|
+
"percent-scale": [
|
|
3274
|
+
{ kind: "circle", cx: 9, cy: 9, r: 2.7 },
|
|
3275
|
+
{ kind: "circle", cx: 19, cy: 19, r: 2.7 },
|
|
3276
|
+
path("M6 22 22 6")
|
|
3277
|
+
],
|
|
3278
|
+
"invert-scale": [
|
|
3279
|
+
path("M9.5 22V6.5"),
|
|
3280
|
+
path("M5.5 10.5 9.5 6.5l4 4"),
|
|
3281
|
+
path("M18.5 6v15.5"),
|
|
3282
|
+
path("M14.5 17.5l4 4 4-4")
|
|
3283
|
+
],
|
|
3284
|
+
"arrow-up": [path("M14 22.5V6"), path("M7.5 12.5 14 6l6.5 6.5")],
|
|
3285
|
+
"arrow-down": [path("M14 5.5V22"), path("M7.5 15.5 14 22l6.5-6.5")],
|
|
3286
|
+
replay: [path("M4.5 5.5v17"), path("M9.3 14H24"), path("M13.8 9.5 9.3 14l4.5 4.5")],
|
|
3287
|
+
play: [path("M10 6.3v15.4L22.5 14 10 6.3Z")],
|
|
3288
|
+
pause: [path("M10.5 6.5v15M17.5 6.5v15")],
|
|
3289
|
+
"skip-back": [path("M7 6.5v15"), path("M21 6.9v14.2L10 14 21 6.9Z")],
|
|
3290
|
+
"skip-forward": [path("M21 6.5v15"), path("M7 6.9v14.2L18 14 7 6.9Z")],
|
|
3291
|
+
// Alarm clock — the alert metaphor traders know from other platforms.
|
|
3292
|
+
alert: [
|
|
3293
|
+
{ kind: "circle", cx: 14, cy: 15.5, r: 7.5 },
|
|
3294
|
+
path("M14 11.5v4l3 1.8"),
|
|
3295
|
+
path("M4.9 8.4 8 5.6M23.1 8.4 20 5.6")
|
|
3296
|
+
],
|
|
3297
|
+
anchor: [
|
|
3298
|
+
{ kind: "circle", cx: 14, cy: 5.8, r: 2.1 },
|
|
3299
|
+
path("M14 7.9V23.5"),
|
|
3300
|
+
path("M9.5 11.5h9"),
|
|
3301
|
+
path("M5 14.5a9 9 0 0 0 18 0")
|
|
3302
|
+
],
|
|
3303
|
+
indicators: [path("M4 19.5l5.5-6.5 4.5 4.5 9.5-11")]
|
|
3304
|
+
};
|
|
3305
|
+
|
|
3135
3306
|
// src/themes.ts
|
|
3136
3307
|
var CHART_THEMES = {
|
|
3137
3308
|
midnight: {
|
|
@@ -4654,9 +4825,9 @@ function createChart(element, options = {}) {
|
|
|
4654
4825
|
const groupThousands = (value, decimals) => {
|
|
4655
4826
|
const negative = value < 0;
|
|
4656
4827
|
const fixed = Math.abs(value).toFixed(decimals);
|
|
4657
|
-
const
|
|
4658
|
-
const intPart =
|
|
4659
|
-
const decPart =
|
|
4828
|
+
const dot2 = fixed.indexOf(".");
|
|
4829
|
+
const intPart = dot2 === -1 ? fixed : fixed.slice(0, dot2);
|
|
4830
|
+
const decPart = dot2 === -1 ? "" : fixed.slice(dot2);
|
|
4660
4831
|
const grouped = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
4661
4832
|
return `${negative ? "-" : ""}${grouped}${decPart}`;
|
|
4662
4833
|
};
|
|
@@ -7236,12 +7407,12 @@ function createChart(element, options = {}) {
|
|
|
7236
7407
|
const upColumns = new Path2D();
|
|
7237
7408
|
const downColumns = new Path2D();
|
|
7238
7409
|
for (const column of seriesColumns) {
|
|
7239
|
-
const
|
|
7410
|
+
const path2 = column.close >= column.open ? upColumns : downColumns;
|
|
7240
7411
|
const x = column.x + 0.5;
|
|
7241
7412
|
const top = crisp(yFromPrice(column.high));
|
|
7242
7413
|
const bottom = crisp(yFromPrice(column.low));
|
|
7243
|
-
|
|
7244
|
-
|
|
7414
|
+
path2.moveTo(x, top);
|
|
7415
|
+
path2.lineTo(x, bottom === top ? bottom + 1 : bottom);
|
|
7245
7416
|
}
|
|
7246
7417
|
ctx.lineWidth = 1;
|
|
7247
7418
|
ctx.strokeStyle = mergedOptions.upColor;
|
|
@@ -7384,16 +7555,16 @@ function createChart(element, options = {}) {
|
|
|
7384
7555
|
const displayLow = isLastCandle && actualDirection === "down" ? Math.min(point.l, displayClose) : point.l;
|
|
7385
7556
|
const roundedCenterX = Math.round(chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth);
|
|
7386
7557
|
const direction = isLastCandle ? actualDirection : getCandleDirectionByIndex(index);
|
|
7387
|
-
const
|
|
7558
|
+
const path2 = direction === "up" ? upBars : downBars;
|
|
7388
7559
|
const centerX = roundedCenterX + 0.5;
|
|
7389
|
-
|
|
7390
|
-
|
|
7560
|
+
path2.moveTo(centerX, crisp(yFromPrice(displayHigh)));
|
|
7561
|
+
path2.lineTo(centerX, crisp(yFromPrice(displayLow)));
|
|
7391
7562
|
const openY = crisp(yFromPrice(point.o));
|
|
7392
7563
|
const closeY = crisp(yFromPrice(displayClose));
|
|
7393
|
-
|
|
7394
|
-
|
|
7395
|
-
|
|
7396
|
-
|
|
7564
|
+
path2.moveTo(centerX - tickLength, openY);
|
|
7565
|
+
path2.lineTo(centerX, openY);
|
|
7566
|
+
path2.moveTo(centerX, closeY);
|
|
7567
|
+
path2.lineTo(centerX + tickLength, closeY);
|
|
7397
7568
|
}
|
|
7398
7569
|
ctx.lineWidth = Math.max(1, candleWickWidth);
|
|
7399
7570
|
ctx.strokeStyle = mergedOptions.upColor;
|
|
@@ -7461,7 +7632,7 @@ function createChart(element, options = {}) {
|
|
|
7461
7632
|
for (const plan of comparePlans) {
|
|
7462
7633
|
const color = plan.state.options.color ?? "#f59e0b";
|
|
7463
7634
|
const lineWidth = Math.max(1, plan.state.options.lineWidth ?? 1.5);
|
|
7464
|
-
const
|
|
7635
|
+
const path2 = new Path2D();
|
|
7465
7636
|
let started = false;
|
|
7466
7637
|
let firstX = 0;
|
|
7467
7638
|
let lastX = 0;
|
|
@@ -7469,11 +7640,11 @@ function createChart(element, options = {}) {
|
|
|
7469
7640
|
let lastPrice = Number.NaN;
|
|
7470
7641
|
const emit = (x, y) => {
|
|
7471
7642
|
if (!started) {
|
|
7472
|
-
|
|
7643
|
+
path2.moveTo(x, y);
|
|
7473
7644
|
firstX = x;
|
|
7474
7645
|
started = true;
|
|
7475
7646
|
} else {
|
|
7476
|
-
|
|
7647
|
+
path2.lineTo(x, y);
|
|
7477
7648
|
}
|
|
7478
7649
|
lastX = x;
|
|
7479
7650
|
lastY = y;
|
|
@@ -7531,7 +7702,7 @@ function createChart(element, options = {}) {
|
|
|
7531
7702
|
}
|
|
7532
7703
|
if (!started) continue;
|
|
7533
7704
|
if (plan.state.options.style === "area") {
|
|
7534
|
-
const fillPath = new Path2D(
|
|
7705
|
+
const fillPath = new Path2D(path2);
|
|
7535
7706
|
fillPath.lineTo(lastX, chartBottom);
|
|
7536
7707
|
fillPath.lineTo(firstX, chartBottom);
|
|
7537
7708
|
fillPath.closePath();
|
|
@@ -7545,7 +7716,7 @@ function createChart(element, options = {}) {
|
|
|
7545
7716
|
ctx.strokeStyle = color;
|
|
7546
7717
|
ctx.lineWidth = lineWidth;
|
|
7547
7718
|
ctx.lineJoin = "round";
|
|
7548
|
-
ctx.stroke(
|
|
7719
|
+
ctx.stroke(path2);
|
|
7549
7720
|
ctx.restore();
|
|
7550
7721
|
if (Number.isFinite(lastPrice)) {
|
|
7551
7722
|
const label = plan.state.options.label ?? plan.state.options.id;
|
|
@@ -12349,6 +12520,9 @@ function createChart(element, options = {}) {
|
|
|
12349
12520
|
export {
|
|
12350
12521
|
CHART_THEMES,
|
|
12351
12522
|
CHART_THEME_NAMES,
|
|
12523
|
+
DRAWING_ICON_STROKE_WIDTH,
|
|
12524
|
+
DRAWING_ICON_VIEWBOX,
|
|
12525
|
+
DRAWING_TOOL_ICONS,
|
|
12352
12526
|
FIB_DEFAULT_PALETTE,
|
|
12353
12527
|
POSITION_DEFAULT_COLORS,
|
|
12354
12528
|
SCRIPT_SOURCE_INPUT_VALUES,
|
package/dist/index.cjs
CHANGED
|
@@ -22,6 +22,9 @@ var index_exports = {};
|
|
|
22
22
|
__export(index_exports, {
|
|
23
23
|
CHART_THEMES: () => CHART_THEMES,
|
|
24
24
|
CHART_THEME_NAMES: () => CHART_THEME_NAMES,
|
|
25
|
+
DRAWING_ICON_STROKE_WIDTH: () => DRAWING_ICON_STROKE_WIDTH,
|
|
26
|
+
DRAWING_ICON_VIEWBOX: () => DRAWING_ICON_VIEWBOX,
|
|
27
|
+
DRAWING_TOOL_ICONS: () => DRAWING_TOOL_ICONS,
|
|
25
28
|
FIB_DEFAULT_PALETTE: () => FIB_DEFAULT_PALETTE,
|
|
26
29
|
POSITION_DEFAULT_COLORS: () => POSITION_DEFAULT_COLORS,
|
|
27
30
|
SCRIPT_SOURCE_INPUT_VALUES: () => SCRIPT_SOURCE_INPUT_VALUES,
|
|
@@ -3168,6 +3171,177 @@ var compileScriptIndicator = (definition) => {
|
|
|
3168
3171
|
return plugin;
|
|
3169
3172
|
};
|
|
3170
3173
|
|
|
3174
|
+
// src/icons.ts
|
|
3175
|
+
var DRAWING_ICON_VIEWBOX = 28;
|
|
3176
|
+
var DRAWING_ICON_STROKE_WIDTH = 1.6;
|
|
3177
|
+
var dot = (cx, cy) => ({ kind: "circle", cx, cy, r: 2.1 });
|
|
3178
|
+
var path = (d, extra) => ({
|
|
3179
|
+
kind: "path",
|
|
3180
|
+
d,
|
|
3181
|
+
...extra
|
|
3182
|
+
});
|
|
3183
|
+
var DRAWING_TOOL_ICONS = {
|
|
3184
|
+
"cursor-cross": [path("M14 4v6.5M14 17.5V24M4 14h6.5M17.5 14H24")],
|
|
3185
|
+
"cursor-dot": [{ kind: "circle", cx: 14, cy: 14, r: 2.6, fill: true }],
|
|
3186
|
+
"cursor-arrow": [path("M10 4.5v16.4l4.3-4.1 3 6.7 2.9-1.3-3-6.7h5.9L10 4.5Z")],
|
|
3187
|
+
trendline: [dot(7, 21), dot(21, 7), path("M8.6 19.4 19.4 8.6")],
|
|
3188
|
+
"horizontal-line": [dot(14, 14), path("M3.5 14h8.4M16.1 14h8.4")],
|
|
3189
|
+
"vertical-line": [dot(14, 14), path("M14 3.5v8.4M14 16.1v8.4")],
|
|
3190
|
+
ray: [dot(7.5, 20.5), path("M9 19 24 4")],
|
|
3191
|
+
arrow: [dot(6, 22), path("M7.6 20.4 21.4 6.6"), path("M14.6 6.2h7.2v7.2")],
|
|
3192
|
+
"parallel-channel": [dot(6, 17), dot(17, 6), path("M7.5 15.5 15.5 7.5"), path("M11 23.5 23.5 11")],
|
|
3193
|
+
"fib-retracement": [
|
|
3194
|
+
dot(6, 7),
|
|
3195
|
+
path("M9.6 7h14.9"),
|
|
3196
|
+
path("M3.5 14h21"),
|
|
3197
|
+
dot(6, 21),
|
|
3198
|
+
path("M9.6 21h14.9")
|
|
3199
|
+
],
|
|
3200
|
+
"fib-extension": [
|
|
3201
|
+
dot(6.5, 21.5),
|
|
3202
|
+
dot(12.5, 6.5),
|
|
3203
|
+
path("M7.5 19.1l4-9.2"),
|
|
3204
|
+
path("M17 7h7.5M17 14h7.5M17 21h7.5")
|
|
3205
|
+
],
|
|
3206
|
+
// Long/short: three price levels (target, entry, stop) with anchor dots and
|
|
3207
|
+
// a dotted "price path" diagonal running from entry toward the target.
|
|
3208
|
+
"long-position": [
|
|
3209
|
+
dot(5, 6.5),
|
|
3210
|
+
path("M8.6 6.5h15.9"),
|
|
3211
|
+
dot(5, 16),
|
|
3212
|
+
path("M8.6 16h10.3"),
|
|
3213
|
+
dot(21, 16),
|
|
3214
|
+
path("M8.6 22.5h15.9"),
|
|
3215
|
+
dot(5, 22.5),
|
|
3216
|
+
path("M10.5 14 22 7.8", { dash: "2 3.2" })
|
|
3217
|
+
],
|
|
3218
|
+
"short-position": [
|
|
3219
|
+
dot(5, 21.5),
|
|
3220
|
+
path("M8.6 21.5h15.9"),
|
|
3221
|
+
dot(5, 12),
|
|
3222
|
+
path("M8.6 12h10.3"),
|
|
3223
|
+
dot(21, 12),
|
|
3224
|
+
path("M8.6 5.5h15.9"),
|
|
3225
|
+
dot(5, 5.5),
|
|
3226
|
+
path("M10.5 14 22 20.2", { dash: "2 3.2" })
|
|
3227
|
+
],
|
|
3228
|
+
"price-range": [
|
|
3229
|
+
path("M8 5h12M8 23h12"),
|
|
3230
|
+
path("M14 7v14"),
|
|
3231
|
+
path("M11.2 9.8 14 7l2.8 2.8M11.2 18.2 14 21l2.8-2.8")
|
|
3232
|
+
],
|
|
3233
|
+
// Fixed range VP: two vertical range anchors with the profile bars attached
|
|
3234
|
+
// to the left one.
|
|
3235
|
+
"fixed-range-volume-profile": [
|
|
3236
|
+
path("M5 3.5v15.4"),
|
|
3237
|
+
dot(5, 21.5),
|
|
3238
|
+
dot(23, 6.5),
|
|
3239
|
+
path("M23 9.1v15.4"),
|
|
3240
|
+
{ kind: "rect", x: 5, y: 6, width: 7, height: 3.2 },
|
|
3241
|
+
{ kind: "rect", x: 5, y: 11, width: 10.5, height: 3.2 },
|
|
3242
|
+
{ kind: "rect", x: 5, y: 16, width: 4.5, height: 3.2 }
|
|
3243
|
+
],
|
|
3244
|
+
measure: [
|
|
3245
|
+
path("M4.5 18.5 18.5 4.5l5 5L9.5 23.5Z"),
|
|
3246
|
+
path("m8 15 1.8 1.8M11.5 11.5 14 14M15 8l1.8 1.8")
|
|
3247
|
+
],
|
|
3248
|
+
rectangle: [
|
|
3249
|
+
dot(6, 8),
|
|
3250
|
+
dot(22, 8),
|
|
3251
|
+
dot(22, 20),
|
|
3252
|
+
dot(6, 20),
|
|
3253
|
+
path("M8.1 8h11.8M8.1 20h11.8M6 10.1v7.8M22 10.1v7.8")
|
|
3254
|
+
],
|
|
3255
|
+
ellipse: [path("M6.1 14a7.9 6.9 0 1 0 15.8 0 7.9 6.9 0 1 0-15.8 0"), dot(4, 14), dot(24, 14)],
|
|
3256
|
+
brush: [dot(5, 20), path("M6.9 18.4c2.6-6 5-.6 8.4-3.2 3-2.3 5.4-6 8.2-7.9")],
|
|
3257
|
+
text: [path("M7 8.5V6h14v2.5"), path("M14 6v16M11 22h6")],
|
|
3258
|
+
note: [path("M5.5 5h17v11.5l-6 6h-11V5Z"), path("M22.5 16.5h-6v6")],
|
|
3259
|
+
callout: [path("M4.5 6h19v11.5H13L8 22.5v-5H4.5V6Z")],
|
|
3260
|
+
// --- Chart-UI utilities ----------------------------------------------------
|
|
3261
|
+
magnet: [
|
|
3262
|
+
path("M8.5 4.5h4v8.5a1.5 1.5 0 0 0 3 0V4.5h4V13a5.5 5.5 0 0 1-11 0V4.5Z"),
|
|
3263
|
+
path("M8.5 8.5h4M15.5 8.5h4")
|
|
3264
|
+
],
|
|
3265
|
+
trash: [
|
|
3266
|
+
path("M6.5 8h15"),
|
|
3267
|
+
path("M11 8V5.5h6V8"),
|
|
3268
|
+
path("M8.5 8l.9 14h9.2l.9-14"),
|
|
3269
|
+
path("M12 12v6.5M16 12v6.5")
|
|
3270
|
+
],
|
|
3271
|
+
pencil: [path("M5 23l.9-3.9L19 6a2.1 2.1 0 0 1 3 3L8.9 22.1 5 23Z"), path("M17.5 7.5l3 3")],
|
|
3272
|
+
"eye-off": [
|
|
3273
|
+
path("M4 14c2.6-4.6 6-6.9 10-6.9s7.4 2.3 10 6.9c-2.6 4.6-6 6.9-10 6.9S6.6 18.6 4 14Z"),
|
|
3274
|
+
{ kind: "circle", cx: 14, cy: 14, r: 3 },
|
|
3275
|
+
path("M6.5 22.5l15-17")
|
|
3276
|
+
],
|
|
3277
|
+
lock: [
|
|
3278
|
+
path("M10 12V8.8a4 4 0 0 1 8 0V12"),
|
|
3279
|
+
{ kind: "rect", x: 7, y: 12, width: 14, height: 10.5 },
|
|
3280
|
+
{ kind: "circle", cx: 14, cy: 17, r: 1.4 }
|
|
3281
|
+
],
|
|
3282
|
+
unlock: [
|
|
3283
|
+
path("M10 12V8.8a4 4 0 0 1 7.7-1.5"),
|
|
3284
|
+
{ kind: "rect", x: 7, y: 12, width: 14, height: 10.5 },
|
|
3285
|
+
{ kind: "circle", cx: 14, cy: 17, r: 1.4 }
|
|
3286
|
+
],
|
|
3287
|
+
clone: [
|
|
3288
|
+
{ kind: "rect", x: 10, y: 10, width: 12.5, height: 12.5 },
|
|
3289
|
+
path("M5.5 18V7a1.5 1.5 0 0 1 1.5-1.5h11")
|
|
3290
|
+
],
|
|
3291
|
+
// Sliders, drawn with the pack's anchor-dot knobs.
|
|
3292
|
+
settings: [
|
|
3293
|
+
path("M4 10h5.4"),
|
|
3294
|
+
dot(11.5, 10),
|
|
3295
|
+
path("M13.6 10H24"),
|
|
3296
|
+
path("M4 18h9.4"),
|
|
3297
|
+
dot(15.5, 18),
|
|
3298
|
+
path("M17.6 18H24")
|
|
3299
|
+
],
|
|
3300
|
+
"source-code": [path("M10.5 8 4.5 14l6 6"), path("M17.5 8l6 6-6 6")],
|
|
3301
|
+
"go-to-realtime": [path("M23.5 5.5v17"), path("M3.5 14h14.2"), path("M13.2 9.5 17.7 14l-4.5 4.5")],
|
|
3302
|
+
"fit-bars": [
|
|
3303
|
+
path("M4.5 5.5v17M23.5 5.5v17"),
|
|
3304
|
+
path("M8.5 14h11"),
|
|
3305
|
+
path("M12 10.5 8.5 14l3.5 3.5M16 10.5l3.5 3.5-3.5 3.5")
|
|
3306
|
+
],
|
|
3307
|
+
reset: [
|
|
3308
|
+
path("M3.5 14a10.5 10.5 0 1 0 10.5-10.5c-3 0-5.8 1.3-7.9 3.2L3.5 9.3"),
|
|
3309
|
+
path("M3.5 3.5v5.8h5.8")
|
|
3310
|
+
],
|
|
3311
|
+
"log-scale": [path("M5 4.5V23.5H24"), path("M7.5 21C13 19.5 19 13.5 21.5 6.5")],
|
|
3312
|
+
"percent-scale": [
|
|
3313
|
+
{ kind: "circle", cx: 9, cy: 9, r: 2.7 },
|
|
3314
|
+
{ kind: "circle", cx: 19, cy: 19, r: 2.7 },
|
|
3315
|
+
path("M6 22 22 6")
|
|
3316
|
+
],
|
|
3317
|
+
"invert-scale": [
|
|
3318
|
+
path("M9.5 22V6.5"),
|
|
3319
|
+
path("M5.5 10.5 9.5 6.5l4 4"),
|
|
3320
|
+
path("M18.5 6v15.5"),
|
|
3321
|
+
path("M14.5 17.5l4 4 4-4")
|
|
3322
|
+
],
|
|
3323
|
+
"arrow-up": [path("M14 22.5V6"), path("M7.5 12.5 14 6l6.5 6.5")],
|
|
3324
|
+
"arrow-down": [path("M14 5.5V22"), path("M7.5 15.5 14 22l6.5-6.5")],
|
|
3325
|
+
replay: [path("M4.5 5.5v17"), path("M9.3 14H24"), path("M13.8 9.5 9.3 14l4.5 4.5")],
|
|
3326
|
+
play: [path("M10 6.3v15.4L22.5 14 10 6.3Z")],
|
|
3327
|
+
pause: [path("M10.5 6.5v15M17.5 6.5v15")],
|
|
3328
|
+
"skip-back": [path("M7 6.5v15"), path("M21 6.9v14.2L10 14 21 6.9Z")],
|
|
3329
|
+
"skip-forward": [path("M21 6.5v15"), path("M7 6.9v14.2L18 14 7 6.9Z")],
|
|
3330
|
+
// Alarm clock — the alert metaphor traders know from other platforms.
|
|
3331
|
+
alert: [
|
|
3332
|
+
{ kind: "circle", cx: 14, cy: 15.5, r: 7.5 },
|
|
3333
|
+
path("M14 11.5v4l3 1.8"),
|
|
3334
|
+
path("M4.9 8.4 8 5.6M23.1 8.4 20 5.6")
|
|
3335
|
+
],
|
|
3336
|
+
anchor: [
|
|
3337
|
+
{ kind: "circle", cx: 14, cy: 5.8, r: 2.1 },
|
|
3338
|
+
path("M14 7.9V23.5"),
|
|
3339
|
+
path("M9.5 11.5h9"),
|
|
3340
|
+
path("M5 14.5a9 9 0 0 0 18 0")
|
|
3341
|
+
],
|
|
3342
|
+
indicators: [path("M4 19.5l5.5-6.5 4.5 4.5 9.5-11")]
|
|
3343
|
+
};
|
|
3344
|
+
|
|
3171
3345
|
// src/themes.ts
|
|
3172
3346
|
var CHART_THEMES = {
|
|
3173
3347
|
midnight: {
|
|
@@ -4690,9 +4864,9 @@ function createChart(element, options = {}) {
|
|
|
4690
4864
|
const groupThousands = (value, decimals) => {
|
|
4691
4865
|
const negative = value < 0;
|
|
4692
4866
|
const fixed = Math.abs(value).toFixed(decimals);
|
|
4693
|
-
const
|
|
4694
|
-
const intPart =
|
|
4695
|
-
const decPart =
|
|
4867
|
+
const dot2 = fixed.indexOf(".");
|
|
4868
|
+
const intPart = dot2 === -1 ? fixed : fixed.slice(0, dot2);
|
|
4869
|
+
const decPart = dot2 === -1 ? "" : fixed.slice(dot2);
|
|
4696
4870
|
const grouped = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
4697
4871
|
return `${negative ? "-" : ""}${grouped}${decPart}`;
|
|
4698
4872
|
};
|
|
@@ -7272,12 +7446,12 @@ function createChart(element, options = {}) {
|
|
|
7272
7446
|
const upColumns = new Path2D();
|
|
7273
7447
|
const downColumns = new Path2D();
|
|
7274
7448
|
for (const column of seriesColumns) {
|
|
7275
|
-
const
|
|
7449
|
+
const path2 = column.close >= column.open ? upColumns : downColumns;
|
|
7276
7450
|
const x = column.x + 0.5;
|
|
7277
7451
|
const top = crisp(yFromPrice(column.high));
|
|
7278
7452
|
const bottom = crisp(yFromPrice(column.low));
|
|
7279
|
-
|
|
7280
|
-
|
|
7453
|
+
path2.moveTo(x, top);
|
|
7454
|
+
path2.lineTo(x, bottom === top ? bottom + 1 : bottom);
|
|
7281
7455
|
}
|
|
7282
7456
|
ctx.lineWidth = 1;
|
|
7283
7457
|
ctx.strokeStyle = mergedOptions.upColor;
|
|
@@ -7420,16 +7594,16 @@ function createChart(element, options = {}) {
|
|
|
7420
7594
|
const displayLow = isLastCandle && actualDirection === "down" ? Math.min(point.l, displayClose) : point.l;
|
|
7421
7595
|
const roundedCenterX = Math.round(chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth);
|
|
7422
7596
|
const direction = isLastCandle ? actualDirection : getCandleDirectionByIndex(index);
|
|
7423
|
-
const
|
|
7597
|
+
const path2 = direction === "up" ? upBars : downBars;
|
|
7424
7598
|
const centerX = roundedCenterX + 0.5;
|
|
7425
|
-
|
|
7426
|
-
|
|
7599
|
+
path2.moveTo(centerX, crisp(yFromPrice(displayHigh)));
|
|
7600
|
+
path2.lineTo(centerX, crisp(yFromPrice(displayLow)));
|
|
7427
7601
|
const openY = crisp(yFromPrice(point.o));
|
|
7428
7602
|
const closeY = crisp(yFromPrice(displayClose));
|
|
7429
|
-
|
|
7430
|
-
|
|
7431
|
-
|
|
7432
|
-
|
|
7603
|
+
path2.moveTo(centerX - tickLength, openY);
|
|
7604
|
+
path2.lineTo(centerX, openY);
|
|
7605
|
+
path2.moveTo(centerX, closeY);
|
|
7606
|
+
path2.lineTo(centerX + tickLength, closeY);
|
|
7433
7607
|
}
|
|
7434
7608
|
ctx.lineWidth = Math.max(1, candleWickWidth);
|
|
7435
7609
|
ctx.strokeStyle = mergedOptions.upColor;
|
|
@@ -7497,7 +7671,7 @@ function createChart(element, options = {}) {
|
|
|
7497
7671
|
for (const plan of comparePlans) {
|
|
7498
7672
|
const color = plan.state.options.color ?? "#f59e0b";
|
|
7499
7673
|
const lineWidth = Math.max(1, plan.state.options.lineWidth ?? 1.5);
|
|
7500
|
-
const
|
|
7674
|
+
const path2 = new Path2D();
|
|
7501
7675
|
let started = false;
|
|
7502
7676
|
let firstX = 0;
|
|
7503
7677
|
let lastX = 0;
|
|
@@ -7505,11 +7679,11 @@ function createChart(element, options = {}) {
|
|
|
7505
7679
|
let lastPrice = Number.NaN;
|
|
7506
7680
|
const emit = (x, y) => {
|
|
7507
7681
|
if (!started) {
|
|
7508
|
-
|
|
7682
|
+
path2.moveTo(x, y);
|
|
7509
7683
|
firstX = x;
|
|
7510
7684
|
started = true;
|
|
7511
7685
|
} else {
|
|
7512
|
-
|
|
7686
|
+
path2.lineTo(x, y);
|
|
7513
7687
|
}
|
|
7514
7688
|
lastX = x;
|
|
7515
7689
|
lastY = y;
|
|
@@ -7567,7 +7741,7 @@ function createChart(element, options = {}) {
|
|
|
7567
7741
|
}
|
|
7568
7742
|
if (!started) continue;
|
|
7569
7743
|
if (plan.state.options.style === "area") {
|
|
7570
|
-
const fillPath = new Path2D(
|
|
7744
|
+
const fillPath = new Path2D(path2);
|
|
7571
7745
|
fillPath.lineTo(lastX, chartBottom);
|
|
7572
7746
|
fillPath.lineTo(firstX, chartBottom);
|
|
7573
7747
|
fillPath.closePath();
|
|
@@ -7581,7 +7755,7 @@ function createChart(element, options = {}) {
|
|
|
7581
7755
|
ctx.strokeStyle = color;
|
|
7582
7756
|
ctx.lineWidth = lineWidth;
|
|
7583
7757
|
ctx.lineJoin = "round";
|
|
7584
|
-
ctx.stroke(
|
|
7758
|
+
ctx.stroke(path2);
|
|
7585
7759
|
ctx.restore();
|
|
7586
7760
|
if (Number.isFinite(lastPrice)) {
|
|
7587
7761
|
const label = plan.state.options.label ?? plan.state.options.id;
|
|
@@ -12386,6 +12560,9 @@ function createChart(element, options = {}) {
|
|
|
12386
12560
|
0 && (module.exports = {
|
|
12387
12561
|
CHART_THEMES,
|
|
12388
12562
|
CHART_THEME_NAMES,
|
|
12563
|
+
DRAWING_ICON_STROKE_WIDTH,
|
|
12564
|
+
DRAWING_ICON_VIEWBOX,
|
|
12565
|
+
DRAWING_TOOL_ICONS,
|
|
12389
12566
|
FIB_DEFAULT_PALETTE,
|
|
12390
12567
|
POSITION_DEFAULT_COLORS,
|
|
12391
12568
|
SCRIPT_SOURCE_INPUT_VALUES,
|
package/dist/index.d.cts
CHANGED
|
@@ -1441,6 +1441,45 @@ declare const validateScriptSource: (source: string) => string | null;
|
|
|
1441
1441
|
*/
|
|
1442
1442
|
declare const compileScriptIndicator: (definition: ScriptIndicatorDefinition) => IndicatorPlugin;
|
|
1443
1443
|
|
|
1444
|
+
/**
|
|
1445
|
+
* Hyperprop drawing-tool icon pack — framework-agnostic geometry.
|
|
1446
|
+
*
|
|
1447
|
+
* Original artwork drawn in the visual language traders know from desktop
|
|
1448
|
+
* charting platforms: a 28x28 grid, thin round-capped outlines, and hollow
|
|
1449
|
+
* "anchor" dots on anything line-based (a dot marks a draggable point of the
|
|
1450
|
+
* tool). The data here is plain shape descriptions so every consumer renders
|
|
1451
|
+
* the identical set: the web terminal maps it to DOM `<svg>` elements and the
|
|
1452
|
+
* mobile app to react-native-svg components.
|
|
1453
|
+
*
|
|
1454
|
+
* Design rules when adding icons:
|
|
1455
|
+
* - viewBox 0 0 28 28, strokeWidth 1.6, round caps/joins, no fill (except
|
|
1456
|
+
* shapes marked `fill: true`).
|
|
1457
|
+
* - Anchor dots are hollow circles r=2.1; lines stop ~1.5px short of them.
|
|
1458
|
+
* - Keep 3.5px padding to the edges so glyphs optically match.
|
|
1459
|
+
*/
|
|
1460
|
+
type DrawingIconShape = {
|
|
1461
|
+
kind: "path";
|
|
1462
|
+
d: string;
|
|
1463
|
+
dash?: string;
|
|
1464
|
+
fill?: boolean;
|
|
1465
|
+
} | {
|
|
1466
|
+
kind: "circle";
|
|
1467
|
+
cx: number;
|
|
1468
|
+
cy: number;
|
|
1469
|
+
r: number;
|
|
1470
|
+
fill?: boolean;
|
|
1471
|
+
} | {
|
|
1472
|
+
kind: "rect";
|
|
1473
|
+
x: number;
|
|
1474
|
+
y: number;
|
|
1475
|
+
width: number;
|
|
1476
|
+
height: number;
|
|
1477
|
+
};
|
|
1478
|
+
type DrawingIconName = "cursor-cross" | "cursor-dot" | "cursor-arrow" | "trendline" | "horizontal-line" | "vertical-line" | "ray" | "arrow" | "parallel-channel" | "fib-retracement" | "fib-extension" | "long-position" | "short-position" | "price-range" | "fixed-range-volume-profile" | "measure" | "rectangle" | "ellipse" | "brush" | "text" | "note" | "callout" | "magnet" | "trash" | "pencil" | "eye-off" | "lock" | "unlock" | "clone" | "settings" | "source-code" | "go-to-realtime" | "fit-bars" | "reset" | "log-scale" | "percent-scale" | "invert-scale" | "arrow-up" | "arrow-down" | "replay" | "play" | "pause" | "skip-back" | "skip-forward" | "alert" | "anchor" | "indicators";
|
|
1479
|
+
declare const DRAWING_ICON_VIEWBOX = 28;
|
|
1480
|
+
declare const DRAWING_ICON_STROKE_WIDTH = 1.6;
|
|
1481
|
+
declare const DRAWING_TOOL_ICONS: Record<DrawingIconName, DrawingIconShape[]>;
|
|
1482
|
+
|
|
1444
1483
|
/**
|
|
1445
1484
|
* Built-in palettes.
|
|
1446
1485
|
*
|
|
@@ -1465,4 +1504,4 @@ declare const SESSION_PRESETS: Record<SessionPresetName, SessionSpec>;
|
|
|
1465
1504
|
|
|
1466
1505
|
declare function createChart(element: HTMLElement, options?: ChartOptions): ChartInstance;
|
|
1467
1506
|
|
|
1468
|
-
export { type AccessibilityOptions, type AlertActionEvent, type AlertCondition, type AlertOptions, type AlertTriggerEvent, type AnimationOptions, type AxisOptions, type BarMarkOptions, type BuiltInIndicatorInfo, CHART_THEMES, CHART_THEME_NAMES, type ChartClickEvent, type ChartContextMenuEvent, type ChartContextMenuRegion, type ChartDatafeed, type ChartInstance, type ChartKeyboardAction, type ChartKeyboardShortcutEvent, type ChartLongPressEvent, type ChartOptions, type ChartSavedState, type ChartTheme, type ChartThemeName, type ChartTimezone, type ChartType, type CompareSeriesOptions, type CrosshairMoveEvent, type CrosshairOptions, type CrosshairPriceActionEvent, type DashPatternOptions, type DataLineOptions, type DatafeedBarsRequest, type DatafeedOptions, type DownsamplingOptions, type DrawingBounds, type DrawingDefaults, type DrawingHoverEvent, type DrawingObjectOptions, type DrawingPoint, type DrawingSelectEvent, type DrawingSelectionChangeEvent, type DrawingToolType, FIB_DEFAULT_PALETTE, type GridOptions, type HistoryOptions, type IndicatorInstanceOptions, type IndicatorPane, type IndicatorPaneActionEvent, type IndicatorPaneAxisOptions, type IndicatorPaneGuideLine, type IndicatorPaneHeightChangeEvent, type IndicatorPaneRenderInfo, type IndicatorPaneValue, type IndicatorPaneValueLabel, type IndicatorPlugin, type IndicatorRenderContext, type IndicatorUpdateOptions, type KeyboardOptions, type LabelsOptions, type MarkClickEvent, type MarkHoverEvent, type MarkShape, type OhlcDataPoint, type OrderActionButton, type OrderActionEvent, type OrderLineOptions, POSITION_DEFAULT_COLORS, type PriceLineOptions, type PriceScaleMode, type PriceScaleOptions, type ReplayStartOptions, type ReplayState, SCRIPT_SOURCE_INPUT_VALUES, SESSION_PRESETS, type ScriptComputeResult, type ScriptIndicatorDefinition, type ScriptIndicatorInputDef, type ScriptInputHelper, type ScriptInputOptions, type ScriptPlotSpec, type SessionOptions, type SessionPresetName, type SessionSegment, type SessionSpec, type TickerLineOptions, type TimeFormat, type TimescaleMarkOptions, type TouchOptions, type TradeMarkerOptions, type UndoRedoState, type ViewportState, type WatermarkOptions, compileScriptIndicator, createChart, extractScriptInputs, isValidTimeZone, validateScriptSource };
|
|
1507
|
+
export { type AccessibilityOptions, type AlertActionEvent, type AlertCondition, type AlertOptions, type AlertTriggerEvent, type AnimationOptions, type AxisOptions, type BarMarkOptions, type BuiltInIndicatorInfo, CHART_THEMES, CHART_THEME_NAMES, type ChartClickEvent, type ChartContextMenuEvent, type ChartContextMenuRegion, type ChartDatafeed, type ChartInstance, type ChartKeyboardAction, type ChartKeyboardShortcutEvent, type ChartLongPressEvent, type ChartOptions, type ChartSavedState, type ChartTheme, type ChartThemeName, type ChartTimezone, type ChartType, type CompareSeriesOptions, type CrosshairMoveEvent, type CrosshairOptions, type CrosshairPriceActionEvent, DRAWING_ICON_STROKE_WIDTH, DRAWING_ICON_VIEWBOX, DRAWING_TOOL_ICONS, type DashPatternOptions, type DataLineOptions, type DatafeedBarsRequest, type DatafeedOptions, type DownsamplingOptions, type DrawingBounds, type DrawingDefaults, type DrawingHoverEvent, type DrawingIconName, type DrawingIconShape, type DrawingObjectOptions, type DrawingPoint, type DrawingSelectEvent, type DrawingSelectionChangeEvent, type DrawingToolType, FIB_DEFAULT_PALETTE, type GridOptions, type HistoryOptions, type IndicatorInstanceOptions, type IndicatorPane, type IndicatorPaneActionEvent, type IndicatorPaneAxisOptions, type IndicatorPaneGuideLine, type IndicatorPaneHeightChangeEvent, type IndicatorPaneRenderInfo, type IndicatorPaneValue, type IndicatorPaneValueLabel, type IndicatorPlugin, type IndicatorRenderContext, type IndicatorUpdateOptions, type KeyboardOptions, type LabelsOptions, type MarkClickEvent, type MarkHoverEvent, type MarkShape, type OhlcDataPoint, type OrderActionButton, type OrderActionEvent, type OrderLineOptions, POSITION_DEFAULT_COLORS, type PriceLineOptions, type PriceScaleMode, type PriceScaleOptions, type ReplayStartOptions, type ReplayState, SCRIPT_SOURCE_INPUT_VALUES, SESSION_PRESETS, type ScriptComputeResult, type ScriptIndicatorDefinition, type ScriptIndicatorInputDef, type ScriptInputHelper, type ScriptInputOptions, type ScriptPlotSpec, type SessionOptions, type SessionPresetName, type SessionSegment, type SessionSpec, type TickerLineOptions, type TimeFormat, type TimescaleMarkOptions, type TouchOptions, type TradeMarkerOptions, type UndoRedoState, type ViewportState, type WatermarkOptions, compileScriptIndicator, createChart, extractScriptInputs, isValidTimeZone, validateScriptSource };
|
package/dist/index.d.ts
CHANGED
|
@@ -1441,6 +1441,45 @@ declare const validateScriptSource: (source: string) => string | null;
|
|
|
1441
1441
|
*/
|
|
1442
1442
|
declare const compileScriptIndicator: (definition: ScriptIndicatorDefinition) => IndicatorPlugin;
|
|
1443
1443
|
|
|
1444
|
+
/**
|
|
1445
|
+
* Hyperprop drawing-tool icon pack — framework-agnostic geometry.
|
|
1446
|
+
*
|
|
1447
|
+
* Original artwork drawn in the visual language traders know from desktop
|
|
1448
|
+
* charting platforms: a 28x28 grid, thin round-capped outlines, and hollow
|
|
1449
|
+
* "anchor" dots on anything line-based (a dot marks a draggable point of the
|
|
1450
|
+
* tool). The data here is plain shape descriptions so every consumer renders
|
|
1451
|
+
* the identical set: the web terminal maps it to DOM `<svg>` elements and the
|
|
1452
|
+
* mobile app to react-native-svg components.
|
|
1453
|
+
*
|
|
1454
|
+
* Design rules when adding icons:
|
|
1455
|
+
* - viewBox 0 0 28 28, strokeWidth 1.6, round caps/joins, no fill (except
|
|
1456
|
+
* shapes marked `fill: true`).
|
|
1457
|
+
* - Anchor dots are hollow circles r=2.1; lines stop ~1.5px short of them.
|
|
1458
|
+
* - Keep 3.5px padding to the edges so glyphs optically match.
|
|
1459
|
+
*/
|
|
1460
|
+
type DrawingIconShape = {
|
|
1461
|
+
kind: "path";
|
|
1462
|
+
d: string;
|
|
1463
|
+
dash?: string;
|
|
1464
|
+
fill?: boolean;
|
|
1465
|
+
} | {
|
|
1466
|
+
kind: "circle";
|
|
1467
|
+
cx: number;
|
|
1468
|
+
cy: number;
|
|
1469
|
+
r: number;
|
|
1470
|
+
fill?: boolean;
|
|
1471
|
+
} | {
|
|
1472
|
+
kind: "rect";
|
|
1473
|
+
x: number;
|
|
1474
|
+
y: number;
|
|
1475
|
+
width: number;
|
|
1476
|
+
height: number;
|
|
1477
|
+
};
|
|
1478
|
+
type DrawingIconName = "cursor-cross" | "cursor-dot" | "cursor-arrow" | "trendline" | "horizontal-line" | "vertical-line" | "ray" | "arrow" | "parallel-channel" | "fib-retracement" | "fib-extension" | "long-position" | "short-position" | "price-range" | "fixed-range-volume-profile" | "measure" | "rectangle" | "ellipse" | "brush" | "text" | "note" | "callout" | "magnet" | "trash" | "pencil" | "eye-off" | "lock" | "unlock" | "clone" | "settings" | "source-code" | "go-to-realtime" | "fit-bars" | "reset" | "log-scale" | "percent-scale" | "invert-scale" | "arrow-up" | "arrow-down" | "replay" | "play" | "pause" | "skip-back" | "skip-forward" | "alert" | "anchor" | "indicators";
|
|
1479
|
+
declare const DRAWING_ICON_VIEWBOX = 28;
|
|
1480
|
+
declare const DRAWING_ICON_STROKE_WIDTH = 1.6;
|
|
1481
|
+
declare const DRAWING_TOOL_ICONS: Record<DrawingIconName, DrawingIconShape[]>;
|
|
1482
|
+
|
|
1444
1483
|
/**
|
|
1445
1484
|
* Built-in palettes.
|
|
1446
1485
|
*
|
|
@@ -1465,4 +1504,4 @@ declare const SESSION_PRESETS: Record<SessionPresetName, SessionSpec>;
|
|
|
1465
1504
|
|
|
1466
1505
|
declare function createChart(element: HTMLElement, options?: ChartOptions): ChartInstance;
|
|
1467
1506
|
|
|
1468
|
-
export { type AccessibilityOptions, type AlertActionEvent, type AlertCondition, type AlertOptions, type AlertTriggerEvent, type AnimationOptions, type AxisOptions, type BarMarkOptions, type BuiltInIndicatorInfo, CHART_THEMES, CHART_THEME_NAMES, type ChartClickEvent, type ChartContextMenuEvent, type ChartContextMenuRegion, type ChartDatafeed, type ChartInstance, type ChartKeyboardAction, type ChartKeyboardShortcutEvent, type ChartLongPressEvent, type ChartOptions, type ChartSavedState, type ChartTheme, type ChartThemeName, type ChartTimezone, type ChartType, type CompareSeriesOptions, type CrosshairMoveEvent, type CrosshairOptions, type CrosshairPriceActionEvent, type DashPatternOptions, type DataLineOptions, type DatafeedBarsRequest, type DatafeedOptions, type DownsamplingOptions, type DrawingBounds, type DrawingDefaults, type DrawingHoverEvent, type DrawingObjectOptions, type DrawingPoint, type DrawingSelectEvent, type DrawingSelectionChangeEvent, type DrawingToolType, FIB_DEFAULT_PALETTE, type GridOptions, type HistoryOptions, type IndicatorInstanceOptions, type IndicatorPane, type IndicatorPaneActionEvent, type IndicatorPaneAxisOptions, type IndicatorPaneGuideLine, type IndicatorPaneHeightChangeEvent, type IndicatorPaneRenderInfo, type IndicatorPaneValue, type IndicatorPaneValueLabel, type IndicatorPlugin, type IndicatorRenderContext, type IndicatorUpdateOptions, type KeyboardOptions, type LabelsOptions, type MarkClickEvent, type MarkHoverEvent, type MarkShape, type OhlcDataPoint, type OrderActionButton, type OrderActionEvent, type OrderLineOptions, POSITION_DEFAULT_COLORS, type PriceLineOptions, type PriceScaleMode, type PriceScaleOptions, type ReplayStartOptions, type ReplayState, SCRIPT_SOURCE_INPUT_VALUES, SESSION_PRESETS, type ScriptComputeResult, type ScriptIndicatorDefinition, type ScriptIndicatorInputDef, type ScriptInputHelper, type ScriptInputOptions, type ScriptPlotSpec, type SessionOptions, type SessionPresetName, type SessionSegment, type SessionSpec, type TickerLineOptions, type TimeFormat, type TimescaleMarkOptions, type TouchOptions, type TradeMarkerOptions, type UndoRedoState, type ViewportState, type WatermarkOptions, compileScriptIndicator, createChart, extractScriptInputs, isValidTimeZone, validateScriptSource };
|
|
1507
|
+
export { type AccessibilityOptions, type AlertActionEvent, type AlertCondition, type AlertOptions, type AlertTriggerEvent, type AnimationOptions, type AxisOptions, type BarMarkOptions, type BuiltInIndicatorInfo, CHART_THEMES, CHART_THEME_NAMES, type ChartClickEvent, type ChartContextMenuEvent, type ChartContextMenuRegion, type ChartDatafeed, type ChartInstance, type ChartKeyboardAction, type ChartKeyboardShortcutEvent, type ChartLongPressEvent, type ChartOptions, type ChartSavedState, type ChartTheme, type ChartThemeName, type ChartTimezone, type ChartType, type CompareSeriesOptions, type CrosshairMoveEvent, type CrosshairOptions, type CrosshairPriceActionEvent, DRAWING_ICON_STROKE_WIDTH, DRAWING_ICON_VIEWBOX, DRAWING_TOOL_ICONS, type DashPatternOptions, type DataLineOptions, type DatafeedBarsRequest, type DatafeedOptions, type DownsamplingOptions, type DrawingBounds, type DrawingDefaults, type DrawingHoverEvent, type DrawingIconName, type DrawingIconShape, type DrawingObjectOptions, type DrawingPoint, type DrawingSelectEvent, type DrawingSelectionChangeEvent, type DrawingToolType, FIB_DEFAULT_PALETTE, type GridOptions, type HistoryOptions, type IndicatorInstanceOptions, type IndicatorPane, type IndicatorPaneActionEvent, type IndicatorPaneAxisOptions, type IndicatorPaneGuideLine, type IndicatorPaneHeightChangeEvent, type IndicatorPaneRenderInfo, type IndicatorPaneValue, type IndicatorPaneValueLabel, type IndicatorPlugin, type IndicatorRenderContext, type IndicatorUpdateOptions, type KeyboardOptions, type LabelsOptions, type MarkClickEvent, type MarkHoverEvent, type MarkShape, type OhlcDataPoint, type OrderActionButton, type OrderActionEvent, type OrderLineOptions, POSITION_DEFAULT_COLORS, type PriceLineOptions, type PriceScaleMode, type PriceScaleOptions, type ReplayStartOptions, type ReplayState, SCRIPT_SOURCE_INPUT_VALUES, SESSION_PRESETS, type ScriptComputeResult, type ScriptIndicatorDefinition, type ScriptIndicatorInputDef, type ScriptInputHelper, type ScriptInputOptions, type ScriptPlotSpec, type SessionOptions, type SessionPresetName, type SessionSegment, type SessionSpec, type TickerLineOptions, type TimeFormat, type TimescaleMarkOptions, type TouchOptions, type TradeMarkerOptions, type UndoRedoState, type ViewportState, type WatermarkOptions, compileScriptIndicator, createChart, extractScriptInputs, isValidTimeZone, validateScriptSource };
|
package/dist/index.js
CHANGED
|
@@ -3132,6 +3132,177 @@ var compileScriptIndicator = (definition) => {
|
|
|
3132
3132
|
return plugin;
|
|
3133
3133
|
};
|
|
3134
3134
|
|
|
3135
|
+
// src/icons.ts
|
|
3136
|
+
var DRAWING_ICON_VIEWBOX = 28;
|
|
3137
|
+
var DRAWING_ICON_STROKE_WIDTH = 1.6;
|
|
3138
|
+
var dot = (cx, cy) => ({ kind: "circle", cx, cy, r: 2.1 });
|
|
3139
|
+
var path = (d, extra) => ({
|
|
3140
|
+
kind: "path",
|
|
3141
|
+
d,
|
|
3142
|
+
...extra
|
|
3143
|
+
});
|
|
3144
|
+
var DRAWING_TOOL_ICONS = {
|
|
3145
|
+
"cursor-cross": [path("M14 4v6.5M14 17.5V24M4 14h6.5M17.5 14H24")],
|
|
3146
|
+
"cursor-dot": [{ kind: "circle", cx: 14, cy: 14, r: 2.6, fill: true }],
|
|
3147
|
+
"cursor-arrow": [path("M10 4.5v16.4l4.3-4.1 3 6.7 2.9-1.3-3-6.7h5.9L10 4.5Z")],
|
|
3148
|
+
trendline: [dot(7, 21), dot(21, 7), path("M8.6 19.4 19.4 8.6")],
|
|
3149
|
+
"horizontal-line": [dot(14, 14), path("M3.5 14h8.4M16.1 14h8.4")],
|
|
3150
|
+
"vertical-line": [dot(14, 14), path("M14 3.5v8.4M14 16.1v8.4")],
|
|
3151
|
+
ray: [dot(7.5, 20.5), path("M9 19 24 4")],
|
|
3152
|
+
arrow: [dot(6, 22), path("M7.6 20.4 21.4 6.6"), path("M14.6 6.2h7.2v7.2")],
|
|
3153
|
+
"parallel-channel": [dot(6, 17), dot(17, 6), path("M7.5 15.5 15.5 7.5"), path("M11 23.5 23.5 11")],
|
|
3154
|
+
"fib-retracement": [
|
|
3155
|
+
dot(6, 7),
|
|
3156
|
+
path("M9.6 7h14.9"),
|
|
3157
|
+
path("M3.5 14h21"),
|
|
3158
|
+
dot(6, 21),
|
|
3159
|
+
path("M9.6 21h14.9")
|
|
3160
|
+
],
|
|
3161
|
+
"fib-extension": [
|
|
3162
|
+
dot(6.5, 21.5),
|
|
3163
|
+
dot(12.5, 6.5),
|
|
3164
|
+
path("M7.5 19.1l4-9.2"),
|
|
3165
|
+
path("M17 7h7.5M17 14h7.5M17 21h7.5")
|
|
3166
|
+
],
|
|
3167
|
+
// Long/short: three price levels (target, entry, stop) with anchor dots and
|
|
3168
|
+
// a dotted "price path" diagonal running from entry toward the target.
|
|
3169
|
+
"long-position": [
|
|
3170
|
+
dot(5, 6.5),
|
|
3171
|
+
path("M8.6 6.5h15.9"),
|
|
3172
|
+
dot(5, 16),
|
|
3173
|
+
path("M8.6 16h10.3"),
|
|
3174
|
+
dot(21, 16),
|
|
3175
|
+
path("M8.6 22.5h15.9"),
|
|
3176
|
+
dot(5, 22.5),
|
|
3177
|
+
path("M10.5 14 22 7.8", { dash: "2 3.2" })
|
|
3178
|
+
],
|
|
3179
|
+
"short-position": [
|
|
3180
|
+
dot(5, 21.5),
|
|
3181
|
+
path("M8.6 21.5h15.9"),
|
|
3182
|
+
dot(5, 12),
|
|
3183
|
+
path("M8.6 12h10.3"),
|
|
3184
|
+
dot(21, 12),
|
|
3185
|
+
path("M8.6 5.5h15.9"),
|
|
3186
|
+
dot(5, 5.5),
|
|
3187
|
+
path("M10.5 14 22 20.2", { dash: "2 3.2" })
|
|
3188
|
+
],
|
|
3189
|
+
"price-range": [
|
|
3190
|
+
path("M8 5h12M8 23h12"),
|
|
3191
|
+
path("M14 7v14"),
|
|
3192
|
+
path("M11.2 9.8 14 7l2.8 2.8M11.2 18.2 14 21l2.8-2.8")
|
|
3193
|
+
],
|
|
3194
|
+
// Fixed range VP: two vertical range anchors with the profile bars attached
|
|
3195
|
+
// to the left one.
|
|
3196
|
+
"fixed-range-volume-profile": [
|
|
3197
|
+
path("M5 3.5v15.4"),
|
|
3198
|
+
dot(5, 21.5),
|
|
3199
|
+
dot(23, 6.5),
|
|
3200
|
+
path("M23 9.1v15.4"),
|
|
3201
|
+
{ kind: "rect", x: 5, y: 6, width: 7, height: 3.2 },
|
|
3202
|
+
{ kind: "rect", x: 5, y: 11, width: 10.5, height: 3.2 },
|
|
3203
|
+
{ kind: "rect", x: 5, y: 16, width: 4.5, height: 3.2 }
|
|
3204
|
+
],
|
|
3205
|
+
measure: [
|
|
3206
|
+
path("M4.5 18.5 18.5 4.5l5 5L9.5 23.5Z"),
|
|
3207
|
+
path("m8 15 1.8 1.8M11.5 11.5 14 14M15 8l1.8 1.8")
|
|
3208
|
+
],
|
|
3209
|
+
rectangle: [
|
|
3210
|
+
dot(6, 8),
|
|
3211
|
+
dot(22, 8),
|
|
3212
|
+
dot(22, 20),
|
|
3213
|
+
dot(6, 20),
|
|
3214
|
+
path("M8.1 8h11.8M8.1 20h11.8M6 10.1v7.8M22 10.1v7.8")
|
|
3215
|
+
],
|
|
3216
|
+
ellipse: [path("M6.1 14a7.9 6.9 0 1 0 15.8 0 7.9 6.9 0 1 0-15.8 0"), dot(4, 14), dot(24, 14)],
|
|
3217
|
+
brush: [dot(5, 20), path("M6.9 18.4c2.6-6 5-.6 8.4-3.2 3-2.3 5.4-6 8.2-7.9")],
|
|
3218
|
+
text: [path("M7 8.5V6h14v2.5"), path("M14 6v16M11 22h6")],
|
|
3219
|
+
note: [path("M5.5 5h17v11.5l-6 6h-11V5Z"), path("M22.5 16.5h-6v6")],
|
|
3220
|
+
callout: [path("M4.5 6h19v11.5H13L8 22.5v-5H4.5V6Z")],
|
|
3221
|
+
// --- Chart-UI utilities ----------------------------------------------------
|
|
3222
|
+
magnet: [
|
|
3223
|
+
path("M8.5 4.5h4v8.5a1.5 1.5 0 0 0 3 0V4.5h4V13a5.5 5.5 0 0 1-11 0V4.5Z"),
|
|
3224
|
+
path("M8.5 8.5h4M15.5 8.5h4")
|
|
3225
|
+
],
|
|
3226
|
+
trash: [
|
|
3227
|
+
path("M6.5 8h15"),
|
|
3228
|
+
path("M11 8V5.5h6V8"),
|
|
3229
|
+
path("M8.5 8l.9 14h9.2l.9-14"),
|
|
3230
|
+
path("M12 12v6.5M16 12v6.5")
|
|
3231
|
+
],
|
|
3232
|
+
pencil: [path("M5 23l.9-3.9L19 6a2.1 2.1 0 0 1 3 3L8.9 22.1 5 23Z"), path("M17.5 7.5l3 3")],
|
|
3233
|
+
"eye-off": [
|
|
3234
|
+
path("M4 14c2.6-4.6 6-6.9 10-6.9s7.4 2.3 10 6.9c-2.6 4.6-6 6.9-10 6.9S6.6 18.6 4 14Z"),
|
|
3235
|
+
{ kind: "circle", cx: 14, cy: 14, r: 3 },
|
|
3236
|
+
path("M6.5 22.5l15-17")
|
|
3237
|
+
],
|
|
3238
|
+
lock: [
|
|
3239
|
+
path("M10 12V8.8a4 4 0 0 1 8 0V12"),
|
|
3240
|
+
{ kind: "rect", x: 7, y: 12, width: 14, height: 10.5 },
|
|
3241
|
+
{ kind: "circle", cx: 14, cy: 17, r: 1.4 }
|
|
3242
|
+
],
|
|
3243
|
+
unlock: [
|
|
3244
|
+
path("M10 12V8.8a4 4 0 0 1 7.7-1.5"),
|
|
3245
|
+
{ kind: "rect", x: 7, y: 12, width: 14, height: 10.5 },
|
|
3246
|
+
{ kind: "circle", cx: 14, cy: 17, r: 1.4 }
|
|
3247
|
+
],
|
|
3248
|
+
clone: [
|
|
3249
|
+
{ kind: "rect", x: 10, y: 10, width: 12.5, height: 12.5 },
|
|
3250
|
+
path("M5.5 18V7a1.5 1.5 0 0 1 1.5-1.5h11")
|
|
3251
|
+
],
|
|
3252
|
+
// Sliders, drawn with the pack's anchor-dot knobs.
|
|
3253
|
+
settings: [
|
|
3254
|
+
path("M4 10h5.4"),
|
|
3255
|
+
dot(11.5, 10),
|
|
3256
|
+
path("M13.6 10H24"),
|
|
3257
|
+
path("M4 18h9.4"),
|
|
3258
|
+
dot(15.5, 18),
|
|
3259
|
+
path("M17.6 18H24")
|
|
3260
|
+
],
|
|
3261
|
+
"source-code": [path("M10.5 8 4.5 14l6 6"), path("M17.5 8l6 6-6 6")],
|
|
3262
|
+
"go-to-realtime": [path("M23.5 5.5v17"), path("M3.5 14h14.2"), path("M13.2 9.5 17.7 14l-4.5 4.5")],
|
|
3263
|
+
"fit-bars": [
|
|
3264
|
+
path("M4.5 5.5v17M23.5 5.5v17"),
|
|
3265
|
+
path("M8.5 14h11"),
|
|
3266
|
+
path("M12 10.5 8.5 14l3.5 3.5M16 10.5l3.5 3.5-3.5 3.5")
|
|
3267
|
+
],
|
|
3268
|
+
reset: [
|
|
3269
|
+
path("M3.5 14a10.5 10.5 0 1 0 10.5-10.5c-3 0-5.8 1.3-7.9 3.2L3.5 9.3"),
|
|
3270
|
+
path("M3.5 3.5v5.8h5.8")
|
|
3271
|
+
],
|
|
3272
|
+
"log-scale": [path("M5 4.5V23.5H24"), path("M7.5 21C13 19.5 19 13.5 21.5 6.5")],
|
|
3273
|
+
"percent-scale": [
|
|
3274
|
+
{ kind: "circle", cx: 9, cy: 9, r: 2.7 },
|
|
3275
|
+
{ kind: "circle", cx: 19, cy: 19, r: 2.7 },
|
|
3276
|
+
path("M6 22 22 6")
|
|
3277
|
+
],
|
|
3278
|
+
"invert-scale": [
|
|
3279
|
+
path("M9.5 22V6.5"),
|
|
3280
|
+
path("M5.5 10.5 9.5 6.5l4 4"),
|
|
3281
|
+
path("M18.5 6v15.5"),
|
|
3282
|
+
path("M14.5 17.5l4 4 4-4")
|
|
3283
|
+
],
|
|
3284
|
+
"arrow-up": [path("M14 22.5V6"), path("M7.5 12.5 14 6l6.5 6.5")],
|
|
3285
|
+
"arrow-down": [path("M14 5.5V22"), path("M7.5 15.5 14 22l6.5-6.5")],
|
|
3286
|
+
replay: [path("M4.5 5.5v17"), path("M9.3 14H24"), path("M13.8 9.5 9.3 14l4.5 4.5")],
|
|
3287
|
+
play: [path("M10 6.3v15.4L22.5 14 10 6.3Z")],
|
|
3288
|
+
pause: [path("M10.5 6.5v15M17.5 6.5v15")],
|
|
3289
|
+
"skip-back": [path("M7 6.5v15"), path("M21 6.9v14.2L10 14 21 6.9Z")],
|
|
3290
|
+
"skip-forward": [path("M21 6.5v15"), path("M7 6.9v14.2L18 14 7 6.9Z")],
|
|
3291
|
+
// Alarm clock — the alert metaphor traders know from other platforms.
|
|
3292
|
+
alert: [
|
|
3293
|
+
{ kind: "circle", cx: 14, cy: 15.5, r: 7.5 },
|
|
3294
|
+
path("M14 11.5v4l3 1.8"),
|
|
3295
|
+
path("M4.9 8.4 8 5.6M23.1 8.4 20 5.6")
|
|
3296
|
+
],
|
|
3297
|
+
anchor: [
|
|
3298
|
+
{ kind: "circle", cx: 14, cy: 5.8, r: 2.1 },
|
|
3299
|
+
path("M14 7.9V23.5"),
|
|
3300
|
+
path("M9.5 11.5h9"),
|
|
3301
|
+
path("M5 14.5a9 9 0 0 0 18 0")
|
|
3302
|
+
],
|
|
3303
|
+
indicators: [path("M4 19.5l5.5-6.5 4.5 4.5 9.5-11")]
|
|
3304
|
+
};
|
|
3305
|
+
|
|
3135
3306
|
// src/themes.ts
|
|
3136
3307
|
var CHART_THEMES = {
|
|
3137
3308
|
midnight: {
|
|
@@ -4654,9 +4825,9 @@ function createChart(element, options = {}) {
|
|
|
4654
4825
|
const groupThousands = (value, decimals) => {
|
|
4655
4826
|
const negative = value < 0;
|
|
4656
4827
|
const fixed = Math.abs(value).toFixed(decimals);
|
|
4657
|
-
const
|
|
4658
|
-
const intPart =
|
|
4659
|
-
const decPart =
|
|
4828
|
+
const dot2 = fixed.indexOf(".");
|
|
4829
|
+
const intPart = dot2 === -1 ? fixed : fixed.slice(0, dot2);
|
|
4830
|
+
const decPart = dot2 === -1 ? "" : fixed.slice(dot2);
|
|
4660
4831
|
const grouped = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
4661
4832
|
return `${negative ? "-" : ""}${grouped}${decPart}`;
|
|
4662
4833
|
};
|
|
@@ -7236,12 +7407,12 @@ function createChart(element, options = {}) {
|
|
|
7236
7407
|
const upColumns = new Path2D();
|
|
7237
7408
|
const downColumns = new Path2D();
|
|
7238
7409
|
for (const column of seriesColumns) {
|
|
7239
|
-
const
|
|
7410
|
+
const path2 = column.close >= column.open ? upColumns : downColumns;
|
|
7240
7411
|
const x = column.x + 0.5;
|
|
7241
7412
|
const top = crisp(yFromPrice(column.high));
|
|
7242
7413
|
const bottom = crisp(yFromPrice(column.low));
|
|
7243
|
-
|
|
7244
|
-
|
|
7414
|
+
path2.moveTo(x, top);
|
|
7415
|
+
path2.lineTo(x, bottom === top ? bottom + 1 : bottom);
|
|
7245
7416
|
}
|
|
7246
7417
|
ctx.lineWidth = 1;
|
|
7247
7418
|
ctx.strokeStyle = mergedOptions.upColor;
|
|
@@ -7384,16 +7555,16 @@ function createChart(element, options = {}) {
|
|
|
7384
7555
|
const displayLow = isLastCandle && actualDirection === "down" ? Math.min(point.l, displayClose) : point.l;
|
|
7385
7556
|
const roundedCenterX = Math.round(chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth);
|
|
7386
7557
|
const direction = isLastCandle ? actualDirection : getCandleDirectionByIndex(index);
|
|
7387
|
-
const
|
|
7558
|
+
const path2 = direction === "up" ? upBars : downBars;
|
|
7388
7559
|
const centerX = roundedCenterX + 0.5;
|
|
7389
|
-
|
|
7390
|
-
|
|
7560
|
+
path2.moveTo(centerX, crisp(yFromPrice(displayHigh)));
|
|
7561
|
+
path2.lineTo(centerX, crisp(yFromPrice(displayLow)));
|
|
7391
7562
|
const openY = crisp(yFromPrice(point.o));
|
|
7392
7563
|
const closeY = crisp(yFromPrice(displayClose));
|
|
7393
|
-
|
|
7394
|
-
|
|
7395
|
-
|
|
7396
|
-
|
|
7564
|
+
path2.moveTo(centerX - tickLength, openY);
|
|
7565
|
+
path2.lineTo(centerX, openY);
|
|
7566
|
+
path2.moveTo(centerX, closeY);
|
|
7567
|
+
path2.lineTo(centerX + tickLength, closeY);
|
|
7397
7568
|
}
|
|
7398
7569
|
ctx.lineWidth = Math.max(1, candleWickWidth);
|
|
7399
7570
|
ctx.strokeStyle = mergedOptions.upColor;
|
|
@@ -7461,7 +7632,7 @@ function createChart(element, options = {}) {
|
|
|
7461
7632
|
for (const plan of comparePlans) {
|
|
7462
7633
|
const color = plan.state.options.color ?? "#f59e0b";
|
|
7463
7634
|
const lineWidth = Math.max(1, plan.state.options.lineWidth ?? 1.5);
|
|
7464
|
-
const
|
|
7635
|
+
const path2 = new Path2D();
|
|
7465
7636
|
let started = false;
|
|
7466
7637
|
let firstX = 0;
|
|
7467
7638
|
let lastX = 0;
|
|
@@ -7469,11 +7640,11 @@ function createChart(element, options = {}) {
|
|
|
7469
7640
|
let lastPrice = Number.NaN;
|
|
7470
7641
|
const emit = (x, y) => {
|
|
7471
7642
|
if (!started) {
|
|
7472
|
-
|
|
7643
|
+
path2.moveTo(x, y);
|
|
7473
7644
|
firstX = x;
|
|
7474
7645
|
started = true;
|
|
7475
7646
|
} else {
|
|
7476
|
-
|
|
7647
|
+
path2.lineTo(x, y);
|
|
7477
7648
|
}
|
|
7478
7649
|
lastX = x;
|
|
7479
7650
|
lastY = y;
|
|
@@ -7531,7 +7702,7 @@ function createChart(element, options = {}) {
|
|
|
7531
7702
|
}
|
|
7532
7703
|
if (!started) continue;
|
|
7533
7704
|
if (plan.state.options.style === "area") {
|
|
7534
|
-
const fillPath = new Path2D(
|
|
7705
|
+
const fillPath = new Path2D(path2);
|
|
7535
7706
|
fillPath.lineTo(lastX, chartBottom);
|
|
7536
7707
|
fillPath.lineTo(firstX, chartBottom);
|
|
7537
7708
|
fillPath.closePath();
|
|
@@ -7545,7 +7716,7 @@ function createChart(element, options = {}) {
|
|
|
7545
7716
|
ctx.strokeStyle = color;
|
|
7546
7717
|
ctx.lineWidth = lineWidth;
|
|
7547
7718
|
ctx.lineJoin = "round";
|
|
7548
|
-
ctx.stroke(
|
|
7719
|
+
ctx.stroke(path2);
|
|
7549
7720
|
ctx.restore();
|
|
7550
7721
|
if (Number.isFinite(lastPrice)) {
|
|
7551
7722
|
const label = plan.state.options.label ?? plan.state.options.id;
|
|
@@ -12349,6 +12520,9 @@ function createChart(element, options = {}) {
|
|
|
12349
12520
|
export {
|
|
12350
12521
|
CHART_THEMES,
|
|
12351
12522
|
CHART_THEME_NAMES,
|
|
12523
|
+
DRAWING_ICON_STROKE_WIDTH,
|
|
12524
|
+
DRAWING_ICON_VIEWBOX,
|
|
12525
|
+
DRAWING_TOOL_ICONS,
|
|
12352
12526
|
FIB_DEFAULT_PALETTE,
|
|
12353
12527
|
POSITION_DEFAULT_COLORS,
|
|
12354
12528
|
SCRIPT_SOURCE_INPUT_VALUES,
|