🌎 🌍 🌏 initial commit
This commit is contained in:
commit
41d2cd8b9c
12 changed files with 181 additions and 0 deletions
3
.babelrc
Normal file
3
.babelrc
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"presets": ["es2015", "stage-0", "react"]
|
||||
}
|
||||
3
.gitignore
vendored
Normal file
3
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
lib/
|
||||
node_modules/
|
||||
coverage/
|
||||
2
.npmignore
Normal file
2
.npmignore
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
src/
|
||||
test/
|
||||
18
.travis.yml
Normal file
18
.travis.yml
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
sudo: false
|
||||
|
||||
language: node_js
|
||||
|
||||
# cache:
|
||||
# directories:
|
||||
# - node_modules
|
||||
|
||||
node_js:
|
||||
- "6"
|
||||
|
||||
branches:
|
||||
only:
|
||||
- master
|
||||
|
||||
script: npm run test
|
||||
after_success:
|
||||
- npm run coveralls
|
||||
15
README.md
Normal file
15
README.md
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
# Overview :
|
||||
|
||||
```js
|
||||
import {CSVLink} from 'react-csv';
|
||||
|
||||
|
||||
const csvData =[
|
||||
['firstname', 'lastname', 'email'] ,
|
||||
['Ahmed', 'Tomi' , 'ah@smthing.co.com'] ,
|
||||
['Raed', 'Labes' , 'rl@smthing.co.com'] ,
|
||||
['Yezzi','Min l3b', 'ymin@cocococo.com']
|
||||
];
|
||||
<CSVLink data={csvData} >Download me</CSVLink>
|
||||
|
||||
```
|
||||
1
index.js
Normal file
1
index.js
Normal file
|
|
@ -0,0 +1 @@
|
|||
module.exports = require(`lib/`);
|
||||
51
package.json
Normal file
51
package.json
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
{
|
||||
"name": "react-csv",
|
||||
"version": "0.0.1",
|
||||
"description": "Build CSV files on the fly basing on Array/literal object of data ",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"compile": "babel --presets es2015,stage-0 -d lib/ src/",
|
||||
"prepublish": "npm run compile",
|
||||
"test": "node_modules/.bin/_mocha test",
|
||||
"test2": "node_modules/.bin/babel-node node_modules/.bin/babel-istanbul cover node_modules/.bin/_mocha -- test/*.js",
|
||||
"coverage": "istanbul cover _mocha -- --ui bdd -R spec -t 5000;open ./coverage/lcov-report/index.html",
|
||||
"cover": "node_modules/.bin/babel-node node_modules/.bin/babel-istanbul cover node_modules/.bin/_mocha",
|
||||
"coveralls": "npm run cover -- --report lcovonly && cat ./coverage/lcov.info | coveralls"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/abdennour/react-csv.git"
|
||||
},
|
||||
"keywords": [
|
||||
"csv",
|
||||
"excel",
|
||||
"react",
|
||||
"file",
|
||||
"IO",
|
||||
"download",
|
||||
"hyperlink",
|
||||
"component",
|
||||
"reuse",
|
||||
"ES7",
|
||||
"babel"
|
||||
],
|
||||
"author": "Abdennour TOUMI <http://abdennoor.com>",
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/abdennour/react-csv/issues"
|
||||
},
|
||||
"homepage": "https://github.com/abdennour/react-csv#readme",
|
||||
"devDependencies": {
|
||||
"babel-cli": "^6.18.0",
|
||||
"babel-core": "^6.18.2",
|
||||
"babel-polyfill": "^6.16.0",
|
||||
"babel-preset-es2015": "^6.18.0",
|
||||
"babel-preset-react": "^6.16.0",
|
||||
"babel-preset-stage-0": "^6.16.0",
|
||||
"enzyme": "^2.6.0",
|
||||
"react": "^15.4.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"x-object": "^1.0.10"
|
||||
}
|
||||
}
|
||||
21
src/components/CSVDownload.js
Normal file
21
src/components/CSVDownload.js
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
import React from 'react';
|
||||
import {buildURI} from '../core';
|
||||
import {defaultProps, PropTypes, PropsNotForwarded} from '../metaProps';
|
||||
|
||||
class CSVDownload extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
componentDidMount(){
|
||||
window.open(buildURI(this.props.data));
|
||||
}
|
||||
|
||||
render(){
|
||||
return (null)
|
||||
}
|
||||
}
|
||||
|
||||
CSVDownload.defaultProps = defaultProps;
|
||||
CSVDownload.PropTypes = PropTypes;
|
||||
CSVDownload.PropsNotForwarded = PropsNotForwarded;
|
||||
export default CSVDownload;
|
||||
23
src/components/CSVLink.js
Normal file
23
src/components/CSVLink.js
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
import React from 'react';
|
||||
import {buildURI} from '../core';
|
||||
import {defaultProps, PropTypes, PropsNotForwarded} from '../metaProps';
|
||||
|
||||
class CSVLink extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
|
||||
render(){
|
||||
return (
|
||||
<a {...this.props} href={buildURI(this.props.data, this.props)}>
|
||||
{this.props.children}
|
||||
</a>
|
||||
)
|
||||
}
|
||||
}
|
||||
CSVLink.defaultProps = defaultProps;
|
||||
CSVLink.PropTypes = PropTypes;
|
||||
CSVLink.PropsNotForwarded = PropsNotForwarded;
|
||||
|
||||
export default CSVLink;
|
||||
26
src/core.js
Normal file
26
src/core.js
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
const isJsons = (array) => array.every(row => (typeof row === 'object' && !(row instanceof Array)))
|
||||
const isArrays = (array) => array.every(row => Array.isArray(row))
|
||||
|
||||
const jsonsHeaders = (array) => Array.from(
|
||||
array.map(json => Object.keys(json))
|
||||
.reduce((a, b) => new Set([...a, ...b]), [])
|
||||
);
|
||||
const jsons2arrays = (jsons, headers) => {
|
||||
headers = headers || jsonsHeaders(jsons);
|
||||
return [headers, ...array.map((object) =>
|
||||
headers.map((header) =>
|
||||
object[header] ? object[header] : ''))]
|
||||
};
|
||||
|
||||
const joiner = (data) => data.map((row, index) => row.join(',')).join(`\n`);
|
||||
|
||||
const arrays2csv = (data, headers) => joiner(headers ? [headers, ...data] : data);
|
||||
const jsons2csv = (data, headers) => joiner(jsons2arrays(data, headers))
|
||||
const toCSV = (data, headers) => {
|
||||
if(isJsons(data)) return jsons2csv(data, headers);
|
||||
if(isArrays(data)) return jsons2csv(data, headers);
|
||||
throw new TypeError(`Data should be an array of arrays OR array of objects `);
|
||||
};
|
||||
export const buildURI = (data, headers) => encodeURI(
|
||||
`data:text/csv;charset=utf-8,${toCSV(data, headers)}`
|
||||
);
|
||||
5
src/index.js
Normal file
5
src/index.js
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
import Download from './Download';
|
||||
import Link from './Link';
|
||||
|
||||
export const CSVDownload = Download;
|
||||
export const CSVLink = Link;
|
||||
13
src/metaProps.js
Normal file
13
src/metaProps.js
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
import React from 'react';
|
||||
export const defaultProps = {
|
||||
|
||||
};
|
||||
|
||||
export const PropTypes = {
|
||||
data: React.PropTypes.array.isRequired,
|
||||
headers: React.PropTypes.array
|
||||
};
|
||||
|
||||
export const PropsNotForwarded = [
|
||||
`data`
|
||||
];
|
||||
Loading…
Add table
Add a link
Reference in a new issue