hyperprop-charting-library 0.1.124 → 0.1.126

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.
@@ -303,6 +303,39 @@ var getIndicatorSourceValue = (point, source) => {
303
303
  var clampIndicatorLength = (value, fallback) => {
304
304
  return Math.max(1, Math.round(Number(value) || fallback));
305
305
  };
306
+ var parseColorToRgb = (value) => {
307
+ if (!value) return null;
308
+ const normalized = value.trim().toLowerCase();
309
+ if (normalized === "white") return { r: 255, g: 255, b: 255 };
310
+ if (normalized === "black") return { r: 0, g: 0, b: 0 };
311
+ const hex3 = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/.exec(normalized);
312
+ if (hex3) {
313
+ return {
314
+ r: parseInt(hex3[1] + hex3[1], 16),
315
+ g: parseInt(hex3[2] + hex3[2], 16),
316
+ b: parseInt(hex3[3] + hex3[3], 16)
317
+ };
318
+ }
319
+ const hex = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})(?:[0-9a-f]{2})?$/.exec(normalized);
320
+ if (hex) {
321
+ return {
322
+ r: parseInt(hex[1], 16),
323
+ g: parseInt(hex[2], 16),
324
+ b: parseInt(hex[3], 16)
325
+ };
326
+ }
327
+ const rgb = /^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*[\d.]+\s*)?\)$/.exec(normalized);
328
+ if (rgb) {
329
+ return { r: Number(rgb[1]), g: Number(rgb[2]), b: Number(rgb[3]) };
330
+ }
331
+ return null;
332
+ };
333
+ var labelTextColorOn = (background, textColor) => {
334
+ const rgb = parseColorToRgb(background);
335
+ if (!rgb) return textColor;
336
+ const luminance = (0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b) / 255;
337
+ return luminance >= 0.62 ? "#000000" : textColor;
338
+ };
306
339
  var computeSmaSeries = (data, length, source) => {
307
340
  const result = new Array(data.length).fill(null);
308
341
  let sum = 0;
@@ -1983,7 +2016,7 @@ function createChart(element, options = {}) {
1983
2016
  labelY + labelHeight / 2,
1984
2017
  "left",
1985
2018
  "middle",
1986
- mergedLine.labelTextColor
2019
+ labelTextColorOn(mergedLine.labelBackgroundColor, mergedLine.labelTextColor)
1987
2020
  );
1988
2021
  };
