Related #1408

• Add _wp_to_kebab_case function
• Add CSS Custom Properties within preset classes.

How to test

• Create a file at src/wp-content/themes/twentytwentyone/theme.json with the following contents:

{
    "version": 1,
    "settings": {
        "color": {
            "palette": [
                {"slug": "black2black", "color": "#000", "name": "Black"}
            ]
        }
    }
}

• Start the bundled wordpress-develop enviroment.

Front-end:

• Go to the front-end and inspect the contents of the global-styles-inline-css embedded stylesheet. The expected result is that the corresponding CSS Custom Property and classes for that color are present and look like this:

body {
  /* ... */
  --wp--preset--color--black-2-black: #000;
}
.has-black-2-black-color {
  color: var(--wp--preset--color--black-2-black) !important;
}
.has-black-2-black-background-color {
  background-color: var(--wp--preset--color--black-2-black) !important;
}

Post editor:

• Load a post and confirm the presence of the CSS Custom Property above. Also the classes and that they use the custom property as well.