A performance focused timeline component in react
Action | Command |
---|---|
Build | $ make |
Test | $ make test or $ make test-watch |
Run dev server | $ make run |
- Add
import react-timeline-9000/lib/style.css
(or use your own styles based on this file)
Feel free to make a PR :)
Default interaction for multiple selection is largely governed by the leading item, which is defined as the item that is directly interacted with when multiple items are selected.
All items will move by the same horizontal delta and row changes will be calculated by the row delta of the leading item
All items will gain the resize delta from the leading item.
TBA
onInteraction(type, changes, leadTimeDelta, leaderGroupDelta,selectedItems)
See http://bhp-react-timeline-9k.s3-website-ap-southeast-2.amazonaws.com/docs for detailed docs
Name |
---|
groupOffset |
startDate |
endDate |
snapMinutes |
showCursorTime |
cursorTimeFormat |
itemHeight |
timelineMode |
timebarFormat |
itemRenderer |
groupRenderer |
Name |
---|
items |
groups |
selectedItems |
Name |
---|
onItemClick |
onItemDoubleClick |
onItemContext |
onInteraction |
onRowClick |
onRowContext |
onRowDoubleClick |
onItemHover |
onItemLeave |
- View
src/style.css
for styling examples. - For the default styles, import
react-timeline-9000/lib/style.css
Item | Index |
---|---|
Vertical markers | 1 |
Timeline items | 2 |
Timeline items when dragging/resizing | 3 |
Selection box (for multi-select) | 4 |
Group column | 5 |