<button type="button" x-data="{ open: false }" @click="open = ! open" class="btn">
    Toggle Modal
    <template x-teleport="body">
        <dialog class="modal modal-open modal-bottom sm:modal-middle" x-show="open" @keyup.escape.window="open = false">
            <div class="modal-box" @click.outside="open = false">
                <h3 class="font-bold text-lg">Congratulations random Internet user!</h3>
                <p class="py-4">You've been selected for a chance to get one year of subscription to use Wikipedia for free!</p>
            </div>
        </dialog>
    </template>
</button>
@jrmc.modal({ button: { text: 'Toggle Modal' }, mobile: true })
  <h3 class="font-bold text-lg">Congratulations random Internet user!</h3>
  <p class="py-4">You've been selected for a chance to get one year of subscription to use Wikipedia for free!</p>
@end

Modal not implementation daysyui solution, use alpinejs for open modal