1989
2022
  const drawOrderLine = (line, yFromPrice, chartLeft, chartTop, chartRight, chartBottom) => {
@@ -2123,7 +2156,10 @@ function createChart(element, options = {}) {
2123
2156
  const borderRadius = Math.max(0, mergedLine.labelBorderRadius);
2124
2157
  const widgetBackground = mergedOptions.backgroundColor;
2125
2158
  const widgetBorder = color;
2126
- const textColor = line.labelTextColor ?? (mergedLine.type === "takeProfit" ? "#5eead4" : mergedLine.type === "stop" ? "#fbbf24" : mergedLine.labelTextColor);
2159
+ const textColor = labelTextColorOn(
2160
+ widgetBackground,
2161
+ line.labelTextColor ?? (mergedLine.type === "takeProfit" ? "#5eead4" : mergedLine.type === "stop" ? "#fbbf24" : mergedLine.labelTextColor)
2162
+ );
2127
2163
  const mainWidgetX = leftWidgetX + actionButtonsTotalWidth + actionButtonsGap;
2128
2164
  ctx.fillStyle = widgetBackground;
2129
2165
  fillRoundedRect(Math.round(mainWidgetX), Math.round(widgetY), mainWidgetWidth, labelHeight, borderRadius);
@@ -3875,7 +3911,8 @@ function createChart(element, options = {}) {
3875
3911
  fillRoundedRect(Math.round(labelX), Math.round(label.y), label.width, label.height, labelRadius);
3876
3912
  const hasSubtexts = label.subtexts.length > 0;
3877
3913
  const primaryY = hasSubtexts ? label.y + baseLabelHeight / 2 - 1 : label.y + label.height / 2;
3878
- drawText(label.text, labelX + labelPaddingX, primaryY, "left", "middle", label.textColor);
3914
+ const effectiveTextColor = labelTextColorOn(label.backgroundColor, label.textColor);
3915
+ drawText(label.text, labelX + labelPaddingX, primaryY, "left", "middle", effectiveTextColor);
3879
3916
  if (hasSubtexts) {
3880
3917
  const baseFont = ctx.font;
3881
3918
  ctx.font = `${label.subtextFontSize}px ${mergedOptions.fontFamily}`;
@@ -3886,7 +3923,7 @@ function createChart(element, options = {}) {
3886
3923
  label.y + baseLabelHeight + index * (label.subtextFontSize + 5) + label.subtextFontSize / 2,
3887
3924
  "left",
3888
3925
  "middle",
3889
- label.subtextColor ?? label.textColor
3926
+ labelTextColorOn(label.backgroundColor, label.subtextColor ?? label.textColor)
3890
3927
  );
3891
3928
  });
3892
3929
  ctx.font = baseFont;
@@ -4043,7 +4080,7 @@ function createChart(element, options = {}) {
4043
4080
  const labelHeight = 20;
4044
4081
  const labelRadius = Math.max(0, crosshair.labelBorderRadius);
4045
4082
  const labelBackground = crosshair.labelBackgroundColor;
4046
- const labelTextColor = crosshair.labelTextColor;
4083
+ const labelTextColor = labelTextColorOn(labelBackground, crosshair.labelTextColor);
4047
4084
  const labelBorderColor = crosshair.labelBorderColor;
4048
4085
  const labelBorderWidth = Math.max(0, crosshair.labelBorderWidth);
4049
4086
  const labelBorderStyle = crosshair.labelBorderStyle;
@@ -277,6 +277,39 @@ var getIndicatorSourceValue = (point, source) => {
277
277
  var clampIndicatorLength = (value, fallback) => {
278
278
  return Math.max(1, Math.round(Number(value) || fallback));
279
279
  };
280
+ var parseColorToRgb = (value) => {
281
+ if (!value) return null;
282
+ const normalized = value.trim().toLowerCase();
283
+ if (normalized === "white") return { r: 255, g: 255, b: 255 };
284
+ if (normalized === "black") return { r: 0, g: 0, b: 0 };
285
+ const hex3 = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/.exec(normalized);
286
+ if (hex3) {
287
+ return {
288
+ r: parseInt(hex3[1] + hex3[1], 16),
289
+ g: parseInt(hex3[2] + hex3[2], 16),
290
+ b: parseInt(hex3[3] + hex3[3], 16)
291
+ };
292
+ }
293
+ const hex = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})(?:[0-9a-f]{2})?$/.exec(normalized);
294
+ if (hex) {
295
+ return {
296
+ r: parseInt(hex[1], 16),
297
+ g: parseInt(hex[2], 16),
298
+ b: parseInt(hex[3], 16)
299
+ };
300
+ }
301
+ const rgb = /^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*[\d.]+\s*)?\)$/.exec(normalized);
302
+ if (rgb) {
303
+ return { r: Number(rgb[1]), g: Number(rgb[2]), b: Number(rgb[3]) };
304
+ }
305
+ return null;
306
+ };
307
+ var labelTextColorOn = (background, textColor) => {
308
+ const rgb = parseColorToRgb(background);
309
+ if (!rgb) return textColor;
310
+ const luminance = (0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b) / 255;
311
+ return luminance >= 0.62 ? "#000000" : textColor;
312
+ };
280
313
  var computeSmaSeries = (data, length, source) => {
281
314
  const result = new Array(data.length).fill(null);
282
315
  let sum = 0;
@@ -1957,7 +1990,7 @@ function createChart(element, options = {}) {
1957
1990
  labelY + labelHeight / 2,
1958
1991
  "left",
1959
1992
  "middle",
1960
- mergedLine.labelTextColor
1993
+ labelTextColorOn(mergedLine.labelBackgroundColor, mergedLine.labelTextColor)
1961
1994
  );
1962
1995
  };
