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.js 2.0KB

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