"use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.FileUploaderFileList = exports.FileUploaderFileDataTids = void 0;var _extends3 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react = _interopRequireWildcard(require("react"));

var _FileUploaderControlContext = require("../FileUploaderControlContext");
var _ThemeContext = require("../../../lib/theming/ThemeContext");

var _FileUploaderFile = require("../FileUploaderFile/FileUploaderFile");
var _fileUtils = require("../fileUtils");





var _Emotion = require("../../../lib/theming/Emotion");
var _useFileUploaderSize = require("../hooks/useFileUploaderSize");

var _ThemeHelpers = require("../../../lib/theming/ThemeHelpers");

var _useControlLocale = require("../hooks/useControlLocale");
var _pluralize = require("../../../lib/pluralize");
var _locale = require("../../../lib/locale");

var _FileUploaderFileList = require("./FileUploaderFileList.styles");




















var FileUploaderFileDataTids = exports.FileUploaderFileDataTids = {
  fileList: 'FileUploader__fileList'
};

var FileUploaderFileList = exports.FileUploaderFileList = function FileUploaderFileList(props) {
  var
    renderFile =









    props.renderFile,size = props.size,_props$view = props.view,view = _props$view === void 0 ? 'row' : _props$view,_props$validationSumm = props.validationSummary,validationSummary = _props$validationSumm === void 0 ? 'auto' : _props$validationSumm,_props$validationSumm2 = props.validationSummaryStart,validationSummaryStart = _props$validationSumm2 === void 0 ? 5 : _props$validationSumm2,withValidationTooltip = props.withValidationTooltip,validationTooltipPosition = props.validationTooltipPosition,withWarningIcon = props.withWarningIcon,_props$disabled = props.disabled,disabled = _props$disabled === void 0 ? false : _props$disabled,onRemove = props.onRemove;
  var _useContext = (0, _react.useContext)(_FileUploaderControlContext.FileUploaderControlContext),files = _useContext.files;
  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
  var versionGTE5_5 = (0, _ThemeHelpers.isThemeGTE)(theme, '5.5');
  var locale = (0, _useControlLocale.useControlLocale)(versionGTE5_5);
  var _useContext2 = (0, _react.useContext)(_locale.LocaleContext),langCode = _useContext2.langCode;

  var _useState = (0, _react.useState)(null),focusedByTab = _useState[0],setFocusedByTab = _useState[1];
  var _useState2 = (0, _react.useState)(null),hovered = _useState2[0],setHovered = _useState2[1];
  var mouseIsOverRef = (0, _react.useRef)(false);

  var handleMouseEnter = function handleMouseEnter(index) {
    setHovered(index);
    mouseIsOverRef.current = true;
  };

  var handleMouseLeave = function handleMouseLeave() {
    setHovered(null);
    mouseIsOverRef.current = false;
  };

  var handleRemoveItem = function handleRemoveItem(index) {
    onRemove(index);
    if (hovered === index && mouseIsOverRef.current) {
      // Если текущий элемент был наведен, переключаемся на следующий элемент
      var currentIndex = files.findIndex(function (file) {return file.id === index;});
      if (currentIndex !== -1 && files[currentIndex + 1]) {
        setHovered(files[currentIndex + 1].id);
      } else {
        setHovered(null);
      }
    }
  };

  var isTileView = view === 'tile';
  var jsViewStyles = versionGTE5_5 && isTileView ? _FileUploaderFileList.jsTileStyles : _FileUploaderFileList.jsRowStyles;

  var fileWrapperClass = (0, _useFileUploaderSize.useFileUploaderSize)(size, {
    small: jsViewStyles.fileWrapperSmall(theme),
    medium: jsViewStyles.fileWrapperMedium(theme),
    large: jsViewStyles.fileWrapperLarge(theme)
  });

  var summaryClass = (0, _useFileUploaderSize.useFileUploaderSize)(size, {
    small: _FileUploaderFileList.jsStyles.summarySmall(theme),
    medium: _FileUploaderFileList.jsStyles.summaryMedium(theme),
    large: _FileUploaderFileList.jsStyles.summaryLarge(theme)
  });

  var renderSummary = function renderSummary() {
    if (!versionGTE5_5 || validationSummary === 'disabled') {
      return null;
    }

    var warningLength = files.filter(function (file) {return file.status === _fileUtils.FileUploaderFileStatus.Warning;}).length;
    var errorLength = files.filter(function (file) {return file.status === _fileUtils.FileUploaderFileStatus.Error;}).length;

    if (validationSummary === 'auto' && files.length < validationSummaryStart) {
      return null;
    }

    if (!(warningLength + errorLength)) {
      return null;
    }

    return /*#__PURE__*/(
      _react.default.createElement("div", { className: (0, _Emotion.cx)(_FileUploaderFileList.jsStyles.summary(theme), summaryClass) },
      errorLength > 0 && /*#__PURE__*/
      _react.default.createElement("span", { className: _FileUploaderFileList.jsStyles.summaryErrorText(theme) },
      errorLength, "\xA0", _pluralize.pluralize.apply(void 0, [langCode, errorLength].concat(locale.errors))
      ),

      warningLength > 0 && /*#__PURE__*/
      _react.default.createElement("span", { className: _FileUploaderFileList.jsStyles.summaryWarningText(theme) },
      warningLength, "\xA0", _pluralize.pluralize.apply(void 0, [langCode, warningLength].concat(locale.warnings))
      )

      ));

  };

  return /*#__PURE__*/(
    _react.default.createElement("div", { "data-tid": FileUploaderFileDataTids.fileList, className: jsViewStyles.fileListWrapper(theme) },
    renderSummary(),
    files.map(function (file, idx) {var _extends2, _ref, _files, _files2, _ref2, _ref3, _files3, _files4, _ref4;
      var hasFocus = focusedByTab === file.id;
      var hasHover = hovered === file.id;
      var hasError = file.status === _fileUtils.FileUploaderFileStatus.Error;
      var hasWarning = file.status === _fileUtils.FileUploaderFileStatus.Warning;

      var fileWrapperClassNames = (0, _Emotion.cx)(
        _FileUploaderFileList.jsStyles.fileWrapper(theme),
        fileWrapperClass,
        versionGTE5_5 && (0, _extends3.default)((_extends2 = {}, _extends2[
        _FileUploaderFileList.jsStyles.fileWrapperFocus(theme)] = hasFocus, _extends2[
        _FileUploaderFileList.jsStyles.fileWrapperHover(theme)] = hasHover, _extends2),
        hasError && (_ref = {}, _ref[
        _FileUploaderFileList.jsStyles.errorFile(theme)] = !isTileView || hasHover, _ref[
        jsViewStyles.errorFileFocus(theme)] = hasFocus, _ref),

        !isTileView &&
        hasError && (_ref2 = {}, _ref2[
        _FileUploaderFileList.jsStyles.removeBorderTopRadius()] = ((_files = files[idx - 1]) == null ? void 0 : _files.status) === _fileUtils.FileUploaderFileStatus.Error, _ref2[
        _FileUploaderFileList.jsStyles.removeBorderBottomRadius()] = ((_files2 = files[idx + 1]) == null ? void 0 : _files2.status) === _fileUtils.FileUploaderFileStatus.Error, _ref2),

        hasWarning && (_ref3 = {}, _ref3[
        _FileUploaderFileList.jsStyles.warningFile(theme)] = !isTileView || hasHover, _ref3[
        jsViewStyles.warningFileFocus(theme)] = hasFocus, _ref3),

        !isTileView &&
        hasWarning && (_ref4 = {}, _ref4[
        _FileUploaderFileList.jsStyles.removeBorderTopRadius()] = ((_files3 = files[idx - 1]) == null ? void 0 : _files3.status) === _fileUtils.FileUploaderFileStatus.Warning, _ref4[
        _FileUploaderFileList.jsStyles.removeBorderBottomRadius()] = ((_files4 = files[idx + 1]) == null ? void 0 : _files4.status) === _fileUtils.FileUploaderFileStatus.Warning, _ref4))


      );

      var fileProps = {
        file: file,
        multiple: true,
        size: size,
        view: view,
        disabled: disabled,
        hovered: hasHover,
        focused: hasFocus,
        onRemove: handleRemoveItem,
        withValidationTooltip: withValidationTooltip,
        validationTooltipPosition: validationTooltipPosition,
        withWarningIcon: withWarningIcon
      };

      var fileElement = renderFile(file, /*#__PURE__*/_react.default.createElement(_FileUploaderFile.FileUploaderFile, fileProps), fileProps);

      return /*#__PURE__*/(
        _react.default.createElement("div", {
          key: file.id,
          className: fileWrapperClassNames,
          onMouseEnter: function onMouseEnter() {return handleMouseEnter(file.id);},
          onMouseLeave: function onMouseLeave() {return handleMouseLeave();},
          onFocus: function onFocus() {return setFocusedByTab(file.id);},
          onBlur: function onBlur() {return setFocusedByTab(null);} }, /*#__PURE__*/

        _react.default.createElement("div", { className: jsViewStyles.file() }, fileElement)
        ));

    })
    ));

};

FileUploaderFileList.__KONTUR_REACT_UI__ = 'FileUploaderFileList';
FileUploaderFileList.displayName = 'FileUploaderFileList';