Merge pull request #20 from CodeWithDennis/feature/add-direction-option

Added `direction` option

Author: CodeWithDennis

README.md

@@ -62,9 +62,12 @@ SelectTree::make('category_id')
 // Expand the tree with selected values
 ->expandSelected(false)
 
-//	All groups will be opened to this level
+// All groups will be opened to this level
 ->defaultOpenLevel(2)
 
+// Specify the list's force direction. Options include: auto (default), top, and bottom.
+->directon('top')
+
 // Display individual leaf nodes instead of the main group when all leaf nodes are selected
 ->grouped(false)
 

resources/dist/tree.js

@@ -18,7 +18,8 @@ export default function tree(
         emptyText,
         expandSelected = true,
         grouped = true,
-        openLevel = 0
+        openLevel = 0,
+        direction = 'auto'
     }) {
     return {
         state,
@@ -43,7 +44,8 @@ export default function tree(
                 emptyText,
                 expandSelected,
                 grouped,
-                openLevel
+                openLevel,
+                direction
             });
 
             this.tree.srcElement.addEventListener('input', (e) => {

resources/js/index.js

@@ -29,6 +29,7 @@
                 expandSelected: '{{ $getExpandSelected() }}',
                 grouped: '{{ $getGrouped() }}',
                 openLevel: '{{ $getDefaultOpenLevel() }}',
+                direction: '{{ $getDirection() }}',
             })"
         >
             <div x-ref="tree"></div>

resources/views/select-tree.blade.php

@@ -47,6 +47,8 @@ class SelectTree extends Field
 
     protected Closure|int $defaultOpenLevel;
 
+    protected string $direction = 'auto';
+
     protected function setUp(): void
     {
         // Load the state from relationships using a callback function.
@@ -127,6 +129,13 @@ public function withCount(bool $withCount = true): static
         return $this;
     }
 
+    public function direction(string $direction): static
+    {
+        $this->direction = $direction;
+
+        return $this;
+    }
+
     public function getRelationship(): BelongsToMany|BelongsTo
     {
         return $this->getModelInstance()->{$this->evaluate($this->relationship)}();
@@ -252,4 +261,9 @@ public function getEmptyLabel(): string
     {
         return $this->emptyLabel ? $this->evaluate($this->emptyLabel) : __('No results found');
     }
+
+    public function getDirection(): string
+    {
+        return $this->evaluate($this->direction);
+    }
 }