860ffc0560
Focus the submit button when confirmation modal is opened. Also, changed cancellation link to button. This makes the meaning clearer.
65 lines
1.3 KiB
JavaScript
65 lines
1.3 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import classNames from 'classnames';
|
|
|
|
class Button extends React.PureComponent {
|
|
|
|
static propTypes = {
|
|
text: PropTypes.node,
|
|
onClick: PropTypes.func,
|
|
disabled: PropTypes.bool,
|
|
block: PropTypes.bool,
|
|
secondary: PropTypes.bool,
|
|
size: PropTypes.number,
|
|
className: PropTypes.string,
|
|
style: PropTypes.object,
|
|
children: PropTypes.node,
|
|
};
|
|
|
|
static defaultProps = {
|
|
size: 36,
|
|
};
|
|
|
|
handleClick = (e) => {
|
|
if (!this.props.disabled) {
|
|
this.props.onClick();
|
|
}
|
|
}
|
|
|
|
setRef = (c) => {
|
|
this.node = c;
|
|
}
|
|
|
|
focus() {
|
|
this.node.focus();
|
|
}
|
|
|
|
render () {
|
|
const style = {
|
|
padding: `0 ${this.props.size / 2.25}px`,
|
|
height: `${this.props.size}px`,
|
|
lineHeight: `${this.props.size}px`,
|
|
...this.props.style,
|
|
};
|
|
|
|
const className = classNames('button', this.props.className, {
|
|
'button-secondary': this.props.secondary,
|
|
'button--block': this.props.block,
|
|
});
|
|
|
|
return (
|
|
<button
|
|
className={className}
|
|
disabled={this.props.disabled}
|
|
onClick={this.handleClick}
|
|
ref={this.setRef}
|
|
style={style}
|
|
>
|
|
{this.props.text || this.props.children}
|
|
</button>
|
|
);
|
|
}
|
|
|
|
}
|
|
|
|
export default Button;
|