@codingame/monaco-vscode-api 37.6.1 → 38.0.1

package/vscode/src/vs/workbench/contrib/chat/browser/widget/input/modelPicker/modelPickerWidget.js

@@ -2,32 +2,33 @@
 import { registerCss } from '../../../../../../../../../../css.js';
 import { __decorate, __param } from '../../../../../../../../../../external/tslib/tslib.es6.js';
 import * as modelPicker from './media/modelPicker.css';
-import { append, $, addDisposableGenericMouseDownListener, EventHelper, addDisposableListener, EventType, getActiveElement, isHTMLElement, reset } from '../../../../../../../base/browser/dom.js';
+import { getTotalWidth, append, $, addDisposableListener, EventType, EventHelper, getActiveElement, isHTMLElement, reset } from '../../../../../../../base/browser/dom.js';
 import { StandardKeyboardEvent } from '../../../../../../../base/browser/keyboardEvent.js';
+import { Gesture, EventType as EventType$1 } from '../../../../../../../base/browser/touch.js';
 import { renderIcon } from '../../../../../../../base/browser/ui/iconLabel/iconLabels.js';
 import { getBaseLayerHoverDelegate } from '../../../../../../../base/browser/ui/hover/hoverDelegate2.js';
 import { getDefaultHoverDelegate } from '../../../../../../../base/browser/ui/hover/hoverDelegateFactory.js';
 import { Codicon } from '../../../../../../../base/common/codicons.js';
 import { Emitter } from '../../../../../../../base/common/event.js';
 import { KeyCode } from '../../../../../../../base/common/keyCodes.js';
-import { Disposable, MutableDisposable, DisposableStore } from '../../../../../../../base/common/lifecycle.js';
+import { Disposable, MutableDisposable } from '../../../../../../../base/common/lifecycle.js';
 import { disposableTimeout } from '../../../../../../../base/common/async.js';
 import '../../../../../../../base/common/observableInternal/index.js';
 import { URI } from '../../../../../../../base/common/uri.js';
 import { localize } from '../../../../../../../nls.js';
-import { IActionWidgetService } from '../../../../../../../platform/actionWidget/browser/actionWidget.service.js';
-import { AgentHostAllowSignedOutWhenUsableSettingId } from '../../../../../../../platform/agentHost/common/agentService.js';
 import { ICommandService } from '../../../../../../../platform/commands/common/commands.service.js';
-import { IConfigurationService } from '../../../../../../../platform/configuration/common/configuration.service.js';
 import { IOpenerService } from '../../../../../../../platform/opener/common/opener.service.js';
 import { IProductService } from '../../../../../../../platform/product/common/productService.service.js';
+import { onUnexpectedError } from '../../../../../../../base/common/errors.js';
 import { ITelemetryService } from '../../../../../../../platform/telemetry/common/telemetry.service.js';
+import { logSettingExperimentTrigger } from '../../../../../../../platform/telemetry/common/experimentTrigger.js';
+import { AgentHostEnsembleIntelligenceUsesHydraFusionSettingId, COPILOT_HYDRA_FUSION_MODEL_ID, COPILOT_HYDRA_FUSION_MAX_MODEL_ID } from '../../../../../../../platform/agentHost/common/copilotCliConfig.js';
 import { StorageScope, StorageTarget } from '../../../../../../../platform/storage/common/storage.js';
 import { IStorageService } from '../../../../../../../platform/storage/common/storage.service.js';
-import { TelemetryTrustedValue } from '../../../../../../../platform/telemetry/common/telemetryUtils.js';
-import { COPILOT_VENDOR_ID, getLanguageModelProviderDisplayName } from '../../../../common/languageModels.js';
+import { isUserProvidedModel, COPILOT_VENDOR_ID, getLanguageModelProviderDisplayName } from '../../../../common/languageModels.js';
 import { ILanguageModelsService } from '../../../../common/languageModels.service.js';
 import { getLanguageModelDisplayNameWithSubscriptionSource } from '../../../../common/languageModelSourcePresentation.js';
+import { ChatEntitlement } from '../../../../../../services/chat/common/chatEntitlementService.js';
 import { IChatEntitlementService } from '../../../../../../services/chat/common/chatEntitlementService.service.js';
 import { CHAT_SETUP_ACTION_ID } from '../../../actions/chatActions.js';
 import { IUriIdentityService } from '../../../../../../../platform/uriIdentity/common/uriIdentity.service.js';
@@ -37,24 +38,22 @@ import { IUpdateService } from '../../../../../../../platform/update/common/upda
 import { IInstantiationService } from '../../../../../../../platform/instantiation/common/instantiation.js';
 import { IWorkspaceTrustManagementService, IWorkspaceTrustRequestService } from '../../../../../../../platform/workspace/common/workspaceTrust.service.js';
 import { getCompactCodicon } from '../../../chatIcons.js';
-import { withChatInputPickerMotion } from '../chatInputPickerActionItem.js';
-import { getModelPickerControlModels, shouldShowManageModelsAction, createManageModelsAction, buildModelPickerItems, getModelPickerAccessibilityProvider } from './modelPickerItems.js';
-import { ModelPickerConfiguration } from './modelPickerConfiguration.js';
+import { renderChatInputPickerSplit } from '../chatInputPickerActionItem.js';
+import { getModelPickerControlModels, shouldShowManageModelsAction, createManageModelsAction } from './modelPickerItems.js';
+import { requiresNewerVSCode } from './modelPickerItemPrimitives.js';
+import { renderModelConfigurationButton } from './modelPickerConfiguration.js';
 import { getCompactModelPickerIcon } from './modelProviderIcons.js';
 import { TabbedModelPicker } from './modelPickerTabbedWidget.js';
