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; |