mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-16 02:41:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

Programmatically expand/collapse TreeView nodes (#850)

Browse source 
* feat(tree-view): add accessors to programmatically expand/collapse nodes

* feat(tree-view): update docs/types

* test(tree-view): test updated TreeView accessors

* docs(tree-view): document TreeView accessors
This commit is contained in:
Eric Liu 2021-10-13 08:54:37 -07:00 • committed by GitHub
commit c4413636a4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 447 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

32
docs/src/pages/components/TreeView.svx
View file

@ -45,4 +45,34 @@ Expanded nodes can be set using `expandedIds`.
Initial multiple selected nodes can be set using `selectedIds`.
<FileSource src="/framed/TreeView/TreeViewMultiselect" />
<FileSource src="/framed/TreeView/TreeViewMultiselect" />
### Expand all nodes
To programmatically expand all nodes, access the component instance using the [bind:this](https://svelte.dev/docs#bind_element) directive and invoke the `TreeView.expandAll()` method to expand all nodes.
<FileSource src="/framed/TreeView/TreeViewExpandAll" />
### Collapse all nodes
Similarly, invoke `TreeView.collapseAll()` to collapse all nodes.
<FileSource src="/framed/TreeView/TreeViewCollapseAll" />
### Expand a subset of nodes
Use the `TreeView.expandNodes` method to expand only a subset of nodes.
The method accepts an argument that takes a node and returns a boolean.
If no argument is provided, all nodes will be expanded.
<FileSource src="/framed/TreeView/TreeViewExpandNodes" />
### Collapse a subset of nodes
Use the `TreeView.collapseNodes` method to collapse a subset of nodes.
If no argument is provided, all nodes will be collapsed.
<FileSource src="/framed/TreeView/TreeViewCollapseNodes" />