-import { getModelConfigSummary } from './modelPickerModelConfig.js';
-import { logModelConfigurationChange } from './modelPickerTelemetry.js';
-import { getModelPickerUnavailableReason, modelPickerRequiresSetup, ModelPickerUnavailableReason, shouldShowCacheBreakHint, isAutoModel } from './modelPickerPresentation.js';
+import { ModelPickerTelemetrySession } from './modelPickerTelemetry.js';
+import { getModelConfigProperty, MODEL_CONFIG_GROUP_EFFORT, setModelConfigValues, whenModelConfigValuesSaved } from './modelPickerModelConfig.js';
+import { isHydraFusionModel, isHydraFusionUpgradeOnly, isAutoModel, getEnsembleTierLabel, getHydraFusionTierLabel, getModelPickerUnavailableReason, modelPickerRequiresSetup, ModelPickerUnavailableReason, shouldShowCacheBreakHint } from './modelPickerPresentation.js';
 import { autorun } from '../../../../../../../base/common/observableInternal/reactions/autorun.js';
-import { ModelPickerSection } from './modelPickerItemSections.js';
 
 registerCss(modelPicker, 1);
 const CACHE_BREAK_HINT_DISMISSED_STORAGE_KEY = "chat.cacheBreakHintDismissed";
-const TABBED_MODEL_PICKER_SETTING_ID = "chat.experimentalModelPicker";
 const MODEL_PICKER_MINIMUM_LABEL_WIDTH = 60;
 const MODEL_PICKER_NAME_CHROME_WIDTH = 30;
 const MODEL_PICKER_MINIMUM_NAME_WIDTH = MODEL_PICKER_MINIMUM_LABEL_WIDTH + MODEL_PICKER_NAME_CHROME_WIDTH;
