@afzalimdad9/react-file-preview/dist/drivers/csv-viewer.js

The url previewer is built using native html elements for previewing url of files of the following type

import { __makeTemplateObject } from "tslib";
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
import { memo, useEffect, useState } from 'react';
import CSV from '@afzalimdad9/comma-separated-values';
import { TableVirtuoso } from 'react-virtuoso';
import styled from 'styled-components';
var TD = styled.td(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border: 1px solid black;\n"], ["\n  border: 1px solid black;\n"])));
var CSVViewer = function (_a) {
    var src = _a.src, onError = _a.onError, onLoad = _a.onLoad;
    var _b = useState([]), data = _b[0], setData = _b[1];
    useEffect(function () {
        var req = new XMLHttpRequest();
        req.open('GET', src, true);
        req.onload = function (e) {
            if (req.status >= 300) {
                onError(e);
            }
            else {
                setData(new CSV(req.response).parse());
                onLoad(true);
            }
        };
        req.send();
        return function () {
            req.abort();
        };
    }, [src, onLoad, onError]);
    return (_jsx(TableVirtuoso, { style: { height: '100%', whiteSpace: 'nowrap', width: '100%' }, data: data, itemContent: function (index, row) { return (_jsx(_Fragment, { children: row.map(function (x, i) { return (_jsx(TD, { children: x }, "".concat(index, "-").concat(i))); }) })); } }));
};
export default memo(CSVViewer);
var templateObject_1;
//# sourceMappingURL=csv-viewer.js.map