<script setup lang="ts">
	import { useChallengeV2, useRecaptchaProvider } from "vue-recaptcha";
	useRecaptchaProvider();
	const emit = defineEmits<{
		(e: "verify", response: string): void;
	}>();
	const m = defineModel<number>("ts");
	const d = defineModel<boolean>("done");

	const { root, execute, onVerify, widgetID, onExpired } = useChallengeV2({
		options: {
			size: "invisible",
		},
	});
	watch(
		() => m.value,
		() => {
			execute();
		},
	);
	onVerify((resp) => {
		console.debug("onverify called", resp);
		emit("verify", resp);
	});
</script>

<template>
	<div>
		<div ref="root" />
	</div>
</template>

<style scoped></style>