@pipsend/charts 2.1.0 → 2.2.1

package/README.md

@@ -260,10 +260,15 @@ const ha = applyHeikinAshi(series, chart);
 ha.remove();
 ```
 
-The source series keeps its real prices and is only hidden, so indicators bound
-to it keep computing on the true OHLC, and `remove()` restores the chart exactly
-as it was — which makes this usable as a chart-type toggle. New bars pushed to
-the source are transformed automatically.
+The source series keeps its real prices and is only painted transparent, not
+hidden: indicators bound to it keep computing on the true OHLC, its price lines
+and primitives (positions, alerts, drawings) stay on screen, and `remove()`
+restores the chart exactly as it was — which makes this usable as a chart-type
+toggle. New bars pushed to the source are transformed automatically.
+
+The same trick is exported as `hideSeriesPaint(series)` for drawing any other
+view over a series: it blanks the paint, leaves the series visible to the engine,
+and returns a function that puts the paint back.
 
 Colors can be changed on a running transform, and are the candlestick ones:
 

package/dist/pipsend-charts.development.mjs

@@ -1,6 +1,6 @@
 /*!
  * @license
- * Pipsend Charts v2.1.0
+ * Pipsend Charts v2.2.1
  * Copyright (c) 2026 Pipsend
  * Licensed under MIT License
  * Built on TradingView Lightweight Charts™ (Apache 2.0)
@@ -15520,6 +15520,85 @@ function hasSeriesVolumes(series) {
     return volumes !== undefined && volumes.size > 0;
 }
 
+const TRANSPARENT = 'rgba(0, 0, 0, 0)';
+/**
+ * Take a series off the screen without hiding it.
+ *
+ * `visible: false` takes down everything hung off the series as well: its
+ * price lines, primitives and price-axis label stop rendering. A transform
+ * that only wants the bars themselves out of the way — Heikin Ashi drawing
+ * over its source — needs the series to stay visible to the engine, so its
+ * paint is made transparent instead and the last-value label and price line
+ * are switched off. Custom series have no known colours; those fall back to
+ * `visible: false`.
+ *
+ * @param series - Series to blank out.
+ * @returns Puts back the options the series had when it was blanked.
+ */
+function hideSeriesPaint(series) {
+    switch (series.seriesType()) {
+        case 'Candlestick':
+            return blank(series, {
+                upColor: TRANSPARENT,
+                downColor: TRANSPARENT,
+                borderVisible: false,
+                wickVisible: false,
+            });
+        case 'Bar':
+            return blank(series, {
+                upColor: TRANSPARENT,
+                downColor: TRANSPARENT,
+            });
+        case 'Line':
+            return blank(series, {
+                color: TRANSPARENT,
+                crosshairMarkerVisible: false,
+                pointMarkersVisible: false,
+            });
+        case 'Area':
+            return blank(series, {
+                lineColor: TRANSPARENT,
+                topColor: TRANSPARENT,
+                bottomColor: TRANSPARENT,
+                crosshairMarkerVisible: false,
+                pointMarkersVisible: false,
+            });
+        case 'Baseline':
+            return blank(series, {
+                topLineColor: TRANSPARENT,
+                topFillColor1: TRANSPARENT,
+                topFillColor2: TRANSPARENT,
+                bottomLineColor: TRANSPARENT,
+                bottomFillColor1: TRANSPARENT,
+                bottomFillColor2: TRANSPARENT,
+                crosshairMarkerVisible: false,
+                pointMarkersVisible: false,
+            });
+        case 'Histogram':
+            return blank(series, {
+                color: TRANSPARENT,
+            });
+        default:
+            return blank(series, { visible: false });
+    }
+}
+function blank(series, paint) {
+    const patch = {
+        ...paint,
+        lastValueVisible: false,
+        priceLineVisible: false,
+    };
+    const before = series.options();
+    const snapshot = {};
+    for (const key of Object.keys(patch)) {
+        snapshot[key] = before[key];
+    }
+    series.applyOptions(patch);
+    return () => {
+        series.applyOptions(snapshot);
+    };
+}
+
 /**
  * Pins a bounded indicator (RSI, Stochastic…) to a fixed price range.
  *
@@ -17216,9 +17295,9 @@ function calculateHeikinAshi(bars) {
  * Draw a source series as Heikin Ashi candles.
  *
  * The source series is left in place holding its real prices — it is only
- * hidden — so indicators bound to it keep computing on the true OHLC, and
- * `remove()` puts the chart back exactly as it was. That makes this usable as a
- * chart-type toggle:
+ * painted transparent — so indicators bound to it keep computing on the true
+ * OHLC, its price lines and primitives stay on screen, and `remove()` puts the
+ * chart back exactly as it was. That makes this usable as a chart-type toggle:
  *
  * ```js
  * const ha = applyHeikinAshi(candleSeries, chart);
