Skip to content

💡 Feature Request: Provide a Complex Example (e.g., VSCode-like File Tree) #165

@winner106

Description

@winner106

Is your feature request related to a problem? Please describe.

I really like this project — it’s elegant and powerful. However, as a beginner developer, I’ve been trying to use @headless-tree/core and @headless-tree/react to build a VSCode-like file tree for several days. Even with the documentation and some AI assistance, I still find it quite difficult to put all the pieces together (context menus, drag-and-drop, hotkeys, rename, async operations, etc.).
This makes it a bit frustrating when trying to use the library for more complex use cases.

Describe the solution you'd like

I’d love to see a complex usage example, such as a fully functional VSCode-like file tree built using @headless-tree/core.

Such an example would:

  1. Demonstrate that the library can support large-scale, real-world projects.
  2. Help developers quickly understand how to structure more advanced interactions.
  3. Even make it easier for AI-assisted tools to learn and generate integrations correctly.

Specifically, it would be great if the example includes:

  • An async data loader (to show how to handle lazy loading and remote data).
  • Add / Delete / Rename node operations.
  • A rename-on-create workflow, where creating a new node immediately enters rename mode.
  • If the user cancels renaming, the node creation should be cancelled.
  • A refresh mechanism to reload or re-sync the tree.

By including these features — and comparing the result to a polished VSCode-style file explorer — this project could truly shine and show its full potential.

Describe alternatives you've considered

I’ve studied the existing examples and tried building features step by step, but it’s hard to fully grasp how all parts should fit together in a complex project.

Additional context

I’m still a relatively new developer and don’t yet have the skills to contribute such a demo myself, but I wanted to share this suggestion to help improve the onboarding experience for others.
Thanks again for creating and maintaining such a great project — it has huge potential and I really appreciate your work! 🙏

Metadata

Metadata

Assignees

Labels

No labels
No labels

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions