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 | 1x 1x 1x 9x 1x 1x | import React from 'react'; import { string, bool, oneOf } from 'prop-types'; import StyledHeading from './StyledHeading'; const propTypes = { /** determines the size of the heading */ sizing: oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']), /** one of: high, normal, low */ emphasis: string, /** determines the html tag and size, if sizing prop is not specified */ as: oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']).isRequired, /** one of: neutral, primary, success, danger, warning */ color: string, /** if true adds a bottom margin according to vertical rhythm */ marginBottom: bool, }; const defaultProps = { color: 'neutral', marginBottom: false, emphasis: 'high', }; const Heading = ({ sizing, color, emphasis, marginBottom, as, ...rest }) => ( <StyledHeading as={as} sizing={sizing || as} marginBottom={marginBottom} color={color} emphasis={emphasis} {...rest} /> ); Heading.propTypes = propTypes; Heading.defaultProps = defaultProps; export default Heading; |