"use strict";

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
require("core-js/modules/es.array.map.js");
var React = _interopRequireWildcard(require("react"));
var _uiHelpers = require("@megafon/ui-helpers");
var _htmr = _interopRequireDefault(require("htmr"));
var _lodash = _interopRequireDefault(require("lodash.throttle"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
var cn = (0, _uiHelpers.cnCreate)('mfui-table');
var Table = function Table(_ref) {
  var className = _ref.className,
    _ref$fixColumn = _ref.fixColumn,
    fixColumn = _ref$fixColumn === void 0 ? true : _ref$fixColumn,
    _ref$boldFontInFirstC = _ref.boldFontInFirstColumn,
    boldFontInFirstColumn = _ref$boldFontInFirstC === void 0 ? false : _ref$boldFontInFirstC,
    _ref$minCellSize = _ref.minCellSize,
    minCellSize = _ref$minCellSize === void 0 ? 'large' : _ref$minCellSize,
    _ref$disableHeightLim = _ref.disableHeightLimit,
    disableHeightLimit = _ref$disableHeightLim === void 0 ? false : _ref$disableHeightLim,
    children = _ref.children;
  var scrollRef = React.useRef(null);
  var _React$useState = React.useState({
      top: false,
      left: false
    }),
    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
    shadow = _React$useState2[0],
    setShadow = _React$useState2[1];
  var _React$useState3 = React.useState({
      right: false,
      bottom: false
    }),
    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
    gradient = _React$useState4[0],
    setGradient = _React$useState4[1];
  var _React$useState5 = React.useState(false),
    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
    hasHorizontalScroll = _React$useState6[0],
    setHasHorizontalScroll = _React$useState6[1];
  var _React$useState7 = React.useState(false),
    _React$useState8 = (0, _slicedToArray2["default"])(_React$useState7, 2),
    isTouchDevice = _React$useState8[0],
    setTouchDevice = _React$useState8[1];
  var handleTableScroll = React.useCallback(function () {
    var scrollNode = scrollRef.current;
    if (!scrollNode) {
      return;
    }
    var scrollHeight = scrollNode.scrollHeight,
      clientHeight = scrollNode.clientHeight,
      scrollTop = scrollNode.scrollTop,
      scrollWidth = scrollNode.scrollWidth,
      clientWidth = scrollNode.clientWidth,
      scrollLeft = scrollNode.scrollLeft;
    var deltaHeight = scrollHeight - clientHeight;
    var deltaWidth = scrollWidth - clientWidth;
    setGradient({
      right: deltaWidth !== Math.floor(scrollLeft),
      bottom: deltaHeight !== Math.floor(scrollTop)
    });
    setShadow({
      top: !!scrollTop,
      left: !!scrollLeft
    });
    setHasHorizontalScroll(!!deltaWidth);
  }, []);
  React.useEffect(function () {
    var handleResize = (0, _lodash["default"])(handleTableScroll, 300);
    handleTableScroll();
    window.addEventListener('resize', handleResize);
    return function () {
      window.removeEventListener('resize', handleResize);
    };
  }, [handleTableScroll]);
  React.useEffect(function () {
    setTouchDevice((0, _uiHelpers.detectTouch)());
  }, []);
  var renderRows = function renderRows() {
    return React.Children.map(children, function (_ref2, index) {
      var _ref2$props = _ref2.props,
        cells = _ref2$props.children,
        head = _ref2$props.head,
        _ref2$props$vAlign = _ref2$props.vAlign,
        vAlign = _ref2$props$vAlign === void 0 ? 'default' : _ref2$props$vAlign;
      return /*#__PURE__*/React.createElement("tr", {
        key: index,
        className: cn('row', {
          head: head,
          content: !head,
          align: vAlign
        }),
        "data-testid": "Table-row"
      }, React.Children.map(cells, function (_ref3, cellIndex) {
        var cell = _ref3.props.children;
        return /*#__PURE__*/React.createElement("td", {
          key: cellIndex,
          className: cn('cell')
        }, typeof cell === 'string' ? (0, _htmr["default"])(cell) : cell);
      }));
    });
  };
  return /*#__PURE__*/React.createElement("div", {
    className: cn({
      'fix-column': fixColumn,
      'min-cell-size': minCellSize,
      'bold-font': boldFontInFirstColumn,
      'horizontal-scroll': hasHorizontalScroll,
      touch: isTouchDevice
    }, [className])
  }, /*#__PURE__*/React.createElement("div", {
    className: cn('scroll', {
      limit: !disableHeightLimit
    }),
    ref: scrollRef,
    onScroll: handleTableScroll
  }, shadow.top && /*#__PURE__*/React.createElement("div", {
    className: cn('top-shadow')
  }), shadow.left && /*#__PURE__*/React.createElement("div", {
    className: cn('left-shadow')
  }), /*#__PURE__*/React.createElement("table", {
    className: cn('table')
  }, /*#__PURE__*/React.createElement("tbody", null, renderRows())), gradient.right && /*#__PURE__*/React.createElement("div", {
    className: cn('right-gradient')
  }), gradient.bottom && /*#__PURE__*/React.createElement("div", {
    className: cn('bottom-gradient')
  })));
};
var _default = exports["default"] = Table;