This is absolutely fantastic and works exactly as expected! It’s saved me a huge amount of time prototyping a drag and drop layout.
I would really like to have an ‘empty’ state for each list. It should have the following properties:
- It will allow items to be dropped onto it
- It cannot be dragged
- It is only visible if there are no (other) items in the repeater
- It is styled differently (I know how to achieve this)
I have two hypotheses of how I might achieve this:
Have an “empty” repeater item in each list. Every time the repeater get updated, a filter hides this item if repeater.itemCount > 1.
Have an element outside of the repeater act as a drop zone. Anything dropped here will be added to the repeater. The order it’s added to the repeater doesn’t really matter as the repeater will always be empty when items are dropped here. This can be placed behind the repeater, at the same size as a repeater item, therefore only being visible when the repeater is empty. It will need to be grouped with the repeater somehow to allow multiple lists each with a repeater and a drop zone.
Another approach I haven’t thought of…
Any thoughts on which is the best approach?