The ability to pass an array of CSS classes to class prop

[Atulin]

Right now, if I wanted to pass styles.button and styles.increment classes to a button, I have two options:

<button class={`${styles.button} ${styles.increment}`}>+</button>

or

<button classList={{
  [styles.button as string]: true,
  [styles.increment as string]: true,
}}>
  +
</button>

The latter is just... eugh. The former is better, but something about using string interpolation rubs me the wrong way. I know the imported CSS classes end up being just strings, but there is a weird feeling of losing some type safety, somehow.

I came to use

<button class={[styles.button, styles.increment].join(' ')}>+</button>

recently, and it got me thinking: perhaps Solid could support just straight out passing an array into the class prop?

Imagine:

<button class={[styles.button, styles.increment]}>+</button>

or

<button classList={[styles.button, styles.increment]}>+</button>

[Atulin]

Whoops, looks like a discussion like this already exists. My bad!

#1737