Snippet regex: match arbitrary number of groups and transform to CamelCase

Question

In a Visual Studio Code Snippet I'm writing I want to convert a snake case string to camel case.

From the docs I know that the syntax is

'${' var '/' regex '/' (format | text)+ '/' options '}'

so I've come up with this :

${TM_FILENAME_BASE/([a-z])([a-z]*)_+([a-z])([a-z]*)_+/${1:/upcase}$2${3:/upcase}$4/}

This code however works only for strings with 2 elements (for exemple "carrot_cake") while I would like to process strings with arbitrary number of elements ("blueberry_pie_with_a_cup_of_coffee").

I guess that some kind of recursion is needed in 'regex' and 'format', but I have no idea of what to do.

How does one match arbitrary number of pattern occurrences?

Answer 1

UPDATE

vscode v1.58 is adding a /camelcase transform. which makes your use case very easy now.

"${1/(.)(.*)/${1:/upcase}${2:/camelcase}/}"

to go from blueberry_pie_with_a_cup_of_coffee to BlueberryPieWithACupOfCoffee

---

"${1/(.*)/${1:/camelcase}/}" // just capture the whole thing

to go from blueberry_pie_with_a_cup_of_coffee to blueberryPieWithACupOfCoffee

vscode's implementation uses this regex: [a-zA-Z0-9] so anything other than those characters will be seen as separators - and the following "word" will be capitalized.

---

---

Previous answer::

To transform an arbitrary number of "_" separated words into CamelCase try:

EDIT: In October, 2018 (but not yet added to snippet grammar documentation as of February, 2020) vscode added the /pascalcase transform, see commit. I have modified the code below to use the /pascalcase transform. It only works for the some_file => SomeFile type of CamelCase though.

But it works with many characters as separators, these all work:

blueberry_pie_with_a_cup_of_coffee
blueberry-pie-with-a-cup-of-coffee
blueberry-pie-with_a-cup-of_coffee
blueberry-pie-with.a-cup-of.coffee
blueberry*pie-with.a*cup-of.coffee
blueberry*[email protected]*cup1of.coffee
blueberry*[email protected]*cup1of.coffee

---

"camelCase": {
    "prefix": "_cc",
    "body": [
            // "${TM_FILENAME_BASE/([a-z]*)_+([a-z]*)/${1:/capitalize}${2:/capitalize}/g}"

            "${TM_FILENAME_BASE/(.*)/${1:/pascalcase}/g}"
        ],
        "description": "Transform to camel case"
    },

carrot_cake.txt -> CarrotCake

blueberry_pie_with_a_cup_of_coffee.js -> BlueberryPieWithACupOfCoffee

[I assume CamelCase is the form you want, there are others, such as camelCase.]

For camelCase:

"${TM_FILENAME_BASE/([a-z]*)[-@_.*0-9]+([a-z]*)/$1${2:/capitalize}/g}"

put your desired list of separators in the [-@_.*0-9]+ part. The + quantifier allows you to use carrot--cake for example - multiple separators between words. Thanks to the other answer for using the [list the separators] part of the regex.

Note that the "g" flag at the end is doing most of that work for you in getting however many matches there are beyond the two explicitly captured.

I left the capture groups as ([a-z]*) as you had them. You may want to use ([A-Za-z0-9]*) for more flexibility.

Answer 2

vs code snippet transform to camelCase:

"test": {
    "prefix": "test",
    "body": [
        "${1:${TM_FILENAME_BASE/^(.)([a-zA-Z0-9]*)([-_.])(.*)/${1:/downcase}${2}${4:/pascalcase}/}}"
    ]
}

wrapper is ${1:},

inner is ${TM_FILENAME_BASE/^(.)([a-zA-Z0-9]*)([-_.])(.*)/${1:/downcase}${2}${4:/pascalcase}/}

wrapper is ${}

inner is TM_FILENAME_BASE/^(.)([a-zA-Z0-9]*)([_\\W])(.*)/${1:/downcase}${2}${4:/pascalcase}/

string is TM_FILENAME_BASE

-------------------------------------------------------split

part 1 is /^(.)([a-zA-Z0-9]*)([-_.])(.*)

part 1.1 is ^(.) → $1, first character

part 1.2 is ([a-zA-Z0-9]*) → $2

part 1.3 is ([_\\W]) → $3, delimiter, ignore

part 1.4 is (.*) → $4

-------------------------------------------------------replace

part 2 is /${1:/downcase}${2}${4:/pascalcase}/

part 2.1 ${1:/downcase} → lowercase

part 2.2 ${2} → normal

part 2.3 ${4:/pascalcase}

---

for-bar.service.js → fooBarService

---

Not strong enough, but enough.