<script lang="ts">
	import Input from "@zedensix/ui/components/input";
	import { usePageTitle } from "@zedensix/ui/page-title";

	const title = usePageTitle();
</script>

<Input
	label="Page title"
	description="The header above and this browser tab follow as you type."
	bind:value={title.current}
/>

<script lang="ts">
	import DocumentTitle from "@zedensix/ui/blocks/document-title";
	import { providePageTitle } from "@zedensix/ui/page-title";

	const { children } = $props();

	providePageTitle();
</script>

<DocumentTitle appName="Acme" />
{@render children()}