@luxalgo/vela 0.8.0 → 0.8.2

package/dist/widget.cjs

@@ -1256,6 +1256,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"'));
@@ -1337,6 +1338,17 @@ function nextUid(prefix) {
   return `${prefix}-${++uid}`;
 }
 
+// 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 } })
+  );
+}
+
 // src/ui/keymap.ts
 var KEY_ALIASES = {
   esc: "escape",
@@ -1698,6 +1710,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;
@@ -1711,6 +1725,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,
@@ -1732,15 +1747,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();
@@ -1758,6 +1779,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) {
@@ -1851,6 +1873,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,
@@ -2070,16 +2093,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) {
@@ -2099,7 +2127,6 @@ var Popover = class {
     } else {
       this.el.remove();
     }
-    this.shown = false;
     if (open === this) open = null;
     this.ctrl.onClose?.();
   }
@@ -2305,6 +2332,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;
@@ -2401,6 +2430,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);
@@ -2408,12 +2438,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() {
@@ -2428,6 +2473,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();
   }
@@ -2556,6 +2606,8 @@ function swipeDirection(dx, dy) {
 }
 var Drawer = class {
   constructor(opts = {}) {
+    this.opener = null;
+    this.wasOpen = false;
     const doc = (opts.host ?? document.body).ownerDocument;
     injectStyles(DRAWER_STYLE_ID, DRAWER_CSS, doc);
     const host = opts.host ?? doc.body;
@@ -2583,12 +2635,16 @@ var Drawer = 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);
       vanilla.spreadProps(this.titleEl, api.getTitleProps(), 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;
     });
   }
   /** Any element between `from` and the panel that has already been scrolled down —
@@ -2697,10 +2753,22 @@ var Drawer = class {
   setTitle(title) {
     this.titleEl.textContent = title;
   }
+  /** 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, "drawer", 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() {
@@ -2708,6 +2776,11 @@ var Drawer = class {
   }
   destroy() {
     this.handle.stop();
+    if (this.wasOpen) {
+      this.wasOpen = false;
+      this.announce(false);
+    }
+    this.restoreOpener();
     this.backdrop.remove();
     this.positioner.remove();
   }
@@ -3617,14 +3690,49 @@ function buildColorPicker(color, theme, onChange, options = {}) {
   const knob = document.createElement("div");
   knob.style.cssText = "position:absolute;top:50%;width:15px;height:15px;border-radius:50%;background:var(--vela-selected-bg);box-shadow:0 1px 3px rgba(0,0,0,0.55);transform:translate(-50%,-50%);pointer-events:none;";
   track.appendChild(knob);
-  const pctBox = document.createElement("div");
-  pctBox.style.cssText = `min-width:42px;text-align:center;font:var(--vela-font-size-md) ${theme.fontFamily};color:var(--vela-fg);border:1px solid var(--vela-border);border-radius:5px;padding:3px 4px;`;
+  const pctBox = document.createElement("input");
+  pctBox.type = "text";
+  pctBox.inputMode = "numeric";
+  pctBox.title = "Opacity (%)";
+  pctBox.style.cssText = `width:46px;box-sizing:border-box;text-align:center;font:var(--vela-font-size-md) ${theme.fontFamily};color:var(--vela-fg);background:transparent;border:1px solid var(--vela-border);border-radius:5px;padding:3px 4px;outline:none;`;
+  pctBox.addEventListener("focus", () => {
+    pctBox.style.borderColor = "var(--vela-border-strong)";
+    pctBox.select();
+  });
   opRow.append(track, pctBox);
   const paintOpacity = () => {
     track.style.background = `linear-gradient(to right, ${curHex}00, ${curHex}ff), ${CHECKER}`;
     knob.style.left = `${curAlpha * 100}%`;
-    pctBox.textContent = `${Math.round(curAlpha * 100)}%`;
+    pctBox.value = `${Math.round(curAlpha * 100)}%`;
+  };
+  const commitTyped = () => {
+    pctBox.style.borderColor = "var(--vela-border)";
+    const n = parseFloat(pctBox.value.replace("%", ""));
+    if (Number.isFinite(n)) {
+      const next = Math.max(0, Math.min(100, n)) / 100;
+      if (Math.round(next * 100) !== Math.round(curAlpha * 100)) {
+        curAlpha = next;
+        paintOpacity();
+        emit();
+        return;
+      }
+    }
+    paintOpacity();
   };
+  pctBox.addEventListener("change", commitTyped);
+  pctBox.addEventListener("blur", () => {
+    pctBox.style.borderColor = "var(--vela-border)";
+    paintOpacity();
+  });
+  pctBox.addEventListener("keydown", (e) => {
+    if (e.key === "Escape") return;
+    e.stopPropagation();
+    if (e.key === "Enter") {
+      e.preventDefault();
+      commitTyped();
+      pctBox.blur();
+    }
+  });
   let dragging = false;
   const onDrag = (clientX) => {
     const r = track.getBoundingClientRect();
@@ -4963,6 +5071,7 @@ var LayoutPicker = class {
     const panel = doc.createElement("div");
     panel.className = "vela-lp";
     this.layer.appendChild(panel);
+    this.panel = panel;
     const cols = doc.createElement("div");
     cols.className = "vela-lp-cols";
     panel.appendChild(cols);
@@ -5044,10 +5153,12 @@ var LayoutPicker = class {
     this.doc.addEventListener("pointerdown", this.onDocPointerDown, true);
     this.doc.addEventListener("keydown", this.onDocKeydown, true);
     this.opts.onOpenChange?.(true);
+    if (this.isOpen) announceSurface(this.panel, true, "popover", this.opts.trigger);
   }
   close() {
     if (!this.isOpen) return;
     this.isOpen = false;
+    announceSurface(this.panel, false, "popover", this.opts.trigger);
     this.layer.style.display = "none";
     this.opts.trigger.setAttribute("aria-expanded", "false");
     this.doc.removeEventListener("pointerdown", this.onDocPointerDown, true);
@@ -5288,10 +5399,12 @@ function legendActions() {
 }
 function legendActionsProviderFor(chart, context) {
   return (indicatorId) => {
-    const handle = chart.indicators().find((h) => h.id === indicatorId);
+    const find = () => chart.indicators().find((h) => h.id === indicatorId);
+    const infoOf = (h) => ({ id: h.id, title: h.title, ...h.source !== void 0 ? { source: h.source } : {} });
+    const handle = find();
     if (!handle) return [];
-    const info = { id: handle.id, title: handle.title, ...handle.source !== void 0 ? { source: handle.source } : {} };
-    return legendActions().filter((d) => !d.when || d.when(info)).map((d) => ({ id: d.id, icon: d.icon, tooltip: d.tooltip, run: () => d.run(context(), info) }));
+    const info = infoOf(handle);
+    return legendActions().filter((d) => !d.when || d.when(info)).map((d) => ({ id: d.id, icon: d.icon, tooltip: d.tooltip, run: () => d.run(context(), infoOf(find() ?? handle)) }));
   };
 }
 var calloutRegistry = /* @__PURE__ */ new Map();
