All files / components/Text Text.js

100% Statements 7/7
100% Branches 0/0
100% Functions 1/1
100% Lines 7/7

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58          1x                             1x                 1x                 4x 4x                           1x 1x      
import React from 'react';
import { string, bool, oneOf } from 'prop-types';
import StyledText from './StyledText';
import { useColorBoxContext } from '../ColorBox/context';
 
const propTypes = {
  /** determines the size of the text; one of: l, m, s, xs */
  sizing: string,
  /** one of: neutral, primary, success, danger, warning */
  color: string,
  /** one of: high, normal, low */
  emphasis: string,
  /** determines whether we ignore the colors defined for the background */
  ignoreBg: bool,
  /** rendered html tag */
  as: oneOf(['span', 'p']),
  /** if true adds a bottom margin according to vertical rhythm */
  marginBottom: bool,
};
 
const defaultProps = {
  sizing: 'm',
  color: 'neutral',
  ignoreBg: false,
  as: 'span',
  marginBottom: false,
  emphasis: 'high',
};
 
const Text = ({
  sizing,
  color,
  ignoreBg,
  marginBottom,
  emphasis,
  as,
  ...rest
}) => {
  const bgColor = useColorBoxContext();
  return (
    <StyledText
      as={as}
      marginBottom={marginBottom}
      sizing={sizing}
      color={color}
      emphasis={emphasis}
      ignoreBg={ignoreBg}
      bgColor={bgColor}
      {...rest}
    />
  );
};
 
Text.propTypes = propTypes;
Text.defaultProps = defaultProps;
 
export default Text;