webui: Improve dx
For local development, switch to Vite and update web components for improved demo experience. Note that we haven't changed how we bundle when we're actually running in sketch; that's still the go/esbuild in-memory setup. This just changes demo dev setup to get breakpoints working and a functioning full sketch-app-shell.
We still need to add some mock data, but this is a start
- Introduced `vite.config.mts` for Vite setup with hot module reloading.
- Updated `package.json` and `package-lock.json` to include Vite and related plugins.
- Refactored demo scripts to utilize Vite for local development.
- Created `launch.json` for VSCode debugging configuration.
- Enhanced `Makefile` with a new demo task.
- Improved styling and structure in demo HTML and CSS files.
- Implemented `aggregateAgentMessages` function for message handling in web components.
diff --git a/loop/webui/src/web-components/sketch-chat-input.ts b/loop/webui/src/web-components/sketch-chat-input.ts
index c181724..d5ec75e 100644
--- a/loop/webui/src/web-components/sketch-chat-input.ts
+++ b/loop/webui/src/web-components/sketch-chat-input.ts
@@ -79,7 +79,7 @@
// Update the textarea value directly, otherwise it won't update until next render
const textarea = this.shadowRoot?.querySelector(
- "#chatInput",
+ "#chatInput"
) as HTMLTextAreaElement;
if (textarea) {
textarea.value = content;
@@ -96,7 +96,7 @@
// Listen for update-content events
this.addEventListener(
"update-content",
- this._handleUpdateContent as EventListener,
+ this._handleUpdateContent as EventListener
);
}
@@ -107,7 +107,7 @@
// Remove event listeners
this.removeEventListener(
"update-content",
- this._handleUpdateContent as EventListener,
+ this._handleUpdateContent as EventListener
);
}