UNPKG

@alpernative/tree

Version:

[`@alpernative/tree`](https://www.npmjs.com/package/@alpernative/tree) is a high-performance, customizable tree component for React. It provides a wide range of features, including virtualization, drag-and-drop, and nested drag-and-drop support.

52 lines (51 loc) 2.51 kB
import React, { Component, ReactNode } from 'react'; import { DragStart, DropResult, DragUpdate, DraggableProvided, DraggableStateSnapshot, DroppableProvided } from '@hello-pangea/dnd'; import { FlattenedItem, ItemId, Path, TreeData } from '../../types'; import DelayedFunction from '../../utils/delayed-function'; import { Props, State, DragState, VirtualItemProps, VirtualRowProps } from './Tree-types'; export default class Tree extends Component<Props, State> { static defaultProps: { tree: { children: never[]; }; onExpand: () => void; onCollapse: () => void; onDragStart: () => void; onDragEnd: () => void; renderItem: () => void; offsetPerLevel: number; isDragEnabled: boolean; isNestingEnabled: boolean; isVirtualizationEnabled: boolean; virtualItemHeight: number; }; state: { flattenedTree: never[]; draggedItemId: undefined; }; dragState?: DragState; itemsElement: Record<ItemId, HTMLElement | undefined>; containerElement?: HTMLElement | null; expandTimer: DelayedFunction; static getDerivedStateFromProps(props: Props, state: State): { flattenedTree: FlattenedItem[]; draggedItemId?: ItemId | undefined; }; static closeParentIfNeeded(tree: TreeData, draggedItemId?: ItemId): TreeData; renderVirtualItem: ({ provided, flatItem, snapshot, style, isDragging }: VirtualItemProps) => import("react/jsx-runtime").JSX.Element; renderVirtualRow: React.MemoExoticComponent<(props: VirtualRowProps) => import("react/jsx-runtime").JSX.Element>; onDragStart: (result: DragStart) => void; onDragUpdate: (update: DragUpdate) => void; onDropAnimating: () => void; onDragEnd: (result: DropResult) => void; onPointerMove: () => void; calculateEffectivePath: (flatItem: FlattenedItem, snapshot: DraggableStateSnapshot) => Path; isExpandable: (item: FlattenedItem) => boolean; getDroppedLevel: () => number | undefined; patchDroppableProvided: (provided: DroppableProvided) => DroppableProvided; setItemRef: (ItemId: ItemId, el: HTMLElement | null) => void; renderItems: () => Array<ReactNode>; renderItem: (flatItem: FlattenedItem, index: number) => ReactNode; renderDraggableItem: (flatItem: FlattenedItem) => (provided: DraggableProvided, snapshot: DraggableStateSnapshot) => import("react/jsx-runtime").JSX.Element; render(): import("react/jsx-runtime").JSX.Element; }