Component to display hierarchy data structure.
Directory C:\ selected.
No directory selected.
Name | Type | Description |
---|---|---|
ItemsREQUIRED | IEnumerable<TItem> |
Collection of hierarchy data to display. |
CssClass | string |
Additional CSS class to be applied. |
ItemChildrenSelector | Func<TItem, IEnumerable<TItem>> |
Selector to display children collection for current data item. Children collection should have same type as current item. |
ItemCssClass | string |
Item CSS class (same for all items). |
ItemCssClassSelector | Func<TItem, string> |
Selector for item CSS class. |
ItemIconSelector | Func<TItem, IconBase> |
Selector to display icon from data item. |
ItemInitialExpandedSelector | Func<TItem, bool> |
Selector for initial expansion state for data item. Default state is false (collapsed). |
ItemTemplate | RenderFragment<TItem> |
Template for the item content. |
ItemTitleSelector | Func<TItem, string> |
Selector to display item title from data item. |
SelectedItem | TItem |
Selected data item. |
SelectedItemChanged | EventCallback<TItem> |
Event fires when selected data item changes. |
Name | Description | Default |
---|---|---|
--hx-tree-view-item-border-radius | Border radius. | .25rem |
--hx-tree-view-item-border-width | Border width. | 0 |
--hx-tree-view-item-border-style | Border style. | unset |
--hx-tree-view-item-border-color | Border color. | unset |
--hx-tree-view-item-spacer-width | Width of spacer used for sub-items intendation. | 1rem |
--hx-tree-view-item-color | Item font color | var(--bs-dark) |
--hx-tree-view-item-icon-margin | Margin of item icon. | 0 .25rem 0 0; |
--hx-tree-view-item-font-size | Item font size. | .75rem |
--hx-tree-view-item-padding | Item padding. | .25rem .5rem; |
--hx-tree-view-item-margin | Item margin. | 0 0 .125rem 0 |
--hx-tree-view-item-hover-color | Hovered item font color | var(--bs-primary) |
--hx-tree-view-item-selected-color | Selected item font color | var(--bs-primary) |
--hx-tree-view-item-background | Item background color | var(--bs-white) |
--hx-tree-view-item-hover-background | Hovered item background color | var(--bs-primary-rgb) |
--hx-tree-view-item-selected-background | Selected item background color | var(--bs-primary-rgb) |
--hx-tree-view-item-hover-background-opacity | Hovered/selected item background color opacity | .1 |
--hx-tree-view-expander-container-width | Width of expander container to make items w/ and w/o children aligned | 1rem |