import { __assign, __extends } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import ImageUploadItem from './Item';
import Sortable from '../../../sortable';
import AbstractUploadList from '../AbstractList';
var ImageUploadList = (function (_super) {
    __extends(ImageUploadList, _super);
    function ImageUploadList() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.onFileListSortChange = function (list) {
            _this.props.onSortChange(list);
        };
        _this.onItemPreview = function (item) {
            _this.props.onPreview(item, _this.props.fileList);
        };
        _this.renderFileItem = function (item) {
            var CustomUploadItem = _this.props.customUploadItem;
            var UploadItem = CustomUploadItem || ImageUploadItem;
            return (_jsx(UploadItem, { item: item, i18n: _this.props.i18n, onDelete: _this.props.onDelete, onRetry: _this.props.onRetry, onPreview: _this.onItemPreview }, item.id));
        };
        return _this;
    }
    ImageUploadList.prototype.getRenderFileList = function () {
        return this.props.fileList;
    };
    ImageUploadList.prototype.render = function () {
        var _a = this.props, sortable = _a.sortable, trigger = _a.trigger;
        var fileList = this.getRenderFileList();
        var fileListContent = fileList.map(this.renderFileItem);
        var listContent = (_jsxs(Sortable, __assign({ tag: "ul", disabled: !sortable, items: fileList, className: "zent-image-upload-list", onChange: this.onFileListSortChange, filterClass: "zent-image-upload-trigger" }, { children: [fileListContent, trigger] }), void 0));
        return _jsx("div", __assign({ className: "zent-image-upload-list-wrapper", "data-zv": 'v10.0.11' }, { children: listContent }), void 0);
    };
    return ImageUploadList;
}(AbstractUploadList));
export default ImageUploadList;
