mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-14 18:01:06 +00:00
fix(multi-select): fix sorting behavior
- Menu items are sorted when the component renders. - With selectionFeedback: top, selected items are immediately pinned to the top. - With selectionFeedback: top-after-reopen, selected items are pinned to the top only after the dropdown is closed. - With selectionFeedback: fixed, selected items are never pinned to the top. Fixes #2066
This commit is contained in:
parent
e165fa3a87
commit
c3a390f3fe
1 changed files with 19 additions and 6 deletions
|
@ -243,11 +243,11 @@
|
|||
}
|
||||
});
|
||||
|
||||
$: menuId = `menu-${id}`;
|
||||
$: inline = type === "inline";
|
||||
$: ariaLabel = $$props["aria-label"] || "Choose an item";
|
||||
$: sortedItems = (() => {
|
||||
if (selectionFeedback === "top" && selectedIds.length > 0) {
|
||||
function sort() {
|
||||
if (
|
||||
selectionFeedback === "top" ||
|
||||
selectionFeedback === "top-after-reopen"
|
||||
) {
|
||||
const checkedItems = items
|
||||
.filter((item) => selectedIds.includes(item.id))
|
||||
.map((item) => ({ ...item, checked: true }));
|
||||
|
@ -269,7 +269,20 @@
|
|||
checked: selectedIds.includes(item.id),
|
||||
}))
|
||||
.sort(sortItem);
|
||||
})();
|
||||
}
|
||||
|
||||
let sortedItems = sort();
|
||||
|
||||
$: menuId = `menu-${id}`;
|
||||
$: inline = type === "inline";
|
||||
$: ariaLabel = $$props["aria-label"] || "Choose an item";
|
||||
$: if (
|
||||
selectedIds &&
|
||||
(selectionFeedback === "top" ||
|
||||
(selectionFeedback === "top-after-reopen" && open === false))
|
||||
) {
|
||||
sortedItems = sort();
|
||||
}
|
||||
$: checked = sortedItems.filter(({ checked }) => checked);
|
||||
$: unchecked = sortedItems.filter(({ checked }) => !checked);
|
||||
$: filteredItems = sortedItems.filter((item) => filterItem(item, value));
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue