Updated CSS, Readme & removed some options

Author: CodeWithDennis

README.md

@@ -20,25 +20,27 @@ php artisan filament:assets
 ## Features
 - ✅ Compatible with dark mode
 - ✅ Featuring search functionality
-- ✅ Comma seperated multi-select
 - ✅ Custom options
+- ✅ Works with `BelongsTo` (single) and `BelongsToMany` (multiple)
+- ❌ Comma seperated multi-select
 - ❌ Disabled options (Planned)
-- ❌ Relationships (Planned)
 
 ## Usage
 
 ```PHP
 SelectTree::make('category_id')
-    // Creates a select tree with 'Category' model, using 'category_id' as parent and 'name' as label, allowing custom query modification.
-    ->tree(Category::class, 'category_id', 'name', function ($query) {
-        return $query;
-    })
 
+    // Create a tree based on a `BelongsToMany` relationship
+    ->relationship('categories', 'name', fn($query) => $query),
+
+    // Create a tree based on a `BelongsTo` relationship
+    ->relationship('category', 'name', fn($query) => $query),
+    
     // Set a custom placeholder for when no items are selected
     ->placeholder(__('Your custom placeholder here'))
 
-    // Ensures that only leaf nodes can be selected while preventing the selection of groups.
-    ->disabledBranchNode()
+    // Enabled the selection of groups.
+    ->enableBranchNode()
 
     // Adjust the emptyLabel for when there are zero search results.
     ->emptyLabel(__('No results found'))
@@ -67,6 +69,20 @@ SelectTree::make('category_id')
     // Activates the search functionality for the SelectTree.
     ->searchable()
 ```
+### Relationships (examples)
+
+```PHP
+public function category(): BelongsTo
+{
+    return $this->belongsTo(Category::class);
+}
+```
+```PHP
+public function categories(): belongsToMany
+{
+    return $this->belongsToMany(Category::class);
+}
+```
 ### Custom
 If you prefer to create custom options rather than utilizing a pre-existing model, you can achieve this using the following example:
 

resources/css/custom.css

@@ -212,7 +212,6 @@ html.dark .treeselect-input__tags-element:hover svg {
 }
 
 .treeselect-input__clear svg {
-    stroke: rgb(255 255 255/var(--tw-text-opacity));
     opacity: 0.5;
 }
 

resources/dist/custom.css

@@ -24,7 +24,7 @@
                 isIndependentNodes: '{{ $getIndependent() }}',
                 showTags: '{{ $getMultiple() }}',
                 alwaysOpen: '{{ $getAlwaysOpen() }}',
-                clearable: true,
+                clearable: '{{ $getClearable() }}',
                 emptyText: '{{ $getEmptyLabel() }}',
                 expandSelected: '{{ $getExpandSelected() }}',
                 grouped: '{{ $getGrouped() }}',

resources/views/select-tree.blade.php

@@ -41,8 +41,6 @@ class SelectTree extends Field
 
     protected bool $grouped = true;
 
-    protected array $options = [];
-
     protected string|Closure $relationship;
 
     protected ?Closure $modifyQueryUsing;
@@ -84,11 +82,6 @@ protected function setUp(): void
 
     private function buildTree(int $parent = null): array|Collection
     {
-        // Check if options have already been set, if so, return them.
-        if ($this->getOptions()) {
-            return $this->getOptions();
-        }
-
         // Determine the foreign key based on the type of relationship.
         if ($this->getRelationship() instanceof BelongsTo) {
             $key = $this->getRelationship()->getForeignKeyName();
@@ -199,13 +192,6 @@ public function alwaysOpen(bool $alwaysOpen = true): static
         return $this;
     }
 
-    public function options(array $options): static
-    {
-        $this->options = $options;
-
-        return $this;
-    }
-
     public function enableBranchNode(bool $enableBranchNode = true): static
     {
         $this->enableBranchNode = $enableBranchNode;
@@ -253,11 +239,6 @@ public function getAlwaysOpen(): bool
         return $this->evaluate($this->alwaysOpen);
     }
 
-    public function getOptions(): array
-    {
-        return $this->evaluate($this->options);
-    }
-
     public function getEnableBranchNode(): bool
     {
         return $this->evaluate($this->enableBranchNode);