react-dyn-tabs
Version:
React dynamic tabs with full API
62 lines • 2.2 kB
JavaScript
var Api = function Api(_ref) {
var getResizerIns = _ref.getResizerIns,
btnRef = _ref.btnRef,
ctx = _ref.ctx,
setHiddenTabIDs = _ref.setHiddenTabIDs;
this.api = ctx;
this.tablistEl = null;
this.getResizerIns = getResizerIns;
this.tablistContainerEl = null;
this.tabs = null;
this.tabsCount = null;
this.btnRef = btnRef;
this._setHiddenTabIDs = setHiddenTabIDs;
};
Object.assign(Api.prototype, {
setResizer: function setResizer() {
this.tablistEl = this.btnRef.current.previousSibling;
this.tablistContainerEl = this.tablistEl.parentElement.parentElement;
this.tablistViewEl = this.tablistContainerEl.parentElement;
this._resizer = this.getResizerIns({
containerElement: this.tablistContainerEl,
buttonElement: this.btnRef.current,
tablistElement: this.tablistEl
});
},
installResizer: function installResizer(resizeDetectorIns) {
var _this = this;
resizeDetectorIns.debncListenTo(this.tablistViewEl, function () {
return _this.resize();
});
},
uninstallResizer: function uninstallResizer(resizeDetectorIns) {
if (this.tablistViewEl && resizeDetectorIns) resizeDetectorIns.uninstall(this.tablistViewEl);
},
_validateTabsCount: function _validateTabsCount(data) {
this.tabs = this.tablistEl.children;
this.tabsCount = this.tabs.length;
if (data.openTabIDs.length !== this.tabsCount) {
throw new Error("tablist children's length is not equal to openTabIDs length");
}
return true;
},
resize: function resize() {
var ins = this.api;
var data = ins.getData();
if (this._validateTabsCount(data) === false) {
return this._setHiddenTabIDs('');
}
var openTabIDs = data.openTabIDs,
selectedTabID = data.selectedTabID;
var selectedTabIndex = openTabIDs.indexOf(selectedTabID);
var hiddenTabs = this._resizer.resize(selectedTabIndex, ins.getOption('direction'), ins.getOption('isVertical'));
if (!hiddenTabs.length) {
return this._setHiddenTabIDs('');
}
this._setHiddenTabIDs(hiddenTabs.map(function (_ref2) {
var index = _ref2.index;
return openTabIDs[index];
}).toString());
}
});
export default Api;