Overriding sorting behavior

Hi @JakeSidSmith, sorry, I forgot to create an issue to continue our discussion in #71 but here it is now 😃

To recap, in my use case, if a user drops an item in between others, it sorts the list but if the item is dropped on top of another, I can perform a different operation. So, to do this, I would need to know if an item is dropped on top of another ( or within certain boundaries of the new item and then not calculate new position in this case), or above or below the other (calculate new position in this case).

So, as I see it, the cleanest way, in terms of API might look something like this -

1. A prop, lets say sortZoneLimitPercent passed to Reorder that indicates what % area of the item to limit the dropzone to. So, by default, today that is 100%. If it is passed as 60, that means the top and bottom 20% of the item would not be considered as 'sortZone`.

2. An additional prop added to onReorder and onReorderGroup callback that indicates whether the item was dropped within the boundaries of an item, or outside, i.e. if sortZone is true or not.

Thoughts?

[JakeSidSmith]

@oyeanuj you’d set the data attribute on an element inside one of your items, and then it’d check for that, and check for collisions against that element, rather than the root node of an item.

[champeng]

If it is passed as 60, that means the top and bottom 20% of the item would not be considered as 'sortZone`.

@oyeanuj I think passing 60 would mean that top and bottom 30% would be the only place for sorting the list i.e. top and bottom 30% should be considered as sortZone and middle 40% would be considered for drop over existing element.