From 907f606b4325703909d1891d117dc297206f45a0 Mon Sep 17 00:00:00 2001
From: Alan Garny <agarny@hellix.com>
Date: Wed, 10 Jun 2026 14:20:51 +1200
Subject: [PATCH 1/3] New version.

---
 package.json              | 2 +-
 src/renderer/package.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 0f9ff2ff..bb501392 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,7 @@
     "url": "git+https://github.com/opencor/webapp.git"
   },
   "type": "module",
-  "version": "0.20260610.2",
+  "version": "0.20260610.3",
   "engines": {
     "bun": ">=1.2.0"
   },
diff --git a/src/renderer/package.json b/src/renderer/package.json
index 62f5a84f..da8ee026 100644
--- a/src/renderer/package.json
+++ b/src/renderer/package.json
@@ -42,7 +42,7 @@
     },
     "./style.css": "./dist/opencor.css"
   },
-  "version": "0.20260610.2",
+  "version": "0.20260610.3",
   "libopencorVersion": "0.20260604.0",
   "scripts": {
     "build": "vite build && bun scripts/generate.version.js",

From d11ffc2bd3f4c6ad6708987aa8dbeb6a4e3b1257 Mon Sep 17 00:00:00 2001
From: Alan Garny <agarny@hellix.com>
Date: Wed, 10 Jun 2026 16:22:41 +1200
Subject: [PATCH 2/3] Append Tippy tooltips to `.opencor`.

---
 src/renderer/src/components/OpenCOR.vue | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/renderer/src/components/OpenCOR.vue b/src/renderer/src/components/OpenCOR.vue
index e10edd08..5c5434cc 100644
--- a/src/renderer/src/components/OpenCOR.vue
+++ b/src/renderer/src/components/OpenCOR.vue
@@ -459,7 +459,16 @@ vue.watch(
       // VueTippy.
 
       if (crtVueAppInstance && crtGlobalProperties && !crtGlobalProperties[vueTippyInstalledFlag]) {
-        crtVueAppInstance.use(dependencies._vueTippy);
+        // Append Tippy tooltips to `.opencor` rather than `document.body` so that they stay within the component's
+        // stacking context. This is critical when OpenCOR is embedded as a Vue 3 component in a host app in full-screen
+        // mode (`document.body` can be hidden behind the host's full-screen container, whereas `.opencor` lives inside
+        // it).
+
+        crtVueAppInstance.use(dependencies._vueTippy, {
+          defaultProps: {
+            appendTo: () => document.querySelector('.opencor') || document.body
+          }
+        });
 
         crtGlobalProperties[vueTippyInstalledFlag] = true;
       }

From 610e05436f7d0ab03edbd4a34616c8f27fcaa918 Mon Sep 17 00:00:00 2001
From: Alan Garny <agarny@hellix.com>
Date: Wed, 10 Jun 2026 16:17:32 +1200
Subject: [PATCH 3/3] Make sure that overlays are appended to `.opencor`.

---
 src/renderer/src/common/vueCommon.ts            | 17 +++++++++++++++++
 .../SimulationExperimentViewSettingsDialog.vue  |  4 ++++
 .../views/SimulationExperimentView.vue          |  6 +++++-
 .../src/components/widgets/GraphPanelWidget.vue |  3 ++-
 .../src/components/widgets/InputWidget.vue      |  4 ++++
 5 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/renderer/src/common/vueCommon.ts b/src/renderer/src/common/vueCommon.ts
index b01f6bc2..4c55c2b9 100644
--- a/src/renderer/src/common/vueCommon.ts
+++ b/src/renderer/src/common/vueCommon.ts
@@ -99,3 +99,20 @@ export const trackElementHeight = (
 
   return stopTrackingElementHeight;
 };
+
+// A composable that provides the `.opencor` element as an append target for overlays.
+// Note: this is needed when OpenCOR is embedded as a Vue 3 component in a host app that uses full-screen mode. In such
+//       a case, the Fullscreen API only renders the full-screen element and its descendants, so teleporting to
+//       `document.body` makes overlays invisible. Instead, teleporting to `.opencor` means that overlays are visible in
+//       full-screen mode. And, since `.opencor` is a child of the full-screen element, they are also visible in normal
+//       mode.
+
+export const useAppendTarget = () => {
+  const appendTarget = vue.shallowRef<HTMLElement | undefined>(undefined);
+
+  vue.onMounted(() => {
+    appendTarget.value = (document.querySelector('.opencor') as HTMLElement | null) ?? undefined;
+  });
+
+  return appendTarget;
+};
diff --git a/src/renderer/src/components/dialogs/SimulationExperimentViewSettingsDialog.vue b/src/renderer/src/components/dialogs/SimulationExperimentViewSettingsDialog.vue
index 0eb84b9c..c89c1180 100644
--- a/src/renderer/src/components/dialogs/SimulationExperimentViewSettingsDialog.vue
+++ b/src/renderer/src/components/dialogs/SimulationExperimentViewSettingsDialog.vue
@@ -222,6 +222,7 @@
                                       optionValue="value"
                                       class="w-full"
                                       size="small"
+                                      :appendTo="issuesContainer"
                                     />
                                     <label>Type</label>
                                   </FloatLabel>
@@ -343,6 +344,7 @@
                                   size="small"
                                   filter filterMode="lenient"
                                   :options="editableModelParameters"
+                                  :appendTo="issuesContainer"
                                 />
                                 <label>Model parameter</label>
                               </FloatLabel>
@@ -417,6 +419,7 @@
                                   size="small"
                                   filter filterMode="lenient"
                                   :options="allModelParameters"
+                                  :appendTo="issuesContainer"
                                 />
                                 <label>Model parameter</label>
                               </FloatLabel>
@@ -562,6 +565,7 @@
                                         size="small"
                                         filter filterMode="lenient"
                                         :options="externalDataSeries(externalDataFile)"
+                                        :appendTo="issuesContainer"
                                       />
                                       <label>External data</label>
                                     </FloatLabel>
diff --git a/src/renderer/src/components/views/SimulationExperimentView.vue b/src/renderer/src/components/views/SimulationExperimentView.vue
index 9923a4bf..e4ee36a4 100644
--- a/src/renderer/src/components/views/SimulationExperimentView.vue
+++ b/src/renderer/src/components/views/SimulationExperimentView.vue
@@ -61,6 +61,7 @@
                     :options="standardParameters"
                     size="small"
                     class="w-full"
+                    :appendTo="appendTarget"
                     @change="updatePlot()"
                   />
                 </Fieldset>
@@ -73,6 +74,7 @@
                     :options="standardParameters"
                     size="small"
                     class="w-full"
+                    :appendTo="appendTarget"
                     @change="updatePlot()"
                   />
                 </Fieldset>
@@ -234,7 +236,7 @@
       @ok="onInteractiveSettingsOk"
       @close="interactiveSettingsVisible = false"
     />
-    <Popover ref="interactiveRunColorPopoverRef" appendTo="self">
+    <Popover ref="interactiveRunColorPopoverRef" :appendTo="appendTarget">
       <div class="flex gap-2">
         <button class="color-swatch cursor-pointer w-6 h-6 outline-2 outline-transparent rounded-md hover:scale-[1.15]"
           v-for="(name, color) in colors.PALETTE" :key="color"
@@ -260,6 +262,7 @@ import type { IOpenCORExternalDataEvent, IOpenCORSimulationDataEvent } from '../
 import * as colors from '../../common/colors';
 import * as common from '../../common/common';
 import * as dependencies from '../../common/dependencies';
+import * as vueCommon from '../../common/vueCommon';
 import * as externalData from '../../common/externalData';
 import * as locCommon from '../../common/locCommon';
 import * as locApi from '../../libopencor/locApi';
@@ -612,6 +615,7 @@ let interactiveTrackedRunId = 0;
 const interactiveRunColorPopoverIndex = vue.ref<number>(-1);
 const interactiveRunColorPopoverRef = vue.ref<InstanceType<typeof Popover> | undefined>();
 const interactiveGraphPanelRefs = vue.ref<Record<number, InstanceType<typeof GraphPanelWidget> | undefined>>({});
+const appendTarget = vueCommon.useAppendTarget();
 const interactiveCompData = vue.computed<IGraphPanelData[]>(() => {
   // Combine the live data with the data from the tracked runs.
 
diff --git a/src/renderer/src/components/widgets/GraphPanelWidget.vue b/src/renderer/src/components/widgets/GraphPanelWidget.vue
index b1e506f1..9bae973b 100644
--- a/src/renderer/src/components/widgets/GraphPanelWidget.vue
+++ b/src/renderer/src/components/widgets/GraphPanelWidget.vue
@@ -2,7 +2,7 @@
   <div class="flex flex-row h-full">
     <div v-if="showMarker" class="w-0.75 bg-primary" />
     <div ref="mainDivRef" class="grow h-full" @contextmenu="onContextMenu" />
-    <ContextMenu ref="contextMenuRef" :model="contextMenuItems" />
+    <ContextMenu ref="contextMenuRef" :model="contextMenuItems" :appendTo="appendTarget" />
   </div>
 </template>
 
@@ -127,6 +127,7 @@ const mainDivRef = vue.ref<HTMLElement | null>(null);
 const margins = vue.ref<IGraphPanelMargins>({ left: -1, right: -1 });
 const theme = vueCommon.useTheme();
 const contextMenuRef = vue.ref<InstanceType<typeof ContextMenu> | null>(null);
+const appendTarget = vueCommon.useAppendTarget();
 const progressMessage = vue.inject<IProgressMessage>('progressMessage');
 let updatingMargins = false;
 let plotIsReady = false;
diff --git a/src/renderer/src/components/widgets/InputWidget.vue b/src/renderer/src/components/widgets/InputWidget.vue
index 2cc5d09e..f3ef4821 100644
--- a/src/renderer/src/components/widgets/InputWidget.vue
+++ b/src/renderer/src/components/widgets/InputWidget.vue
@@ -6,6 +6,7 @@
         :options="possibleValues"
         optionLabel="name"
         @change="selectChange"
+        :appendTo="appendTarget"
         class="w-full"
         size="small"
       />
@@ -32,6 +33,7 @@
 <script setup lang="ts">
 import * as vue from 'vue';
 
+import * as vueCommon from '../../common/vueCommon';
 import type * as locApi from '../../libopencor/locApi';
 
 const value = defineModel<number>({ required: true });
@@ -50,6 +52,8 @@ let oldValue = value.value;
 const discreteValue = vue.ref<locApi.IUiJsonDiscreteInputPossibleValue | undefined>(
   props.possibleValues?.find((possibleValue) => possibleValue.value === value.value)
 );
+const appendTarget = vueCommon.useAppendTarget();
+
 const compStepValue = vue.computed<number>(() => {
   if (props.stepValue !== undefined) {
     return props.stepValue;