Process className key in a destructured object #44
Description
// message.js
import './message.css';
function Message(props) {
return <div {...props} styleName="message">message</div>;
}
render(<Message className="message--mine" />);/* message.css */
.message { ... }The output looks like this:
import './message.css';
function Message(props) {
return <div {...props} className="message___3Hgmr">message</div>;
}
render(<Message className="message--mine" />);The className from props is overwritten, but I would like it to be included in the final className assignment since className was not specified on the div. I think getClassNames should accept a third parameter: every object that is destructured before the styleName attribute. getClassNames would iterate through these objects looking for className, then include whichever className appears last in the list of objects in the final className assignment.
Something like this:
import './message.css';
function Message(props) {
return <div {...props} className={getClassName("message", map, props/*, other, destructured, objects */)}>message</div>;
}
render(<Message className="message--mine" />);
// outputs <div className="message--mine message___3Hgmr">message</div>