Blazor and AlpineJS -- click away from child Component

Solution 1:

Try replacing '@' with 'x-on'.

I think using the Alpine '@' shortcut is confusing Blazor with its @onclick events. I'm doing something similar and the x-on:click.away is working.

Also, it seems like you can use this to wire both Alpine and Blazor up to the event. I'm using Blazor Server Side in .Net 6.

<button x-on:click="open = !open"  @onclick="CloseDialog" type="button" class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-indigo-600 text-base font-medium text-white hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:col-start-2 sm:text-sm">
                            Deactivate
</button>