hyperprop-charting-library 0.1.111 → 0.1.113

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.
@@ -1035,6 +1035,7 @@ function createChart(element, options = {}) {
1035
1035
  let magnetModifierActive = false;
1036
1036
  let shiftKeyActive = false;
1037
1037
  const MAGNET_WEAK_THRESHOLD_PX = 16;
1038
+ const MAGNET_STRONG_THRESHOLD_PX = 48;
1038
1039
  let drawingHoverHandler = null;
1039
1040
  let lastHoveredDrawingId = null;
1040
1041
  let selectedDrawingId = null;
@@ -1650,23 +1651,26 @@ function createChart(element, options = {}) {
1650
1651
  if (!mergedLine.visible || !Number.isFinite(renderPrice)) {
1651
1652
  return;
1652
1653
  }
1654
+ const rawLineY = yFromPrice(renderPrice);
1653
1655
  const lineY = getLineY(renderPrice, yFromPrice, chartTop, chartBottom, mergedLine.pinOutOfRange);
1656
+ if (Number.isFinite(mergedLine.fillToPrice) && Number.isFinite(rawLineY)) {
1657
+ const fillY = getLineY(mergedLine.fillToPrice, yFromPrice, chartTop, chartBottom, true);
1658
+ if (fillY !== null) {
1659
+ const zoneY = clamp(rawLineY, chartTop + 1, chartBottom - 1);
1660
+ const topY = Math.min(zoneY, fillY);
1661
+ const heightY = Math.abs(zoneY - fillY);
1662
+ if (heightY >= 1) {
1663
+ ctx.save();
1664
+ ctx.fillStyle = mergedLine.fillColor ?? "rgba(37,99,235,0.18)";
1665
+ ctx.fillRect(Math.round(chartLeft), Math.round(topY), Math.max(1, Math.round(chartRight - chartLeft)), Math.round(heightY));
1666
+ ctx.restore();
1667
+ }
1668
+ }
1669
+ }
1654
1670
  if (lineY === null) {
1655
1671
  return;
1656
1672
  }
1657
1673
  const color = line.color ?? (mergedLine.type === "takeProfit" ? "rgba(45,212,191,0.86)" : mergedLine.type === "stop" ? "rgba(245,158,11,0.86)" : "rgba(59,130,246,0.8)");
1658
- if (Number.isFinite(mergedLine.fillToPrice)) {
1659
- const fillY = getLineY(mergedLine.fillToPrice, yFromPrice, chartTop, chartBottom, true);
1660
- if (fillY === null) {
1661
- return;
1662
- }
1663
- const topY = Math.min(lineY, fillY);
1664
- const heightY = Math.max(1, Math.abs(lineY - fillY));
1665
- ctx.save();
1666
- ctx.fillStyle = mergedLine.fillColor ?? "rgba(37,99,235,0.18)";
1667
- ctx.fillRect(Math.round(chartLeft), Math.round(topY), Math.max(1, Math.round(chartRight - chartLeft)), Math.round(heightY));
1668
- ctx.restore();
1669
- }
1670
1674
  ctx.save();
1671
1675
  ctx.strokeStyle = color;
1672
1676
  ctx.lineWidth = Math.max(1, mergedLine.thickness);
@@ -3939,7 +3943,8 @@ function createChart(element, options = {}) {
3939
3943
  nearest = candidate;
3940
3944
  }
3941
3945
  }
3942
- if (effective === "weak" && Math.abs(canvasYFromDrawingPrice(nearest) - y) > MAGNET_WEAK_THRESHOLD_PX) {
3946
+ const snapThresholdPx = effective === "weak" ? MAGNET_WEAK_THRESHOLD_PX : MAGNET_STRONG_THRESHOLD_PX;
3947
+ if (Math.abs(canvasYFromDrawingPrice(nearest) - y) > snapThresholdPx) {
3943
3948
  return { index, price };
3944
3949
  }
3945
3950
  return { index: barIndex, price: nearest };
@@ -1009,6 +1009,7 @@ function createChart(element, options = {}) {
1009
1009
  let magnetModifierActive = false;
1010
1010
  let shiftKeyActive = false;
1011
1011
  const MAGNET_WEAK_THRESHOLD_PX = 16;
1012
+ const MAGNET_STRONG_THRESHOLD_PX = 48;
1012
1013
  let drawingHoverHandler = null;
1013
1014
  let lastHoveredDrawingId = null;
1014
1015
  let selectedDrawingId = null;
@@ -1624,23 +1625,26 @@ function createChart(element, options = {}) {
1624
1625
  if (!mergedLine.visible || !Number.isFinite(renderPrice)) {
1625
1626
  return;
1626
1627
  }
1628
+ const rawLineY = yFromPrice(renderPrice);
1627
1629
  const lineY = getLineY(renderPrice, yFromPrice, chartTop, chartBottom, mergedLine.pinOutOfRange);
1630
+ if (Number.isFinite(mergedLine.fillToPrice) && Number.isFinite(rawLineY)) {
1631
+ const fillY = getLineY(mergedLine.fillToPrice, yFromPrice, chartTop, chartBottom, true);
1632
+ if (fillY !== null) {
1633
+ const zoneY = clamp(rawLineY, chartTop + 1, chartBottom - 1);
1634
+ const topY = Math.min(zoneY, fillY);
1635
+ const heightY = Math.abs(zoneY - fillY);
1636
+ if (heightY >= 1) {
1637
+ ctx.save();
1638
+ ctx.fillStyle = mergedLine.fillColor ?? "rgba(37,99,235,0.18)";
1639
+ ctx.fillRect(Math.round(chartLeft), Math.round(topY), Math.max(1, Math.round(chartRight - chartLeft)), Math.round(heightY));
1640
+ ctx.restore();
1641
+ }
1642
+ }
1643
+ }
1628
1644
  if (lineY === null) {
1629
1645
  return;
1630
1646
  }
1631
1647
  const color = line.color ?? (mergedLine.type === "takeProfit" ? "rgba(45,212,191,0.86)" : mergedLine.type === "stop" ? "rgba(245,158,11,0.86)" : "rgba(59,130,246,0.8)");
1632
- if (Number.isFinite(mergedLine.fillToPrice)) {
1633
- const fillY = getLineY(mergedLine.fillToPrice, yFromPrice, chartTop, chartBottom, true);
1634
- if (fillY === null) {
1635
- return;
1636
- }
1637
- const topY = Math.min(lineY, fillY);
1638
- const heightY = Math.max(1, Math.abs(lineY - fillY));
1639
- ctx.save();
1640
- ctx.fillStyle = mergedLine.fillColor ?? "rgba(37,99,235,0.18)";
1641
- ctx.fillRect(Math.round(chartLeft), Math.round(topY), Math.max(1, Math.round(chartRight - chartLeft)), Math.round(heightY));
1642
- ctx.restore();
1643
- }
1644
1648
  ctx.save();
1645
1649
  ctx.strokeStyle = color;
1646
1650
  ctx.lineWidth = Math.max(1, mergedLine.thickness);
@@ -3913,7 +3917,8 @@ function createChart(element, options = {}) {
3913
3917
  nearest = candidate;
3914
3918
  }
3915
3919
  }
3916
- if (effective === "weak" && Math.abs(canvasYFromDrawingPrice(nearest) - y) > MAGNET_WEAK_THRESHOLD_PX) {
3920
+ const snapThresholdPx = effective === "weak" ? MAGNET_WEAK_THRESHOLD_PX : MAGNET_STRONG_THRESHOLD_PX;
3921
+ if (Math.abs(canvasYFromDrawingPrice(nearest) - y) > snapThresholdPx) {
3917
3922
  return { index, price };
3918
3923
  }
3919
3924
  return { index: barIndex, price: nearest };
package/dist/index.cjs CHANGED
@@ -1035,6 +1035,7 @@ function createChart(element, options = {}) {
1035
1035
  let magnetModifierActive = false;
1036
1036
  let shiftKeyActive = false;
1037
1037
  const MAGNET_WEAK_THRESHOLD_PX = 16;
1038
+ const MAGNET_STRONG_THRESHOLD_PX = 48;
1038
1039
  let drawingHoverHandler = null;
1039
1040
  let lastHoveredDrawingId = null;
1040
1041
  let selectedDrawingId = null;
@@ -1650,23 +1651,26 @@ function createChart(element, options = {}) {
1650
1651
  if (!mergedLine.visible || !Number.isFinite(renderPrice)) {
1651
1652
  return;
1652
1653
  }
1654
+ const rawLineY = yFromPrice(renderPrice);
1653
1655
  const lineY = getLineY(renderPrice, yFromPrice, chartTop, chartBottom, mergedLine.pinOutOfRange);
1656
+ if (Number.isFinite(mergedLine.fillToPrice) && Number.isFinite(rawLineY)) {
1657
+ const fillY = getLineY(mergedLine.fillToPrice, yFromPrice, chartTop, chartBottom, true);
1658
+ if (fillY !== null) {
1659
+ const zoneY = clamp(rawLineY, chartTop + 1, chartBottom - 1);
1660
+ const topY = Math.min(zoneY, fillY);
1661
+ const heightY = Math.abs(zoneY - fillY);
1662
+ if (heightY >= 1) {
1663
+ ctx.save();
1664
+ ctx.fillStyle = mergedLine.fillColor ?? "rgba(37,99,235,0.18)";
1665
+ ctx.fillRect(Math.round(chartLeft), Math.round(topY), Math.max(1, Math.round(chartRight - chartLeft)), Math.round(heightY));
1666
+ ctx.restore();
1667
+ }
1668
+ }
1669
+ }
1654
1670
  if (lineY === null) {
1655
1671
  return;
1656
1672
  }
1657
1673
  const color = line.color ?? (mergedLine.type === "takeProfit" ? "rgba(45,212,191,0.86)" : mergedLine.type === "stop" ? "rgba(245,158,11,0.86)" : "rgba(59,130,246,0.8)");
1658
- if (Number.isFinite(mergedLine.fillToPrice)) {
1659
- const fillY = getLineY(mergedLine.fillToPrice, yFromPrice, chartTop, chartBottom, true);
1660
- if (fillY === null) {
1661
- return;
1662
- }
1663
- const topY = Math.min(lineY, fillY);
1664
- const heightY = Math.max(1, Math.abs(lineY - fillY));
1665
- ctx.save();
1666
- ctx.fillStyle = mergedLine.fillColor ?? "rgba(37,99,235,0.18)";
1667
- ctx.fillRect(Math.round(chartLeft), Math.round(topY), Math.max(1, Math.round(chartRight - chartLeft)), Math.round(heightY));
1668
- ctx.restore();
1669
- }
1670
1674
  ctx.save();
1671
1675
  ctx.strokeStyle = color;
1672
1676
  ctx.lineWidth = Math.max(1, mergedLine.thickness);
@@ -3939,7 +3943,8 @@ function createChart(element, options = {}) {
3939
3943
  nearest = candidate;
3940
3944
  }
3941
3945
  }
3942
- if (effective === "weak" && Math.abs(canvasYFromDrawingPrice(nearest) - y) > MAGNET_WEAK_THRESHOLD_PX) {
3946
+ const snapThresholdPx = effective === "weak" ? MAGNET_WEAK_THRESHOLD_PX : MAGNET_STRONG_THRESHOLD_PX;
3947
+ if (Math.abs(canvasYFromDrawingPrice(nearest) - y) > snapThresholdPx) {
3943
3948
  return { index, price };
3944
3949
  }
3945
3950
  return { index: barIndex, price: nearest };
package/dist/index.js CHANGED
@@ -1009,6 +1009,7 @@ function createChart(element, options = {}) {
1009
1009
  let magnetModifierActive = false;
1010
1010
  let shiftKeyActive = false;
1011
1011
  const MAGNET_WEAK_THRESHOLD_PX = 16;
1012
+ const MAGNET_STRONG_THRESHOLD_PX = 48;
1012
1013
  let drawingHoverHandler = null;
1013
1014
  let lastHoveredDrawingId = null;
1014
1015
  let selectedDrawingId = null;
@@ -1624,23 +1625,26 @@ function createChart(element, options = {}) {
1624
1625
  if (!mergedLine.visible || !Number.isFinite(renderPrice)) {
1625
1626
  return;
1626
1627
  }
1628
+ const rawLineY = yFromPrice(renderPrice);
1627
1629
  const lineY = getLineY(renderPrice, yFromPrice, chartTop, chartBottom, mergedLine.pinOutOfRange);
1630
+ if (Number.isFinite(mergedLine.fillToPrice) && Number.isFinite(rawLineY)) {
1631
+ const fillY = getLineY(mergedLine.fillToPrice, yFromPrice, chartTop, chartBottom, true);
1632
+ if (fillY !== null) {
1633
+ const zoneY = clamp(rawLineY, chartTop + 1, chartBottom - 1);
1634
+ const topY = Math.min(zoneY, fillY);
1635
+ const heightY = Math.abs(zoneY - fillY);
1636
+ if (heightY >= 1) {
1637
+ ctx.save();
1638
+ ctx.fillStyle = mergedLine.fillColor ?? "rgba(37,99,235,0.18)";
1639
+ ctx.fillRect(Math.round(chartLeft), Math.round(topY), Math.max(1, Math.round(chartRight - chartLeft)), Math.round(heightY));
1640
+ ctx.restore();
1641
+ }
1642
+ }
1643
+ }
1628
1644
  if (lineY === null) {
1629
1645
  return;
1630
1646
  }
1631
1647
  const color = line.color ?? (mergedLine.type === "takeProfit" ? "rgba(45,212,191,0.86)" : mergedLine.type === "stop" ? "rgba(245,158,11,0.86)" : "rgba(59,130,246,0.8)");
1632
- if (Number.isFinite(mergedLine.fillToPrice)) {
1633
- const fillY = getLineY(mergedLine.fillToPrice, yFromPrice, chartTop, chartBottom, true);
1634
- if (fillY === null) {
1635
- return;
1636
- }
1637
- const topY = Math.min(lineY, fillY);
1638
- const heightY = Math.max(1, Math.abs(lineY - fillY));
1639
- ctx.save();
1640
- ctx.fillStyle = mergedLine.fillColor ?? "rgba(37,99,235,0.18)";
1641
- ctx.fillRect(Math.round(chartLeft), Math.round(topY), Math.max(1, Math.round(chartRight - chartLeft)), Math.round(heightY));
1642
- ctx.restore();
1643
- }
1644
1648
  ctx.save();
1645
1649
  ctx.strokeStyle = color;
1646
1650
  ctx.lineWidth = Math.max(1, mergedLine.thickness);
@@ -3913,7 +3917,8 @@ function createChart(element, options = {}) {
3913
3917
  nearest = candidate;
3914
3918
  }
3915
3919
  }
3916
- if (effective === "weak" && Math.abs(canvasYFromDrawingPrice(nearest) - y) > MAGNET_WEAK_THRESHOLD_PX) {
3920
+ const snapThresholdPx = effective === "weak" ? MAGNET_WEAK_THRESHOLD_PX : MAGNET_STRONG_THRESHOLD_PX;
3921
+ if (Math.abs(canvasYFromDrawingPrice(nearest) - y) > snapThresholdPx) {
3917
3922
  return { index, price };
3918
3923
  }
3919
3924
  return { index: barIndex, price: nearest };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hyperprop-charting-library",
3
- "version": "0.1.111",
3
+ "version": "0.1.113",
4
4
  "description": "Lightweight TypeScript charting core",
5
5
  "type": "module",
6
6
  "main": "./dist/hyperprop-charting-library.cjs",