@@ -9508,6 +9621,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];
@@ -9517,11 +9634,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 });
@@ -9561,8 +9677,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) };
   }
@@ -9648,13 +9763,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
@@ -12781,6 +12907,32 @@ var CSS5 = `
 .vela-panel-pin .vela-icon { width: 15px; height: 15px; }
 .vela-panel-pin:hover { background: var(--vela-hover); color: var(--vela-fg-bright); }
 .vela-panel-pin[data-on='1'] { color: var(--vela-fg-bright); }
+.vela-panel-max {
+    all: unset;
+    cursor: pointer;
+    width: 26px;
+    height: 26px;
+    flex: none;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 4px;
+    color: var(--vela-fg-muted);
+}
+.vela-panel-max .vela-icon { width: 15px; height: 15px; }
+.vela-panel-max:hover { background: var(--vela-hover); color: var(--vela-fg-bright); }
+/* MAXIMIZED: the panel covers the whole dock host \u2014 every chart of the shell \u2014 whatever
+   its placement; the width handle and the pin have nothing to do meanwhile. */
+.vela-panel[data-maximized] {
+    position: absolute;
+    inset: 0;
+    width: auto;
+    max-width: none;
+    z-index: 26;
+    border-left: none;
+}
+.vela-panel[data-maximized] .vela-panel-resizer,
+.vela-panel[data-maximized] .vela-panel-pin { display: none; }
 .vela-panel-body { flex: 1; overflow: auto; padding: 8px; }
 .vela-panel-body::-webkit-scrollbar { width: 8px; }
 .vela-panel-body::-webkit-scrollbar-thumb { background: var(--vela-scroll); border-radius: 4px; border: 2px solid transparent; background-clip: padding-box; }
@@ -12833,6 +12985,7 @@ var CSS5 = `
     border-left: none;
 }
 [data-layout='mobile'] .vela-panel-resizer { display: none; }