@@ -17260,10 +17339,16 @@ function applyHeikinAshi(series, chart, options = {}) {
         priceScaleId: sourceOptions.priceScaleId,
         priceFormat: sourceOptions.priceFormat,
     }, resolved.paneIndex);
-    const sourceWasVisible = sourceOptions.visible;
-    if (resolved.hideSource === true) {
-        series.applyOptions({ visible: false });
-    }
+    let restoreSourcePaint = null;
+    const blankSource = (blank) => {
+        if (blank && restoreSourcePaint === null) {
+            restoreSourcePaint = hideSeriesPaint(series);
+        }
+        else if (!blank && restoreSourcePaint !== null) {
+            restoreSourcePaint();
+            restoreSourcePaint = null;
+        }
+    };
     const runtime = bindIndicator({
         _internal_source: series,
         _internal_chart: chart,
@@ -17287,9 +17372,7 @@ function applyHeikinAshi(series, chart, options = {}) {
                 wickUpColor: current.wickUpColor,
                 wickDownColor: current.wickDownColor,
             });
-            series.applyOptions({
-                visible: current.hideSource === true ? false : sourceWasVisible,
-            });
+            blankSource(current.hideSource === true);
         },
     });
     const handle = {
@@ -17299,10 +17382,10 @@ function applyHeikinAshi(series, chart, options = {}) {
         recalculate: runtime.recalculate,
         remove: () => {
             runtime.remove();
-            // The source outlives the indicator, so its visibility is ours to put
+            // The source outlives the indicator, so its paint is ours to put
             // back — otherwise removing a Heikin Ashi overlay leaves a blank chart.
             try {
-                series.applyOptions({ visible: sourceWasVisible });
+                blankSource(false);
             }
             catch (error) {
                 // The series may already be gone if the chart was disposed
@@ -19929,6 +20012,9 @@ class DrawingToolBase {
     get type() {
         return this._type;
     }
+    isComplete() {
+        return true;
+    }
     /**
      * Lets a tool hand the base its own options object, once, in the constructor.
      *
@@ -20256,6 +20342,7 @@ class TrendLineTool extends DrawingToolBase {
         this._private__dragStartPoint2 = null;
         // Interactive mode
         this._private__isComplete = false;
+        this._private__interactive = null;
         this._private__previewPoint = null;
         this._private__trendOptions = {
             lineColor: '#2962ff',
@@ -20303,7 +20390,7 @@ class TrendLineTool extends DrawingToolBase {
                 this._private__isComplete = true;
             }
         });
-        // Start the interactive drawing mode
+        this._private__interactive = manager;
         manager._internal_startDrawing();
     }
     _private__createPrimitive() {
@@ -20633,7 +20720,14 @@ class TrendLineTool extends DrawingToolBase {
     _update() {
         this._private__requestUpdate();
     }
+    isComplete() {
+        return this._private__isComplete;
+    }
     remove() {
+        if (this._private__interactive) {
+            this._private__interactive._internal_destroy();
+            this._private__interactive = null;
+        }
         if (this._private__primitive) {
             // Detach from series
             this._series.detachPrimitive(this._private__primitive);
@@ -21540,6 +21634,9 @@ class PolygonTool extends DrawingToolBase {
     points() {
         return this._private__points;
     }
+    isComplete() {
+        return this._private__isComplete;
+    }
     remove() {
         this._private__stopDrawing();
         if (this._private__primitive) {
@@ -22010,6 +22107,9 @@ class ParallelChannelTool extends DrawingToolBase {
     isHovered() {
         return this._private__isHovered;
     }
+    isComplete() {
+        return this._private__isComplete;
+    }
     remove() {
         this._private__stopDrawing();
         if (this._private__primitive) {
@@ -22474,6 +22574,9 @@ class PitchforkTool extends DrawingToolBase {
     isHovered() {
         return this._private__isHovered;
     }
+    isComplete() {
+        return this._private__isComplete;
+    }
     remove() {
         this._private__stopDrawing();
         if (this._private__primitive) {
@@ -23404,6 +23507,9 @@ class FibonacciTool extends DrawingToolBase {
         }
         return false;
     }
+    isComplete() {
+        return this._private__isComplete;
+    }
     remove() {
         if (this._private__primitive) {
             this._series.detachPrimitive(this._private__primitive);
@@ -24294,6 +24400,9 @@ class FibonacciFanTool extends DrawingToolBase {
     _update() {
         this._private__requestUpdate();
     }
+    isComplete() {
+        return !this._private__isDrawing;
+    }
     remove() {
         if (this._private__clickHandler) {
             this._chart.unsubscribeClick(this._private__clickHandler);
@@ -24837,6 +24946,9 @@ class RectangleTool extends DrawingToolBase {
     _update() {
         this._private__requestUpdate();
     }
+    isComplete() {
+        return !this._private__isDrawing;
+    }
     remove() {
         if (this._private__clickHandler) {
             this._chart.unsubscribeClick(this._private__clickHandler);
@@ -25300,6 +25412,9 @@ class CircleTool extends DrawingToolBase {
     _update() {
         this._private__requestUpdate();
     }
+    isComplete() {
+        return !this._private__isDrawing;
+    }
     remove() {
         if (this._private__clickHandler) {
             this._chart.unsubscribeClick(this._private__clickHandler);
@@ -25842,6 +25957,9 @@ class ArrowTool extends DrawingToolBase {
     _update() {
         this._private__requestUpdate();
     }
+    isComplete() {
+        return !this._private__isDrawing;
+    }
     remove() {
         // Clean up click handler
         if (this._private__clickHandler) {
@@ -26408,7 +26526,7 @@ class TextTool extends DrawingToolBase {
     }
     _private__setupClickOutsideHandler() {
         // Set up click handler to finish editing when clicking outside
-        this._private__clickOutsideHandler = this._chart.subscribeClick((param) => {
+        const handler = (param) => {
             if (!this._private__isEditing)
                 return;
             // Get click coordinates
@@ -26424,7 +26542,9 @@ class TextTool extends DrawingToolBase {
                     this.remove();
                 }
             }
-        });
+        };
+        this._private__clickOutsideHandler = handler;
+        this._chart.subscribeClick(handler);
     }
     _private__createPrimitive() {
         this._private__paneView = this._private__createPaneView();
@@ -28573,6 +28693,9 @@ class DrawingToolsManager {
         this._private__selectionChanged = new Delegate();
         this._private__isDragging = false;
         this._private__draggedToolId = null;
+        this._private__pendingToolIds = new Set();
+        this._private__completionCheck = null;
+        this._private__drawingCompleted = new Delegate();
         this._private__chart = chart;
         this._private__series = series;
         this._private__options = {
@@ -28611,9 +28734,63 @@ class DrawingToolsManager {
     addTool(tool, id) {
         const toolId = id ?? tool.id;
         this._private__tools.set(toolId, tool);
+        if (!tool.isComplete()) {
+            this._private__pendingToolIds.add(toolId);
+        }
         this.recordChange();
         return toolId;
     }
+    hasPendingDrawing() {
+        return this._private__pendingToolIds.size > 0;
+    }
+    /** Removes every tool still waiting for points; returns how many were dropped. */
+    cancelPendingDrawings() {
+        if (this._private__pendingToolIds.size === 0) {
+            return 0;
+        }
+        let cancelled = 0;
+        for (const id of Array.from(this._private__pendingToolIds)) {
+            const tool = this._private__tools.get(id);
+            if (tool) {
+                if (this._private__selectedToolId === id) {
+                    this._private__applySelection(null);
+                }
+                tool.remove();
+                this._private__tools.delete(id);
+                cancelled++;
+            }
+        }
+        this._private__pendingToolIds.clear();
+        if (cancelled > 0) {
+            this.recordChange();
+        }
+        return cancelled;
+    }
+    subscribeDrawingCompleted(handler) {
+        this._private__drawingCompleted._internal_subscribe(handler);
+    }
+    unsubscribeDrawingCompleted(handler) {
+        this._private__drawingCompleted._internal_unsubscribe(handler);
+    }
+    _private__scheduleCompletionCheck() {
+        if (this._private__pendingToolIds.size === 0 || this._private__completionCheck !== null) {
+            return;
+        }
+        this._private__completionCheck = setTimeout(() => {
+            this._private__completionCheck = null;
+            for (const id of Array.from(this._private__pendingToolIds)) {
+                const tool = this._private__tools.get(id);
+                if (!tool) {
+                    this._private__pendingToolIds.delete(id);
+                    continue;
+                }
+                if (tool.isComplete()) {
+                    this._private__pendingToolIds.delete(id);
+                    this._private__drawingCompleted._internal_fire(id);
+                }
+            }
+        }, 0);
+    }
     /**
      * Remove a tool by ID
      */
@@ -28625,6 +28802,7 @@ class DrawingToolsManager {
             }
             tool.remove();
             this._private__tools.delete(id);
+            this._private__pendingToolIds.delete(id);
             this.recordChange();
             return true;
         }
@@ -28824,6 +29002,7 @@ class DrawingToolsManager {
         this._private__applySelection(null);
         this._private__tools.forEach((tool) => tool.remove());
         this._private__tools.clear();
+        this._private__pendingToolIds.clear();
         this.recordChange();
     }
     /**
@@ -29044,6 +29223,11 @@ class DrawingToolsManager {
      * Destroy the manager and cleanup
      */
     destroy() {
+        if (this._private__completionCheck !== null) {
+            clearTimeout(this._private__completionCheck);
+            this._private__completionCheck = null;
+        }
+        this._private__drawingCompleted._internal_destroy();
         this.clearAll();
         this._private__detachEventHandlers();
     }
@@ -29063,8 +29247,8 @@ class DrawingToolsManager {
         const chartElement = this._private__chart.chartElement();
         if (chartElement) {
             this._private__pointerDownHandler = (event) => this._private__handlePointerDown(event);
-            this._private__pointerUpHandler = (event) => this._private__handlePointerUp();
-            this._private__pointerCancelHandler = (event) => this._private__handlePointerUp();
+            this._private__pointerUpHandler = (event) => this._private__handlePointerUp(event);
+            this._private__pointerCancelHandler = (event) => this._private__handlePointerUp(event);
             chartElement.addEventListener('pointerdown', this._private__pointerDownHandler);
             chartElement.addEventListener('pointerup', this._private__pointerUpHandler);
             chartElement.addEventListener('pointercancel', this._private__pointerCancelHandler);
@@ -29107,6 +29291,7 @@ class DrawingToolsManager {
         }
     }
     _private__handleClick(param) {
+        this._private__scheduleCompletionCheck();
         if (!param.point) {
             return;
         }
@@ -29186,6 +29371,9 @@ class DrawingToolsManager {
         return null;
     }
     _private__handlePointerDown(event) {
+        if (this._private__isDragging) {
+            return;
+        }
         // Cleared for every press, then raised only if this one grabs a drawing
         setInputClaim(this._private__chart, false);
         const chartElement = this._private__chart.chartElement();
@@ -29228,10 +29416,13 @@ class DrawingToolsManager {
         // mouse events, and those are what drive the crosshair the drag reads.
         this._private__disableChartInteractions();
     }
-    _private__handlePointerUp() {
+    _private__handlePointerUp(event) {
         if (!this._private__isDragging || this._private__draggedToolId === null) {
             return;
         }
+        if (event && this._private__pointerId !== null && event.pointerId !== this._private__pointerId) {
+            return;
+        }
         const tool = this._private__tools.get(this._private__draggedToolId);
         if (tool) {
             tool.stopDrag();
@@ -29289,6 +29480,9 @@ class DrawingToolsManager {
         this._private__pointerId = null;
     }
     _private__disableChartInteractions() {
+        if (this._private__interactionsBeforeDrag !== null) {
+            return;
+        }
         const options = this._private__chart.options();
         this._private__interactionsBeforeDrag = {
             _internal_handleScroll: options.handleScroll,
@@ -29313,6 +29507,14 @@ class DrawingToolsManager {
         });
     }
     _private__handleKeyboard(event) {
+        const target = event.target;
+        const typing = !!target && (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable);
+        if (typing) {
+            return;
+        }
+        if (event.key === 'Enter') {
+            this._private__scheduleCompletionCheck();
+        }
         // Delete or Backspace to remove selected tool
         if (event.key === 'Delete' || event.key === 'Backspace') {
             if (this.deleteSelected()) {
@@ -29333,8 +29535,8 @@ class DrawingToolsManager {
             }
             return;
         }
-        // Escape to deselect
         if (event.key === 'Escape') {
+            this.cancelPendingDrawings();
             this._private__handlePointerUp();
             this._private__deselectAll();
             this.stopDrawing();
@@ -29370,7 +29572,7 @@ const customSeriesDefaultOptions = {
  * Returns the current version as a string. For example `'1.0.0'`.
  */
 function version() {
-    return "2.1.0";
+    return "2.2.1";
 }
 
-export { areaSeries as AreaSeries, ArrowTool, barSeries as BarSeries, baselineSeries as BaselineSeries, BrushTool, candlestickSeries as CandlestickSeries, CircleTool, ColorType, CrossLineTool, CrosshairMode, DEFAULT_SESSIONS, DraggablePriceLine, DrawingToolsManager, EXTENDED_FIBONACCI_RATIOS, FibonacciCalculator, FibonacciExtensionTool, FibonacciFanTool, FibonacciTool, GanttTool, histogramSeries as HistogramSeries, HorizontalLineTool, InteractiveLineManager, LastPriceAnimationMode, lineSeries as LineSeries, LineStyle, LineType, MismatchDirection, ParallelChannelTool, PitchforkTool, PolygonTool, PositionCalculator, PositionMarkersManager, PositionTool, PriceLineSource, PriceScaleMode, RectangleTool, RulerCalculator, RulerTool, STANDARD_FIBONACCI_RATIOS, TextTool, TickMarkType, TrackingModeExitMode, TradingSessionsIndicator, TrendLineTool, VerticalLineTool, VolumeProfileIndicator, applyADX, applyATR, applyBollingerBands, applyCCI, applyDonchianChannels, applyEMA, applyHeikinAshi, applyIchimoku, applyKeltnerChannels, applyMACD, applyMFI, applyOBV, applyParabolicSAR, applyPivotPoints, applyRSI, applySMA, applyStochastic, applySuperTrend, applyVWAP, applyVolume, applyWMA, applyWilliamsR, calculateHeikinAshi, calculatePipConfig, coordinateFromTime, createArrowTool, createBrushTool, createChart, createChartEx, createCircleTool, createCrossLineTool, createFibonacciExtensionTool, createFibonacciFanTool, createFibonacciTool, createGanttTool, createHorizontalLineTool, createImageWatermark, createInteractiveLineManager, createOptionsChart, createParallelChannelTool, createPitchforkTool, createPolygonTool, createPositionMarkers, createPositionTool, createRectangleTool, createRulerTool, createSeriesMarkers, createTextTool, createTextWatermark, createTradingLine, createTradingSessionsIndicator, createTrendLineTool, createUpDownMarkers, createVerticalLineTool, createVolumeProfileIndicator, createYieldCurveChart, customSeriesDefaultOptions, defaultHorzScaleBehavior, getPipConfig, isBusinessDay, isUTCTimestamp, setSeriesVolumes, setVolumeProfileData, timeFromCoordinate, version };
+export { areaSeries as AreaSeries, ArrowTool, barSeries as BarSeries, baselineSeries as BaselineSeries, BrushTool, candlestickSeries as CandlestickSeries, CircleTool, ColorType, CrossLineTool, CrosshairMode, DEFAULT_SESSIONS, DraggablePriceLine, DrawingToolsManager, EXTENDED_FIBONACCI_RATIOS, FibonacciCalculator, FibonacciExtensionTool, FibonacciFanTool, FibonacciTool, GanttTool, histogramSeries as HistogramSeries, HorizontalLineTool, InteractiveLineManager, LastPriceAnimationMode, lineSeries as LineSeries, LineStyle, LineType, MismatchDirection, ParallelChannelTool, PitchforkTool, PolygonTool, PositionCalculator, PositionMarkersManager, PositionTool, PriceLineSource, PriceScaleMode, RectangleTool, RulerCalculator, RulerTool, STANDARD_FIBONACCI_RATIOS, TextTool, TickMarkType, TrackingModeExitMode, TradingSessionsIndicator, TrendLineTool, VerticalLineTool, VolumeProfileIndicator, applyADX, applyATR, applyBollingerBands, applyCCI, applyDonchianChannels, applyEMA, applyHeikinAshi, applyIchimoku, applyKeltnerChannels, applyMACD, applyMFI, applyOBV, applyParabolicSAR, applyPivotPoints, applyRSI, applySMA, applyStochastic, applySuperTrend, applyVWAP, applyVolume, applyWMA, applyWilliamsR, calculateHeikinAshi, calculatePipConfig, coordinateFromTime, createArrowTool, createBrushTool, createChart, createChartEx, createCircleTool, createCrossLineTool, createFibonacciExtensionTool, createFibonacciFanTool, createFibonacciTool, createGanttTool, createHorizontalLineTool, createImageWatermark, createInteractiveLineManager, createOptionsChart, createParallelChannelTool, createPitchforkTool, createPolygonTool, createPositionMarkers, createPositionTool, createRectangleTool, createRulerTool, createSeriesMarkers, createTextTool, createTextWatermark, createTradingLine, createTradingSessionsIndicator, createTrendLineTool, createUpDownMarkers, createVerticalLineTool, createVolumeProfileIndicator, createYieldCurveChart, customSeriesDefaultOptions, defaultHorzScaleBehavior, getPipConfig, hideSeriesPaint, isBusinessDay, isUTCTimestamp, setSeriesVolumes, setVolumeProfileData, timeFromCoordinate, version };