readme & demo changes

.gitignore

@@ -3,3 +3,4 @@
 node_modules
 .cache
 dist
+package-lock.json

README.md

@@ -1 +1,38 @@
-#
+<h1 align="center">gantt-task-react</h1>
+<h2 align="center">Interactive Gantt Chart for React with TypeScript.</h2>
+<img src="https://user-images.githubusercontent.com/26743903/88215863-f35d5f00-cc64-11ea-81db-e829e6e9b5c8.png"/>
+
+## How to use it
+
+```javascript
+let tasks: Task[] = [
+    {
+      start: new Date(2020, 1, 1),
+      end: new Date(2020, 1, 2),
+      name: 'Idea',
+      id: 'Task 0',
+      progress: 45,
+      isDisabled: true,
+      styles: { progressColor: '#ffbb54', progressSelectedColor: '#ff9e0d' },
+    },
+    ...
+];
+<Gantt tasks={tasks} />
+```
+
+You may handle actions
+
+```javascript
+<Gantt
+  tasks={tasks}
+  viewMode={view}
+  onDateChange={onTaskChange}
+  onTaskDelete={onTaskDelete}
+  onProgressChange={onProgressChange}
+  onDoubleClick={onDblClick}
+/>
+```
+
+## Gantt Configuration
+
+- EventOption

example/index.tsx

@@ -24,7 +24,7 @@ const App = () => {
         12,
         28
       ),
-      name: 'Redesign website',
+      name: 'Idea',
       id: 'Task 0',
       progress: 45,
       isDisabled: true,
@@ -32,7 +32,7 @@ const App = () => {
     {
       start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 2),
       end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 4, 0, 0),
-      name: 'Write new content',
+      name: 'Research',
       id: 'Task 1',
       progress: 25,
       dependencies: ['Task 0'],
@@ -40,7 +40,7 @@ const App = () => {
     {
       start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 4),
       end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 8, 0, 0),
-      name: 'Apply new styles',
+      name: 'Discussion with team',
       id: 'Task 2',
       progress: 10,
       dependencies: ['Task 1'],
@@ -48,15 +48,15 @@ const App = () => {
     {
       start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 8),
       end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 9, 0, 0),
-      name: 'Review',
-      id: 'Task currentDate.getMonth()',
+      name: 'Developing',
+      id: 'Task 3',
       progress: 2,
       dependencies: ['Task 2'],
     },
     {
       start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 8),
       end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 10),
-      name: 'Deploy',
+      name: 'Review',
       id: 'Task 4',
       progress: 70,
       dependencies: ['Task 2'],
@@ -64,7 +64,7 @@ const App = () => {
     {
       start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 15),
       end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 26),
-      name: 'Go Live!',
+      name: 'Release',
       id: 'Task 6',
       progress: currentDate.getMonth(),
       dependencies: ['Task 4'],