1963
1996
  const drawOrderLine = (line, yFromPrice, chartLeft, chartTop, chartRight, chartBottom) => {
@@ -2097,7 +2130,10 @@ function createChart(element, options = {}) {
2097
2130
  const borderRadius = Math.max(0, mergedLine.labelBorderRadius);
2098
2131
  const widgetBackground = mergedOptions.backgroundColor;
2099
2132
  const widgetBorder = color;
2100
- const textColor = line.labelTextColor ?? (mergedLine.type === "takeProfit" ? "#5eead4" : mergedLine.type === "stop" ? "#fbbf24" : mergedLine.labelTextColor);
2133
+ const textColor = labelTextColorOn(
2134
+ widgetBackground,
2135
+ line.labelTextColor ?? (mergedLine.type === "takeProfit" ? "#5eead4" : mergedLine.type === "stop" ? "#fbbf24" : mergedLine.labelTextColor)
2136
+ );
2101
2137
  const mainWidgetX = leftWidgetX + actionButtonsTotalWidth + actionButtonsGap;
2102
2138
  ctx.fillStyle = widgetBackground;
2103
2139
  fillRoundedRect(Math.round(mainWidgetX), Math.round(widgetY), mainWidgetWidth, labelHeight, borderRadius);
@@ -3849,7 +3885,8 @@ function createChart(element, options = {}) {
3849
3885
  fillRoundedRect(Math.round(labelX), Math.round(label.y), label.width, label.height, labelRadius);
3850
3886
  const hasSubtexts = label.subtexts.length > 0;
3851
3887
  const primaryY = hasSubtexts ? label.y + baseLabelHeight / 2 - 1 : label.y + label.height / 2;
3852
- drawText(label.text, labelX + labelPaddingX, primaryY, "left", "middle", label.textColor);
3888
+ const effectiveTextColor = labelTextColorOn(label.backgroundColor, label.textColor);
3889
+ drawText(label.text, labelX + labelPaddingX, primaryY, "left", "middle", effectiveTextColor);
3853
3890
  if (hasSubtexts) {
3854
3891
  const baseFont = ctx.font;
3855
3892
  ctx.font = `${label.subtextFontSize}px ${mergedOptions.fontFamily}`;
@@ -3860,7 +3897,7 @@ function createChart(element, options = {}) {
3860
3897
  label.y + baseLabelHeight + index * (label.subtextFontSize + 5) + label.subtextFontSize / 2,
3861
3898
  "left",
3862
3899
  "middle",
3863
- label.subtextColor ?? label.textColor
3900
+ labelTextColorOn(label.backgroundColor, label.subtextColor ?? label.textColor)
3864
3901
  );
3865
3902
  });
3866
3903
  ctx.font = baseFont;
@@ -4017,7 +4054,7 @@ function createChart(element, options = {}) {
4017
4054
  const labelHeight = 20;
4018
4055
  const labelRadius = Math.max(0, crosshair.labelBorderRadius);
4019
4056
  const labelBackground = crosshair.labelBackgroundColor;
4020
- const labelTextColor = crosshair.labelTextColor;
4057
+ const labelTextColor = labelTextColorOn(labelBackground, crosshair.labelTextColor);
4021
4058
  const labelBorderColor = crosshair.labelBorderColor;
4022
4059
  const labelBorderWidth = Math.max(0, crosshair.labelBorderWidth);
4023
4060
  const labelBorderStyle = crosshair.labelBorderStyle;
package/dist/index.cjs CHANGED
@@ -303,6 +303,39 @@ var getIndicatorSourceValue = (point, source) => {
303
303
  var clampIndicatorLength = (value, fallback) => {
304
304
  return Math.max(1, Math.round(Number(value) || fallback));
305
305
  };
306
+ var parseColorToRgb = (value) => {
307
+ if (!value) return null;
308
+ const normalized = value.trim().toLowerCase();
309
+ if (normalized === "white") return { r: 255, g: 255, b: 255 };
310
+ if (normalized === "black") return { r: 0, g: 0, b: 0 };
311
+ const hex3 = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/.exec(normalized);
312
+ if (hex3) {
313
+ return {
314
+ r: parseInt(hex3[1] + hex3[1], 16),
315
+ g: parseInt(hex3[2] + hex3[2], 16),
316
+ b: parseInt(hex3[3] + hex3[3], 16)
317
+ };
318
+ }
319
+ const hex = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})(?:[0-9a-f]{2})?$/.exec(normalized);
320
+ if (hex) {
321
+ return {
322
+ r: parseInt(hex[1], 16),
323
+ g: parseInt(hex[2], 16),
324
+ b: parseInt(hex[3], 16)
325
+ };
326
+ }
327
+ const rgb = /^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*[\d.]+\s*)?\)$/.exec(normalized);
328
+ if (rgb) {
329
+ return { r: Number(rgb[1]), g: Number(rgb[2]), b: Number(rgb[3]) };
330
+ }
331
+ return null;
332
+ };
333
+ var labelTextColorOn = (background, textColor) => {
334
+ const rgb = parseColorToRgb(background);
335
+ if (!rgb) return textColor;
336
+ const luminance = (0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b) / 255;
337
+ return luminance >= 0.62 ? "#000000" : textColor;
338
+ };
306
339
  var computeSmaSeries = (data, length, source) => {
307
340
  const result = new Array(data.length).fill(null);
308
341
  let sum = 0;
@@ -1983,7 +2016,7 @@ function createChart(element, options = {}) {
1983
2016
  labelY + labelHeight / 2,
1984
2017
  "left",
1985
2018
  "middle",
1986
- mergedLine.labelTextColor
2019
+ labelTextColorOn(mergedLine.labelBackgroundColor, mergedLine.labelTextColor)
1987
2020
  );
1988
2021
  };
