@luxalgo/vela 0.8.1 → 0.8.2

package/dist/index.cjs

@@ -238,7 +238,7 @@ var IndicatorHandleImpl = class {
     this.controller.applyProps(this.id, values);
   }
   updateCode(source) {
-    this.controller.updateCode(this.id, source);
+    return this.controller.updateCode(this.id, source);
   }
   setVisible(visible) {
     this.controller.setVisible(this.id, visible);
@@ -641,6 +641,7 @@ registerIcon("expand", S('<rect x="2.2" y="2.2" width="11.6" height="11.6" rx="1
 registerIcon("plus", S('<path d="M8 2.8v10.4M2.8 8h10.4"/>'));
 registerIcon("minus", S('<path d="M2.8 8h10.4"/>'));
 registerIcon("maximize", S('<path d="M2.5 6V3a.5.5 0 0 1 .5-.5h3M10 2.5h3a.5.5 0 0 1 .5.5v3M13.5 10v3a.5.5 0 0 1-.5.5h-3M6 13.5H3a.5.5 0 0 1-.5-.5v-3"/>'));
+registerIcon("restore", S('<path d="M6 2.5v3a.5.5 0 0 1-.5.5h-3M13.5 6h-3a.5.5 0 0 1-.5-.5v-3M10 13.5v-3a.5.5 0 0 1 .5-.5h3M2.5 10h3a.5.5 0 0 1 .5.5v3"/>'));
 registerIcon("restore", S('<path d="M6.2 2.5v3.7H2.5M9.8 13.5V9.8h3.7M13.5 6.2H9.8V2.5M2.5 9.8h3.7v3.7"/>'));
 registerIcon("star", S('<path d="M8 2.2l1.75 3.55 3.9.55-2.8 2.75.65 3.9L8 11.1l-3.5 1.85.65-3.9-2.8-2.75 3.9-.55z"/>'));
 registerIcon("star-filled", S('<path d="M8 2.2l1.75 3.55 3.9.55-2.8 2.75.65 3.9L8 11.1l-3.5 1.85.65-3.9-2.8-2.75 3.9-.55z"/>', 'fill="currentColor"'));
@@ -3299,6 +3300,10 @@ var FibRatios = class extends Drawing {
 
 // src/core/drawings/types/FibLevels.ts
 var FibLevels = class extends FibRatios {
+  /** Price of a level for the two anchor prices; subclasses override to change which anchor ratio 0 sits on. */
+  levelPrice(ratio, p1, p2) {
+    return p1 + ratio * (p2 - p1);
+  }
   /** Per-level pixel line + price for the ENABLED levels, spanning the anchors' time range. */
   levelLines(proj) {
     const a = this.anchors[0];
@@ -3308,11 +3313,10 @@ var FibLevels = class extends FibRatios {
     const xb = proj.xOf(b.time);
     const x1 = Math.min(xa, xb);
     const x2 = Math.max(xa, xb);
-    const delta = b.price - a.price;
     const out = [];
     for (const lv of this.levels) {
       if (!lv.enabled) continue;
-      const price = a.price + lv.ratio * delta;
+      const price = this.levelPrice(lv.ratio, a.price, b.price);
       const y = proj.yOf(price, this.paneId);
       if (y == null) continue;
       out.push({ ratio: lv.ratio, color: lv.color, label: lv.label, price, x1, x2, y });
@@ -3352,8 +3356,7 @@ var FibLevels = class extends FibRatios {
     const a = this.anchors[0];
     const b = this.anchors[1];
     if (!a || !b) return null;
-    const delta = b.price - a.price;
-    const prices = this.levels.filter((l) => l.enabled).map((l) => a.price + l.ratio * delta);
+    const prices = this.levels.filter((l) => l.enabled).map((l) => this.levelPrice(l.ratio, a.price, b.price));
     if (prices.length === 0) return null;
     return { min: Math.min(...prices), max: Math.max(...prices) };
   }
@@ -3439,13 +3442,24 @@ function cycleLevels(count, enabledCount = count) {
 // src/core/drawings/types/FibRetracement.ts
 var LEVELS = fibLevels([0, 0.236, 0.382, 0.5, 0.618, 0.786, 1]);
 var FibRetracement = class extends FibLevels {
-  constructor() {
-    super(...arguments);
+  constructor(init) {
+    super(init);
     this.type = "fibretracement";
+    if (this.reverse === void 0) this.reverse = false;
   }
   defaultLevels() {
     return LEVELS;
   }
+  levelPrice(ratio, p1, p2) {
+    return this.reverse ? p1 + ratio * (p2 - p1) : p2 + ratio * (p1 - p2);
+  }
+  writeProps() {
+    return { ...super.writeProps(), reverse: this.reverse };
+  }
+  readProps(props) {
+    super.readProps(props);
+    this.reverse = typeof props.reverse === "boolean" ? props.reverse : true;
+  }
 };
 
 // src/core/drawings/types/FibExtension.ts
@@ -9258,20 +9272,26 @@ var EngineOrchestrator = class _EngineOrchestrator {
   /**
    * IndicatorController: replace a SCRIPT indicator's source in place (see
    * {@link IndicatorHandle.updateCode}). Prepare-first: the running session keeps
-   * computing until the new source has compiled, so a broken edit costs the user
-   * nothing but an `error` event. Natives have no script — warn and leave them alone.
+   * computing until the new source has compiled; then the new code runs on TRIAL until
+   * its first model lands, and a failure before that puts the previous code back.
+   * Natives have no script — warn and leave them alone.
    */
   updateCode(id, source) {
     const record = this.registry.get(id);
     const handle = this.handles.get(id);
-    if (!record || !handle) return;
+    if (!record || !handle) return Promise.resolve({ ok: false, error: new Error(`[vela] updateCode("${id}") \u2014 the indicator is no longer on the chart.`) });
     if (record.native) {
       console.warn(`[vela] updateCode("${id}") \u2014 a native indicator has no script to update.`);
-      return;
+      return Promise.resolve({ ok: false, error: new Error(`[vela] updateCode("${id}") \u2014 a native indicator has no script to update.`) });
     }
-    if (source === record.source && record.pendingSource === void 0) return;
-    record.pendingSource = source;
-    void this.swapSource(id, source, handle);
+    const busy = record.pendingSource !== void 0 || record.codeTrial !== void 0;
+    if (!busy && source === record.source) return Promise.resolve({ ok: true, error: null });
+    return new Promise((resolve) => {
+      (record.codeWaiters ?? (record.codeWaiters = [])).push(resolve);
+      if (record.pendingSource === source || record.pendingSource === void 0 && record.codeTrial && record.source === source) return;
+      record.pendingSource = source;
+      void this.swapSource(id, source, handle);
+    });
   }
   async swapSource(id, source, handle) {
     const engine = this.registry.get(id)?.engine ?? this.engineFor(this.registry.get(id)?.options?.language);
@@ -9282,26 +9302,41 @@ var EngineOrchestrator = class _EngineOrchestrator {
       const record2 = this.registry.get(id);
       if (record2?.pendingSource === source) {
         record2.pendingSource = void 0;
-        this.fail(id, handle, err);
+        this.rejectCode(id, record2, handle, err);
       }
       return;
     }
     const record = this.registry.get(id);
     if (!record || record.pendingSource !== source) return;
     record.pendingSource = void 0;
+    const previous = record.codeTrial?.previous ?? {
+      source: record.source,
+      engine: record.engine,
+      prepared: record.prepared,
+      inputValues: record.inputValues,
+      propValues: record.propValues,
+      inputs: [...handle.inputs],
+      props: [...handle.props]
+    };
+    record.inputValues = valuesOnSchema(prepared.inputs, record.inputValues, record.prepared?.inputs);
+    record.propValues = valuesOnSchema(prepared.props ?? [], record.propValues, record.prepared?.props);
     record.source = source;
     record.engine = engine;
     record.prepared = prepared;
     handle.setSource(source);
-    record.inputValues = valuesOnSchema(prepared.inputs, record.inputValues);
-    record.propValues = valuesOnSchema(prepared.props ?? [], record.propValues);
     handle.setSchema(prepared.inputs);
     handle.setPropsSchema(prepared.props ?? []);
     record.session?.stop();
     record.session = void 0;
     record.pendingStructural = true;
     record.pendingCause = "code";
-    if (record.hidden) return;
+    if (record.hidden) {
+      record.codeTrial = void 0;
+      if (record.renderHandle) this.renderer.setIndicatorInputs(record.renderHandle, record.inputValues, record.propValues);
+      this.settleCode(record, { ok: true, error: null });
+      return;
+    }
+    record.codeTrial = { previous };
     if (record.renderHandle) {
       this.renderer.setIndicatorInputs(record.renderHandle, record.inputValues, record.propValues);
       this.setLoading(record, true);
@@ -9309,6 +9344,46 @@ var EngineOrchestrator = class _EngineOrchestrator {
       this.mountLoadingPlaceholder(id, record);
     }
     this.executeIndicator(id, handle);
+    if (this.bars.length === 0 && record.codeTrial) {
+      record.codeTrial = void 0;
+      this.settleCode(record, { ok: true, error: null });
+    }
+  }
+  /** Resolve every `updateCode` caller waiting on this record's chain of edits. */
+  settleCode(record, result) {
+    const waiters = record.codeWaiters;
+    record.codeWaiters = void 0;
+    if (waiters) for (const resolve of waiters) resolve(result);
+  }
+  /**
+   * An update failed — at prepare, or on trial before its first model. A trial puts the
+   * previous code back (source, engine, prepared script, values, schema) and restarts it;
+   * its visuals were never dropped, so the chart keeps painting throughout. Then the
+   * failure reports the usual way and every waiting caller learns it.
+   */
+  rejectCode(id, record, handle, err) {
+    const trial = record.codeTrial;
+    record.codeTrial = void 0;
+    this.fail(id, handle, err);
+    if (trial) {
+      const p = trial.previous;
+      record.session?.stop();
+      record.session = void 0;
+      record.source = p.source;
+      record.engine = p.engine;
+      record.prepared = p.prepared;
+      record.inputValues = p.inputValues;
+      record.propValues = p.propValues;
+      handle.setSource(p.source);
+      handle.setSchema(p.inputs);
+      handle.setPropsSchema(p.props);
+      record.pendingStructural = true;
+      record.pendingCause = void 0;
+      if (record.renderHandle) this.renderer.setIndicatorInputs(record.renderHandle, record.inputValues, record.propValues);
+      if (!record.hidden) this.executeIndicator(id, handle);
+    }
+    const error = err instanceof Error ? err : new Error(String(err));
+    this.settleCode(record, { ok: false, error });
   }
   /** IndicatorController: tear down an indicator and (if now empty) its pane. */
   /** Live handles of every indicator on the chart (script + native), insertion order. */
@@ -9323,6 +9398,7 @@ var EngineOrchestrator = class _EngineOrchestrator {
   removeIndicator(id) {
     const record = this.registry.remove(id);
     if (record?.native?.type === "volume") this.volumeOptedOut = true;
+    if (record) this.settleCode(record, { ok: false, error: new Error(`[vela] updateCode("${id}") \u2014 the indicator was removed.`) });
     record?.session?.stop();
     if (record?.native?.started) record.native.instance.stop();
     this.handles.delete(id);
@@ -9350,6 +9426,10 @@ var EngineOrchestrator = class _EngineOrchestrator {
     if (!visible) {
       record.session?.stop();
       record.session = void 0;
+      if (record.codeTrial) {
+        record.codeTrial = void 0;
+        this.settleCode(record, { ok: true, error: null });
+      }
       if (record.native?.started) record.native.instance.suspend();
       if (record.renderHandle) this.renderer.setIndicatorVisible?.(record.renderHandle, false);
       else if (record.native) this.mountHiddenNativeRow(id, record);
@@ -9437,6 +9517,7 @@ var EngineOrchestrator = class _EngineOrchestrator {
     this.viewportUnsub?.();
     this.paneActionUnsub?.();
     for (const record of this.registry.all()) {
+      this.settleCode(record, { ok: false, error: new Error("[vela] updateCode \u2014 the chart was destroyed.") });
       record.session?.stop();
       if (record.native?.started) record.native.instance.stop();
     }
@@ -9505,7 +9586,8 @@ var EngineOrchestrator = class _EngineOrchestrator {
     const record = this.registry.get(id);
     if (!record || !record.engine || !record.prepared || record.hidden) return;
     const mode = this.config.live && !record.prepared.reactsToViewport && record.engine.capabilities.streaming ? "live" : "static";
-    record.session = record.engine.execute(
+    const prepared = record.prepared;
+    const session = record.engine.execute(
       {
         prepared: record.prepared,
         market: this.market(),
@@ -9526,6 +9608,10 @@ var EngineOrchestrator = class _EngineOrchestrator {
           const cause = record.pendingCause ?? "history";
           if (!this.applyModel(id, model)) return;
           record.pendingCause = void 0;
+          if (record.codeTrial) {
+            record.codeTrial = void 0;
+            this.settleCode(record, { ok: true, error: null });
+          }
           this.emitContextChanged(id);
           this.emitScriptRun(id, cause, first);
         },
@@ -9536,9 +9622,17 @@ var EngineOrchestrator = class _EngineOrchestrator {
           handle.emit("alert", { id: a.id, message: a.message, title: a.title, time: a.time });
         },
         onWarning: (w) => this.events.emit("warning", w),
-        onError: (err) => this.fail(id, handle, err)
+        onError: (err) => {
+          if (record.codeTrial) this.rejectCode(id, record, handle, err);
+          else this.fail(id, handle, err);
+        }
       }
     );
+    if (record.prepared !== prepared) {
+      session.stop();
+      return;
+    }
+    record.session = session;
     this.emitContextChanged(id);
   }
   /**
@@ -10039,7 +10133,7 @@ function yieldToPaint() {
   }
   return new Promise((resolve) => setTimeout(resolve, 0));
 }
-function valuesOnSchema(schema, previous) {
+function valuesOnSchema(schema, previous, oldSchema = []) {
   const out = {};
   const declared = /* @__PURE__ */ new Set();
   for (const s of schema) {
@@ -10047,9 +10141,22 @@ function valuesOnSchema(schema, previous) {
     declared.add(s.key);
     declared.add(s.title);
   }
-  for (const [k, v] of Object.entries(previous)) if (declared.has(k)) out[k] = v;
+  const oldDefaults = /* @__PURE__ */ new Map();
+  for (const s of oldSchema) {
+    oldDefaults.set(s.key, s.defval);
+    if (!oldDefaults.has(s.title)) oldDefaults.set(s.title, s.defval);
+  }
+  for (const [k, v] of Object.entries(previous)) {
+    if (!declared.has(k)) continue;
+    if (oldDefaults.has(k) && sameInputValue(oldDefaults.get(k), v)) continue;
+    out[k] = v;
+  }
   return out;
 }
+function sameInputValue(a, b) {
+  if (a === b) return true;
+  return typeof a === "object" && a !== null && typeof b === "object" && b !== null && JSON.stringify(a) === JSON.stringify(b);
+}
 function blankedModel(model) {
   return {
     ...model,
@@ -11693,6 +11800,17 @@ function iconEl(id, doc = document) {
   if (svg) span.innerHTML = svg;
   return span;
 }
+
+// src/ui/surface-events.ts
+var SURFACE_OPEN_EVENT = "vela:surface-open";
+var SURFACE_CLOSE_EVENT = "vela:surface-close";
+function announceSurface(el, open2, kind, trigger = null) {
+  const View = el.ownerDocument.defaultView;
+  if (!View) return;
+  el.dispatchEvent(
+    new View.CustomEvent(open2 ? SURFACE_OPEN_EVENT : SURFACE_CLOSE_EVENT, { bubbles: true, composed: true, detail: { kind, trigger } })
+  );
+}
 function menuController(opts) {
   return {
     machine: menu__namespace.machine,
@@ -11838,6 +11956,8 @@ var Surface = class _Surface {
     /** Trigger rect captured when this level opened — the list stays put if the
      *  trigger then moves (favorite chips shifting the caret). */
     this.pinnedAnchor = null;
+    /** The open state last announced — see {@link announce}. */
+    this.shown = false;
     this.doc = doc;
     this.host = opts.host;
     this.onSelect = opts.onSelect;
@@ -11851,6 +11971,7 @@ var Surface = class _Surface {
     this.positioner.appendChild(this.list);
     this.host.appendChild(this.positioner);
     const trigger = opts.trigger;
+    this.opener = trigger ?? opts.opener ?? null;
     this.ctrl = menuController({
       items: [],
       id: opts.id,
@@ -11872,15 +11993,21 @@ var Surface = class _Surface {
     if (opts.triggerId && trigger) trigger.id = opts.triggerId;
     this.handle = runMachine(this.ctrl.machine, this.ctrl.props, (service) => {
       const api = this.ctrl.connect(service);
+      if (this.shown && !api.open) this.announce(false);
       if (trigger) vanilla.spreadProps(trigger, api.getTriggerProps(), this.mid);
       vanilla.spreadProps(this.positioner, api.getPositionerProps(), this.mid);
       vanilla.spreadProps(this.list, api.getContentProps(), this.mid);
       this.project(api);
+      if (api.open && !this.shown) this.announce(true);
     });
   }
   get api() {
     return this.ctrl.connect(this.handle.service);
   }
+  announce(open2) {
+    this.shown = open2;
+    announceSurface(this.list, open2, "menu", this.opener);
+  }
   setItems(items) {
     this.items = items;
     for (const sub2 of this.subs.values()) sub2.destroy();
@@ -11898,6 +12025,7 @@ var Surface = class _Surface {
     for (const sub2 of this.subs.values()) sub2.destroy();
     this.subs.clear();
     this.handle.stop();
+    if (this.shown) this.announce(false);
     this.positioner.remove();
   }
   byId(id) {
@@ -11991,6 +12119,7 @@ var Surface = class _Surface {
         const sub2 = new _Surface(doc, {
           host: this.host,
           placement: "right-start",
+          opener: li,
           onSelect: this.onSelect,
           onFavorite: this.onFavorite,
           checkmarks: this.checkmarks,
@@ -12210,16 +12339,21 @@ var Popover = class {
       this.hide();
     };
     const onReflow = () => this.place();
-    setTimeout(() => document.addEventListener("pointerdown", onOutside, true), 0);
+    setTimeout(() => {
+      if (this.onOutside === onOutside) document.addEventListener("pointerdown", onOutside, true);
+    }, 0);
     document.addEventListener("keydown", onKey, true);
     window.addEventListener("resize", onReflow, true);
     document.addEventListener("scroll", onReflow, true);
     this.onOutside = onOutside;
     this.onKey = onKey;
     this.onReflow = onReflow;
+    announceSurface(this.el, true, "popover", this.trigger);
   }
   hide() {
     if (!this.shown) return;
+    this.shown = false;
+    announceSurface(this.el, false, "popover", this.trigger);
     if (this.onOutside) document.removeEventListener("pointerdown", this.onOutside, true);
     if (this.onKey) document.removeEventListener("keydown", this.onKey, true);
     if (this.onReflow) {
@@ -12239,7 +12373,6 @@ var Popover = class {
     } else {
       this.el.remove();
     }
-    this.shown = false;
     if (open === this) open = null;
     this.ctrl.onClose?.();
   }
@@ -12940,6 +13073,8 @@ ${overlayScrollbarCss(".vela-dialog *")}
 `;
 var Dialog = class {
   constructor(opts = {}) {
+    this.opener = null;
+    this.wasOpen = false;
     const doc = (opts.host ?? document.body).ownerDocument;
     injectStyles(DIALOG_STYLE_ID, DIALOG_CSS, doc);
     const host = opts.host ?? doc.body;
@@ -13036,6 +13171,7 @@ var Dialog = class {
     const mid = String(this.ctrl.props.id);
     this.handle = runMachine(this.ctrl.machine, this.ctrl.props, (service) => {
       const api = this.ctrl.connect(service);
+      if (this.wasOpen && !api.open) this.announce(false);
       vanilla.spreadProps(this.backdrop, api.getBackdropProps(), mid);
       vanilla.spreadProps(this.positioner, api.getPositionerProps(), mid);
       vanilla.spreadProps(this.panel, api.getContentProps(), mid);
@@ -13043,12 +13179,27 @@ var Dialog = class {
       vanilla.spreadProps(close, api.getCloseTriggerProps(), mid);
       this.backdrop.style.display = api.open ? "" : "none";
       this.positioner.style.display = api.open ? "" : "none";
+      if (api.open && !this.wasOpen) this.announce(true);
+      if (this.wasOpen && !api.open) this.restoreOpener();
+      this.wasOpen = api.open;
     });
   }
+  /** Closing hands focus back to whatever opened it (Escape, the ✕, hide(), or a
+   *  teardown that outruns the machine's close notification). */
+  restoreOpener() {
+    const opener = this.opener;
+    this.opener = null;
+    if (opener?.isConnected) opener.focus({ preventScroll: true });
+  }
+  announce(open2) {
+    const opener = this.opener === this.panel.ownerDocument.body ? null : this.opener;
+    announceSurface(this.panel, open2, "dialog", opener);
+  }
   get open() {
     return this.ctrl.connect(this.handle.service).open;
   }
   show() {
+    this.opener = this.panel.ownerDocument.activeElement;
     this.ctrl.connect(this.handle.service).setOpen(true);
   }
   hide() {
@@ -13063,6 +13214,11 @@ var Dialog = class {
   destroy() {
     if (this.open) this.hide();
     this.handle.stop();
+    if (this.wasOpen) {
+      this.wasOpen = false;
+      this.announce(false);
+    }
+    this.restoreOpener();
     this.backdrop.remove();
     this.positioner.remove();
   }
@@ -17232,15 +17388,23 @@ var Batch = class {
     this.seg(x + w, y + h, x, y + h, lineWidth, c);
     this.seg(x, y + h, x, y, lineWidth, c);
   }
-  /** Filled circle (triangle fan). */
+  /**
+   * Filled circle (triangle fan), feathered like a line: the rim is padded by {@link AA_PAD} and
+   * edgeDist runs from 0 at the center to the padded radius at the rim, with edgeHalf = r. The
+   * distance grows linearly along each spoke, so the shader's line feather gives a round soft edge.
+   */
   circle(cx, cy, r, c, segments = 16) {
-    let px = cx + r;
+    const ext = r + AA_PAD;
+    let px = cx + ext;
     let py = cy;
+    this.ensure(segments * 3);
     for (let i = 1; i <= segments; i += 1) {
       const a = i / segments * Math.PI * 2;
-      const nx = cx + Math.cos(a) * r;
-      const ny = cy + Math.sin(a) * r;
-      this.tri(cx, cy, c, px, py, c, nx, ny, c);
+      const nx = cx + Math.cos(a) * ext;
+      const ny = cy + Math.sin(a) * ext;
+      this.v(cx, cy, c, 0, r);
+      this.v(px, py, c, ext, r);
+      this.v(nx, ny, c, ext, r);
       px = nx;
       py = ny;
     }
@@ -17421,7 +17585,7 @@ var WebGL2Backend = class {
   }
   mount(canvas) {
     this.canvas = canvas;
-    this.gl = canvas.getContext("webgl2", { alpha: true, antialias: true, depth: false, stencil: false, premultipliedAlpha: true });
+    this.gl = canvas.getContext("webgl2", { alpha: true, antialias: false, depth: false, stencil: false, premultipliedAlpha: true });
     if (!this.gl) return;
     if (!this.initGL()) {
       this.gl = null;
@@ -18873,7 +19037,7 @@ var InputController = class {
         this.deps.drawingsPointerUp?.(x, y, this.snapMode(e));
       } else if (tapRelease && this.region === "data") {
         this.deps.onClick(x, y);
-      } else if (this.dragging && this.region === "data") {
+      } else if (this.dragging && this.region === "data" && wasTouch) {
         const stale = e.timeStamp - this.lastT > FLING_STALE_MS;
         if (!stale && Math.abs(this.vx) > FLING_MIN_SPEED) {
           const pitch = this.deps.getCoords().pxPerBar();
@@ -25329,6 +25493,12 @@ var DrawingInteraction = class {
   activeDragId() {
     return this.state.kind === "pressed" && this.state.moved ? this.state.id : null;
   }
+  /** The store drawings a live drag is moving — the pressed one and its riders — or none
+   *  before the drag passes the slop. A Ctrl-drag moves copies, so its sources stay put. */
+  movingIds() {
+    if (this.state.kind !== "pressed" || !this.state.moved || this.state.clones) return /* @__PURE__ */ new Set();
+    return /* @__PURE__ */ new Set([this.state.id, ...this.state.riders.map((r) => r.id)]);
+  }
   /** The drawing under a press that has not been released yet (drag or click undecided), or null. */
   pressedId() {
     return this.state.kind === "pressed" ? this.state.id : null;
@@ -25987,6 +26157,17 @@ var DrawingSettingsDialog = class {
         }
       }));
     }
+    if (drawing instanceof FibRetracement) {
+      const fib = drawing;
+      grid.appendChild(fieldRow({
+        label: "Reverse",
+        bool: true,
+        toggle: {
+          checked: fib.reverse,
+          onChange: (v) => actions.patch({ reverse: v })
+        }
+      }));
+    }
     levels.forEach((lv, i) => {
       const row = document.createElement("div");
       row.className = "vela-field-span";
@@ -27354,6 +27535,7 @@ var DrawingToolbar = class {
         );
       }
     }
+    announceSurface(fly, true, "menu", cell);
   }
   openMagnetFlyout() {
     const cell = this.magnetCell;
@@ -27377,6 +27559,7 @@ var DrawingToolbar = class {
         })
       );
     }
+    announceSurface(fly, true, "menu", cell);
   }
   flyoutHeader(text) {
     const t = this.theme;
@@ -27445,9 +27628,11 @@ var DrawingToolbar = class {
   }
   closeFlyout() {
     this.starEls.clear();
-    if (this.flyout) {
-      this.flyout.remove();
+    const fly = this.flyout;
+    if (fly) {
       this.flyout = null;
+      announceSurface(fly, false, "menu", this.flyoutCell);
+      fly.remove();
       this.flyoutCell?.classList.remove("vela-open");
       this.flyoutCell = null;
       this.flyoutOwnerId = null;
@@ -27772,6 +27957,8 @@ var UserDrawingController = class {
     this.drawings = [];
     /** Ids painted on an interleave layer this frame — the top canvas paints only their handles. */
     this.sliced = /* @__PURE__ */ new Set();
+    /** Interleaved drawings mid-drag: painted on the top canvas, left out of their slice. */
+    this.lifted = /* @__PURE__ */ new Set();
     /** Cached slice canvases, keyed `paneId|beforeZ`, reused across frames to avoid churn. */
     this.sliceCache = /* @__PURE__ */ new Map();
     /** Series boundaries per pane as of the last `prepareSlices` — lets a repaint between data
@@ -27859,7 +28046,7 @@ var UserDrawingController = class {
       selectedIds: () => this.selectedIds,
       emit: (i) => this.emit(i),
       changed: () => {
-        this.invalidateSlices();
+        this.syncLift();
         this.render();
       },
       openSettings: (id, x, y) => this.openSettingsById(id, x, y),
@@ -28485,6 +28672,20 @@ var UserDrawingController = class {
   /** A drawing that paints inside the series stack changed (content, not hover): its pixels
    *  live in the backend composite, so this layer alone can't show the change — ask for a
    *  data frame, which re-runs `prepareSlices` before the backend composites. */
+  /** A drawing being dragged leaves its interleave slice for the top canvas, so each pointer
+   *  move repaints one 2D layer instead of re-rasterizing and re-uploading a plot-sized slice
+   *  texture through the data frame. The slices rebuild once as the drag starts and once as it
+   *  ends (release, cancel), when the lifted set changes. */
+  syncLift() {
+    const moving = this.interaction.movingIds();
+    let same = moving.size === this.lifted.size;
+    if (same) {
+      for (const id of moving) if (!this.lifted.has(id)) same = false;
+    }
+    if (same) return;
+    this.lifted = new Set(moving);
+    this.invalidateSlices();
+  }
   invalidateSlices() {
     if (this.sliced.size > 0 || this.drawings.some((d) => this.isInterleaved(d))) this.deps.requestDataPaint();
   }
@@ -28503,7 +28704,7 @@ var UserDrawingController = class {
     const theme = this.deps.theme();
     const buckets = /* @__PURE__ */ new Map();
     for (const d of this.drawings) {
-      if (!d.visible) continue;
+      if (!d.visible || this.lifted.has(d.id)) continue;
       const beforeZ = sliceKeyFor(d.zIndex, this.lastBounds.get(d.paneId) ?? []);
       if (beforeZ === null) continue;
       const key = `${d.paneId}|${beforeZ}`;
@@ -28555,8 +28756,9 @@ var UserDrawingController = class {
       mutedLabel: edited instanceof TextLabel ? edited.id : null
     };
     this.painter.seriesLook = this.deps.seriesLook();
-    this.painter.paintAll(ctx, this.drawings.filter((d) => !this.isInterleaved(d)), proj, this.deps.theme(), targets);
-    this.painter.paintHighlights(ctx, this.drawings.filter((d) => this.isInterleaved(d)), proj, handleIdsFor(targets));
+    const onTop = (d) => !this.isInterleaved(d) || this.lifted.has(d.id);
+    this.painter.paintAll(ctx, this.drawings.filter(onTop), proj, this.deps.theme(), targets);
+    this.painter.paintHighlights(ctx, this.drawings.filter((d) => !onTop(d)), proj, handleIdsFor(targets));
     const clones = this.interaction.dragClones();
     if (clones) this.painter.paintAll(ctx, clones, proj, this.deps.theme(), { selected: new Set(clones.map((c) => c.id)) });
     this.layoutTextEditor();

package/dist/index.d.cts

@@ -1,11 +1,11 @@
-import { D as DrawingsDocument, d as Resolved, e as ReplayTick, f as DataControl, g as ReplayTickSource } from './contributions-CtlptxR8.cjs';
-export { B as BarsChangeReason, C as CellStateContext, h as ContextSelect, i as DrawingsControl, j as EngineAlert, k as EngineCapabilities, l as EngineContextSnapshot, m as EngineFactory, n as EngineWarning, o as ExecutionHandlers, p as ExecutionMarket, q as ExecutionRequest, r as ExecutionSession, E as ExternalIndicatorEntry, F as FetchSeries, s as IndicatorEventMap, I as IndicatorHandle, t as IndicatorSummary, L as LegendActionDescriptor, u as LegendCalloutContent, v as LegendCalloutDescriptor, w as LegendCalloutItem, x as LegendCalloutSpec, y as LegendIndicatorInfo, M as MarksControl, N as NativeIndicator, z as NativeIndicatorContext, A as NativeIndicatorDescriptor, G as NativeIndicatorInfo, H as NativeIndicatorOutput, O as OVERRIDABLE_TOPBAR_IDS, P as ParsedSymbol, J as PreparedScript, K as RendererControl, a as ReplayBounds, Q as ReplayControl, T as ReplayEndReason, U as ReplayStartOptions, R as ReplayState, X as RunIndicatorResult, Y as SceneInspection, c as ScriptRun, Z as ScriptRunCause, _ as ScriptRunResult, S as ScriptingEngine, $ as SidePanelButton, a0 as SidePanelDescriptor, a1 as SidePanelHandle, a2 as SidePanelHeader, a3 as StatePersistenceHandler, a4 as StrategyFill, a5 as StrategyState, a6 as StrategyTrade, a7 as SymbolRankingHook, a8 as TypedEventBus, V as Vela, a9 as VelaDeps, b as VelaEventMap, aa as VisibleBarRange, ab as WidgetActionDescriptor, ac as WidgetActionTarget, ad as WidgetAttachment, W as WidgetContext, ae as getNativeIndicator, af as legendActions, ag as legendCallouts, ah as nativeIndicatorDescriptors, ai as nativeIndicatorTypes, aj as registerDefaultEngine, ak as registerLegendAction, al as registerLegendCallout, am as registerNativeIndicator, an as registerSidePanel, ao as registerStatePersistence, ap as registerSymbolRanking, aq as registerWidgetAction, ar as registerWidgetAttachment, as as resolveEngines, at as sidePanels, au as statePersistenceHandlers, av as symbolRanking, aw as topbarActionOverride, ax as unregisterDefaultEngine, ay as unregisterLegendAction, az as unregisterLegendCallout, aA as unregisterNativeIndicator, aB as unregisterSidePanel, aC as unregisterStatePersistence, aD as unregisterWidgetAction, aE as unregisterWidgetAttachment, aF as widgetActions, aG as widgetAttachments } from './contributions-CtlptxR8.cjs';
-import { D as Drawing, S as SerializedDrawing, U as Unsubscribe, L as LineStyle, P as PriceStyle, e as IChartRenderer, R as RendererCapabilities, f as RendererDisplayOptions, g as IndicatorRenderHandle, h as IndicatorStatus, c as VelaTheme, W as WallClock, O as OHLCV, i as Pane, j as PaneAction, k as MoveTarget, l as IndicatorModel, m as ScenePatch, I as InputValue, n as SymbolPickerFn, o as LegendActionView, p as LegendCalloutView, q as InputChangeEvent, T as ThemeName, C as CrosshairEvent, r as ClickEvent, A as AxisLongPressEvent, s as TimelineMark, t as MarkGroup, u as MarkClickEvent, a as VisibleRange, v as DataWindowReadout, w as IDrawingsRendererPort, x as Millis, y as SnapMode, z as DrawingTypeKey, B as ToolbarDefinition, M as MarketConfig, E as MarketSnapshot } from './options-BnEPUuVV.cjs';
-export { F as AddIndicatorOptions, G as AnimationConfig, H as Background, J as BoxFontFamily, K as BoxHAlign, Q as BoxTextSize, X as BoxVAlign, Y as CandleBarColor, Z as CandleSeries, _ as CandleStyle, $ as DataWindowGroup, a0 as DataWindowOHLC, a1 as DataWindowRow, a2 as DirtyRange, a3 as DrawingBox, a4 as DrawingExtend, a5 as DrawingIntent, a6 as DrawingLabel, a7 as DrawingLine, a8 as DrawingLinefill, a9 as DrawingMode, aa as DrawingPoint, ab as DrawingPolyline, ac as DrawingSeriesBar, ad as DrawingSeriesGateway, ae as DrawingSeriesState, af as DrawingStyle, ag as DrawingTable, ah as DrawingText, ai as DrawingXLoc, aj as DrawingsOption, ak as Fill, al as FillGradientStop, am as IndicatorMeta, an as InputCondition, ao as InputSchema, ap as InputType, aq as InputWhen, ar as IntroAnimation, as as IntroConfig, at as IntroStyle, au as LabelStyle, av as LabelYLoc, aw as LineLikeKind, ax as LineLikeSeries, ay as LineLikeStyle, az as MarkContent, aA as MarkContentSource, aB as MarkGlyph, aC as MarkPanelItem, aD as MarkShape, aE as MarkerPoint, aF as MarkerSeries, aG as MarketSwitch, aH as PaneAxis, aI as PaneAxisBand, aJ as PaneHint, aK as PaneKind, aL as PolylinePoint, aM as PriceLine, aN as Projector, aO as ProviderName, aP as RendererConstructor, aQ as Scene, aR as SchemaPatch, aS as SecondClock, aT as SeriesDisplay, aU as SeriesKind, aV as SeriesPoint, aW as SeriesSpec, aX as SeriesSurface, aY as SeriesValueDelta, aZ as SettingsField, a_ as SettingsSchema, a$ as SettingsVisibilityPolicy, b0 as TableCell, b1 as TableMerge, b2 as TablePosition, b3 as ToolbarGroupConfig, b4 as TradeExecution, b5 as ValuePatch, b as VelaOptions, V as VisibleRangePreset, b6 as buildToolbar, b7 as defaultToolbar, b8 as inputDeltas, b9 as inputVisible, ba as seriesInScale, bb as seriesShownOn } from './options-BnEPUuVV.cjs';
-import { S as SettingsSelectOption } from './plugin-BWxJRKzS.cjs';
-export { A as ACCENT, a as ACCENT_BRIGHT, B as BEARISH, b as BULLISH, c as BarTransform, d as BasePaintingModulation, C as CATEGORICAL, e as CHIP_PLATE, f as CROSSHAIR, g as ChartTypeDefinition, h as ChartTypeSettingsInstance, i as ChartTypeSettingsSection, j as ChartTypeSettingsSubsection, D as DrawingTypeMeta, H as HIGHLIGHT, I as INFO, k as INVALID, l as IdentifiableKind, M as MARKER, N as NEUTRAL, m as NormalizedSettingsRow, R as RendererLayerArgs, n as RendererLayerDefinition, o as RendererLayerInstance, p as SERIES_LINE, q as SESSION_OFF, r as SESSION_POST, s as SESSION_PRE, t as SLATE, u as SLATE_DEEP, v as SeriesDataEngine, w as SeriesDataEngineHost, x as SettingsInlineControl, y as SettingsRowCondition, z as SettingsRowDescriptor, E as SettingsRowInlineNumber, F as SettingsRowSwatch, G as SettingsRowValueKey, J as SettingsRowWhen, K as SettingsRowWidth, L as SettingsValueRow, T as TRADE_EXIT, O as TRADE_LONG, P as TRADE_SHORT, V as VALID, W as WARNING, Q as categoricalColor, U as chartType, X as chartTypes, Y as createDrawing, Z as deserializeDrawing, _ as drawingTypes, $ as getDrawingType, a0 as normalizeSettingsRow, a1 as registerChartType, a2 as registerDrawingType, a3 as registerRendererDefaults, a4 as registerRendererLayer, a5 as rendererDefaults, a6 as rendererLayers, a7 as settingsRowValueKeys, a8 as stableSeriesId, a9 as tickerModifierIds, aa as unregisterChartType, ab as unregisterRendererDefaults, ac as unregisterRendererLayer } from './plugin-BWxJRKzS.cjs';
-import { M as MarketDataFeed, D as DataProvider, P as ProviderInfo, a as SymbolDescriptor, S as SymbolInfo, b as ProviderCapabilities, B as BarRange } from './DataProvider-BrlxntPN.cjs';
-export { D as DEFAULT_PANEL_MAX_WIDTH, a as DEFAULT_PANEL_MIN_WIDTH, b as DEFAULT_PANEL_WIDTH, S as SidePanelOptions, c as clampPanelWidth } from './side-panel-HF0IAzwf.cjs';
+import { D as DrawingsDocument, d as Resolved, e as ReplayTick, f as DataControl, g as ReplayTickSource } from './contributions-Cgm9RJYP.cjs';
+export { B as BarsChangeReason, C as CellStateContext, h as CodeUpdateResult, i as ContextSelect, j as DrawingsControl, k as EngineAlert, l as EngineCapabilities, m as EngineContextSnapshot, n as EngineFactory, o as EngineWarning, p as ExecutionHandlers, q as ExecutionMarket, r as ExecutionRequest, s as ExecutionSession, E as ExternalIndicatorEntry, F as FetchSeries, t as IndicatorEventMap, I as IndicatorHandle, u as IndicatorSummary, L as LegendActionDescriptor, v as LegendCalloutContent, w as LegendCalloutDescriptor, x as LegendCalloutItem, y as LegendCalloutSpec, z as LegendIndicatorInfo, M as MarksControl, N as NativeIndicator, A as NativeIndicatorContext, G as NativeIndicatorDescriptor, H as NativeIndicatorInfo, J as NativeIndicatorOutput, O as OVERRIDABLE_TOPBAR_IDS, P as ParsedSymbol, K as PreparedScript, Q as RendererControl, a as ReplayBounds, T as ReplayControl, U as ReplayEndReason, X as ReplayStartOptions, R as ReplayState, Y as RunIndicatorResult, Z as SceneInspection, c as ScriptRun, _ as ScriptRunCause, $ as ScriptRunResult, S as ScriptingEngine, a0 as SidePanelButton, a1 as SidePanelDescriptor, a2 as SidePanelHandle, a3 as SidePanelHeader, a4 as StatePersistenceHandler, a5 as StrategyFill, a6 as StrategyState, a7 as StrategyTrade, a8 as SymbolRankingHook, a9 as TypedEventBus, V as Vela, aa as VelaDeps, b as VelaEventMap, ab as VisibleBarRange, ac as WidgetActionDescriptor, ad as WidgetActionTarget, ae as WidgetAttachment, W as WidgetContext, af as getNativeIndicator, ag as legendActions, ah as legendCallouts, ai as nativeIndicatorDescriptors, aj as nativeIndicatorTypes, ak as registerDefaultEngine, al as registerLegendAction, am as registerLegendCallout, an as registerNativeIndicator, ao as registerSidePanel, ap as registerStatePersistence, aq as registerSymbolRanking, ar as registerWidgetAction, as as registerWidgetAttachment, at as resolveEngines, au as sidePanels, av as statePersistenceHandlers, aw as symbolRanking, ax as topbarActionOverride, ay as unregisterDefaultEngine, az as unregisterLegendAction, aA as unregisterLegendCallout, aB as unregisterNativeIndicator, aC as unregisterSidePanel, aD as unregisterStatePersistence, aE as unregisterWidgetAction, aF as unregisterWidgetAttachment, aG as widgetActions, aH as widgetAttachments } from './contributions-Cgm9RJYP.cjs';
+import { D as Drawing, S as SerializedDrawing, U as Unsubscribe, L as LineStyle, P as PriceStyle, e as IChartRenderer, R as RendererCapabilities, f as RendererDisplayOptions, g as IndicatorRenderHandle, h as IndicatorStatus, c as VelaTheme, W as WallClock, O as OHLCV, i as Pane, j as PaneAction, k as MoveTarget, l as IndicatorModel, m as ScenePatch, I as InputValue, n as SymbolPickerFn, o as LegendActionView, p as LegendCalloutView, q as InputChangeEvent, T as ThemeName, C as CrosshairEvent, r as ClickEvent, A as AxisLongPressEvent, s as TimelineMark, t as MarkGroup, u as MarkClickEvent, a as VisibleRange, v as DataWindowReadout, w as IDrawingsRendererPort, x as Millis, y as SnapMode, z as DrawingTypeKey, B as ToolbarDefinition, M as MarketConfig, E as MarketSnapshot } from './options-NAUHiQEC.cjs';
+export { F as AddIndicatorOptions, G as AnimationConfig, H as Background, J as BoxFontFamily, K as BoxHAlign, Q as BoxTextSize, X as BoxVAlign, Y as CandleBarColor, Z as CandleSeries, _ as CandleStyle, $ as DataWindowGroup, a0 as DataWindowOHLC, a1 as DataWindowRow, a2 as DirtyRange, a3 as DrawingBox, a4 as DrawingExtend, a5 as DrawingIntent, a6 as DrawingLabel, a7 as DrawingLine, a8 as DrawingLinefill, a9 as DrawingMode, aa as DrawingPoint, ab as DrawingPolyline, ac as DrawingSeriesBar, ad as DrawingSeriesGateway, ae as DrawingSeriesState, af as DrawingStyle, ag as DrawingTable, ah as DrawingText, ai as DrawingXLoc, aj as DrawingsOption, ak as Fill, al as FillGradientStop, am as IndicatorMeta, an as InputCondition, ao as InputSchema, ap as InputType, aq as InputWhen, ar as IntroAnimation, as as IntroConfig, at as IntroStyle, au as LabelStyle, av as LabelYLoc, aw as LineLikeKind, ax as LineLikeSeries, ay as LineLikeStyle, az as MarkContent, aA as MarkContentSource, aB as MarkGlyph, aC as MarkPanelItem, aD as MarkShape, aE as MarkerPoint, aF as MarkerSeries, aG as MarketSwitch, aH as PaneAxis, aI as PaneAxisBand, aJ as PaneHint, aK as PaneKind, aL as PolylinePoint, aM as PriceLine, aN as Projector, aO as ProviderName, aP as RendererConstructor, aQ as Scene, aR as SchemaPatch, aS as SecondClock, aT as SeriesDisplay, aU as SeriesKind, aV as SeriesPoint, aW as SeriesSpec, aX as SeriesSurface, aY as SeriesValueDelta, aZ as SettingsField, a_ as SettingsSchema, a$ as SettingsVisibilityPolicy, b0 as TableCell, b1 as TableMerge, b2 as TablePosition, b3 as ToolbarGroupConfig, b4 as TradeExecution, b5 as ValuePatch, b as VelaOptions, V as VisibleRangePreset, b6 as buildToolbar, b7 as defaultToolbar, b8 as inputDeltas, b9 as inputVisible, ba as seriesInScale, bb as seriesShownOn } from './options-NAUHiQEC.cjs';
+import { S as SettingsSelectOption } from './plugin-CjjzZX2F.cjs';
+export { A as ACCENT, a as ACCENT_BRIGHT, B as BEARISH, b as BULLISH, c as BarTransform, d as BasePaintingModulation, C as CATEGORICAL, e as CHIP_PLATE, f as CROSSHAIR, g as ChartTypeDefinition, h as ChartTypeSettingsInstance, i as ChartTypeSettingsSection, j as ChartTypeSettingsSubsection, D as DrawingTypeMeta, H as HIGHLIGHT, I as INFO, k as INVALID, l as IdentifiableKind, M as MARKER, N as NEUTRAL, m as NormalizedSettingsRow, R as RendererLayerArgs, n as RendererLayerDefinition, o as RendererLayerInstance, p as SERIES_LINE, q as SESSION_OFF, r as SESSION_POST, s as SESSION_PRE, t as SLATE, u as SLATE_DEEP, v as SeriesDataEngine, w as SeriesDataEngineHost, x as SettingsInlineControl, y as SettingsRowCondition, z as SettingsRowDescriptor, E as SettingsRowInlineNumber, F as SettingsRowSwatch, G as SettingsRowValueKey, J as SettingsRowWhen, K as SettingsRowWidth, L as SettingsValueRow, T as TRADE_EXIT, O as TRADE_LONG, P as TRADE_SHORT, V as VALID, W as WARNING, Q as categoricalColor, U as chartType, X as chartTypes, Y as createDrawing, Z as deserializeDrawing, _ as drawingTypes, $ as getDrawingType, a0 as normalizeSettingsRow, a1 as registerChartType, a2 as registerDrawingType, a3 as registerRendererDefaults, a4 as registerRendererLayer, a5 as rendererDefaults, a6 as rendererLayers, a7 as settingsRowValueKeys, a8 as stableSeriesId, a9 as tickerModifierIds, aa as unregisterChartType, ab as unregisterRendererDefaults, ac as unregisterRendererLayer } from './plugin-CjjzZX2F.cjs';
+import { M as MarketDataFeed, D as DataProvider, P as ProviderInfo, a as SymbolDescriptor, S as SymbolInfo, b as ProviderCapabilities, B as BarRange } from './DataProvider-COGDs9Xg.cjs';
+export { D as DEFAULT_PANEL_MAX_WIDTH, a as DEFAULT_PANEL_MIN_WIDTH, b as DEFAULT_PANEL_WIDTH, S as SidePanelOptions, c as clampPanelWidth } from './side-panel-wMNfgyZb.cjs';
 export { i as iconMarkup, r as registerIcon } from './icons-BZYbJXSV.cjs';
 export { a as KeyBindingDescriptor, R as ResolvedBinding } from './keymap-CGOz5F5f.cjs';