ToolbarSectionComponent.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
  1. 'use strict';
  2. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  3. function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
  4. function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
  5. /*
  6. *+------------------------------------------------------------------------+
  7. *| Licensed Materials - Property of IBM
  8. *| IBM Cognos Products: Content Explorer
  9. *| (C) Copyright IBM Corp. 2019, 2020
  10. *|
  11. *| US Government Users Restricted Rights - Use, duplication or disclosure
  12. *| restricted by GSA ADP Schedule Contract with IBM Corp.
  13. *+------------------------------------------------------------------------+
  14. */
  15. define(['react', 'react-dom', 'ca-ui-toolkit', 'prop-types', '../../../../lib/@waca/dashboard-common/dist/ui/Toolbar', '../../../../lib/@waca/core-client/js/core-client/ui/KeyCodes'], function (React, ReactDOM, UI_TOOLKIT, PropTypes, Toolbar, KeyCodes) {
  16. var Container = UI_TOOLKIT.Container;
  17. var ToolbarSectionComponent = function (_React$Component) {
  18. _inherits(ToolbarSectionComponent, _React$Component);
  19. function ToolbarSectionComponent(props) {
  20. _classCallCheck(this, ToolbarSectionComponent);
  21. var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
  22. _this._setRef = _this._setRef.bind(_this);
  23. _this._toolbar = new Toolbar({ className: 'dockedToolbar toolbar', reactToolbar: true });
  24. _this._toolbarRendered = Promise.resolve();
  25. return _this;
  26. }
  27. ToolbarSectionComponent.prototype.componentDidMount = function componentDidMount() {
  28. this._callbacks = {
  29. state: this._updateState.bind(this),
  30. focus: this._focus.bind(this)
  31. };
  32. this.props.stateProvider.registerCallback(this.props.stateEvent, this._callbacks['state']);
  33. this.props.stateProvider.registerCallback(this.props.focusEvent, this._callbacks['focus']);
  34. };
  35. ToolbarSectionComponent.prototype.componentWillUnmount = function componentWillUnmount() {
  36. this.props.stateProvider.removeCallback(this.props.stateEvent, this._callbacks['state']);
  37. this.props.stateProvider.removeCallback(this.props.focusEvent, this._callbacks['focus']);
  38. };
  39. ToolbarSectionComponent.prototype._updateState = function _updateState(state) {
  40. var _this2 = this;
  41. this._toolbar.clearItems();
  42. this._toolbarRendered = this._toolbar.addItems(state.actions).then(function () {
  43. _this2._toolbar.ready();
  44. });
  45. };
  46. ToolbarSectionComponent.prototype._focus = function _focus() {
  47. var _this3 = this;
  48. this._initialFocus = document.activeElement;
  49. this._toolbarRendered.then(function () {
  50. _this3._toolbar.setFocus();
  51. });
  52. };
  53. ToolbarSectionComponent.prototype._onKeyDown = function _onKeyDown(e) {
  54. if (e.keyCode === KeyCodes.ESCAPE && this._initialFocus) {
  55. this._initialFocus.focus();
  56. this._initialFocus = null;
  57. }
  58. };
  59. ToolbarSectionComponent.prototype._setRef = function _setRef(element) {
  60. this[ToolbarSectionComponent.ROOT] = element;
  61. /* eslint-disable react/no-find-dom-node */
  62. var elementDOMNode = ReactDOM.findDOMNode(element);
  63. /* eslint-disable react/no-find-dom-node */
  64. this.props.toolbarSectionDOM.setNode(elementDOMNode);
  65. if (element) {
  66. elementDOMNode.appendChild(this._toolbar.el);
  67. } else if (this._toolbar.el.parentNode) {
  68. this._toolbar.el.parentNode.removeChild(this._toolbar.el);
  69. }
  70. };
  71. ToolbarSectionComponent.prototype.render = function render() {
  72. return React.createElement(Container, {
  73. className: ToolbarSectionComponent.ROOT + ' ' + this.props.className,
  74. ref: this._setRef,
  75. onKeyDown: this._onKeyDown.bind(this)
  76. });
  77. };
  78. return ToolbarSectionComponent;
  79. }(React.Component);
  80. ToolbarSectionComponent.ROOT = 'ToolbarSection';
  81. ToolbarSectionComponent.propTypes = {
  82. className: PropTypes.string,
  83. toolbarSectionDOM: PropTypes.shape({
  84. setNode: PropTypes.func
  85. }),
  86. stateProvider: PropTypes.shape({
  87. getState: PropTypes.func,
  88. registerCallback: PropTypes.func,
  89. removeCallback: PropTypes.func
  90. }),
  91. stateEvent: PropTypes.string,
  92. focusEvent: PropTypes.string
  93. };
  94. ToolbarSectionComponent.defaultProps = {
  95. focusEvent: 'null_focus'
  96. };
  97. return ToolbarSectionComponent;
  98. });
  99. //# sourceMappingURL=ToolbarSectionComponent.js.map