<xf:set var="$uid">{{ unique_id() }}</xf:set>
{{ phrase('btcpayprovider_the_invoice_for_x_has_been_created_to_pay_y', {
	'cost': $extra.purchase.cost|currency($extra.purchase.currency),
	'purchasable': $extra.purchase.title,
	'uid': $uid
}) }}
<xf:js src="{$extra.scriptUrl}" />
<xf:js>
	(() => {
		const uid = '#{$uid}'
		const invoiceId = '{$extra.invoice.id}'
		window.btcpay.xfRegistry ??= {}
		window.btcpay.xfRegistry.clickBinds ??= {}
	
		if (window.btcpay.xfRegistry.clickBinds[uid]) return;
	
		window.btcpay.xfRegistry.clickBinds[uid] = true;
	
		document.addEventListener('click', e => {
			if (e.target.matches(uid) || e.target.closest(uid)) {
				window.btcpay.showInvoice(invoiceId)
			}
		})
	})()
</xf:js>