+[data-layout='mobile'] .vela-panel-max { display: none; }
 `;
 function clampPanelWidth(px, min = DEFAULT_PANEL_MIN_WIDTH, max = DEFAULT_PANEL_MAX_WIDTH) {
   const lo = Number.isFinite(min) && min > 0 ? min : DEFAULT_PANEL_MIN_WIDTH;
@@ -12856,6 +13009,10 @@ var SidePanel = class {
      *  never on a programmatic {@link setOverlay}, for the same reason as widths. */
     this.onPlacementChange = null;
     this.pin = null;
+    this.maxButton = null;
+    this.maximizedOn = false;
+    /** Set while the close is announced, so a listener's own close does not re-enter. */
+    this.closing = false;
     const doc = host.ownerDocument;
     injectStyles(STYLE_ID4, CSS5, doc);
     this.minWidth = opts.resizable ? opts.minWidth ?? DEFAULT_PANEL_MIN_WIDTH : 1;
@@ -12890,7 +13047,13 @@ var SidePanel = class {
       });
       this.refreshPin();
     }
-    header.append(this.heading, this.slot, ...this.pin ? [this.pin] : [], close);
+    if (opts.maximizable) {
+      this.maxButton = doc.createElement("button");
+      this.maxButton.className = "vela-panel-max";
+      this.maxButton.addEventListener("click", () => this.setMaximized(!this.maximizedOn));
+      this.refreshMaxButton();
+    }
+    header.append(this.heading, this.slot, ...this.pin ? [this.pin] : [], ...this.maxButton ? [this.maxButton] : [], close);
     this.body = doc.createElement("div");
     this.body.className = "vela-panel-body";
     this.el.append(header, this.body);
@@ -12902,9 +13065,37 @@ var SidePanel = class {
   }
   /** Open/close the panel — a bare call flips it. */
   toggle(open2 = this.el.hidden) {
-    if (open2 === !this.el.hidden) return;
+    if (open2 === !this.el.hidden || !open2 && this.closing) return;
+    if (!open2) {
+      this.closing = true;
+      announceSurface(this.el, false, "panel");
+      this.closing = false;
+    }
     this.el.hidden = !open2;
+    if (!open2) this.setMaximized(false);
     this.onOpenChange?.(open2);
+    if (open2 && !this.el.hidden) announceSurface(this.el, true, "panel");
+  }
+  /** Whether the panel covers every chart right now. */
+  get maximized() {
+    return this.maximizedOn;
+  }
+  /** Maximize the panel over the shell's charts, or restore it. A no-op on a panel not
+   *  declared `maximizable`. */
+  setMaximized(maximized) {
+    if (!this.maxButton || maximized === this.maximizedOn) return;
+    this.maximizedOn = maximized;
+    if (maximized) this.el.dataset.maximized = "1";
+    else delete this.el.dataset.maximized;
+    this.refreshMaxButton();
+  }
+  refreshMaxButton() {
+    if (!this.maxButton) return;
+    const doc = this.maxButton.ownerDocument;
+    this.maxButton.replaceChildren(iconEl(this.maximizedOn ? "restore" : "maximize", doc));
+    this.maxButton.title = this.maximizedOn ? "Restore" : "Maximize";
+    this.maxButton.setAttribute("aria-label", this.maxButton.title);
+    this.maxButton.setAttribute("aria-pressed", this.maximizedOn ? "true" : "false");
   }
   /** The scrolling body, for a panel filled from OUTSIDE the class — a contributed panel's
    *  `mount` receives exactly this element. Subclasses use the protected `body`. */
@@ -12956,6 +13147,7 @@ var SidePanel = class {
     this.pin.setAttribute("aria-pressed", pinned ? "true" : "false");
   }
   destroy() {
+    if (this.open) announceSurface(this.el, false, "panel");
     this.el.remove();
   }
   /** The drag handle on the panel's inner (left) edge — the panel is docked right, so dragging
@@ -14372,19 +14564,22 @@ var PanelDock = class {
   /**
    * (Re)build the CONTRIBUTED panels from the registry — call once after the built-ins, and
    * again on `refreshActions()` so a late registration appears. Contributed panels that are
-   * gone from the registry are dropped; the ones still there are rebuilt, so a replaced
-   * descriptor takes effect.
+   * gone from the registry are dropped and a REPLACED descriptor is rebuilt; a panel whose
+   * descriptor is unchanged stays mounted as it is, so its content and state survive.
    */
   refresh() {
     const openBefore = this.openId;
-    for (const entry of [...this.entries]) if (entry.contributed) this.drop(entry);
-    for (const desc of sidePanels()) {
+    const registered = sidePanels();
+    for (const entry of [...this.entries]) if (entry.contributed && !registered.includes(entry.desc)) this.drop(entry);
+    for (const desc of registered) {
+      if (this.entries.some((e) => e.desc === desc)) continue;
       const panel = new SidePanel(this.host, desc.title, `vela-panel-${desc.id}`, {
         width: desc.width,
         resizable: desc.resizable,
         minWidth: desc.minWidth,
         maxWidth: desc.maxWidth,
-        overlay: desc.overlay
+        overlay: desc.overlay,
+        maximizable: desc.maximizable
       });
       const entry = {
         id: desc.id,
@@ -14392,10 +14587,19 @@ var PanelDock = class {
         icon: desc.icon,
         order: desc.order ?? DEFAULT_PANEL_ORDER,
         panel,
-        contributed: true
+        contributed: true,
+        desc
       };
       try {
-        entry.handle = desc.mount(this.deps.context(), panel.content, { slot: panel.headerSlot, setTitle: (t) => panel.setTitle(t) }) ?? void 0;
+        const header = {
+          slot: panel.headerSlot,
+          setTitle: (t) => panel.setTitle(t),
+          get maximized() {
+            return panel.maximized;
+          },
+          setMaximized: (on) => panel.setMaximized(on)
+        };
+        entry.handle = desc.mount(this.deps.context(), panel.content, header) ?? void 0;
         if (this.chart) entry.handle?.onChart?.(this.chart);
       } catch (err) {
         console.warn(`[vela] side panel "${desc.id}" failed to mount`, err);
@@ -15211,7 +15415,12 @@ var TimeframeQuick = class {
       content: (body) => body.append(this.input, this.hint),
       onOpenChange: (open2) => opts.onOpenChange?.(open2)
     });
-    this.input.addEventListener("input", () => this.renderHint());
+    this.input.addEventListener("input", () => {
+      const { selectionStart, selectionEnd } = this.input;
+      this.input.value = this.input.value.toUpperCase();
+      this.input.setSelectionRange(selectionStart, selectionEnd);
+      this.renderHint();
+    });
     this.input.addEventListener("keydown", (e) => {
       if (e.key !== "Enter") return;
       const parsed = parseTimeframe(this.input.value);
@@ -15223,7 +15432,7 @@ var TimeframeQuick = class {
   }
   open(seed = "") {
     this.dialog.show();
-    this.input.value = seed;
+    this.input.value = seed.toUpperCase();
     this.renderHint();
     setTimeout(() => {
       this.input.focus();
@@ -15241,7 +15450,7 @@ var TimeframeQuick = class {
       this.open(text);
       return;
     }
-    this.input.value += text;
+    this.input.value += text.toUpperCase();
     this.renderHint();
   }
   close() {
@@ -15254,7 +15463,7 @@ var TimeframeQuick = class {
     const raw = this.input.value.trim();
     const parsed = parseTimeframe(raw);
     if (!raw) {
-      this.hint.textContent = "e.g. 15, 4h, D, 3M";
+      this.hint.textContent = "e.g. 15, 4H, D, 3M";
       delete this.hint.dataset.invalid;
     } else if (parsed.valid) {
       this.hint.textContent = parsed.label ?? "";
@@ -15357,7 +15566,7 @@ var ShortcutsHelp = class {
     addRow("Delete the drawing under the cursor", ["Middle-click"]);
     const s = doc.createElement("div");
     s.className = "vela-sh-static";
-    s.textContent = "Typing a letter opens the symbol search; typing a digit opens the timeframe entry.";
+    s.textContent = "Typing a letter or 0 opens the symbol search; typing a digit from 1 to 9 opens the timeframe entry.";
     this.list.appendChild(s);
   }
 };
@@ -18161,6 +18370,7 @@ var DrawingToolbar = class {
         );
       }
     }
+    announceSurface(fly, true, "menu", cell);
   }
   openMagnetFlyout() {
     const cell = this.magnetCell;
@@ -18184,6 +18394,7 @@ var DrawingToolbar = class {
         })
       );
     }
+    announceSurface(fly, true, "menu", cell);
   }
   flyoutHeader(text) {
     const t = this.theme;
@@ -18252,9 +18463,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;
@@ -18379,23 +18592,21 @@ function arrowHitHtml(svg) {
   return `<span class="vela-dtb-hit vela-dtb-hit--arrow">${iconSpan(svg, 11)}</span>`;
 }
 
-// src/renderers/native/chrome/luxalgo-logos.ts
-var LUXALGO_SYMBOL_SVG = '<svg viewBox="0 0 45 40" aria-hidden="true"><g fill="currentColor"><path d="m40.25 38 4.58-7.998L28.802 2l-16.03 28 9.16-.001 6.87-12z"/><path d="M34.525 32.002 9.33 31.997 27.655 0h-9.158L.18 31.993 4.759 40h34.347z"/></g></svg>';
-var LUXALGO_WORDMARK_SVG = '<svg viewBox="0 0 964 252" aria-hidden="true"><path fill="currentColor" fill-rule="evenodd" d="M 614 94.500 L 614 189 633.500 189 L 653 189 653 94.500 L 653 0 633.500 0 L 614 0 614 94.500 M 0 97.500 L 0 189 63.023 189 L 126.045 189 125.773 170.750 L 125.500 152.500 84.250 152.239 L 43 151.978 43 78.989 L 43 6 21.500 6 L 0 6 0 97.500 M 450.387 96.451 C 421.871 146.253, 398.306 186.994, 398.020 186.987 C 397.423 186.972, 362 124.724, 362 123.691 C 362 123.316, 370.100 108.818, 380 91.472 C 389.900 74.127, 398 59.500, 398 58.968 C 398 58.380, 391.007 58, 380.210 58 L 362.420 58 348.060 83.138 C 334.400 107.052, 333.637 108.160, 332.399 105.888 C 331.682 104.575, 325.287 93.375, 318.187 81 L 305.277 58.500 287.139 58.227 C 277.162 58.078, 269 58.186, 269 58.469 C 269 58.751, 277.154 73.274, 287.120 90.741 C 297.086 108.209, 305.261 122.983, 305.287 123.574 C 305.312 124.164, 297.318 138.789, 287.522 156.074 C 277.725 173.358, 269.524 187.838, 269.296 188.250 C 269.068 188.662, 276.977 189, 286.870 189 L 304.859 189 319.163 163.959 C 331.321 142.674, 333.647 139.165, 334.670 140.563 C 335.331 141.468, 341.864 152.737, 349.186 165.606 L 362.500 189.003 402.442 188.752 L 442.384 188.500 472.080 136.695 C 488.413 108.203, 501.939 84.729, 502.138 84.531 C 502.337 84.333, 516 107.757, 532.500 136.583 L 562.500 188.994 584.750 188.997 C 596.987 188.999, 607 188.854, 607 188.675 C 607 188.319, 503.014 6.686, 502.532 6.201 C 502.369 6.037, 478.904 46.649, 450.387 96.451 M 717.500 55.017 C 697.175 57.389, 680.641 68.752, 672.036 86.264 C 665.866 98.818, 663.840 108.024, 663.840 123.500 C 663.840 133.409, 664.328 138.355, 665.892 144.300 C 672.076 167.810, 689.191 184.757, 711.529 189.489 C 730.549 193.518, 747.264 189.540, 761.282 177.648 C 764.944 174.542, 768.178 172, 768.470 172 C 769.345 172, 769.030 185.018, 767.979 192.285 C 765.618 208.613, 755.148 218.672, 738.473 220.632 C 732.586 221.324, 723.136 219.599, 717.709 216.843 C 712.693 214.295, 706.636 207.946, 703.972 202.443 C 702.789 199.999, 701.749 198, 701.661 198.001 C 700.201 198.007, 665.596 205.071, 665.230 205.437 C 664.326 206.341, 669.156 218.313, 672.607 223.721 C 682.146 238.672, 700.008 248.257, 723.500 251.033 C 758.132 255.124, 788.930 241.875, 800.287 218 C 806.923 204.047, 807 203.001, 807 126.542 L 807 58 788.500 58 L 770 58 770 66.500 C 770 71.175, 769.641 75, 769.203 75 C 768.765 75, 766.627 73.142, 764.453 70.872 C 752.805 58.708, 735.614 52.903, 717.500 55.017 M 878.500 55.031 C 850.107 59.412, 830.755 75.064, 822.285 100.500 C 819.905 107.644, 819.614 110.051, 819.565 123 C 819.501 139.581, 820.786 145.825, 826.763 158 C 832.104 168.880, 842.842 179.424, 854.077 184.822 C 867.651 191.343, 873.132 192.462, 891.500 192.462 C 909.868 192.462, 915.349 191.343, 928.923 184.822 C 944.653 177.265, 956.667 162.306, 961.710 144 C 963.074 139.048, 963.481 134.047, 963.418 123 C 963.346 110.140, 963.038 107.595, 960.694 100.500 C 953.325 78.193, 936.695 62.854, 913.500 56.969 C 904.262 54.625, 887.240 53.682, 878.500 55.031 M 134.015 102.750 C 134.027 139.250, 134.310 148.689, 135.549 153.947 C 141.139 177.663, 159.815 193, 183.105 193 C 196.453 193, 210.163 186.171, 217.936 175.650 C 219.826 173.093, 221.738 171, 222.186 171 C 222.634 171, 223 175.050, 223 180 L 223 189 242.507 189 L 262.014 189 261.757 123.750 L 261.500 58.500 242.500 58.500 L 223.500 58.500 223 99.500 C 222.513 139.406, 222.441 140.610, 220.289 144.634 C 209.729 164.377, 183.014 164.880, 174.299 145.500 C 172.677 141.895, 172.469 137.382, 172.190 99.750 L 171.880 58 152.940 58 L 134 58 134.015 102.750 M 729.932 87.998 C 719.311 89.821, 710.155 97.164, 705.141 107.880 C 702.851 112.772, 702.510 114.798, 702.505 123.521 C 702.500 132.834, 702.732 134.014, 705.787 140.218 C 709.761 148.290, 715.989 154.097, 723.853 157.063 C 731.409 159.912, 744.359 159.466, 750.795 156.136 C 767.289 147.601, 774.103 127.713, 767.019 108.780 C 761.433 93.851, 746.051 85.232, 729.932 87.998 M 883.972 88.348 C 865.749 92.310, 854.873 109.966, 858.119 130.316 C 860.933 147.963, 872.346 158.830, 889.084 159.799 C 900.714 160.472, 906.867 158.234, 914.650 150.497 C 919.856 145.323, 921.123 143.340, 922.900 137.587 C 925.412 129.456, 925.655 118.570, 923.489 111.275 C 918.479 94.405, 901.478 84.541, 883.972 88.348"/></svg>';
+// src/renderers/native/chrome/vela-logos.ts
+var VELA_MARK_SVG = '<svg viewBox="0 -142 161.66 148" aria-hidden="true"><g fill="currentColor"><path d="M0 -140L32.91 -140L77.52 -62.73L61.06 -34.24Z"/><path d="M161.66 -140L128.75 -140L84.14 -62.73L100.59 -34.24Z"/><path d="M80.83 -52.04L95.85 -26.02L80.83 0L65.81 -26.02Z"/></g></svg>';
+var VELA_LETTERS_SVG = '<svg viewBox="161.66 -142 310.57 148" aria-hidden="true"><g fill="currentColor"><path d="M226.3 1.17Q200.81 1.17 186.12 -12.99Q171.42 -27.15 171.42 -51.17Q171.42 -75.2 185.87 -89.6Q200.33 -104 224.25 -104Q247.4 -104 261.7 -90.58Q276.01 -77.15 276.3 -54.59Q276.3 -49.9 275.42 -45.02H200.81V-43.55Q201.2 -32.62 207.75 -26.42Q214.29 -20.21 225.03 -20.21Q233.72 -20.21 239.34 -23.93Q244.95 -27.64 246.81 -34.77H274.64Q272.1 -19.14 259.16 -8.98Q246.22 1.17 226.3 1.17ZM201.5 -63.38H247.88Q246.42 -72.75 240.27 -77.88Q234.12 -83.01 224.45 -83.01Q215.17 -83.01 208.92 -77.73Q202.67 -72.46 201.5 -63.38ZM287.54 0V-140.04H315.76V0ZM429.34 -23.83H432.56V0H418.11Q407.76 0 403.36 -4.44Q398.97 -8.89 399.16 -16.8Q387.83 1.17 365.57 1.17Q348.48 1.17 337.88 -6.74Q327.29 -14.65 327.29 -29Q327.29 -45.41 339.45 -54.3Q351.6 -63.18 374.55 -63.18H394.96V-68.16Q394.96 -75.2 390.08 -79.3Q385.2 -83.4 376.51 -83.4Q368.3 -83.4 363.03 -79.98Q357.76 -76.56 356.88 -70.8H329.73Q331.19 -85.84 344.08 -94.92Q356.97 -104 377.29 -104Q399.06 -104 410.88 -94.43Q422.7 -84.86 422.7 -66.6V-30.18Q422.7 -26.37 424.26 -25.1Q425.82 -23.83 429.34 -23.83ZM394.96 -42.38V-44.43H374.36Q365.47 -44.43 360.59 -40.92Q355.7 -37.4 355.7 -30.96Q355.7 -25.59 359.81 -22.41Q363.91 -19.24 370.94 -19.24Q381.97 -19.24 388.37 -25.54Q394.77 -31.84 394.96 -42.38Z"/><path fill-opacity="0.55" d="M437.44 -124.28H441.96V-113.41H445.34V-124.28H449.87V-127.4H437.44ZM451.43 -113.41H454.7V-123.29L458.97 -113.41H461.62L465.99 -123.29V-113.41H469.21V-127.4H464.53L460.42 -117.68L456.16 -127.4H451.43Z"/></g></svg>';
 
 // src/renderers/native/chrome/AttributionMark.ts
-var ATTRIBUTION_URL = "https://luxalgo.com/vela";
+var ATTRIBUTION_URL = "https://velacharts.dev/?utm_source=vela&utm_medium=attribution";
 var STYLE_ID20 = "vela-attribution-styles";
 var CSS20 = `
 .vela-attribution {
     text-decoration: none;
     display: flex;
     align-items: center;
-    /* Gutter, wordmark size and offset below are the brand lockup's own ratios,
-       measured off the official horizontal logo: gutter 0.157, wordmark height
-       0.966, and wordmark 0.109 LOWER than the symbol \u2014 box-centering the two
-       reads wrong because the symbol's ink hangs low and the wordmark descends. */
-    gap: 4px;
+    /* No gutter: the V is the wordmark's first letter, and the letters' viewBox starts
+       where the V's ends, so the kit's own letter spacing comes with them. */
+    gap: 0;
 }
 .vela-attribution .vela-attr-symbol {
     flex: none;
@@ -18403,7 +18614,7 @@ var CSS20 = `
     line-height: 0;
 }
 .vela-attribution .vela-attr-symbol svg {
-    height: 28px;
+    height: 24px;
     width: auto;
     display: block;
     filter: drop-shadow(0 1px 2px var(--vela-attr-shadow, rgba(0,0,0,0.45)));
@@ -18414,15 +18625,13 @@ var CSS20 = `
     opacity: 0;
     display: flex;
     align-items: center;
-    /* Offset here, not on the image: the clip box must not crop the descender. */
-    position: relative;
-    top: 3px;
+    /* Same height and baseline as the V (one viewBox height), so no vertical offset. */
     transform: translateX(-8px);
     transition: max-width 0.3s ease, opacity 0.25s ease, transform 0.3s ease;
     flex: none;
 }
 .vela-attribution .vela-attr-wordmark svg {
-    height: 27px;
+    height: 24px;
     width: auto;
     display: block;
     filter: drop-shadow(0 1px 2px var(--vela-attr-shadow, rgba(0,0,0,0.45)));
@@ -18437,14 +18646,11 @@ var CSS20 = `
    (data-layout): the workspace's single grid-wide mark lives OUTSIDE any renderer
    container, so only the shell attribute reaches it. */
 [data-vela-layout='mobile'] .vela-attribution .vela-attr-symbol svg,
-[data-layout='mobile'] .vela-attribution .vela-attr-symbol svg { height: 22px; }
+[data-layout='mobile'] .vela-attribution .vela-attr-symbol svg { height: 20px; }
 [data-vela-layout='mobile'] .vela-attribution .vela-attr-wordmark,
-[data-layout='mobile'] .vela-attribution .vela-attr-wordmark {
-    top: 2px;
-    transform: translateX(-6px);
-}
+[data-layout='mobile'] .vela-attribution .vela-attr-wordmark { transform: translateX(-6px); }
 [data-vela-layout='mobile'] .vela-attribution .vela-attr-wordmark svg,
-[data-layout='mobile'] .vela-attribution .vela-attr-wordmark svg { height: 21px; }
+[data-layout='mobile'] .vela-attribution .vela-attr-wordmark svg { height: 20px; }
 [data-vela-layout='mobile'] .vela-attribution:hover .vela-attr-wordmark,
 [data-layout='mobile'] .vela-attribution:hover .vela-attr-wordmark { transform: translateX(0); }
 `;
@@ -18501,10 +18707,10 @@ function createAttributionMark(doc, background) {
   const symbol = doc.createElement("span");
   symbol.className = "vela-attr-symbol";
   symbol.setAttribute("aria-hidden", "true");
-  symbol.innerHTML = LUXALGO_SYMBOL_SVG;
+  symbol.innerHTML = VELA_MARK_SVG;
   const wordmark = doc.createElement("span");
   wordmark.className = "vela-attr-wordmark";
-  wordmark.innerHTML = LUXALGO_WORDMARK_SVG;
+  wordmark.innerHTML = VELA_LETTERS_SVG;
   a.append(symbol, wordmark);
   return a;
 }
@@ -18916,7 +19122,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);
@@ -20779,20 +20985,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);
@@ -20803,26 +21015,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);
@@ -20830,6 +21057,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. */
@@ -20844,6 +21111,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);
@@ -20871,6 +21139,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);
@@ -20958,6 +21230,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();
     }
