drag-and-drop
Here are 873 public repositories matching this topic...
Plase add a feature to select items using shift key press. Like when user clicks an item and when he press shift and an item the items till the first mouse click to shift key press are to be selected like we can see in windows system or linux system.
- Add the react-beautiful-dnd package
Okay…
- Use the package
import { DragDropContext } from 'react-beautiful-dnd';
This is just an import statement…?
- Profit
🕺
How? Step 2 was just an import statement.
The rest of the doc goes into other topics. I'll have to dig around elsewhere to find out how to actually use it. It's not a helpful installation
I had found a couple of issues that could be clarified in the documentation and examples from the wiki.
Mock Server Files
The example doesn't work correctly when multiple mock files are removed the "drop files here" message is shown early due to the files property not being populated with the entries added programmatically. (I assume because they're objects not file instances). I tri
The contributing guidelines need to be fixed immediately. Issue creation guideline specially. We need to enforce adding label as one of the behaviours while creating a new issue.
cc- @tsov
Thanks for the awesome library but I'm stuck at this requirement, how do we show position or placeholder to drop items while drag an item like below:
So here, the left side is a simple list which contains list items.
Left side is :
- This is not droppable, draggable only
Jsfiddle link
https://jsfiddle.net/dede89/fd1rznmw/
Step by step scenario
incorrect order
<draggable class="dragArea" v-model="list1" :options="{draggable:'.item'}">
<div slot="header">
header slot
</div>
<div v-for="(element, index) in list1" :key="element.id" class="item">
{{element.
-
Updated
May 15, 2020 - JavaScript
-
Updated
May 25, 2020 - TypeScript
-
Updated
May 26, 2020 - JavaScript
Documentation
First of all, a huge thank you for this awesome project. We use it in production at our company and it works just great (has saved us many hours of coding)
I also want to contribute to this project in some way, but im still new in the Javascript world.
Anyway, here are some ways in which I am capable to help with::
- Documentation Site (https://docusaurus.io/)
- Translate the docs to ger
Examples available here: http://clauderic.github.io/react-sortable-hoc/
like basic usage, there has the code of this example.
Support all of the examples with it's code ?
Do you want to request a feature or report a bug?
- I found a bug
What is the current behavior?
In the documentation, clicking on See **Events** for more examples. (https://react-dropzone.js.o
-
Updated
May 15, 2020 - JavaScript
This is a feature request for text ... I'd like to be able to write text with only an outer stroke (no inner stroke).
The main issue with the current fillStroke function is that the stroke gets added to the inside of the font, which makes the font skinnier and hard to read at small sizes.
Here is an example of what Konva does (top text is no stroke, bottom is with a stroke)
![screen shot 20
In my app I need to modify the drop position. If the item is hovering over position X, I need to say that the item will really drop in position Y, and have item Y open up so that it's visually clear to the user that this will happen.
iOS UITableView supports this with this delegate method.
https://strml.github.io/react-grid-layout/examples/8-localstorage-responsive.html
When I resize browser window , if I want to get responsive layoutData at different width , there is no event for that , only can get it through the outerWidth , then according the width get the breakpoint.
With this event , I can save layoutData at the breakpoint changed immediately.
thx.
- User case:
- for programmers new to the library to get some context on how to add customization functions and styles
- Implementation ideas:
- Thinking of creating a markdown doc or webpage or something
-
Updated
May 14, 2020 - Kotlin
I run into this project and want to build more components for it. Can we have a possible guideline for new contributors?
I couldn't find any examples of what the JSON format looked like, and I wanted to be sure the format was relatively independent of Craft itself. However, the JSON uses node IDs instead of nesting the nodes themselves, which I find confusing.
For example, with these Frame contents:
<Frame>
<Canvas is={CraftContainer}>
<CraftComponent>
<TextComponent text="my text here" />
As per the documentation in this link, providing user object in unlayer's init method should enable 'User Saved Blocks` feature.
However, when providing user's object via options props like below, it should pass the user's object to init method.
<EmailEditor
ref={editor => (this.editor = editor)}
options = {
user: { id:
-
Updated
Mar 8, 2019 - Objective-C
The documentation is unclear about what 'position' does in the template headers. I now understand it has an influence on the position in the dropdown (nice!), but I had to discover that through trial and error.
-
Updated
May 28, 2020 - TypeScript
Example in the readme gives compile error.
Error in ./src/App.js Syntax error: C:/data/projects/test-admin/src/App.js: 'this' is not allowed before super() 10 | class App extends Component {
11 | constructor() {
12 | this.state = {
| ^
13 | widgets: {
14 | WordCounter: {
15 | type: CounterWidget, @ ./src/index.js 13:11-27
A really minor 'problem':
the draggable component's render documentation says it recieves the 'ref ' parameter, when it doensn't happen.
Container:120 >> return this.props.render(this.containerRef);
Draggable:21 >> return React.cloneElement(this.props.render(), { className: wrapperClass });
Originates from #519
Current behavior:
When acceptFrom is used, but no sortable with the selector can be found the sortable freezes.
Needs validation: This should be validated with an example on codepen.
Desired behavior:
- Catch error from isConnected and log to console.
- Make sure the sor
What steps will reproduce this issue?
If a message box appears when you start dragging a file, mouse operations are disabled.
As a result of investigation, the cause that occurs seems to be due to two factors.
- Values are set to IDragIndo.Data and IDragInfo.Effects
- Delay the display of MessageBox
Problematic image
![error-image](https://user-images.githubuserconten
Hi. I feel the scroll speed increases pretty quickly on drag. If the list size is small that speed seems too much.
Is there a way to slow that down? Maybe allow to provide a speed function as configuration?
Improve this page
Add a description, image, and links to the drag-and-drop topic page so that developers can more easily learn about it.
Add this topic to your repo
To associate your repository with the drag-and-drop topic, visit your repo's landing page and select "manage topics."
Is your feature request related to a problem? Please describe.
readme is lengthy, verbose, not up to date and difficult to navigate.
Describe the solution you'd like
Add a separate set of docs host on github pages or in the wiki.
Describe alternatives you've considered
This is the alternative.
Additional context
Missing API's, missing examples, missing common solution