2021-09-15 15:58:21 +00:00
|
|
|
<?php
|
|
|
|
|
|
|
|
|
|
declare(strict_types=1);
|
|
|
|
|
|
|
|
|
|
namespace App\Views\Components;
|
|
|
|
|
|
2024-05-29 10:24:13 +00:00
|
|
|
use Override;
|
2021-09-15 15:58:21 +00:00
|
|
|
use ViewComponents\Component;
|
|
|
|
|
|
|
|
|
|
class Alert extends Component
|
|
|
|
|
{
|
2024-05-09 17:55:41 +00:00
|
|
|
protected array $props = ['glyph', 'title'];
|
2021-09-15 15:58:21 +00:00
|
|
|
|
2024-05-09 17:55:41 +00:00
|
|
|
protected string $glyph = '';
|
|
|
|
|
|
|
|
|
|
protected ?string $title = '';
|
|
|
|
|
|
|
|
|
|
protected array $attributes = [
|
|
|
|
|
'role' => 'alert',
|
|
|
|
|
];
|
2021-09-15 15:58:21 +00:00
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* @var 'default'|'success'|'danger'|'warning'
|
|
|
|
|
*/
|
|
|
|
|
protected string $variant = 'default';
|
|
|
|
|
|
2024-05-29 10:24:13 +00:00
|
|
|
#[Override]
|
2021-09-15 15:58:21 +00:00
|
|
|
public function render(): string
|
|
|
|
|
{
|
2024-05-09 17:55:41 +00:00
|
|
|
$variantData = match ($this->variant) {
|
2022-05-16 11:57:39 +00:00
|
|
|
'success' => [
|
|
|
|
|
'class' => 'text-pine-900 bg-pine-100 border-pine-300',
|
2024-04-26 17:57:25 +00:00
|
|
|
'glyph' => 'check-fill', // @icon('check-fill')
|
2022-05-16 11:57:39 +00:00
|
|
|
],
|
|
|
|
|
'danger' => [
|
|
|
|
|
'class' => 'text-red-900 bg-red-100 border-red-300',
|
2024-04-26 17:57:25 +00:00
|
|
|
'glyph' => 'close-fill', // @icon('close-fill')
|
2022-05-16 11:57:39 +00:00
|
|
|
],
|
|
|
|
|
'warning' => [
|
|
|
|
|
'class' => 'text-yellow-900 bg-yellow-100 border-yellow-300',
|
2024-04-26 17:57:25 +00:00
|
|
|
'glyph' => 'alert-fill', // @icon('alert-fill')
|
2022-05-16 11:57:39 +00:00
|
|
|
],
|
2024-05-09 17:55:41 +00:00
|
|
|
default => [
|
2023-06-21 16:17:11 +00:00
|
|
|
'class' => 'text-blue-900 bg-blue-100 border-blue-300',
|
2024-04-26 17:57:25 +00:00
|
|
|
'glyph' => 'error-warning-fill', // @icon('error-warning-fill')
|
2023-06-21 16:17:11 +00:00
|
|
|
],
|
2024-05-09 17:55:41 +00:00
|
|
|
};
|
2021-09-15 15:58:21 +00:00
|
|
|
|
2024-05-09 17:55:41 +00:00
|
|
|
$glyph = icon(($this->glyph === '' ? $variantData['glyph'] : $this->glyph), [
|
2024-04-26 17:57:25 +00:00
|
|
|
'class' => 'flex-shrink-0 mr-2 text-lg',
|
|
|
|
|
]);
|
2024-05-09 17:55:41 +00:00
|
|
|
$title = $this->title === '' ? '' : '<div class="font-semibold">' . $this->title . '</div>';
|
|
|
|
|
$this->mergeClass('inline-flex w-full p-2 text-sm border rounded ');
|
|
|
|
|
$this->mergeClass($variantData['class']);
|
2021-09-15 15:58:21 +00:00
|
|
|
|
|
|
|
|
return <<<HTML
|
2024-05-09 17:55:41 +00:00
|
|
|
<div {$this->getStringifiedAttributes()}>{$glyph}<div>{$title}<p>{$this->slot}</p></div></div>
|
2021-09-15 15:58:21 +00:00
|
|
|
HTML;
|
|
|
|
|
}
|
|
|
|
|
}
|
