<?php

namespace App\View\Components;

use Closure;
use Illuminate\Contracts\View\View;
use Illuminate\View\Component;

class Button extends Component
{

    public function __construct(public string $variant = 'primary', public bool $disabled = false)
    {
        //
    }

    public function classes(): string
    {
        $base = 'inline-flex items-center justify-center px-4 py-2 rounded-md text-sm font-medium transition duration-150 ease-in-out';

        $variants = [
            'primary' => 'bg-primary text-text-inverted hover:bg-blue-700',
            'secondary' => 'bg-secondary text-text hover:bg-gray-300',
            'outline' => 'border border-primary text-primary hover:bg-red-700',
        ];

        $disabled = 'disabled:bg-gray-300 disabled:text-gray-500 disabled:cursor-not-allowed disabled:opacity-60';

        return trim(
            $base . ' ' .
            ($variants[$this->variant] ?? $variants['primary']) . ' ' .
            $disabled
        );
    }

    /**
     * Get the view / contents that represent the component.
     */
    public function render(): View|Closure|string
    {
        return view('components.button');
    }
}