@pradeepjadhav/trading-reload-chart 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (60) hide show
  1. package/LICENSE +87 -0
  2. package/README.md +256 -0
  3. package/dist/canvas/layers/AxisLayerX/AxisLayerX.d.ts +27 -0
  4. package/dist/canvas/layers/AxisLayerX/AxisLayerX.helpers.d.ts +32 -0
  5. package/dist/canvas/layers/AxisLayerX/AxisLayerX.types.d.ts +10 -0
  6. package/dist/canvas/layers/AxisLayerY/AxisLayerY.d.ts +23 -0
  7. package/dist/canvas/layers/AxisLayerY/AxisLayerY.helpers.d.ts +4 -0
  8. package/dist/canvas/layers/AxisLayerY/AxisLayerY.types.d.ts +8 -0
  9. package/dist/canvas/layers/CrosshairLayer.d.ts +23 -0
  10. package/dist/canvas/layers/CrosshairLayer.types.d.ts +10 -0
  11. package/dist/canvas/layers/ExistingCandlesLayer.d.ts +107 -0
  12. package/dist/canvas/layers/ExistingCandlesLayer.types.d.ts +56 -0
  13. package/dist/canvas/layers/PdhPdlLayer.d.ts +24 -0
  14. package/dist/canvas/layers/ShapesLayer/FibRetracementShape.d.ts +28 -0
  15. package/dist/canvas/layers/ShapesLayer/LineShape.d.ts +27 -0
  16. package/dist/canvas/layers/ShapesLayer/PathShape.d.ts +29 -0
  17. package/dist/canvas/layers/ShapesLayer/RectangleShape.d.ts +28 -0
  18. package/dist/canvas/layers/ShapesLayer/ShapesLayer.d.ts +70 -0
  19. package/dist/canvas/layers/ShapesLayer/ShapesLayer.helpers.d.ts +47 -0
  20. package/dist/canvas/layers/ShapesLayer/ShapesLayer.types.d.ts +470 -0
  21. package/dist/canvas/layers/ShapesLayer/ShortLongPosition.d.ts +40 -0
  22. package/dist/canvas/layers/ShapesLayer/ShortLongPosition.types.d.ts +11 -0
  23. package/dist/canvas/layers/TradeLayer/TradeLayer.d.ts +152 -0
  24. package/dist/canvas/layers/TradeLayer/TradeLayer.helpers.d.ts +3 -0
  25. package/dist/canvas/layers/TradeLayer/TradeLayer.types.d.ts +261 -0
  26. package/dist/canvas/layers/TradeLayer/TradeLayerEvents.d.ts +68 -0
  27. package/dist/canvas/layers/TradeLayer/TradeLayerEvents.types.d.ts +12 -0
  28. package/dist/canvas/layers/VolumeLayer/VolumeLayer.d.ts +28 -0
  29. package/dist/canvas/layers/VolumeLayer/VolumeLayer.types.d.ts +25 -0
  30. package/dist/canvas/layers/helpers/LayerHelpers.d.ts +29 -0
  31. package/dist/chart/ChartController.d.ts +8 -0
  32. package/dist/chart/ChartController.types.d.ts +224 -0
  33. package/dist/chart/createChartDom.d.ts +2 -0
  34. package/dist/chart/createChartDom.types.d.ts +13 -0
  35. package/dist/chart/utils/deepPartial.types.d.ts +14 -0
  36. package/dist/chart/utils/getCanvasPoint.d.ts +2 -0
  37. package/dist/chart/utils/getCanvasPoint.types.d.ts +10 -0
  38. package/dist/chart/utils/mergeChartConfig.d.ts +3 -0
  39. package/dist/chart/utils/normalizeCandleTime.d.ts +2 -0
  40. package/dist/chart/utils/updateTradeTPSL.d.ts +8 -0
  41. package/dist/config/ChartShapeConfig/chartShapeConfig.d.ts +2 -0
  42. package/dist/config/chartConfig.d.ts +20 -0
  43. package/dist/config/chartConfig.types.d.ts +642 -0
  44. package/dist/config/colors.d.ts +19 -0
  45. package/dist/config/pairs.d.ts +3 -0
  46. package/dist/core/CoordinateSystem.d.ts +10 -0
  47. package/dist/favicon.svg +1 -0
  48. package/dist/helpers/math.d.ts +1 -0
  49. package/dist/icons.svg +24 -0
  50. package/dist/index.d.ts +14 -0
  51. package/dist/models/Candle.types.d.ts +67 -0
  52. package/dist/models/ChartViewport.types.d.ts +30 -0
  53. package/dist/models/Point.types.d.ts +12 -0
  54. package/dist/models/Trade.types.d.ts +151 -0
  55. package/dist/models/VisibleRange.types.d.ts +15 -0
  56. package/dist/react/TradingReload.d.ts +28 -0
  57. package/dist/react/TradingReload.types.d.ts +74 -0
  58. package/dist/trading-reload-chart.css +2 -0
  59. package/dist/trading-reload-chart.js +3503 -0
  60. package/package.json +74 -0
