Workspace Trust Prop Changes (#121779)

* update wording for dialog

* remove soft request prompts

* tweak wording

* use origin

* clean up language for choice prompt

extensions/typescript-language-features/src/tsServer/versionManager.ts

@@ -38,16 +38,11 @@ export class TypeScriptVersionManager extends Disposable {
 					this._currentVersion = localVersion;
 				}
 			} else {
-				setImmediate(() => {
-					vscode.workspace.requestWorkspaceTrust({ modal: false })
-						.then(trusted => {
-							if (trusted && this.versionProvider.localVersion) {
-								this.updateActiveVersion(this.versionProvider.localVersion);
-							} else {
-								this.updateActiveVersion(this.versionProvider.defaultVersion);
-							}
-						});
-				});
+				this._disposables.push(vscode.workspace.onDidReceiveWorkspaceTrust(() => {
+					if (this.versionProvider.localVersion) {
+						this.updateActiveVersion(this.versionProvider.localVersion);
+					}
+				}));
 			}
 		}
 

src/vs/base/browser/ui/button/button.css

@@ -40,3 +40,15 @@
 .monaco-button-dropdown > .monaco-dropdown-button {
 	margin-left: 1px;
 }
+
+.monaco-description-button {
+	flex-direction: column;
+}
+
+.monaco-description-button .monaco-button-label {
+	font-weight: 500;
+}
+
+.monaco-description-button .monaco-button-description {
+	font-style: italic;
+}

src/vs/base/browser/ui/button/button.ts

@@ -50,6 +50,10 @@ export interface IButton extends IDisposable {
 	hasFocus(): boolean;
 }
 
+export interface IButtonWithDescription extends IButton {
+	description: string;
+}
+
 export class Button extends Disposable implements IButton {
 
 	private _element: HTMLElement;
@@ -303,6 +307,207 @@ export class ButtonWithDropdown extends Disposable implements IButton {
 	}
 }
 
