@usecrow/ui 0.1.66 → 0.1.67

package/dist/index.d.cts

@@ -207,6 +207,14 @@ interface WidgetConfigResponse {
     toolConsentSettings?: Record<string, {
         requires_consent: boolean;
     }>;
+    /** Whether end-user model selection is enabled */
+    modelSelectionEnabled?: boolean;
+    /** Available models for end-user selection (model IDs + display info) */
+    availableModels?: Array<{
+        id: string;
+        name: string;
+        provider: "OpenAI" | "Anthropic";
+    }>;
 }
 
 /**
@@ -863,6 +871,14 @@ interface UseWidgetStylesResult {
     toolConsentSettings: Record<string, {
         requires_consent: boolean;
     }>;
+    /** Whether end-user model selection is enabled */
+    modelSelectionEnabled: boolean;
+    /** Available models for the dropdown */
+    availableModels: Array<{
+        id: string;
+        name: string;
+        provider: "OpenAI" | "Anthropic";
+    }>;
     /** Refetch styles from API */
     refetch: () => Promise<void>;
 }
@@ -910,6 +926,14 @@ interface UseCopilotStylesResult {
     toolConsentSettings: Record<string, {
         requires_consent: boolean;
     }>;
+    /** Whether end-user model selection is enabled */
+    modelSelectionEnabled: boolean;
+    /** Available models for the dropdown */
+    availableModels: Array<{
+        id: string;
+        name: string;
+        provider: "OpenAI" | "Anthropic";
+    }>;
     /** Refetch styles from API */
     refetch: () => Promise<void>;
 }

package/dist/index.d.ts

@@ -207,6 +207,14 @@ interface WidgetConfigResponse {
     toolConsentSettings?: Record<string, {
         requires_consent: boolean;
     }>;
+    /** Whether end-user model selection is enabled */
+    modelSelectionEnabled?: boolean;
+    /** Available models for end-user selection (model IDs + display info) */
+    availableModels?: Array<{
+        id: string;
+        name: string;
+        provider: "OpenAI" | "Anthropic";
+    }>;
 }
 
 /**
@@ -863,6 +871,14 @@ interface UseWidgetStylesResult {
     toolConsentSettings: Record<string, {
         requires_consent: boolean;
     }>;
+    /** Whether end-user model selection is enabled */
+    modelSelectionEnabled: boolean;
+    /** Available models for the dropdown */
+    availableModels: Array<{
+        id: string;
+        name: string;
+        provider: "OpenAI" | "Anthropic";
+    }>;
     /** Refetch styles from API */
     refetch: () => Promise<void>;
 }
@@ -910,6 +926,14 @@ interface UseCopilotStylesResult {
     toolConsentSettings: Record<string, {
         requires_consent: boolean;
     }>;
+    /** Whether end-user model selection is enabled */
+    modelSelectionEnabled: boolean;
+    /** Available models for the dropdown */
+    availableModels: Array<{
+        id: string;
+        name: string;
+        provider: "OpenAI" | "Anthropic";
+    }>;
     /** Refetch styles from API */
     refetch: () => Promise<void>;
 }

package/dist/index.js

@@ -1612,6 +1612,12 @@ function useWidgetStyles({
   const [selectedModel, setSelectedModel] = useState(
     styleCache.get(key)?.model ?? void 0
   );
+  const [modelSelectionEnabled, setModelSelectionEnabled] = useState(
+    styleCache.get(key)?.modelSelectionEnabled || false
+  );
+  const [availableModels, setAvailableModels] = useState(
+    styleCache.get(key)?.availableModels || []
+  );
   const hasFetchedRef = useRef(false);
   const fetchStyles = async () => {
     if (skip) return;
@@ -1631,6 +1637,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)));
@@ -1649,6 +1657,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;
     }
@@ -1670,6 +1680,8 @@ function useWidgetStyles({
     selectedModel,
     initialSuggestions,
     toolConsentSettings,
+    modelSelectionEnabled,
+    availableModels,
     refetch: fetchStyles
   };
 }
@@ -1709,6 +1721,12 @@ function useCopilotStyles({
   const [toolConsentSettings, setToolConsentSettings] = useState(
     styleCache.get(key)?.toolConsentSettings || {}
   );
+  const [modelSelectionEnabled, setModelSelectionEnabled] = useState(
+    styleCache.get(key)?.modelSelectionEnabled || false
+  );
+  const [availableModels, setAvailableModels] = useState(
+    styleCache.get(key)?.availableModels || []
+  );
   const hasFetchedRef = useRef(false);
   const fetchStyles = async () => {
     if (skip) return;
@@ -1726,6 +1744,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)));
@@ -1745,6 +1765,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;
     }
@@ -1764,6 +1786,8 @@ function useCopilotStyles({
     welcomeMessage,
     selectedModel,
     toolConsentSettings,
+    modelSelectionEnabled,
+    availableModels,
     refetch: fetchStyles
   };
 }
@@ -3205,7 +3229,9 @@ var ModelSelector = ({
   const dropdownRef = useRef(null);
   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);
       }
     };
@@ -4190,7 +4216,9 @@ function CrowWidget({
     welcomeMessage: welcomeMessageFromAPI,
     selectedModel: selectedModelFromAPI,
     initialSuggestions,
-    toolConsentSettings
+    toolConsentSettings,
+    modelSelectionEnabled,
+    availableModels: availableModelsFromAPI
   } = useWidgetStyles({
     productId,
     apiUrl,
@@ -4787,7 +4815,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 : []
         }
       )
     ] })
@@ -5122,7 +5153,9 @@ function CrowCopilot({
     persistAnonymousConversations,
     welcomeMessage: welcomeMessageFromAPI,
     selectedModel,
-    toolConsentSettings
+    toolConsentSettings,
+    modelSelectionEnabled,
+    availableModels: availableModelsFromAPI
   } = useCopilotStyles({
     productId,
     apiUrl,
@@ -6087,7 +6120,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 : []
                     }
                   )
                 ]