vanilla-agent 1.18.0 → 1.20.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vanilla-agent",
-  "version": "1.18.0",
+  "version": "1.20.0",
   "description": "Themeable, plugable streaming agent widget for websites, in plain JS with support for voice input and reasoning / tool output.",
   "type": "module",
   "main": "dist/index.cjs",

package/src/components/panel.ts

@@ -18,12 +18,18 @@ export const createWrapper = (config?: AgentWidgetConfig): PanelWrapper => {
     // and only the chat messages area scrolls
     const wrapper = createElement(
       "div",
-      "tvw-relative tvw-w-full tvw-h-full tvw-flex tvw-flex-col tvw-flex-1 tvw-min-h-0"
+      "tvw-relative tvw-h-full tvw-flex tvw-flex-col tvw-flex-1 tvw-min-h-0"
     );
     const panel = createElement(
       "div",
-      "tvw-relative tvw-w-full tvw-flex-1 tvw-flex tvw-flex-col tvw-min-h-0"
+      "tvw-relative tvw-flex-1 tvw-flex tvw-flex-col tvw-min-h-0"
     );
+    
+    // Apply width from config, defaulting to 100% for inline embed mode
+    const inlineWidth = config?.launcher?.width ?? "100%";
+    wrapper.style.width = inlineWidth;
+    panel.style.width = "100%";
+    
     wrapper.appendChild(panel);
     return { wrapper, panel };
   }

package/src/defaults.ts

@@ -48,6 +48,7 @@ export const DEFAULT_WIDGET_CONFIG: Partial<AgentWidgetConfig> = {
     agentIconText: "💬",
     position: "bottom-right",
     width: "min(400px, calc(100vw - 24px))",
+    heightOffset: 0,
     autoExpand: false,
     callToActionIconHidden: false,
     agentIconSize: "40px",

package/src/runtime/init.ts

@@ -94,12 +94,9 @@ export const initAgentWidget = (
   host.className = "vanilla-agent-host";
   
   // When launcher is disabled (inline embed mode), ensure the host fills its container
-  // This allows the widget to respect the parent container's height
   const launcherEnabled = options.config?.launcher?.enabled ?? true;
   if (!launcherEnabled) {
     host.style.height = "100%";
-    host.style.display = "flex";
-    host.style.flexDirection = "column";
   }
   
   target.appendChild(host);

package/src/types.ts

@@ -217,6 +217,14 @@ export type AgentWidgetLauncherConfig = {
    * @default "420px"
    */
   sidebarWidth?: string;
+  /**
+   * Offset (in pixels) to subtract from the calculated panel height.
+   * Useful for adjusting the panel height when there are other fixed elements on the page.
+   * Only applies when not in fullHeight or sidebarMode.
+   * 
+   * @default 0
+   */
+  heightOffset?: number;
   callToActionIconText?: string;
   callToActionIconName?: string;
   callToActionIconColor?: string;

package/src/ui.ts

@@ -1592,9 +1592,11 @@ export const createAgentExperience = (
     if (!fullHeight) {
       const viewportHeight = window.innerHeight;
       const verticalMargin = 64; // leave space for launcher's offset
+      const heightOffset = config.launcher?.heightOffset ?? 0;
       const available = Math.max(200, viewportHeight - verticalMargin);
       const clamped = Math.min(640, available);
-      panel.style.height = `${clamped}px`;
+      const finalHeight = Math.max(200, clamped - heightOffset);
+      panel.style.height = `${finalHeight}px`;
     }
   };