diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5c6ff504c..90dc7f8c7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,10 @@
All notable changes to `laravel-livewire-tables` will be documented in this file
+## [v3.4.11] - 2024-08-23
+### New Features
+- Add setIconLeft/setIconRight for Actions by @lrljoe in https://github.com/rappasoft/laravel-livewire-tables/pull/1877
+
## [v3.4.10] - 2024-08-23
### Bug Fixes
- Default UseComputedProperties to True to default to new views by @lrljoe in https://github.com/rappasoft/laravel-livewire-tables/pull/1873
diff --git a/docs/misc/actions.md b/docs/misc/actions.md
index 34850a090..8a46a7b0c 100644
--- a/docs/misc/actions.md
+++ b/docs/misc/actions.md
@@ -84,6 +84,38 @@ public function actions(): array
}
```
+### setIconLeft
+
+setIconLeft is used to prepend the Icon to the Text (Non-Default Behaviour)
+
+```php
+public function actions(): array
+{
+ return [
+ Action::make('Edit Item')
+ ->setIcon("fas fa-edit")
+ ->setIconAttributes(['class' => 'font-4xl text-4xl'])
+ ->setIconLeft(),
+ ];
+}
+```
+
+### setIconRight
+
+setIconRight is used to append the Icon to the Text (Default Behaviour)
+
+```php
+public function actions(): array
+{
+ return [
+ Action::make('Edit Item')
+ ->setIcon("fas fa-edit")
+ ->setIconAttributes(['class' => 'font-4xl text-4xl'])
+ ->setIconRight(),
+ ];
+}
+```
+
### setRoute
Used for non-wireable butons, to set the route that the action button should take the user to upon clicking.
diff --git a/resources/views/includes/actions/button.blade.php b/resources/views/includes/actions/button.blade.php
index 0d22c2c91..878be5b0b 100644
--- a/resources/views/includes/actions/button.blade.php
+++ b/resources/views/includes/actions/button.blade.php
@@ -1,5 +1,5 @@
merge()
- ->class(['justify-center text-center items-center inline-flex rounded-md border shadow-sm px-4 py-2 text-sm font-medium focus:ring focus:ring-opacity-50' => $isTailwind && $attributes['default-styling'] ?? true])
+ ->class(['justify-center text-center items-center inline-flex space-x-2 rounded-md border shadow-sm px-4 py-2 text-sm font-medium focus:ring focus:ring-opacity-50' => $isTailwind && $attributes['default-styling'] ?? true])
->class(['focus:border-indigo-300 focus:ring-indigo-200' => $isTailwind && $attributes['default-colors'] ?? true])
->class(['btn btn-sm btn-success' => $isBootstrap && $attributes['default-styling'] ?? true])
->class(['' => $isBootstrap && $attributes['default-colors'] ?? true])
@@ -12,13 +12,22 @@
wire:navigate
@endif
>
- {{ $action->getLabel() }}
- @if($action->hasIcon())
+ @if($action->hasIcon() && $action->getIconRight())
+ {{ $action->getLabel() }}
getIconAttributes()
- ->class(["ms-1 ". $action->getIcon() => $isBootstrap])
- ->class(["ml-1 ". $action->getIcon() => $isTailwind])
- ->except('default-styling')
- }}>
+ ->class(["ms-1 ". $action->getIcon() => $isBootstrap])
+ ->class(["ml-1 ". $action->getIcon() => $isTailwind])
+ ->except('default-styling')
+ }}
+ >
+ @elseif($action->hasIcon() && !$action->getIconRight())
+ getIconAttributes()
+ ->class(["ms-1 ". $action->getIcon() => $isBootstrap])
+ ->class(["ml-1 ". $action->getIcon() => $isTailwind])
+ ->except('default-styling')
+ }}
+ >
+ {{ $action->getLabel() }}
@endif
\ No newline at end of file
diff --git a/src/Views/Traits/Core/HasIcon.php b/src/Views/Traits/Core/HasIcon.php
index bd80ca841..3056e45c5 100644
--- a/src/Views/Traits/Core/HasIcon.php
+++ b/src/Views/Traits/Core/HasIcon.php
@@ -11,6 +11,8 @@ trait HasIcon
public array $iconAttributes = ['default-styling' => true];
+ public bool $iconRight = true;
+
public function setIcon(string $icon): self
{
$this->icon = $icon;
@@ -39,4 +41,23 @@ public function getIconAttributes(): ComponentAttributeBag
{
return new ComponentAttributeBag([...['default-styling' => true], ...$this->iconAttributes]);
}
+
+ public function getIconRight(): bool
+ {
+ return $this->iconRight ?? true;
+ }
+
+ public function setIconLeft(): self
+ {
+ $this->iconRight = false;
+
+ return $this;
+ }
+
+ public function setIconRight(): self
+ {
+ $this->iconRight = true;
+
+ return $this;
+ }
}
diff --git a/tests/Views/Actions/ActionTest.php b/tests/Views/Actions/ActionTest.php
index 9e262803b..f33d30bcb 100644
--- a/tests/Views/Actions/ActionTest.php
+++ b/tests/Views/Actions/ActionTest.php
@@ -296,6 +296,42 @@ public function exportBulk($items)
}
+ public function test_can_set_icon_to_right_default(): void
+ {
+ $action = Action::make('Update Summaries')
+ ->setActionAttributes(['class' => 'dark:bg-green-500 dark:text-white dark:border-green-600 dark:hover:border-green-900 dark:hover:bg-green-800', 'default-styling' => true, 'default-colors' => true])
+ ->setIcon('fas fa-minus')
+ ->setIconAttributes(['class' => 'font-sm text-sm'])
+ ->setWireAction('wire:click')
+ ->setWireActionParams('testactionparams');
+ $this->assertTrue($action->getIconRight());
+ }
+
+ public function test_can_set_icon_to_left(): void
+ {
+ $action = Action::make('Update Summaries')
+ ->setActionAttributes(['class' => 'dark:bg-green-500 dark:text-white dark:border-green-600 dark:hover:border-green-900 dark:hover:bg-green-800', 'default-styling' => true, 'default-colors' => true])
+ ->setIcon('fas fa-minus')
+ ->setIconAttributes(['class' => 'font-sm text-sm'])
+ ->setIconLeft()
+ ->setWireAction('wire:click')
+ ->setWireActionParams('testactionparams');
+ $this->assertFalse($action->getIconRight());
+ }
+
+ public function test_can_set_icon_to_right(): void
+ {
+ $action = Action::make('Update Summaries')
+ ->setActionAttributes(['class' => 'dark:bg-green-500 dark:text-white dark:border-green-600 dark:hover:border-green-900 dark:hover:bg-green-800', 'default-styling' => true, 'default-colors' => true])
+ ->setIcon('fas fa-minus')
+ ->setIconAttributes(['class' => 'font-sm text-sm'])
+ ->setWireAction('wire:click')
+ ->setWireActionParams('testactionparams')
+ ->setIconLeft()
+ ->setIconRight();
+ $this->assertTrue($action->getIconRight());
+ }
+
public function test_action_renders_correctly(): void
{
$action = Action::make('Update Summaries')
@@ -305,6 +341,6 @@ public function test_action_renders_correctly(): void
)
->route('dashboard22');
- $this->assertStringContainsString('render());
+ $this->assertStringContainsString('render());
}
}