From 5e25f86a0bc6261b1367be5504b1384780135a58 Mon Sep 17 00:00:00 2001
From: Juergen Kunz <juergen@foss.global>
Date: Mon, 14 Jul 2025 18:14:40 +0000
Subject: [PATCH] update

---
 ts_web/elements/sio-fab.ts        | 20 ++++++++++++++++----
 ts_web/elements/sio-pdf-viewer.ts | 14 +++++++++-----
 2 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/ts_web/elements/sio-fab.ts b/ts_web/elements/sio-fab.ts
index 45d1864..c5c041d 100644
--- a/ts_web/elements/sio-fab.ts
+++ b/ts_web/elements/sio-fab.ts
@@ -260,14 +260,26 @@ export class SioFab extends DeesElement {
   public async firstUpdated(args: any) {
     super.firstUpdated(args);
     const domtools = await this.domtoolsPromise;
-    const sioCombox: SioCombox = this.shadowRoot.querySelector('sio-combox');
-    const mainBox: HTMLElement = this.shadowRoot.querySelector('#mainbox');
-    sioCombox.referenceObject = mainBox;
-
+    
+    // Set up keyboard shortcut
     domtools.keyboard
       .on([domtools.keyboard.keyEnum.Ctrl, domtools.keyboard.keyEnum.S])
       .subscribe(() => {
         this.toggleCombox();
       });
   }
+  
+  public async updated(changedProperties: Map<string | number | symbol, unknown>) {
+    await super.updated(changedProperties);
+    
+    // Set reference object when combox is rendered
+    if ((changedProperties.has('showCombox') || changedProperties.has('hasShownOnce')) && 
+        (this.showCombox || this.hasShownOnce)) {
+      const sioCombox: SioCombox = this.shadowRoot.querySelector('sio-combox');
+      const mainBox: HTMLElement = this.shadowRoot.querySelector('#mainbox');
+      if (sioCombox && mainBox && !sioCombox.referenceObject) {
+        sioCombox.referenceObject = mainBox;
+      }
+    }
+  }
 }
diff --git a/ts_web/elements/sio-pdf-viewer.ts b/ts_web/elements/sio-pdf-viewer.ts
index 657e00d..fee8b33 100644
--- a/ts_web/elements/sio-pdf-viewer.ts
+++ b/ts_web/elements/sio-pdf-viewer.ts
@@ -393,7 +393,15 @@ export class SioPdfViewer extends DeesElement {
   public async connectedCallback() {
     await super.connectedCallback();
     
-    // Set up resize observer for responsive rendering
+    if (this.url) {
+      await this.loadPdf();
+    }
+  }
+  
+  protected async firstUpdated() {
+    await super.firstUpdated();
+    
+    // Set up resize observer for responsive rendering after first render
     const container = this.shadowRoot?.querySelector('.pdf-container');
     if (container) {
       this.resizeObserver = new ResizeObserver(() => {
@@ -403,10 +411,6 @@ export class SioPdfViewer extends DeesElement {
       });
       this.resizeObserver.observe(container);
     }
-    
-    if (this.url) {
-      await this.loadPdf();
-    }
   }
 
   public async updated(changedProperties: Map<string | number | symbol, unknown>) {