import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import { u as useViewHandler } from './index-bbdfb97a.js';
import { useState, useEffect } from 'react';
import ItemVariant from './index-f4e09e5d.js';
import { observer } from 'mobx-react-lite';
import { jsx, Fragment } from 'react/jsx-runtime';
import '@babel/runtime/helpers/defineProperty';
import 'react-dynamic-multi-render';
import '@crystaldesign/diva-core';
import '@babel/runtime/helpers/asyncToGenerator';
import '@babel/runtime/helpers/objectWithoutProperties';
import '@babel/runtime/regenerator';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import '@babel/runtime/helpers/toConsumableArray';
import '@crystaldesign/diva-utils';
import 'mobx';
import '@crystaldesign/web-planner-logic';
import 'classnames';
import 'qrcode.react';
import '@babel/runtime/helpers/typeof';
import 'flat';
import 'react-switch';
import 'react-countup';

var TabGroupVertical = function TabGroupVertical(props) {
  var _viewHandler$tabGroup2;
  var viewHandler = useViewHandler();
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    forceRerender = _useState2[0],
    setRerender = _useState2[1];
  var tabGroups = viewHandler.tabGroupState.allTabGroups;

  //scroll logic
  useEffect(function () {
    viewHandler.tabGroupState.scrollToCurTabgroup();
  }, [viewHandler.tabGroupState.curTabGroup]);

  //render until we get initial heigth
  useEffect(function () {
    var didCancel = false;
    var interval = window.setInterval(function () {
      var _viewHandler$tabGroup;
      var totalHeight = (_viewHandler$tabGroup = viewHandler.tabGroupState.tabGroupScroller) === null || _viewHandler$tabGroup === void 0 ? void 0 : _viewHandler$tabGroup.getBoundingClientRect().height;
      if (totalHeight && totalHeight > 0) {
        if (!didCancel) {
          setRerender(!forceRerender);
        }
        window.clearInterval(interval);
      }
    }, 100);
    return function () {
      didCancel = true;
      window.clearInterval(interval);
    };
  }, [viewHandler.tabGroupState.tabGroupScroller]);
  if (!tabGroups) return /*#__PURE__*/jsx(Fragment, {});
  var totalHeight = (_viewHandler$tabGroup2 = viewHandler.tabGroupState.tabGroupScroller) === null || _viewHandler$tabGroup2 === void 0 ? void 0 : _viewHandler$tabGroup2.getBoundingClientRect().height;
  var minHeightOfOneStep = 80;
  var minHeight = undefined;
  var tabCount = Object.keys(tabGroups).length;
  var height = 0;
  if (totalHeight) {
    height = totalHeight / tabCount;
    if (tabCount * minHeightOfOneStep > totalHeight) {
      minHeight = minHeightOfOneStep;
    }
  } else {
    setTimeout(function () {
      return setRerender(!forceRerender);
    }, 100);
  }
  var firstKey = Object.keys(tabGroups)[0];
  var lastKey = Object.keys(tabGroups)[Object.keys(tabGroups).length - 1];
  return /*#__PURE__*/jsx(Fragment, {
    children: Object.entries(tabGroups).map(function (_ref) {
      var _ref2 = _slicedToArray(_ref, 2);
        _ref2[0];
        var tabGroup = _ref2[1];
      return /*#__PURE__*/jsx(ItemVariant, {
        tabGroup: tabGroup,
        height: height,
        isFirstItem: tabGroups[firstKey].key == tabGroup.key,
        isLastItem: tabGroups[lastKey].key == tabGroup.key,
        minHeight: minHeight
      }, tabGroup.title);
    })
  });
};
var TabGroupVertical$1 = observer(TabGroupVertical);

export { TabGroupVertical$1 as default };
