feat: add labelHook to select

README.md

@@ -88,6 +88,9 @@ TrilistSelect::make(string $fieldName)
     // tree item children field name, default: 'children'
     ->fieldChildren(string | Closure $value)
 
+    // hook for generating custom labels, default: '(item) => item.label'
+    ->labelHook(string | Closure $value)
+
     // enable filtering of items, default: false
     ->searchable(bool | Closure $condition)
 
@@ -101,6 +104,17 @@ TrilistSelect::make(string $fieldName)
     ->cancelButton(string | Htmlable | Closure $message)
 ```
 
+### Custom labels
+
+If you want to customize labels you can use `labelHook` method. It should return a string that will be processed as JS (pay attention to escaping quotes and special characters):
+
+```php
+TrilistSelect::make('parent_id')
+    ->labelHook(fn () => <<<JS
+        (item) => `\${item.label} \${item.data?.description ? '<div style=\'font-size: 0.85em; opacity: 0.5\'>' + item.data.description + '</div>' : ''}`
+        JS)
+```
+
 ### Usage in filters
 
 You can use treeselect in [custom filter](https://filamentphp.com/docs/3.x/tables/filters#custom-filter-forms):
@@ -253,7 +267,7 @@ class TreeCategories extends TrilistPage
 - `isSearchable()`: enable filtering of items, default: false
 - `getSearchPrompt()`: search input placeholder
 
-### Customize labels
+### Custom labels
 
 If you want to customize labels of the tree items, you can override `getLabelHook()` method of the `TrilistPage`.
 

resources/views/select.blade.php

@@ -14,7 +14,8 @@
                     items,
                     value: this.state,
                     disabled: @js($getDisabledOptions()),
-                    onChangeHook: (value) => this.state = value
+                    onChangeHook: (value) => this.state = value,
+                    labelHook: {!! $getLabelHook() !!}
                 })
                 this.$watch('state', () => $el.trilist.setValue(this.state))
             }

src/Components/TrilistSelect.php

@@ -47,6 +47,10 @@ class TrilistSelect extends Field
 
     protected string | Closure $fieldChildren = 'children';
 
+    protected string | Closure $labelHook = <<<JS
+    (item) => item.label
+    JS;
+
     protected function setUp(): void
     {
         parent::setUp();
@@ -276,4 +280,16 @@ public function getDisabledOptions(): array
     {
         return (array) $this->evaluate($this->disabledOptions);
     }
+
+    public function labelHook(string | Closure $value): static
+    {
+        $this->labelHook = $value;
+
+        return $this;
+    }
+
+    public function getLabelHook(): string
+    {
+        return (string) $this->evaluate($this->labelHook);
+    }
 }