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.

Dialog.web.js 1.9KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. import PropTypes from 'prop-types';
  2. import React from 'react';
  3. import { connect } from 'react-redux';
  4. import AbstractDialog from './AbstractDialog';
  5. import StatelessDialog from './StatelessDialog';
  6. /**
  7. * Web dialog that uses atlaskit modal-dialog to display dialogs.
  8. */
  9. class Dialog extends AbstractDialog {
  10. /**
  11. * Web dialog component's property types.
  12. *
  13. * @static
  14. */
  15. static propTypes = {
  16. ...AbstractDialog.propTypes,
  17. /**
  18. * Whether the dialog is modal. This means clicking on the blanket will
  19. * leave the dialog open. No cancel button.
  20. */
  21. isModal: PropTypes.bool,
  22. /**
  23. * Disables rendering of the submit button.
  24. */
  25. submitDisabled: PropTypes.bool,
  26. /**
  27. * Width of the dialog, can be:
  28. * - 'small' (400px), 'medium' (600px), 'large' (800px),
  29. * 'x-large' (968px)
  30. * - integer value for pixel width
  31. * - string value for percentage
  32. */
  33. width: PropTypes.string
  34. };
  35. /**
  36. * Initializes a new Dialog instance.
  37. *
  38. * @param {Object} props - The read-only properties with which the new
  39. * instance is to be initialized.
  40. */
  41. constructor(props) {
  42. super(props);
  43. this._onCancel = this._onCancel.bind(this);
  44. this._onSubmit = this._onSubmit.bind(this);
  45. }
  46. /**
  47. * Implements React's {@link Component#render()}.
  48. *
  49. * @inheritdoc
  50. * @returns {ReactElement}
  51. */
  52. render() {
  53. const props = {
  54. ...this.props,
  55. onCancel: this._onCancel,
  56. onSubmit: this._onSubmit
  57. };
  58. delete props.dispatch;
  59. return <StatelessDialog { ...props } />;
  60. }
  61. /**
  62. * Dispatches action to hide the dialog.
  63. *
  64. * @returns {void}
  65. */
  66. _onCancel() {
  67. this.props.isModal || super._onCancel();
  68. }
  69. }
  70. export default connect()(Dialog);