@pipsend/charts 2.2.0 → 2.3.0

package/dist/pipsend-charts.standalone.development.js

@@ -1,6 +1,6 @@
 /*!
  * @license
- * Pipsend Charts v2.2.0
+ * Pipsend Charts v2.3.0-dev+202609220108
  * Copyright (c) 2026 Pipsend
  * Licensed under MIT License
  * Built on TradingView Lightweight Charts™ (Apache 2.0)
@@ -14641,6 +14641,8 @@
                 return size(originalSize, 0.8);
             case 'square':
                 return size(originalSize, 0.7);
+            case 'tag':
+                return size(originalSize, 1);
         }
     }
     function calculateShapeHeight(barSpacing) {
@@ -14750,6 +14752,85 @@
             y >= top && y <= top + squareSize;
     }
 
+    const TAIL_HALF_WIDTH_RATIO = 0.62;
+    /**
+     * Lays the pointer into the edge the path is already travelling along, so the
+     * bubble and its tail are a single outline. Two subpaths would leave a stroked
+     * seam where they meet.
+     */
+    // eslint-disable-next-line max-params
+    function tailPath(ctx, xCenter, edgeY, tailHeight, halfWidth, up) {
+        // A tip with a small radius reads as drawn rather than as an artefact of the
+        // rasteriser, which a bare triangle does at these sizes.
+        const tipRadius = Math.min(halfWidth / 3, tailHeight / 3);
+        const sign = up ? -1 : 1;
+        const tipY = edgeY + sign * tailHeight;
+        const shoulderY = tipY - sign * tipRadius;
+        // The top edge is travelled left to right, the bottom edge right to left.
+        const entry = up ? -halfWidth : halfWidth;
+        ctx.lineTo(xCenter + entry, edgeY);
+        ctx.lineTo(xCenter + (up ? -tipRadius : tipRadius), shoulderY);
+        ctx.quadraticCurveTo(xCenter, tipY, xCenter + (up ? tipRadius : -tipRadius), shoulderY);
+        ctx.lineTo(xCenter - entry, edgeY);
+    }
+    /**
+     * Draws a rounded speech-bubble tag with an optional pointer towards its anchor.
+     */
+    function drawTag(ctx, params) {
+        const hpr = params._internal_horizontalPixelRatio;
+        const vpr = params._internal_verticalPixelRatio;
+        const left = Math.round((params._internal_x - params._internal_width / 2) * hpr);
+        const right = Math.round((params._internal_x + params._internal_width / 2) * hpr);
+        const top = Math.round((params._internal_centerY - params._internal_height / 2) * vpr);
+        const bottom = Math.round((params._internal_centerY + params._internal_height / 2) * vpr);
+        const xCenter = Math.round(params._internal_x * hpr);
+        const radius = Math.min(params._internal_radius * hpr, (right - left) / 2, (bottom - top) / 2);
+        const tailHeight = params._internal_tailHeight * vpr;
+        const tailHalfWidth = Math.min(tailHeight * TAIL_HALF_WIDTH_RATIO, Math.max(0, (right - left) / 2 - radius));
+        const hasTail = params._internal_tailDirection !== 'none' && tailHalfWidth > 0 && tailHeight > 0;
+        ctx.save();
+        ctx.beginPath();
+        if (!hasTail) {
+            drawRoundRect(ctx, left, top, right - left, bottom - top, [radius, radius, radius, radius]);
+        }
+        else {
+            ctx.moveTo(left + radius, top);
+            if (params._internal_tailDirection === 'up') {
+                tailPath(ctx, xCenter, top, tailHeight, tailHalfWidth, true);
+            }
+            ctx.lineTo(right - radius, top);
+            ctx.arcTo(right, top, right, top + radius, radius);
+            ctx.lineTo(right, bottom - radius);
+            ctx.arcTo(right, bottom, right - radius, bottom, radius);
+            if (params._internal_tailDirection === 'down') {
+                tailPath(ctx, xCenter, bottom, tailHeight, tailHalfWidth, false);
+            }
+            ctx.lineTo(left + radius, bottom);
+            ctx.arcTo(left, bottom, left, bottom - radius, radius);
+            ctx.lineTo(left, top + radius);
+            ctx.arcTo(left, top, left + radius, top, radius);
+        }
+        ctx.closePath();
+        ctx.fillStyle = params._internal_fillColor;
+        ctx.fill();
+        if (params._internal_borderColor !== undefined && params._internal_borderWidth > 0) {
+            ctx.lineWidth = Math.max(1, Math.round(params._internal_borderWidth * hpr));
+            ctx.strokeStyle = params._internal_borderColor;
+            ctx.stroke();
+        }
+        ctx.restore();
+    }
+    function hitTestTag(centerX, centerY, tag, x, y) {
+        if (tag._internal_width <= 0) {
+            return false;
+        }
+        const halfHeight = tag._internal_height / 2;
+        const top = tag._internal_tailDirection === 'up' ? centerY - halfHeight - tag._internal_tailHeight : centerY - halfHeight;
+        const bottom = tag._internal_tailDirection === 'down' ? centerY + halfHeight + tag._internal_tailHeight : centerY + halfHeight;
+        const left = centerX - tag._internal_width / 2;
+        return x >= left && x <= left + tag._internal_width && y >= top && y <= bottom;
+    }
+
     function drawText(ctx, text, x, y, horizontalPixelRatio, verticalPixelRatio) {
         ctx.save();
         ctx.scale(horizontalPixelRatio, verticalPixelRatio);
@@ -14766,9 +14847,11 @@
         constructor() {
             this._private__data = null;
             this._private__textWidthCache = new TextWidthCache();
+            this._private__tagTextWidthCache = new TextWidthCache();
             this._private__fontSize = -1;
             this._private__fontFamily = '';
             this._private__font = '';
+            this._private__tagFont = '';
             this._private__zOrder = 'normal';
         }
         _internal_setData(data) {
@@ -14779,7 +14862,11 @@
                 this._private__fontSize = fontSize;
                 this._private__fontFamily = fontFamily;
                 this._private__font = makeFont(fontSize, fontFamily);
+                // Tags carry a label rather than an annotation, so they get the heavier
+                // weight — and their own cache, since widths differ per font.
+                this._private__tagFont = makeFont(fontSize, fontFamily, '600');
                 this._private__textWidthCache._internal_reset();
+                this._private__tagTextWidthCache._internal_reset();
             }
             this._private__zOrder = zOrder;
         }
@@ -14819,14 +14906,21 @@
                 return;
             }
             ctx.textBaseline = 'middle';
-            ctx.font = this._private__font;
             for (let index = this._private__data._internal_visibleRange.from; index < this._private__data._internal_visibleRange.to; index++) {
                 const item = this._private__data._internal_items[index];
+                const isTag = item._internal_tag !== undefined;
+                ctx.font = isTag ? this._private__tagFont : this._private__font;
                 if (item._internal_text !== undefined) {
-                    item._internal_text._internal_width = this._private__textWidthCache._internal_measureText(ctx, item._internal_text._internal_content);
+                    const cache = isTag ? this._private__tagTextWidthCache : this._private__textWidthCache;
+                    item._internal_text._internal_width = cache._internal_measureText(ctx, item._internal_text._internal_content);
                     item._internal_text._internal_height = this._private__fontSize;
                     item._internal_text._internal_x = item._internal_x - item._internal_text._internal_width / 2;
                 }
+                if (item._internal_tag !== undefined) {
+                    const textWidth = item._internal_text !== undefined ? item._internal_text._internal_width : 0;
+                    item._internal_tag._internal_width = Math.max(textWidth + item._internal_tag._internal_paddingX * 2, item._internal_tag._internal_height);
+                    item._internal_tag._internal_left = item._internal_x - item._internal_tag._internal_width / 2;
+                }
                 drawItem(item, ctx, horizontalPixelRatio, verticalPixelRatio);
             }
         }
