@props(['id', 'action', 'message'])
<x-modal id="{{$id}}" maxWidth='sm'>
    <!-- contents -->
    <main class="p-4 h-16 text-sm">
    {{$message}}よろしいですか？
    </main>
    <!-- footer -->
    <footer class="py-3 px-3 flex gap-3 items-center justify-end border-t ">
        <x-button.modal-cancel  data-micromodal-close/>
        <x-button.modal-ok type="button" @click="{{ $action }}(); MicroModal.close();" />
    </footer>
</x-modal>