@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
TypeScript
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;
}