@ai-ecoverse/slicc-spectrum 1.62.1 → 1.63.0

package/dist/slicc-ui.js

@@ -13845,13 +13845,16 @@ function table(rows) {
 var done = (result, note = "") => result.code === 0 ? { stdout: `${result.message}${note}
 `, stderr: "", code: 0 } : { stdout: "", stderr: `panel: ${result.message}
 `, code: result.code };
+function closedWhen(ago2) {
+  return ago2 < 5e3 ? "just now" : `${Math.round(ago2 / 1e3)} s ago`;
+}
 function act(scope, parsed) {
   const { panels, reachable: reachable2, cone } = scope;
   if (parsed.verb === "reset") {
     const recent = scope.agent ? panels.recentClose() : null;
     if (recent)
       return refusedOutput(
-        `the user closed ${recent.id} ${Math.round(recent.ago / 1e3)} s ago; ask before resetting the layout`
+        `the user closed ${recent.id} ${closedWhen(recent.ago)}; ask before resetting the layout`
       );
     return done(panels.reset());
   }
@@ -13867,9 +13870,7 @@ function act(scope, parsed) {
   if (parsed.verb === "close") return done(panels.close(id));
   const ago2 = scope.agent && !panels.find(id)?.open ? panels.closedAgo(id) : null;
   if (ago2 !== null)
-    return refusedOutput(
-      `the user closed ${id} ${Math.round(ago2 / 1e3)} s ago; ask before opening it again`
-    );
+    return refusedOutput(`the user closed ${id} ${closedWhen(ago2)}; ask before opening it again`);
   if (parsed.verb === "move") return done(panels.move(id, place3));
   const options = { place: place3, section: parsed.section };
   if (parsed.verb === "open") return done(panels.open(id, options));
@@ -14081,6 +14082,20 @@ function deepActive(root2) {
 }
 var scrollback = 1 << 18;
 var laid = ({ width, height }) => width > 0 && height > 0;
+function settled(element2) {
+  return new Promise((resolve2) => {
+    let last = "";
+    const frame = () => {
+      if (!element2.isConnected) return;
+      const { width, height } = element2.getBoundingClientRect();
+      const size4 = `${width}x${height}`;
+      if (laid({ width, height }) && size4 === last) return resolve2();
+      last = size4;
+      requestAnimationFrame(frame);
+    };
+    requestAnimationFrame(frame);
+  });
+}
 var ended = { write() {
 }, resize() {
 }, close() {
@@ -14286,7 +14301,7 @@ var SliccTerminalPanel = class extends ThemedElement {
     const backend = keep(model.terminals, info.id);
     terminal.backend = {
       open: async (sink) => {
-        await this.#placed(info.id);
+        await this.#placed(info.id, terminal);
         terminal.fit();
         return backend.open(sink, { cols: terminal.cols, rows: terminal.rows });
       }
@@ -14306,17 +14321,18 @@ var SliccTerminalPanel = class extends ThemedElement {
     );
     return terminal;
   }
-  #placed(id) {
+  #placed(id, screen) {
     const host4 = this.getRootNode().host;
     const panel = host4?.localName === "slicc-dock" ? host4.api.getPanel(terminalPanel(id)) : void 0;
-    if (!panel || laid(panel.api)) return Promise.resolve();
-    return new Promise((resolve2) => {
+    if (!panel) return Promise.resolve();
+    const sized = laid(panel.api) ? Promise.resolve() : new Promise((resolve2) => {
       const watch = panel.api.onDidDimensionsChange((size4) => {
         if (!laid(size4)) return;
         watch.dispose();
         resolve2();
       });
     });
+    return sized.then(() => settled(screen));
   }
   #request() {
     this.dispatchEvent(new CustomEvent("new-terminal", { bubbles: true, composed: true }));
@@ -20482,6 +20498,16 @@ function body(call, color) {
   }
   return b`<pre class="input">${call.input}</pre>`;
 }
+var severityWords = {
+  error: "Error: ",
+  warn: "Warning: ",
+  info: "Note: "
+};
+function notes(list5) {
+  return b`<ul class="notes">${list5.map(
+    (note) => b`<li data-note data-severity=${note.severity}>${note.severity === "info" ? b`<swc-icon-info-circle size="s" aria-hidden="true"></swc-icon-info-circle>` : b`<swc-icon-alert-triangle size="s" aria-hidden="true"></swc-icon-alert-triangle>`}<span><span class="sr">${severityWords[note.severity]}</span>${note.text}</span></li>`
+  )}</ul>`;
+}
 function tool(call, color = "light") {
   const kind = toolKind(call.name);
   return b`<details class="tool" data-status=${call.status} data-tool=${call.name} data-kind=${kind.id}>
@@ -20499,6 +20525,7 @@ function tool(call, color = "light") {
     <div class="call">
       ${body(call, color)}
       ${call.output ? b`<pre class="output">${call.output}</pre>` : A}
+      ${call.notes?.length ? notes(call.notes) : A}
       ${call.image ? b`<img class="shot" src=${call.image} alt=${call.title} />` : A}
     </div>
   </details>`;
@@ -21153,6 +21180,33 @@ var messageCss = i`
     max-block-size: calc(var(--swc-spacing-1000) * 2.5);
     overflow: auto;
   }
+  .call > pre {
+    white-space: pre-wrap;
+    overflow-wrap: anywhere;
+  }
+  .notes {
+    display: flex;
+    flex-direction: column;
+    gap: var(--swc-spacing-75);
+    margin: var(--swc-spacing-100) 0 0;
+    padding: 0;
+    list-style: none;
+    color: var(--swc-neutral-subdued-content-color-default);
+  }
+  .notes li {
+    display: flex;
+    align-items: flex-start;
+    gap: var(--swc-spacing-75);
+    overflow-wrap: anywhere;
+  }
+  .notes swc-icon-alert-triangle,
+  .notes swc-icon-info-circle {
+    flex: none;
+    margin-block-start: var(--swc-spacing-50);
+  }
+  .notes [data-severity='error'] {
+    color: var(--swc-negative-content-color-default);
+  }
   .call > pre.input:has(+ pre.output) {
     margin-block-end: calc(-1 * var(--swc-spacing-100));
     border-block-end: 0;
@@ -21440,7 +21494,8 @@ var messageCss = i`
   .lick[data-severity='warn'] {
     --severity: var(--swc-notice-visual-color);
   }
-  .lick .sr {
+  .lick .sr,
+  .notes .sr {
     position: absolute;
     inline-size: 1px;
     block-size: 1px;
@@ -21534,7 +21589,7 @@ function requiresText(item2, all2) {
   return parts2.length ? parts2.join("; ") : null;
 }
 var snapshot = (items) => new Map(items.map(({ id, state: state3, error }) => [id, { state: state3, error }]));
-function settled(failures, before, after) {
+function settled2(failures, before, after) {
   return new Map(
     [...failures].filter(([id]) => {
       const was = before.get(id);
@@ -21843,7 +21898,7 @@ var SliccUpdates = class extends ModelElement {
     const subscriptions = [
       port.on("items", (items) => {
         const next = snapshot(items);
-        this.failures = settled(this.failures, previous, next);
+        this.failures = settled2(this.failures, previous, next);
         previous = next;
         this.requestUpdate();
       })
@@ -21854,7 +21909,7 @@ var SliccUpdates = class extends ModelElement {
       ...subscriptions,
       port.on("packages", (items) => {
         const next = snapshot(items);
-        this.problems = settled(this.problems, packages, next);
+        this.problems = settled2(this.problems, packages, next);
         packages = next;
         this.requestUpdate();
       })
@@ -27731,11 +27786,13 @@ function attention(section) {
 var SliccMonitor = class extends ModelElement {
   static properties = {
     ...ModelElement.properties,
-    expanded: { state: true }
+    expanded: { state: true },
+    copied: { state: true }
   };
   constructor() {
     super();
     this.expanded = {};
+    this.copied = null;
   }
   static styles = [
     shared,
@@ -27835,6 +27892,36 @@ var SliccMonitor = class extends ModelElement {
         display: block;
         color: var(--swc-neutral-subdued-content-color-default);
       }
+      .alert > div {
+        min-width: 0;
+      }
+      .alert .command {
+        display: flex;
+        align-items: center;
+        gap: var(--swc-spacing-100);
+        margin-block-start: var(--swc-spacing-75);
+        padding-inline-start: var(--swc-spacing-100);
+        border-radius: var(--swc-corner-radius-medium-default);
+        background: var(--swc-background-layer-1-color);
+      }
+      .alert code {
+        flex: 1;
+        min-width: 0;
+        overflow-x: auto;
+        white-space: nowrap;
+        font-family: var(--swc-code-font-family-stack);
+        font-size: var(--swc-font-size-75);
+        color: var(--swc-code-color);
+      }
+      .alert .lead {
+        display: block;
+        margin-block-start: var(--swc-spacing-75);
+        color: var(--swc-neutral-subdued-content-color-default);
+      }
+      .alert .uncopied {
+        display: block;
+        color: var(--swc-negative-content-color-default);
+      }
       .sections {
         display: grid;
         margin: 0;
@@ -27959,9 +28046,16 @@ var SliccMonitor = class extends ModelElement {
     const error = alert.severity === "error";
     return b`<li class="alert" data-severity=${alert.severity}>
       ${error ? b`<swc-icon-alert-diamond size="s" aria-hidden="true"></swc-icon-alert-diamond>` : b`<swc-icon-alert-triangle size="s" aria-hidden="true"></swc-icon-alert-triangle>`}
-      <div><span class="sr">${error ? "Error: " : "Warning: "}</span><strong>${alert.title}</strong><span class="detail">${alert.detail}</span></div>
+      <div><span class="sr">${error ? "Error: " : "Warning: "}</span><strong>${alert.title}</strong><span class="detail">${alert.detail}</span>${alert.command ? this.#command(alert.id, alert.command, alert.commandLabel ?? "Run") : A}</div>
     </li>`;
   }
+  #command(id, text2, label) {
+    const copied = this.copied?.id === id && this.copied.text === text2 ? this.copied : null;
+    return b`<span class="lead">${label}:</span><div class="command" data-command><code>${text2}</code><swc-action-button size="s" quiet data-action="copy-command" accessible-label=${copied?.done ? "Copied" : "Copy command"} @click=${() => this.#copy(id, text2)}><swc-icon-copy slot="icon"></swc-icon-copy>${copied?.done ? "Copied" : "Copy"}</swc-action-button></div>${copied && !copied.done ? b`<span class="uncopied" role="alert" data-error="copy">Couldn’t copy. Select the command and copy it.</span>` : A}`;
+  }
+  async #copy(id, text2) {
+    this.copied = { id, text: text2, done: await copyText(text2) };
+  }
   #open(id) {
     this.dispatchEvent(
       new CustomEvent("show-surface", { detail: { id }, bubbles: true, composed: true })
@@ -55121,16 +55215,24 @@ var OverflowObserver = class extends CompositeDisposable {
   }
 };
 function watchElementResize(element2, cb) {
+  const pendingFrames = /* @__PURE__ */ new Set();
   const observer = new ResizeObserver((entires) => {
-    requestAnimationFrame(() => {
+    let ran = false;
+    let frame;
+    frame = requestAnimationFrame(() => {
+      ran = true;
+      if (frame !== void 0) pendingFrames.delete(frame);
       const firstEntry = entires[0];
       cb(firstEntry);
     });
+    if (!ran) pendingFrames.add(frame);
   });
   observer.observe(element2);
   return { dispose: () => {
     observer.unobserve(element2);
     observer.disconnect();
+    for (const frame of pendingFrames) cancelAnimationFrame(frame);
+    pendingFrames.clear();
   } };
 }
 var removeClasses = (element2, ...classes) => {
@@ -63603,16 +63705,21 @@ var TabsContainer = class extends CompositeDisposable {
         y: event2.clientY,
         zIndex: (relativeParent === null || relativeParent === void 0 ? void 0 : relativeParent.style.zIndex) ? `calc(${relativeParent.style.zIndex} * 2)` : void 0
       };
-      const context = this.createOverflowRenderContext(root2, anchor);
+      const { context, rowRenderers } = this.createOverflowRenderContext(root2, anchor);
       const advancedOverflow = this.accessor.advancedOverflowService;
-      if (advancedOverflow) advancedOverflow.renderOverflow({
-        group: this.group,
-        overflowTabs: [...this._overflowTabs],
-        overflowTabGroups: [...this._overflowTabGroups],
-        pinnedOverflowTabs: [...this._overflowPinnedTabs],
-        context
-      });
-      else context.open(this.renderFreeOverflowList(context));
+      try {
+        if (advancedOverflow) advancedOverflow.renderOverflow({
+          group: this.group,
+          overflowTabs: [...this._overflowTabs],
+          overflowTabGroups: [...this._overflowTabGroups],
+          pinnedOverflowTabs: [...this._overflowPinnedTabs],
+          context
+        });
+        else context.open(this.renderFreeOverflowList(context));
+      } catch (err) {
+        rowRenderers.dispose();
+        throw err;
+      }
     }));
   }
   /**
@@ -63633,6 +63740,7 @@ var TabsContainer = class extends CompositeDisposable {
       if (overflowGroupSet.has(tg.id)) for (const pid of tg.panelIds) panelToGroup.set(pid, tg);
     }
     const popup2 = () => this.accessor.getPopupServiceForGroup(this.group);
+    const rowRenderers = new CompositeDisposable();
     const buildGroupHeader = (tg) => {
       const groupHeader = document.createElement("div");
       groupHeader.className = "dv-tabs-overflow-group-header";
@@ -63662,69 +63770,87 @@ var TabsContainer = class extends CompositeDisposable {
       return groupHeader;
     };
     return {
-      overflowGroupIdForPanel: (panelId) => {
-        var _panelToGroup$get;
-        return (_panelToGroup$get = panelToGroup.get(panelId)) === null || _panelToGroup$get === void 0 ? void 0 : _panelToGroup$get.id;
-      },
-      buildGroupHeader: (tabGroupId) => {
-        const tg = groupById.get(tabGroupId);
-        if (!tg || !overflowGroupSet.has(tg.id)) return;
-        return buildGroupHeader(tg);
-      },
-      buildPinnedHeader: () => {
-        const header = document.createElement("div");
-        header.className = "dv-tabs-overflow-group-header dv-tabs-overflow-pinned-header";
-        const glyph = createPinButton();
-        glyph.classList.add("dv-tabs-overflow-pinned-icon");
-        header.appendChild(glyph);
-        const labelSpan = document.createElement("span");
-        labelSpan.className = "dv-tabs-overflow-group-label";
-        labelSpan.textContent = "Pinned";
-        header.appendChild(labelSpan);
-        return header;
-      },
-      buildRow: (panelId) => {
-        const panel = this.group.panels.find((p17) => p17.id === panelId);
-        if (!panel) return;
-        const tab = this.tabs.tabs.find((t88) => t88.panel.id === panelId);
-        const tg = panelToGroup.get(panelId);
-        const child = panel.view.createTabRenderer("headerOverflow").element;
-        const wrapper = document.createElement("div");
-        toggleClass(wrapper, "dv-tab", true);
-        toggleClass(wrapper, "dv-active-tab", panel.api.isActive);
-        toggleClass(wrapper, "dv-inactive-tab", !panel.api.isActive);
-        if (tg) toggleClass(wrapper, "dv-tab--grouped", true);
-        const doActivate = () => {
-          if (tg === null || tg === void 0 ? void 0 : tg.collapsed) tg.expand();
-          tab === null || tab === void 0 || tab.element.scrollIntoView({
-            block: "nearest",
-            inline: "nearest"
+      context: {
+        overflowGroupIdForPanel: (panelId) => {
+          var _panelToGroup$get;
+          return (_panelToGroup$get = panelToGroup.get(panelId)) === null || _panelToGroup$get === void 0 ? void 0 : _panelToGroup$get.id;
+        },
+        buildGroupHeader: (tabGroupId) => {
+          const tg = groupById.get(tabGroupId);
+          if (!tg || !overflowGroupSet.has(tg.id)) return;
+          return buildGroupHeader(tg);
+        },
+        buildPinnedHeader: () => {
+          const header = document.createElement("div");
+          header.className = "dv-tabs-overflow-group-header dv-tabs-overflow-pinned-header";
+          const glyph = createPinButton();
+          glyph.classList.add("dv-tabs-overflow-pinned-icon");
+          header.appendChild(glyph);
+          const labelSpan = document.createElement("span");
+          labelSpan.className = "dv-tabs-overflow-group-label";
+          labelSpan.textContent = "Pinned";
+          header.appendChild(labelSpan);
+          return header;
+        },
+        buildRow: (panelId) => {
+          const panel = this.group.panels.find((p17) => p17.id === panelId);
+          if (!panel) return;
+          const tab = this.tabs.tabs.find((t88) => t88.panel.id === panelId);
+          const tg = panelToGroup.get(panelId);
+          const tabComponent = panel.view.createTabRenderer("headerOverflow");
+          let rowDisposed = false;
+          const disposeRow = Disposable.from(() => {
+            if (!rowDisposed) {
+              var _tabComponent$dispose;
+              rowDisposed = true;
+              (_tabComponent$dispose = tabComponent.dispose) === null || _tabComponent$dispose === void 0 || _tabComponent$dispose.call(tabComponent);
+            }
           });
-          this.accessor.withOrigin("user", () => panel.api.setActive());
-        };
-        wrapper.addEventListener("click", (event2) => {
-          popup2().close();
-          if (event2.defaultPrevented) return;
-          doActivate();
-        });
-        wrapper.appendChild(child);
-        return {
-          element: wrapper,
-          panel,
-          activate: () => {
+          if (rowRenderers.isDisposed) disposeRow.dispose();
+          else rowRenderers.addDisposables(disposeRow);
+          const child = tabComponent.element;
+          const wrapper = document.createElement("div");
+          toggleClass(wrapper, "dv-tab", true);
+          toggleClass(wrapper, "dv-active-tab", panel.api.isActive);
+          toggleClass(wrapper, "dv-inactive-tab", !panel.api.isActive);
+          if (tg) toggleClass(wrapper, "dv-tab--grouped", true);
+          const doActivate = () => {
+            if (tg === null || tg === void 0 ? void 0 : tg.collapsed) tg.expand();
+            tab === null || tab === void 0 || tab.element.scrollIntoView({
+              block: "nearest",
+              inline: "nearest"
+            });
+            this.accessor.withOrigin("user", () => panel.api.setActive());
+          };
+          wrapper.addEventListener("click", (event2) => {
             popup2().close();
+            if (event2.defaultPrevented) return;
             doActivate();
-          }
-        };
-      },
-      open: (body4) => {
-        popup2().openPopover(body4, anchor);
+          });
+          wrapper.appendChild(child);
+          return {
+            element: wrapper,
+            panel,
+            activate: () => {
+              popup2().close();
+              doActivate();
+            },
+            dispose: () => {
+              rowRenderers.removeDisposable(disposeRow);
+              disposeRow.dispose();
+            }
+          };
+        },
+        open: (body4) => {
+          popup2().openPopover(body4, anchor, { onClose: () => rowRenderers.dispose() });
+        },
+        close: () => popup2().close(),
+        focusTrigger: () => {
+          root2.tabIndex = -1;
+          root2.focus();
+        }
       },
-      close: () => popup2().close(),
-      focusTrigger: () => {
-        root2.tabIndex = -1;
-        root2.focus();
-      }
+      rowRenderers
     };
   }
   /**
@@ -64638,6 +64764,7 @@ var DockviewGroupPanelModel = class extends CompositeDisposable {
     this.tabsContainer.setRightActionsElement(element2);
   }
   setActive(isGroupActive, force = false) {
+    if (this.isDisposed) return;
     if (!force && this.isActive === isGroupActive) return;
     this._isGroupActive = isGroupActive;
     toggleClass(this.container, "dv-active-group", isGroupActive);
@@ -67291,13 +67418,14 @@ var ContextMenuController = class {
   * menu passes the `tabGroup`. No-op when no renderer could be created (no
   * factory configured, or the factory declined the component).
   */
-  appendComponentItem(menuEl, item2, identity, group, close) {
+  appendComponentItem(menuEl, item2, identity, group, close, renderers) {
     var _this$accessor$option4, _this$accessor$option5;
     const renderer = (_this$accessor$option4 = (_this$accessor$option5 = this.accessor.options).createContextMenuItemComponent) === null || _this$accessor$option4 === void 0 ? void 0 : _this$accessor$option4.call(_this$accessor$option5, {
       id: nextContextMenuItemId(),
       component: item2.component
     });
     if (!renderer) return;
+    renderers.addDisposables(renderer);
     renderer.init(_objectSpread2(_objectSpread2({}, identity), {}, {
       group,
       api: this.accessor.api,
@@ -67357,9 +67485,9 @@ var ContextMenuController = class {
   * default row; an item carrying none of the three renders nothing. Shared
   * by both menus, which differ only in `identity`.
   */
-  appendConfigItem(menuEl, item2, identity, group, close) {
+  appendConfigItem(menuEl, item2, identity, group, close, renderers) {
     if (item2.element) menuEl.appendChild(item2.element);
-    else if (item2.component) this.appendComponentItem(menuEl, item2, identity, group, close);
+    else if (item2.component) this.appendComponentItem(menuEl, item2, identity, group, close, renderers);
     else if (item2.label) menuEl.appendChild(buildItem(item2.label, close, () => {
       var _item$action;
       return (_item$action = item2.action) === null || _item$action === void 0 ? void 0 : _item$action.call(item2);
@@ -67371,22 +67499,28 @@ var ContextMenuController = class {
     event2.preventDefault();
     const popupService = this.accessor.getPopupServiceForGroup(group);
     const close = () => popupService.close();
+    const renderers = new CompositeDisposable();
     const menuEl = document.createElement("div");
     menuEl.className = "dv-context-menu";
     menuEl.setAttribute("role", "menu");
-    for (const item2 of items) {
-      if (isItemConfig(item2)) {
-        this.appendConfigItem(menuEl, item2, { panel }, group, close);
-        continue;
+    try {
+      for (const item2 of items) {
+        if (isItemConfig(item2)) {
+          this.appendConfigItem(menuEl, item2, { panel }, group, close, renderers);
+          continue;
+        }
+        const el = this.buildBuiltInTabItem(item2, panel, group, close);
+        if (el) menuEl.appendChild(el);
       }
-      const el = this.buildBuiltInTabItem(item2, panel, group, close);
-      if (el) menuEl.appendChild(el);
+    } catch (err) {
+      renderers.dispose();
+      throw err;
     }
     popupService.openPopover(menuEl, {
       x: event2.clientX,
       y: event2.clientY,
       zIndex: popoverZIndexFor(event2.target, group)
-    });
+    }, { onClose: () => renderers.dispose() });
   }
   showForChip(tabGroup, group, event2) {
     if (!this.accessor.options.getTabGroupChipContextMenuItems) return;
@@ -67400,22 +67534,28 @@ var ContextMenuController = class {
     event2.preventDefault();
     const popupService = this.accessor.getPopupServiceForGroup(group);
     const close = () => popupService.close();
+    const renderers = new CompositeDisposable();
     const menuEl = document.createElement("div");
     menuEl.className = "dv-context-menu";
     menuEl.setAttribute("role", "menu");
-    for (const item2 of items) if (item2 === "separator") menuEl.appendChild(buildSeparator());
-    else if (item2 === "rename") menuEl.appendChild(buildRenameInput(tabGroup));
-    else if (item2 === "colorPicker") menuEl.appendChild(buildColorPicker(tabGroup, this.accessor.tabGroupColorPalette));
-    else if (item2 === "collapse") menuEl.appendChild(this.buildCollapseItem(tabGroup, close));
-    else if (item2 === "close") menuEl.appendChild(buildItem("Close All", close, () => {
-      group.panels.filter((p17) => tabGroup.containsPanel(p17.id)).forEach((p17) => p17.api.close());
-    }));
-    else if (isItemConfig(item2)) this.appendConfigItem(menuEl, item2, { tabGroup }, group, close);
+    try {
+      for (const item2 of items) if (item2 === "separator") menuEl.appendChild(buildSeparator());
+      else if (item2 === "rename") menuEl.appendChild(buildRenameInput(tabGroup));
+      else if (item2 === "colorPicker") menuEl.appendChild(buildColorPicker(tabGroup, this.accessor.tabGroupColorPalette));
+      else if (item2 === "collapse") menuEl.appendChild(this.buildCollapseItem(tabGroup, close));
+      else if (item2 === "close") menuEl.appendChild(buildItem("Close All", close, () => {
+        group.panels.filter((p17) => tabGroup.containsPanel(p17.id)).forEach((p17) => p17.api.close());
+      }));
+      else if (isItemConfig(item2)) this.appendConfigItem(menuEl, item2, { tabGroup }, group, close, renderers);
+    } catch (err) {
+      renderers.dispose();
+      throw err;
+    }
     popupService.openPopover(menuEl, {
       x: event2.clientX,
       y: event2.clientY,
       zIndex: popoverZIndexFor(event2.target, group)
-    });
+    }, { onClose: () => renderers.dispose() });
   }
 };
 var ContextMenuModule = defineModule({
@@ -67633,6 +67773,7 @@ var OverlayRenderContainer = class extends CompositeDisposable {
     const observerDisposable = new MutableDisposable();
     const correctLayerPosition = () => {
       if (panel.api.location.type === "floating") queueMicrotask(() => {
+        if (disposable.isDisposed) return;
         const floatingGroup = this.accessor.getFloatingWindowForGroup(panel.api.group);
         if (!floatingGroup) return;
         const element2 = floatingGroup.overlay.element;
@@ -67831,7 +67972,7 @@ var PopupService = class extends CompositeDisposable {
     newRoot.prepend(this._element);
     this._root = newRoot;
   }
-  openPopover(element2, position) {
+  openPopover(element2, position, options) {
     var _position$zIndex;
     this.close();
     const wrapper = this._window.document.createElement("div");
@@ -67846,14 +67987,14 @@ var PopupService = class extends CompositeDisposable {
     this._element.appendChild(wrapper);
     this._active = wrapper;
     const POINTERDOWN_GRACE_MS = 200;
-    this._activeDisposable.value = createDismissableLayer({
+    this._activeDisposable.value = new CompositeDisposable(createDismissableLayer({
       window: this._window,
       onDismiss: () => this.close(),
       elements: () => this._active ? [this._active] : [],
       keys: ["Enter"],
       pointerDownGraceMs: POINTERDOWN_GRACE_MS,
       resize: true
-    });
+    }), (options === null || options === void 0 ? void 0 : options.onClose) ? Disposable.from(options.onClose) : Disposable.NONE);
     this._window.requestAnimationFrame(() => {
       shiftAbsoluteElementIntoView(wrapper, this._root);
     });
@@ -69142,7 +69283,9 @@ var DockviewComponent = class extends BaseGrid {
     this._onWillDrop = new Emitter2();
     this.onWillDrop = this._onWillDrop.event;
     this._mutationDepth = 0;
+    this._syncMutationDepth = 0;
     this._pendingLocationChanges = /* @__PURE__ */ new Map();
+    this._openingPopoutWindows = /* @__PURE__ */ new Set();
     this._origin = "user";
     this._originDepth = 0;
     this._onWillMutateLayout = new Emitter2();
@@ -69226,6 +69369,10 @@ var DockviewComponent = class extends BaseGrid {
       });
     }));
     this.popupService = new PopupService(this.element);
+    this.addDisposables(this.popupService, Disposable.from(() => {
+      for (const opening2 of this._openingPopoutWindows) opening2.dispose();
+      this._openingPopoutWindows.clear();
+    }));
     this._api = new DockviewApi(this);
     this.disableResizing = true;
     this.element.remove();
@@ -69370,9 +69517,15 @@ var DockviewComponent = class extends BaseGrid {
     const popoutWindowDisposable = new CompositeDisposable(_window, _window.onDidClose(() => {
       popoutWindowDisposable.dispose();
     }));
+    this._openingPopoutWindows.add(popoutWindowDisposable);
     const openError = getPopoutUrlError(popoutUrl);
     return (openError ? Promise.resolve(null) : _window.open()).then((popoutContainer) => {
       var _options$referenceGro, _options$overridePopo4;
+      this._openingPopoutWindows.delete(popoutWindowDisposable);
+      if (this.isDisposed) {
+        popoutWindowDisposable.dispose();
+        return false;
+      }
       if (_window.isDisposed) {
         const failure2 = _window.failure;
         if (failure2 && !this.isDisposed) {
@@ -69556,6 +69709,7 @@ var DockviewComponent = class extends BaseGrid {
       for (const { panel, from } of movedPanels) this.fireDidMovePanel(panel, from);
       return true;
     }).catch((err) => {
+      this._openingPopoutWindows.delete(popoutWindowDisposable);
       console.error("dockview: failed to create popout.", err);
       return false;
     });
@@ -70079,6 +70233,7 @@ var DockviewComponent = class extends BaseGrid {
       group.dispose();
       this._groups.delete(group.id);
       this._onDidRemoveGroup.fire(group);
+      this.activateFallbackGroupIfRemoved(group);
     });
   }
   setEdgeGroupCollapsed(group, collapsed) {
@@ -70251,10 +70406,12 @@ var DockviewComponent = class extends BaseGrid {
         const record = this._groups.get(temporaryGroup.api.id);
         this._groups.delete(temporaryGroup.api.id);
         temporaryGroupDisposables.push(Disposable.from(() => {
+          var _this$headerActionsSe2;
           this.movingLock(() => {
             for (const panel of temporaryGroup.panels.slice()) temporaryGroup.model.removePanel(panel);
           });
           record === null || record === void 0 || record.disposable.dispose();
+          (_this$headerActionsSe2 = this.headerActionsService) === null || _this$headerActionsSe2 === void 0 || _this$headerActionsSe2.disposeGroup(temporaryGroup);
           temporaryGroup.dispose();
         }));
         return temporaryGroup;
@@ -70873,9 +71030,12 @@ var DockviewComponent = class extends BaseGrid {
   */
   mutation(kind, func) {
     const close = this.openMutation(kind);
+    this._syncMutationDepth++;
     try {
       return func();
     } finally {
+      this._syncMutationDepth--;
+      if (this._syncMutationDepth === 0) this.releaseDisposedActiveGroup();
       close();
     }
   }
@@ -70922,6 +71082,7 @@ var DockviewComponent = class extends BaseGrid {
     return () => {
       this._mutationDepth--;
       if (this._mutationDepth === 0) {
+        this.releaseDisposedActiveGroup();
         this.flushLocationChanges();
         this._onDidMutateLayout.fire({
           kind,
@@ -70930,6 +71091,11 @@ var DockviewComponent = class extends BaseGrid {
       }
     };
   }
+  /** Covers removals with `skipActive` that disposed the active group. */
+  releaseDisposedActiveGroup() {
+    var _this$_activeGroup;
+    if (!this.isDisposed && ((_this$_activeGroup = this._activeGroup) === null || _this$_activeGroup === void 0 ? void 0 : _this$_activeGroup.model.isDisposed)) this.activateFallbackGroupIfRemoved(this._activeGroup);
+  }
   /**
   * Coalesce a panel's `onDidLocationChange` to the end of the enclosing
   * transaction, or fire it immediately when no transaction is in flight.
@@ -71058,7 +71224,7 @@ var DockviewComponent = class extends BaseGrid {
         skipSetActiveGroup: true
       }));
       if (!removedPanel) throw new Error(`dockview: No panel with id ${sourceItemId}`);
-      if (!options.keepEmptyGroups && sourceGroup.model.size === 0) this.doRemoveGroup(sourceGroup, { skipActive: true });
+      if (!options.keepEmptyGroups && sourceGroup.model.size === 0 && sourceGroup !== destinationGroup) this.doRemoveGroup(sourceGroup, { skipActive: true });
       const isDestinationGroupEmpty = destinationGroup.model.size === 0;
       this.movingLock(() => {
         var _options$skipSetActiv;
@@ -71192,6 +71358,7 @@ var DockviewComponent = class extends BaseGrid {
     const from = options.from.group;
     const to = options.to.group;
     const target = options.to.position;
+    if (target === "center" && from === to) return;
     let source = from;
     let mergedPanels;
     if (target === "center") {
@@ -81176,7 +81343,7 @@ lit-html/static.js:
 dockview-core/dist/package/main.esm.mjs:
   (**
    * dockview-core
-   * @version 8.4.0
+   * @version 8.4.1
    * @link https://github.com/dockview/dockview
    * @license MIT
    *)