 Our new button component now encapsulates a lot of information for us, the type of component to render, this attribute that we'd like to have on there by default, and the base class name that our CSS framework uses. What I'm not pleased with is that all of these specializations require a knowledge of the CSS structure underneath. So this component has to know that it's using a class button danger to style all of the specifics of this button. Instead, I'd like to delete this altogether and pass in a prop. In this case, we can just use danger, we can then go into our component, take the danger prop and add that class name to our array when the danger prop exists. Very cool. So we can do the same for our primary button and this info button. We'll go back and destructure both of those props out, again, adding those classes anytime the props exist. Content primary info button info. Now this little map insulates us from changes to these classes, because in all of our specialty components that use this base button component, we're using the API that we define, not one that we inherited from a CSS framework.