Initial Commit

Author: lrljoe

docs/search/available-methods.md

@@ -192,3 +192,37 @@ public function configure(): void
     $this->setTrimSearchStringDisabled();
 }
 ```
+
+## Search Icon
+
+To help customise, a "Search Input Icon" has been added, allowing for the addition of an icon to the search input field.
+
+At present, the Search Icon is only available as a "left aligned" icon.
+
+### setSearchIcon
+
+This adds an Icon to the Search Input Field, which expects an icon path (e.g. heroicon-m-magnifying-glass)
+
+```php
+public function configure(): void
+{
+    $this->setSearchIcon('heroicon-m-magnifying-glass');
+}
+```
+
+### setSearchIconAttributes
+
+This allows you to specify attributes for the Search Icon for the Input Field.
+
+Note that classes will be injected prior to styles, due to the behaviour of icons.
+
+```php
+public function configure(): void
+{
+    $this->setSearchIconAttributes([
+        'class' => 'h-4 w-4',
+        'style' => 'color: #000000',
+    ]);
+}
+
+```

resources/views/components/tools/toolbar/items/search-field.blade.php

@@ -12,12 +12,8 @@
             <div class="relative inset-y-0 left-6
                         inline-flex items-center 
                         pointer-events-none">
-                <x-heroicon-m-magnifying-glass {{ $attributes->merge($this->getSearchIconAttributes())
-                    ->class([
-                        'w-4 h-4' => (($this->getSearchIconAttributes()['default'] ?? true) || ($this->getSearchIconAttributes()['default-styling'] ?? true)),
-                    ]) 
-                }}
-                />
+
+                    @svg($this->getSearchIcon, $this->getSearchIconClasses, $this->getSearchIconOtherAttributes())
 
             </div>
         @endif

src/Traits/Configuration/SearchConfiguration.php

@@ -147,12 +147,6 @@ public function setSearchLazy(): self
         return $this;
     }
 
-    public function setSearchPlaceholder(string $placeholder): self
-    {
-        $this->searchPlaceholder = $placeholder;
-
-        return $this;
-    }
 
     public function setTrimSearchString(bool $status): self
     {

src/Traits/Helpers/SearchHelpers.php

@@ -121,20 +121,6 @@ public function getSearchOptions(): string
         return '.live';
     }
 
-    public function getSearchPlaceholder(): string
-    {
-        if ($this->hasSearchPlaceholder()) {
-            return $this->searchPlaceholder;
-        }
-
-        return __($this->getLocalisationPath().'Search');
-    }
-
-    public function hasSearchPlaceholder(): bool
-    {
-        return $this->searchPlaceholder !== null;
-    }
-
     public function shouldTrimSearchString(): bool
     {
         return $this->trimSearchString ?? false;

src/Traits/Styling/Configuration/SearchFieldStylingConfiguration.php

@@ -2,19 +2,11 @@
 
 namespace Rappasoft\LaravelLivewireTables\Traits\Styling;
 
-use Rappasoft\LaravelLivewireTables\Traits\Styling\Configuration\SearchFieldStylingConfiguration;
-use Rappasoft\LaravelLivewireTables\Traits\Styling\Helpers\SearchFieldStylingHelpers;
+use Rappasoft\LaravelLivewireTables\Traits\Styling\Search\{HasSearchIcon, HasSearchInput};
 
 trait HasSearchFieldStyling
 {
-    use SearchFieldStylingConfiguration,
-        SearchFieldStylingHelpers;
+    use HasSearchIcon,
+        HasSearchInput;
 
-    protected array $searchFieldAttributes = [];
-
-    protected bool $searchIconSet = false;
-
-    protected ?string $searchIcon = null;
-
-    protected array $searchIconAttributes = ['default-colors' => true, 'default-styling' => true];
 }

src/Traits/Styling/HasSearchFieldStyling.php

@@ -0,0 +1,77 @@
+<?php
+
+namespace Rappasoft\LaravelLivewireTables\Traits\Styling\Search;
+
+use Livewire\Attributes\Computed;
+
+trait HasSearchIcon
+{
+    protected bool $searchIconSet = false;
+
+    protected ?string $searchIcon = null;
+
+    protected array $searchIconAttributes = ['class' => 'h-4 w-4', 'style' => 'color: #000000'];
+
+    #[Computed]
+    public function hasSearchIcon(): bool
+    {
+        return $this->searchIconSet;
+    }
+
+    #[Computed]
+    public function getSearchIcon(): string
+    {
+        return $this->hasSearchIcon() ? $this->searchIcon : 'heroicon-m-magnifying-glass';
+    }
+
+    #[Computed]
+    public function getSearchIconClasses(): string
+    {
+        return $this->getSearchIconAttributes()['class'];
+
+    }
+
+    #[Computed]
+    public function getSearchIconAttributes(): array
+    {
+        return $this->searchIconAttributes;
+    }
+
+    #[Computed]
+    public function getSearchIconOtherAttributes(): array
+    {
+        return collect($this->getSearchIconAttributes())->except('class')->toArray();
+    }
+
+    
+    protected function setSearchIconStatus(bool $searchIconStatus): self
+    {
+        $this->searchIconSet = $searchIconStatus;
+        return $this;
+    }
+
+    protected function searchIconEnabled(): self
+    {
+        return $this->setSearchIconStatus(true);
+    }
+
+    protected function searchIconDisabled(): self
+    {
+        return $this->setSearchIconStatus(false);
+    }
+
+    protected function setSearchIcon(string $searchIcon): self
+    {
+        $this->searchIcon = $searchIcon;
+
+        return $this->searchIconEnabled();
+    }
+    
+    protected function setSearchIconAttributes(array $searchIconAttributes): self
+    {
+        $this->searchIconAttributes = array_merge($this->searchIconAttributes, $searchIconAttributes);
+
+        return $this->searchIconEnabled();
+    }
+
+}

src/Traits/Styling/Helpers/SearchFieldStylingHelpers.php

@@ -0,0 +1,46 @@
+<?php
+
+namespace Rappasoft\LaravelLivewireTables\Traits\Styling\Search;
+
+use Livewire\Attributes\Computed;
+
+trait HasSearchInput
+{
+    protected array $searchFieldAttributes = [];
+
+    protected ?string $searchPlaceholder = null;
+
+    protected function setSearchFieldAttributes(array $attributes = []): self
+    {
+        $this->setCustomAttributes('searchFieldAttributes', array_merge(['default' => false, 'default-colors' => false, 'default-styling' => false], $attributes));
+
+        return $this;
+    }
+
+    public function getSearchFieldAttributes(): array
+    {
+        return $this->getCustomAttributes('searchFieldAttributes', true);
+    }
+
+    public function setSearchPlaceholder(string $placeholder): self
+    {
+        $this->searchPlaceholder = $placeholder;
+
+        return $this;
+    }
+    
+    public function getSearchPlaceholder(): string
+    {
+        if ($this->hasSearchPlaceholder()) {
+            return $this->searchPlaceholder;
+        }
+
+        return __($this->getLocalisationPath().'Search');
+    }
+
+    public function hasSearchPlaceholder(): bool
+    {
+        return $this->searchPlaceholder !== null;
+    }
+
+}

src/Traits/Styling/Search/HasSearchIcon.php

@@ -22,8 +22,6 @@ trait WithSearch
     #[Locked]
     public bool $searchStatus = true;
 
-    protected ?string $searchPlaceholder = null;
-
     protected bool $searchVisibilityStatus = true;
 
     protected ?bool $searchFilterBlur = null;