# FileTree

> The FileTree component is a lightweight and intuitive file explorer built using shadcn/ui utilities and lucide-react icons. It provides a clear hierarchical structure to represent files and folders, supporting smooth expand and collapse transitions for nested items. With its simple design, it is easy to integrate and customize while maintaining consistency with the shadcn UI style. Ideal for use cases such as dashboards, project explorers, or content management tools, this component ensures both functionality and visual clarity.

- Author: [Ruixen UI](https://21st.dev/@ruixen.ui)
- Library: [Ruixen UI](https://21st.dev/@ruixen.ui/library/ruixen-ui)
- License: unknown
- npm dependencies: lucide-react, framer-motion
- Live preview: https://21st.dev/@ruixen.ui/components/file-tree-1

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/ruixen.ui/file-tree-1?api_key=$API_KEY_21ST"
```

Requires a 21st API key (generate one at https://21st.dev/mcp) passed as `API_KEY_21ST`. Free accounts get a limited number of installs per day; unlimited on a paid plan — see https://21st.dev/pricing.

Full component directory: https://21st.dev/llms.txt