Grid layout & information about drop target

[kutlugsahin]

Grid layout & information about drop target

[kutlugsahin]

Hi @oyeanuj , thanks for the feedback.

1. Unfortunately Grid layout is not supported, maybe in future releases.
2. I think you can make it like this: Put Container inside Draggable and set a margin, so that each item will contain Container component. If the dragged element is inside the inner Container it will be dropped in it. If it is over the margin area parent Draggable will slide. And If you also don't want the inner Containers accept more than one draggable, set the shouldAcceptDrop function. Hope it's clear and it works :)

[oyeanuj]

@kutlugsahin Thank you for the quick response! Two quick follow-ups:

1. Do you expect it to work with a Flexbox list spread in two rows/columns?

2. This is an interesting idea! So, essentially, you're suggesting that I look at the element with the onDrop handler and see if it is the child or the parent and then base it on that?

[kutlugsahin]

@oyeanuj
Np!

1. No It won't work in wrapped Flexbox having both rows and columns. Layout calculations are done in only one axis depending if the container is horizontal or vertical.
2. No you don't need to look at the element and do something according to it. Probably it wont work.
   Let me illustrate the code. Lets say You have a container with three items and as far as I understand you are trying to drop new item from outside. So your target Container would be like this

        <Container>
          <Draggable>
            <div style={{ margin: '30px' }}>
              <Container shouldAcceptDrop={...}></Container>
            </div>
          </Draggable>
          <Draggable>
            <div style={{ margin: '30px' }}>
              <Container></Container>
            </div>
          </Draggable>
          <Draggable>
            <div style={{ margin: '30px' }}>
              <Container></Container>
            </div>
          </Draggable>
        </Container>

[oyeanuj]

@kutlugsahin Oh, I see. So nest the containers? Cool, I'll give it a shot and get back to you if I have more questions!

Thanks for the help!