<EditorLayout
	back={{ href: "/posts", label: "Posts" }}
	title="Designing a calmer editor"
	status={
		<SaveStatus
			id="post-status"
			editedAt={post.updatedAt}
			form="post-form"
			labels={{ saving: "Saving…", saved: "Saved", failed: "Failed", retry: "Retry", edited: "Edited {time}" }}
		/>
	}
	preview={<LinkButton href={previewUrl} variant="ghost" color="neutral" size="sm">Preview</LinkButton>}
	primary={<Button type="submit" form="post-form" size="sm">Publish</Button>}
	sidebar={
		<>
			<Label htmlFor="post-visibility">Visibility</Label>
			<Select id="post-visibility" name="visibility" form="post-form">…</Select>
			<Label htmlFor="post-slug">Slug</Label>
			<Input id="post-slug" name="slug" form="post-form" defaultValue="designing-a-calmer-editor" />
			<Label htmlFor="post-tags">Tags</Label>
			<Input id="post-tags" name="tags" form="post-form" defaultValue="design, writing" />
		</>
	}
	labels={{ settings: "Settings", closeSettings: "Close settings", sidebar: "Post settings" }}
>
	<form id="post-form" method="post">…</form>
</EditorLayout>