react-klinecharts-ui 0.5.0 → 1.0.0

package/dist/{chunk-UJNJH3BS.cjs → chunk-LGYYJ2GP.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var reactKlinecharts = require('react-klinecharts');
+var klinecharts = require('klinecharts');
 
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -55,7 +55,7 @@ function getRayLine(coordinates, bounding) {
     } else if (coordinates[0].x > coordinates[1].x) {
       coordinate = {
         x: 0,
-        y: reactKlinecharts.utils.getLinearYFromCoordinates(coordinates[0], coordinates[1], {
+        y: klinecharts.utils.getLinearYFromCoordinates(coordinates[0], coordinates[1], {
           x: 0,
           y: coordinates[0].y
         })
@@ -63,7 +63,7 @@ function getRayLine(coordinates, bounding) {
     } else {
       coordinate = {
         x: bounding.width,
-        y: reactKlinecharts.utils.getLinearYFromCoordinates(coordinates[0], coordinates[1], {
+        y: klinecharts.utils.getLinearYFromCoordinates(coordinates[0], coordinates[1], {
           x: bounding.width,
           y: coordinates[0].y
         })
@@ -89,7 +89,7 @@ var arrow = {
   createPointFigures: ({ coordinates }) => {
     if (coordinates.length > 1) {
       const flag = coordinates[1].x > coordinates[0].x ? 0 : 1;
-      const kb = reactKlinecharts.utils.getLinearSlopeIntercept(coordinates[0], coordinates[1]);
+      const kb = klinecharts.utils.getLinearSlopeIntercept(coordinates[0], coordinates[1]);
       let offsetAngle;
       if (kb) {
         offsetAngle = Math.atan(kb[0]) + Math.PI * flag;
@@ -331,7 +331,7 @@ var fibonacciSpiral = {
     if (coordinates.length > 1) {
       const startRadius = getDistance(coordinates[0], coordinates[1]) / Math.sqrt(24);
       const flag = coordinates[1].x > coordinates[0].x ? 0 : 1;
-      const kb = reactKlinecharts.utils.getLinearSlopeIntercept(coordinates[0], coordinates[1]);
+      const kb = klinecharts.utils.getLinearSlopeIntercept(coordinates[0], coordinates[1]);
       let offsetAngle;
       if (kb) {
         offsetAngle = Math.atan(kb[0]) + Math.PI * flag;
@@ -994,7 +994,10 @@ var parallelChannel_default = parallelChannel;
 // src/overlays/longPosition.ts
 var longPosition = {
   name: "longPosition",
-  totalStep: 3,
+  // totalStep 4 → the user places 3 points interactively (entry, target, stop).
+  // With the previous value of 3, only 2 points were captured and the stop was
+  // always a hardcoded 40px offset, so R/R was meaningless.
+  totalStep: 4,
   needDefaultPointFigure: true,
   needDefaultXAxisFigure: true,
   needDefaultYAxisFigure: true,
@@ -1103,7 +1106,10 @@ var longPosition_default = longPosition;
 // src/overlays/shortPosition.ts
 var shortPosition = {
   name: "shortPosition",
-  totalStep: 3,
+  // totalStep 4 → the user places 3 points interactively (entry, target, stop).
+  // With the previous value of 3, only 2 points were captured and the stop was
+  // always a hardcoded 40px offset, so R/R was meaningless.
+  totalStep: 4,
   needDefaultPointFigure: true,
   needDefaultXAxisFigure: true,
   needDefaultYAxisFigure: true,
@@ -1232,8 +1238,10 @@ var measure = {
     const endPoint = overlay.points[1];
     const startCoord = coordinates[0];
     const endCoord = coordinates[1];
-    const diff = endPoint.value - startPoint.value;
-    const percent = (diff / startPoint.value * 100).toFixed(2);
+    const startValue = startPoint.value ?? 0;
+    const endValue = endPoint.value ?? 0;
+    const diff = endValue - startValue;
+    const percent = startValue !== 0 ? (diff / startValue * 100).toFixed(2) : "0.00";
     const bars = Math.abs(
       (endPoint.dataIndex ?? 0) - (startPoint.dataIndex ?? 0)
     );
@@ -1286,7 +1294,7 @@ var measure = {
       {
         type: "line",
         attrs: { coordinates: [startCoord, endCoord] },
-        styles: { color: strokeColor, style: "dash" }
+        styles: { color: strokeColor, style: "dashed" }
       },
       ...textFigures
     ];
@@ -1342,7 +1350,7 @@ function rdp(points, epsilon) {
   }
   return result;
 }
-reactKlinecharts.registerFigure({
+klinecharts.registerFigure({
   name: "brush_path",
   draw: (ctx, attrs, styles) => {
     const { coordinates } = attrs;
@@ -1862,8 +1870,9 @@ var ichimoku = {
       if (index >= kijunPeriod - 1) {
         item.kijun = highLowAvg(dataList, index - kijunPeriod + 1, index);
       }
-      if (index + offset < dataList.length) {
-        item.chikou = dataList[index + offset].close;
+      const chikouIndex = index - offset;
+      if (chikouIndex >= 0) {
+        item.chikou = dataList[chikouIndex].close;
       }
       const prevIndex = index - offset;
       if (prevIndex >= 0) {
@@ -2003,7 +2012,7 @@ var pivotPoints = {
     let dayLow = Infinity;
     let dayClose = 0;
     return dataList.map((kLineData) => {
-      const date = new Date(kLineData.timestamp).toLocaleDateString();
+      const date = new Date(kLineData.timestamp).toISOString().slice(0, 10);
       if (date !== lastDate) {
         if (lastDate !== "") {
           lastP = (dayHigh + dayLow + dayClose) / 3;
@@ -2057,11 +2066,20 @@ var rsiTv = {
     const maPeriod = indicator.calcParams[1];
     const closes = dataList.map((d) => d.close);
     const rsiValues = TA_default.rsi(closes, rsiPeriod);
-    const nonNullRsi = rsiValues.map((v) => v ?? 0);
-    const maValues = TA_default.sma(nonNullRsi, maPeriod);
+    const rsiMa = new Array(rsiValues.length).fill(null);
+    for (let i = 0; i < rsiValues.length; i++) {
+      if (rsiValues[i] === null) continue;
+      const valid = [];
+      for (let j = i; j >= 0 && valid.length < maPeriod; j--) {
+        if (rsiValues[j] !== null) valid.push(rsiValues[j]);
+      }
+      if (valid.length === maPeriod) {
+        rsiMa[i] = valid.reduce((a, b) => a + b, 0) / maPeriod;
+      }
+    }
     return dataList.map((_, i) => {
       const rsi = rsiValues[i];
-      const rsi_ma = rsi !== null && maValues[i] !== null ? maValues[i] : null;
+      const rsi_ma = rsi !== null ? rsiMa[i] : null;
       return { rsi, rsi_ma };
     });
   },
@@ -2283,7 +2301,7 @@ var vwap = {
     let cumulativePriceVolume = 0;
     let lastDate = "";
     return dataList.map((kLineData) => {
-      const date = new Date(kLineData.timestamp).toLocaleDateString();
+      const date = new Date(kLineData.timestamp).toISOString().slice(0, 10);
       if (date !== lastDate) {
         cumulativeVolume = 0;
         cumulativePriceVolume = 0;
@@ -2416,7 +2434,7 @@ var depthOverlay = {
     const maxBarPx = bounding.width * maxBarFraction;
     const askColor = d.askColor ?? "rgba(239,83,80,0.25)";
     const bidColor = d.bidColor ?? "rgba(38,166,154,0.25)";
-    const maxQty = d.maxQty || 1;
+    const maxQty = d.maxQty ?? 1;
     const figures = [];
     for (const row of d.rows) {
       const y = yAxis.convertToPixel(row.price);
@@ -2443,19 +2461,134 @@ var depthOverlay = {
 };
 var depthOverlay_default = depthOverlay;
 
+// src/extensions/overlays/alertLine.ts
+var DEFAULT_FONT_FAMILY2 = "Helvetica Neue, Arial, sans-serif";
+var DEFAULT_COLOR = "#ff9800";
+var BELL_MARK = "\u{1F514}";
+var alertLine = {
+  name: "alertLine",
+  totalStep: 2,
+  needDefaultPointFigure: false,
+  needDefaultXAxisFigure: false,
+  needDefaultYAxisFigure: false,
+  createYAxisFigures: ({ chart, overlay, coordinates }) => {
+    if (coordinates.length < 1) return [];
+    const y = coordinates[0].y;
+    const price = overlay.points[0]?.value;
+    if (price == null) return [];
+    const d = overlay.extendData ?? {};
+    const color = d.color ?? DEFAULT_COLOR;
+    const m = d.mark;
+    const precision = chart.getSymbol()?.pricePrecision ?? 2;
+    return [
+      {
+        type: "text",
+        attrs: {
+          x: 0,
+          y,
+          text: price.toFixed(precision),
+          align: "left",
+          baseline: "middle"
+        },
+        styles: {
+          color: m?.color ?? "#ffffff",
+          size: m?.font?.size ?? 11,
+          family: m?.font?.family ?? DEFAULT_FONT_FAMILY2,
+          weight: m?.font?.weight ?? "bold",
+          paddingLeft: m?.padding?.x ?? 4,
+          paddingRight: m?.padding?.x ?? 4,
+          paddingTop: m?.padding?.y ?? 4,
+          paddingBottom: m?.padding?.y ?? 4,
+          backgroundColor: m?.bg ?? color,
+          borderRadius: m?.borderRadius ?? 2
+        }
+      }
+    ];
+  },
+  createPointFigures: ({ chart, coordinates, bounding, overlay }) => {
+    if (coordinates.length < 1) return [];
+    const y = coordinates[0].y;
+    const d = overlay.extendData ?? {};
+    const color = d.color ?? DEFAULT_COLOR;
+    const ln = d.line;
+    const figures = [
+      {
+        type: "line",
+        attrs: {
+          coordinates: [
+            { x: 0, y },
+            { x: bounding.width, y }
+          ]
+        },
+        styles: {
+          style: ln?.style ?? "dashed",
+          color,
+          size: ln?.width ?? 1,
+          dashedValue: ln?.dashedValue ?? [4, 2]
+        }
+      }
+    ];
+    const price = overlay.points[0]?.value;
+    const precision = chart.getSymbol()?.pricePrecision ?? 2;
+    const baseText = d.text ?? (price != null ? price.toFixed(precision) : "");
+    const showBell = d.showBell ?? true;
+    const text = baseText ? showBell ? `${BELL_MARK} ${baseText}` : baseText : showBell ? BELL_MARK : "";
+    if (text) {
+      const lb = d.label;
+      figures.push({
+        type: "text",
+        ignoreEvent: true,
+        attrs: {
+          x: lb?.offset?.x ?? 8,
+          y: y - (lb?.offset?.y ?? 3),
+          text,
+          align: "left",
+          baseline: "bottom"
+        },
+        styles: {
+          color: lb?.color ?? color,
+          size: lb?.font?.size ?? 11,
+          family: lb?.font?.family ?? DEFAULT_FONT_FAMILY2,
+          weight: lb?.font?.weight ?? "normal",
+          paddingLeft: lb?.padding?.x ?? 0,
+          paddingRight: lb?.padding?.x ?? 0,
+          paddingTop: lb?.padding?.y ?? 0,
+          paddingBottom: lb?.padding?.y ?? 0,
+          backgroundColor: lb?.bg ?? "transparent",
+          borderRadius: lb?.borderRadius ?? 0
+        }
+      });
+    }
+    return figures;
+  },
+  performEventPressedMove: ({ points, performPoint }) => {
+    points[0].value = performPoint.value;
+  }
+};
+var alertLine_default = alertLine;
+
 // src/extensions/index.ts
 var overlays = Object.values(overlays_exports);
+var featureOverlays = [orderLine_default, depthOverlay_default, alertLine_default];
 var indicators = Object.values(indicators_exports);
 var registered = false;
 function registerExtensions() {
   if (registered) return;
-  overlays.forEach((overlay) => reactKlinecharts.registerOverlay(overlay));
-  indicators.forEach((indicator) => reactKlinecharts.registerIndicator(indicator));
+  overlays.forEach((overlay) => klinecharts.registerOverlay(overlay));
+  featureOverlays.forEach((overlay) => klinecharts.registerOverlay(overlay));
+  indicators.forEach((indicator) => klinecharts.registerIndicator(indicator));
   registered = true;
 }
+var alertLineRegistered = false;
+function ensureAlertLineRegistered() {
+  if (alertLineRegistered) return;
+  klinecharts.registerOverlay(alertLine_default);
+  alertLineRegistered = true;
+}
 
 exports.TA_default = TA_default;
 exports.abcd_default = abcd_default;
+exports.alertLine_default = alertLine_default;
 exports.anyWaves_default = anyWaves_default;
 exports.arrow_default = arrow_default;
 exports.bollTv_default = bollTv_default;
@@ -2465,6 +2598,8 @@ exports.circle_default = circle_default;
 exports.depthOverlay_default = depthOverlay_default;
 exports.eightWaves_default = eightWaves_default;
 exports.elliottWave_default = elliottWave_default;
+exports.ensureAlertLineRegistered = ensureAlertLineRegistered;
+exports.featureOverlays = featureOverlays;
 exports.fibRetracement_default = fibRetracement_default;
 exports.fibonacciCircle_default = fibonacciCircle_default;
 exports.fibonacciExtension_default = fibonacciExtension_default;
@@ -2497,5 +2632,5 @@ exports.threeWaves_default = threeWaves_default;
 exports.triangle_default = triangle_default;
 exports.vwap_default = vwap_default;
 exports.xabcd_default = xabcd_default;
-//# sourceMappingURL=chunk-UJNJH3BS.cjs.map
-//# sourceMappingURL=chunk-UJNJH3BS.cjs.map
+//# sourceMappingURL=chunk-LGYYJ2GP.cjs.map
+//# sourceMappingURL=chunk-LGYYJ2GP.cjs.map