300 questions
-3 votes
1 answer
184 views
Nextjs and react error You may need an appropriate loader to handle this file type
I am cloned a copy of the following repo https://github.com/wassgha/digital-signage. The issue I am having is when loading part of the pages, I get the following error below: Failed To Compile ./...
0 votes
0 answers
55 views
React Beautiful DND reorder api call
I'm implementing drag-and-drop functionality using react-beautiful-dnd in my React/TypeScript application. The goal is to drag Product components and drop them into Folder components. Upon drop, I ...
0 votes
1 answer
98 views
React Beautiful DnD: Unable to Drop Songs into Folders After Fetching Data
I'm working on a React application using react-beautiful-dnd to implement drag-and-drop functionality for songs and folders. The drag-and-drop works perfectly with locally created folders, but I'm ...
2 votes
0 answers
196 views
react-beautiful-dnd Invariant failed: Cannot find droppable entry with id
I'm having an issue using react-beautiful-dnd within a react-virtualized List. My app has sections, each with its own Droppable, and contains Draggable elements. The problem occurs when I try to drag ...
0 votes
1 answer
61 views
react-beautiful-dnd: How can I prevent elements from shifting around when `isCombineEnabled=true`?
There's an example here, showing exactly what I want but they don't share the full code: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/combining.md Here's what I've got: ...
0 votes
1 answer
69 views
Is there is way to change default translucent image by browser when onDragStart event fire
I hope you're all doing well, and I appreciate your attempts to help. What I'm trying to do here is practice and improve my skills, so I decided to create a simple drag-and-drop function for an ...
1 vote
1 answer
2k views
How to restrict the draggable area of an element in react-beautiful-dnd
To clarify, I don't mean defining a droppable area, I mean making it so that visually, you literally can't drag items outside of a certain range. For example, if you have a div that houses a bunch of ...
1 vote
0 answers
224 views
Draggable items break styles on dragging
I'm creating a sequence quiz and chose @hello-pangea/dnd package (which is rewritten react-beautiful-dnd and I succeeded to create a simple component but I faced a problem that when I grab draggable ...
0 votes
1 answer
133 views
drag and drop task in react js using buttons [closed]
In drag and drop if we have to do selection first and after that have to submit by clicking button so what type of functions or event handlers I have to use? I have tried react-beautiful-dnd but still ...
0 votes
1 answer
678 views
How to adjust touch sensitivity using @hello-pangea/dnd (formerly react-beautiful-dnd)
I'm making a draggable list with hello-pangea/dnd, which works well for web, but on mobile, you have to touch an item for a bit before it registers. Is there a way to make it more sensitive? I've ...
1 vote
0 answers
106 views
Row and column draggable card using react beautiful dnd both rows and columns can be multiple (Reference : Clickup Swimlane)
So i want create a dnd structure like row and column drop its more like task management and below provided its basic column dnd and i need implement with row and column so initial tasks structure can ...
1 vote
0 answers
145 views
Separator after x elements in a react-beautiful-dnd list
I'm trying to have a separator between my 3rd and 4th element in a react-beautiful-dnd <Droppable/>. It's pretty easy to have the separator before drag and after drag, the problem is when it ...
1 vote
0 answers
66 views
cards dont always jump to make space for a new card when reordering list
I am currently trying to implement a drag and drop in a project of mine! I have this strange thing happen sometimes where after I moved cards around once or twice and I try and move another one, it ...
0 votes
1 answer
632 views
react dnd beautiful - nested dropzone
I'm attempting to create both a vertical and a horizontal list, and to add elements to them from an external source. The issue I'm encountering is that the horizontal dropzone isn't activating ...
0 votes
0 answers
125 views
drag and drop issue within Drawer using react-beautiful-dnd
My problem is why destination and source is not same when i drag and drop within same droppableId (droppableId="drawer-droppable"). how to fix this issue? ` import { DragDropContext, ...