@@ -14841,12 +14935,40 @@
         };
     }
     function drawItem(item, ctx, horizontalPixelRatio, verticalPixelRatio) {
+        if (item._internal_tag !== undefined) {
+            drawTagItem(item, item._internal_tag, ctx, horizontalPixelRatio, verticalPixelRatio);
+            return;
+        }
         ctx.fillStyle = item._internal_color;
         if (item._internal_text !== undefined) {
             drawText(ctx, item._internal_text._internal_content, item._internal_text._internal_x, item._internal_text._internal_y, horizontalPixelRatio, verticalPixelRatio);
         }
         drawShape(item, ctx, bitmapShapeItemCoordinates(item, horizontalPixelRatio, verticalPixelRatio));
     }
+    // eslint-disable-next-line max-params
+    function drawTagItem(item, tag, ctx, horizontalPixelRatio, verticalPixelRatio) {
+        if (item._internal_size === 0) {
+            return;
+        }
+        drawTag(ctx, {
+            _internal_x: item._internal_x,
+            _internal_centerY: item._internal_y,
+            _internal_width: tag._internal_width,
+            _internal_height: tag._internal_height,
+            _internal_tailHeight: tag._internal_tailHeight,
+            _internal_tailDirection: tag._internal_tailDirection,
+            _internal_radius: tag._internal_radius,
+            _internal_fillColor: item._internal_color,
+            _internal_borderColor: item._internal_borderColor,
+            _internal_borderWidth: item._internal_borderWidth ?? 1,
+            _internal_horizontalPixelRatio: horizontalPixelRatio,
+            _internal_verticalPixelRatio: verticalPixelRatio,
+        });
+        if (item._internal_text !== undefined) {
+            ctx.fillStyle = item._internal_textColor ?? '#FFFFFF';
+            drawText(ctx, item._internal_text._internal_content, item._internal_text._internal_x, item._internal_text._internal_y, horizontalPixelRatio, verticalPixelRatio);
+        }
+    }
     function drawShape(item, ctx, coordinates) {
         if (item._internal_size === 0) {
             return;
@@ -14864,10 +14986,16 @@
             case 'square':
                 drawSquare(ctx, coordinates, item._internal_size);
                 return;
+            case 'tag':
+                // Handled by drawTagItem, which needs both pixel ratios and the text.
+                return;
         }
         ensureNever(item._internal_shape);
     }
     function hitTestItem(item, x, y) {
+        if (item._internal_tag !== undefined) {
+            return item._internal_size !== 0 && hitTestTag(item._internal_x, item._internal_y, item._internal_tag, x, y);
+        }
         if (item._internal_text !== undefined && hitTestText(item._internal_text._internal_x, item._internal_text._internal_y, item._internal_text._internal_width, item._internal_text._internal_height, x, y)) {
             return true;
         }
@@ -14886,6 +15014,8 @@
                 return hitTestCircle(item._internal_x, item._internal_y, item._internal_size, x, y);
             case 'square':
                 return hitTestSquare(item._internal_x, item._internal_y, item._internal_size, x, y);
+            case 'tag':
+                return false;
         }
     }
 
@@ -14918,15 +15048,71 @@
         }
         return;
     }
+    /**
+     * Lays out a `tag` marker: the bubble carries the text, so it is measured from
+     * the font rather than from the bar spacing, and its pointer is aimed back at
+     * the anchor price.
+     */
+    // eslint-disable-next-line max-params
+    function fillTagSizeAndY(rendererItem, marker, anchorY, offsets, textHeight, shapeMargin, sizeMultiplier) {
+        const height = Math.round((textHeight + 5 /* Constants.TagPaddingY */ * 2) * sizeMultiplier);
+        const tailHeight = Math.round(7 /* Constants.TagTailHeight */ * sizeMultiplier);
+        const ignoreOffset = isPriceMarker(marker.position);
+        const halfHeight = height / 2;
+        let tailDirection = 'none';
+        let centerY = anchorY;
+        switch (marker.position) {
+            case 'aboveBar':
+            case 'atPriceTop': {
+                const offset = ignoreOffset ? 0 : offsets._internal_aboveBar;
+                tailDirection = 'down';
+                centerY = (anchorY - offset - tailHeight - halfHeight);
+                if (!ignoreOffset) {
+                    offsets._internal_aboveBar += height + tailHeight + shapeMargin;
+                }
+                break;
+            }
+            case 'belowBar':
+            case 'atPriceBottom': {
+                const offset = ignoreOffset ? 0 : offsets._internal_belowBar;
+                tailDirection = 'up';
+                centerY = (anchorY + offset + tailHeight + halfHeight);
+                if (!ignoreOffset) {
+                    offsets._internal_belowBar += height + tailHeight + shapeMargin;
+                }
+                break;
+            }
+        }
+        const tag = {
+            _internal_height: height,
+            _internal_tailHeight: tailHeight,
+            _internal_tailDirection: tailDirection,
+            _internal_radius: marker.borderRadius ?? 6 /* Constants.TagRadius */,
+            _internal_paddingX: 9 /* Constants.TagPaddingX */ * sizeMultiplier,
+            _internal_left: 0,
+            _internal_width: 0,
+        };
+        rendererItem._internal_size = height;
+        rendererItem._internal_y = centerY;
+        rendererItem._internal_tag = tag;
+        if (rendererItem._internal_text !== undefined) {
+            rendererItem._internal_text._internal_y = centerY;
+        }
+    }
     // eslint-disable-next-line max-params, complexity
-    function fillSizeAndY(rendererItem, marker, seriesData, offsets, textHeight, shapeMargin, series, chart) {
-        const price = getPrice(seriesData, marker, series.priceScale().options().invertScale);
+    function fillSizeAndY(rendererItem, marker, seriesData, offsets, textHeight, shapeMargin, series, chart, invertScale) {
+        const price = getPrice(seriesData, marker, invertScale);
         if (price === undefined) {
             return;
         }
         const ignoreOffset = isPriceMarker(marker.position);
         const timeScale = chart.timeScale();
         const sizeMultiplier = isNumber(marker.size) ? Math.max(marker.size, 0) : 1;
+        if (marker.shape === 'tag') {
+            const anchorY = ensureNotNull(series.priceToCoordinate(price));
+            fillTagSizeAndY(rendererItem, marker, anchorY, offsets, textHeight, shapeMargin, sizeMultiplier);
+            return;
+        }
         const shapeSize = calculateShapeHeight(timeScale.options().barSpacing) * sizeMultiplier;
         const halfSize = shapeSize / 2;
         rendererItem._internal_size = shapeSize;
@@ -15033,6 +15219,10 @@
                     _internal_externalId: marker.id,
                     _internal_internalId: marker._internal_internalId,
                     _internal_text: undefined,
+                    _internal_textColor: marker.textColor,
+                    _internal_borderColor: marker.borderColor,
+                    _internal_borderWidth: marker.borderWidth,
+                    _internal_tag: undefined,
                 }));
                 this._private__dataInvalidated = false;
             }
@@ -15043,13 +15233,22 @@
                 return;
             }
             const visibleBarsRange = new RangeImpl(Math.floor(visibleBars.from), Math.ceil(visibleBars.to));
-            const firstValue = this._private__series.data()[0];
+            const firstValue = this._private__series.dataByIndex(0, 1 /* MismatchDirection.NearestRight */);
             if (firstValue === null) {
                 return;
             }
             if (this._private__data._internal_items.length === 0) {
                 return;
             }