-const MODEL_PICKER_AUTO_NAME_WIDTH = 50;
 const MODEL_PICKER_COMPACT_NAME_WIDTH = 22;
 let ModelPickerWidget = class ModelPickerWidget extends Disposable {
     get selectedModel() {
@@ -70,7 +69,12 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
         return this._minimumWidth;
     }
     _updateMinimumWidth(nameWidth) {
-        const minimumWidth = nameWidth + (this._configButton?.offsetWidth ?? 0);
+        let configurationWidth = 0;
+        if (this._configButton && this._configButton.offsetWidth > 0) {
+            const margins = getTotalWidth(this._configButton) - this._configButton.offsetWidth;
+            configurationWidth = this._configButton.getBoundingClientRect().width + margins;
+        }
+        const minimumWidth = nameWidth + configurationWidth;
         if (this._minimumWidth !== minimumWidth) {
             this._minimumWidth = minimumWidth;
             this._onDidChangeMinimumWidth.fire(minimumWidth);
@@ -78,7 +82,6 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
     }
     constructor(
         _delegate,
-        _actionWidgetService,
         _commandService,
         _openerService,
         _telemetryService,
@@ -91,12 +94,10 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
         _workspaceTrustManagementService,
         _workspaceTrustRequestService,
         _storageService,
-        _configurationService,
         _instantiationService
     ) {
         super();
         this._delegate = _delegate;
-        this._actionWidgetService = _actionWidgetService;
         this._commandService = _commandService;
         this._openerService = _openerService;
         this._telemetryService = _telemetryService;
@@ -109,7 +110,6 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
         this._workspaceTrustManagementService = _workspaceTrustManagementService;
         this._workspaceTrustRequestService = _workspaceTrustRequestService;
         this._storageService = _storageService;
-        this._configurationService = _configurationService;
         this._instantiationService = _instantiationService;
         this._onDidChangeSelection = this._register(( new Emitter()));
         this.onDidChangeSelection = this._onDidChangeSelection.event;
@@ -121,21 +121,26 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
         this._minimumWidth = MODEL_PICKER_MINIMUM_NAME_WIDTH;
         this._tabbedPicker = this._register(( new MutableDisposable()));
         this._tabbedPickerHideListener = this._register(( new MutableDisposable()));
-        this._configuration = this._instantiationService.createInstance(ModelPickerConfiguration, {
-            getSelectedModel: () => this._selectedModel,
-            getConfigurationAccess: () => this._delegate.modelConfiguration ?? this._languageModelsService,
-            isDisabled: () => !!this._domNode?.classList.contains("disabled"),
-            shouldShowCacheBreakHint: () => this.shouldShowCacheBreakHint( false),
-            getCacheBreakLearnMoreLink: () => this.getCacheBreakLearnMoreLink(),
-            dismissCacheBreakHint: () => this.dismissCacheBreakHint()
-        });
+        if (this._delegate.workflow) {
+            this._register(autorun(reader => {
+                this._delegate.workflow?.summary.read(reader);
+                if (!this._delegate.workflow?.available.read(reader)) {
+                    this._tabbedPicker.value?.hide();
+                }
+                this._renderLabel();
+            }));
+        }
         this._register(this._languageModelsService.onDidChangeLanguageModels(() => {
             if (this._activatingAfterTrust && this._delegate.getModels().length > 0) {
                 this._clearActivating();
             }
             this._renderLabel();
+            if (this._unavailableReason() === undefined) {
+                this._tabbedPicker.value?.refresh(this._delegate.getModels());
+            }
         }));
         this._register(this._workspaceTrustManagementService.onDidChangeTrust(trusted => {
+            this._tabbedPicker.value?.hide();
             if (trusted && this._delegate.getPresentationOptions().showAutoModel && this._delegate.getModels().length === 0) {
                 this._activatingAfterTrust = true;
                 this._activatingTimer.value = disposableTimeout(() => {
@@ -157,7 +162,9 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
         this._register(this._entitlementService.onDidChangeUsageBasedBilling(() => {
             this._renderLabel();
         }));
-        this._register(this._entitlementService.onDidChangeEntitlement(() => this._renderLabel()));
+        this._register(
+            this._entitlementService.onDidChangeEntitlement(() => this.setSelectedModel(this._selectedModel))
+        );
         this._register(this._entitlementService.onDidChangeSentiment(() => this._renderLabel()));
         this._register(this._entitlementService.onDidChangeAnonymous(() => this._renderLabel()));
         if (this._delegate.modelConfiguration?.onDidChange) {
@@ -165,19 +172,11 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
                 this._renderLabel();
             }));
         }
-        this._register(this._configurationService.onDidChangeConfiguration(e => {
-            if (e.affectsConfiguration(TABBED_MODEL_PICKER_SETTING_ID)) {
-                this._renderLabel();
-            }
-        }));
     }
     setCompact(compact) {
         this._compact = compact;
         this._register(autorun(reader => {
-            const isCompact = compact.read(reader);
-            if (this._domNode) {
-                this._domNode.classList.toggle("compact", isCompact);
-            }
+            compact.read(reader);
             this._renderLabel();
         }));
     }
@@ -189,10 +188,109 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
             this._renderLabel();
         }));
     }
+    setContextViewLayer(contextViewLayer) {
+        this._contextViewLayer = contextViewLayer;
+    }
     setSelectedModel(model) {
-        this._selectedModel = model;
+        const selectedModel = this._normalizeSelectedModel(model);
+        this._selectedModel = selectedModel;
+        this._tabbedPicker.value?.setSelectedModel(selectedModel?.identifier);
+        if (selectedModel && selectedModel.identifier !== model?.identifier) {
+            if (this._delegate.setModelProgrammatically) {
+                this._delegate.setModelProgrammatically(selectedModel);
+            } else {
+                this._delegate.setModel(selectedModel);
+            }
+        }
         this._renderLabel();
     }
+    _normalizeSelectedModel(model) {
+        if (!model || isUserProvidedModel(model, this._languageModelsService)) {
+            return model;
+        }
+        const models = this._delegate.getModels();
+        if (isHydraFusionModel(model) && isHydraFusionUpgradeOnly(this._entitlementService.entitlement)) {
+            return models.find(
+                model => isAutoModel(model) && !isUserProvidedModel(model, this._languageModelsService)
+            ) ?? models.find(
+                model => !isHydraFusionModel(model) || isUserProvidedModel(model, this._languageModelsService)
+            ) ?? model;
+        }
+        return this._normalizeEnsembleIntelligence(model, models);
+    }
+    _normalizeEnsembleIntelligence(model, models) {
+        const routing = this._getEnsembleRouting(models);
+        if (!routing) {
+            return model;
+        }
+        const {
+            ensemble,
+            hydraFusion
+        } = routing;
+        const configurationAccess = this._delegate.modelConfiguration ?? this._languageModelsService;
+        const tier = getModelConfigProperty(ensemble, configurationAccess, MODEL_CONFIG_GROUP_EFFORT);
+        const onHydraFusion = model.identifier === hydraFusion.identifier;
+        if (!tier?.schema.enum?.includes("intelligence") || (!onHydraFusion && (model.identifier !== ensemble.identifier || tier.value !== "intelligence"))) {
+            return model;
+        }
+        logSettingExperimentTrigger(
+            this._telemetryService,
+            AgentHostEnsembleIntelligenceUsesHydraFusionSettingId
+        );
+        if (ensemble.metadata.autoModelEnsemble?.intelligenceUsesHydraFusion) {
+            return hydraFusion;
+        }
+        if (onHydraFusion) {
+            setModelConfigValues(ensemble, configurationAccess, {
+                [tier.key]: "intelligence"
+            }).catch(onUnexpectedError);
+            return ensemble;
+        }
+        return model;
+    }
+    _getEnsembleRouting(models) {
+        if (isHydraFusionUpgradeOnly(this._entitlementService.entitlement)) {
+            return undefined;
+        }
+        const ensemble = models.find(
+            model => model.metadata.autoModelEnsemble && !isUserProvidedModel(model, this._languageModelsService)
+        );
+        const hydraFusion = models.find(
+            model => model.metadata.id === COPILOT_HYDRA_FUSION_MODEL_ID && isHydraFusionModel(model) && !isUserProvidedModel(model, this._languageModelsService)
+        );
+        return ensemble && hydraFusion ? {
+            ensemble,
+            hydraFusion
+        } : undefined;
+    }
+    _getRoutingTier(model) {
+        if (!isHydraFusionModel(model) || isUserProvidedModel(model, this._languageModelsService)) {
+            return undefined;
+        }
+        const models = this._delegate.getModels();
+        const controlModels = getModelPickerControlModels(
+            this._languageModelsService.getModelsControlManifest(),
+            this._entitlementService.entitlement,
+            models
+        );
+        const runnable = candidate => !isUserProvidedModel(candidate, this._languageModelsService) && !requiresNewerVSCode(candidate, controlModels, this._productService.version);
+        const ensemble = models.find(candidate => candidate.metadata.autoModelEnsemble && runnable(candidate));
+        if (ensemble) {
+            const label = getEnsembleTierLabel(ensemble.metadata, model.metadata.id);
+            return label ? {
+                shownModel: ensemble,
+                label
+            } : undefined;
+        }
+        const hydraFusion = id => models.find(
+            candidate => candidate.metadata.id === id && isHydraFusionModel(candidate) && runnable(candidate)
+        );
+        const defaultTier = hydraFusion(COPILOT_HYDRA_FUSION_MODEL_ID);
+        return defaultTier && hydraFusion(COPILOT_HYDRA_FUSION_MAX_MODEL_ID) ? {
+            shownModel: defaultTier,
+            label: getHydraFusionTierLabel(model.metadata.id)
+        } : undefined;
+    }
     setEnabled(enabled) {
         if (this._domNode) {
             this._domNode.classList.toggle("disabled", !enabled);
@@ -231,7 +329,7 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
     }
     async _requestWorkspaceTrust() {
         await this._workspaceTrustRequestService.requestWorkspaceTrust({
-            message: ( localize(12249, "Trusting this workspace enables AI models and chat features."))
+            message: ( localize(14599, "Trusting this workspace enables AI models and chat features."))
         });
     }
     _requestSetup() {
@@ -239,54 +337,64 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
     }
     render(container) {
         this._domNode = append(container, $("div.action-label.model-picker-split"));
-        this._domNode.setAttribute("role", "group");
-        this._domNode.tabIndex = -1;
-        if (this._compact?.get()) {
-            this._domNode.classList.toggle("compact", true);
-        }
+        const {
+            primaryButton,
+            secondaryButton
+        } = renderChatInputPickerSplit(this._domNode);
         if (this._minimal?.get()) {
             this._domNode.classList.toggle("minimal", true);
         }
-        this._nameButton = append(this._domNode, $("a.model-picker-section.model-picker-name"));
-        this._nameButton.tabIndex = 0;
-        this._nameButton.setAttribute("role", "button");
-        this._nameButton.setAttribute("aria-haspopup", "true");
-        this._nameButton.setAttribute("aria-expanded", "false");
-        this._configButton = append(this._domNode, $("a.model-picker-section.model-picker-config"));
-        this._configButton.tabIndex = 0;
-        this._configButton.setAttribute("role", "button");
-        this._configButton.setAttribute("aria-haspopup", "true");
-        this._configButton.setAttribute("aria-expanded", "false");
+        this._nameButton = primaryButton;
+        this._nameButton.classList.add("model-picker-section", "model-picker-name");
+        this._configButton = secondaryButton;
+        this._configButton.classList.add(
+            "model-picker-section",
+            "model-picker-config",
+            "model-picker-config-summary"
+        );
         this._configButton.style.display = "none";
         this._badgeIcon = $("span.model-picker-badge");
         this._updateBadge();
         this._renderLabel();
-        this._registerButtonAction(this._nameButton, () => this.show());
-        this._registerButtonAction(this._configButton, () => this._configuration.show(this._configButton));
-        this._register(
-            getBaseLayerHoverDelegate().setupManagedHover(getDefaultHoverDelegate("mouse"), this._configButton, ( localize(12250, "Configure Model")))
-        );
+        this._registerButtonAction(this._nameButton, fromKeyboard => this.show(undefined, false, false, {
+            entryPoint: "modelName",
+            inputMethod: fromKeyboard ? "keyboard" : "mouse"
+        }));
+        this._registerButtonAction(this._configButton, fromKeyboard => this.show(undefined, true, true, {
+            entryPoint: "configuration",
+            inputMethod: fromKeyboard ? "keyboard" : "mouse"
+        }));
+        this._register(getBaseLayerHoverDelegate().setupManagedHover(
+            getDefaultHoverDelegate("mouse"),
+            this._configButton,
+            () => this._configButton?.ariaLabel ?? ( localize(14600, "Configure Model"))
+        ));
     }
     _registerButtonAction(element, action) {
-        this._register(addDisposableGenericMouseDownListener(element, e => {
+        this._register(addDisposableListener(element, EventType.MOUSE_DOWN, e => {
             if (e.button !== 0) {
                 return;
             }
             EventHelper.stop(e, true);
-            action();
+            action(false);
+        }));
+        this._register(Gesture.addTarget(element));
+        this._register(addDisposableListener(element, EventType$1.Tap, e => {
+            EventHelper.stop(e, true);
+            action(false);
         }));
         this._register(addDisposableListener(element, EventType.KEY_DOWN, e => {
             const event = ( new StandardKeyboardEvent(e));
             if (event.equals(KeyCode.Enter) || event.equals(KeyCode.Space)) {
                 EventHelper.stop(e, true);
-                action();
+                action(true);
             }
         }));
     }
     getCacheBreakLearnMoreLink() {
         const url = this._productService.defaultChatAgent?.optimizeUsageDocumentationUrl;
         return url ? {
-            label: ( localize(12251, "Learn more")),
+            label: ( localize(14601, "Learn more")),
             uri: ( URI.parse(url))
         } : undefined;
     }
@@ -322,87 +430,173 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
             selectedModelIsAuto: !!this._selectedModel && isAutoModel(this._selectedModel)
         });
     }
-    isTabbedPickerEnabled() {
-        return this._configurationService.getValue(TABBED_MODEL_PICKER_SETTING_ID) === true;
-    }
-    _providerPlaceholders() {
-        if (!this.isSetupRequired()) {
+    _providerPlaceholders(models, onLinkClick) {
+        const {
+            reason,
+            activating
+        } = this._availability();
+        const vendor = COPILOT_VENDOR_ID;
+        const label = getLanguageModelProviderDisplayName(this._languageModelsService, COPILOT_VENDOR_ID);
+        if (reason === ModelPickerUnavailableReason.Restricted) {
+            return [{
+                vendor,
+                label: ( localize(14602, "Restricted Mode")),
+                icon: Codicon.workspaceUntrusted,
+                message: ( localize(14603, "Trust this workspace to enable models.")),
+                action: {
+                    label: ( localize(14604, "Trust Workspace")),
+                    run: () => {
+                        this._tabbedPicker.value?.hide();
+                        void this._requestWorkspaceTrust();
+                    }
+                }
+            }];
+        }
+        if (reason === ModelPickerUnavailableReason.SetupRequired) {
+            return [{
+                vendor,
+                label,
+                message: ( localize(14605, "Sign in to see available models.")),
+                action: {
+                    label: ( localize(14606, "Sign in")),
+                    run: () => this._requestSetup()
+                }
+            }];
+        }
+        if (models.length > 0) {
             return [];
         }
+        if (activating) {
+            return [{
+                vendor,
+                label,
+                message: ( localize(14607, "Loading models..."))
+            }];
+        }
+        if (this._delegate.getPresentationOptions().showAutoModel) {
+            return [{
+                vendor,
+                label,
+                message: ( localize(14608, "Models will appear here once they are available."))
+            }];
+        }
+        const entitlement = this._entitlementService.entitlement;
+        const canUpgrade = entitlement === ChatEntitlement.Free || entitlement === ChatEntitlement.EDU;
         return [{
-            vendor: COPILOT_VENDOR_ID,
-            label: getLanguageModelProviderDisplayName(this._languageModelsService, COPILOT_VENDOR_ID),
-            message: ( localize(12252, "Sign in to see available models.")),
-            action: {
-                label: ( localize(12253, "Sign in")),
-                run: () => this._requestSetup()
-            }
+            vendor,
+            label,
+            message: canUpgrade ? ( localize(
+                14609,
+                "No models are available. Upgrade to GitHub Copilot Pro to use the best models."
+            )) : ( localize(14610, "No models are available.")),
+            action: canUpgrade ? {
+                label: ( localize(14611, "Upgrade")),
+                run: () => {
+                    this._tabbedPicker.value?.hide();
+                    onLinkClick(( URI.parse("command:workbench.action.chat.upgradePlan")));
+                }
+            } : undefined
         }];
     }
-    _showTabbedPicker(anchor, context) {
+    _showTabbedPicker(
+        anchor,
+        context,
+        telemetrySession,
+        detailsModelId,
+        focusConfiguration = false,
+        options
+    ) {
         const picker = this._tabbedPicker.value ?? (this._tabbedPicker.value = this._instantiationService.createInstance(TabbedModelPicker));
         const previouslyFocusedElement = getActiveElement();
+        const trigger = detailsModelId ? this._configButton : this._nameButton;
         this._tabbedPickerHideListener.value = picker.onDidHide(() => {
             this._tabbedPickerHideListener.clear();
+            telemetrySession.close(whenModelConfigValuesSaved(context.configurationAccess));
             this._nameButton?.setAttribute("aria-expanded", "false");
-            if (isHTMLElement(previouslyFocusedElement)) {
-                previouslyFocusedElement.focus();
-            }
+            this._configButton?.setAttribute("aria-expanded", "false");
+            this._domNode?.classList.remove("model-picker-active");
+            const previous = isHTMLElement(previouslyFocusedElement) && previouslyFocusedElement.isConnected && previouslyFocusedElement.style.display !== "none" ? previouslyFocusedElement : undefined;
+            const target = detailsModelId ? (trigger?.isConnected && trigger.style.display !== "none" ? trigger : this._nameButton) : previous ?? this._nameButton;
+            (target?.isConnected ? target : previous)?.focus();
         });
-        this._nameButton?.setAttribute("aria-expanded", "true");
-        picker.show(anchor, context);
+        trigger?.setAttribute("aria-expanded", "true");
+        this._domNode?.classList.add("model-picker-active");
+        if (this._getEnsembleRouting(context.models)) {
+            logSettingExperimentTrigger(
+                this._telemetryService,
+                AgentHostEnsembleIntelligenceUsesHydraFusionSettingId
+            );
+        }
+        picker.show(
+            anchor,
+            context,
+            detailsModelId,
+            focusConfiguration,
+            this._contextViewLayer,
+            options
+        );
+        if (!picker.isVisible) {
+            this._tabbedPickerHideListener.clear();
+            telemetrySession.close();
+            this._nameButton?.setAttribute("aria-expanded", "false");
+            this._configButton?.setAttribute("aria-expanded", "false");
+            this._domNode?.classList.remove("model-picker-active");
+        }
+    }
+    canOpenWithFilter() {
+        return !!this._domNode?.isConnected && !this._domNode.classList.contains("disabled") && !this.isRestrictedMode() && !this.isSetupRequired();
     }
-    show(anchor) {
+    show(
+        anchor,
+        showDetails = false,
+        focusConfiguration = false,
+        trigger = {
+            entryPoint: "command",
+            inputMethod: "unknown"
+        },
+        options
+    ) {
         const anchorElement = anchor ?? this._domNode;
         if (!anchorElement || this._domNode?.classList.contains("disabled")) {
             return;
         }
-        if (this._nameButton?.getAttribute("aria-expanded") === "true") {
-            if (this._tabbedPicker.value?.isVisible) {
-                this._tabbedPicker.value.hide();
+        if (this._tabbedPicker.value?.isVisible) {
+            if (options) {
+                this._tabbedPicker.value.openWithFilter(options);
             } else {
-                this._actionWidgetService.hide(true);
+                this._tabbedPicker.value.hide();
             }
             return;
         }
+        const telemetrySession = ( new ModelPickerTelemetrySession(
+            this._telemetryService,
+            this._languageModelsService,
+            trigger,
+            this._selectedModel,
+            {
+                chatSessionId: this._delegate.getChatSessionId?.(),
+                agentSessionId: this._delegate.getAgentSessionId?.()
+            },
+            this._delegate.getProvider ? this._delegate.getProvider() : "unknown"
+        ));
         const onSelect = model => {
-            const previousModel = this._selectedModel;
-            this._telemetryService.publicLog2("chat.modelChange", {
-                fromModel: previousModel?.metadata.vendor === "copilot" ? ( new TelemetryTrustedValue(previousModel.identifier)) : "unknown",
-                toModel: model.metadata.vendor === "copilot" ? ( new TelemetryTrustedValue(model.identifier)) : "unknown",
-                chatSessionId: this._delegate.getChatSessionId?.()
-            });
+            telemetrySession.logModelChange(this._selectedModel, model);
             this._selectedModel = model;
             this._renderLabel();
             this._onDidChangeSelection.fire(model);
         };
-        const onConfigure = (model, group) => {
-            onSelect(model);
-            this._actionWidgetService.hide();
-            this._configuration.show(this._configButton, group);
-        };
-        const models = this._delegate.getModels();
+        const restrictedMode = this.isRestrictedMode();
+        const unavailable = this._unavailableReason() !== undefined;
+        const models = unavailable ? [] : this._delegate.getModels();
         const presentation = this._delegate.getPresentationOptions();
-        const manifest = this._languageModelsService.getModelsControlManifest();
-        const controlModelsForTier = getModelPickerControlModels(manifest, this._entitlementService.entitlement, models);
         const canShowManageModelsAction = presentation.showManageModelsAction && shouldShowManageModelsAction(this._entitlementService);
-        const manageModelsAction = canShowManageModelsAction ? createManageModelsAction(this._commandService) : undefined;
+        const manageModelsAction = canShowManageModelsAction ? createManageModelsAction(this._commandService, this._delegate.getSessionType?.()) : undefined;
         const logModelPickerInteraction = interaction => {
             this._telemetryService.publicLog2("chat.modelPickerInteraction", {
                 interaction
             });
         };
-        const onDidToggleOtherModels = collapsed => {
-            logModelPickerInteraction(collapsed ? "otherModelsCollapsed" : "otherModelsExpanded");
-        };
         const manageSettingsUrl = this._defaultAccountService.resolveGitHubUrl(GitHubPaths.copilotSettings);
-        const onTogglePin = (modelIdentifier, pinned) => {
-            if (pinned) {
-                this._languageModelsService.pinModel(modelIdentifier);
-            } else {
-                this._languageModelsService.unpinModel(modelIdentifier);
-            }
-        };
         const onLinkClick = uri => {
             if (uri.scheme === "command" && uri.path === "workbench.action.chat.upgradePlan") {
                 logModelPickerInteraction("premiumModelUpgradePlanClicked");
@@ -413,134 +607,71 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
                 allowCommands: true
             });
         };
-        const placeholders = this._providerPlaceholders();
-        if (this.isTabbedPickerEnabled() && !this.isRestrictedMode() && (models.length > 0 || placeholders.length > 0)) {
-            const showCacheBreakHint = this.shouldShowCacheBreakHint( true);
-            this._showTabbedPicker(anchorElement, {
-                models,
-                selectedModelId: this._selectedModel?.identifier,
-                recentModelIds: this._languageModelsService.getRecentlyUsedModelIds().filter(id => !this._languageModelsService.isModelHidden(id)),
-                pinnedModelIds: this._languageModelsService.getPinnedModelIds().filter(id => !this._languageModelsService.isModelHidden(id)),
-                controlModels: controlModelsForTier,
-                configurationAccess: this._delegate.modelConfiguration ?? this._languageModelsService,
-                isUBB: !!this._entitlementService.quotas.usageBasedBilling,
-                showManageModels: !!manageModelsAction,
-                providerPlaceholders: placeholders,
-                unavailableContext: {
-                    show: presentation.showUnavailableFeatured,
-                    currentVSCodeVersion: this._productService.version,
-                    manageSettingsUrl,
-                    updateStateType: this._updateService.state.type
-                },
-                onUnavailableLinkClick: onLinkClick,
-                onSelect,
-                onTogglePin,
-                onManageModels: () => manageModelsAction?.run(),
-                onDidToggleOtherModels,
-                onConfigurationChanged: (model, group, key, fromValue, toValue) => logModelConfigurationChange(this._telemetryService, model, group, key, fromValue, toValue),
-                cacheBreakHint: showCacheBreakHint ? {
-                    text: ( localize(
-                        12254,
-                        "Switching models mid-session resets the prompt cache and may increase cost."
-                    )),
-                    link: this.getCacheBreakLearnMoreLink(),
-                    dismiss: () => this.dismissCacheBreakHint()
-                } : undefined
-            });
-            return;
-        }
-        const items = buildModelPickerItems({
+        const placeholders = this._providerPlaceholders(models, onLinkClick);
+        const manifest = this._languageModelsService.getModelsControlManifest();
+        const controlModelsForTier = unavailable ? {} : getModelPickerControlModels(manifest, this._entitlementService.entitlement, models);
+        const onDidToggleOtherModels = collapsed => {
+            if (!collapsed) {
+                telemetrySession.logOtherModelsExpanded();
+            }
+            logModelPickerInteraction(collapsed ? "otherModelsCollapsed" : "otherModelsExpanded");
+        };
+        const onTogglePin = (modelIdentifier, pinned) => {
+            const telemetry = {
+                pickerSessionId: telemetrySession.id
+            };
+            if (pinned) {
+                this._languageModelsService.pinModel(modelIdentifier, telemetry);
+            } else {
+                this._languageModelsService.unpinModel(modelIdentifier, telemetry);
+            }
+        };
+        const showCacheBreakHint = this.shouldShowCacheBreakHint( true);
+        const showConfigurationCacheBreakHint = this.shouldShowCacheBreakHint( false);
+        this._showTabbedPicker(anchorElement, {
+            workflow: this._delegate.workflow,
             models,
             selectedModelId: this._selectedModel?.identifier,
             recentModelIds: this._languageModelsService.getRecentlyUsedModelIds().filter(id => !this._languageModelsService.isModelHidden(id)),
             pinnedModelIds: this._languageModelsService.getPinnedModelIds().filter(id => !this._languageModelsService.isModelHidden(id)),
             controlModels: controlModelsForTier,
-            currentVSCodeVersion: this._productService.version,
-            updateStateType: this._updateService.state.type,
-            manageSettingsUrl,
-            manageModelsAction,
-            chatEntitlementService: this._entitlementService,
-            languageModelsService: this._languageModelsService,
-            openerService: this._openerService,
-            presentation: {
-                ...presentation,
-                restrictedMode: this.isRestrictedMode(),
-                setupRequired: this.isSetupRequired(),
-                showManageModelsInSetupRequired: this._configurationService.getValue(AgentHostAllowSignedOutWhenUsableSettingId) === true,
-                isUBB: !!this._entitlementService.quotas.usageBasedBilling
-            },
-            actions: {
-                onSelect,
-                onTogglePin: (modelIdentifier, pinned) => {
-                    onTogglePin(modelIdentifier, pinned);
-                    this._actionWidgetService.hide();
-                    this.show(anchorElement);
-                },
-                onConfigure,
-                onRequestTrust: () => {
-                    void this._requestWorkspaceTrust();
-                },
-                onRequestSetup: () => {
-                    this._requestSetup();
-                }
-            }
-        });
-        const hoverDisposables = ( new DisposableStore());
-        for (const item of items) {
-            if (item.hover?.disposable) {
-                hoverDisposables.add(item.hover.disposable);
-            }
-        }
-        const unavailable = this.isRestrictedMode() || this.isSetupRequired();
-        const showCacheBreakHint = this.shouldShowCacheBreakHint( true);
-        const listOptions = withChatInputPickerMotion({
-            className: "chat-model-picker-dropdown",
-            headerText: showCacheBreakHint ? ( localize(
-                12254,
-                "Switching models mid-session resets the prompt cache and may increase cost."
-            )) : undefined,
-            headerIcon: showCacheBreakHint ? Codicon.info : undefined,
-            headerLink: showCacheBreakHint ? this.getCacheBreakLearnMoreLink() : undefined,
-            headerDismiss: showCacheBreakHint ? () => this.dismissCacheBreakHint() : undefined,
-            showFilter: !unavailable,
-            filterPlaceholder: ( localize(12255, "Search models")),
-            focusFilterOnOpen: true,
-            filterAsCombobox: !unavailable,
-            collapsedByDefault: ( new Set([ModelPickerSection.Other])),
-            onDidToggleSection: (section, collapsed) => {
-                if (section === ModelPickerSection.Other) {
-                    onDidToggleOtherModels(collapsed);
-                }
+            configurationAccess: this._delegate.modelConfiguration ?? this._languageModelsService,
+            isUBB: !!this._entitlementService.quotas.usageBasedBilling,
+            showManageModels: !!manageModelsAction && !restrictedMode,
+            providerPlaceholders: placeholders,
+            unavailableContext: {
+                show: presentation.showUnavailableFeatured,
+                currentVSCodeVersion: this._productService.version,
+                manageSettingsUrl,
+                updateStateType: this._updateService.state.type
             },
-            linkHandler: onLinkClick,
-            minWidth: 200
-        });
-        const previouslyFocusedElement = getActiveElement();
-        const delegate = {
-            onSelect: action => {
-                this._actionWidgetService.hide();
-                action.run();
+            onUnavailableLinkClick: onLinkClick,
+            onSelect,
+            onTogglePin,
+            onManageModels: () => manageModelsAction?.run(),
+            onDidToggleOtherModels,
+            onDidSearch: () => telemetrySession.logSearch(),
+            onConfigurationChanged: (model, group, key, fromValue, toValue, requestedAt) => {
+                telemetrySession.logConfigurationChange(model, group, key, fromValue, toValue, requestedAt);
+                this._renderLabel();
             },
-            onHide: () => {
-                hoverDisposables.dispose();
-                this._nameButton?.setAttribute("aria-expanded", "false");
-                if (isHTMLElement(previouslyFocusedElement)) {
-                    previouslyFocusedElement.focus();
-                }
-            }
-        };
-        this._nameButton?.setAttribute("aria-expanded", "true");
-        this._actionWidgetService.show(
-            "ChatModelPicker",
-            false,
-            items,
-            delegate,
-            anchorElement,
-            undefined,
-            [],
-            getModelPickerAccessibilityProvider(!unavailable),
-            listOptions
-        );
+            cacheBreakHint: showCacheBreakHint ? {
+                text: ( localize(
+                    14612,
+                    "Switching models mid-session resets the prompt cache and may increase cost."
+                )),
+                link: this.getCacheBreakLearnMoreLink(),
+                dismiss: () => this.dismissCacheBreakHint()
+            } : undefined,
+            configurationCacheBreakHint: showConfigurationCacheBreakHint ? {
+                text: ( localize(
+                    14613,
+                    "Changing these options mid-session resets the prompt cache and may increase cost."
+                )),
+                link: this.getCacheBreakLearnMoreLink(),
+                dismiss: () => this.dismissCacheBreakHint()
+            } : undefined
+        }, telemetrySession, showDetails ? this._selectedModel?.identifier : undefined, focusConfiguration, options);
     }
     _updateBadge() {
         if (this._badgeIcon) {
@@ -559,7 +690,10 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
         if (!this._domNode || !this._nameButton) {
             return;
         }
-        const name = this._selectedModel ? getLanguageModelDisplayNameWithSubscriptionSource(this._selectedModel) : undefined;
+        const workflow = this._delegate.workflow?.summary.get();
+        const routingTier = !workflow && this._selectedModel ? this._getRoutingTier(this._selectedModel) : undefined;
+        const shownModel = routingTier?.shownModel ?? this._selectedModel;
+        const name = workflow ?? (shownModel ? getLanguageModelDisplayNameWithSubscriptionSource(shownModel) : undefined);
         const {
             reason,
             activating,
@@ -570,46 +704,61 @@ let ModelPickerWidget = class ModelPickerWidget extends Disposable {
         const setupRequired = reason === ModelPickerUnavailableReason.SetupRequired;
         const unavailable = reason !== undefined;
         const nameChildren = [];
-        const modelIcon = this._selectedModel ? (this._delegate.getPresentationOptions().showModelIcon ? getCompactModelPickerIcon(this._selectedModel) : this._selectedModel.metadata.statusIcon ? getCompactCodicon(this._selectedModel.metadata.statusIcon) : undefined) : undefined;
+        const modelIcon = workflow ? Codicon.layers : shownModel ? (this._delegate.getPresentationOptions().showModelIcon ? getCompactModelPickerIcon(shownModel) : shownModel.metadata.statusIcon ? getCompactCodicon(shownModel.metadata.statusIcon) : undefined) : undefined;
         const compact = this._compact?.get() ?? false;
         const minimal = this._minimal?.get() ?? false;
         if (modelIcon && !noModelsAvailable) {
             nameChildren.push(renderIcon(modelIcon));
         }
-        const modelLabel = unavailable ? ( localize(12256, "Models")) : activating ? ( localize(12257, "Activating...")) : genericNoModels ? ( localize(12258, "No models available")) : (name ?? ( localize(12259, "Auto")));
-        const configSummary = this.isTabbedPickerEnabled() && !unavailable && !minimal ? getModelConfigSummary(
-            this._selectedModel,
-            this._delegate.modelConfiguration ?? this._languageModelsService
-        ) : undefined;
+        const modelLabel = unavailable ? ( localize(14614, "Models")) : activating ? ( localize(14615, "Activating...")) : genericNoModels ? ( localize(14616, "No models available")) : (name ?? ( localize(14617, "Auto")));
         const showModelLabel = !compact || !modelIcon || noModelsAvailable;
-        const showingAuto = !unavailable && !activating && !genericNoModels && (!this._selectedModel || isAutoModel(this._selectedModel));
-        const nameMinimumWidth = compact && !showModelLabel ? MODEL_PICKER_COMPACT_NAME_WIDTH : showingAuto ? MODEL_PICKER_AUTO_NAME_WIDTH : MODEL_PICKER_MINIMUM_NAME_WIDTH;
-        this._nameButton.style.minWidth = `${nameMinimumWidth}px`;
         if (showModelLabel) {
             nameChildren.push($("span.chat-input-picker-label", undefined, modelLabel));
         }
-        if (configSummary && showModelLabel) {
-            nameChildren.push($("span.model-picker-config-summary", undefined, configSummary));
-        }
         if (this._badgeIcon) {
             nameChildren.push(this._badgeIcon);
         }
         reset(this._nameButton, ...nameChildren);
         if (this._configButton) {
-            if (this.isTabbedPickerEnabled()) {
-                this._configButton.style.display = "none";
-            } else {
-                this._configuration.renderButton(this._configButton, minimal, noModelsAvailable);
-            }
+            this._configButton.setAttribute("aria-haspopup", "dialog");
+            renderModelConfigurationButton(
+                this._configButton,
+                shownModel,
+                this._delegate.modelConfiguration ?? this._languageModelsService,
+                !!workflow || minimal || compact || noModelsAvailable,
+                routingTier?.label
+            );
         }
         const configVisible = !!this._configButton && this._configButton.style.display !== "none";
+        this._domNode.classList.toggle("has-config", configVisible);
+        this._domNode.classList.toggle("compact", compact && !showModelLabel);
         this._domNode.classList.toggle("icon-only", !showModelLabel && !configVisible);
-        const ariaLabel = restrictedMode ? ( localize(12260, "Models, unavailable while in Restricted mode")) : setupRequired ? ( localize(12261, "Models, sign in to use Copilot")) : configSummary ? ( localize(12262, "Models, {0}, {1}", modelLabel, configSummary)) : ( localize(12263, "Models, {0}", modelLabel));
+        const ariaLabel = restrictedMode ? ( localize(14618, "Models, unavailable while in Restricted mode")) : setupRequired ? ( localize(14619, "Models, sign in to use Copilot")) : ( localize(14620, "Models, {0}", modelLabel));
         this._domNode.ariaLabel = ariaLabel;
         this._nameButton.ariaLabel = ariaLabel;
+        const nameMinimumWidth = showModelLabel ? this._getNameMinimumWidth(this._nameButton) : MODEL_PICKER_COMPACT_NAME_WIDTH;
+        this._nameButton.style.minWidth = showModelLabel && nameMinimumWidth < MODEL_PICKER_MINIMUM_NAME_WIDTH ? "max-content" : `${nameMinimumWidth}px`;
         this._updateMinimumWidth(nameMinimumWidth);
     }
+    _getNameMinimumWidth(nameButton) {
+        const {
+            flex,
+            width,
+            minWidth
+        } = nameButton.style;
+        nameButton.style.flex = "none";
+        nameButton.style.width = "max-content";
+        nameButton.style.minWidth = "0";
+        const contentWidth = nameButton.getBoundingClientRect().width;
+        nameButton.style.flex = flex;
+        nameButton.style.width = width;
+        nameButton.style.minWidth = minWidth;
+        if (contentWidth === 0) {
+            return MODEL_PICKER_MINIMUM_NAME_WIDTH;
+        }
+        return Math.min(contentWidth, MODEL_PICKER_MINIMUM_NAME_WIDTH);
+    }
 };
-ModelPickerWidget = ( __decorate([( __param(1, IActionWidgetService)), ( __param(2, ICommandService)), ( __param(3, IOpenerService)), ( __param(4, ITelemetryService)), ( __param(5, ILanguageModelsService)), ( __param(6, IProductService)), ( __param(7, IChatEntitlementService)), ( __param(8, IUpdateService)), ( __param(9, IUriIdentityService)), ( __param(10, IDefaultAccountService)), ( __param(11, IWorkspaceTrustManagementService)), ( __param(12, IWorkspaceTrustRequestService)), ( __param(13, IStorageService)), ( __param(14, IConfigurationService)), ( __param(15, IInstantiationService))], ModelPickerWidget));
+ModelPickerWidget = ( __decorate([( __param(1, ICommandService)), ( __param(2, IOpenerService)), ( __param(3, ITelemetryService)), ( __param(4, ILanguageModelsService)), ( __param(5, IProductService)), ( __param(6, IChatEntitlementService)), ( __param(7, IUpdateService)), ( __param(8, IUriIdentityService)), ( __param(9, IDefaultAccountService)), ( __param(10, IWorkspaceTrustManagementService)), ( __param(11, IWorkspaceTrustRequestService)), ( __param(12, IStorageService)), ( __param(13, IInstantiationService))], ModelPickerWidget));
 
-export { ModelPickerWidget, TABBED_MODEL_PICKER_SETTING_ID };
+export { ModelPickerWidget };