Vscode: Support for choices in snippets

[thekalinga]

• VSCode Version:

Version 1.9.0-insider
Commit 32222e2eefc7a0afe9a1a0ecb4794119efd9bc81
Date 2016-12-16T07:18:07.856Z
Shell 1.4.6
Renderer 53.0.2785.143
Node 6.5.0

• OS Version:

Ubuntu 14.04

Currently there is no way to specify a simple choices in the templates which makes developers life easy when expanding templates

For eg.,

For bootstrap buttons, there are almost 6 types. If we need to support templates for bootstrap button, we need to add either 6 templates/a single template with the template variable class's default value as

<button class="btn btn-${1:default|primary|secondary|info|warning|danger}">$2</button>

While selecting this template, the user needs to delete the complete selection & type the required choice/selectively delete portions of this default value.

Instead, if snippets consider any value with pipe| separators to be choice & display a dropdown, then the user just need to use his up & down arrows in the keyboard/mouse click to select the actual choice.

This will improve the user experience for expanding templates significantly & improve developer productivity.

[egamma]

@jrieken FYI

[jrieken]

<button class="btn btn-${1:default|primary|secondary|info|warning|danger}">$2</button>

@thekalinga What syntax is that? Looking at the TextMate doc it should be <button class="btn btn-${1|default,primary,secondary,info,warning,danger|}">$2</button>. Is that from another editor?

[thekalinga]

Thanks for pointing the text mate syntax

I'll change the format of the code to this and check if this works in vscode

Is that from another editor?

Its an adhoc format I have added.

[jrieken]

Ok - btw it is not (yet) working in VS Code. I just wanted to check with the syntax such that I implement the proper thing

[thekalinga]

Textmate pattern should be a better option than the adhoc format I used in the issue description.

[thekalinga]

@jrieken Any idea on whether this would be picked up in the next iteration?

I just created a plugin for angular material for intellij & the choices for material icons are a lot (in hundreds). In IntelliJ, it works nice as they have option show choices. But when targetting vscode, I have to kill the feature of showing material icon name suggestions as we dont yet support choices.

Thanks

[jrieken]

It will happen this spring. We planning on some clean up work which includes deprecating our old, internal syntax. Because folks depended on that we cannot yet remove it

[ramya-rao-a]

The new emmet snippets are following this format as well
See https://github.com/emmetio/snippets/blob/master/css.json#L8

[jrieken]

Ok, proposing to do this during May. It requires updates to the parser and some picker UI/suggest widget

[jrieken]

Sorry, no time left in May to do this...

[thekalinga]

Hi,

Any luck in implementing it this month?

[jrieken]

Fyi @aeschli and @DustinCampbell - this will land with the July release and should unlock cool IntelliSense scenarios like proposing arguments when completion a method call, like so

int a = 234;
int b = 567

Funct| // e.g completion like this `FunctionTakingAnInt(${1|a,b|});`

It will show a new suggest box with a and b to choose from

[thekalinga]

@jrieken The suggestions dialog is working only in forward direction & not working working if I navigate in reverse direction by pressing shift+tab. i.e, after selecting a suggestion from the choices, if I move forward by pressing tab & then press shift+tab, the IDE should show the suggestions again with the previous selection highlighted. But thats not happening. Please fix this