sample-compo.js

import React from 'react'
import classNames from 'classnames'

import styles from './styles.module.scss'

export default ({ negative = false, name, surname }) => (
  <div
    className={classNames(
      styles['name-container'],
      negative && styles['name-negative'],
    )}
  >
    <p className={styles['name-content']}>Hello, {name}.</p>
    <p>Or should I refer to you by {surname}?</p>
  </div>
)