SlTree: separate expand/collapse and selection behaviour in 'single' mode (#1521)

* Never select tree items when clicking the chevron

This changes the behaviour of sl-tree so that clicking on the expand/collapse icon will not select/deselect the item, only toggle it's expanded state.

* Refactor: inline SlTree.syncTreeItems

This was only called from 2 places, and they each had different
behaviour anyways.

* SlTree: separate expand/collapse from selection

This makes 'multi' and 'single' mode consistent with each other, and
with native file managers.
pull/1526/head
Stephen Sugden 2023-08-18 15:55:29 +02:00 zatwierdzone przez GitHub
rodzic 4ee5271a83
commit fad76dd1a2
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 4AEE18F83AFDEB23
1 zmienionych plików z 6 dodań i 20 usunięć

Wyświetl plik

@ -168,20 +168,6 @@ export default class SlTree extends ShoelaceElement {
}
};
private syncTreeItems(selectedItem: SlTreeItem) {
const items = this.getAllTreeItems();
if (this.selection === 'multiple') {
syncCheckboxes(selectedItem);
} else {
for (const item of items) {
if (item !== selectedItem) {
item.selected = false;
}
}
}
}
private selectItem(selectedItem: SlTreeItem) {
const previousSelection = [...this.selectedItems];
@ -190,12 +176,12 @@ export default class SlTree extends ShoelaceElement {
if (selectedItem.lazy) {
selectedItem.expanded = true;
}
this.syncTreeItems(selectedItem);
syncCheckboxes(selectedItem);
} else if (this.selection === 'single' || selectedItem.isLeaf) {
selectedItem.expanded = !selectedItem.expanded;
selectedItem.selected = true;
this.syncTreeItems(selectedItem);
const items = this.getAllTreeItems();
for (const item of items) {
item.selected = (item === selectedItem);
}
} else if (this.selection === 'leaf') {
selectedItem.expanded = !selectedItem.expanded;
}
@ -311,7 +297,7 @@ export default class SlTree extends ShoelaceElement {
return;
}
if (this.selection === 'multiple' && isExpandButton) {
if (isExpandButton) {
treeItem.expanded = !treeItem.expanded;
} else {
this.selectItem(treeItem);