ModalStore.trigger from within response - puts in strange state about skeleton HOT 4 OPEN

<script lang="ts">
	import type { ModalSettings } from '@skeletonlabs/skeleton';
	import { getModalStore } from '@skeletonlabs/skeleton';

	function delay(ms: number) {
		return new Promise((resolve) => setTimeout(resolve, ms));
	}

	const modalStore = getModalStore();

	const modal: ModalSettings = {
		type: 'confirm',
		// Data
		title: 'Please Confirm',
		body: 'Are you sure you wish to proceed?',
		// TRUE if confirm pressed, FALSE if cancel pressed
		response: async (r: boolean) => {
			// Some action is happening...
			await delay(100);
			// Error occurred
			const modalError: ModalSettings = {
				type: 'alert',
				// Data
				title: 'Error title',
				body: 'Error Body'
			};

			modalStore.trigger(modalError);
		}
	};

	function handleSubmit() {
		modalStore.trigger(modal);
	}
</script>

<form method="post" on:submit|preventDefault={handleSubmit}>
	<!-- <input type="text" /> -->
	<button>Action button</button>
</form>