diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index 4894de47..c7c72fca 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -4699,20 +4699,20 @@ export interface TreeNode {
### Props
-| Prop name | Required | Kind | Reactive | Type | Default value | Description |
-| :------------ | :------- | :-------------------- | :------- | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------- |
-| expandedIds | No | let
| Yes | ReadonlyArray
| []
| Set the node ids to be expanded |
-| selectedIds | No | let
| Yes | ReadonlyArray
| []
| Set the node ids to be selected |
-| activeId | No | let
| Yes | TreeNodeId
| ""
| Set the current active node id
Only one node can be active |
-| nodes | No | let
| No | Array
| []
| Provide an array of nodes to render |
-| size | No | let
| No | "default" | "compact"
| "default"
| Specify the TreeView size |
-| labelText | No | let
| No | string
| ""
| Specify the label text |
-| hideLabel | No | let
| No | boolean
| false
| Set to `true` to visually hide the label text |
-| expandAll | No | function
| No | () => void
| () => { expandedIds = [...nodeIds]; }
| Programmatically expand all nodes |
-| collapseAll | No | function
| No | () => void
| () => { expandedIds = []; }
| Programmatically collapse all nodes |
-| expandNodes | No | function
| No | (filterId?: (node: TreeNode) => boolean) => void
| () => { expandedIds = flattenedNodes .filter( (node) => filterNode(node) || node.nodes?.some((child) => filterNode(child) && child.nodes), ) .map((node) => node.id); }
| Programmatically expand a subset of nodes.
Expands all nodes if no argument is provided |
-| collapseNodes | No | function
| No | (filterId?: (node: TreeNode) => boolean) => void
| () => { expandedIds = flattenedNodes .filter((node) => expandedIds.includes(node.id) && !filterNode(node)) .map((node) => node.id); }
| Programmatically collapse a subset of nodes.
Collapses all nodes if no argument is provided |
-| showNode | No | function
| No | (id: TreeNodeId) => void
| () => { for (const child of nodes) { const nodes = findNodeById(child, id); if (nodes) { const ids = nodes.map((node) => node.id); const nodeIds = new Set(ids); expandNodes((node) => nodeIds.has(node.id)); const lastId = ids[ids.length - 1]; activeId = lastId; selectedIds = [lastId]; tick().then(() => { ref?.querySelector(\`[id="${lastId}"]\`)?.focus(); }); // Break out of the loop if the node is found. break; } } }
| Programmatically show a node by `id`.
The matching node will be expanded, selected, and focused |
+| Prop name | Required | Kind | Reactive | Type | Default value | Description |
+| :------------ | :------- | :-------------------- | :------- | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------- |
+| expandedIds | No | let
| Yes | ReadonlyArray
| []
| Set the node ids to be expanded |
+| selectedIds | No | let
| Yes | ReadonlyArray
| []
| Set the node ids to be selected |
+| activeId | No | let
| Yes | TreeNodeId
| ""
| Set the current active node id
Only one node can be active |
+| nodes | No | let
| No | Array
| []
| Provide an array of nodes to render |
+| size | No | let
| No | "default" | "compact"
| "default"
| Specify the TreeView size |
+| labelText | No | let
| No | string
| ""
| Specify the label text |
+| hideLabel | No | let
| No | boolean
| false
| Set to `true` to visually hide the label text |
+| expandAll | No | function
| No | () => void
| () => { expandedIds = [...nodeIds]; }
| Programmatically expand all nodes |
+| collapseAll | No | function
| No | () => void
| () => { expandedIds = []; }
| Programmatically collapse all nodes |
+| expandNodes | No | function
| No | (filterId?: (node: TreeNode) => boolean) => void
| () => { expandedIds = flattenedNodes .filter( (node) => filterNode(node) || node.nodes?.some((child) => filterNode(child) && child.nodes), ) .map((node) => node.id); }
| Programmatically expand a subset of nodes.
Expands all nodes if no argument is provided |
+| collapseNodes | No | function
| No | (filterId?: (node: TreeNode) => boolean) => void
| () => { expandedIds = flattenedNodes .filter((node) => expandedIds.includes(node.id) && !filterNode(node)) .map((node) => node.id); }
| Programmatically collapse a subset of nodes.
Collapses all nodes if no argument is provided |
+| showNode | No | function
| No | (id: TreeNodeId) => void
| () => { for (const child of nodes) { const nodes = findNodeById(child, id); if (nodes) { const ids = nodes.map((node) => node.id); const nodeIds = new Set(ids); expandNodes((node) => nodeIds.has(node.id)); const lastId = ids[ids.length - 1]; activeId = lastId; selectedIds = [lastId]; tick().then(() => { ref?.querySelector(\`[id="${lastId}"]\`)?.focus(); }); break; } } }
| Programmatically show a node by `id`.
The matching node will be expanded, selected, and focused |
### Slots
diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json
index f812a517..84d0f02e 100644
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@@ -14838,7 +14838,7 @@
"kind": "function",
"description": "Programmatically show a node by `id`.\nThe matching node will be expanded, selected, and focused",
"type": "(id: TreeNodeId) => void",
- "value": "() => { for (const child of nodes) { const nodes = findNodeById(child, id); if (nodes) { const ids = nodes.map((node) => node.id); const nodeIds = new Set(ids); expandNodes((node) => nodeIds.has(node.id)); const lastId = ids[ids.length - 1]; activeId = lastId; selectedIds = [lastId]; tick().then(() => { ref?.querySelector(`[id=\"${lastId}\"]`)?.focus(); }); // Break out of the loop if the node is found. break; } } }",
+ "value": "() => { for (const child of nodes) { const nodes = findNodeById(child, id); if (nodes) { const ids = nodes.map((node) => node.id); const nodeIds = new Set(ids); expandNodes((node) => nodeIds.has(node.id)); const lastId = ids[ids.length - 1]; activeId = lastId; selectedIds = [lastId]; tick().then(() => { ref?.querySelector(`[id=\"${lastId}\"]`)?.focus(); }); break; } } }",
"isFunction": true,
"isFunctionDeclaration": true,
"isRequired": false,
diff --git a/src/TreeView/TreeView.svelte b/src/TreeView/TreeView.svelte
index 3035fafb..31e3f267 100644
--- a/src/TreeView/TreeView.svelte
+++ b/src/TreeView/TreeView.svelte
@@ -139,7 +139,6 @@
ref?.querySelector(`[id="${lastId}"]`)?.focus();
});
- // Break out of the loop if the node is found.
break;
}
}