<script>
	import Composite from '$lib/components/Composite.svelte';

	let componentsData = {
		layout: `
			grid-template-areas: 
			"auth",
				"login",
				"play",
				"hello"
			grid-template-rows: auto 1fr 1fr;
		`,
		children: [
			{
				id: 'authsig',
				componentName: 'AuthSig',
				slot: 'auth'
			},
			{
				id: 'wallet1',
				componentName: 'Wallet',
				slot: 'play',
				state: {
					rpcURL: 'https://rpc.gnosischain.com/',
					pkpPubKey:
						'046da3ba67065fd1e2726242ca01cd4601524893f4aa4b0042578fa6cbec28fa8c9a28eb9f7893932fc09717edc9e1db57e157a21eed346247c1db5a722a01f571'
				}
			},
			{
				id: 'hello',
				componentName: 'GoogleAuth',
				slot: 'hello',
				services: ['setupLitProvider']
			}
		]
	};
</script>

<Composite {componentsData} />
