@usecrow/ui 0.1.66 → 0.1.67

package/dist/index.cjs

@@ -1638,6 +1638,12 @@ function useWidgetStyles({
   const [selectedModel, setSelectedModel] = React3.useState(
     styleCache.get(key)?.model ?? void 0
   );
+  const [modelSelectionEnabled, setModelSelectionEnabled] = React3.useState(
+    styleCache.get(key)?.modelSelectionEnabled || false
+  );
+  const [availableModels, setAvailableModels] = React3.useState(
+    styleCache.get(key)?.availableModels || []
+  );
   const hasFetchedRef = React3.useRef(false);
   const fetchStyles = async () => {
     if (skip) return;
@@ -1657,6 +1663,8 @@ function useWidgetStyles({
       setSelectedModel(config.model ?? void 0);
       setInitialSuggestions(config.initialSuggestions || []);
       setToolConsentSettings(config.toolConsentSettings || {});
+      setModelSelectionEnabled(config.modelSelectionEnabled || false);
+      setAvailableModels(config.availableModels || []);
     } catch (err) {
       console.error("[CrowWidget] Failed to fetch styles:", err);
       setError(err instanceof Error ? err : new Error(String(err)));
@@ -1675,6 +1683,8 @@ function useWidgetStyles({
       setPersistAnonymousConversations(cached.persistAnonymousConversations ?? true);
       setWelcomeMessage(cached.welcomeMessage ?? void 0);
       setSelectedModel(cached.model ?? void 0);
+      setModelSelectionEnabled(cached.modelSelectionEnabled || false);
+      setAvailableModels(cached.availableModels || []);
       setIsLoading(false);
       return;
     }
@@ -1696,6 +1706,8 @@ function useWidgetStyles({
     selectedModel,
     initialSuggestions,
     toolConsentSettings,
+    modelSelectionEnabled,
+    availableModels,
     refetch: fetchStyles
   };
 }
@@ -1735,6 +1747,12 @@ function useCopilotStyles({
   const [toolConsentSettings, setToolConsentSettings] = React3.useState(
     styleCache.get(key)?.toolConsentSettings || {}
   );
+  const [modelSelectionEnabled, setModelSelectionEnabled] = React3.useState(
+    styleCache.get(key)?.modelSelectionEnabled || false
+  );
+  const [availableModels, setAvailableModels] = React3.useState(
+    styleCache.get(key)?.availableModels || []
+  );
   const hasFetchedRef = React3.useRef(false);
   const fetchStyles = async () => {
     if (skip) return;
@@ -1752,6 +1770,8 @@ function useCopilotStyles({
       setWelcomeMessage(config.welcomeMessage ?? void 0);
       setSelectedModel(config.model ?? void 0);
       setToolConsentSettings(config.toolConsentSettings || {});
+      setModelSelectionEnabled(config.modelSelectionEnabled || false);
+      setAvailableModels(config.availableModels || []);
     } catch (err) {
       console.error("[CrowCopilot] Failed to fetch styles:", err);
       setError(err instanceof Error ? err : new Error(String(err)));
@@ -1771,6 +1791,8 @@ function useCopilotStyles({
       setPersistAnonymousConversations(cached.persistAnonymousConversations ?? true);
       setWelcomeMessage(cached.welcomeMessage ?? void 0);
       setSelectedModel(cached.model ?? void 0);
+      setModelSelectionEnabled(cached.modelSelectionEnabled || false);
+      setAvailableModels(cached.availableModels || []);
       setIsLoading(false);
       return;
     }
@@ -1790,6 +1812,8 @@ function useCopilotStyles({
     welcomeMessage,
     selectedModel,
     toolConsentSettings,
+    modelSelectionEnabled,
+    availableModels,
     refetch: fetchStyles
   };
 }
@@ -3231,7 +3255,9 @@ var ModelSelector = ({
   const dropdownRef = React3.useRef(null);
   React3.useEffect(() => {
     const handleClickOutside = (event) => {
-      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
+      if (!dropdownRef.current) return;
+      const path = event.composedPath();
+      if (!path.includes(dropdownRef.current)) {
         setIsOpen(false);
       }
     };
@@ -4216,7 +4242,9 @@ function CrowWidget({
     welcomeMessage: welcomeMessageFromAPI,
     selectedModel: selectedModelFromAPI,
     initialSuggestions,
-    toolConsentSettings
+    toolConsentSettings,
+    modelSelectionEnabled,
+    availableModels: availableModelsFromAPI
   } = useWidgetStyles({
     productId,
     apiUrl,
@@ -4813,7 +4841,10 @@ function CrowWidget({
           showStopButton: isBrowserUseActive || !!askUserResolver || !!pendingConfirmation,
           highlighted: !!askUserResolver,
           className: "crow-backdrop-blur-md",
-          backendUrl: apiUrl
+          backendUrl: apiUrl,
+          selectedModel: chat.selectedModel || selectedModelFromAPI,
+          onModelChange: chat.setSelectedModel,
+          availableModels: modelSelectionEnabled ? availableModelsFromAPI : []
         }
       )
     ] })
@@ -5148,7 +5179,9 @@ function CrowCopilot({
     persistAnonymousConversations,
     welcomeMessage: welcomeMessageFromAPI,
     selectedModel,
-    toolConsentSettings
+    toolConsentSettings,
+    modelSelectionEnabled,
+    availableModels: availableModelsFromAPI
   } = useCopilotStyles({
     productId,
     apiUrl,
@@ -6113,7 +6146,10 @@ function CrowCopilot({
                       onSend: handleSend,
                       onStop: handleStop,
                       placeholder: "Ask anything...",
-                      isLoading: chat.isLoading
+                      isLoading: chat.isLoading,
+                      selectedModel: chat.selectedModel || selectedModel,
+                      onModelChange: chat.setSelectedModel,
+                      availableModels: modelSelectionEnabled ? availableModelsFromAPI : []
                     }
                   )
                 ]