Hooks/functions api

[Artem Fokin]

Hello, i tried to use this components with Mui, and it's a bit difficult to pass CSVLink to MuiLink component props(or Button) and as result - collisions in theme styles, so i though we can just use some function(exp: downloadCsv) with same api like in components. I think it's should be easy implementation with json2csv

fast-writed solution

const downloadCsv = <T>(
  filename: string,
  data: readonly T[],
  parserOpt: Options<T>
) => {
  const parser = new Parser(parserOpt);
  const csvData = parser.parse(data);
  const csvFile = new Blob([csvData], { type: "text/csv;charset=utf-8;" });
  const link = document.createElement("a");

  const url = URL.createObjectURL(csvFile);
  link.setAttribute("href", url);
  link.setAttribute("download", filename || "file.csv");
  link.style.visibility = "hidden";
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
};