mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-16 18:46:40 -05:00
Connection inputs labels (#1129)
* adds aria-label to inputs for connection * formatting
This commit is contained in:
@@ -49,6 +49,10 @@ export interface IDropdownOptions extends IDropdownStyles {
|
|||||||
* Error Message to show if input is not part of the supplied list, only used if strictSelection = false
|
* Error Message to show if input is not part of the supplied list, only used if strictSelection = false
|
||||||
*/
|
*/
|
||||||
errorMessage?: string;
|
errorMessage?: string;
|
||||||
|
/**
|
||||||
|
* Value to use as aria-label for the input box
|
||||||
|
*/
|
||||||
|
ariaLabel?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface IDropdownStyles {
|
export interface IDropdownStyles {
|
||||||
@@ -124,7 +128,8 @@ export class Dropdown extends Disposable {
|
|||||||
validation: v => this._inputValidator(v)
|
validation: v => this._inputValidator(v)
|
||||||
},
|
},
|
||||||
placeholder: this._options.placeholder,
|
placeholder: this._options.placeholder,
|
||||||
actions: [this._toggleAction]
|
actions: [this._toggleAction],
|
||||||
|
ariaLabel: this._options.ariaLabel
|
||||||
});
|
});
|
||||||
|
|
||||||
this._register(DOM.addDisposableListener(this._input.inputElement, DOM.EventType.FOCUS, () => {
|
this._register(DOM.addDisposableListener(this._input.inputElement, DOM.EventType.FOCUS, () => {
|
||||||
|
|||||||
@@ -128,6 +128,7 @@ export class ConnectionWidget {
|
|||||||
validationOptions: {
|
validationOptions: {
|
||||||
validation: (value: string) => !value ? ({ type: MessageType.ERROR, content: serverNameOption.displayName + errorMessage }) : null
|
validation: (value: string) => !value ? ({ type: MessageType.ERROR, content: serverNameOption.displayName + errorMessage }) : null
|
||||||
},
|
},
|
||||||
|
ariaLabel: serverNameOption.displayName
|
||||||
});
|
});
|
||||||
|
|
||||||
if (this._optionsMaps[ConnectionOptionSpecialType.authType]) {
|
if (this._optionsMaps[ConnectionOptionSpecialType.authType]) {
|
||||||
@@ -141,12 +142,13 @@ export class ConnectionWidget {
|
|||||||
this._userNameInputBox = new InputBox(userNameBuilder.getHTMLElement(), this._contextViewService, {
|
this._userNameInputBox = new InputBox(userNameBuilder.getHTMLElement(), this._contextViewService, {
|
||||||
validationOptions: {
|
validationOptions: {
|
||||||
validation: (value: string) => self.validateUsername(value, userNameOption.isRequired) ? ({ type: MessageType.ERROR, content: userNameOption.displayName + errorMessage }) : null
|
validation: (value: string) => self.validateUsername(value, userNameOption.isRequired) ? ({ type: MessageType.ERROR, content: userNameOption.displayName + errorMessage }) : null
|
||||||
}
|
},
|
||||||
|
ariaLabel: userNameOption.displayName
|
||||||
});
|
});
|
||||||
|
|
||||||
let passwordOption = this._optionsMaps[ConnectionOptionSpecialType.password];
|
let passwordOption = this._optionsMaps[ConnectionOptionSpecialType.password];
|
||||||
let passwordBuilder = DialogHelper.appendRow(this._tableContainer, passwordOption.displayName, 'connection-label', 'connection-input');
|
let passwordBuilder = DialogHelper.appendRow(this._tableContainer, passwordOption.displayName, 'connection-label', 'connection-input');
|
||||||
this._passwordInputBox = new InputBox(passwordBuilder.getHTMLElement(), this._contextViewService);
|
this._passwordInputBox = new InputBox(passwordBuilder.getHTMLElement(), this._contextViewService, { ariaLabel: passwordOption.displayName });
|
||||||
this._passwordInputBox.inputElement.type = 'password';
|
this._passwordInputBox.inputElement.type = 'password';
|
||||||
this._password = '';
|
this._password = '';
|
||||||
|
|
||||||
@@ -158,9 +160,10 @@ export class ConnectionWidget {
|
|||||||
|
|
||||||
this._databaseNameInputBox = new Dropdown(databaseNameBuilder.getHTMLElement(), this._contextViewService, this._themeService, {
|
this._databaseNameInputBox = new Dropdown(databaseNameBuilder.getHTMLElement(), this._contextViewService, this._themeService, {
|
||||||
values: [this._defaultDatabaseName, this._loadingDatabaseName],
|
values: [this._defaultDatabaseName, this._loadingDatabaseName],
|
||||||
strictSelection : false,
|
strictSelection: false,
|
||||||
placeholder: this._defaultDatabaseName,
|
placeholder: this._defaultDatabaseName,
|
||||||
maxHeight: 125
|
maxHeight: 125,
|
||||||
|
ariaLabel: databaseOption.displayName
|
||||||
});
|
});
|
||||||
|
|
||||||
let serverGroupLabel = localize('serverGroup', 'Server group');
|
let serverGroupLabel = localize('serverGroup', 'Server group');
|
||||||
|
|||||||
Reference in New Issue
Block a user