mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-14 18:01:06 +00:00
Code Issues Projects Releases Packages Wiki Activity

Fix to only set nodes prop when nodesFlat is provided

Browse source
This commit is contained in:
Bram 2024-11-26 23:08:03 +01:00 • committed by Eric Liu
commit c41a776405
4 changed files with 25 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

3
COMPONENT_INDEX.md
View file

@ -4704,7 +4704,8 @@ export interface TreeNode {
| expandedIds | No | <code>let</code> | Yes | <code>ReadonlyArray<TreeNodeId></code> | <code>[]</code> | Set the node ids to be expanded | | expandedIds | No | <code>let</code> | Yes | <code>ReadonlyArray<TreeNodeId></code> | <code>[]</code> | Set the node ids to be expanded |
| selectedIds | No | <code>let</code> | Yes | <code>ReadonlyArray<TreeNodeId></code> | <code>[]</code> | Set the node ids to be selected | | selectedIds | No | <code>let</code> | Yes | <code>ReadonlyArray<TreeNodeId></code> | <code>[]</code> | Set the node ids to be selected |
| activeId | No | <code>let</code> | Yes | <code>TreeNodeId</code> | <code>""</code> | Set the current active node id<br />Only one node can be active | | activeId | No | <code>let</code> | Yes | <code>TreeNodeId</code> | <code>""</code> | Set the current active node id<br />Only one node can be active |
| nodes | No | <code>let</code> | No | <code>Array<TreeNode></code> | <code>[]</code> | Provide an array of nodes to render | | nodes | No | <code>let</code> | Yes | <code>Array<TreeNode></code> | <code>[]</code> | Provide a nested array of nodes to render |
| nodesFlat | No | <code>let</code> | No | <code>Array<TreeNode>[]</code> | <code>[]</code> | Provide a flat array of nodes to render |
| size | No | <code>let</code> | No | <code>"default" &#124; "compact"</code> | <code>"default"</code> | Specify the TreeView size | | size | No | <code>let</code> | No | <code>"default" &#124; "compact"</code> | <code>"default"</code> | Specify the TreeView size |
| labelText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the label text | | labelText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the label text |
| hideLabel | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to visually hide the label text | | hideLabel | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to visually hide the label text |

14
docs/src/COMPONENT_API.json
View file

@ -17770,13 +17770,25 @@
{ {
"name": "nodes", "name": "nodes",
"kind": "let", "kind": "let",
"description": "Provide an array of nodes to render", "description": "Provide a nested array of nodes to render",
"type": "Array<TreeNode>", "type": "Array<TreeNode>",
"value": "[]", "value": "[]",
"isFunction": false, "isFunction": false,
"isFunctionDeclaration": false, "isFunctionDeclaration": false,
"isRequired": false, "isRequired": false,
"constant": false, "constant": false,
"reactive": true
},
{
"name": "nodesFlat",
"kind": "let",
"description": "Provide a flat array of nodes to render",
"type": "Array<TreeNode>[]",
"value": "[]",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
"constant": false,
"reactive": false "reactive": false
}, },
{ {

4
src/TreeView/TreeView.svelte
View file

@ -268,7 +268,9 @@
}, []); }, []);
} }
$: nodes = createNestedArray(nodesFlat); $: if (nodesFlat.length > 0) {
nodes = createNestedArray(nodesFlat);
}
$: flattenedNodes = traverse(nodes); $: flattenedNodes = traverse(nodes);
$: nodeIds = flattenedNodes.map((node) => node.id); $: nodeIds = flattenedNodes.map((node) => node.id);
$: activeNodeId.set(activeId); $: activeNodeId.set(activeId);

8
types/TreeView/TreeView.svelte.d.ts vendored
View file

@ -15,11 +15,17 @@ type $RestProps = SvelteHTMLElements["ul"];
type $Props = { type $Props = {
/** /**
* Provide an array of nodes to render * Provide a nested array of nodes to render
* @default [] * @default []
*/ */
nodes?: Array<TreeNode>; nodes?: Array<TreeNode>;
/**
* Provide a flat array of nodes to render
* @default []
*/
nodesFlat?: Array<TreeNode>[];
/** /**
* Set the current active node id * Set the current active node id
* Only one node can be active * Only one node can be active