Comments (10)
Hi, I've same issue with vertical drop, my draggable is very high, and the center of this div cannot reach a container to trigger the drop placeholder. I tried to scale down the "ghost" with CSS but it still uses the original content size before the drag.
It would be great to use the center of the ghost to compute eligible landing containers.
from react-smooth-dnd.
A solution would be to use the mouse "click" position of the drag handler. People will always move the pointer to the landing zone.
What do you think @kutlugsahin ?
Thanks for your help
from react-smooth-dnd.
PS: looks like it's almost there: https://github.com/kutlugsahin/smooth-dnd/blob/master/src/container.ts#L216
from react-smooth-dnd.
rcdexta has a forked JS version of smooth-dnd that works, which is the core of react-trello.
kutlugsahin has converted the smooth-dnd effort to TS, but in doing so has effectively broken the getPosition function in its end purpose for many scenarios, this issue describing one of them.
Considering that like so many libs, maintenance is dropped, (including react-beautiful-dnd which is now broken for kanban on mac chrome) the only way I could proceed is with using the rcdexta JS version and the react wrappers from /dnd folder of react-trello.
Although the TS efforts may overall be better, for me it's current state is unusable, but the JS version works great.
from react-smooth-dnd.
Anyone with a workaround? I have a similar issue in one of my projects.
from react-smooth-dnd.
hi @jtzikas , I ended-up copy-pasting the whole code into my project, and uncommenting this line: https://github.com/kutlugsahin/smooth-dnd/blob/master/src/container.ts#L216
It worked for me...
from react-smooth-dnd.
Thanks @pierre-b.
I was hopping there was a way to avoid copy/pasting the entire project.
from react-smooth-dnd.
One could fork it, make the suggested modification, build and publish it to npm, and use the modified library in your project.
from react-smooth-dnd.
If you look closely, this lib contains 2 files and is not maintained, it's in your interest to copy/paste these 2 files and remove this dependency from your project.
from react-smooth-dnd.
I agree. I've re-written these 2 files as functional components. Was thinking of forking https://github.com/kutlugsahin/smooth-dnd
Sadly, this is about the 20th library that I've seen go by the wayside. Ecosystem moves so fast.
from react-smooth-dnd.
Related Issues (20)
- Native touch scroll is blocked after touch/scroll on the react-smooth-dnd HOT 1
- Does it support html tables? HOT 2
- Is the license correct at MIT?
- Draggable render ref HOT 1
- Documentation for functional components? HOT 1
- Cannot read property 'setDraggables' of undefined HOT 4
- Why I click the dragabled Item will trigger drag event?
- Container control on dynamic fields HOT 1
- onDrop returning invalid addedIndex and removedIndex HOT 1
- Property 'children' does not exist on type 'IntrinsicAttributes....' HOT 10
- Functional components
- horizontal scroll not working when using infinite scroll HOT 3
- Flickering issue HOT 2
- Question about getContainerOptions
- Please fix "Property 'children' does not exist on type 'IntrinsicAttributes'"
- Performance issue
- How to use payload on onDragEnd Or return dragged element
- 为什么我写的onDrop方法的 addedIndex不是正确的数组的index,像是随机的一样
- Uncaught TypeError: Cannot read properties of undefined (reading 'setDraggables')
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-smooth-dnd.