1989
2022
  const drawOrderLine = (line, yFromPrice, chartLeft, chartTop, chartRight, chartBottom) => {
@@ -2123,7 +2156,10 @@ function createChart(element, options = {}) {
2123
2156
  const borderRadius = Math.max(0, mergedLine.labelBorderRadius);
2124
2157
  const widgetBackground = mergedOptions.backgroundColor;
2125
2158
  const widgetBorder = color;
2126
- const textColor = line.labelTextColor ?? (mergedLine.type === "takeProfit" ? "#5eead4" : mergedLine.type === "stop" ? "#fbbf24" : mergedLine.labelTextColor);
2159
+ const textColor = labelTextColorOn(
2160
+ widgetBackground,
2161
+ line.labelTextColor ?? (mergedLine.type === "takeProfit" ? "#5eead4" : mergedLine.type === "stop" ? "#fbbf24" : mergedLine.labelTextColor)
2162
+ );
2127
2163
  const mainWidgetX = leftWidgetX + actionButtonsTotalWidth + actionButtonsGap;
2128
2164
  ctx.fillStyle = widgetBackground;
2129
2165
  fillRoundedRect(Math.round(mainWidgetX), Math.round(widgetY), mainWidgetWidth, labelHeight, borderRadius);
@@ -3875,7 +3911,8 @@ function createChart(element, options = {}) {
3875
3911
  fillRoundedRect(Math.round(labelX), Math.round(label.y), label.width, label.height, labelRadius);
3876
3912
  const hasSubtexts = label.subtexts.length > 0;
3877
3913
  const primaryY = hasSubtexts ? label.y + baseLabelHeight / 2 - 1 : label.y + label.height / 2;
3878
- drawText(label.text, labelX + labelPaddingX, primaryY, "left", "middle", label.textColor);
3914
+ const effectiveTextColor = labelTextColorOn(label.backgroundColor, label.textColor);
3915
+ drawText(label.text, labelX + labelPaddingX, primaryY, "left", "middle", effectiveTextColor);
3879
3916
  if (hasSubtexts) {
3880
3917
  const baseFont = ctx.font;
3881
3918
  ctx.font = `${label.subtextFontSize}px ${mergedOptions.fontFamily}`;
@@ -3886,7 +3923,7 @@ function createChart(element, options = {}) {
3886
3923
  label.y + baseLabelHeight + index * (label.subtextFontSize + 5) + label.subtextFontSize / 2,
3887
3924
  "left",
3888
3925
  "middle",
3889
- label.subtextColor ?? label.textColor
3926
+ labelTextColorOn(label.backgroundColor, label.subtextColor ?? label.textColor)
3890
3927
  );
3891
3928
  });
3892
3929
  ctx.font = baseFont;
@@ -4043,7 +4080,7 @@ function createChart(element, options = {}) {
4043
4080
  const labelHeight = 20;
4044
4081
  const labelRadius = Math.max(0, crosshair.labelBorderRadius);
4045
4082
  const labelBackground = crosshair.labelBackgroundColor;
4046
- const labelTextColor = crosshair.labelTextColor;
4083
+ const labelTextColor = labelTextColorOn(labelBackground, crosshair.labelTextColor);
4047
4084
  const labelBorderColor = crosshair.labelBorderColor;
4048
4085
  const labelBorderWidth = Math.max(0, crosshair.labelBorderWidth);
4049
4086
  const labelBorderStyle = crosshair.labelBorderStyle;
package/dist/index.js CHANGED
@@ -277,6 +277,39 @@ var getIndicatorSourceValue = (point, source) => {
277
277
  var clampIndicatorLength = (value, fallback) => {
278
278
  return Math.max(1, Math.round(Number(value) || fallback));
279
279
  };
280
+ var parseColorToRgb = (value) => {
281
+ if (!value) return null;
282
+ const normalized = value.trim().toLowerCase();
283
+ if (normalized === "white") return { r: 255, g: 255, b: 255 };
284
+ if (normalized === "black") return { r: 0, g: 0, b: 0 };
285
+ const hex3 = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/.exec(normalized);
286
+ if (hex3) {
287
+ return {
288
+ r: parseInt(hex3[1] + hex3[1], 16),
289
+ g: parseInt(hex3[2] + hex3[2], 16),
290
+ b: parseInt(hex3[3] + hex3[3], 16)
291
+ };
292
+ }
293
+ const hex = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})(?:[0-9a-f]{2})?$/.exec(normalized);
294
+ if (hex) {
295
+ return {
296
+ r: parseInt(hex[1], 16),
297
+ g: parseInt(hex[2], 16),
298
+ b: parseInt(hex[3], 16)
299
+ };
300
+ }
301
+ const rgb = /^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*[\d.]+\s*)?\)$/.exec(normalized);
302
+ if (rgb) {
303
+ return { r: Number(rgb[1]), g: Number(rgb[2]), b: Number(rgb[3]) };
304
+ }
305
+ return null;
306
+ };
307
+ var labelTextColorOn = (background, textColor) => {
308
+ const rgb = parseColorToRgb(background);
309
+ if (!rgb) return textColor;
310
+ const luminance = (0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b) / 255;
311
+ return luminance >= 0.62 ? "#000000" : textColor;
312
+ };
280
313
  var computeSmaSeries = (data, length, source) => {
281
314
  const result = new Array(data.length).fill(null);
282
315
  let sum = 0;
@@ -1957,7 +1990,7 @@ function createChart(element, options = {}) {
1957
1990
  labelY + labelHeight / 2,
1958
1991
  "left",
1959
1992
  "middle",
1960
- mergedLine.labelTextColor
1993
+ labelTextColorOn(mergedLine.labelBackgroundColor, mergedLine.labelTextColor)
1961
1994
  );
1962
1995
  };
