'use strict'; function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } 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; } 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; } /** * Licensed Materials - Property of IBM * IBM Cognos Products: BI Cloud (C) Copyright IBM Corp. 2018, 2020 * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp. */ define(['jquery', 'underscore', '../../lib/@waca/core-client/js/core-client/ui/core/View', 'react-dom', 'react', 'ca-ui-toolkit'], function ($, _, View, ReactDOM, React, Toolkit) { 'use strict'; var TabPanel = Toolkit.TabPanel; var Tabs = Toolkit.Tabs; var VisTabControl = function (_React$Component) { _inherits(VisTabControl, _React$Component); /* eslint react/prop-types: 0 */ function VisTabControl(props) { _classCallCheck(this, VisTabControl); var _this = _possibleConstructorReturn(this, _React$Component.call(this, props)); _this.state = _.clone(props.state); return _this; } /** * Render the tab control */ VisTabControl.prototype.render = function render() { return React.createElement( Tabs, { selected: this.getSelectedId(), onChange: this._onChange.bind(this) }, this._renderPanels() ); }; /** * Set the selected tab */ VisTabControl.prototype.select = function select(tabId) { this.setState({ selectedTab: tabId || this.props.selectedTab }); }; /** * Get the selected tab identifier * * @return unique identifier of the selected tab */ VisTabControl.prototype.getSelectedId = function getSelectedId() { return this.state.selectedTab; }; VisTabControl.prototype._renderPanels = function _renderPanels() { // render each tab entries as a TabPanel with the given identifier and label return _.map(this.props.entries, function (entry) { return React.createElement(TabPanel, { key: entry.id, id: entry.id, label: entry.label }); }); }; VisTabControl.prototype._onChange = function _onChange(tabId) { // set the selectedTab to state this.select(tabId); // find the tab entry of the selected tab and invoke the callback (if available) var entry = _.findWhere(this.props.entries, { id: tabId }); if (entry && entry.onChange) { entry.onChange(tabId); } }; return VisTabControl; }(React.Component); var VisTabs = View.extend({ className: 'visTabsView', init: function init() { VisTabs.inherited('init', this, arguments); }, /** * Attach the tabs to a DOM element * * @param {Element} element - The parent DOM element to place the tabs */ placeAt: function placeAt(element) { // remove the previous render (if any) $(element).find('.visTabsView').remove(); this.$el.prependTo(element); }, /** * Create the tabs with the given array of tab entries * The tab entry is expected to be provided in the following form: * Entry: { * id: * label: * onChange: [optional] * } * * @param {Entry[]} entries - array of tab definition entries * @param {string} selectedTab - identifier of the default selected tab [optional] */ createTabs: function createTabs(entries, selectedTab) { this.entries = entries; // if there is not selectedTab, simply start with selecting the first tab entry var initState = { selectedTab: selectedTab || (entries && entries.length ? entries[0].id : null) }; this.ctrl = ReactDOM.render(React.createElement(VisTabControl, { entries: entries, state: initState }), this.el); }, reset: function reset() { if (this.ctrl) { ReactDOM.unmountComponentAtNode(this.el); this.entries = null; this.ctrl = null; } }, remove: function remove() { this.reset(); VisTabs.inherited('remove', this, arguments); }, /** * Get the number of tabs * * @return number of tabs entries rendered */ getTabsCount: function getTabsCount() { return this.entries ? this.entries.length : 0; }, /** * Select a tab with the given tab identifier * * @param {string} tabId - unique tab identifier to select */ selectTab: function selectTab(tabId) { if (this.ctrl) { if (this.ctrl.getSelectedId() !== tabId) { this.ctrl.select(tabId); this.ctrl.render(); } } } }); return VisTabs; }); //# sourceMappingURL=VisTabs.js.map