Convert a string from camel case to kebab case.

camelToKebab.js

module.exports = (string) => {
    return string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();
};

string) => {
    return string
      .replace(/([a-z0-9])([A-Z])/g, '$1-$2')
      .replace(/([A-Z])([A-Z])(?=[a-z])/g, '$1-$2')
      .toLowerCase();
};

THANKS! handles "FooBar" -> "foo-bar" 👏🏻

@csvn perfect for me, thanks!

Stole this for a converter tool codepen: https://codepen.io/wpatter6/pen/wvweWZa

Nice! :)

UPDATED (5/6/2021):

The solution in my original comment worked in most browsers except Safari, which currently does not support lookbehind assertions in regular expressions. Here is an updated version that should work in any recent browser version, including Safari. It isn't too dissimilar from solutions posted above but does support all of the test cases outlined below, so thanks to those who posted the original solutions that got me most of the way to what I was looking for:

module.exports = (string) => {
    return string
        .replace(/\B([A-Z])(?=[a-z])/g, '-$1')
        .replace(/\B([a-z0-9])([A-Z])/g, '$1-$2')
        .toLowerCase();
};

When Safari starts supporting lookbehind assertions, the original solution would be viable for production work but I'm using the solution above until that happens.

ORIGINAL COMMENT:

Here is another one:

module.exports = (string) => {
    return string.replace(/\B(?:([A-Z])(?=[a-z]))|(?:(?<=[a-z0-9])([A-Z]))/g, '-$1$2').toLowerCase();
};

It supports the following conversions (either camel or pascal case to kebab case):

fooBar                              ->  foo-bar
FooBar                              ->  foo-bar
AFooBar                             ->  a-foo-bar
AFooBarACRONYM                      ->  a-foo-bar-acronym
ACRONYMFooBar                       ->  acronym-foo-bar
FooACRONYMBar                       ->  foo-acronym-bar
ACRONYMFooACRONYMBarACRONYM         ->  acronym-foo-acronym-bar-acronym
ACRONYM1Foo1ACRONYM2Bar1ACRONYM3    ->  acronym1-foo1-acronym2-bar1-acronym3

Here is another one:

module.exports = (string) => {
    return string.replace(/\B(?:([A-Z])(?=[a-z]))|(?:(?<=[a-z0-9])([A-Z]))/g, '-$1$2').toLowerCase();
};

It supports the following conversions (either camel or pascal case to kebab case):

fooBar                              ->  foo-bar
FooBar                              ->  foo-bar
AFooBar                             ->  a-foo-bar
AFooBarACRONYM                      ->  a-foo-bar-acronym
ACRONYMFooBar                       ->  acronym-foo-bar
FooACRONYMBar                       ->  foo-acronym-bar
ACRONYMFooACRONYMBarACRONYM         ->  acronym-foo-acronym-bar-acronym
ACRONYM1Foo1ACRONYM2Bar1ACRONYM3    ->  acronym1-foo1-acronym2-bar1-acronym3

unluckily it's not support in Safari :(

unluckily it's not support in Safari :(

I was curious why.... so here is why.

https://stackoverflow.com/a/51568859

Looks like Safari doesn't support lookbehind yet (that is, your (?<=/)).

@bradgreens @ibockowsky Yeah, I should have reported back when I found out about lack of support with lookbehind assertions in Safari. I ran into that during browser testing too.

I've updated my original comment with what I used to get around Safari's lack of lookbehind assertion support.