Line break react component

Break.jsx

/**
 * @module {Function} components/Break
 * @flow
 */
import * as React from 'react';
import {css} from 'emotion';

const style = css`
  margin: 0;
  padding: 0;
`;

const styleClear = css`
  ${style}
  &::after {
    content: '';
    display: table;
    clear: both;
  }
`;

const Break = ({
  line,
  clear,
}: {
  line?: boolean,
  clear?: boolean,
}): React.Node => {
  const className = clear
    ? styleClear
    : style;

  return (line
    ? <hr className={className} />
    : <br className={className} />
  );
};
Break.displayName = 'Break';

export default Break;

Break.spec.jsx

/**
 * components/Break.spec.js
 */
import React from 'react';
import {shallow} from 'enzyme';
import Break from './Break';

const setup = propOverrides => {
  const minProps = {};
  const props = {
    ...minProps,
    ...propOverrides,
  };
  const output = shallow(<Break {...props} />);
  return {
    props,
    output,
  };
};

describe('<Break />', () => {
  it('does not explode', () => {
    // This will fail if component throws
    const {output} = setup();
    expect(output.exists()).toBeTruthy();
  });
  it('renders with <hr> when line=true', () => {
    const {output} = setup({line: true});
    expect(output.find('hr')).toBeTruthy();
  });
});