React Native MantineData display

Tree

Hierarchical list with expand, select and checkbox support

Import: import { Tree } from 'react-native-mantine';

Usage

import { Tree, useTree } from 'react-native-mantine';
import type { TreeNodeData } from 'react-native-mantine';

const data: TreeNodeData[] = [
  {
    value: 'src',
    label: 'src',
    children: [
      { value: 'src/index.tsx', label: 'index.tsx' },
    ],
  },
];

const tree = useTree();

<Tree data={data} tree={tree} selectOnClick />

// Programmatic control
tree.expandAllNodes();
tree.checkNode('src');
tree.isNodeChecked('src');
tree.isNodeIndeterminate('src');

Props

PropTypeDefaultDescription
label (required)React.ReactNodeNode label
value (required)stringUnique node value
nodePropsRecord<string, any>Props passed to the rendered node
childrenTreeNodeData[]Child nodes

Source on GitHub · npm