Microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-04-29 21:11:38 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(selectBox): improve handling of disabled options and separators

Browse Source
This commit is contained in:
mrleemurray
2026-02-26 11:21:09 +00:00
parent 49ad861e9b
commit 911b82a84b
3 changed files with 29 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/vs/base/browser/ui/selectBox/selectBoxCustom.css
View File

@@ -113,7 +113,6 @@
background-color: var(--vscode-menu-separatorBackground);
}
/* Accepted CSS hiding technique for accessibility reader text */
/* https://webaim.org/techniques/css/invisiblecontent/ */

40
src/vs/base/browser/ui/selectBox/selectBoxCustom.ts
View File

@@ -1017,12 +1017,16 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
// Allow scrolling to settle
setTimeout(() => {
this.selected = this.selectList.getFocus()[0];
let candidate = this.selectList.getFocus()[0];
// Shift selection down if we land on a disabled option
while (this.selected < this.options.length - 1 && this.options[this.selected].isDisabled) {
this.selected++;
while (candidate < this.options.length - 1 && this.options[candidate].isDisabled) {
candidate++;
}
if (this.options[candidate].isDisabled) {
return;
}
this.selected = candidate;
this.selectList.setFocus([this.selected]);
this.selectList.reveal(this.selected);
this.select(this.selected);
@@ -1036,12 +1040,16 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
// Allow scrolling to settle
setTimeout(() => {
this.selected = this.selectList.getFocus()[0];
let candidate = this.selectList.getFocus()[0];
// Shift selection up if we land on a disabled option
while (this.selected > 0 && this.options[this.selected].isDisabled) {
this.selected--;
while (candidate > 0 && this.options[candidate].isDisabled) {
candidate--;
}
if (this.options[candidate].isDisabled) {
return;
}
this.selected = candidate;
this.selectList.setFocus([this.selected]);
this.selectList.reveal(this.selected);
this.select(this.selected);
@@ -1054,10 +1062,14 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
if (this.options.length < 2) {
return;
}
this.selected = 0;
while (this.selected < this.options.length - 1 && this.options[this.selected].isDisabled) {
this.selected++;
let candidate = 0;
while (candidate < this.options.length - 1 && this.options[candidate].isDisabled) {
candidate++;
}
if (this.options[candidate].isDisabled) {
return;
}
this.selected = candidate;
this.selectList.setFocus([this.selected]);
this.selectList.reveal(this.selected);
this.select(this.selected);
@@ -1069,10 +1081,14 @@ export class SelectBoxList extends Disposable implements ISelectBoxDelegate, ILi
if (this.options.length < 2) {
return;
}
this.selected = this.options.length - 1;
while (this.selected > 0 && this.options[this.selected].isDisabled) {
this.selected--;
let candidate = this.options.length - 1;
while (candidate > 0 && this.options[candidate].isDisabled) {
candidate--;
}
if (this.options[candidate].isDisabled) {
return;
}
this.selected = candidate;
this.selectList.setFocus([this.selected]);
this.selectList.reveal(this.selected);
this.select(this.selected);

3
src/vs/base/browser/ui/selectBox/selectBoxNative.ts
View File

@@ -183,10 +183,9 @@ export class SelectBoxNative extends Disposable implements ISelectBoxDelegate {
const option = document.createElement('option');
option.value = value;
option.text = value;
option.disabled = !!disabled;
option.disabled = !!disabled || !!isSeparator;
if (isSeparator) {
option.disabled = true;
option.setAttribute('role', 'separator');
}