Add order prop to Template

[tmpaul06]

Send down order prop, which is the index of the item in the list (or reordered list).

Use case

I am using this library to render a series of thumbnails for slides in a slide deck. The user can reorder the slides by dragging the slide thumbnails. This works great, but there is a problem. Along with each slide thumbnail, its numerical index needs to be shown. For e.g

   1. Slide 1
   2. Slide 2

after re-order:

  1. Slide 2
  2. Slide 1

The problem is that I cannot store the index on the item and use that to render the number in the Template. This would result in the numbers being 2. and 1. respectively. What I need instead, is the new order in the reordered list, so that I can display that number.

Previous Attempts

1. Use <ol> wrapper component, and <li> template component so that browser will show correct order. But <Motion> wrapper results in a <div> container (with absolute position) being inserted around the <li> leading to semantically incorrect HTML.

2. Use a static property to pass down the reordered list. Then inside the Template component, use reorderedList.indexOf(slide.id) to get index. However, this is a massive hack and works iff there is only one draggable list on the page.

Update: I just found the issue filed: https://github.com/StreakYC/react-draggable-list/issues/24

P.S I've made no updates to package version.

[tmpaul06]

@AgentME any updates on this ?

[Macil]

Sorry for not getting to this sooner.

I'm not sure this feature is necessary -- please see my post in #24.

If we do come back to this PR, then we need to update the shouldComponentUpdate methods of TemplateContainer and MoveContainer.