redux-modal-tabs
Version:
Redux modal tabs
44 lines (43 loc) • 1.66 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const modalTabComponent_1 = require("./modalTabComponent");
const react_redux_1 = require("react-redux");
class ModalTabs extends React.Component {
constructor() {
super(...arguments);
this.state = {
expanded: true
};
}
onToggleExpanded() {
const { expanded } = this.state;
this.setState({
expanded: !expanded
});
}
componentDidUpdate(prevProps) {
const { modalTabs } = this.props;
if (prevProps.modalTabs.length < modalTabs.length) {
this.setState({
expanded: true
});
}
}
render() {
const { modalTabs } = this.props;
const { expanded } = this.state;
if (modalTabs.length === 0) {
return null;
}
return (React.createElement("div", { className: 'modalTabsVertical ' + (expanded ? '' : ' modalTabsCollapsed') },
React.createElement("ul", { className: "modalTabsList" }, modalTabs.map(modalTab => React.createElement(modalTabComponent_1.default, { key: modalTab.id, modalTab: modalTab }))),
React.createElement("button", { className: "modalTabsMinimize", onClick: this.onToggleExpanded.bind(this) },
React.createElement("span", { className: 'modalTabArrow '
+ (expanded ? 'modalTabArrowRight' : 'modalTabArrowLeft') }))));
}
}
const select = (state) => ({
modalTabs: state.reduxModalTabs.modalTabs
});
exports.default = react_redux_1.connect(select)(ModalTabs);