pouncejs/dist/cjs/components/Tabs/TabPanel.js

A collection of UI components from Panther labs

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));

var _react = _interopRequireDefault(require("react"));

var _tabs = require("@reach/tabs");

var _Box = _interopRequireDefault(require("../Box"));

var TabPanel = function TabPanel(_ref) {
  var index = _ref.index,
      _ref$lazy = _ref.lazy,
      lazy = _ref$lazy === void 0 ? false : _ref$lazy,
      _ref$unmountWhenInact = _ref.unmountWhenInactive,
      unmountWhenInactive = _ref$unmountWhenInact === void 0 ? false : _ref$unmountWhenInact,
      children = _ref.children,
      rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["index", "lazy", "unmountWhenInactive", "children"]);

  var _useTabsContext = (0, _tabs.useTabsContext)(),
      selectedIndex = _useTabsContext.selectedIndex;

  var isActive = selectedIndex === index;

  var wasActiveRef = _react.default.useRef(isActive);

  _react.default.useEffect(function () {
    if (isActive) {
      wasActiveRef.current = true;
    }
  }, [isActive]);

  var shouldRender = !lazy || isActive || wasActiveRef.current && !unmountWhenInactive;
  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({
    as: _tabs.TabPanel,
    tabIndex: -1,
    outline: "none"
  }, rest), shouldRender ? children : null);
};

var _default = TabPanel;
exports.default = _default;