Fixed an issue with overlays and teleport

package.json

@@ -23,7 +23,7 @@
     "url": "git+https://github.com/opencor/webapp.git"
   },
   "type": "module",
-  "version": "0.20260612.0",
+  "version": "0.20260612.1",
   "engines": {
     "bun": ">=1.2.0"
   },
@@ -81,7 +81,7 @@
     "electron-conf": "^1.3.0",
     "electron-updater": "^6.8.9",
     "electron-vite": "^5.0.0",
-    "esbuild": "^0.28.0",
+    "esbuild": "^0.28.1",
     "node-addon-api": "^8.8.0",
     "postcss": "^8.5.15",
     "rollup-plugin-visualizer": "^7.0.1",

src/renderer/package.json

@@ -42,7 +42,7 @@
     },
     "./style.css": "./dist/opencor.css"
   },
-  "version": "0.20260612.0",
+  "version": "0.20260612.1",
   "libopencorVersion": "0.20260604.0",
   "scripts": {
     "build": "vite build && bun scripts/generate.version.js",
@@ -84,7 +84,7 @@
     "@vitejs/plugin-vue": "^6.0.7",
     "@vue/tsconfig": "^0.9.1",
     "autoprefixer": "^10.5.0",
-    "esbuild": "^0.28.0",
+    "esbuild": "^0.28.1",
     "postcss": "^8.5.15",
     "rollup-plugin-visualizer": "^7.0.1",
     "stylelint": "^17.13.0",

src/renderer/src/common/vueCommon.ts

@@ -116,7 +116,14 @@ export const useAppendTarget = () => {
   const containerClass = 'opencor-overlay-container';
 
   vue.onMounted(() => {
-    const opencor = document.querySelector('.opencor');
+    // Find the closest .opencor ancestor so that each OpenCOR instance gets its own overlay container. This ensures
+    // that in a multi-instance setup, each instance's overlays stay within its own DOM tree. Falls back to
+    // document.querySelector for backward compatibility (e.g., when called outside a component setup function or when
+    // getCurrentInstance() returns null).
+
+    const instance = vue.getCurrentInstance();
+    const rootEl = instance?.vnode?.el;
+    const opencor = rootEl instanceof Element ? rootEl.closest('.opencor') : document.querySelector('.opencor');
 
     if (opencor) {
       let overlayContainer = opencor.querySelector(`.${containerClass}`) as HTMLElement | null;

src/renderer/src/components/views/SimulationExperimentView.vue

@@ -1755,8 +1755,8 @@ const onTrackRun = (): void => {
     }
 
     tooltipRows.push(`<tr>
-      <td>
-        <strong>${input.name}:</strong>
+      <td style="vertical-align: top; font-weight: bold;">
+        ${input.name}:
       </td>
       <td style="padding-left: 8px;">
         ${inputValue}

src/renderer/src/components/widgets/TooltipWidget.vue

@@ -36,6 +36,7 @@ const onMouseLeave = () => {
 
 <style scoped>
 .tooltip {
+  width: max-content;
   max-width: 20rem;
   font-size: 0.8rem;
 }