siddcn logo
siddcn
+

File Tree

File system hierarchy display with vim-style navigation (j/k)

LOCALHOST:3000
+- project/
   +- src/
   |  +- index.tsx
   +- package.json
NORMAL100%
InstallationBASH
npx siddcn add tree-file
UsageTSX
import { FileTree } from 'siddcn';

const tree = {
  name: 'project',
  type: 'dir',
  children: [
    { name: 'src', type: 'dir', children: [
      { name: 'index.tsx', type: 'file' }
    ]},
    { name: 'package.json', type: 'file' }
  ]
};

export default function App() {
  return <FileTree data={tree} />;
}