+export class ButtonWithDescription extends Disposable implements IButtonWithDescription {
+
+	private _element: HTMLElement;
+	private _labelElement: HTMLElement;
+	private _descriptionElement: HTMLElement;
+	private options: IButtonOptions;
+
+	private buttonBackground: Color | undefined;
+	private buttonHoverBackground: Color | undefined;
+	private buttonForeground: Color | undefined;
+	private buttonSecondaryBackground: Color | undefined;
+	private buttonSecondaryHoverBackground: Color | undefined;
+	private buttonSecondaryForeground: Color | undefined;
+	private buttonBorder: Color | undefined;
+
+	private _onDidClick = this._register(new Emitter<Event>());
+	get onDidClick(): BaseEvent<Event> { return this._onDidClick.event; }
+
+	private focusTracker: IFocusTracker;
+
+	constructor(container: HTMLElement, options?: IButtonOptions) {
+		super();
+
+		this.options = options || Object.create(null);
+		mixin(this.options, defaultOptions, false);
+
+		this.buttonForeground = this.options.buttonForeground;
+		this.buttonBackground = this.options.buttonBackground;
+		this.buttonHoverBackground = this.options.buttonHoverBackground;
+
+		this.buttonSecondaryForeground = this.options.buttonSecondaryForeground;
+		this.buttonSecondaryBackground = this.options.buttonSecondaryBackground;
+		this.buttonSecondaryHoverBackground = this.options.buttonSecondaryHoverBackground;
+
+		this.buttonBorder = this.options.buttonBorder;
+
+		this._element = document.createElement('a');
+		this._element.classList.add('monaco-button');
+		this._element.classList.add('monaco-description-button');
+		this._element.tabIndex = 0;
+		this._element.setAttribute('role', 'button');
+
+		this._labelElement = document.createElement('div');
+		this._labelElement.classList.add('monaco-button-label');
+		this._labelElement.tabIndex = -1;
+		this._element.appendChild(this._labelElement);
+
+		this._descriptionElement = document.createElement('div');
+		this._descriptionElement.classList.add('monaco-button-description');
+		this._descriptionElement.tabIndex = -1;
+		this._element.appendChild(this._descriptionElement);
+
+		container.appendChild(this._element);
+
+		this._register(Gesture.addTarget(this._element));
+
+		[EventType.CLICK, TouchEventType.Tap].forEach(eventType => {
+			this._register(addDisposableListener(this._element, eventType, e => {
+				if (!this.enabled) {
+					EventHelper.stop(e);
+					return;
+				}
+
+				this._onDidClick.fire(e);
+			}));
+		});
+
+		this._register(addDisposableListener(this._element, EventType.KEY_DOWN, e => {
+			const event = new StandardKeyboardEvent(e);
+			let eventHandled = false;
+			if (this.enabled && (event.equals(KeyCode.Enter) || event.equals(KeyCode.Space))) {
+				this._onDidClick.fire(e);
+				eventHandled = true;
+			} else if (event.equals(KeyCode.Escape)) {
+				this._element.blur();
+				eventHandled = true;
+			}
+
+			if (eventHandled) {
+				EventHelper.stop(event, true);
+			}
+		}));
+
+		this._register(addDisposableListener(this._element, EventType.MOUSE_OVER, e => {
+			if (!this._element.classList.contains('disabled')) {
+				this.setHoverBackground();
+			}
+		}));
+
+		this._register(addDisposableListener(this._element, EventType.MOUSE_OUT, e => {
+			this.applyStyles(); // restore standard styles
+		}));
+
+		// Also set hover background when button is focused for feedback
+		this.focusTracker = this._register(trackFocus(this._element));
+		this._register(this.focusTracker.onDidFocus(() => this.setHoverBackground()));
+		this._register(this.focusTracker.onDidBlur(() => this.applyStyles())); // restore standard styles
+
+		this.applyStyles();
+	}
+
+	private setHoverBackground(): void {
+		let hoverBackground;
+		if (this.options.secondary) {
+			hoverBackground = this.buttonSecondaryHoverBackground ? this.buttonSecondaryHoverBackground.toString() : null;
+		} else {
+			hoverBackground = this.buttonHoverBackground ? this.buttonHoverBackground.toString() : null;
+		}
+		if (hoverBackground) {
+			this._element.style.backgroundColor = hoverBackground;
+		}
+	}
+
+	style(styles: IButtonStyles): void {
+		this.buttonForeground = styles.buttonForeground;
+		this.buttonBackground = styles.buttonBackground;
+		this.buttonHoverBackground = styles.buttonHoverBackground;
+		this.buttonSecondaryForeground = styles.buttonSecondaryForeground;
+		this.buttonSecondaryBackground = styles.buttonSecondaryBackground;
+		this.buttonSecondaryHoverBackground = styles.buttonSecondaryHoverBackground;
+		this.buttonBorder = styles.buttonBorder;
+
+		this.applyStyles();
+	}
+
+	private applyStyles(): void {
+		if (this._element) {
+			let background, foreground;
+			if (this.options.secondary) {
+				foreground = this.buttonSecondaryForeground ? this.buttonSecondaryForeground.toString() : '';
+				background = this.buttonSecondaryBackground ? this.buttonSecondaryBackground.toString() : '';
+			} else {
+				foreground = this.buttonForeground ? this.buttonForeground.toString() : '';
+				background = this.buttonBackground ? this.buttonBackground.toString() : '';
+			}
+
+			const border = this.buttonBorder ? this.buttonBorder.toString() : '';
+
+			this._element.style.color = foreground;
+			this._element.style.backgroundColor = background;
+
+			this._element.style.borderWidth = border ? '1px' : '';
+			this._element.style.borderStyle = border ? 'solid' : '';
+			this._element.style.borderColor = border;
+		}
+	}
+
+	get element(): HTMLElement {
+		return this._element;
+	}
+
+	set label(value: string) {
+		this._element.classList.add('monaco-text-button');
+		if (this.options.supportIcons) {
+			reset(this._labelElement, ...renderLabelWithIcons(value));
+		} else {
+			this._labelElement.textContent = value;
+		}
+		if (typeof this.options.title === 'string') {
+			this._element.title = this.options.title;
+		} else if (this.options.title) {
+			this._element.title = value;
+		}
+	}
+
+	set description(value: string) {
+		if (this.options.supportIcons) {
+			reset(this._descriptionElement, ...renderLabelWithIcons(value));
+		} else {
+			this._descriptionElement.textContent = value;
+		}
+	}
+
+	set icon(icon: CSSIcon) {
+		this._element.classList.add(...CSSIcon.asClassNameArray(icon));
+	}
+
+	set enabled(value: boolean) {
+		if (value) {
+			this._element.classList.remove('disabled');
+			this._element.setAttribute('aria-disabled', String(false));
+			this._element.tabIndex = 0;
+		} else {
+			this._element.classList.add('disabled');
+			this._element.setAttribute('aria-disabled', String(true));
+		}
+	}
+
+	get enabled() {
+		return !this._element.classList.contains('disabled');
+	}
+
+	focus(): void {
+		this._element.focus();
+	}
+
+	hasFocus(): boolean {
+		return this._element === document.activeElement;
+	}
+}
+
 export class ButtonBar extends Disposable {
 
 	private _buttons: IButton[] = [];
@@ -321,6 +526,12 @@ export class ButtonBar extends Disposable {
 		return button;
 	}
 
+	addButtonWithDescription(options?: IButtonOptions): IButtonWithDescription {
+		const button = this._register(new ButtonWithDescription(this.container, options));
+		this.pushButton(button);
+		return button;
+	}
+
 	addButtonWithDropdown(options: IButtonWithDropdownOptions): IButton {
 		const button = this._register(new ButtonWithDropdown(this.container, options));
 		this.pushButton(button);

src/vs/base/browser/ui/dialog/dialog.css

@@ -34,6 +34,7 @@
 
 /** Dialog: Title Actions Row */
 .monaco-dialog-box .dialog-toolbar-row {
+	height: 22px;
 	padding-bottom: 4px;
 }
 
@@ -138,6 +139,10 @@
 	overflow: hidden;
 }
 
+.monaco-dialog-box > .dialog-buttons-row > .dialog-buttons.centered {
+	justify-content: center;
+}
+
 .monaco-dialog-box > .dialog-buttons-row > .dialog-buttons > .monaco-button {
 	width: fit-content;
 	width: -moz-fit-content;