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 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 | 2x 2x 2x 2x 2x 2x | import PropTypes from "prop-types"; const VARIANTS = ["secondary", "outline", "danger", "white"]; const SIZES = ["big"]; const Button = ({ children = null, className, href, loading = false, onClick = () => {}, size = null, variant, type = "button", ...rest }) => { let btnClass = "qpp-c-button"; if (VARIANTS.includes(variant)) { btnClass = btnClass.concat(" ", `qpp-c-button--${variant}`); } if (SIZES.includes(size)) { btnClass = btnClass.concat(" ", `qpp-c-button--${size}`); } if (className) { btnClass = btnClass.concat(" ", className); } if (href) { return ( <a href={href} data-testid="ds-btn" className={btnClass || ""} onClick={onClick} > {children} </a> ); } return ( <button data-testid="ds-btn" className={btnClass || ""} onClick={onClick} disabled={loading} type={type} {...rest} > {children} </button> ); }; Button.propTypes = { children: PropTypes.node, className: PropTypes.string, href: PropTypes.string, loading: PropTypes.bool, onClick: PropTypes.func, size: PropTypes.oneOf(SIZES), type: PropTypes.string, variant: PropTypes.oneOf(VARIANTS), }; export const TextButton = ({ className = "", ...props }) => ( <Button className={`qpp-c-button--text ${className}`} {...props} /> ); TextButton.propTypes = { className: PropTypes.string, }; export default Button; |