diff options
Diffstat (limited to 'src/components/Button.js')
| -rw-r--r-- | src/components/Button.js | 29 |
1 files changed, 19 insertions, 10 deletions
diff --git a/src/components/Button.js b/src/components/Button.js index d7928c7..f56049e 100644 --- a/src/components/Button.js +++ b/src/components/Button.js @@ -1,20 +1,29 @@ import React from 'react'; -import PropTypes from 'prop-types'; import s0 from 'c/Button.module.css'; const noop = () => {}; -const Button = React.memo(function Button({ label, onClick = noop }) { +const { memo, forwardRef } = React; + +function Button({ children, label, onClick = noop }, ref) { + return ( + <button className={s0.btn} ref={ref} onClick={onClick}> + {children || label} + </button> + ); +} + +function WithIcon({ text, icon, onClick = noop }, ref) { return ( - <button className={s0.btn} onClick={onClick}> - {label} + <button className={s0.btn} ref={ref} onClick={onClick}> + <div className={s0.withIconWrapper}> + {icon} + <span className={s0.txt}>{text}</span> + </div> </button> ); -}); +} -Button.propTypes = { - label: PropTypes.string.isRequired, - onClick: PropTypes.func -}; +export const ButtonWithIcon = memo(forwardRef(WithIcon)); -export default Button; +export default memo(forwardRef(Button)); |
