@smitch/fluid/lib/fileupload/Files.js

A lightweight, Tailwind-powered React/Next.js UI component library.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Button } from '..';
var Files = function (_a) {
    var files = _a.files, deleteFile = _a.deleteFile;
    var formatFileSize = function (size) {
        var units = ['Bytes', 'KB', 'MB', 'GB'];
        var unitIndex = 0;
        while (size >= 1024 && unitIndex < units.length - 1) {
            size /= 1024;
            unitIndex++;
        }
        var formattedSize = size.toFixed(size < 10 ? 2 : 0);
        return "".concat(formattedSize, " ").concat(units[unitIndex]);
    };
    var formatDate = function (date) {
        var lastModifiedDate = new Date(date);
        return lastModifiedDate.toLocaleDateString();
    };
    return (_jsx("div", { className: 'pt-2', children: files.length > 0 ? (_jsx("ul", { className: 'fileslist flex flex-col gap-4', children: Array.from(files).map(function (file, index) { return (_jsxs("li", { className: 'filesitem rounded border shadow-md p-4 bg-light text-dark dark:bg-dark dark:text-light', children: [_jsx("h3", { className: 'file-title truncate mb-4', children: file.name }), _jsxs("div", { className: 'file-details flex justify-between items-center', children: [_jsx("small", { children: formatDate(file.lastModified) }), _jsx("small", { children: formatFileSize(file.size) }), _jsx(Button, { className: '!p-0', size: 'sm', btnBackground: 'transparent', btnColor: 'danger', onClick: function () { return deleteFile(file); }, children: "Delete?" })] })] }, index)); }) })) : (_jsx("p", { children: "No files selected." })) }));
};
export default Files;
//# sourceMappingURL=Files.js.map