1963
1996
  const drawOrderLine = (line, yFromPrice, chartLeft, chartTop, chartRight, chartBottom) => {
@@ -2097,7 +2130,10 @@ function createChart(element, options = {}) {
2097
2130
  const borderRadius = Math.max(0, mergedLine.labelBorderRadius);
2098
2131
  const widgetBackground = mergedOptions.backgroundColor;
2099
2132
  const widgetBorder = color;
2100
- const textColor = line.labelTextColor ?? (mergedLine.type === "takeProfit" ? "#5eead4" : mergedLine.type === "stop" ? "#fbbf24" : mergedLine.labelTextColor);
2133
+ const textColor = labelTextColorOn(
2134
+ widgetBackground,
2135
+ line.labelTextColor ?? (mergedLine.type === "takeProfit" ? "#5eead4" : mergedLine.type === "stop" ? "#fbbf24" : mergedLine.labelTextColor)
2136
+ );
2101
2137
  const mainWidgetX = leftWidgetX + actionButtonsTotalWidth + actionButtonsGap;
2102
2138
  ctx.fillStyle = widgetBackground;
2103
2139
  fillRoundedRect(Math.round(mainWidgetX), Math.round(widgetY), mainWidgetWidth, labelHeight, borderRadius);
@@ -3849,7 +3885,8 @@ function createChart(element, options = {}) {
3849
3885
  fillRoundedRect(Math.round(labelX), Math.round(label.y), label.width, label.height, labelRadius);
3850
3886
  const hasSubtexts = label.subtexts.length > 0;
3851
3887
  const primaryY = hasSubtexts ? label.y + baseLabelHeight / 2 - 1 : label.y + label.height / 2;
3852
- drawText(label.text, labelX + labelPaddingX, primaryY, "left", "middle", label.textColor);
3888
+ const effectiveTextColor = labelTextColorOn(label.backgroundColor, label.textColor);
3889
+ drawText(label.text, labelX + labelPaddingX, primaryY, "left", "middle", effectiveTextColor);
3853
3890
  if (hasSubtexts) {
3854
3891
  const baseFont = ctx.font;
3855
3892
  ctx.font = `${label.subtextFontSize}px ${mergedOptions.fontFamily}`;
@@ -3860,7 +3897,7 @@ function createChart(element, options = {}) {
3860
3897
  label.y + baseLabelHeight + index * (label.subtextFontSize + 5) + label.subtextFontSize / 2,
3861
3898
  "left",
3862
3899
  "middle",
3863
- label.subtextColor ?? label.textColor
3900
+ labelTextColorOn(label.backgroundColor, label.subtextColor ?? label.textColor)
3864
3901
  );
3865
3902
  });
3866
3903
  ctx.font = baseFont;
@@ -4017,7 +4054,7 @@ function createChart(element, options = {}) {
4017
4054
  const labelHeight = 20;
4018
4055
  const labelRadius = Math.max(0, crosshair.labelBorderRadius);
4019
4056
  const labelBackground = crosshair.labelBackgroundColor;
4020
- const labelTextColor = crosshair.labelTextColor;
4057
+ const labelTextColor = labelTextColorOn(labelBackground, crosshair.labelTextColor);
4021
4058
  const labelBorderColor = crosshair.labelBorderColor;
4022
4059
  const labelBorderWidth = Math.max(0, crosshair.labelBorderWidth);
4023
4060
  const labelBorderStyle = crosshair.labelBorderStyle;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hyperprop-charting-library",
3
- "version": "0.1.124",
3
+ "version": "0.1.126",
4
4
  "description": "Lightweight TypeScript charting core",
5
5
  "type": "module",
6
6
  "main": "./dist/hyperprop-charting-library.cjs",