created:4/29/2021
updated:4/29/2021
loc
187
comments
2%
passed
12
coverage
56%
Tree
Hierarchical collapsible tree structure
Name | Description | Default | |
---|---|---|---|
-(11 properties) | |||
items | Array of child items TreeItems | - | |
arrowPosition | POsition of the expand/collapse arrow startend | end | |
activeItem | Initially active item Pick<TreeItem, labelid> | - | |
expandAll | If specified, will expand all items with chidren boolean | - | |
onSelect | Function that will be called when the user selects a item (((item?: TreeItem) => void) & ReactEventHandler<HTMLDivElement>) | - | |
onExpandCollapse | Function that will be called on expand/collapse ((expandedCount: number) => void) | - | |
search | If specified, will filter the items by the search terms string | - | |
chevronIcon | custom chevron icon ReactNode | <ChevronDownIcon /> | |
indentPixels | indentation in pixels for each elevel, By default 6 pixels number | 8 | |
rowLinkClass | row link class - to avoid anchor in anchor warning ElementType<any> | - | |
ref | ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | - | |
HTMLAttributes(44 properties) | |||
Attributes(1 properties) | |||
AriaAttributes(48 properties) | |||
DOMAttributes(160 properties) | |||
BoxOwnProps(4 properties) | |||
SpaceProps(28 properties) | |||
BackgroundColorProps(2 properties) | |||
OpacityProps(1 properties) |
7 commits
package | imports | peer |
---|---|---|
@primer/octicons-react ^10.0.0 | ChevronDownIcon | |
react ^17.0.1 | useStateuseEffectFCElementType | * |
theme-ui ^0.8.4 | jsxTextFlexButtonPropsButtonBoxPropsBox |
file | imports |
---|---|
"../Keyboard" | KeyboardLEFT_ARROWUP_ARROWRIGHT_ARROWDOWN_ARROW |
"../Link" | LinkLinkClassType |
"./tree-utils" | TreeItemTreeStateTreeOwnPropsstateFromPropsgetFlatChildrenIdsgetChildrenByIdhasActiveChidlren |