import { defineProperty as _defineProperty } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
import React__default from 'react';
import cls from 'classnames';
import { classes } from '../../TimePickerGrid.tokens.js';
import { StyledRoot, StyledTimeColumn, StyledTimeItem, StyledEmpty, CustomScrollbar, ScrollbarTrack, ScrollbarThumb } from './TimeColumn.styles.js';

var _StyledEmpty;
var renderTimeColumn = function renderTimeColumn(_ref) {
  var values = _ref.values,
    disabledValues = _ref.disabledValues,
    dropdownHeight = _ref.dropdownHeight,
    column = _ref.column,
    activeTime = _ref.activeTime,
    currentColumn = _ref.currentColumn,
    handleTimeItemClick = _ref.handleTimeItemClick,
    handleTimeItemKeyDown = _ref.handleTimeItemKeyDown,
    createScrollbarDragHandler = _ref.createScrollbarDragHandler,
    setScrollbar = _ref.setScrollbar,
    columnRef = _ref.columnRef,
    scrollbarState = _ref.scrollbarState,
    scrollbarRef = _ref.scrollbarRef,
    thumbRef = _ref.thumbRef,
    timeoutRef = _ref.timeoutRef,
    timeItemRefs = _ref.timeItemRefs;
  var handleKeyDown = function handleKeyDown(e, columnType, value) {
    handleTimeItemKeyDown(e, columnType, value);
  };
  var handleClick = function handleClick(value, columnType) {
    var isDisabled = disabledValues === null || disabledValues === void 0 ? void 0 : disabledValues.some(function (disabledValue) {
      return parseInt(disabledValue.toString(), 10) === parseInt(value, 10);
    });
    if (!isDisabled) {
      handleTimeItemClick(value, columnType);
    }
  };
  var minDisableIndex = function minDisableIndex() {
    if (!disabledValues || disabledValues.length === 0) {
      return 0;
    }
    var disabledNumbers = disabledValues.map(function (val) {
      return parseInt(val.toString(), 10);
    });
    for (var i = 0; i < values.length; i++) {
      var currentValue = parseInt(values[i], 10);
      if (!disabledNumbers.includes(currentValue)) {
        return i;
      }
    }
    return 0;
  };
  var isColumnActive = currentColumn === column;
  var minAvailableIndex = minDisableIndex();
  return /*#__PURE__*/React__default.createElement(StyledRoot, null, /*#__PURE__*/React__default.createElement(StyledTimeColumn, {
    key: column,
    ref: columnRef,
    height: dropdownHeight,
    className: classes.timeColumn,
    tabIndex: -1
  }, values.map(function (value, index) {
    var isDisabled = disabledValues === null || disabledValues === void 0 ? void 0 : disabledValues.some(function (disabledValue) {
      return parseInt(disabledValue.toString(), 10) === parseInt(value, 10);
    });
    var isActive = activeTime[column] === parseInt(value, 10);
    var getTabIndex = function getTabIndex() {
      if (isDisabled) return -1;
      var isValueActive = activeTime[column] === parseInt(value, 10);
      if (isColumnActive && isValueActive) {
        return 0;
      }
      if (index === minAvailableIndex) {
        return 0;
      }
      return -1;
    };
    var tabIndex = getTabIndex();
    return /*#__PURE__*/React__default.createElement(StyledTimeItem, {
      key: column + value,
      ref: function ref(el) {
        timeItemRefs.current["".concat(column, "-").concat(value)] = el;
      },
      className: cls(_defineProperty(_defineProperty({}, classes.timeItemActive, isActive), classes.itemDisabled, isDisabled)),
      onClick: function onClick() {
        return handleClick(value, column);
      },
      onKeyDown: function onKeyDown(e) {
        return handleKeyDown(e, column, value);
      },
      "aria-disabled": isDisabled,
      tabIndex: tabIndex,
      "data-value": value,
      "data-column": column,
      "data-active": isActive
    }, value);
  }), _StyledEmpty || (_StyledEmpty = /*#__PURE__*/React__default.createElement(StyledEmpty, null))), /*#__PURE__*/React__default.createElement(CustomScrollbar, {
    ref: scrollbarRef,
    className: cls(_defineProperty({}, classes.scrollbarVisible, scrollbarState === null || scrollbarState === void 0 ? void 0 : scrollbarState.isVisible)),
    tabIndex: -1
  }, /*#__PURE__*/React__default.createElement(ScrollbarTrack, null, /*#__PURE__*/React__default.createElement(ScrollbarThumb, {
    ref: thumbRef,
    style: {
      height: "".concat(scrollbarState === null || scrollbarState === void 0 ? void 0 : scrollbarState.thumbHeight, "px"),
      top: "".concat(scrollbarState === null || scrollbarState === void 0 ? void 0 : scrollbarState.thumbPosition, "px")
    },
    onMouseDown: columnRef && setScrollbar && timeoutRef ? createScrollbarDragHandler(columnRef, setScrollbar, timeoutRef) : undefined,
    tabIndex: -1
  }))));
};

export { renderTimeColumn };
