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.

AbstractDialogTab.ts 1.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import { Component } from 'react';
  2. /**
  3. * The type of the React {@code Component} props of {@link AbstractDialogTab}.
  4. */
  5. export type Props = {
  6. /**
  7. * Function that closes the dialog.
  8. */
  9. closeDialog: Function;
  10. /**
  11. * Callback to invoke on change.
  12. */
  13. onTabStateChange: Function;
  14. /**
  15. * The id of the tab.
  16. */
  17. tabId: number;
  18. };
  19. /**
  20. * Abstract React {@code Component} for tabs of the DialogWithTabs component.
  21. *
  22. * @augments Component
  23. */
  24. class AbstractDialogTab<P extends Props, S> extends Component<P, S> {
  25. /**
  26. * Initializes a new {@code AbstractDialogTab} instance.
  27. *
  28. * @param {P} props - The read-only properties with which the new
  29. * instance is to be initialized.
  30. */
  31. constructor(props: P) {
  32. super(props);
  33. // Bind event handler so it is only bound once for every instance.
  34. this._onChange = this._onChange.bind(this);
  35. }
  36. /**
  37. * Uses the onTabStateChange function to pass the changed state of the
  38. * controlled tab component to the controlling DialogWithTabs component.
  39. *
  40. * @param {Object} change - Object that contains the changed property and
  41. * value.
  42. * @returns {void}
  43. */
  44. _onChange(change: Object) {
  45. const { onTabStateChange, tabId } = this.props;
  46. onTabStateChange(tabId, {
  47. ...this.props,
  48. ...change
  49. });
  50. }
  51. }
  52. export default AbstractDialogTab;