Skip to content

tree-select

tree-select

Classes

RequiredTreeChildNode

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:37

Required child node (selecting it requires all siblings to be selected)

Type Parameters

Type Parameter
TMetadata

Constructors

Constructor
new RequiredTreeChildNode<TMetadata>(params): RequiredTreeChildNode<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:48

Parameters
Parameter Type
params { action?: NodeActionCallback<TMetadata>; depth: number; displayDepth: number; icon: string; id: string; metadata: TMetadata; parentNode: | TreeParentNode<TMetadata> | undefined; searchText?: string; title: string; treeState: TreeState<TMetadata>; }
params.action? NodeActionCallback<TMetadata>
params.depth number
params.displayDepth number
params.icon string
params.id string
params.metadata TMetadata
params.parentNode | TreeParentNode<TMetadata> | undefined
params.searchText? string
params.title string
params.treeState TreeState<TMetadata>
Returns

RequiredTreeChildNode<TMetadata>

Properties

action?
readonly optional action?: NodeActionCallback<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:46

depth
readonly depth: number;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:42

displayDepth
readonly displayDepth: number;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:43

icon
readonly icon: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:41

id
readonly id: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:38

metadata
readonly metadata: TMetadata;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:44

parentNode
readonly parentNode: 
  | TreeParentNode<TMetadata>
  | undefined;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:45

searchText?
readonly optional searchText?: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:40

title
readonly title: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:39

treeState
readonly treeState: TreeState<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:47

Accessors

disabled
Get Signature
get disabled(): boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:61

Returns

boolean

isSelected
Get Signature
get isSelected(): boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:60

Returns

boolean

TreeChildNode

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:8

Regular child node (leaf node)

Type Parameters

Type Parameter
TMetadata

Constructors

Constructor
new TreeChildNode<TMetadata>(params): TreeChildNode<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:19

Parameters
Parameter Type
params { action?: NodeActionCallback<TMetadata>; depth: number; displayDepth: number; icon: string; id: string; metadata: TMetadata; parentNode: | TreeParentNode<TMetadata> | undefined; searchText?: string; title: string; treeState: TreeState<TMetadata>; }
params.action? NodeActionCallback<TMetadata>
params.depth number
params.displayDepth number
params.icon string
params.id string
params.metadata TMetadata
params.parentNode | TreeParentNode<TMetadata> | undefined
params.searchText? string
params.title string
params.treeState TreeState<TMetadata>
Returns

TreeChildNode<TMetadata>

Properties

action?
readonly optional action?: NodeActionCallback<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:17

depth
readonly depth: number;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:13

displayDepth
readonly displayDepth: number;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:14

icon
readonly icon: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:12

id
readonly id: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:9

metadata
readonly metadata: TMetadata;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:15

parentNode
readonly parentNode: 
  | TreeParentNode<TMetadata>
  | undefined;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:16

searchText?
readonly optional searchText?: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:11

title
readonly title: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:10

treeState
readonly treeState: TreeState<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:18

Accessors

disabled
Get Signature
get disabled(): boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:32

Returns

boolean

isSelected
Get Signature
get isSelected(): boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:31

Returns

boolean

TreeParentNode

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:66

Parent node (has children)

Type Parameters

Type Parameter
TMetadata

Constructors

Constructor
new TreeParentNode<TMetadata>(params): TreeParentNode<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:79

Parameters
Parameter Type
params { action?: NodeActionCallback<TMetadata>; children?: TreeNodes<TMetadata>[]; depth: number; displayDepth: number; icon: string; id: string; metadata: TMetadata; parentNode: | TreeParentNode<TMetadata> | undefined; searchText?: string; title: string; treeState: TreeState<TMetadata>; }
params.action? NodeActionCallback<TMetadata>
params.children? TreeNodes<TMetadata>[]
params.depth number
params.displayDepth number
params.icon string
params.id string
params.metadata TMetadata
params.parentNode | TreeParentNode<TMetadata> | undefined
params.searchText? string
params.title string
params.treeState TreeState<TMetadata>
Returns

TreeParentNode<TMetadata>

Properties

action?
readonly optional action?: NodeActionCallback<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:76

children
readonly children: TreeNodes<TMetadata>[];

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:78

depth
readonly depth: number;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:72

