vanilla-agent 1.16.0 → 1.18.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vanilla-agent",
-  "version": "1.16.0",
+  "version": "1.18.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/ui.ts

@@ -139,7 +139,8 @@ export const createAgentExperience = (
   }
 
   let config = mergeWithDefaults(initialConfig) as AgentWidgetConfig;
-  applyThemeVariables(mount, config);
+  // Note: applyThemeVariables is called after applyFullHeightStyles() below
+  // because applyFullHeightStyles resets mount.style.cssText
 
   // Get plugins for this instance
   const plugins = pluginRegistry.getForInstance(config.plugins);
@@ -445,10 +446,10 @@ export const createAgentExperience = (
     container.style.border = panelBorder;
     container.style.borderRadius = panelBorderRadius;
     
+    // Check if this is inline embed mode (launcher disabled) vs launcher mode
+    const isInlineEmbed = config.launcher?.enabled === false;
+    
     if (fullHeight) {
-      // Check if this is inline embed mode (launcher disabled) vs launcher mode
-      const isInlineEmbed = config.launcher?.enabled === false;
-      
       // Mount container
       mount.style.display = 'flex';
       mount.style.flexDirection = 'column';
@@ -501,8 +502,8 @@ export const createAgentExperience = (
       'tvw-bottom-4', 'tvw-right-4', 'tvw-left-4', 'tvw-top-4'
     );
     
-    if (!sidebarMode) {
-      // Restore positioning classes when not in sidebar mode
+    if (!sidebarMode && !isInlineEmbed) {
+      // Restore positioning classes when not in sidebar mode (launcher mode only)
       const positionClasses = positionMap[position as keyof typeof positionMap] ?? positionMap['bottom-right'];
       positionClasses.split(' ').forEach(cls => wrapper.classList.add(cls));
     }
@@ -573,11 +574,16 @@ export const createAgentExperience = (
     // Apply max-height constraints to wrapper to prevent expanding past viewport top
     // Use both -moz-available (Firefox) and stretch (standard) for cross-browser support
     // Append to cssText to allow multiple fallback values for the same property
-    const maxHeightStyles = 'max-height: -moz-available !important; max-height: stretch !important;';
-    const paddingStyles = sidebarMode ? '' : 'padding-top: 1.25em !important;';
-    wrapper.style.cssText += maxHeightStyles + paddingStyles;
+    // Only apply to launcher mode (not sidebar or inline embed)
+    if (!isInlineEmbed) {
+      const maxHeightStyles = 'max-height: -moz-available !important; max-height: stretch !important;';
+      const paddingStyles = sidebarMode ? '' : 'padding-top: 1.25em !important;';
+      wrapper.style.cssText += maxHeightStyles + paddingStyles;
+    }
   };
   applyFullHeightStyles();
+  // Apply theme variables after applyFullHeightStyles since it resets mount.style.cssText
+  applyThemeVariables(mount, config);
 
   const destroyCallbacks: Array<() => void> = [];
   const suggestionsManager = createSuggestions(suggestions);
@@ -1736,8 +1742,9 @@ export const createAgentExperience = (
     update(nextConfig: AgentWidgetConfig) {
       const previousToolCallConfig = config.toolCall;
       config = { ...config, ...nextConfig };
-      applyThemeVariables(mount, config);
+      // applyFullHeightStyles resets mount.style.cssText, so call it before applyThemeVariables
       applyFullHeightStyles();
+      applyThemeVariables(mount, config);
 
       // Update plugins
       const newPlugins = pluginRegistry.getForInstance(config.plugins);