@@ -0,0 +1,19 @@
1
+ export declare const COLORS: {
2
+ readonly primary: "#7959F7";
3
+ readonly blue: "#2962FF";
4
+ readonly yellow: "#FBC02D";
5
+ readonly purple: "#9C27B0";
6
+ readonly green: "#26A69A";
7
+ readonly red: "#EF5350";
8
+ readonly white: "#ffffff";
9
+ readonly background: "#0F0F0F";
10
+ readonly handleBackground: "#111827";
11
+ readonly slBackground: "#2a1111";
12
+ readonly tpBackground: "#0d2418";
13
+ readonly axisBorder: "rgb(89, 89, 89)";
14
+ readonly axisText: "rgba(255, 255, 255, 0.60)";
15
+ readonly axisTick: "rgba(255,255,255,0.12)";
16
+ readonly axisYTick: "rgba(255, 255, 255, 0.40)";
17
+ readonly divider: "rgba(255,255,255,0.12)";
18
+ readonly crosshairLabelBackground: "#494949";
19
+ };
@@ -0,0 +1,3 @@
1
+ export declare const JPY_PAIRS: string[];
2
+ export declare const CRYPTO_PAIRS: string[];
3
+ export declare const COMMODITY_PAIRS: string[];
@@ -0,0 +1,10 @@
1
+ export declare const screenToCandleIndex: ({ screenX, offsetX, candleSpacing, }: {
2
+ screenX: number;
3
+ offsetX: number;
4
+ candleSpacing: number;
5
+ }) => number;
6
+ export declare const candleIndexToScreenX: ({ candleIndex, offsetX, candleSpacing, }: {
7
+ candleIndex: number;
8
+ offsetX: number;
9
+ candleSpacing: number;
10
+ }) => number;
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="48" height="46" fill="none" viewBox="0 0 48 46"><path fill="#863bff" d="M25.946 44.938c-.664.845-2.021.375-2.021-.698V33.937a2.26 2.26 0 0 0-2.262-2.262H10.287c-.92 0-1.456-1.04-.92-1.788l7.48-10.471c1.07-1.497 0-3.578-1.842-3.578H1.237c-.92 0-1.456-1.04-.92-1.788L10.013.474c.214-.297.556-.474.92-.474h28.894c.92 0 1.456 1.04.92 1.788l-7.48 10.471c-1.07 1.498 0 3.579 1.842 3.579h11.377c.943 0 1.473 1.088.89 1.83L25.947 44.94z" style="fill:#863bff;fill:color(display-p3 .5252 .23 1);fill-opacity:1"/><mask id="a" width="48" height="46" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="#000" d="M25.842 44.938c-.664.844-2.021.375-2.021-.698V33.937a2.26 2.26 0 0 0-2.262-2.262H10.183c-.92 0-1.456-1.04-.92-1.788l7.48-10.471c1.07-1.498 0-3.579-1.842-3.579H1.133c-.92 0-1.456-1.04-.92-1.787L9.91.473c.214-.297.556-.474.92-.474h28.894c.92 0 1.456 1.04.92 1.788l-7.48 10.471c-1.07 1.498 0 3.578 1.842 3.578h11.377c.943 0 1.473 1.088.89 1.832L25.843 44.94z" style="fill:#000;fill-opacity:1"/></mask><g mask="url(#a)"><g filter="url(#b)"><ellipse cx="5.508" cy="14.704" fill="#ede6ff" rx="5.508" ry="14.704" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -4.47 31.516)"/></g><g filter="url(#c)"><ellipse cx="10.399" cy="29.851" fill="#ede6ff" rx="10.399" ry="29.851" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -39.328 7.883)"/></g><g filter="url(#d)"><ellipse cx="5.508" cy="30.487" fill="#7e14ff" rx="5.508" ry="30.487" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.814 -25.913 -14.639)scale(1 -1)"/></g><g filter="url(#e)"><ellipse cx="5.508" cy="30.599" fill="#7e14ff" rx="5.508" ry="30.599" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.814 -32.644 -3.334)scale(1 -1)"/></g><g filter="url(#f)"><ellipse cx="5.508" cy="30.599" fill="#7e14ff" rx="5.508" ry="30.599" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -34.34 30.47)"/></g><g filter="url(#g)"><ellipse cx="14.072" cy="22.078" fill="#ede6ff" rx="14.072" ry="22.078" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="rotate(93.35 24.506 48.493)scale(-1 1)"/></g><g filter="url(#h)"><ellipse cx="3.47" cy="21.501" fill="#7e14ff" rx="3.47" ry="21.501" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.009 28.708 47.59)scale(-1 1)"/></g><g filter="url(#i)"><ellipse cx="3.47" cy="21.501" fill="#7e14ff" rx="3.47" ry="21.501" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.009 28.708 47.59)scale(-1 1)"/></g><g filter="url(#j)"><ellipse cx=".387" cy="8.972" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(39.51 .387 8.972)"/></g><g filter="url(#k)"><ellipse cx="47.523" cy="-6.092" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 47.523 -6.092)"/></g><g filter="url(#l)"><ellipse cx="41.412" cy="6.333" fill="#47bfff" rx="5.971" ry="9.665" style="fill:#47bfff;fill:color(display-p3 .2799 .748 1);fill-opacity:1" transform="rotate(37.892 41.412 6.333)"/></g><g filter="url(#m)"><ellipse cx="-1.879" cy="38.332" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 -1.88 38.332)"/></g><g filter="url(#n)"><ellipse cx="-1.879" cy="38.332" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 -1.88 38.332)"/></g><g filter="url(#o)"><ellipse cx="35.651" cy="29.907" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 35.651 29.907)"/></g><g filter="url(#p)"><ellipse cx="38.418" cy="32.4" fill="#47bfff" rx="5.971" ry="15.297" style="fill:#47bfff;fill:color(display-p3 .2799 .748 1);fill-opacity:1" transform="rotate(37.892 38.418 32.4)"/></g></g><defs><filter id="b" width="60.045" height="41.654" x="-19.77" y="16.149" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="c" width="90.34" height="51.437" x="-54.613" y="-7.533" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="d" width="79.355" height="29.4" x="-49.64" y="2.03" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="e" width="79.579" height="29.4" x="-45.045" y="20.029" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="f" width="79.579" height="29.4" x="-43.513" y="21.178" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="g" width="74.749" height="58.852" x="15.756" y="-17.901" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="h" width="61.377" height="25.362" x="23.548" y="2.284" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="i" width="61.377" height="25.362" x="23.548" y="2.284" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="j" width="56.045" height="63.649" x="-27.636" y="-22.853" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="k" width="54.814" height="64.646" x="20.116" y="-38.415" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="l" width="33.541" height="35.313" x="24.641" y="-11.323" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="m" width="54.814" height="64.646" x="-29.286" y="6.009" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="n" width="54.814" height="64.646" x="-29.286" y="6.009" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="o" width="54.814" height="64.646" x="8.244" y="-2.416" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="p" width="39.409" height="43.623" x="18.713" y="10.588" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter></defs></svg>
@@ -0,0 +1 @@
1
+ export declare const normalizePrice: (price: number, precision?: number) => number;
package/dist/icons.svg ADDED
@@ -0,0 +1,24 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg">
2
+ <symbol id="bluesky-icon" viewBox="0 0 16 17">
3
+ <g clip-path="url(#bluesky-clip)"><path fill="#08060d" d="M7.75 7.735c-.693-1.348-2.58-3.86-4.334-5.097-1.68-1.187-2.32-.981-2.74-.79C.188 2.065.1 2.812.1 3.251s.241 3.602.398 4.13c.52 1.744 2.367 2.333 4.07 2.145-2.495.37-4.71 1.278-1.805 4.512 3.196 3.309 4.38-.71 4.987-2.746.608 2.036 1.307 5.91 4.93 2.746 2.72-2.746.747-4.143-1.747-4.512 1.702.189 3.55-.4 4.07-2.145.156-.528.397-3.691.397-4.13s-.088-1.186-.575-1.406c-.42-.19-1.06-.395-2.741.79-1.755 1.24-3.64 3.752-4.334 5.099"/></g>
4
+ <defs><clipPath id="bluesky-clip"><path fill="#fff" d="M.1.85h15.3v15.3H.1z"/></clipPath></defs>
5
+ </symbol>
6
+ <symbol id="discord-icon" viewBox="0 0 20 19">
7
+ <path fill="#08060d" d="M16.224 3.768a14.5 14.5 0 0 0-3.67-1.153c-.158.286-.343.67-.47.976a13.5 13.5 0 0 0-4.067 0c-.128-.306-.317-.69-.476-.976A14.4 14.4 0 0 0 3.868 3.77C1.546 7.28.916 10.703 1.231 14.077a14.7 14.7 0 0 0 4.5 2.306q.545-.748.965-1.587a9.5 9.5 0 0 1-1.518-.74q.191-.14.372-.293c2.927 1.369 6.107 1.369 8.999 0q.183.152.372.294-.723.437-1.52.74.418.838.963 1.588a14.6 14.6 0 0 0 4.504-2.308c.37-3.911-.63-7.302-2.644-10.309m-9.13 8.234c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.894 0 1.614.82 1.599 1.82.001 1-.705 1.82-1.6 1.82m5.91 0c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.893 0 1.614.82 1.599 1.82 0 1-.706 1.82-1.6 1.82"/>
8
+ </symbol>
9
+ <symbol id="documentation-icon" viewBox="0 0 21 20">
10
+ <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="m15.5 13.333 1.533 1.322c.645.555.967.833.967 1.178s-.322.623-.967 1.179L15.5 18.333m-3.333-5-1.534 1.322c-.644.555-.966.833-.966 1.178s.322.623.966 1.179l1.534 1.321"/>
11
+ <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M17.167 10.836v-4.32c0-1.41 0-2.117-.224-2.68-.359-.906-1.118-1.621-2.08-1.96-.599-.21-1.349-.21-2.848-.21-2.623 0-3.935 0-4.983.369-1.684.591-3.013 1.842-3.641 3.428C3 6.449 3 7.684 3 10.154v2.122c0 2.558 0 3.838.706 4.726q.306.383.713.671c.76.536 1.79.64 3.581.66"/>
12
+ <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M3 10a2.78 2.78 0 0 1 2.778-2.778c.555 0 1.209.097 1.748-.047.48-.129.854-.503.982-.982.145-.54.048-1.194.048-1.749a2.78 2.78 0 0 1 2.777-2.777"/>
13
+ </symbol>
14
+ <symbol id="github-icon" viewBox="0 0 19 19">
15
+ <path fill="#08060d" fill-rule="evenodd" d="M9.356 1.85C5.05 1.85 1.57 5.356 1.57 9.694a7.84 7.84 0 0 0 5.324 7.44c.387.079.528-.168.528-.376 0-.182-.013-.805-.013-1.454-2.165.467-2.616-.935-2.616-.935-.349-.91-.864-1.143-.864-1.143-.71-.48.051-.48.051-.48.787.051 1.2.805 1.2.805.695 1.194 1.817.857 2.268.649.064-.507.27-.857.49-1.052-1.728-.182-3.545-.857-3.545-3.87 0-.857.31-1.558.8-2.104-.078-.195-.349-1 .077-2.078 0 0 .657-.208 2.14.805a7.5 7.5 0 0 1 1.946-.26c.657 0 1.328.092 1.946.26 1.483-1.013 2.14-.805 2.14-.805.426 1.078.155 1.883.078 2.078.502.546.799 1.247.799 2.104 0 3.013-1.818 3.675-3.558 3.87.284.247.528.714.528 1.454 0 1.052-.012 1.896-.012 2.156 0 .208.142.455.528.377a7.84 7.84 0 0 0 5.324-7.441c.013-4.338-3.48-7.844-7.773-7.844" clip-rule="evenodd"/>
16
+ </symbol>
17
+ <symbol id="social-icon" viewBox="0 0 20 20">
18
+ <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M12.5 6.667a4.167 4.167 0 1 0-8.334 0 4.167 4.167 0 0 0 8.334 0"/>
19
+ <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M2.5 16.667a5.833 5.833 0 0 1 8.75-5.053m3.837.474.513 1.035c.07.144.257.282.414.309l.93.155c.596.1.736.536.307.965l-.723.73a.64.64 0 0 0-.152.531l.207.903c.164.715-.213.991-.84.618l-.872-.52a.63.63 0 0 0-.577 0l-.872.52c-.624.373-1.003.094-.84-.618l.207-.903a.64.64 0 0 0-.152-.532l-.723-.729c-.426-.43-.289-.864.306-.964l.93-.156a.64.64 0 0 0 .412-.31l.513-1.034c.28-.562.735-.562 1.012 0"/>
20
+ </symbol>
21
+ <symbol id="x-icon" viewBox="0 0 19 19">
22
+ <path fill="#08060d" fill-rule="evenodd" d="M1.893 1.98c.052.072 1.245 1.769 2.653 3.77l2.892 4.114c.183.261.333.48.333.486s-.068.089-.152.183l-.522.593-.765.867-3.597 4.087c-.375.426-.734.834-.798.905a1 1 0 0 0-.118.148c0 .01.236.017.664.017h.663l.729-.83c.4-.457.796-.906.879-.999a692 692 0 0 0 1.794-2.038c.034-.037.301-.34.594-.675l.551-.624.345-.392a7 7 0 0 1 .34-.374c.006 0 .93 1.306 2.052 2.903l2.084 2.965.045.063h2.275c1.87 0 2.273-.003 2.266-.021-.008-.02-1.098-1.572-3.894-5.547-2.013-2.862-2.28-3.246-2.273-3.266.008-.019.282-.332 2.085-2.38l2-2.274 1.567-1.782c.022-.028-.016-.03-.65-.03h-.674l-.3.342a871 871 0 0 1-1.782 2.025c-.067.075-.405.458-.75.852a100 100 0 0 1-.803.91c-.148.172-.299.344-.99 1.127-.304.343-.32.358-.345.327-.015-.019-.904-1.282-1.976-2.808L6.365 1.85H1.8zm1.782.91 8.078 11.294c.772 1.08 1.413 1.973 1.425 1.984.016.017.241.02 1.05.017l1.03-.004-2.694-3.766L7.796 5.75 5.722 2.852l-1.039-.004-1.039-.004z" clip-rule="evenodd"/>
23
+ </symbol>
24
+ </svg>
@@ -0,0 +1,14 @@
1
+ export type { PartialShapeConfig, Shape, ShapeAddedPayload, ShapeId, ShapeModifiedPayload, ShapeSelectedPayload, ShapeToolType, ShapeType, ShapeVertex, } from './canvas/layers/ShapesLayer/ShapesLayer.types';
2
+ export type { PastTrade, TradeHandleType, TradeProtectionHandleType, } from './canvas/layers/TradeLayer/TradeLayer.types';
3
+ export type { ChartControllerProps, PreviousDay, TradeModifyPayload, } from './chart/ChartController.types';
4
+ export type { DeepPartial } from './chart/utils/deepPartial.types';
5
+ export type { CanvasPoint } from './chart/utils/getCanvasPoint.types';
6
+ export { CHART_CONFIG } from './config/chartConfig';
7
+ export type { ChartConfig, PreviousDayHighLowConfig } from './config/chartConfig.types';
8
+ export type { Candle } from './models/Candle.types';
9
+ export type { ChartViewport } from './models/ChartViewport.types';
10
+ export type { Point2D } from './models/Point.types';
11
+ export type { BaseTrade, ClosedTrade, OpenTrade, TradeType } from './models/Trade.types';
12
+ export type { VisibleRange } from './models/VisibleRange.types';
13
+ export { TradingReload } from './react/TradingReload';
14
+ export type { TradingReloadHandle, TradingReloadProps } from './react/TradingReload.types';
@@ -0,0 +1,67 @@
1
+ /**
2
+ * Single OHLCV candle used by the chart.
3
+ *
4
+ * @example
5
+ * ```ts
6
+ * const candle: Candle = {
7
+ * time: 1716883200000,
8
+ * open: 1.084,
9
+ * high: 1.086,
10
+ * low: 1.0835,
11
+ * close: 1.0852,
12
+ * volume: 1200,
13
+ * ask: 1.0853,
14
+ * isClosed: true,
15
+ * };
16
+ * ```
17
+ */
18
+ export type Candle = {
19
+ /**
20
+ * Unix timestamp in milliseconds.
21
+ *
22
+ * @example `1716883200000`
23
+ */
24
+ time: number;
25
+ /**
26
+ * Candle open price.
27
+ *
28
+ * @example `1.084`
29
+ */
30
+ open: number;
31
+ /**
32
+ * Candle high price.
33
+ *
34
+ * @example `1.086`
35
+ */
36
+ high: number;
37
+ /**
38
+ * Candle low price.
39
+ *
40
+ * @example `1.0835`
41
+ */
42
+ low: number;
43
+ /**
44
+ * Candle close price.
45
+ *
46
+ * @example `1.0852`
47
+ */
48
+ close: number;
49
+ /**
50
+ * Tick or broker volume.
51
+ *
52
+ * @example `1200`
53
+ */
54
+ volume: number;
55
+ /**
56
+ * Current ask price during this candle.
57
+ *
58
+ * @example `1.0853`
59
+ */
60
+ ask: number;
61
+ /**
62
+ * `false` while the realtime candle is still forming.
63
+ *
64
+ * @example `true`
65
+ */
66
+ isClosed: boolean;
67
+ };
@@ -0,0 +1,30 @@
1
+ /**
2
+ * Internal viewport snapshot describing the current price and horizontal view.
3
+ *
4
+ * This type is exported for advanced integrations that need to align custom
5
+ * overlays with the chart.
6
+ *
7
+ * @example
8
+ * ```ts
9
+ * const viewport: ChartViewport = {
10
+ * minPrice: 1.082,
11
+ * maxPrice: 1.092,
12
+ * priceRange: 0.01,
13
+ * offsetX: 120,
14
+ * zoomX: 1.4,
15
+ * candleWidth: 10,
16
+ * candleGap: 2,
17
+ * candleSpacing: 12,
18
+ * };
19
+ * ```
20
+ */
21
+ export type ChartViewport = {
22
+ minPrice: number;
23
+ maxPrice: number;
24
+ priceRange: number;
25
+ offsetX: number;
26
+ zoomX: number;
27
+ candleWidth: number;
28
+ candleGap: number;
29
+ candleSpacing: number;
30
+ };
@@ -0,0 +1,12 @@
1
+ /**
2
+ * Generic 2D point in canvas space.
3
+ *
4
+ * @example
5
+ * ```ts
6
+ * const point: Point2D = { x: 240, y: 128 };
7
+ * ```
8
+ */
9
+ export type Point2D = {
10
+ x: number;
11
+ y: number;
12
+ };
@@ -0,0 +1,151 @@
1
+ /**
2
+ * Trade direction used by open and historical trade overlays.
3
+ *
4
+ * @example `"buy"`
5
+ */
6
+ export type TradeType = "buy" | "sell";
7
+ /**
8
+ * Shared trade fields used by open and closed trade records.
9
+ *
10
+ * @example
11
+ * ```ts
12
+ * const trade: BaseTrade = {
13
+ * ticket: 101245,
14
+ * symbol: "EURUSD",
15
+ * volume: 0.5,
16
+ * sl: 1.0835,
17
+ * tp: 1.091,
18
+ * type: "buy",
19
+ * openTime: 1716883200000,
20
+ * openPrice: 1.085,
21
+ * commission: 0,
22
+ * swap: 0,
23
+ * pnl: 12.5,
24
+ * };
25
+ * ```
26
+ */
27
+ export type BaseTrade = {
28
+ /** Broker ticket identifier.
29
+ *
30
+ * @example `101245`
31
+ */
32
+ ticket: number;
33
+ /** Trade symbol.
34
+ *
35
+ * @example `"EURUSD"`
36
+ */
37
+ symbol: string;
38
+ /** Position size or lot size.
39
+ *
40
+ * @example `0.5`
41
+ */
42
+ volume: number;
43
+ /** Stop-loss price, or `null` when not set.
44
+ *
45
+ * @example `1.0835`
46
+ */
47
+ sl: number | null;
48
+ /** Take-profit price, or `null` when not set.
49
+ *
50
+ * @example `1.091`
51
+ */
52
+ tp: number | null;
53
+ /** Trade direction.
54
+ *
55
+ * @example `"buy"`
56
+ */
57
+ type: TradeType;
58
+ /** Trade open time in milliseconds UTC.
59
+ *
60
+ * @example `1716883200000`
61
+ */
62
+ openTime: number;
63
+ /** Trade entry price.
64
+ *
65
+ * @example `1.085`
66
+ */
67
+ openPrice: number;
68
+ /** Commission charged by the broker.
69
+ *
70
+ * @example `0`
71
+ */
72
+ commission: number;
73
+ /** Swap or rollover cost.
74
+ *
75
+ * @example `0`
76
+ */
77
+ swap: number;
78
+ /** Current or realized profit and loss.
79
+ *
80
+ * @example `12.5`
81
+ */
82
+ pnl: number;
83
+ };
84
+ /**
85
+ * Open trade rendered with draggable protection handles.
86
+ *
87
+ * @example
88
+ * ```ts
89
+ * const trade: OpenTrade = {
90
+ * ticket: 101245,
91
+ * symbol: "EURUSD",
92
+ * volume: 0.5,
93
+ * sl: 1.0835,
94
+ * tp: 1.091,
95
+ * type: "buy",
96
+ * openTime: 1716883200000,
97
+ * openPrice: 1.085,
98
+ * commission: 0,
99
+ * swap: 0,
100
+ * pnl: 12.5,
101
+ * status: "open",
102
+ * };
103
+ * ```
104
+ */
105
+ export type OpenTrade = BaseTrade & {
106
+ /** Open-trade status discriminator.
107
+ *
108
+ * @example `"open"`
109
+ */
110
+ status: "open";
111
+ };
112
+ /**
113
+ * Closed trade record that includes exit information.
114
+ *
115
+ * @example
116
+ * ```ts
117
+ * const trade: ClosedTrade = {
118
+ * ticket: 101245,
119
+ * symbol: "EURUSD",
120
+ * volume: 0.5,
121
+ * sl: 1.0835,
122
+ * tp: 1.091,
123
+ * type: "buy",
124
+ * openTime: 1716883200000,
125
+ * openPrice: 1.085,
126
+ * closeTime: 1716886800000,
127
+ * closePrice: 1.0905,
128
+ * commission: 0,
129
+ * swap: 0,
130
+ * pnl: 27.5,
131
+ * status: "closed",
132
+ * };
133
+ * ```
134
+ */
135
+ export type ClosedTrade = BaseTrade & {
136
+ /** Trade exit price.
137
+ *
138
+ * @example `1.0905`
139
+ */
140
+ closePrice: number;
141
+ /** Trade exit time in milliseconds UTC.
142
+ *
143
+ * @example `1716886800000`
144
+ */
145
+ closeTime: number;
146
+ /** Closed-trade status discriminator.
147
+ *
148
+ * @example `"closed"`
149
+ */
150
+ status: "closed";
151
+ };
@@ -0,0 +1,15 @@
1
+ /**
2
+ * Visible candle index range for the current viewport.
3
+ *
4
+ * @example
5
+ * ```ts
6
+ * const range: VisibleRange = {
7
+ * startIndex: 120,
8
+ * endIndex: 240,
9
+ * };
10
+ * ```
11
+ */
12
+ export type VisibleRange = {
13
+ startIndex: number;
14
+ endIndex: number;
15
+ };
@@ -0,0 +1,28 @@
1
+ import { TradingReloadHandle } from './TradingReload.types';
2
+ /**
3
+ * React wrapper for the Trading Reload canvas chart library.
4
+ *
5
+ * This component is client-only and fills the size of its parent element.
6
+ * Provide a parent container with an explicit height or flex-derived height.
7
+ *
8
+ * @example
9
+ * ```tsx
10
+ * <div style={{ width: "100%", height: "600px" }}>
11
+ * <TradingReload
12
+ * activeSymbol="EURUSD"
13
+ * candles={candles}
14
+ * liveCandle={liveCandle}
15
+ * openTrades={openTrades}
16
+ * pastTrades={pastTrades}
17
+ * shapes={shapes}
18
+ * activeShapeTool={activeShapeTool}
19
+ * onShapeAdded={({ shape }) => setShapes((prev) => [...prev, shape])}
20
+ * onActiveShapeToolChange={setActiveShapeTool}
21
+ * />
22
+ * </div>
23
+ * ```
24
+ */
25
+ export declare const TradingReload: import('react').ForwardRefExoticComponent<import('..').ChartControllerProps & {
26
+ className?: string;
27
+ style?: import('react').CSSProperties;
28
+ } & import('react').RefAttributes<TradingReloadHandle>>;
@@ -0,0 +1,74 @@
1
+ import { CSSProperties } from 'react';
2
+ import { ChartControllerProps } from '../chart/ChartController.types';
3
+ /**
4
+ * Imperative methods exposed through the `ref` passed to {@link TradingReload}.
5
+ *
6
+ * @example
7
+ * ```tsx
8
+ * const chartRef = useRef<TradingReloadHandle>(null);
9
+ *
10
+ * <TradingReload ref={chartRef} {...props} />;
11
+ *
12
+ * chartRef.current?.resetChartView();
13
+ * ```
14
+ */
15
+ export type TradingReloadHandle = {
16
+ /**
17
+ * Resets the chart back to its default pan and zoom state.
18
+ *
19
+ * @example
20
+ * ```tsx
21
+ * <button onClick={() => chartRef.current?.resetChartView()}>
22
+ * Reset view
23
+ * </button>
24
+ * ```
25
+ */
26
+ resetChartView: () => void;
27
+ };
28
+ /**
29
+ * Props accepted by the public `TradingReload` React component.
30
+ *
31
+ * All market data, shapes, trades, and active tool state are controlled by the
32
+ * parent application.
33
+ *
34
+ * @example
35
+ * ```tsx
36
+ * <TradingReload
37
+ * activeSymbol="EURUSD"
38
+ * candles={candles}
39
+ * liveCandle={liveCandle}
40
+ * openTrades={openTrades}
41
+ * pastTrades={pastTrades}
42
+ * shapes={shapes}
43
+ * activeShapeTool={activeShapeTool}
44
+ * onShapeAdded={({ shape }) => setShapes((prev) => [...prev, shape])}
45
+ * onActiveShapeToolChange={setActiveShapeTool}
46
+ * />
47
+ * ```
48
+ */
49
+ export type TradingReloadProps = ChartControllerProps & {
50
+ /**
51
+ * Optional class applied to the chart root element.
52
+ *
53
+ * @example
54
+ * ```tsx
55
+ * <TradingReload className="chart-shell" {...props} />
56
+ * ```
57
+ */
58
+ className?: string;
59
+ /**
60
+ * Optional inline styles applied to the chart root element.
61
+ *
62
+ * The chart always stretches to `width: 100%` and `height: 100%` of the
63
+ * parent, so give the parent a real size.
64
+ *
65
+ * @example
66
+ * ```tsx
67
+ * <TradingReload
68
+ * style={{ minHeight: 480, borderRadius: 12 }}
69
+ * {...props}
70
+ * />
71
+ * ```
72
+ */
73
+ style?: CSSProperties;
74
+ };
@@ -0,0 +1,2 @@
1
+ .trading-reload-chart{box-sizing:border-box;outline:none;width:100%;height:100%;overflow:hidden}.trading-reload-chart *,.trading-reload-chart :before,.trading-reload-chart :after{box-sizing:border-box}.trading-reload-chart__layout{--axis-x-height:30px;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.trading-reload-chart__stack{flex:1;height:100%;position:relative;overflow:hidden}.trading-reload-chart canvas{display:block}.trading-reload-chart__volume,.trading-reload-chart__plot,.trading-reload-chart__shapes,.trading-reload-chart__trades,.trading-reload-chart__overlay{width:100%;height:calc(100% - var(--axis-x-height));position:absolute;top:0;left:0}.trading-reload-chart__volume{z-index:0;pointer-events:none}.trading-reload-chart__plot{z-index:1}.trading-reload-chart__shapes{z-index:2}.trading-reload-chart__trades{z-index:3}.trading-reload-chart__overlay{z-index:4}.trading-reload-chart__axis-x{width:100%;height:var(--axis-x-height);z-index:5;position:absolute;bottom:0;left:0}.trading-reload-chart__axis-y{height:calc(100% - var(--axis-x-height));z-index:4;flex-shrink:0;position:relative}
2
+ /*$vite$:1*/