PHPackages geekstek/filament-tree - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. geekstek/filament-tree ActiveLibrary[Utility & Helpers](/categories/utility) geekstek/filament-tree ====================== Tree form components for Filament v4 v1.0.8(1mo ago)1120MITBladePHP ^8.3 Since Dec 15Pushed 1mo agoCompare [ Source](https://github.com/geekstek/filament-tree)[ Packagist](https://packagist.org/packages/geekstek/filament-tree)[ Docs](https://github.com/geekstek/filament-tree)[ RSS](/packages/geekstek-filament-tree/feed)WikiDiscussions main Synced 1mo ago READMEChangelogDependencies (14)Versions (10)Used By (0) Geekstek Filament Tree ====================== [](#geekstek-filament-tree) A Filament v4 plugin that provides tree form components including a cascading tree selector (Wunderbaum style) and a dropdown tree select. Requirements ------------ [](#requirements) - PHP 8.2+ - Filament 4.0+ - Laravel 11+ Installation ------------ [](#installation) ``` composer require geekstek/filament-tree ``` The package will auto-register via Laravel's package discovery. Components ---------- [](#components) ### 1. Tree (Cascading Tree Selector) [](#1-tree-cascading-tree-selector) [![tree](docs/images/tree.png "Tree")](docs/images/tree.png) A flat tree component with checkbox selection and cascade behavior - when you select a parent, all children are automatically selected. ``` use Geekstek\FilamentTree\Forms\Components\Tree; Tree::make('permissions') ->label('Permissions') ->helperText('Click on a parent to select all children') ->options([ [ 'id' => 1, 'label' => 'System', 'children' => [ ['id' => 2, 'label' => 'Users'], ['id' => 3, 'label' => 'Roles'], ['id' => 4, 'label' => 'Settings'], ], ], [ 'id' => 5, 'label' => 'Content', 'children' => [ ['id' => 6, 'label' => 'Posts'], ['id' => 7, 'label' => 'Pages'], ], ], ]) ->disabledOptions([3]) // Disable specific node IDs ->live() // Enable reactive updates ->columnSpanFull() ``` #### Available Methods [](#available-methods) MethodDescription`options(array|Closure $options)`Set the tree data structure`disabledOptions(array|Closure $ids)`Disable specific node IDs (they won't be selected when parent is clicked)`showToolbar(bool|Closure $show)`Show/hide the expand/collapse toolbar`hideToolbar()`Hide the toolbar`defaultExpanded(bool|Closure $expanded)`Set default expanded state`collapsed()`Start with all nodes collapsed`expandSelected(bool|Closure $expand)`Expand nodes that contain selected items`defaultOpenLevel(int|Closure $level)`Set default expand level (0 = all collapsed, 1 = first level, etc.)`maxHeight(string|int|Closure $height)`Set max height of the tree container (e.g., `'400px'`, `'50vh'`, `300`)#### Height Control Example [](#height-control-example) ``` // Limit tree height to show approximately 10 rows Tree::make('permissions') ->options($options) ->maxHeight('360px') // ~36px per row × 10 rows // Use viewport height Tree::make('permissions') ->options($options) ->maxHeight('50vh') // Using integer (will be converted to pixels) Tree::make('permissions') ->options($options) ->maxHeight(400) ``` ### 2. TreeSelect (Dropdown Tree) [](#2-treeselect-dropdown-tree) [![tree select](docs/images/tree_select.png "Tree Select")](docs/images/tree_select.png) A dropdown component with tree structure support, powered by TreeselectJS. ``` use Geekstek\FilamentTree\Forms\Components\TreeSelect; TreeSelect::make('category_id') ->label('Category') ->placeholder('Select a category...') ->options([ [ 'value' => 1, 'name' => 'Electronics', 'children' => [ ['value' => 2, 'name' => 'Phones'], ['value' => 3, 'name' => 'Laptops'], ], ], [ 'value' => 4, 'name' => 'Clothing', 'children' => [ ['value' => 5, 'name' => 'Men'], ['value' => 6, 'name' => 'Women'], ], ], ]) ->required() ``` #### Available Methods [](#available-methods-1) MethodDescription`options(array|Closure $options)`Set the tree data (supports both `id`/`label` and `value`/`name` formats)`disabledOptions(array|Closure $ids)`Disable specific node IDs`single(bool|Closure $isSingle)`Enable single select mode`showTags(bool|Closure $show)`Show selected items as tags`clearable(bool|Closure $clearable)`Allow clearing selection`searchable(bool|Closure $searchable)`Enable search functionality`placeholder(string|Closure $placeholder)`Set placeholder text`expandSelected(bool|Closure $expand)`Expand nodes that contain selected items`defaultOpenLevel(int|Closure $level)`Set default expand level (0 = all collapsed, 1 = first level, etc.)`maxHeight(string|int|Closure $height)`Set max height of the dropdown list (e.g., `'300px'`, `'50vh'`, `250`)#### Height Control Example [](#height-control-example-1) ``` // Limit dropdown height TreeSelect::make('category_id') ->options($options) ->maxHeight('250px') // For large datasets TreeSelect::make('category_id') ->options($largeDataset) ->maxHeight('400px') ->searchable() // Enable search for easier navigation ``` ### 3. TreeEntry (Infolist Display) [](#3-treeentry-infolist-display) Display tree data in infoolists with selected items highlighted. ``` use Geekstek\FilamentTree\Infolists\Components\TreeEntry; TreeEntry::make('permissions') ->label('Assigned Permissions') ->options([ [ 'id' => 1, 'label' => 'System', 'children' => [ ['id' => 2, 'label' => 'Users'], ['id' => 3, 'label' => 'Roles'], ], ], ]) ->collapsed() // Start collapsed ``` #### Available Methods [](#available-methods-2) MethodDescription`options(array|Closure $options)`Set the tree data structure`defaultExpanded(bool|Closure $expanded)`Set default expanded state`collapsed()`Start with all nodes collapsed`maxHeight(string|int|Closure $height)`Set max height of the tree display (e.g., `'400px'`, `'50vh'`, `300`)Data Structure -------------- [](#data-structure) ### Tree & TreeEntry [](#tree--treeentry) The `Tree` and `TreeEntry` components expect data in this format: ``` [ [ 'id' => 1, // Unique identifier 'label' => 'Node 1', // Display text 'children' => [ // Optional nested children [ 'id' => 2, 'label' => 'Child 1', ], ], ], ] ``` ### TreeSelect [](#treeselect) The `TreeSelect` component uses TreeselectJS format: ``` [ [ 'value' => 1, // Unique identifier 'name' => 'Node 1', // Display text 'children' => [ // Optional nested children [ 'value' => 2, 'name' => 'Child 1', ], ], ], ] ``` Features -------- [](#features) - ✅ Full Filament v4 compatibility - ✅ Inherits all standard Field methods (`label()`, `helperText()`, `required()`, `live()`, etc.) - ✅ Dark mode support - ✅ Cascade selection (select parent → auto-select children) - ✅ Individual node disabling - ✅ Expand/collapse all functionality - ✅ Select all / Deselect all - ✅ Alpine.js powered (no jQuery dependency) License ------- [](#license) MIT License. See [LICENSE](LICENSE) for more information. ### Health Score 44 — FairBetter than 92% of packages Maintenance89 Actively maintained with recent releases Popularity15 Limited adoption so far Community6 Small or concentrated contributor base Maturity55 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~11 days Recently: every ~23 days Total 9 Last Release 55d ago PHP version history (2 changes)v1.0.0PHP ^8.2 v1.0.8PHP ^8.3 ### Community Maintainers ![](https://www.gravatar.com/avatar/9ccfc493312ae7c4e13a325ceb34235c42c299b378a355b244f08ba49e8c882e?d=identicon)[geekstek](/maintainers/geekstek) --- Top Contributors [![WillieOng-HK](https://avatars.githubusercontent.com/u/5966527?v=4)](https://github.com/WillieOng-HK "WillieOng-HK (14 commits)") --- Tags laraveltreefilamenttree-selectcascading-select ### Code Quality TestsPest Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/geekstek-filament-tree/health.svg) ``` [![Health](https://phpackages.com/badges/geekstek-filament-tree/health.svg)](https://phpackages.com/packages/geekstek-filament-tree) ``` ### Alternatives [codewithdennis/filament-select-tree The multi-level select field enables you to make single selections from a predefined list of options that are organized into multiple levels or depths. 320392.1k17](/packages/codewithdennis-filament-select-tree)[pboivin/filament-peek Full-screen page preview modal for Filament 253319.6k12](/packages/pboivin-filament-peek)[dotswan/filament-map-picker Easily pick and retrieve geo-coordinates using a map-based interface in your Filament applications. 124139.3k2](/packages/dotswan-filament-map-picker)[creagia/filament-code-field A Filamentphp input field to edit or view code data. 58289.3k3](/packages/creagia-filament-code-field)[jibaymcs/filament-tour Bring the power of DriverJs to your Filament panels and start a tour ! 12247.8k](/packages/jibaymcs-filament-tour)[aymanalhattami/filament-context-menu context menu (right click menu) for filament 9838.0k](/packages/aymanalhattami-filament-context-menu) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)