@props(['text', 'type', 'id', 'mb', 'method'])

<div class="{{ $mb ?? "mb-6" }} text-right">
    <button id="{{ $id ?? "" }}" type="{{ $type }}" @if ($method) wire:click="{{ $method }}" @endif 
        class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-10 rounded-md transition duration-300 ease-in-out shadow-lg">
        <div>
            <span wire:loading.remove @if($method) wire:target="{{ $method }}" @endif>
                <span>{{ $text ?? "Save" }}</span>
            </span>
            <div>
                <div wire:loading @if($method) wire:target="{{ $method }}" @endif
                    class="ml-2 w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin">
                </div>
            </div>
        </div>
    </button>
</div>