CSS-in-JS example #2

MyComponent.js

import { apiFunc } from 'some-css-in-js-project';

const styles = {
  base: {
    color: '#fff',
    ':hover': {
      backgroundColor: '#0074d9',
    },
  },
  primary: {
    backgroundColor: '#0074D9'
  },
  warning: {
    'background-color': someValueReturnedByAFunction(),
  },
};
	
export const MyComponent = () => (
  <div className={apiFunc(styles.base, styles.warning)}>
    Some content
  </div>
);