Trees - ファイルツリー描画ライブラリのオープンソース

 (trees.software)
8 ポイント 投稿者 xguru 5 시간 전 | 2件のコメント | WhatsAppで共有
  • VSCodeのファイルペインに似たファイル/ディレクトリ構造を描画するライブラリ
  • 高いカスタマイズ自由度と性能・柔軟性を重視して設計
  • 数万件の項目も高速にレンダリングする自動仮想化を内蔵し、画面に表示されている行だけをマウントして処理
  • Gitステータスバッジ、ドラッグ＆ドロップ、名前検索・フィルタ、カスタムコンテキストメニューなど、開発ツール向けツリーUIに必要な機能を幅広くサポート
  • キーボードナビゲーション・フォーカス管理・ARIAなどをサポートし、WCAG 2.1基準に沿ったアクセシビリティを標準提供
  • CSS変数、Shikiテーマ、密度調整などにより外観を細かく制御
  • エディタ/コードホスティングツールのサイドバーツリー実装に活用可能
  • 主要機能の詳細
    • flattenEmptyDirectories: 子が1つしかないフォルダチェーンを1行にまとめるツリーのフラット化をサポート
    • gitStatus: 追加・変更・削除・名前変更・未追跡・無視ファイルにGitステータスバッジを表示し、変更された子項目があるフォルダにはドット(dot)インジケーターを自動表示
    • dragAndDrop: ファイル・フォルダを別のフォルダやルートへドラッグ移動でき、ドロップ対象はhover時に自動展開、canDragコールバックで特定パスの制限が可能
    • 新規ファイル・フォルダ・名前変更・削除などのカスタムコンテキストメニュー構成をサポート
    • 検索ボックスを通じて名前・パスベースの高速フィルタリングを行い、hide-non-matches・collapse-non-matches・expand-matchesの3つのモードをサポート
    • minimal・standard・completeの3種類の組み込みアイコンセットを提供
    • densityオプション(compact・default・relaxed)で行の高さ・間隔を一括調整

関連記事

2件のコメント

 
saysealing 1 시간 전

このように alias して使うと便利です。

alias t='tree -N -C -L 2 -I "node_modules|cache|dist|test_"'
alias tt='tree -N -C -L 3 -I "node_modules|cache|dist|test_"'
alias ttt='tree -N -C -L 4 -I "node_modules|cache|dist|test_"'
alias tttt='tree -N -C -L 5 -I "node_modules|cache|dist|test_"'
 
brainer 4 시간 전

tree /

面白くて便利そうなオープンソースですね