Skip to content

Commit

Permalink
fix(list, list-item): calcite-select becomes unresponsive in a list-i…
Browse files Browse the repository at this point in the history
…tem if drag-disabled is true (#8957)

**Related Issue:** #8954

## Summary

- Sortablejs by default calls `event.preventDefault()` because the
option `preventOnFilter` is true by default.
- This affects any elements slotted within the `drag-disabled` list
item.
- In order to fix this, we move the `filter` selector to just the
`calcite-handle` instead of the whole `list-item`.

```js
filter: ".ignore-elements",  // Selectors that do not lead to dragging (String or Function)
preventOnFilter: true, // Call `event.preventDefault()` when triggered `filter`
```
  • Loading branch information
driskull authored Mar 19, 2024
1 parent ea8ea1e commit e408c62
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion packages/calcite-components/src/utils/sortableComponent.ts
Original file line number Diff line number Diff line change
Expand Up @@ -129,7 +129,7 @@ export function connectSortableComponent(component: SortableComponent): void {
},
}),
handle,
filter: "[drag-disabled]",
filter: `${handle}[disabled]`,
onStart: ({ from: fromEl, item: dragEl, to: toEl, newIndex, oldIndex }) => {
dragState.active = true;
onGlobalDragStart();
Expand Down

0 comments on commit e408c62

Please sign in to comment.