ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-17 02:51:36 -05:00
Code Issues Packages Projects Releases Wiki Activity

make group container accessible (#8452)

Browse Source
This commit is contained in:
Alan Ren
2019-11-24 12:23:16 -08:00
committed by GitHub
parent be7c26ede5
commit 46a8410fc5
1 changed files with 21 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/sql/workbench/browser/modelComponents/groupContainer.component.ts
View File

@@ -14,11 +14,14 @@ import { GroupLayout, GroupContainerProperties } from 'azdata';
import { ContainerBase } from 'sql/workbench/browser/modelComponents/componentBase'; import { ContainerBase } from 'sql/workbench/browser/modelComponents/componentBase';
import { endsWith } from 'vs/base/common/strings'; import { endsWith } from 'vs/base/common/strings';
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { KeyCode } from 'vs/base/common/keyCodes';
import * as DOM from 'vs/base/browser/dom';
@Component({ @Component({
selector: 'modelview-groupContainer', selector: 'modelview-groupContainer',
template: ` template: `
<div *ngIf="hasHeader()" [class]="getHeaderClass()" (click)="changeState()"> <div *ngIf="hasHeader()" [class]="getHeaderClass()" (click)="changeState()" [tabindex]="isCollapsible()? 0 : -1" [attr.role]="isCollapsible() ? 'button' : null" [attr.aria-expanded]="isCollapsible() ? !collapsed : null">
{{_containerLayout.header}} {{_containerLayout.header}}
</div> </div>
<div #container *ngIf="items" class="modelview-group-container" [style.width]="getContainerWidth()" [style.display]="getContainerDisplayStyle()"> <div #container *ngIf="items" class="modelview-group-container" [style.width]="getContainerWidth()" [style.display]="getContainerDisplayStyle()">
@@ -48,6 +51,23 @@ export default class GroupContainer extends ContainerBase<GroupLayout> implement
ngOnInit(): void { ngOnInit(): void {
this.baseInit(); this.baseInit();
this.onkeydown(this._el.nativeElement, (e: StandardKeyboardEvent) => {
if (e.keyCode === KeyCode.Enter || e.keyCode === KeyCode.Space) {
this.changeState();
DOM.EventHelper.stop(e, true);
}
else if (e.keyCode === KeyCode.LeftArrow) {
if (!this.collapsed) {
this.changeState();
}
DOM.EventHelper.stop(e, true);
} else if (e.keyCode === KeyCode.RightArrow) {
if (this.collapsed) {
this.changeState();
}
DOM.EventHelper.stop(e, true);
}
});
} }
ngOnDestroy(): void { ngOnDestroy(): void {