<script>
	export let me;
	export let data;

	let childData;

	$: if (me.do) {
		childData = me.do.core.subscribeData('ComposerBob');
	}

	$: {
		if ($childData && $childData.state) {
			me.do.machine.send($childData.state);
		}
	}
</script>

<div class="p-2 border-2 border-blue-500">
	<p>My ID is: {me.id}</p>

	I am the parent, this is my state: {$data.state}
	<div
		class="p-2 border-2"
		style="background-color: {$data.state}; border-radius: 50%; width: 50px; height: 50px;"
	/>
</div>
