ProductFeaturesDocs
Built InUI ComponentsAdmin ConsoleDatabaseBackendStorageAIRAGAuthSecurity
CompanyStoryAboutPricingBlogRoadmap
Install FLIN

TreeView

Hierarchical tree structure for displaying nested data like file systems or categories.

File Explorer

Nested directory structure showing a typical FLIN project layout.

  • src/
    • components/
      • Button.flin
      • Card.flin
    • pages/
      • index.flin
      • about.flin
  • README.md

With Icons

Tree view with folder and file icons for visual hierarchy cues.

  • app/
    • layouts/
      • default.flin
    • index.flin
    • about.flin
  • entities/
    • user.flin
    • post.flin
  • package.json

Category Tree

Product category hierarchy for e-commerce navigation or filters.

  • Electronics
    • Phones
    • Laptops
    • Tablets
  • Clothing
    • Men
    • Women
  • Books

Org Chart

Organizational structure showing departments and teams.

  • ZeroSuite, Inc.
    • Engineering
      • Frontend
      • Backend
      • DevOps
    • Design
      • UI/UX
      • Brand
    • Operations

Schema Tree

Database schema tree showing tables and their columns.

  • Database
    • users
      • id (int)
      • name (text)
      • email (text)
    • posts
      • id (int)
      • title (text)
      • user_id (int)

Navigation Menu

Sidebar navigation structure with nested menu sections.

  • Dashboard
  • Users
    • All Users
    • Roles
    • Permissions
  • Settings
    • General
    • Security
    • Billing

Usage

<TreeView> <ul> <li>src/ <ul> <li>Button.flin</li> <li>Card.flin</li> </ul> </li> <li>README.md</li> </ul></TreeView>

Props

PropTypeDefaultDescription
childrencontent-Nested ul/li tree structure