@momentum-ui/react-collaboration
Version:
Cisco Momentum UI Framework for React Collaboration Applications
108 lines (107 loc) • 4.02 kB
TypeScript
import React, { MutableRefObject } from 'react';
import { TreeIdNodeMap, TreeNodeRecord, TreeContextValue, TreeNavKeyCodes, TreeNodeId, TreeRoot, TreeNodeAction } from './Tree.types';
import { ItemSelection } from '../../hooks/useItemSelected';
export declare const TreeContext: React.Context<TreeContextValue>;
/**
* Get the tree context value.
* It throws an error if the context is not provided.
*/
export declare const useTreeContext: () => TreeContextValue;
/**
* Get the root node id of the tree which is represented as a map.
*
* @param tree
*/
export declare const getTreeRootId: (tree: TreeIdNodeMap) => TreeNodeId | undefined;
/**
* Check if the tree is empty.
*
* Works with both Map and recursive Object tree representation.
*
* @param tree
*/
export declare const isEmptyTree: (tree: unknown) => boolean;
/**
* Traverse the tree and convert it to a map between the node id and the node
* It also adds additional information to the node like the parent, the level and the index
*
* @param tree
*/
export declare const convertNestedTree2MappedTree: (tree: TreeRoot) => TreeIdNodeMap;
/**
* Set the next active tree node based on the key code.
*
* @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/treeview/ WCAG Tree Pattern}
* @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/treeview/examples/treeview-1a/ WCAG Directory Tree example}
*
* @param tree
* @param nodeId Current active tree node descriptor
* @param keyCode Arrow key code
* @param excludeRoot
*/
export declare const getNextActiveNode: (tree: TreeIdNodeMap, nodeId: TreeNodeId, keyCode: TreeNavKeyCodes, excludeRoot?: boolean) => TreeNodeAction;
/**
* Toggle the open/close state of the tree node.
*
* It also updates the hidden state of all children based on the parent's open state.
* And it returns the updated tree without changing the original tree.
*
* @param id
* @param prevTree
* @param isOpen
* @internal
*/
export declare const toggleTreeNodeRecord: (id: TreeNodeId, prevTree: TreeIdNodeMap, isOpen: boolean) => TreeIdNodeMap;
/**
* Map each tree node to a new value by calling the callback function.
*
* It uses Depth First Search (DFS) with Preorder traverse algorithm.
*
* @param tree The tree to traverse
* @param cb Callback function to process each tree node
* @param options
* @param [options.rootNodeId=undefined] The root node id of the tree
* @param [options.excludeRootNode=true] Include the root node in the result
*/
export declare const mapTree: <T>(tree: TreeIdNodeMap, cb: (node: TreeNodeRecord, tree: TreeIdNodeMap) => T, options?: {
rootNodeId?: TreeNodeId;
excludeRootNode?: boolean;
}) => Array<T>;
/**
* Check if the active node is visible in the tree.
*
* @param treeRef DOM reference of the tree
* @param activeNodeId The id of the active node
*/
export declare const isActiveNodeInDOM: (treeRef: MutableRefObject<HTMLDivElement>, activeNodeId: TreeNodeId) => boolean;
/**
* Get the initial active node id in the tree.
*
* If selection mode is single and there is only one shown and selected item, it returns the selected item.
* Otherwise, it returns the first shown node in the tree.
*
* @param tree
* @param excludeTreeRoot
* @param itemSelection
*/
export declare const getInitialActiveNode: (tree: TreeIdNodeMap, excludeTreeRoot: boolean, itemSelection: ItemSelection<string>) => TreeNodeId;
/**
* Get the DOM id of the tree node.
*
* Node id prefixed with a constant to ensure the id really used only once in the DOM
* @param id
*/
export declare const getNodeDOMId: (id: TreeNodeId) => string;
/**
* Migrate states between old and new trees
*
* `isOpen` state used from the old tree if the node available otherwise falls back to the new tree's node value.
* `isHidden` also updated based on the merged `isOpen` state.
*
* @remarks
* This function modify the `newTree` parameter
*
* @param oldTree
* @param newTree
*/
export declare const migrateTreeState: (oldTree: TreeIdNodeMap, newTree: TreeIdNodeMap) => void;