Extension API: Add an option to disable auto selection of matching items in QuickPicks

[qcz]

I would like to create an extension in which the user have to enter a string to operate with and I would like to show them some of the previous inputs he used, like in the search field of Visual Studio:

As far as I can see I cannot provide available values to InputBoxes, so I have to use a QuickPick. However QuickPicks do not allow users to pass a string not available for selection. An additional option would be great for QuickPicks to pass when a value even when it is not available (or an another option is to allow extensions to pass available values to InputBoxes)

[jrieken]

We now have a rich quick pick API that can do that

[qcz]

@jrieken: Not quite. The new quick pick API can almost do this, however if there are any items matching the entered text, it will be selected and returned automatically. For example:

If I try to enter a which is in itself is not on the list, the first item (cica) will be automatically marked as active, and I cannot distinguish whether the user want to select it or enter a as a new item like in the search filed in Visual Studio mentioned in the original post.

[jrieken]

This you really look at this: https://github.com/Microsoft/vscode/blob/c374fd7c6ed49681c27eda35d50f301f499045cc/src/vs/vscode.d.ts#L6200-L6210

[qcz]

Yeah, I actually tried the new API
https://github.com/Microsoft/vscode/blob/c374fd7c6ed49681c27eda35d50f301f499045cc/src/vs/vscode.d.ts#L6777-L6858
and could not achieve the desired functionality.

• Create a quickpick with window.createQuickPick.
• Handle onDidAccept. I can get the value entered by the user from QuickPick.value and and get the active item from QuickPick.activeItems.

But I have to distinguish two cases:

• The user entered a new value. Straightforward, if no items match the filter text as activeItems, as it will be empty.
• The user entered a new value, but there are some items which match the current filter text. This splits into two cases:
  • The user wants to select an item from the quick pick. Straightforward again, it will be in activeItems.
  • The user does NOT want to use that historical entry but the text entered in the input on the top. To illustrate this with the original search idea, I want to search for a, not cica which is in the list of items passed to the QuickPick. The current QuickPick implementation automatically selects the first matching item and passes it in the activeItems array, so I am not able to properly distinguish the two states (the user wants an item from the list or wants to use the text from the filter, which is NOT equals to the content of any items present on the list).

If I missed something in the new API (some property or event handler which is able to distinguish the two cases), please direct me to it. I know that it may be implemented with a use of a button, but it is an additional user interaction which is unnecessary, input fields with historic items are present in almost every application and they are working without an additional button, just they do not select items which does not match exactly.

[jrieken]

I want to search for a, not cica which is in the list of items passed to the QuickPick.

The idea is that you get pinged when typing happens onDidChangeValue and that you start searching then (use busy to signal that). Your results should then appear in the list

[qcz]

I think you still misunderstand the request. My extension has "Filter lines using a string" and "Filter lines using a regex" which basically removes all lines from the current file which does not match the string or regex entered by the user. After the usage of a given command I want to save the last entered filter string, so I can provide history for the user. Like if you search in basically every application, it usually shows some of the last few searches.
So I create a QuickPick, feed it the historical items to it. The list of items does not change as the user types, as it is a fixed list with e.g. the last 5 filter strings. The problem is not whether I can display items in the quick pick or not. I can. However if there are an item called cica in the list, and the user enter a because they want to use it as the filter string, they can't do it, because cica (or the first matching item in the history) is always selected, and I cannot see any way to distinguish the two cases with the current API. Selection should happen if and only if the user selects an item with the mouse or keyboard arrows.

Here is my annotated toy code:

const qp = vscode.window.createQuickPick();
qp.items = [
	{label: "cica"},
	{label: "cica2"},
];
qp.onDidAccept(() => {
	// If there are any items which contains the filter text (qp.value)
	// how on earth can I decide whether the user want to use the filter text
	// or the active item?

	// If the filter text (qp.value) is 'a', qp.activeItems will automatically contains an
	// element, because 'cica' matches 'a' and is automatically selected by QuickPick.
	// The selection event should happen if and only if the user selects it with 
	// the mouse or keyboard arrows.

	if (qp.activeItems.length) {
		console.log(qp.activeItems[0]);
	} else {
		console.log(qp.value);
	}
	qp.hide();
	qp.dispose();
});
qp.show();

[qcz]

@jrieken: Any thoughts?

[jrieken]

Yeah - I thought the API makes a difference between active and selected items but it seems to be the same. What you want seems to a quick input with default values or quick pick without picking... Assigning to @chrmarti for comment/ideas

[qcz]

@jrieken: Yeah, exactly! Thanks!

[jrieken]

Hm, so adding this to your snippet does the job

qp.onDidChangeValue(() => {
      qp.activeItems = [];
})

[jrieken]

that will give you want you have typed unless the user has selected an entry with arrow keys or the mouse

[qcz]

I'll try it tonight! Thanks!

[qcz]

@jrieken: It is not the most intuitive solution, and the selection flickers while the user types and there are matching items, but it works for my use case, so thank you very much for the tip!

An option to disable auto selection would still be great.

[qcz]

I've modified the issue title to reflect the request.

[vscodebot]

We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process here. If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.

If you wonder what we are up to, please see our roadmap and issue reporting guidelines.

Thanks for your understanding and happy coding!

[mmgeorge]

I know this is closed, but just wanted to chime in that I'm running into the same problem. My use case is that I have an outliner extension that's using the quickPick. When I search, I have some custom logic so that I can type in "#f foo" to search for foo only in functions. I can achieve mostly what I want to do by:

• Turning on matchOnDescription
• Taking my custom search and including it in the description of each pick item (I append it after a long empty string to hide it in the picker, does result in the ... though, also means I don't get nice highlighting of matching characters on search). I need to to prevent items from being reordered since otherwise outline items won't appear in the right place.

This unfortunately though results in some flicking as the activeItem seems to change once before onDidChangeValue fires:

flicker.mp4