synapse-react-client/dist/components/EntityFinder/tree/VirtualizedTree.d.ts

[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie

import React from 'react';
import { Writable } from '@/utils/types/Writable';
import { EntityType } from '@sage-bionetworks/synapse-client';
import { TreeWalker, TreeWalkerValue, VariableSizeNodeData, VariableSizeNodePublicState } from 'react-vtree';
import { NodeComponentProps } from 'react-vtree/dist/es/Tree';
import { EntityFinderHeader } from '../EntityFinderHeader';
import { EntitySelectionMapType } from '../useEntitySelection';
export declare enum EntityTreeNodeType {
    /** The tree component's appearance and interactions will facilitate selection. Nodes will be larger and styles will indicate primary selection */
    SINGLE_PANE = 0,
    /** The tree component's appearance and interactions will facilitate browsing. Nodes will be smaller and styles will indicate secondary selection */
    DUAL_PANE = 1
}
type NodeChildren = Readonly<{
    /** The node's children. If undefined, then children have not been fetched. */
    children?: EntityHeaderNode[];
    /** The token used to fetch the next page of children for this entity. If this property is nullish and children is defined, then all children have been fetched. */
    childrenNextPageToken?: string | null;
}>;
export type EntityHeaderNode = (EntityFinderHeader | Pick<EntityFinderHeader, 'id' | 'name' | 'type'>) & NodeChildren;
type PaginationNode = {
    __paginationNode: true;
};
type TreeNode = EntityHeaderNode | RootNodeConfiguration | PaginationNode;
export type TreeData = VariableSizeNodeData & Readonly<{
    node: TreeNode;
    getNextPageOfChildren: () => Promise<void>;
    isLeaf: boolean;
    nestingLevel: number;
    setSelectedId: (entityId: string) => void;
    treeNodeType: EntityTreeNodeType;
    isSelected: boolean;
    isDisabled: boolean;
}>;
type NodeMeta = Readonly<{
    nestingLevel: number;
    node: TreeNode;
}>;
export type RootNodeConfiguration = {
    show: boolean;
    nodeText: string;
    children: EntityHeaderNode[];
    /** If undefined, no more entities to fetch */
    fetchNextPage: () => Promise<void>;
    hasNextPage: boolean;
};
/**
 * Converts a TreeNode and related data into a TreeWalkerValue that react-vtree can use to render the tree.
 * Exported for testing purposes only.
 * @param config
 * @returns
 */
export declare const getNodeData: (config: {
    node: TreeNode;
    nestingLevel: number;
    getNextPageOfChildren: () => Promise<void>;
    setSelectedId: (entityId: string) => void;
    treeNodeType: EntityTreeNodeType;
    selected: EntitySelectionMapType;
    selectableTypes: EntityType[];
    autoExpand: (entityId: string) => boolean;
    defaultHeight: number;
    currentContainer?: string | "root" | null;
}) => TreeWalkerValue<TreeData, NodeMeta>;
/**
 * Node component for the react-vtree virtualized tree. Exported only for testing purposes
 */
export declare function Node(props: NodeComponentProps<TreeData, VariableSizeNodePublicState<TreeData>>): import("react/jsx-runtime").JSX.Element;
/**
 * Extracted from the React component for testing purposes
 * @returns a generator function compatible with react-vtree
 */
export declare function getTreeWalkerFunction(rootNode: RootNodeConfiguration, setSelectedId: VirtualizedTreeProps['setSelectedId'], treeNodeType: VirtualizedTreeProps['treeNodeType'], selected: VirtualizedTreeProps['selected'], selectableTypes: VirtualizedTreeProps['selectableTypes'], autoExpand: VirtualizedTreeProps['autoExpand'], itemSize: (index?: number) => number, currentContainer: VirtualizedTreeProps['currentContainer'], fetchNextPageOfChildren: (node: Writable<EntityHeaderNode>) => Promise<void>): TreeWalker<TreeData, NodeMeta>;
export type VirtualizedTreeProps = Readonly<{
    treeNodeType: EntityTreeNodeType;
    rootNodeConfiguration: RootNodeConfiguration;
    setSelectedId: (entityId: string) => void;
    selected: EntitySelectionMapType;
    currentContainer?: string | 'root' | null;
    autoExpand: (entityId: string) => boolean;
    selectableTypes: EntityType[];
    visibleTypes: EntityType[];
}>;
/**
 * Component that utilizes react-vtree to efficiently display a tree of entities. react-vtree utilizes react-window
 * to only render visible nodes, which eliminates performance issues as seen in SWC-5978.
 */
export declare const VirtualizedTree: (props: VirtualizedTreeProps) => React.ReactNode;
export {};
//# sourceMappingURL=VirtualizedTree.d.ts.map