Skip to content

Commit

Permalink
Adopt FindInput in QuickInputBox
Browse files Browse the repository at this point in the history 
Part of #156179
  • Loading branch information
@Tyriar
Tyriar committed Aug 19, 2022
1 parent 78cd55a commit 33b3a48
Show file tree
Hide file tree
Showing 2 changed files with 32 additions and 31 deletions.
6 changes: 2 additions & 4 deletions src/vs/base/browser/ui/findinput/findInput.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,6 @@ export class FindInput extends Widget {

static readonly OPTION_CHANGE: string = 'optionChange';

private contextViewProvider: IContextViewProvider;
private placeholder: string;
private validation?: IInputValidator;
private label: string;
Expand Down Expand Up @@ -100,9 +99,8 @@ export class FindInput extends Widget {
private _onRegexKeyDown = this._register(new Emitter<IKeyboardEvent>());
public readonly onRegexKeyDown: Event<IKeyboardEvent> = this._onRegexKeyDown.event;

constructor(parent: HTMLElement | null, contextViewProvider: IContextViewProvider, private readonly _showOptionButtons: boolean, options: IFindInputOptions) {
constructor(parent: HTMLElement | null, contextViewProvider: IContextViewProvider | undefined, private readonly _showOptionButtons: boolean, options: IFindInputOptions) {
super();
this.contextViewProvider = contextViewProvider;
this.placeholder = options.placeholder || '';
this.validation = options.validation;
this.label = options.label || NLS_DEFAULT_LABEL;
Expand Down Expand Up @@ -135,7 +133,7 @@ export class FindInput extends Widget {
this.domNode = document.createElement('div');
this.domNode.classList.add('monaco-findInput');

this.inputBox = this._register(new HistoryInputBox(this.domNode, this.contextViewProvider, {
this.inputBox = this._register(new HistoryInputBox(this.domNode, contextViewProvider, {
placeholder: this.placeholder || '',
ariaLabel: this.label || '',
validationOptions: {
Expand Down
57 changes: 30 additions & 27 deletions src/vs/base/parts/quickinput/browser/quickInputBox.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@
import * as dom from 'vs/base/browser/dom';
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { StandardMouseEvent } from 'vs/base/browser/mouseEvent';
import { IInputBoxStyles, InputBox, IRange, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
import { FindInput } from 'vs/base/browser/ui/findinput/findInput';
import { IInputBoxStyles, IRange, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
import { Disposable, IDisposable } from 'vs/base/common/lifecycle';
import Severity from 'vs/base/common/severity';
import 'vs/css!./media/quickInput';
Expand All @@ -16,113 +17,115 @@ const $ = dom.$;
export class QuickInputBox extends Disposable {

private container: HTMLElement;
private inputBox: InputBox;
private findInput: FindInput;

constructor(
private parent: HTMLElement
) {
super();
this.container = dom.append(this.parent, $('.quick-input-box'));
this.inputBox = this._register(new InputBox(this.container, undefined));
this.findInput = this._register(new FindInput(this.container, undefined, false, {
label: ''
}));
}

onKeyDown = (handler: (event: StandardKeyboardEvent) => void): IDisposable => {
return dom.addDisposableListener(this.inputBox.inputElement, dom.EventType.KEY_DOWN, (e: KeyboardEvent) => {
return dom.addDisposableListener(this.findInput.inputBox.inputElement, dom.EventType.KEY_DOWN, (e: KeyboardEvent) => {
handler(new StandardKeyboardEvent(e));
});
};

onMouseDown = (handler: (event: StandardMouseEvent) => void): IDisposable => {
return dom.addDisposableListener(this.inputBox.inputElement, dom.EventType.MOUSE_DOWN, (e: MouseEvent) => {
return dom.addDisposableListener(this.findInput.inputBox.inputElement, dom.EventType.MOUSE_DOWN, (e: MouseEvent) => {
handler(new StandardMouseEvent(e));
});
};

onDidChange = (handler: (event: string) => void): IDisposable => {
return this.inputBox.onDidChange(handler);
return this.findInput.onDidChange(handler);
};

get value() {
return this.inputBox.value;
return this.findInput.getValue();
}

set value(value: string) {
this.inputBox.value = value;
this.findInput.setValue(value);
}

select(range: IRange | null = null): void {
this.inputBox.select(range);
this.findInput.inputBox.select(range);
}

isSelectionAtEnd(): boolean {
return this.inputBox.isSelectionAtEnd();
return this.findInput.inputBox.isSelectionAtEnd();
}

setPlaceholder(placeholder: string): void {
this.inputBox.setPlaceHolder(placeholder);
this.findInput.inputBox.setPlaceHolder(placeholder);
}

get placeholder() {
return this.inputBox.inputElement.getAttribute('placeholder') || '';
return this.findInput.inputBox.inputElement.getAttribute('placeholder') || '';
}

set placeholder(placeholder: string) {
this.inputBox.setPlaceHolder(placeholder);
this.findInput.inputBox.setPlaceHolder(placeholder);
}

get ariaLabel() {
return this.inputBox.getAriaLabel();
return this.findInput.inputBox.getAriaLabel();
}

set ariaLabel(ariaLabel: string) {
this.inputBox.setAriaLabel(ariaLabel);
this.findInput.inputBox.setAriaLabel(ariaLabel);
}

get password() {
return this.inputBox.inputElement.type === 'password';
return this.findInput.inputBox.inputElement.type === 'password';
}

set password(password: boolean) {
this.inputBox.inputElement.type = password ? 'password' : 'text';
this.findInput.inputBox.inputElement.type = password ? 'password' : 'text';
}

set enabled(enabled: boolean) {
this.inputBox.setEnabled(enabled);
this.findInput.setEnabled(enabled);
}

hasFocus(): boolean {
return this.inputBox.hasFocus();
return this.findInput.inputBox.hasFocus();
}

setAttribute(name: string, value: string): void {
this.inputBox.inputElement.setAttribute(name, value);
this.findInput.inputBox.inputElement.setAttribute(name, value);
}

removeAttribute(name: string): void {
this.inputBox.inputElement.removeAttribute(name);
this.findInput.inputBox.inputElement.removeAttribute(name);
}

showDecoration(decoration: Severity): void {
if (decoration === Severity.Ignore) {
this.inputBox.hideMessage();
this.findInput.clearMessage();
} else {
this.inputBox.showMessage({ type: decoration === Severity.Info ? MessageType.INFO : decoration === Severity.Warning ? MessageType.WARNING : MessageType.ERROR, content: '' });
this.findInput.showMessage({ type: decoration === Severity.Info ? MessageType.INFO : decoration === Severity.Warning ? MessageType.WARNING : MessageType.ERROR, content: '' });
}
}

stylesForType(decoration: Severity) {
return this.inputBox.stylesForType(decoration === Severity.Info ? MessageType.INFO : decoration === Severity.Warning ? MessageType.WARNING : MessageType.ERROR);
return this.findInput.inputBox.stylesForType(decoration === Severity.Info ? MessageType.INFO : decoration === Severity.Warning ? MessageType.WARNING : MessageType.ERROR);
}

setFocus(): void {
this.inputBox.focus();
this.findInput.focus();
}

layout(): void {
this.inputBox.layout();
this.findInput.inputBox.layout();
}

style(styles: IInputBoxStyles): void {
this.inputBox.style(styles);
this.findInput.style(styles);
}
}

0 comments on commit 33b3a48

Please sign in to comment.