@mantine/core/lib/components/Tree/use-tree.d.ts

React components library focused on usability, accessibility and developer experience

import { CheckedNodeStatus } from './get-all-checked-nodes/get-all-checked-nodes';
import type { TreeNodeData } from './Tree';
export type TreeExpandedState = Record<string, boolean>;
export declare function getTreeExpandedState(data: TreeNodeData[], expandedNodesValues: string[] | '*'): Record<string, boolean>;
export interface UseTreeInput {
    /** Initial expanded state of all nodes, uncontrolled state */
    initialExpandedState?: TreeExpandedState;
    /** Expanded state of all nodes, controlled state */
    expandedState?: TreeExpandedState;
    /** Called when the tree expanded state changes */
    onExpandedStateChange?: (expandedState: TreeExpandedState) => void;
    /** Initial selected state of nodes */
    initialSelectedState?: string[];
    /** Selected state of all nodes, controlled state */
    selectedState?: string[];
    /** Called when the tree selected state changes */
    onSelectedStateChange?: (selectedState: string[]) => void;
    /** Initial checked state of nodes */
    initialCheckedState?: string[];
    /** Checked state of all nodes, controlled state */
    checkedState?: string[];
    /** Called when the tree checked state changes */
    onCheckedStateChange?: (checkedState: string[]) => void;
    /** Determines whether multiple node can be selected at a time */
    multiple?: boolean;
    /** Called with the node value when it is expanded */
    onNodeExpand?: (value: string) => void;
    /** Called with the node value when it is collapsed */
    onNodeCollapse?: (value: string) => void;
}
export interface UseTreeReturnType {
    /** Determines whether multiple node can be selected at a time */
    multiple: boolean;
    /** A record of `node.value` and boolean values that represent nodes expanded state */
    expandedState: TreeExpandedState;
    /** An array of selected nodes values */
    selectedState: string[];
    /** An array of checked nodes values */
    checkedState: string[];
    /** A value of the node that was last clicked
     * Anchor node is used to determine range of selected nodes for multiple selection
     */
    anchorNode: string | null;
    /** Initializes tree state based on provided data, called automatically by the Tree component */
    initialize: (data: TreeNodeData[]) => void;
    /** Toggles expanded state of the node with provided value */
    toggleExpanded: (value: string) => void;
    /** Collapses node with provided value */
    collapse: (value: string) => void;
    /** Expands node with provided value */
    expand: (value: string) => void;
    /** Expands all nodes */
    expandAllNodes: () => void;
    /** Collapses all nodes */
    collapseAllNodes: () => void;
    /** Sets expanded state */
    setExpandedState: (value: TreeExpandedState) => void;
    /** Toggles selected state of the node with provided value */
    toggleSelected: (value: string) => void;
    /** Selects node with provided value */
    select: (value: string) => void;
    /** Deselects node with provided value */
    deselect: (value: string) => void;
    /** Clears selected state */
    clearSelected: () => void;
    /** Sets selected state */
    setSelectedState: (value: string[]) => void;
    /** Checks node with provided value */
    checkNode: (value: string) => void;
    /** Unchecks node with provided value */
    uncheckNode: (value: string) => void;
    /** Checks all nodes */
    checkAllNodes: () => void;
    /** Unchecks all nodes */
    uncheckAllNodes: () => void;
    /** Sets checked state */
    setCheckedState: (value: string[]) => void;
    /** Returns all checked nodes with status */
    getCheckedNodes: () => CheckedNodeStatus[];
    /** Returns `true` if node with provided value is checked */
    isNodeChecked: (value: string) => boolean;
    /** Returns `true` if node with provided value is indeterminate */
    isNodeIndeterminate: (value: string) => boolean;
}
export declare function useTree({ initialSelectedState, expandedState, initialCheckedState, checkedState, initialExpandedState, selectedState, multiple, onNodeCollapse, onNodeExpand, onCheckedStateChange, onSelectedStateChange, onExpandedStateChange, }?: UseTreeInput): UseTreeReturnType;
export type TreeController = ReturnType<typeof useTree>;