Skip to content

Commit 9c4a29c

Browse files
authored
Make sure tree find widget can be moved using the keyboard (microsoft#156583)
fixes microsoft#156251
1 parent 35042f5 commit 9c4a29c

File tree

2 files changed

+28
-4
lines changed

2 files changed

+28
-4
lines changed

src/vs/base/browser/dom.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1869,9 +1869,11 @@ export function h(tag: string, ...args: [] | [attributes: { $: string } & Partia
18691869
typeof cssValue === 'number' ? cssValue + 'px' : '' + cssValue
18701870
);
18711871
}
1872-
continue;
1872+
} else if (key === 'tabIndex') {
1873+
el.tabIndex = value;
1874+
} else {
1875+
el.setAttribute(camelCaseToHyphenCase(key), value.toString());
18731876
}
1874-
el.setAttribute(camelCaseToHyphenCase(key), value.toString());
18751877
}
18761878

18771879
result['root'] = el;

src/vs/base/browser/ui/tree/abstractTree.ts

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -685,7 +685,7 @@ export enum TreeFindMode {
685685
class FindWidget<T, TFilterData> extends Disposable {
686686

687687
private readonly elements = h('.monaco-tree-type-filter', [
688-
h('.monaco-tree-type-filter-grab.codicon.codicon-debug-gripper@grab'),
688+
h('.monaco-tree-type-filter-grab.codicon.codicon-debug-gripper@grab', { tabIndex: 0 }),
689689
h('.monaco-tree-type-filter-input@findInput'),
690690
h('.monaco-tree-type-filter-actionbar@actionbar'),
691691
]);
@@ -699,7 +699,7 @@ class FindWidget<T, TFilterData> extends Disposable {
699699
private readonly findInput: FindInput;
700700
private readonly actionbar: ActionBar;
701701
private width = 0;
702-
private right = 4;
702+
private right = 0;
703703

704704
readonly _onDidDisable = new Emitter<void>();
705705
readonly onDidDisable = this._onDidDisable.event;
@@ -772,6 +772,28 @@ class FindWidget<T, TFilterData> extends Disposable {
772772
}));
773773
}));
774774

775+
const onGrabKeyDown = this._register(Event.chain(this._register(new DomEmitter(this.elements.grab, 'keydown')).event))
776+
.map(e => new StandardKeyboardEvent(e))
777+
.event;
778+
779+
this._register(onGrabKeyDown((e): any => {
780+
let right: number | undefined;
781+
782+
if (e.keyCode === KeyCode.LeftArrow) {
783+
right = Number.POSITIVE_INFINITY;
784+
} else if (e.keyCode === KeyCode.RightArrow) {
785+
right = 0;
786+
} else if (e.keyCode === KeyCode.Space) {
787+
right = this.right === 0 ? Number.POSITIVE_INFINITY : 0;
788+
}
789+
790+
if (right !== undefined) {
791+
e.preventDefault();
792+
e.stopPropagation();
793+
this.right = right;
794+
this.layout();
795+
}
796+
}));
775797

776798
this.onDidChangeValue = this.findInput.onDidChange;
777799
this.style(options ?? {});

0 commit comments

Comments
 (0)