Dnd Indicator Mode? Can do it?

[songispm]

example: https://master--5fc05e08a4a65d0021ae0bf2.chromatic.com/?path=/story/examples-pages-layout--horizontal

[davestewart]

Nope. You'll need to code this by hand.

[songispm]

Even I code this by hand, but it can be achieved on the basis of vue-smooth-dnd?

Can you give a demo when you have time? Also can add it to vue-smooth-dnd docs

[davestewart]

Mine was fairly involved, and I only did it for one component, so won't be able to give a demo.

You'll have to dig into the bounding rectangle API and add elements accordingly!

https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect

[songispm]

I can try it, but please tell me, do I have to implement it by modifying the vue-smooth-dnd source code?

Or Can I implement it in my own vue vue application? Then I don't have to read the source code, just cooperate with the relevant APIs. @davestewart

[davestewart]

Yeah, pretty sure I just used mouse events and did some maths to work out where to place the divider lines.

And to clarify, yes, just in your Vue app 🙂