@@ -21026,7 +21299,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(),
@@ -21047,6 +21321,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);
         },
@@ -21057,9 +21335,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);
   }
   /**
@@ -21560,7 +21846,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) {
@@ -21568,9 +21854,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,
@@ -24500,15 +24799,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;
     }
@@ -24689,7 +24996,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;
@@ -25948,6 +26255,12 @@ var InputController = class {
     this.lastTapT = 0;
     this.lastTapX = 0;
     this.lastTapY = 0;
+    // Whether the last two primary presses were claimed by the drawings layer. A double-click
+    // is the last press plus the one before it; a tool-driven click pair must never fall through
+    // to the pane maximize toggle, even when the tool disarmed itself between the two clicks
+    // (a finished placement leaves plain cursor mode for the second click).
+    this.lastPressDrawing = false;
+    this.prevPressDrawing = false;
     this.onTouchContextMenu = (e) => {
       if (this.touches.size === 0) return;
       if (!(e.target instanceof Node) || !this.el?.contains(e.target)) return;
@@ -26002,19 +26315,24 @@ var InputController = class {
       this.moved = false;
       this.startX = x;
       this.startY = y;
+      this.prevPressDrawing = this.lastPressDrawing;
+      this.lastPressDrawing = false;
       if (this.deps.drawingsClaim?.(x, y)) {
         this.region = "drawing";
+        this.lastPressDrawing = true;
         this.deps.drawingsPointerDown?.(x, y, this.snapMode(e), e.shiftKey, e.ctrlKey || e.metaKey);
         this.capture(e.pointerId);
         return;
       }
       if (e.shiftKey && this.regionAt(x, y) === "data" && this.deps.drawingsMeasureStart?.(x, y, this.snapMode(e))) {
         this.region = "drawing";
+        this.lastPressDrawing = true;
         this.capture(e.pointerId);
         return;
       }
       if ((e.ctrlKey || e.metaKey) && this.regionAt(x, y) === "data" && this.deps.drawingsMarqueeStart?.(x, y)) {
         this.region = "drawing";
+        this.lastPressDrawing = true;
         this.capture(e.pointerId);
         return;
       }
@@ -26130,7 +26448,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();
@@ -26336,6 +26654,7 @@ var InputController = class {
     if (region === "price") this.deps.resetPriceScale(x, y);
     else if (region === "separator") this.deps.resetPaneSize(y);
     else if (region === "time") this.deps.resetView();
+    else if (this.lastPressDrawing || this.prevPressDrawing) return;
     else this.deps.dataDblClick(x, y);
   }
 };
@@ -28501,6 +28820,7 @@ function timeTicks(fromMs, toMs, target = 8, offsetMs = 0) {
   const step = pickStep(span / Math.max(1, target));
   const zFrom = fromMs + offsetMs;
   const zTo = toMs + offsetMs;
+  if (step >= MONTH) return calendarTicks(zFrom, zTo, step >= YEAR ? 12 : step >= 3 * MONTH ? 3 : 1, offsetMs);
   const first = Math.ceil(zFrom / step) * step;
   const out = [];
   for (let zt = first; zt <= zTo; zt += step) {
@@ -28531,6 +28851,18 @@ function timeTicks(fromMs, toMs, target = 8, offsetMs = 0) {
   }
   return out;
 }
+function calendarTicks(zFrom, zTo, months, offsetMs) {
+  const d0 = new Date(zFrom);
+  let idx = d0.getUTCFullYear() * 12 + d0.getUTCMonth();
+  if (Date.UTC(Math.floor(idx / 12), idx % 12, 1) < zFrom) idx += 1;
+  idx = Math.ceil(idx / months) * months;
+  const out = [];
+  for (let zt = Date.UTC(Math.floor(idx / 12), idx % 12, 1); zt <= zTo; idx += months, zt = Date.UTC(Math.floor(idx / 12), idx % 12, 1)) {
+    const label = months === 12 ? String(Math.floor(idx / 12)) : MONTHS[idx % 12];
+    out.push({ time: zt - offsetMs, label, major: true });
+  }
+  return out;
+}
 
 // src/renderers/native/chrome/countdown.ts
 function countdownText(barOpen, barMs, now2) {
@@ -32482,6 +32814,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;
@@ -33140,6 +33478,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";
@@ -34293,6 +34642,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
@@ -34380,7 +34731,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),
@@ -35006,6 +35357,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();
   }
@@ -35024,7 +35389,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}`;
@@ -35076,8 +35441,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();
@@ -44733,6 +45099,9 @@ var CSS21 = `
 .vela-statusline .vela-sl-market { align-self: center; display: inline-flex; }
 .vela-statusline .vela-sl-market > [hidden] { display: none !important; }
 .vela-statusline .vela-sl-replay-badge, .vela-statusline .vela-sl-replay-badge svg { display: block; width: 16px; height: 16px; }
+/* Tabular figures: every digit has one advance, so a readout whose text changes only in
+ * its digits keeps its width \u2014 render() skips the ladder for those (see widthKey). */
+.vela-statusline .vela-sl-values { font-variant-numeric: tabular-nums; }
 .vela-statusline .vela-sl-ohlc { display: flex; gap: var(--vela-space-1); color: var(--vela-fg-muted); }
 .vela-statusline .vela-sl-ohlc b { color: var(--vela-fg); font-weight: 500; }
 /* The change value wears the SAME ink as the OHLC values (set inline per render) \u2014
@@ -44850,6 +45219,10 @@ var Statusline = class {
     this.fitRO = null;
     /** The ladder rung currently applied — see {@link fit}. */
     this.layout = { stacked: false, level: "full" };
