Awesome
react-calendar-graph
Calendar graph like github for react.
installation
npm install -S @jswork/react-calendar-graph
usage
import ReactCalendarGraph from '@jswork/react-calendar-graph';
import '@jswork/react-calendar-graph/dist/style.scss';
import dataJson from './assets/data.json';
import { useEffect, useState } from 'react';
function App() {
const [v, setV] = useState<any>([]);
useEffect(() => {
setTimeout(() => {
setV(dataJson);
}, 100);
}, []);
return (
<div className="m-10 p-4 shadow bg-gray-100 text-gray-800 hover:shadow-md transition-all">
<div className="badge badge-warning absolute right-0 top-0 m-4">
Build Time: {BUILD_TIME}
</div>
<div className="text-center">
<ReactCalendarGraph
data={v}
style={{
padding: '10px',
background: 'white',
borderRadius: '5px',
}}
/>
</div>
</div>
);
}
export default App;
preview
license
Code released under the MIT license.