+            // This runs inside the hit-test and paint loops, where a throw costs the
+            // rest of the frame.
+            let invertScale = false;
+            try {
+                invertScale = this._private__series.priceScale().options().invertScale;
+            }
+            catch (error) {
+                invertScale = false;
+            }
             let prevTimeIndex = NaN;
             const shapeMargin$1 = shapeMargin(timeScale.options().barSpacing);
             const offsets = {
@@ -15080,7 +15279,7 @@
                 if (dataAt === null) {
                     continue;
                 }
-                fillSizeAndY(rendererItem, marker, dataAt, offsets, layoutOptions.fontSize, shapeMargin$1, this._private__series, this._private__chart);
+                fillSizeAndY(rendererItem, marker, dataAt, offsets, layoutOptions.fontSize, shapeMargin$1, this._private__series, this._private__chart, invertScale);
             }
             this._private__invalidated = false;
         }
@@ -15238,6 +15437,10 @@
                     text: marker.text,
                     size: marker.size,
                     price: marker.price,
+                    textColor: marker.textColor,
+                    borderColor: marker.borderColor,
+                    borderWidth: marker.borderWidth,
+                    borderRadius: marker.borderRadius,
                     _internal_originalTime: marker.time,
                 };
                 if (marker.position === 'atPriceTop' ||
@@ -19539,6 +19742,7 @@
         constructor(chart, element) {
             this._private__lines = new Map();
             this._private__hoveredId = null;
+            this._private__hoveredPart = null;
             this._private__dragging = null;
             this._private__pointerId = null;
             this._private__pressOrigin = null;
@@ -19596,8 +19800,12 @@
             if (this._private__dragging !== null) {
                 return;
             }
-            const hovered = this._private__lineFromHit(param.hoveredObjectId);
+            const hit = this._private__splitHit(param.hoveredObjectId);
+            const hovered = hit === null ? null : this._private__lines.get(hit._internal_id) ?? null;
             this._private__setHovered(hovered ? hovered.id() : null);
+            // The part is updated after the id, and separately from it: moving from a
+            // label onto its close button keeps the same line hovered.
+            this._private__setHoveredPart(hovered, hovered === null ? null : hit?._internal_part ?? null);
             this._private__applyCursor();
         }
         _private__onPointerDown(event) {
@@ -19701,24 +19909,43 @@
             if (line === null) {
                 return null;
             }
-            // While the pointer is over the panes the engine gives pane coordinates.
-            // Once it leaves them — during a captured drag — fall back to the pane
-            // element, which still excludes the price axis.
+            // The pointer event is the gesture's own position, so it is the source of
+            // truth. The crosshair is only a mirror of it: it stops updating as soon
+            // as the pointer leaves the pane canvas — over the price axis, past the
+            // chart's edge — and a drag driven from it freezes there while the user
+            // is still moving.
+            const pane = this._private__chart.panes()[line.paneIndex()];
+            const paneElement = pane ? pane.getHTMLElement() : null;
+            if (paneElement) {
+                return line.priceAt(event.clientY - paneElement.getBoundingClientRect().top);
+            }
             if (this._private__point !== null && this._private__paneIndex === line.paneIndex()) {
                 return line.priceAt(this._private__point._internal_y);
             }
-            const pane = this._private__chart.panes()[line.paneIndex()];
-            const paneElement = pane ? pane.getHTMLElement() : null;
-            if (!paneElement) {
+            return null;
+        }
+        /**
+         * Hit ids are either a bare line id or `id#part`, which is how a line with
+         * several targets reports which one was hit.
+         */
+        _private__splitHit(externalId) {
+            if (typeof externalId !== 'string' || externalId.length === 0) {
                 return null;
             }
-            return line.priceAt(event.clientY - paneElement.getBoundingClientRect().top);
+            const separator = externalId.indexOf('#');
+            if (separator === -1) {
+                return { _internal_id: externalId, _internal_part: null };
+            }
+            return { _internal_id: externalId.slice(0, separator), _internal_part: externalId.slice(separator + 1) };
         }
-        _private__lineFromHit(externalId) {
-            if (typeof externalId !== 'string') {
-                return null;
+        _private__setHoveredPart(line, part) {
+            if (this._private__hoveredPart === part) {
+                return;
+            }
+            this._private__hoveredPart = part;
+            if (line && line.setHoveredPart) {
+                line.setHoveredPart(part);
             }
-            return this._private__lines.get(externalId) ?? null;
         }
         _private__setHovered(id) {
             if (this._private__hoveredId === id) {
@@ -19728,6 +19955,7 @@
                 this._private__lines.get(this._private__hoveredId)?.setHovered(false);
             }
             this._private__hoveredId = id;
+            this._private__hoveredPart = null;
             if (id !== null) {
                 this._private__lines.get(id)?.setHovered(true);
             }
@@ -20251,6 +20479,702 @@
         return new InteractiveLineManager(chart, series);
     }
 
+    const positionLineDefaultColors = {
+        entry: '#2962FF',
+        takeProfit: '#26A17B',
+        stopLoss: '#D9A23B',
+    };
+    const positionLineThemeDefaults = {
+        badgeTextColor: '#FFFFFF',
+        borderRadius: 4,
+        borderWidth: 1,
+        paddingX: 8,
+        paddingY: 6,
+        backgroundOpacity: 1,
+    };
+    const positionLineLevels = ['takeProfit', 'entry', 'stopLoss'];
+
+    class PositionLineRenderer {
+        constructor() {
+            this._private__data = null;
+            this._private__layouts = [];
+            this._private__connectorX = 0;
+            this._private__font = '';
+            this._private__colorParser = new ColorParser([]);
+            this._private__textWidthCache = new TextWidthCache(50);
+        }
+        _internal_setData(data) {
+            this._private__data = data;
+        }
+        _internal_hitTest(x, y) {
+            // The close button sits on top of the label, which sits on top of the
+            // line, so the narrowest target is tested first.
+            for (const layout of this._private__layouts) {
+                if (layout._internal_closable && x >= layout._internal_closeLeft && x <= layout._internal_closeRight &&
+                    Math.abs(y - layout._internal_y) <= layout._internal_height / 2) {
+                    return { _internal_level: layout._internal_level, _internal_part: 'close' };
+                }
+            }
+            for (const layout of this._private__layouts) {
+                if (x >= layout._internal_pillLeft && x <= layout._internal_pillRight && Math.abs(y - layout._internal_y) <= layout._internal_height / 2) {
+                    return { _internal_level: layout._internal_level, _internal_part: 'body' };
+                }
+            }
+            for (const layout of this._private__layouts) {
+                if (Math.abs(y - layout._internal_y) <= 8 /* Constants.LineHitTolerance */) {
+                    return { _internal_level: layout._internal_level, _internal_part: 'line' };
+                }
+            }
+            return null;
+        }
+        draw(target) {
+            target.useBitmapCoordinateSpace((scope) => this._private__drawImpl(scope));
+        }
+        _private__drawImpl(scope) {
+            const data = this._private__data;
+            this._private__layouts = [];
+            if (data === null || data._internal_levels.length === 0) {
+                return;
+            }
+            const { context: ctx, mediaSize } = scope;
+            ctx.save();
+            if (this._private__font !== data._internal_font) {
+                this._private__font = data._internal_font;
+                this._private__textWidthCache._internal_reset();
+            }
+            ctx.font = data._internal_font;
+            ctx.textBaseline = 'middle';
+            this._private__connectorX = Math.max(0, mediaSize.width - data._internal_rightOffset);
+            const lineEnd = data._internal_connectorVisible ? this._private__connectorX : mediaSize.width;
+            for (const level of data._internal_levels) {
+                this._private__layouts.push(this._private__drawLevel(scope, data, level, lineEnd));
+            }
+            if (data._internal_connectorVisible && data._internal_levels.length > 1) {
+                this._private__drawConnector(scope, data);
+            }
+            ctx.restore();
+        }
+        // eslint-disable-next-line max-params
+        _private__drawLevel(scope, data, level, lineEnd) {
+            const { context: ctx, horizontalPixelRatio: hpr, verticalPixelRatio: vpr } = scope;
+            const height = data._internal_fontSize + data._internal_paddingY * 2;
+            const badgeWidth = level._internal_badge.length === 0
+                ? 0
+                : Math.max(this._private__textWidthCache._internal_measureText(ctx, level._internal_badge) + data._internal_paddingX * 2, height * 0.85 /* Constants.BadgeMinWidthRatio */);
+            const labelWidth = this._private__textWidthCache._internal_measureText(ctx, level._internal_text) + data._internal_paddingX * 2;
+            const closeWidth = level._internal_closable ? height : 0;
+            const pillWidth = badgeWidth + labelWidth + closeWidth;
+            const pillRight = Math.max(pillWidth, lineEnd - 8 /* Constants.LabelGap */);
+            const pillLeft = pillRight - pillWidth;
+            const top = level._internal_y - height / 2;
+            this._private__drawLineSegments(scope, level, pillLeft, pillRight, lineEnd);
+            this._private__drawPill(scope, data, level, { _internal_left: pillLeft, _internal_top: top, _internal_width: pillWidth, _internal_height: height });
+            let cellLeft = pillLeft;
+            if (badgeWidth > 0) {
+                this._private__drawBadge(scope, data, level, { _internal_left: cellLeft, _internal_top: top, _internal_width: badgeWidth, _internal_height: height });
+                cellLeft += badgeWidth;
+                this._private__drawSeparator(ctx, level._internal_color, cellLeft, top, height, hpr, vpr);
+            }
+            ctx.save();
+            ctx.scale(hpr, vpr);
+            ctx.textAlign = 'center';
+            ctx.fillStyle = data._internal_textColor ?? level._internal_color;
+            ctx.fillText(level._internal_text, cellLeft + labelWidth / 2, level._internal_y);
+            ctx.restore();
+            cellLeft += labelWidth;
+            if (level._internal_closable) {
+                this._private__drawSeparator(ctx, level._internal_color, cellLeft, top, height, hpr, vpr);
+                this._private__drawCloseButton(scope, data, level, { _internal_left: cellLeft, _internal_top: top, _internal_width: closeWidth, _internal_height: height });
+            }
+            return {
+                _internal_level: level._internal_level,
+                _internal_y: level._internal_y,
+                _internal_height: height,
+                _internal_pillLeft: pillLeft,
+                _internal_pillRight: pillRight,
+                _internal_closeLeft: cellLeft,
+                _internal_closeRight: cellLeft + closeWidth,
+                _internal_closable: level._internal_closable,
+            };
+        }
+        // eslint-disable-next-line max-params
+        _private__drawLineSegments(scope, level, pillLeft, pillRight, lineEnd) {
+            const { context: ctx, horizontalPixelRatio: hpr, verticalPixelRatio: vpr } = scope;
+            const lineWidth = Math.max(1, Math.round(level._internal_lineWidth * vpr));
+            const y = Math.round(level._internal_y * vpr) - Math.floor(lineWidth / 2);
+            ctx.save();
+            ctx.strokeStyle = level._internal_color;
+            ctx.lineWidth = lineWidth;
+            setLineStyle(ctx, level._internal_lineStyle);
+            ctx.beginPath();
+            ctx.moveTo(0, y);
+            ctx.lineTo(Math.round(Math.max(0, pillLeft - 8 /* Constants.LabelGap */) * hpr), y);
+            if (lineEnd > pillRight + 8 /* Constants.LabelGap */) {
+                ctx.moveTo(Math.round((pillRight + 8 /* Constants.LabelGap */) * hpr), y);
+                ctx.lineTo(Math.round(lineEnd * hpr), y);
+            }
+            ctx.stroke();
+            ctx.restore();
+        }
+        // eslint-disable-next-line max-params
+        _private__drawPill(scope, data, level, box) {
+            const { context: ctx, horizontalPixelRatio: hpr, verticalPixelRatio: vpr } = scope;
+            const hovered = data._internal_hoveredLevel === level._internal_level;
+            const borderWidth = Math.max(1, Math.round((hovered ? data._internal_borderWidth + 1 : data._internal_borderWidth) * hpr));
+            ctx.save();
+            ctx.setLineDash([]);
+            bitmapRoundRect(ctx, box, data._internal_borderRadius, hpr, vpr);
+            ctx.fillStyle = this._private__colorParser._internal_applyAlpha(data._internal_background, data._internal_backgroundOpacity);
+            ctx.fill();
+            ctx.lineWidth = borderWidth;
+            ctx.strokeStyle = level._internal_color;
+            ctx.stroke();
+            ctx.restore();
+        }
+        // eslint-disable-next-line max-params
+        _private__drawBadge(scope, data, level, box) {
+            const { context: ctx, horizontalPixelRatio: hpr, verticalPixelRatio: vpr } = scope;
+            if (level._internal_badgeFilled) {
+                // The badge shares the label's left corners, so its fill has to stop
+                // short of the border instead of squaring it off.
+                const inset = data._internal_borderWidth;
+                ctx.save();
+                bitmapRoundRect(ctx, { _internal_left: box._internal_left + inset, _internal_top: box._internal_top + inset, _internal_width: box._internal_width - inset, _internal_height: box._internal_height - inset * 2 }, Math.max(0, data._internal_borderRadius - inset), hpr, vpr, 'left');
+                ctx.fillStyle = level._internal_color;
+                ctx.fill();
+                ctx.restore();
+            }
+            ctx.save();
+            ctx.scale(hpr, vpr);
+            ctx.textAlign = 'center';
+            ctx.fillStyle = level._internal_badgeFilled ? data._internal_badgeTextColor : level._internal_color;
+            ctx.fillText(level._internal_badge, box._internal_left + box._internal_width / 2, box._internal_top + box._internal_height / 2);
+            ctx.restore();
+        }
+        // eslint-disable-next-line max-params
+        _private__drawSeparator(ctx, color, x, top, height, hpr, vpr) {
+            const width = Math.max(1, Math.floor(hpr));
+            ctx.save();
+            ctx.setLineDash([]);
+            ctx.fillStyle = this._private__colorParser._internal_applyAlpha(color, 0.4 /* Constants.SeparatorAlpha */);
+            ctx.fillRect(Math.round(x * hpr), Math.round(top * vpr), width, Math.round(height * vpr));
+            ctx.restore();
+        }
+        // eslint-disable-next-line max-params
+        _private__drawCloseButton(scope, data, level, box) {
+            const { context: ctx, horizontalPixelRatio: hpr, verticalPixelRatio: vpr } = scope;
+            const hovered = data._internal_hoveredLevel === level._internal_level && data._internal_hoveredPart === 'close';
+            if (hovered) {
+                ctx.save();
+                const inset = data._internal_borderWidth;
+                bitmapRoundRect(ctx, { _internal_left: box._internal_left, _internal_top: box._internal_top + inset, _internal_width: box._internal_width - inset, _internal_height: box._internal_height - inset * 2 }, Math.max(0, data._internal_borderRadius - inset), hpr, vpr, 'right');
+                ctx.fillStyle = this._private__colorParser._internal_applyAlpha(level._internal_color, 0.25);
+                ctx.fill();
+                ctx.restore();
+            }
+            const centerX = (box._internal_left + box._internal_width / 2) * hpr;
+            const centerY = (box._internal_top + box._internal_height / 2) * vpr;
+            const arm = (7 /* Constants.CloseGlyphSize */ / 2) * hpr;
+            ctx.save();
+            ctx.setLineDash([]);
+            ctx.lineCap = 'round';
+            ctx.lineWidth = Math.max(1, Math.round(1.4 * hpr));
+            ctx.strokeStyle = level._internal_color;
+            ctx.beginPath();
+            ctx.moveTo(centerX - arm, centerY - arm);
+            ctx.lineTo(centerX + arm, centerY + arm);
+            ctx.moveTo(centerX + arm, centerY - arm);
+            ctx.lineTo(centerX - arm, centerY + arm);
+            ctx.stroke();
+            ctx.restore();
+        }
+        _private__drawConnector(scope, data) {
+            const { context: ctx, horizontalPixelRatio: hpr, verticalPixelRatio: vpr } = scope;
+            const entry = data._internal_levels.find((level) => level._internal_level === 'entry') ?? data._internal_levels[0];
+            const ys = data._internal_levels.map((level) => level._internal_y);
+            const x = Math.round(this._private__connectorX * hpr);
+            ctx.save();
+            ctx.setLineDash([]);
+            ctx.strokeStyle = entry._internal_color;
+            ctx.lineWidth = Math.max(1, Math.floor(hpr));
+            ctx.beginPath();
+            ctx.moveTo(x, Math.round(Math.min(...ys) * vpr));
+            ctx.lineTo(x, Math.round(Math.max(...ys) * vpr));
+            ctx.stroke();
+            for (const level of data._internal_levels) {
+                ctx.beginPath();
+                ctx.arc(x, Math.round(level._internal_y * vpr), 4.5 /* Constants.HandleRadius */ * hpr, 0, 2 * Math.PI);
+                ctx.fillStyle = level._internal_level === 'entry'
+                    ? entry._internal_color
+                    : this._private__colorParser._internal_applyAlpha(data._internal_background, data._internal_backgroundOpacity);
+                ctx.fill();
+                ctx.lineWidth = Math.max(1, Math.round(1.5 * hpr));
+                ctx.strokeStyle = level._internal_color;
+                ctx.stroke();
+            }
+            ctx.restore();
+        }
+    }
+    // eslint-disable-next-line max-params
+    function bitmapRoundRect(ctx, box, radius, hpr, vpr, side = 'all') {
+        const left = Math.round(box._internal_left * hpr);
+        const top = Math.round(box._internal_top * vpr);
+        const width = Math.round(box._internal_width * hpr);
+        const height = Math.round(box._internal_height * vpr);
+        const r = Math.min(radius * hpr, width / 2, height / 2);
+        const radii = side === 'left'
+            ? [r, 0, 0, r]
+            : side === 'right'
+                ? [0, r, r, 0]
+                : [r, r, r, r];
+        drawRoundRect(ctx, left, top, width, height, radii);
+    }
+
+    class PositionLinePaneView {
+        constructor() {
+            this._private__renderer = new PositionLineRenderer();
+            this._private__data = null;
+        }
+        _internal_update(data) {
+            this._private__data = data;
+        }
+        renderer() {
+            if (this._private__data === null) {
+                return null;
+            }
+            this._private__renderer._internal_setData(this._private__data);
+            return this._private__renderer;
+        }
+        zOrder() {
+            return 'top';
+        }
+        _internal_hitTest(x, y) {
+            return this._private__data === null ? null : this._private__renderer._internal_hitTest(x, y);
+        }
+    }
+
+    class PositionLineAxisView {
+        constructor(source) {
+            this._private__source = source;
+        }
+        coordinate() {
+            // A hidden label is pushed far off the axis so it cannot reserve a gap
+            // between the labels that are shown.
+            return this._private__label()?._internal_coordinate ?? -1e3;
+        }
+        text() {
+            return this._private__label()?._internal_text ?? '';
+        }
+        textColor() {
+            return this._private__label()?._internal_textColor ?? '#FFFFFF';
+        }
+        backColor() {
+            return this._private__label()?._internal_color ?? '#000000';
+        }
+        visible() {
+            return this._private__label() !== null;
+        }
+        _private__label() {
+            return this._private__source();
+        }
+    }
+
+    let nextPositionId = 0;
+    const DEFAULT_RIGHT_OFFSET = 56;
+    /**
+     * A group of trading levels — entry, take profit and stop loss — drawn as one
+     * unit: a line per level, a label carrying size and P&L, and a connector that
+     * ties the three together.
+     *
+     * Input is not handled here. Every trading line on a chart shares a single
+     * TradingLineController, which is what guarantees that one gesture moves one
+     * level, and that a position line and a plain draggable price line on the same
+     * chart do not fight over the pointer.
+     */
+    class PositionLine {
+        constructor(chart, series, options) {
+            this._private__paneView = new PositionLinePaneView();
+            this._private__colorParser = new ColorParser([]);
+            this._private__attached = false;
+            this._private__hoveredLevel = null;
+            this._private__hoveredPart = null;
+            this._private__dragLevel = null;
+            this._private__priceBeforeDrag = null;
+            this._private__chart = chart;
+            this._private__series = series;
+            this._private__id = `pipsend-position-line-${nextPositionId++}`;
+            this._private__options = options;
+            this._private__theme = { ...positionLineThemeDefaults, ...options.theme };
+            this._private__paneViews = [this._private__paneView];
+            this._private__axisViews = positionLineLevels.map((level) => new PositionLineAxisView(() => this._private__axisLabel(level)));
+            this._private__series.attachPrimitive(this);
+            acquireController(this._private__chart)?._internal_register(this);
+        }
+        // ---- ISeriesPrimitive ----
+        attached(param) {
+            this._private__requestUpdate = param.requestUpdate;
+            this._private__attached = true;
+            this.requestUpdate();
+        }
+        detached() {
+            this._private__attached = false;
+            this._private__requestUpdate = undefined;
+        }
+        paneViews() {
+            return this._private__paneViews;
+        }
+        priceAxisViews() {
+            return this._private__axisViews;
+        }
+        updateAllViews() {
+            this._private__paneView._internal_update(this._private__buildRendererData());
+        }
+        hitTest(x, y) {
+            const hit = this._private__paneView._internal_hitTest(x, y);
+            if (hit === null) {
+                return null;
+            }
+            const level = this._private__levelOptions(hit._internal_level);
+            if (level === null) {
+                return null;
+            }
+            return {
+                externalId: `${this._private__id}#${hit._internal_level}:${hit._internal_part}`,
+                zOrder: 'top',
+                cursorStyle: hit._internal_part === 'close'
+                    ? 'pointer'
+                    : (level.draggable ?? true) ? 'ns-resize' : undefined,
+            };
+        }
+        // ---- ControllableLine ----
+        id() {
+            return this._private__id;
+        }
+        paneIndex() {
+            try {
+                return this._private__series.getPane().paneIndex();
+            }
+            catch (error) {
+                // The engine asserts the series belongs to a pane, and that lookup can
+                // come back empty while panes are being rebuilt. The main pane is the
+                // right guess and keeps the gesture alive instead of throwing mid-drag.
+                return 0;
+            }
+        }
+        setHoveredPart(part) {
+            const [level, name] = part === null ? [null, null] : part.split(':');
+            const nextLevel = level ?? null;
+            const nextPart = name ?? null;
+            if (this._private__hoveredLevel === nextLevel && this._private__hoveredPart === nextPart) {
+                return;
+            }
+            this._private__hoveredLevel = nextLevel;
+            this._private__hoveredPart = nextPart;
+            this.requestUpdate();
+        }
+        setHovered(hovered) {
+            if (!hovered) {
+                this.setHoveredPart(null);
+            }
+        }
+        isDraggable() {
+            if (this._private__hoveredLevel === null || this._private__hoveredPart === 'close') {
+                return false;
+            }
+            return this._private__levelOptions(this._private__hoveredLevel)?.draggable ?? true;
+        }
+        isClickable() {
+            if (this._private__hoveredPart === 'close') {
+                return true;
+            }
+            return this._private__options.onClick !== undefined;
+        }
+        priceAt(paneY) {
+            const price = this._private__series.coordinateToPrice(paneY);
+            return price === null ? null : price;
+        }
+        beginDrag() {
+            this._private__dragLevel = this._private__hoveredLevel;
+            if (this._private__dragLevel === null) {
+                return;
+            }
+            const price = this._private__levelOptions(this._private__dragLevel)?.price ?? null;
+            this._private__priceBeforeDrag = price;
+            if (price !== null && this._private__options.onDragStart) {
+                this._private__options.onDragStart(this._private__dragLevel, price);
+            }
+        }
+        dragTo(price) {
+            if (this._private__dragLevel === null) {
+                return;
+            }
+            this._private__applyPrice(this._private__dragLevel, price);
+            if (this._private__options.onDragMove) {
+                this._private__options.onDragMove(this._private__dragLevel, price);
+            }
+        }
+        commitDrag() {
+            const level = this._private__dragLevel;
+            this._private__dragLevel = null;
+            this._private__priceBeforeDrag = null;
+            if (level === null) {
+                return;
+            }
+            const price = this._private__levelOptions(level)?.price;
+            if (price !== undefined && this._private__options.onDragEnd) {
+                this._private__options.onDragEnd(level, price);
+            }
+        }
+        cancelDrag() {
+            const level = this._private__dragLevel;
+            const original = this._private__priceBeforeDrag;
+            this._private__dragLevel = null;
+            this._private__priceBeforeDrag = null;
+            if (level === null) {
+                return;
+            }
+            // Reported even when the price did not move, so a caller that pauses work
+            // on `onDragStart` always gets the matching end of the gesture.
+            const restored = original !== null && original !== this._private__levelOptions(level)?.price;
+            if (restored) {
+                this._private__applyPrice(level, original);
+                if (this._private__options.onDragMove) {
+                    this._private__options.onDragMove(level, original);
+                }
+            }
+            if (this._private__options.onDragCancel) {
+                this._private__options.onDragCancel(level, this._private__levelOptions(level)?.price ?? 0);
+            }
+        }
+        click() {
+            const level = this._private__hoveredLevel;
+            if (level === null) {
+                return;
+            }
+            if (this._private__hoveredPart === 'close') {
+                if (this._private__options.onClose) {
+                    this._private__options.onClose(level);
+                }
+                return;
+            }
+            const price = this._private__levelOptions(level)?.price;
+            if (price !== undefined && this._private__options.onClick) {
+                this._private__options.onClick(level, price);
+            }
+        }
+        // ---- public API ----
+        /**
+         * Updates the group. Any subset of options can be passed; the levels given
+         * are merged into the current ones, and a level set to `undefined` is
+         * removed.
+         */
+        applyOptions(options) {
+            // A level under an active gesture owns its price. Callers feeding the
+            // group from a socket re-send the old price several times a second, and
+            // letting that through would pull the level out from under the cursor.
+            const dragged = this._private__dragLevel;
+            const draggedPrice = dragged === null ? undefined : this._private__levelOptions(dragged)?.price;
+            const merged = { ...this._private__options, ...options };
+            merged.entry = { ...this._private__options.entry, ...options.entry };
+            merged.takeProfit = mergeLevel(this._private__options.takeProfit, options, 'takeProfit');
+            merged.stopLoss = mergeLevel(this._private__options.stopLoss, options, 'stopLoss');
+            this._private__options = merged;
+            if (dragged !== null && draggedPrice !== undefined) {
+                const level = this._private__levelOptions(dragged);
+                if (level !== null) {
+                    level.price = draggedPrice;
+                }
+            }
+            if (options.theme) {
+                // Merged onto what is already applied, so two partial theme updates do
+                // not undo each other.
+                this._private__theme = { ...this._private__theme, ...options.theme };
+            }
+            this.requestUpdate();
+        }
+        /**
+         * Moves one level to a new price, recomputing its text when the level has a
+         * `formatText`.
+         *
+         * Ignored for a level the user is currently dragging — the gesture owns the
+         * price until it reports back through
+         * {@link PositionLineOptions.onDragEnd} or
+         * {@link PositionLineOptions.onDragCancel}.
+         */
+        setPrice(level, price) {
+            if (this._private__dragLevel === level) {
+                return;
+            }
+            this._private__applyPrice(level, price);
+        }
+        /**
+         * Replaces one level's label text. Use this for text that changes on its own
+         * — a ticking P&L on a fixed entry — rather than with the price.
+         */
+        setText(level, text) {
+            const options = this._private__levelOptions(level);
+            if (options === null) {
+                return;
+            }
+            options.text = text;
+            this.requestUpdate();
+        }
+        /**
+         * The current price of each level that is present.
+         */
+        prices() {
+            const result = {};
+            for (const level of positionLineLevels) {
+                const options = this._private__levelOptions(level);
+                if (options !== null) {
+                    result[level] = options.price;
+                }
+            }
+            return result;
+        }
+        options() {
+            return this._private__options;
+        }
+        /**
+         * Removes the group from the chart and releases its share of the input
+         * controller.
+         */
+        remove() {
+            releaseController(this._private__chart, this);
+            this._private__series.detachPrimitive(this);
+        }
+        requestUpdate() {
+            if (this._private__requestUpdate) {
+                this._private__requestUpdate();
+            }
+        }
+        /** Reads back the label the price axis should draw for a level. */
+        _private__axisLabel(level) {
+            const options = this._private__levelOptions(level);
+            if (options === null || !isFinite(options.price) ||
+                this._private__options.visible === false || options.axisLabelVisible === false) {
+                return null;
+            }
+            const y = this._private__series.priceToCoordinate(options.price);
+            if (y === null) {
+                return null;
+            }
+            const color = options.color ?? positionLineDefaultColors[level];
+            return {
+                _internal_coordinate: y,
+                _internal_text: this._private__series.priceFormatter().format(options.price),
+                _internal_color: color,
+                _internal_textColor: this._private__colorParser._internal_generateContrastColors(color)._internal_foreground,
+            };
+        }
+        _private__levelOptions(level) {
+            const options = level === 'entry' ? this._private__options.entry : this._private__options[level];
+            return options ?? null;
+        }
+        _private__applyPrice(level, price) {
+            const options = this._private__levelOptions(level);
+            if (options === null) {
+                return;
+            }
+            options.price = price;
+            if (options.formatText) {
+                options.text = options.formatText(price);
+            }
+            this.requestUpdate();
+        }
+        _private__buildRendererData() {
+            if (!this._private__attached || this._private__options.visible === false) {
+                return null;
+            }
+            const levels = [];
+            for (const level of positionLineLevels) {
+                const options = this._private__levelOptions(level);
+                // A level added through a patch can be missing its price until the
+                // caller supplies one; drawing it would put it at NaN.
+                if (options === null || !isFinite(options.price)) {
+                    continue;
+                }
+                const y = this._private__series.priceToCoordinate(options.price);
+                if (y === null) {
+                    continue;
+                }
+                const isEntry = level === 'entry';
+                levels.push({
+                    _internal_level: level,
+                    _internal_y: y,
+                    _internal_color: options.color ?? positionLineDefaultColors[level],
+                    _internal_text: options.formatText ? options.formatText(options.price) : options.text ?? '',
+                    _internal_badge: options.badge ?? '',
+                    _internal_badgeFilled: options.badgeFilled ?? isEntry,
+                    _internal_lineWidth: options.lineWidth ?? 1,
+                    _internal_lineStyle: options.lineStyle ?? (isEntry ? 0 /* LineStyle.Solid */ : 2 /* LineStyle.Dashed */),
+                    _internal_closable: options.closable ?? true,
+                    _internal_draggable: options.draggable ?? true,
+                });
+            }
+            if (levels.length === 0) {
+                return null;
+            }
+            const layout = this._private__chart.options()['layout'];
+            const fontSize = this._private__theme.fontSize ?? layout.fontSize;
+            return {
+                _internal_levels: levels,
+                _internal_background: this._private__theme.background ?? resolveBackgroundColor(layout.background),
+                _internal_textColor: this._private__theme.textColor,
+                _internal_badgeTextColor: this._private__theme.badgeTextColor,
+                _internal_borderRadius: this._private__theme.borderRadius,
+                _internal_borderWidth: this._private__theme.borderWidth,
+                _internal_paddingX: this._private__theme.paddingX,
+                _internal_paddingY: this._private__theme.paddingY,
+                _internal_backgroundOpacity: this._private__theme.backgroundOpacity,
+                _internal_font: makeFont(fontSize, this._private__theme.fontFamily ?? layout.fontFamily),
+                _internal_fontSize: fontSize,
+                _internal_connectorVisible: this._private__options.connectorVisible !== false && levels.length > 1,
+                _internal_rightOffset: this._private__options.rightOffset ?? DEFAULT_RIGHT_OFFSET,
+                _internal_hoveredLevel: this._private__hoveredLevel,
+                _internal_hoveredPart: this._private__hoveredPart,
+            };
+        }
+    }
+    function mergeLevel(current, options, key) {
+        if (!(key in options)) {
+            return current;
+        }
+        const next = options[key];
+        return next === undefined ? undefined : { ...current, ...next };
+    }
+    /**
+     * Reads the chart's own background so the label sits on a solid surface. The
+     * parameter is typed as the public {@link Background}: the production build
+     * renames the members of structural types it does not see in the public API,
+     * and an anonymous `{ color: string }` here resolved to nothing at runtime.
+     */
+    function resolveBackgroundColor(background) {
+        return background.type === "solid" /* ColorType.Solid */ ? background.color : background.topColor;
+    }
+    /**
+     * Creates a position line group: entry, take profit and stop loss drawn as one
+     * interactive unit.
+     *
+     * @param series - The series the levels are priced against.
+     * @param chart - The chart the series belongs to.
+     * @param options - The levels and their style.
+     *
+     * @example
+     * ```js
+     * const position = createPositionLine(candleSeries, chart, {
+     *     entry: { price: 4306.79, badge: '1', formatText: () => '+ 2.32 USD' },
+     *     takeProfit: { price: 4349.58, badge: '1', text: '+ 42.79 USD' },
+     *     stopLoss: { price: 4266.06, badge: '1', text: '- 40.73 USD' },
+     *     onClose: (level) => console.log('close', level),
+     *     onDragEnd: (level, price) => console.log(level, 'moved to', price),
+     * });
+     * ```
+     */
+    function createPositionLine(series, chart, options) {
+        return new PositionLine(chart, series, options);
+    }
+
     /** Hit parts that drag the whole object rather than a single handle. */
     const WHOLE_OBJECT_PARTS = new Set([
         'line',
@@ -20408,6 +21332,9 @@
         get type() {
             return this._type;
         }
+        isComplete() {
+            return true;
+        }
         /**
          * Lets a tool hand the base its own options object, once, in the constructor.
          *
@@ -20735,6 +21662,7 @@
             this._private__dragStartPoint2 = null;
             // Interactive mode
             this._private__isComplete = false;
+            this._private__interactive = null;
             this._private__previewPoint = null;
             this._private__trendOptions = {
                 lineColor: '#2962ff',
@@ -20782,7 +21710,7 @@
                     this._private__isComplete = true;
                 }
             });
-            // Start the interactive drawing mode
+            this._private__interactive = manager;
             manager._internal_startDrawing();
         }
         _private__createPrimitive() {
@@ -21112,20 +22040,20 @@
         _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);
                 // Clean up references
                 this._private__primitive = null;
                 this._private__paneView = null;
-                // Force chart update by triggering a resize
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__trendOptions.onRemove) {
                 this._private__trendOptions.onRemove();
@@ -21398,12 +22326,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__hLineOptions.onRemove) {
                 this._private__hLineOptions.onRemove();
@@ -22019,6 +22941,9 @@
         points() {
             return this._private__points;
         }
+        isComplete() {
+            return this._private__isComplete;
+        }
         remove() {
             this._private__stopDrawing();
             if (this._private__primitive) {
@@ -22489,6 +23414,9 @@
         isHovered() {
             return this._private__isHovered;
         }
+        isComplete() {
+            return this._private__isComplete;
+        }
         remove() {
             this._private__stopDrawing();
             if (this._private__primitive) {
@@ -22953,6 +23881,9 @@
         isHovered() {
             return this._private__isHovered;
         }
+        isComplete() {
+            return this._private__isComplete;
+        }
         remove() {
             this._private__stopDrawing();
             if (this._private__primitive) {
@@ -23233,12 +24164,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__vLineOptions.onRemove) {
                 this._private__vLineOptions.onRemove();
@@ -23883,17 +24808,14 @@
             }
             return false;
         }
+        isComplete() {
+            return this._private__isComplete;
+        }
         remove() {
             if (this._private__primitive) {
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__drawingManager) {
                 this._private__drawingManager._internal_destroy();
@@ -23909,12 +24831,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__fibOptions.onRemove) {
                 this._private__fibOptions.onRemove();
@@ -24342,12 +25258,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
         }
     }
@@ -24773,6 +25683,9 @@
         _update() {
             this._private__requestUpdate();
         }
+        isComplete() {
+            return !this._private__isDrawing;
+        }
         remove() {
             if (this._private__clickHandler) {
                 this._chart.unsubscribeClick(this._private__clickHandler);
@@ -24786,12 +25699,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__fanOptions.onRemove) {
                 this._private__fanOptions.onRemove();
@@ -25316,6 +26223,9 @@
         _update() {
             this._private__requestUpdate();
         }
+        isComplete() {
+            return !this._private__isDrawing;
+        }
         remove() {
             if (this._private__clickHandler) {
                 this._chart.unsubscribeClick(this._private__clickHandler);
@@ -25329,12 +26239,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__rectOptions.onRemove) {
                 this._private__rectOptions.onRemove();
@@ -25779,6 +26683,9 @@
         _update() {
             this._private__requestUpdate();
         }
+        isComplete() {
+            return !this._private__isDrawing;
+        }
         remove() {
             if (this._private__clickHandler) {
                 this._chart.unsubscribeClick(this._private__clickHandler);
@@ -25792,12 +26699,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__circleOptions.onRemove) {
                 this._private__circleOptions.onRemove();
@@ -26321,6 +27222,9 @@
         _update() {
             this._private__requestUpdate();
         }
+        isComplete() {
+            return !this._private__isDrawing;
+        }
         remove() {
             // Clean up click handler
             if (this._private__clickHandler) {
@@ -26344,12 +27248,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__arrowOptions.onRemove) {
                 this._private__arrowOptions.onRemove();
@@ -26887,7 +27785,7 @@
         }
         _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
@@ -26903,7 +27801,9 @@
                         this.remove();
                     }
                 }
-            });
+            };
+            this._private__clickOutsideHandler = handler;
+            this._chart.subscribeClick(handler);
         }
         _private__createPrimitive() {
             this._private__paneView = this._private__createPaneView();
@@ -27208,12 +28108,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__textOptions.onRemove) {
                 this._private__textOptions.onRemove();
@@ -27796,12 +28690,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__drawingManager) {
                 this._private__drawingManager._internal_destroy();
@@ -28657,12 +29545,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__positionOptions.onRemove) {
                 this._private__positionOptions.onRemove();
@@ -29005,12 +29887,6 @@
                 this._series.detachPrimitive(this._private__primitive);
                 this._private__primitive = null;
                 this._private__paneView = null;
-                const chartElement = this._chart.chartElement?.();
-                if (chartElement) {
-                    const currentWidth = chartElement.clientWidth;
-                    const currentHeight = chartElement.clientHeight;
-                    this._chart.resize(currentWidth, currentHeight);
-                }
             }
             if (this._private__ganttOptions.onRemove) {
                 this._private__ganttOptions.onRemove();
@@ -29021,6 +29897,8 @@
         return new GanttTool(context, options);
     }
 
+    /** Undo steps kept, each a full snapshot of every drawing. */
+    const UNDO_HISTORY_LIMIT = 100;
     /**
      * Central manager for all drawing tools - TradingView style
      * Handles multiple tools, selection, deletion, and keyboard shortcuts
@@ -29043,6 +29921,8 @@
             this._private__pointerDownHandler = null;
             this._private__pointerUpHandler = null;
             this._private__pointerCancelHandler = null;
+            this._private__lostCaptureHandler = null;
+            this._private__windowPointerUpHandler = null;
             this._private__pointerId = null;
             /** A press that grabbed a tool already selected it; its click must not undo that. */
             this._private__gestureHandled = false;
@@ -29052,6 +29932,9 @@
             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 = {
@@ -29090,9 +29973,63 @@
         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
          */
@@ -29104,6 +30041,7 @@
                 }
                 tool.remove();
                 this._private__tools.delete(id);
+                this._private__pendingToolIds.delete(id);
                 this.recordChange();
                 return true;
             }
@@ -29150,6 +30088,9 @@
                 return;
             }
             this._private__past.push(this._private__committed);
+            if (this._private__past.length > UNDO_HISTORY_LIMIT) {
+                this._private__past.shift();
+            }
             this._private__future = [];
             this._private__committed = this.serializeAll();
         }
@@ -29303,6 +30244,7 @@
             this._private__applySelection(null);
             this._private__tools.forEach((tool) => tool.remove());
             this._private__tools.clear();
+            this._private__pendingToolIds.clear();
             this.recordChange();
         }
         /**
@@ -29523,8 +30465,17 @@
          * 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._private__selectionChanged._internal_destroy();
             this.clearAll();
             this._private__detachEventHandlers();
+            this._private__past = [];
+            this._private__future = [];
+            this._private__committed = [];
         }
         _private__attachEventHandlers() {
             // Click handler for selection
@@ -29542,11 +30493,17 @@
             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);
+                this._private__lostCaptureHandler = (event) => this._private__handleLostPointerCapture(event);
                 chartElement.addEventListener('pointerdown', this._private__pointerDownHandler);
                 chartElement.addEventListener('pointerup', this._private__pointerUpHandler);
                 chartElement.addEventListener('pointercancel', this._private__pointerCancelHandler);
+                chartElement.addEventListener('lostpointercapture', this._private__lostCaptureHandler);
+            }
+            if (isRunningOnClientSide) {
+                this._private__windowPointerUpHandler = (event) => this._private__handlePointerUp(event);
+                window.addEventListener('pointerup', this._private__windowPointerUpHandler);
             }
             // Keyboard handler for shortcuts
             if (this._private__options.enableKeyboardShortcuts) {
@@ -29579,6 +30536,14 @@
                     chartElement.removeEventListener('pointercancel', this._private__pointerCancelHandler);
                     this._private__pointerCancelHandler = null;
                 }
+                if (this._private__lostCaptureHandler) {
+                    chartElement.removeEventListener('lostpointercapture', this._private__lostCaptureHandler);
+                    this._private__lostCaptureHandler = null;
+                }
+            }
+            if (this._private__windowPointerUpHandler) {
+                window.removeEventListener('pointerup', this._private__windowPointerUpHandler);
+                this._private__windowPointerUpHandler = null;
             }
             if (this._private__keyboardHandler) {
                 document.removeEventListener('keydown', this._private__keyboardHandler);
@@ -29586,6 +30551,7 @@
             }
         }
         _private__handleClick(param) {
+            this._private__scheduleCompletionCheck();
             if (!param.point) {
                 return;
             }
@@ -29665,6 +30631,9 @@
             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();
@@ -29700,28 +30669,51 @@
             this._private__gestureHandled = true;
             this._private__draggedToolId = toolId;
             this._private__pointerId = event.pointerId;
-            chartElement.setPointerCapture(event.pointerId);
+            try {
+                chartElement.setPointerCapture(event.pointerId);
+            }
+            catch (error) {
+                this._private__pointerId = null;
+            }
             tool.startDrag(endpoint, anchor);
             // Panning is stopped by disabling it for the gesture, not by preventing
             // the event: preventDefault on pointerdown suppresses the compatibility
             // 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;
             }
-            const tool = this._private__tools.get(this._private__draggedToolId);
-            if (tool) {
-                tool.stopDrag();
+            if (event && this._private__pointerId !== null && event.pointerId !== this._private__pointerId) {
+                return;
             }
-            this._private__releasePointer();
-            this._private__enableChartInteractions();
+            const draggedToolId = this._private__draggedToolId;
+            // Cleared first: anything below can throw, and a half-finished release
+            // would leave the manager dragging forever.
             this._private__isDragging = false;
             this._private__draggedToolId = null;
+            try {
+                const tool = this._private__tools.get(draggedToolId);
+                if (tool) {
+                    tool.stopDrag();
+                }
+            }
+            finally {
+                this._private__releasePointer();
+                this._private__enableChartInteractions();
+            }
             // A finished drag is one step, not one per frame
             this.recordChange();
         }
+        /** Ends the drag when capture is lost without a pointerup ever arriving. */
+        _private__handleLostPointerCapture(event) {
+            if (this._private__pointerId !== null && event.pointerId !== this._private__pointerId) {
+                return;
+            }
+            this._private__pointerId = null;
+            this._private__handlePointerUp();
+        }
         /**
          * Pane element of a tool's series. The engine asserts the series has a pane,
          * so the lookup is guarded.
@@ -29768,10 +30760,15 @@
             this._private__pointerId = null;
         }
         _private__disableChartInteractions() {
+            if (this._private__interactionsBeforeDrag !== null) {
+                return;
+            }
             const options = this._private__chart.options();
+            // `options()` returns the live object and `applyOptions` merges into it
+            // in place, so a snapshot by reference restores all-false.
             this._private__interactionsBeforeDrag = {
-                _internal_handleScroll: options.handleScroll,
-                _internal_handleScale: options.handleScale,
+                _internal_handleScroll: clone(options.handleScroll),
+                _internal_handleScale: clone(options.handleScale),
             };
             this._private__chart.applyOptions({
                 handleScroll: false,
@@ -29792,6 +30789,14 @@
             });
         }
         _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()) {
@@ -29812,8 +30817,8 @@
                 }
                 return;
             }
-            // Escape to deselect
             if (event.key === 'Escape') {
+                this.cancelPendingDrawings();
                 this._private__handlePointerUp();
                 this._private__deselectAll();
                 this.stopDrawing();
@@ -29849,7 +30854,7 @@
      * Returns the current version as a string. For example `'1.0.0'`.
      */
     function version() {
-        return "2.2.0";
+        return "2.3.0-dev+202609220108";
     }
 
     var PipsendChartsModule = /*#__PURE__*/Object.freeze({
@@ -29885,6 +30890,7 @@
         PitchforkTool: PitchforkTool,
         PolygonTool: PolygonTool,
         PositionCalculator: PositionCalculator,
+        PositionLine: PositionLine,
         PositionMarkersManager: PositionMarkersManager,
         PositionTool: PositionTool,
         get PriceLineSource () { return PriceLineSource; },
@@ -29942,6 +30948,7 @@
         createParallelChannelTool: createParallelChannelTool,
         createPitchforkTool: createPitchforkTool,
         createPolygonTool: createPolygonTool,
+        createPositionLine: createPositionLine,
         createPositionMarkers: createPositionMarkers,
         createPositionTool: createPositionTool,
         createRectangleTool: createRectangleTool,