react-timesheet alternatives and similar libraries
Based on the "Miscellaneous" category.
Alternatively, view react-timesheet alternatives based on common mentions on social networks and blogs.
-
react-joyride
Create walkthroughs and guided tours for your ReactJS apps. Now with standalone tooltips!. -
react-resizable-and-movable
Resizable and movable component for React. -
react-designer
Easy to configure, lightweight, editable vector graphics in your react components. -
react-resizable-box
Resizable component for React. #reactjs. -
react-json-tree
React JSON Viewer Component, Extracted from redux-devtools. -
react-facebook
Facebook components like a Login button, Like, Share, Comments, Page or Embedded Post. -
react-avatar
Universal React avatar component makes it possible to generate avatars based on user information. -
react-images-uploader
React.js component for uploading images to the server. -
react-svg-buttons
Configurable animated SVG buttons for react. -
react-file-reader-input
React file input component for complete control over styling and abstraction from file reading. -
material-color-hash
Hash strings to Material UI colors. -
react-avatar-generator
Allows users to create random kaleidoscopes to be used as avatars. -
react-filter-control
The React filterbuilder component for building the filter criteria in the UI. -
react-headings
Auto-increment your HTML headings (h1, h2, etc.) for improved accessibility and SEO, no matter your component structure, while you keep full control of what's rendered. -
react-color-scroll
Change and blend new colors on the background as you scroll. -
react-pagespeed-score
A React component for display a dial-type chart of PageSpeed Insights.
Get performance insights in less than 4 minutes
Do you think we are missing an alternative of react-timesheet or a related project?
README
React Time Sheet
Time Sheet Component for React. Modified from timesheet.js
Demo & Examples
Live demo: yuanyan.github.io/react-timesheet
To build the examples locally, run:
npm install
gulp dev
Then open localhost:9999
in a browser.
Installation
The easiest way to use react-timesheet
is to install it from NPM and include it in your own React build process (using Browserify, etc).
You can also use the standalone build by including dist/react-timesheet.js
in your page. If you use this, make sure you have already included React, and it is available as a global variable.
npm install react-timesheet --save
Usage
var React = require('react');
var TimeSheet = require('react-timesheet');
var Example1 = React.createClass({
data: [
['2002', '09/2002', 'A freaking awesome time', 'lorem'],
['06/2002', '09/2003', 'Some great memories', 'ipsum'],
['2003', 'Had very bad luck'],
['10/2003', '2006', 'At least had fun', 'dolor'],
['02/2005', '05/2006', 'Enjoyed those times as well', 'ipsum'],
['07/2005', '09/2005', 'Bad luck again', 'default'],
['10/2005', '2008', 'For a long time nothing happened', 'dolor'],
['01/2008', '05/2009', 'LOST Season #4', 'lorem'],
['01/2009', '05/2009', 'LOST Season #4', 'lorem'],
['02/2010', '05/2010', 'LOST Season #5', 'lorem'],
['09/2008', '06/2010', 'FRINGE #1 & #2', 'ipsum']
],
render: function() {
return (
<TimeSheet data={this.data}/>
);
}
});
Properties
data
: Your configure data.min
: Min year value.max
: Max year data.theme
: Custom theme name.