import { isImage } from 'payload/utilities';
import React from 'react';
import { UploadActions } from '../../elements/Upload/index.js';
import { Button } from '../Button/index.js';
import Thumbnail from '../Thumbnail/index.js';
import FileMeta from './FileMeta/index.js';
const baseClass = 'file-details';
const FileDetails = (props)=>{
    const { canEdit, collectionSlug, doc, handleRemove, hasImageSizes, imageCacheTag, uploadConfig } = props;
    const { id, filename, filesize, height, mimeType, url, width } = doc;
    return /*#__PURE__*/ React.createElement("div", {
        className: baseClass
    }, /*#__PURE__*/ React.createElement("header", null, /*#__PURE__*/ React.createElement(Thumbnail, {
        collectionSlug: collectionSlug,
        doc: doc,
        imageCacheTag: imageCacheTag,
        uploadConfig: uploadConfig
    }), /*#__PURE__*/ React.createElement("div", {
        className: `${baseClass}__main-detail`
    }, /*#__PURE__*/ React.createElement(FileMeta, {
        collection: collectionSlug,
        filename: filename,
        filesize: filesize,
        height: height,
        id: id,
        mimeType: mimeType,
        url: url,
        width: width
    }), isImage(mimeType) && mimeType !== 'image/svg+xml' && /*#__PURE__*/ React.createElement(UploadActions, {
        canEdit: canEdit,
        showSizePreviews: hasImageSizes && doc.filename
    })), handleRemove && /*#__PURE__*/ React.createElement(Button, {
        buttonStyle: "icon-label",
        className: `${baseClass}__remove`,
        icon: "x",
        iconStyle: "with-border",
        onClick: handleRemove,
        round: true
    })));
};
export default FileDetails;

//# sourceMappingURL=index.js.map