askirmas/react-classnaming

#bem Root-key (base) can be "b__e" and treat `undefined` as true

Closed this issue · 0 comments

Related: #30
For verbosity

const icon = {"material-icons": true} as const
const ripple = "mdc-ripple-upgraded" as const
const {button__icon, button__ripple, button__lable} = {} as MyClassNames

<button {...bem({button: "raised", [ripple]: "background-focused"})}>
  <span  {...bem({button__ripple})}/>
  <i  {...bem({button__icon, ...icon})}>bookmark</i>
  <span  {...bem({button__label})}>Contained Button plus Icon</span>
</button>

Thus becomes similar to naming

classnames[R]? value naming bem
- undefined R ?R
+ undefined C ?C
- false ? R | delete R ? R | delete R
+ false ? C | delete R ? C | delete R
- true R R
+ true C C
- string value R R--value
+ string !R, value | C | Error C C--value
- null ?delete R ?delete R
+ null ?delete R ?delete R
- primitive[] ? R R--value?
+ primitive[] ? C C--value?
- {[k]: string} ? R R--key--val
+ {[k]: boolean} ? C C--key?