commit 261c9116af76218e9d0c4c7c426f7829b911421c
author Sean McCullough <banksean@gmail.com> Wed Jun 25 16:36:20 2025 -0700
committer Autoformatter <bot@sketch.dev> Wed Jun 25 23:45:45 2025 +0000
tree 5ad8adb42cad1357bd49a92bb64caa0b5e3e716a
parent a70dcc45ebdf79aba2a49f445caa96f40ce5a603

rm shadowRoot references from SketchAppShellBase

it no longer has a shadowRoot since it's using tailwind now.

webui/src/web-components/sketch-app-shell-base.ts

diff --git a/webui/src/web-components/sketch-app-shell-base.ts b/webui/src/web-components/sketch-app-shell-base.ts
index 595aa55..502b019 100644
--- a/webui/src/web-components/sketch-app-shell-base.ts
+++ b/webui/src/web-components/sketch-app-shell-base.ts
@@ -177,8 +177,7 @@
 
     // Get reference to the container status element
     setTimeout(() => {
-      this.containerStatusElement =
-        this.shadowRoot?.getElementById("container-status");
+      this.containerStatusElement = this.querySelector("#container-status");
     }, 0);
 
     // Initialize client-side nav history.
@@ -283,7 +282,7 @@
     // Only add view parameter if not in default chat view
     if (mode !== "chat") {
       url.searchParams.set("view", mode);
-      const diff2View = this.shadowRoot?.querySelector(
+      const diff2View = this.querySelector(
         "sketch-diff2-view",
       ) as SketchDiff2View;
 
@@ -343,7 +342,7 @@
     this.toggleViewMode("diff2", true);
 
     this.updateComplete.then(() => {
-      const diff2View = this.shadowRoot?.querySelector("sketch-diff2-view");
+      const diff2View = this.querySelector("sketch-diff2-view");
       if (diff2View) {
         (diff2View as SketchDiff2View).refreshDiffView();
       }
@@ -578,9 +577,7 @@
 
     // Update todo panel content if visible
     if (hasTodos) {
-      const todoPanel = this.shadowRoot?.querySelector(
-        "sketch-todo-panel",
-      ) as any;
+      const todoPanel = this.querySelector("sketch-todo-panel") as any;
       if (todoPanel && todoPanel.updateTodoContent) {
         todoPanel.updateTodoContent(latestTodoContent);
       }
@@ -752,7 +749,7 @@
   }
 
   async _handleMutlipleChoiceSelected(e: CustomEvent) {
-    const chatInput = this.shadowRoot?.querySelector(
+    const chatInput = this.querySelector(
       "sketch-chat-input",
     ) as SketchChatInput;
     if (chatInput) {
@@ -814,7 +811,7 @@
   private setupChatInputObserver(): void {
     // Wait for DOM to be ready
     this.updateComplete.then(() => {
-      const chatInputElement = this.shadowRoot?.querySelector("#chat-input");
+      const chatInputElement = this.querySelector("#chat-input");
       if (chatInputElement && !this.chatInputResizeObserver) {
         this.chatInputResizeObserver = new ResizeObserver((entries) => {
           for (const entry of entries) {