From 5d16d65f8a40d084679f877cde3db1ba7d9bad47 Mon Sep 17 00:00:00 2001
From: philipp lang <philipp@aweos.de>
Date: Thu, 17 Oct 2024 00:25:58 +0200
Subject: [PATCH] Add Table action button
---
app/View/Enums/Variant.php | 68 +++++++++++++++++++++++++++++++++++
app/View/Traits/HasColors.php | 33 +++++++++++++++++
app/View/Ui/Action.php | 29 +++++++++++++++
3 files changed, 130 insertions(+)
create mode 100644 app/View/Enums/Variant.php
create mode 100644 app/View/Traits/HasColors.php
create mode 100644 app/View/Ui/Action.php
diff --git a/app/View/Enums/Variant.php b/app/View/Enums/Variant.php
new file mode 100644
index 00000000..121d284f
--- /dev/null
+++ b/app/View/Enums/Variant.php
@@ -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);
+ }
+}
diff --git a/app/View/Traits/HasColors.php b/app/View/Traits/HasColors.php
new file mode 100644
index 00000000..e35e30f2
--- /dev/null
+++ b/app/View/Traits/HasColors.php
@@ -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)}";
+ }
+}
diff --git a/app/View/Ui/Action.php b/app/View/Ui/Action.php
new file mode 100644
index 00000000..40ce1728
--- /dev/null
+++ b/app/View/Ui/Action.php
@@ -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;
+ }
+}