displayDepth
readonly displayDepth: number;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:73

icon
readonly icon: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:71

id
readonly id: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:68

metadata
readonly metadata: TMetadata;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:74

parentNode
readonly parentNode: 
  | TreeParentNode<TMetadata>
  | undefined;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:75

searchText?
readonly optional searchText?: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:70

title
readonly title: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:69

treeState
readonly treeState: TreeState<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:77

Accessors

disabled
Get Signature
get disabled(): boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:93

Returns

boolean

isExpanded
Get Signature
get isExpanded(): boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:92

Returns

boolean

isIndeterminate
Get Signature
get isIndeterminate(): boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:94

Returns

boolean

isSelected
Get Signature
get isSelected(): boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:95

Returns

boolean

TreeState

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:97

Type Parameters

Type Parameter
TMetadata

Constructors

Constructor
new TreeState<TMetadata>(params): TreeState<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:115

Parameters
Parameter Type
params TreeSelectStateProps<TMetadata>
Returns

TreeState<TMetadata>

Properties

activeNodeId
activeNodeId: string | null;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:107

activeRootIndex
activeRootIndex: number;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:104

activeRootNode
activeRootNode: TreeParentNode<TMetadata>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:109

disabledNodeIds
disabledNodeIds: SvelteSet<string>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:106

expandedNodeIds
expandedNodeIds: SvelteSet<string>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:102

filterValue
filterValue: string;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:103

matchInfo
matchInfo: Map<string, {
  end: number;
  start: number;
}>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:111

multiple
readonly multiple: boolean;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:100

onChange?
readonly optional onChange?: (state) => void;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:101

Parameters
Parameter Type
state SelectionState
Returns

void

rootNodes
readonly rootNodes: TreeParentNode<TMetadata>[];

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:99

selectedNodeIds
selectedNodeIds: SvelteSet<string>;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:105

visibleNodes
visibleNodes: TreeNodes<TMetadata>[];

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:110

Methods

clearAllSelections()
clearAllSelections(): void;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:122

Returns

void

findNode()
findNode(nodeId): 
  | TreeNodes<TMetadata>
  | null;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:116

Parameters
Parameter Type
nodeId string
Returns

| TreeNodes<TMetadata> | null

notifyChange()
notifyChange(): void;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:123

Returns

void

setActiveNode()
setActiveNode(nodeId): void;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:120

Parameters
Parameter Type
nodeId string | null
Returns

void

setActiveRootIndex()
setActiveRootIndex(index): void;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:121

Parameters
Parameter Type
index number
Returns

void

toggleDisable()
toggleDisable(nodeId): void;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:118

Parameters
Parameter Type
nodeId string
Returns

void

toggleExpand()
toggleExpand(nodeId): void;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:117

Parameters
Parameter Type
nodeId string
Returns

void

toggleSelection()
toggleSelection(nodeId): void;

Defined in: packages/ui/build/tree-select/tree-select-state.svelte.d.ts:119

Parameters
Parameter Type
nodeId string
Returns

void

Interfaces

BaseTreeItem

Defined in: packages/ui/build/tree-select/index.d.ts:31

Base item structure used for initializing the tree

Type Parameters

Type Parameter
TMetadata

Properties

action?
optional action?: NodeActionCallback<TMetadata>;

Defined in: packages/ui/build/tree-select/index.d.ts:47

Optional action to render next to the node

children?
optional children?: BaseTreeItem<TMetadata>[];

Defined in: packages/ui/build/tree-select/index.d.ts:41

Child items under this node

icon
icon: string;

Defined in: packages/ui/build/tree-select/index.d.ts:39

Icon identifier for the node

id
id: string;

Defined in: packages/ui/build/tree-select/index.d.ts:33

Unique identifier for the node

metadata
metadata: TMetadata;

Defined in: packages/ui/build/tree-select/index.d.ts:45

Custom metadata associated with this item

required?
optional required?: boolean;

Defined in: packages/ui/build/tree-select/index.d.ts:43

Whether this item is required (when in multiple selection mode)

searchText?
optional searchText?: string;

Defined in: packages/ui/build/tree-select/index.d.ts:37

Additional aliases and metadata included when filtering the tree

title
title: string;

Defined in: packages/ui/build/tree-select/index.d.ts:35

Display text for the node

SelectionState

Defined in: packages/ui/build/tree-select/index.d.ts:18

Selection state interface defining which nodes are selected or disabled

Properties

disabled
disabled: string[];

Defined in: packages/ui/build/tree-select/index.d.ts:22

Array of disabled node IDs

selected
selected: string[];

Defined in: packages/ui/build/tree-select/index.d.ts:20

Array of selected node IDs

TreeSelectProps

Defined in: packages/ui/build/tree-select/index.d.ts:52

Props interface for the TreeSelect component

Type Parameters

Type Parameter
TMetadata

Properties

containerClass?
optional containerClass?: string;

Defined in: packages/ui/build/tree-select/index.d.ts:68

Additional CSS class for the container

disabled?
optional disabled?: boolean;

Defined in: packages/ui/build/tree-select/index.d.ts:60

Disable all interactions and focus

multiple?
optional multiple?: boolean;

Defined in: packages/ui/build/tree-select/index.d.ts:70

Whether to allow multiple selection

onChange?
optional onChange?: (state) => void;

Defined in: packages/ui/build/tree-select/index.d.ts:58

Callback when selection changes

Parameters
Parameter Type
state SelectionState
Returns

void

readonly?
optional readonly?: boolean;

Defined in: packages/ui/build/tree-select/index.d.ts:62

Prevent selection changes but allow navigation/expand

rootItems
rootItems: readonly BaseTreeItem<TMetadata>[];

Defined in: packages/ui/build/tree-select/index.d.ts:54

Root items to display in the tree

searchPlaceholder?
optional searchPlaceholder?: string;

Defined in: packages/ui/build/tree-select/index.d.ts:66

Placeholder shown in the search input

showSearch?
optional showSearch?: boolean;

Defined in: packages/ui/build/tree-select/index.d.ts:64

Whether to show the search input

value?
optional value?: SelectionState;

Defined in: packages/ui/build/tree-select/index.d.ts:56

Selection state (bindable)

Type Aliases

NodeActionCallback

type NodeActionCallback<TMetadata> = (node) => 
  | RenderComponentConfig<Component<Record<string, unknown>>>
  | RenderSnippetConfig<unknown>
  | string;

Defined in: packages/ui/build/tree-select/index.d.ts:27

Callback type for node actions

Type Parameters

Type Parameter
TMetadata

Parameters

Parameter Type
node TreeNodes<TMetadata>

Returns

| RenderComponentConfig<Component<Record<string, unknown>>> | RenderSnippetConfig<unknown> | string

TreeNodes

type TreeNodes<TMetadata> = 
  | TreeChildNode<TMetadata>
  | TreeParentNode<TMetadata>
| RequiredTreeChildNode<TMetadata>;

Defined in: packages/ui/build/tree-select/index.d.ts:14

Type Parameters

Type Parameter
TMetadata

TreeSelect

type TreeSelect<TMetadata> = InstanceType<typeof TreeSelect>;

Defined in: packages/ui/build/tree-select/tree-select.svelte.d.ts:23

Type Parameters

Type Parameter
TMetadata

TreeSelectStateProps

type TreeSelectStateProps<TMetadata> = TreeSelectProps<TMetadata>;

Defined in: packages/ui/build/tree-select/index.d.ts:75

Props interface for TreeState initialization

Type Parameters

Type Parameter
TMetadata

Variables

AUTO_SCROLL_THRESHOLD

const AUTO_SCROLL_THRESHOLD: 0.2 = 0.2;

Defined in: packages/ui/build/tree-select/index.d.ts:11

Threshold percentage (0-1) from viewport edge that triggers auto-scroll 0.2 means scrolling starts when element is within 20% of the viewport edge

isParentNode

const isParentNode: typeof isParentNodeFn;

Defined in: packages/ui/build/tree-select/index.d.ts:13

isRequiredChildNode

const isRequiredChildNode: typeof isRequiredChildNodeFn;

Defined in: packages/ui/build/tree-select/index.d.ts:12

ROOT_NODE_ID

const ROOT_NODE_ID: "ROOT" = "ROOT";

Defined in: packages/ui/build/tree-select/index.d.ts:6

TreeSelect

const TreeSelect: $$IsomorphicComponent;

Defined in: packages/ui/build/tree-select/tree-select.svelte.d.ts:23