only handle the keyboard events on header (#8488)

This commit is contained in:
Alan Ren
2019-11-26 13:42:04 -08:00
committed by GitHub
parent d1ccbf028f
commit 20e9b329b1

View File

@@ -21,7 +21,7 @@ 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()" [tabindex]="isCollapsible()? 0 : -1" [attr.role]="isCollapsible() ? 'button' : null" [attr.aria-expanded]="isCollapsible() ? !collapsed : null"> <div *ngIf="hasHeader()" [class]="getHeaderClass()" (click)="changeState()" (keydown)="onKeyDown($event)" [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()">
@@ -51,7 +51,17 @@ export default class GroupContainer extends ContainerBase<GroupLayout> implement
ngOnInit(): void { ngOnInit(): void {
this.baseInit(); this.baseInit();
this.onkeydown(this._el.nativeElement, (e: StandardKeyboardEvent) => { }
ngOnDestroy(): void {
this.baseDestroy();
}
ngAfterViewInit(): void {
}
onKeyDown(event: KeyboardEvent): void {
let e = new StandardKeyboardEvent(event);
if (e.keyCode === KeyCode.Enter || e.keyCode === KeyCode.Space) { if (e.keyCode === KeyCode.Enter || e.keyCode === KeyCode.Space) {
this.changeState(); this.changeState();
DOM.EventHelper.stop(e, true); DOM.EventHelper.stop(e, true);
@@ -67,14 +77,6 @@ export default class GroupContainer extends ContainerBase<GroupLayout> implement
} }
DOM.EventHelper.stop(e, true); DOM.EventHelper.stop(e, true);
} }
});
}
ngOnDestroy(): void {
this.baseDestroy();
}
ngAfterViewInit(): void {
} }
/// IComponent implementation /// IComponent implementation
@@ -94,7 +96,7 @@ export default class GroupContainer extends ContainerBase<GroupLayout> implement
} }
private hasHeader(): boolean { private hasHeader(): boolean {
return this._containerLayout && this._containerLayout.header !== undefined; return this._containerLayout && !!this._containerLayout.header;
} }
private isCollapsible(): boolean { private isCollapsible(): boolean {