+    /** The readout {@link widthKey} the applied rung was fitted to. */
+    this.fitKey = null;
+    /** Web fonts landing after the last fit change every width without a resize. */
+    this.onFontsLoaded = () => this.fit();
     this.onContextMenu = (e) => {
       if (!this.menu || !this.menuHooks) return;
       e.preventDefault();
@@ -44913,6 +45286,7 @@ var Statusline = class {
       this.fitRO = new ResizeObserver(() => this.fit());
       this.fitRO.observe(host);
     }
+    doc.fonts?.addEventListener("loadingdone", this.onFontsLoaded);
     this.marketTip = new Tooltip(this.marketEl, { content: MARKET_LABELS.open, placement: "bottom" });
     this.eyeTip = new Tooltip(this.eyeEl, { content: "Show chart", placement: "bottom" });
     this.setMarketStatus("open");
@@ -44965,6 +45339,7 @@ var Statusline = class {
    * (detached host, node tests) nothing overflows, so the widest rung stays.
    */
   fit() {
+    this.fitKey = this.widthKey();
     this.syncParts();
     const seg = segmentVisibility(this.parts, this.chartHidden);
     const overflows = () => this.el.scrollWidth > this.el.clientWidth;
@@ -45121,6 +45496,7 @@ var Statusline = class {
     this.detach();
     this.fitRO?.disconnect();
     this.fitRO = null;
+    this.el.ownerDocument.fonts?.removeEventListener("loadingdone", this.onFontsLoaded);
     this.el.removeEventListener("contextmenu", this.onContextMenu);
     this.menu?.destroy();
     this.menu = null;
@@ -45136,7 +45512,22 @@ var Statusline = class {
   }
   render() {
     if (this.menuHooks) this.setChartHidden(!this.menuHooks.chartVisible());
-    this.fit();
+    if (this.widthKey() === this.fitKey) this.renderValues();
+    else this.fit();
+  }
+  /** Everything the readout's width depends on, at every rung: its shape, and each
+   *  value's sign, digit count and decimals (the digits themselves are tabular — see
+   *  the CSS; the grouping commas follow from the digit count). `toFixed` carries all
+   *  three at a fraction of the locale formatter's cost — this runs per pointer move.
+   *  The parts, the host's size and the fonts re-fit through their own paths. */
+  widthKey() {
+    const bar = this.hoverBar ?? this.lastBar;
+    if (!bar) return this.readout;
+    const dp = decimalsFor(bar.close);
+    const diff = bar.close - bar.open;
+    const text = [bar.open, bar.high, bar.low, bar.close, diff].map((v) => v.toFixed(dp));
+    text.push((diff / bar.open * 100).toFixed(2));
+    return `${this.readout} ${text.join(" ")}`.replace(/\d/g, "0");
   }
   /** Write the value readout for the current bar at the current ladder level. */
   renderValues() {
@@ -46770,7 +47161,7 @@ var ChartCell = class {
    *  then the manifest in the host's own order. */
   libraryRows() {
     return [
-      ...this.supportedNatives().map((n) => ({ name: n.title, category: "Vela", native: true, nativeType: n.type, beta: n.beta })),
+      ...this.supportedNatives().map((n) => ({ name: n.title, category: "Built-in", native: true, nativeType: n.type, beta: n.beta })),
       ...this.manifest.map((e) => ({ name: e.name, language: e.language, category: e.category }))
     ];
   }
@@ -47770,11 +48161,11 @@ function resolveTyping(key, open2) {
   if (open2.dialogs > 0) {
     if (key.length !== 1) return null;
     if (open2.symbolSearch) return { target: "symbol", text: key.toUpperCase() };
-    if (open2.timeframeEntry) return { target: "timeframe", text: key };
+    if (open2.timeframeEntry) return { target: "timeframe", text: key.toUpperCase() };
     return null;
   }
-  if (/^[a-zA-Z]$/.test(key)) return { target: "symbol", text: key.toUpperCase() };
-  if (/^[0-9]$/.test(key)) return { target: "timeframe", text: key };
+  if (/^[a-zA-Z0]$/.test(key)) return { target: "symbol", text: key.toUpperCase() };
+  if (/^[1-9]$/.test(key)) return { target: "timeframe", text: key };
   return null;
 }
 var VelaWorkspace = class {
@@ -49512,7 +49903,7 @@ var VelaWorkspace = class {
       }
     });
   }
-  /** Bare-typing router: letters → symbol search (seeded), digits → timeframe entry. */
+  /** Bare-typing router: letters and `0` → symbol search (seeded), digits 1–9 → timeframe entry. */
   routeTyping(ev) {
     if (this.destroyed) return;
     if (ev.ctrlKey || ev.metaKey || ev.altKey) return;