闭社主体 forked from https://github.com/tootsuite/mastodon
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

51 lines
1.0 KiB

  1. import React from 'react';
  2. import PropTypes from 'prop-types';
  3. import classNames from 'classnames';
  4. export default class Button extends React.PureComponent {
  5. static propTypes = {
  6. text: PropTypes.node,
  7. onClick: PropTypes.func,
  8. disabled: PropTypes.bool,
  9. block: PropTypes.bool,
  10. secondary: PropTypes.bool,
  11. className: PropTypes.string,
  12. title: PropTypes.string,
  13. children: PropTypes.node,
  14. };
  15. handleClick = (e) => {
  16. if (!this.props.disabled) {
  17. this.props.onClick(e);
  18. }
  19. }
  20. setRef = (c) => {
  21. this.node = c;
  22. }
  23. focus() {
  24. this.node.focus();
  25. }
  26. render () {
  27. const className = classNames('button', this.props.className, {
  28. 'button-secondary': this.props.secondary,
  29. 'button--block': this.props.block,
  30. });
  31. return (
  32. <button
  33. className={className}
  34. disabled={this.props.disabled}
  35. onClick={this.handleClick}
  36. ref={this.setRef}
  37. title={this.props.title}
  38. >
  39. {this.props.text || this.props.children}
  40. </button>
  41. );
  42. }
  43. }