Add Table action button
This commit is contained in:
parent
44cf24ea25
commit
299ef87ef6
|
@ -0,0 +1,68 @@
|
|||
<?php
|
||||
|
||||
namespace App\View\Enums;
|
||||
|
||||
enum Variant: string
|
||||
{
|
||||
|
||||
case PRIMARY = 'primary';
|
||||
case SECONDARY = 'secondary';
|
||||
case PRIMARYLIGHT = 'primary-light';
|
||||
case WARNING = 'warning';
|
||||
case INFO = 'info';
|
||||
case DANGER = 'danger';
|
||||
|
||||
public function foreground(): string
|
||||
{
|
||||
return match ($this) {
|
||||
self::PRIMARY => 'text-primary-300',
|
||||
self::SECONDARY => 'text-primary-400',
|
||||
self::PRIMARYLIGHT => 'text-primary-200',
|
||||
self::WARNING => 'text-yellow-300',
|
||||
self::INFO => 'text-blue-300',
|
||||
self::DANGER => 'text-red-100',
|
||||
};
|
||||
}
|
||||
|
||||
public function background(): string
|
||||
{
|
||||
return match ($this) {
|
||||
self::PRIMARY => 'bg-primary-700',
|
||||
self::SECONDARY => 'bg-primary-800',
|
||||
self::PRIMARYLIGHT => 'bg-primary-600',
|
||||
self::WARNING => 'bg-yellow-700',
|
||||
self::INFO => 'bg-blue-700',
|
||||
self::DANGER => 'bg-red-400',
|
||||
};
|
||||
}
|
||||
|
||||
public function hoverForeground(): string
|
||||
{
|
||||
return match ($this) {
|
||||
self::PRIMARY => 'hover:text-primary-100',
|
||||
self::SECONDARY => 'hover:text-primary-200',
|
||||
self::PRIMARYLIGHT => 'hover:text-primary-100',
|
||||
self::WARNING => 'hover:text-yellow-100',
|
||||
self::INFO => 'hover:text-blue-100',
|
||||
self::DANGER => 'hover:text-red-100',
|
||||
};
|
||||
}
|
||||
|
||||
public function hoverBackground(): string
|
||||
{
|
||||
return match ($this) {
|
||||
self::PRIMARY => 'hover:bg-primary-500',
|
||||
self::SECONDARY => 'hover:bg-primary-600',
|
||||
self::PRIMARYLIGHT => 'hover:bg-primary-500',
|
||||
self::WARNING => 'hover:bg-yellow-500',
|
||||
self::INFO => 'hover:bg-blue-500',
|
||||
self::DANGER => 'hover:bg-red-500',
|
||||
};
|
||||
}
|
||||
|
||||
public static function fromString(string $input): self
|
||||
{
|
||||
return collect(static::cases())
|
||||
->first(fn ($variant) => $variant->value === $input);
|
||||
}
|
||||
}
|
|
@ -0,0 +1,33 @@
|
|||
<?php
|
||||
|
||||
namespace App\View\Traits;
|
||||
|
||||
use App\View\Enums\Variant;
|
||||
|
||||
trait HasColors
|
||||
{
|
||||
public function bgColor(string $variant): string
|
||||
{
|
||||
$variant = Variant::fromString($variant);
|
||||
|
||||
return implode(' ', [
|
||||
$variant->background(),
|
||||
$variant->hoverBackground(),
|
||||
]);
|
||||
}
|
||||
|
||||
public function fgColor(string $variant): string
|
||||
{
|
||||
$variant = Variant::fromString($variant);
|
||||
|
||||
return implode(' ', [
|
||||
$variant->foreground(),
|
||||
$variant->hoverForeground(),
|
||||
]);
|
||||
}
|
||||
|
||||
public function allColors(string $variant): string
|
||||
{
|
||||
return "{$this->bgColor($variant)} {$this->fgColor($variant)}";
|
||||
}
|
||||
}
|
|
@ -0,0 +1,29 @@
|
|||
<?php
|
||||
|
||||
namespace App\View\Ui;
|
||||
|
||||
use App\View\Traits\HasColors;
|
||||
use Illuminate\View\Component;
|
||||
|
||||
class Action extends Component
|
||||
{
|
||||
|
||||
use HasColors;
|
||||
|
||||
public function __construct(
|
||||
public string $icon,
|
||||
public string $variant = 'primary'
|
||||
) {
|
||||
}
|
||||
|
||||
public function render()
|
||||
{
|
||||
return <<<'HTML'
|
||||
<a v-tooltip.raw="{{$slot}}" href="#" {{ $attributes }} class="inline-flex
|
||||
w-6 h-5 flex items-center justify-center rounded {{ $allColors($variant) }}
|
||||
">
|
||||
<x-ui::sprite class="w-3 h-3 flex-none" :src="$icon"></x-ui::sprite>
|
||||
</a>
|
||||
HTML;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue