FilterTree

The fds-filter-tree provides a tree that could be used to display hierarchy data.

Usage

Import

npm i @finastra/filter-tree

import '@finastra/filter-tree';
...
<fds-filter-tree items=[
  {
    label: 'Consumer Banking',
    children: [
      {
        label: 'Alerts',
        isSelected: true
      },
      {
        label: 'Customer Management'
      }
    ],
  },
  {
    label: 'Money Movement'
  },
  {
    label: 'Financial Toolbox'
  }
]>
</fds-filter-tree>

API

Properties

| Property | Attribute | Type | Default | Description | |----------|-----------|--------------|---------|----------------| | items | items | treenode[] | [] | List of items. |

Methods

| Method | Type | |--------------------------------|--------------------------------------------------| | checkDescendants | (item: treenode, indexInTreeNode: any): void | | checkIndeterminate | (nodeEl: HTMLElement): void | | descendantsAllSelected | (node: flattreenode): boolean | | descendantsPartiallySelected | (node: flattreenode): boolean | | deselectChildren | (items: treenode[]): void | | findIndex | (node: flattreenode): any | | flatTreeTransformer | (items: treenode[], level: number \| undefined, flatTreeTransf: flattreenode[]): flattreenode[] | | getDescendants | (node: flattreenode): flattreenode[] | | getNodeElementById | (id: string): any | | getParentNode | (node: flattreenode): flattreenode \| null | | haveChildren | (item: treenode): boolean | | init | (items: treenode[]): void | | initSelection | (item: treenode, indexInTreeNode: any): void | | isSelected | (node: flattreenode): boolean | | notifyParent | (node: flattreenode): void | | onExpandClick | (item: treenode, index: number, event: CustomEvent<any>): void | | onRequestSelected | (item: treenode, index: number, event: CustomEvent<any>): void | | onSelect | (item: treenode, nodeEl: HTMLElement, indexInTreeNode: number, indexInFlatTreeNode: number, eventType: string): void | | renderChildren | (items: treenode[]): any | | selectChildren | (items: treenode[]): void | | toFlatTreeNode | (item: treenode, index: any): flattreenode |

Events

| Event | Type | |---------------------|--------------------------| | filter-tree-check | CustomEvent<treestate> |