BEM multi-word convention for Element or Modifier classes

[simurai]

This came up in #834 (comment).

Current

When a Block class requires two words use PascalCase, for example ProgressBar.

But we don't have a convention when Element or Modifier classes require two (or more) words.

Proposal

When an Element or Modifier class requires two words use camelCase, for example [Component]-closeButton or [Component]--extraLarge.

Alternatives

An alternative would be to use a - dash, like [Component]-close-button or [Component]--extra-large. But that might look like there are multiple nested elements. Or a modifier that has a unique child element. camelCase makes it more clear that the two words belong together.

/cc @primer/ds-core

[vercel]

This pull request is automatically deployed with Now.
To access deployments, click Details below or on the icon next to each push.

[shawnbot]

👨‍⚖️