Comments (9)
Hey @jaimelr10, answering your questions:
- Yes this looks like a bug, it shouldn't show the draggable icon.
- Yes this is the behavior of the
draggable
property on the item it disables the DnD functionality for the specific item.
Normally we recommend using onItemMove
to decide if the item can be moved to another specific item, what would be your use case for disabling item drag? Is this just a drop aria?
from clay.
Hi @matuzalemsteles , thanks for answering!
- Ok, I'll fill I ticket for you to work on it when you can
😄 - For my use case:
- There is a list of items
- You can select an item to be moved
- This opens a modal with a TreeView containing the hierarchy of items where you can move the selected one.
- It would be fine to only allow dragging the selected item while allowing dropping it on other items.
from clay.
@jaimelr10 I don't know if I understand correctly but your use case is that one item can only be draggable and the rest only droppable? Isn't this confusing for the user when opening the modal and seeing a tree view to start the drag? Do you have the mockup of the screens so I can understand better?
from clay.
@matuzalemsteles I'll try to explain it :)
We want to improve the move modal action in Knowledge Base by changing the actual move page for a modal that handles the move instead.
For this, we click the move button in the dropdown, and this modal appears.
Here is where we would like to have Article 1 (for example) with the DnD functionality and the other items with the cappability to have an item dropped on them, but without being draggable
from clay.
@jaimelr10 I see, this can be a little awkward for the user I would say, he needs to go to the specific item in the list and click on move to be able to move inside a TreeView, it seems like a lot of work for the user to finally be able to move if he wants to do more a change for example. I would say that having a TreeView with the DnD option enabled for all items always visible with a right or left panel would be much more comfortable for the user to make the change at any time. Just an opinion about this behavior, what do you think @emiliano-cicero.
But regarding its behavior I think I understand, we can probably separate the behavior and have the draggable
and droppable
APIs to disable just one part of DnD, I have to investigate this further because the way it's done today the DnD this is a bit tricky.
from clay.
Hey guys, in my opinion the item to move (Article 1) shouldn’t appear on the tree view list and eventually I would also limit the draggable possibilities of the others because it actually can change the folder structure and it can be very tricky.
The goal of the tree view in this scenario should be to directly select the destination without having to drag anything at all.
from clay.
Hey @emiliano-cicero maybe you're missing some important details here because of the bug we had before.
So, the ideal behavior is that in the Move modal, the user will be able to see the KB hierarchy. The item that the user wants to move will be in the active state and will have a drag-dot icon. So, only the item to be moved should be highlighted with the DnD option enabled. I think you may have thought that we allow the user to move several items at the same time in the modal because in the previous screenshot all the items had the icon, and this is not correct (Added a screenshot of how it should really look like).
Even so, do you think we should not show the item that the user is moving? that's not bad in terms of accessibility?
![Move article-3](https://user-images.githubusercontent.com/97661579/241929418-f76fbcae-3b38-4739-b94d-a680d8876780.png)
from clay.
If we're talking about the tree view in the Sidebar, yes, it should allow drag and drop and moving things around since it's the main feature.
But if we're talking about the tree view inside the modal, it should only show the Folders and only allow to select a one that will be the destination, anything else will just make the interactions more complex to the user. Why would they need more inside the modal?
Also, the title of the modal should be "Moving Barcelona to" to give more context of what's going on, but the item itself shouldn't be visible.
from clay.
Why should we only show folders in the modal? The user can move one article to another one, it is a real use case. Anyway, we can talk about this in a quick call, I think it should be easier to clarify :)
from clay.
Related Issues (20)
- ClayMultiSelect doesn't register an 'onChange' event when it is inside of a form HOT 6
- DropDown with group and no items breaks component HOT 1
- Modal doesn't allow for dynamically growing height. HOT 3
- Possibility of specify different aria-label for Cards HOT 1
- Empty state reduced-motion is not working correctly HOT 6
- Picker menu is not visible when open
- Vertical nav and pagination border to be a straight shape HOT 1
- `onChange` callback doesn't fire for "uncontrolled" components HOT 1
- New design for the year select inside the date picker HOT 1
- @clayui/css: Variables _icons.scss shouldn't fail if $nav-link-padding-y is unavailable HOT 1
- Vertical Navigation Dance HOT 1
- MultiSelect is not doing autocomplete filter
- @clayui/css: Add utilities for globally set/disable text underline, letter spacing, truncating, focus borders HOT 4
- TreeViewItem is not being read correctly with the screen reader HOT 2
- New AI icon for Echo HOT 1
- New Accessibility Icon HOT 1
- @clayui/css: Cadmin btn-sm icons should be 16px x 16px HOT 1
- Passing a `children` function to MultiSelect behaves oddly HOT 9
- MultiSelect: provide backward compatibility for `menuRenderer` HOT 1
- Autocomplete menu added to `dropdown-menu-indicator-start` class unnecessarily HOT 1
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 clay.