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

feat(tree-view): update docs/types

Browse source
This commit is contained in:
metonym 2021-10-13 08:28:08 -07:00
commit 4f22c7fc1c
4 changed files with 86 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

22
COMPONENT_INDEX.md
View file

@ -4752,15 +4752,19 @@ export interface TreeNode {
### Props
| Prop name | Kind | Reactive | Type | Default value | Description |
| :---------- | :--------------- | :------- | :------------------------------------------------------- | ---------------------- | --------------------------------------------------------------- |
| expandedIds | <code>let</code> | Yes | <code>TreeNodeId[]</code> | <code>[]</code> | Set the node ids to be expanded |
| selectedIds | <code>let</code> | Yes | <code>TreeNodeId[]</code> | <code>[]</code> | Set the node ids to be selected |
| activeId | <code>let</code> | Yes | <code>TreeNodeId</code> | <code>""</code> | Set the current active node id<br />Only one node can be active |
| children | <code>let</code> | No | <code>Array<TreeNode & { children?: TreeNode[] }></code> | <code>[]</code> | Provide an array of children nodes to render |
| size | <code>let</code> | No | <code>"default" &#124; "compact"</code> | <code>"default"</code> | Specify the TreeView size |
| labelText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the label text |
| hideLabel | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to visually hide the label text |
| Prop name | Kind | Reactive | Type | Default value | Description |
| :------------ | :-------------------- | :------- | :------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ |
| expandedIds | <code>let</code> | Yes | <code>TreeNodeId[]</code> | <code>[]</code> | Set the node ids to be expanded |
| selectedIds | <code>let</code> | Yes | <code>TreeNodeId[]</code> | <code>[]</code> | Set the node ids to be selected |
| activeId | <code>let</code> | Yes | <code>TreeNodeId</code> | <code>""</code> | Set the current active node id<br />Only one node can be active |
| children | <code>let</code> | No | <code>Array<TreeNode & { children?: TreeNode[] }></code> | <code>[]</code> | Provide an array of children nodes to render |
| size | <code>let</code> | No | <code>"default" &#124; "compact"</code> | <code>"default"</code> | Specify the TreeView size |
| labelText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the label text |
| hideLabel | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to visually hide the label text |
| expandAll | <code>function</code> | No | <code>() => void</code> | <code>() => { expandedIds = [...nodeIds]; }</code> | Programmatically expand all nodes |
| collapseAll | <code>function</code> | No | <code>() => void</code> | <code>() => { expandedIds = []; }</code> | Programmatically collapse all nodes |
| expandNodes | <code>function</code> | No | <code>(filterId?: (node: TreeNode) => boolean) => void</code> | <code>() => { expandedIds = nodes .filter((node) => !filterNode(node)) .map((node) => node.id); }</code> | Programmatically expand a subset of nodes.<br />Expands all nodes if no argument is provided |
| collapseNodes | <code>function</code> | No | <code>(filterId?: (node: TreeNode) => boolean) => void</code> | <code>() => { expandedIds = nodes .filter((node) => !filterNode(node)) .map((node) => node.id); }</code> | Programmatically collapse a subset of nodes.<br />Collapses all nodes if no argument is provided |
### Slots

44
docs/src/COMPONENT_API.json
View file

@ -13152,6 +13152,50 @@
"isFunctionDeclaration": false,
"constant": false,
"reactive": false
},
{
"name": "expandAll",
"kind": "function",
"description": "Programmatically expand all nodes",
"type": "() => void",
"value": "() => { expandedIds = [...nodeIds]; }",
"isFunction": true,
"isFunctionDeclaration": true,
"constant": false,
"reactive": false
},
{
"name": "collapseAll",
"kind": "function",
"description": "Programmatically collapse all nodes",
"type": "() => void",
"value": "() => { expandedIds = []; }",
"isFunction": true,
"isFunctionDeclaration": true,
"constant": false,
"reactive": false
},
{
"name": "expandNodes",
"kind": "function",
"description": "Programmatically expand a subset of nodes.\nExpands all nodes if no argument is provided",
"type": "(filterId?: (node: TreeNode) => boolean) => void",
"value": "() => { expandedIds = nodes .filter((node) => !filterNode(node)) .map((node) => node.id); }",
"isFunction": true,
"isFunctionDeclaration": true,
"constant": false,
"reactive": false
},
{
"name": "collapseNodes",
"kind": "function",
"description": "Programmatically collapse a subset of nodes.\nCollapses all nodes if no argument is provided",
"type": "(filterId?: (node: TreeNode) => boolean) => void",
"value": "() => { expandedIds = nodes .filter((node) => !filterNode(node)) .map((node) => node.id); }",
"isFunction": true,
"isFunctionDeclaration": true,
"constant": false,
"reactive": false
}
],
"slots": [

2
src/TreeView/TreeView.svelte
View file

@ -46,6 +46,7 @@
/**
* Programmatically expand all nodes
* @type {() => void}
*/
export function expandAll() {
expandedIds = [...nodeIds];
@ -53,6 +54,7 @@
/**
* Programmatically collapse all nodes
* @type {() => void}
*/
export function collapseAll() {
expandedIds = [];

28
types/TreeView/TreeView.d.ts vendored
View file

@ -66,4 +66,30 @@ export default class TreeView extends SvelteComponentTyped<
keydown: WindowEventMap["keydown"];
},
{ labelText: {} }
> {}
> {
/**
* Programmatically expand all nodes
* @default () => { expandedIds = [...nodeIds]; }
*/
expandAll: () => void;
/**
* Programmatically collapse all nodes
* @default () => { expandedIds = []; }
*/
collapseAll: () => void;
/**
* Programmatically expand a subset of nodes.
* Expands all nodes if no argument is provided
* @default () => { expandedIds = nodes .filter((node) => !filterNode(node)) .map((node) => node.id); }
*/
expandNodes: (filterId?: (node: TreeNode) => boolean) => void;
/**
* Programmatically collapse a subset of nodes.
* Collapses all nodes if no argument is provided
* @default () => { expandedIds = nodes .filter((node) => !filterNode(node)) .map((node) => node.id); }
*/
collapseNodes: (filterId?: (node: TreeNode) => boolean) => void;
}