react-dyn-tabs
Version:
React dynamic tabs with full API
40 lines • 1.4 kB
JavaScript
import React, { useState, useRef, useLayoutEffect } from 'react';
import PropTypes from 'prop-types';
export default function ShowMoreTabs(getDeps, props) {
var ctx = props.ctx,
openTabIDs = props.openTabIDs,
selectedTabID = props.selectedTabID;
var _useState = useState(''),
hiddenTabIDs = _useState[0],
setHiddenTabIDs = _useState[1];
var _getDeps = getDeps(),
getInstance = _getDeps.getInstance,
getResizeDetectorIns = _getDeps.getResizeDetectorIns;
var ref = useRef();
ref.current = ref.current || {
ins: getInstance(ctx, setHiddenTabIDs)
};
var ins = ref.current.ins;
var openTabIDsString = openTabIDs.toString();
useLayoutEffect(function () {
ins.setResizer();
}, []);
useLayoutEffect(function () {
var resizeDetectorIns = getResizeDetectorIns();
ins.installResizer(resizeDetectorIns);
return function () {
ins.uninstallResizer(resizeDetectorIns);
};
}, []);
useLayoutEffect(function () {
ins.resize();
}, [openTabIDsString, selectedTabID]);
var ButtonComponent = ctx.getOption('moreButtonPlugin_buttonComponent');
return /*#__PURE__*/React.createElement("div", {
ref: ins.btnRef,
className: ctx.getSetting('tabClass') + ' ' + ctx.getSetting('showMoreContainerClass')
}, /*#__PURE__*/React.createElement(ButtonComponent, {
hiddenTabIDs: hiddenTabIDs,
instance: ctx.userProxy
}));
}