@pipsend/charts 2.2.1 → 2.3.0

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

@@ -1,6 +1,6 @@
 /*!
  * @license
- * Pipsend Charts v2.2.1
+ * Pipsend Charts v2.3.0-dev+202609220108
  * Copyright (c) 2026 Pipsend
  * Licensed under MIT License
  * Built on TradingView Lightweight Charts™ (Apache 2.0)
@@ -14638,6 +14638,8 @@ function shapeSize(shape, originalSize) {
             return size(originalSize, 0.8);
         case 'square':
             return size(originalSize, 0.7);
+        case 'tag':
+            return size(originalSize, 1);
     }
 }
 function calculateShapeHeight(barSpacing) {
@@ -14747,6 +14749,85 @@ function hitTestSquare(centerX, centerY, size, x, y) {
         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);
@@ -14763,9 +14844,11 @@ class SeriesMarkersRenderer {
     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) {
@@ -14776,7 +14859,11 @@ class SeriesMarkersRenderer {
             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;
     }
@@ -14816,14 +14903,21 @@ class SeriesMarkersRenderer {
             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);
         }
     }
@@ -14838,12 +14932,40 @@ function bitmapShapeItemCoordinates(item, horizontalPixelRatio, verticalPixelRat
     };
 }
 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;
@@ -14861,10 +14983,16 @@ function drawShape(item, ctx, coordinates) {
         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;
     }
@@ -14883,6 +15011,8 @@ function hitTestShape(item, x, y) {
             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;
     }
 }
 
@@ -14915,15 +15045,71 @@ function getPrice(seriesData, marker, isInverted) {
     }
     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;
@@ -15030,6 +15216,10 @@ class SeriesMarkersPaneView {
                 _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;
         }
@@ -15040,13 +15230,22 @@ class SeriesMarkersPaneView {
             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 = {
@@ -15077,7 +15276,7 @@ class SeriesMarkersPaneView {
             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;
     }
@@ -15235,6 +15434,10 @@ class SeriesMarkersPrimitive {
                 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' ||
@@ -19536,6 +19739,7 @@ class TradingLineController {
     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;
@@ -19593,8 +19797,12 @@ class TradingLineController {
         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) {
@@ -19698,24 +19906,43 @@ class TradingLineController {
         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) {
@@ -19725,6 +19952,7 @@ class TradingLineController {
             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);
         }
@@ -20248,6 +20476,702 @@ function createInteractiveLineManager(chart, series) {
     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',
@@ -21127,13 +22051,6 @@ class TrendLineTool extends DrawingToolBase {
             // 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();
@@ -21406,12 +22323,6 @@ class HorizontalLineTool extends DrawingToolBase {
             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();
@@ -23250,12 +24161,6 @@ class VerticalLineTool extends DrawingToolBase {
             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();
@@ -23908,12 +24813,6 @@ class FibonacciTool extends DrawingToolBase {
             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();
@@ -23929,12 +24828,6 @@ class FibonacciTool extends DrawingToolBase {
             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();
@@ -24362,12 +25255,6 @@ class FibonacciExtensionTool extends DrawingToolBase {
             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);
-            }
         }
     }
 }
@@ -24809,12 +25696,6 @@ class FibonacciFanTool extends DrawingToolBase {
             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();
@@ -25355,12 +26236,6 @@ class RectangleTool extends DrawingToolBase {
             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();
@@ -25821,12 +26696,6 @@ class CircleTool extends DrawingToolBase {
             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();
@@ -26376,12 +27245,6 @@ class ArrowTool extends DrawingToolBase {
             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();
@@ -27242,12 +28105,6 @@ class TextTool extends DrawingToolBase {
             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();
@@ -27830,12 +28687,6 @@ class RulerTool extends DrawingToolBase {
             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();
@@ -28691,12 +29542,6 @@ class PositionTool extends DrawingToolBase {
             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();
@@ -29039,12 +29884,6 @@ class GanttTool extends DrawingToolBase {
             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();
@@ -29055,6 +29894,8 @@ function createGanttTool(context, options) {
     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
@@ -29077,6 +29918,8 @@ class DrawingToolsManager {
         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;
@@ -29242,6 +30085,9 @@ class DrawingToolsManager {
             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();
     }
@@ -29621,8 +30467,12 @@ class DrawingToolsManager {
             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
@@ -29642,9 +30492,15 @@ class DrawingToolsManager {
             this._private__pointerDownHandler = (event) => this._private__handlePointerDown(event);
             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) {
@@ -29677,6 +30533,14 @@ class DrawingToolsManager {
                 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);
@@ -29802,7 +30666,12 @@ class DrawingToolsManager {
         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
@@ -29816,17 +30685,32 @@ class DrawingToolsManager {
         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();
-        }
-        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.
@@ -29877,9 +30761,11 @@ class DrawingToolsManager {
             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,
@@ -29965,7 +30851,7 @@ const customSeriesDefaultOptions = {
  * Returns the current version as a string. For example `'1.0.0'`.
  */
 function version() {
-    return "2.2.1";
+    return "2.3.0-dev+202609220108";
 }
 
-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 };
+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, PositionLine, 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, createPositionLine, createPositionMarkers, createPositionTool, createRectangleTool, createRulerTool, createSeriesMarkers, createTextTool, createTextWatermark, createTradingLine, createTradingSessionsIndicator, createTrendLineTool, createUpDownMarkers, createVerticalLineTool, createVolumeProfileIndicator, createYieldCurveChart, customSeriesDefaultOptions, defaultHorzScaleBehavior, getPipConfig, hideSeriesPaint, isBusinessDay, isUTCTimestamp, setSeriesVolumes, setVolumeProfileData, timeFromCoordinate, version };