diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..ad24951
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,9 @@
+{
+	"editor.defaultFormatter": "esbenp.prettier-vscode",
+	"editor.insertSpaces": true,
+	"editor.tabSize": 2,
+	"files.eol": "\n",
+	"[svelte]": {
+		"editor.defaultFormatter": "svelte.svelte-vscode"
+	}
+}
diff --git a/src/lib/components/form/form.svelte b/src/lib/components/form/form.svelte
index ab61be4..cf1889d 100644
--- a/src/lib/components/form/form.svelte
+++ b/src/lib/components/form/form.svelte
@@ -1,11 +1,11 @@
 <script lang="ts">
 	import type { User, Form } from '$lib/store';
-	import QuestionInput from '$lib/components/form/question_input/question_input.svelte';
+	import QuestionInput from '$lib/components/question_input/question_input.svelte';
 
-	export let data: Form;
-	export let user: User | undefined = undefined;
 	export let action = '';
 	export let method = 'POST';
+	export let data: Form;
+	export let user: User | undefined = undefined;
 
 	if (data.questions.shuffled) {
 		data.questions.data = data.questions.data.sort(() => Math.random() - 0.5);
@@ -27,16 +27,16 @@
 				{/if}
 			</p>
 
-			{#if data.schedule?.startDate}
-				<p>Opened at: {data.schedule?.startDate}</p>
+			{#if data.startDate}
+				<p>Opened at: {data.startDate}</p>
 			{/if}
-			{#if data.schedule?.endDate}
-				<p>Opened until: {data.schedule?.endDate}</p>
+			{#if data?.endDate}
+				<p>Opened until: {data?.endDate}</p>
 			{/if}
 		</div>
 	</div>
 	{#each data.questions.data as question}
-		<QuestionInput data={question} />
+		<QuestionInput {...question} />
 	{/each}
 
 	<button type="submit">Submit</button>
diff --git a/src/lib/components/form/form_editor/form_editor.svelte b/src/lib/components/form/form_editor/form_editor.svelte
deleted file mode 100644
index 8c256d6..0000000
--- a/src/lib/components/form/form_editor/form_editor.svelte
+++ /dev/null
@@ -1,108 +0,0 @@
-<script lang="ts">
-	import type { Form } from '$lib/store';
-	import { QuestionType } from '$lib/form';
-	import QuestionInput from '$lib/components/form/question_input/question_input.svelte';
-
-	export let action: string;
-	export let method: string;
-	export let data: Form;
-
-	// TODO: Add discord data: channels, threads, guilds, roles.
-</script>
-
-<form {action} {method}>
-	<div class="form-header">
-		<h1>Form editor</h1>
-		<p class="form-description">Edit a form!</p>
-		<hr />
-		<div class="form-information">
-			<p>Form ID: {data.id}</p>
-		</div>
-	</div>
-
-	<QuestionInput
-		data={{
-			type: QuestionType.TEXT,
-			name: 'title',
-			content: 'Title'
-		}}
-	/>
-
-	<QuestionInput
-		data={{
-			type: QuestionType.TEXTAREA,
-			name: 'description',
-			content: 'Description'
-		}}
-	/>
-
-	<!-- TODO: Replace camelCase names with snake_case. -->
-	<QuestionInput
-		data={{
-			type: QuestionType.TEXT,
-			name: 'schedule.startDatetime',
-			content: 'Start date'
-		}}
-	/>
-
-	<QuestionInput
-		data={{
-			type: QuestionType.TEXT,
-			name: 'schedule.endDatetime',
-			content: 'End date'
-		}}
-	/>
-
-	<QuestionInput
-		data={{
-			type: QuestionType.TIMEZONE,
-			name: 'schedule.timezone',
-			content: 'Timezone (default: UTC/GMT)'
-		}}
-	/>
-
-	<QuestionInput
-		data={{
-			type: QuestionType.BOOLEAN,
-			name: 'anonymized',
-			content: 'Anonymized'
-		}}
-	/>
-
-	<QuestionInput
-		data={{
-			type: QuestionType.BOOLEAN,
-			name: 'allowsMultipleSubmissions',
-			content: 'Allows multiple submissions'
-		}}
-	/>
-
-	<!-- Discord message schedule -->
-
-	<!-- <QuestionInput
-		data={{
-			type: QuestionType.SELECT,
-			name: 'message.channelID',
-			content: 'Discord channel ID',
-			options: data.channels.map((channel) => ({
-				value: channel.id,
-				content: channel.name
-			}))
-		}}
-	/> -->
-
-	<!-- TODO: Make editor inputs for each type of question. -->
-
-	<button type="submit">Submit</button>
-</form>
-
-<style>
-	form {
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-		align-items: center;
-		margin: 0 auto;
-		max-width: 400px;
-	}
-</style>
diff --git a/src/lib/components/form/question_input/question_input.svelte b/src/lib/components/form/question_input/question_input.svelte
deleted file mode 100644
index 17e49d9..0000000
--- a/src/lib/components/form/question_input/question_input.svelte
+++ /dev/null
@@ -1,59 +0,0 @@
-<script lang="ts">
-	import type { Question } from '$lib/form';
-	import { QuestionType } from '$lib/form';
-	import AvailabilityQuestionInput from '$lib/components/form/questions/availability/availability_question_input.svelte';
-	import BooleanQuestionInput from '$lib/components/form/questions/boolean/boolean_question_input.svelte';
-	import ColorQuestionInput from '$lib/components/form/questions/color/color_question_input.svelte';
-	import DateQuestionInput from '$lib/components/form/questions/date/date_question_input.svelte';
-	import DatetimeQuestionImput from '$lib/components/form/questions/datetime/datetime_question_imput.svelte';
-	import NumberQuestionInput from '$lib/components/form/questions/number/number_question_input.svelte';
-	import RadioGroupQuestionInput from '$lib/components/form/questions/radio_group/radio_group_question_input.svelte';
-	import TextQuestionInput from '$lib/components/form/questions/text/text_question_input.svelte';
-	import TextareaQuestionInput from '$lib/components/form/questions/textarea/textarea_question_input.svelte';
-	import TimeQuestionInput from '$lib/components/form/questions/time/time_question_input.svelte';
-	import SelectQuestionInput from '$lib/components/form/questions/select/select_question_input.svelte';
-	import TimezoneQuestionInput from '$lib/components/form/questions/timezone/timezone_question_input.svelte';
-
-	export let data: Question;
-</script>
-
-<div class="question">
-	{#if data.type === QuestionType.BOOLEAN}
-		<BooleanQuestionInput {data} />
-	{:else if data.type === QuestionType.TEXT}
-		<TextQuestionInput {data} />
-	{:else if data.type === QuestionType.RADIO_GROUP}
-		<RadioGroupQuestionInput {data} />
-	{:else if data.type === QuestionType.NUMBER}
-		<NumberQuestionInput {data} />
-	{:else if data.type === QuestionType.COLOR}
-		<ColorQuestionInput {data} />
-	{:else if data.type === QuestionType.TEXTAREA}
-		<TextareaQuestionInput {data} />
-	{:else if data.type === QuestionType.DATE}
-		<DateQuestionInput {data} />
-	{:else if data.type === QuestionType.AVAILABILITY}
-		<AvailabilityQuestionInput {data} />
-	{:else if data.type === QuestionType.DATETIME}
-		<DatetimeQuestionImput {data} />
-	{:else if data.type === QuestionType.TIME}
-		<TimeQuestionInput {data} />
-	{:else if data.type === QuestionType.SELECT}
-		<SelectQuestionInput {data} />
-	{:else if data.type === QuestionType.TIMEZONE}
-		<TimezoneQuestionInput {data} />
-	{/if}
-</div>
-
-<style>
-	.question {
-		padding: 20px 15px;
-		width: calc(100% - 30px);
-		margin: 10px auto;
-		background-color: #ffffff;
-		border-radius: 10px;
-		border-color: #c5c8c9;
-		border-width: 0;
-		border-style: solid;
-	}
-</style>
diff --git a/src/lib/components/form/question_input_editor/question_base_input.svelte b/src/lib/components/form/question_input_editor/question_base_input.svelte
deleted file mode 100644
index 62dcc8f..0000000
--- a/src/lib/components/form/question_input_editor/question_base_input.svelte
+++ /dev/null
@@ -1,36 +0,0 @@
-<script lang="ts">
-	import type { QuestionBase } from '$lib/form';
-	import { QuestionType } from '$lib/form';
-	import QuestionInput from '$lib/components/form/question_input/question_input.svelte';
-
-	export let value: QuestionBase;
-</script>
-
-<input type="hidden" name="type" value={value.type} />
-
-<QuestionInput
-	data={{
-		type: QuestionType.TEXT,
-		name: 'Name',
-		content: 'The unique identifier for the question.',
-		value: value.name
-	}}
-/>
-
-<QuestionInput
-	data={{
-		type: QuestionType.TEXTAREA,
-		name: 'Content',
-		content: 'The markdown question content for the form field.',
-		value: value.content
-	}}
-/>
-
-<QuestionInput
-	data={{
-		type: QuestionType.BOOLEAN,
-		name: 'Required',
-		content: 'Whether or not the form field is required.',
-		value: value.required
-	}}
-/>
diff --git a/src/lib/components/form_editor/form_editor.svelte b/src/lib/components/form_editor/form_editor.svelte
new file mode 100644
index 0000000..96eb30d
--- /dev/null
+++ b/src/lib/components/form_editor/form_editor.svelte
@@ -0,0 +1,82 @@
+<script lang="ts">
+	import type { Form } from '$lib/store';
+	import { QuestionType } from '$lib/form';
+	import QuestionInput from '$lib/components/question_input/question_input.svelte';
+	import QuestionListEditor from './question_list_editor/question_list_editor.svelte';
+
+	export let action: string;
+	export let method: string;
+	export let value: Form;
+
+	// TODO: Add discord data: channels, threads, guilds, roles.
+</script>
+
+<form {action} {method}>
+	<div class="form-header">
+		<h1>Form editor</h1>
+		<p class="form-description">Edit a form!</p>
+		<hr />
+		<div class="form-information">
+			<p>Form ID: {value.id}</p>
+		</div>
+	</div>
+
+	<QuestionInput type={QuestionType.TEXT} name="title" content="Title" bind:value={value.title} />
+
+	<QuestionInput
+		type={QuestionType.TEXTAREA}
+		name="description"
+		content="Description"
+		bind:value={value.description}
+	/>
+
+	<QuestionInput
+		type={QuestionType.DATETIME}
+		name="startDate"
+		content="Start date"
+		bind:value={value.startDate}
+	/>
+
+	<QuestionInput
+		type={QuestionType.DATETIME}
+		name="endDate"
+		content="End date"
+		bind:value={value.endDate}
+	/>
+
+	<QuestionInput
+		type={QuestionType.TIMEZONE}
+		name="timezone"
+		content="Timezone (default: UTC/GMT)"
+		bind:value={value.timezone}
+	/>
+
+	<QuestionInput
+		type={QuestionType.BOOLEAN}
+		name="anonymized"
+		content="Anonymized"
+		bind:value={value.anonymized}
+	/>
+
+	<QuestionInput
+		type={QuestionType.BOOLEAN}
+		name="shuffled"
+		content="Shuffled"
+		bind:value={value.questions.shuffled}
+	/>
+
+	<QuestionListEditor bind:value={value.questions} />
+
+	<button type="submit">Submit</button>
+</form>
+
+<style>
+	form {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		margin: 0 auto;
+		max-width: 400px;
+	}
+</style>
diff --git a/src/lib/components/form_editor/question_input_editor/question_base_input.svelte b/src/lib/components/form_editor/question_input_editor/question_base_input.svelte
new file mode 100644
index 0000000..18b2f93
--- /dev/null
+++ b/src/lib/components/form_editor/question_input_editor/question_base_input.svelte
@@ -0,0 +1,30 @@
+<script lang="ts">
+	import type { QuestionBase } from '$lib/form';
+	import { QuestionType } from '$lib/form';
+	import QuestionInput from '$lib/components/question_input/question_input.svelte';
+
+	export let value: QuestionBase;
+</script>
+
+<input type="hidden" name="type" value={value.type} />
+
+<QuestionInput
+	type={QuestionType.TEXT}
+	name="name"
+	content="The unique identifier for the question."
+	bind:value={value.name}
+/>
+
+<QuestionInput
+	type={QuestionType.TEXTAREA}
+	name="content"
+	content="The markdown question content for the form field."
+	bind:value={value.content}
+/>
+
+<QuestionInput
+	type={QuestionType.BOOLEAN}
+	name="required"
+	content="Whether or not the form field is required."
+	bind:value={value.required}
+/>
diff --git a/src/lib/components/form/question_input_editor/question_input_editor.svelte b/src/lib/components/form_editor/question_input_editor/question_input_editor.svelte
similarity index 54%
rename from src/lib/components/form/question_input_editor/question_input_editor.svelte
rename to src/lib/components/form_editor/question_input_editor/question_input_editor.svelte
index 7de09ab..f40e9bf 100644
--- a/src/lib/components/form/question_input_editor/question_input_editor.svelte
+++ b/src/lib/components/form_editor/question_input_editor/question_input_editor.svelte
@@ -5,11 +5,7 @@
 	// export let value: Question;
 </script>
 
-<!-- <QuestionInput
-	data={{
-		type: value.type,
-		name: value.name,
-		content: value.content,
-		value: value.value
-	}}
-/> -->
+<!-- TODO: Reconcile changes made in
+https://github.com/acmcsufoss/form/pull/new/question-input-editor -->
+
+<!-- TODO: Make a new PR out of this current branch. -->
diff --git a/src/lib/components/form/question_list_editor/add_item.svelte b/src/lib/components/form_editor/question_list_editor/add_item.svelte
similarity index 93%
rename from src/lib/components/form/question_list_editor/add_item.svelte
rename to src/lib/components/form_editor/question_list_editor/add_item.svelte
index 4e4a77f..b52fea6 100644
--- a/src/lib/components/form/question_list_editor/add_item.svelte
+++ b/src/lib/components/form_editor/question_list_editor/add_item.svelte
@@ -10,6 +10,10 @@
 		// TODO: Add a helper function to create a blank question object for each type.
 		addAction({ type });
 	}
+
+	// function makeDefault(type: QuestionType): Question {
+	// 	switch...
+	// }
 </script>
 
 <select bind:value={type}>
diff --git a/src/lib/components/form/question_list_editor/delete_item.svelte b/src/lib/components/form_editor/question_list_editor/delete_item.svelte
similarity index 100%
rename from src/lib/components/form/question_list_editor/delete_item.svelte
rename to src/lib/components/form_editor/question_list_editor/delete_item.svelte
diff --git a/src/lib/components/form/question_list_editor/question_list_editor.svelte b/src/lib/components/form_editor/question_list_editor/question_list_editor.svelte
similarity index 62%
rename from src/lib/components/form/question_list_editor/question_list_editor.svelte
rename to src/lib/components/form_editor/question_list_editor/question_list_editor.svelte
index 1084c92..c3714d8 100644
--- a/src/lib/components/form/question_list_editor/question_list_editor.svelte
+++ b/src/lib/components/form_editor/question_list_editor/question_list_editor.svelte
@@ -2,8 +2,8 @@
 	import type { QuestionList } from '$lib/form';
 	import { QuestionType } from '$lib/form';
 	import ListInput from '$lib/components/list_input/list_input.svelte';
-	import QuestionInput from '$lib/components/form/question_input/question_input.svelte';
-	import QuestionInputEditor from '$lib/components/form/question_input_editor/question_input_editor.svelte';
+	import QuestionInput from '$lib/components/question_input/question_input.svelte';
+	import QuestionInputEditor from '$lib/components/form_editor/question_input_editor/question_input_editor.svelte';
 	import AddItem from './add_item.svelte';
 	import DeleteItem from './delete_item.svelte';
 
@@ -11,17 +11,16 @@
 </script>
 
 <QuestionInput
-	data={{
-		type: QuestionType.BOOLEAN,
-		name: 'shuffled',
-		content: 'Shuffled',
-		value: value.shuffled
-	}}
+	type={QuestionType.BOOLEAN}
+	name="shuffled"
+	content="Shuffled"
+	bind:value={value.shuffled}
 />
 
 <!-- TODO: Figure out how to handle indexed names for the items in the list if needed. -->
 
 <ListInput
+	bind:value={value.data}
 	components={{
 		item: QuestionInputEditor,
 		addItem: AddItem,
diff --git a/src/lib/components/list_input/list_input.svelte b/src/lib/components/list_input/list_input.svelte
index 3d6c963..c65a1f7 100644
--- a/src/lib/components/list_input/list_input.svelte
+++ b/src/lib/components/list_input/list_input.svelte
@@ -1,21 +1,22 @@
 <script lang="ts">
 	import type { ItemProps, Components } from './list_input.ts';
 
-	export let data: ItemProps[] = [];
 	export let components: Components;
+	export let value: ItemProps[] = [];
 
 	function deleteItem(i: number): void {
-		data.splice(i, 1);
-		// data = [...data];
+		value.splice(i, 1);
 	}
 
 	function addItem(item: ItemProps): void {
-		data.push(item);
+		value.push(item);
 	}
+
+	// TODO: Make sortable items.
 </script>
 
 <div>
-	{#each data as item, i}
+	{#each value as item, i}
 		<div>
 			<svelte:component this={components.item} {...item} />
 			<svelte:component this={components.deleteItem} deleteAction={() => deleteItem(i)} />
diff --git a/src/lib/components/list_input/list_input.ts b/src/lib/components/list_input/list_input.ts
index 3961731..259d0d0 100644
--- a/src/lib/components/list_input/list_input.ts
+++ b/src/lib/components/list_input/list_input.ts
@@ -1,6 +1,6 @@
 import type { ComponentType, SvelteComponent } from 'svelte';
 
-export type ItemProps = Record<string, unknown>;
+export type ItemProps = object;
 
 export interface AddItemProps {
 	addAction(item: ItemProps): void;
diff --git a/src/lib/components/question_input/question_input.svelte b/src/lib/components/question_input/question_input.svelte
new file mode 100644
index 0000000..e5bf2bd
--- /dev/null
+++ b/src/lib/components/question_input/question_input.svelte
@@ -0,0 +1,53 @@
+<script lang="ts">
+	import { QuestionType } from '$lib/form';
+	import AvailabilityQuestionInput from '$lib/components/questions/availability/availability_question_input.svelte';
+	import BooleanQuestionInput from '$lib/components/questions/boolean/boolean_question_input.svelte';
+	import ColorQuestionInput from '$lib/components/questions/color/color_question_input.svelte';
+	import DateQuestionInput from '$lib/components/questions/date/date_question_input.svelte';
+	import DatetimeQuestionInput from '$lib/components/questions/datetime/datetime_question_input.svelte';
+	import NumberQuestionInput from '$lib/components/questions/number/number_question_input.svelte';
+	import SingleTextSelectQuestionInput from '$lib/components/questions/radio_group/radio_group_question_input.svelte';
+	import TextQuestionInput from '$lib/components/questions/text/text_question_input.svelte';
+	import TextareaQuestionInput from '$lib/components/questions/textarea/textarea_question_input.svelte';
+	import TimeQuestionInput from '$lib/components/questions/time/time_question_input.svelte';
+	import SelectQuestionInput from '$lib/components/questions/select/select_question_input.svelte';
+</script>
+
+<div class="question">
+	{#if $$props.type === QuestionType.BOOLEAN}
+		<BooleanQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.TEXT}
+		<TextQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.RADIO_GROUP}
+		<SingleTextSelectQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.NUMBER}
+		<NumberQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.COLOR}
+		<ColorQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.TEXTAREA}
+		<TextareaQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.DATE}
+		<DateQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.AVAILABILITY}
+		<AvailabilityQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.DATETIME}
+		<DatetimeQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.TIME}
+		<TimeQuestionInput {...$$props} />
+	{:else if $$props.type === QuestionType.SELECT}
+		<SelectQuestionInput {...$$props} />
+	{/if}
+</div>
+
+<style>
+	.question {
+		padding: 20px 15px;
+		width: calc(100% - 30px);
+		margin: 10px auto;
+		background-color: #ffffff;
+		border-radius: 10px;
+		border-color: #c5c8c9;
+		border-width: 0;
+		border-style: solid;
+	}
+</style>
diff --git a/src/lib/components/question_input/question_inputs.svelte b/src/lib/components/question_input/question_inputs.svelte
new file mode 100644
index 0000000..2ff88a0
--- /dev/null
+++ b/src/lib/components/question_input/question_inputs.svelte
@@ -0,0 +1,12 @@
+<script lang="ts">
+	import type { Question } from '$lib/form';
+	import QuestionInput from './question_input.svelte';
+
+	export const data: Question[] = [];
+</script>
+
+{#each data as question (question.name)}
+	<QuestionInput {...question} />
+{:else}
+	<slot />
+{/each}
diff --git a/src/lib/components/form/questions/availability/availability_question_input.svelte b/src/lib/components/questions/availability/availability_question_input.svelte
similarity index 95%
rename from src/lib/components/form/questions/availability/availability_question_input.svelte
rename to src/lib/components/questions/availability/availability_question_input.svelte
index 4cc1571..7203350 100644
--- a/src/lib/components/form/questions/availability/availability_question_input.svelte
+++ b/src/lib/components/questions/availability/availability_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { AvailablityQuestion } from '$lib/form';
 
-	export let data: AvailablityQuestion;
+	const data = $$props as AvailablityQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/availability/availability_question_input_editor.svelte b/src/lib/components/questions/availability/availability_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/availability/availability_question_input_editor.svelte
rename to src/lib/components/questions/availability/availability_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/boolean/boolean_question_input.svelte b/src/lib/components/questions/boolean/boolean_question_input.svelte
similarity index 89%
rename from src/lib/components/form/questions/boolean/boolean_question_input.svelte
rename to src/lib/components/questions/boolean/boolean_question_input.svelte
index 7df0a8b..dd7c933 100644
--- a/src/lib/components/form/questions/boolean/boolean_question_input.svelte
+++ b/src/lib/components/questions/boolean/boolean_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { BooleanQuestion } from '$lib/form';
 
-	export let data: BooleanQuestion;
+	const data = $$props as BooleanQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/boolean/boolean_question_input_editor.svelte b/src/lib/components/questions/boolean/boolean_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/boolean/boolean_question_input_editor.svelte
rename to src/lib/components/questions/boolean/boolean_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/color/color_question_input.svelte b/src/lib/components/questions/color/color_question_input.svelte
similarity index 84%
rename from src/lib/components/form/questions/color/color_question_input.svelte
rename to src/lib/components/questions/color/color_question_input.svelte
index cdce196..427ef42 100644
--- a/src/lib/components/form/questions/color/color_question_input.svelte
+++ b/src/lib/components/questions/color/color_question_input.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
 	import type { ColorQuestion } from '$lib/form';
-	export let data: ColorQuestion;
+
+	const data = $$props as ColorQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/color/color_question_input_editor.svelte b/src/lib/components/questions/color/color_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/color/color_question_input_editor.svelte
rename to src/lib/components/questions/color/color_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/date/date_question_input.svelte b/src/lib/components/questions/date/date_question_input.svelte
similarity index 87%
rename from src/lib/components/form/questions/date/date_question_input.svelte
rename to src/lib/components/questions/date/date_question_input.svelte
index 1d3043b..89b66cd 100644
--- a/src/lib/components/form/questions/date/date_question_input.svelte
+++ b/src/lib/components/questions/date/date_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { DateQuestion } from '$lib/form';
 
-	export let data: DateQuestion;
+	const data = $$props as DateQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/date/date_question_input_editor.svelte b/src/lib/components/questions/date/date_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/date/date_question_input_editor.svelte
rename to src/lib/components/questions/date/date_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/datetime/datetime_question_imput.svelte b/src/lib/components/questions/datetime/datetime_question_input.svelte
similarity index 86%
rename from src/lib/components/form/questions/datetime/datetime_question_imput.svelte
rename to src/lib/components/questions/datetime/datetime_question_input.svelte
index a12dd94..49e0182 100644
--- a/src/lib/components/form/questions/datetime/datetime_question_imput.svelte
+++ b/src/lib/components/questions/datetime/datetime_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { DatetimeQuestion } from '$lib/form';
 
-	export let data: DatetimeQuestion;
+	const data = $$props as DatetimeQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/datetime/datetime_question_input_editor.svelte b/src/lib/components/questions/datetime/datetime_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/datetime/datetime_question_input_editor.svelte
rename to src/lib/components/questions/datetime/datetime_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/number/number_question_input.svelte b/src/lib/components/questions/number/number_question_input.svelte
similarity index 88%
rename from src/lib/components/form/questions/number/number_question_input.svelte
rename to src/lib/components/questions/number/number_question_input.svelte
index 69a2d9d..605ee60 100644
--- a/src/lib/components/form/questions/number/number_question_input.svelte
+++ b/src/lib/components/questions/number/number_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { NumberQuestion } from '$lib/form';
 
-	export let data: NumberQuestion;
+	const data = $$props as NumberQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/number/number_question_input_editor.svelte b/src/lib/components/questions/number/number_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/number/number_question_input_editor.svelte
rename to src/lib/components/questions/number/number_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/radio_group/radio_group_question_input.svelte b/src/lib/components/questions/radio_group/radio_group_question_input.svelte
similarity index 96%
rename from src/lib/components/form/questions/radio_group/radio_group_question_input.svelte
rename to src/lib/components/questions/radio_group/radio_group_question_input.svelte
index e38a33f..226fcb3 100644
--- a/src/lib/components/form/questions/radio_group/radio_group_question_input.svelte
+++ b/src/lib/components/questions/radio_group/radio_group_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { RadioGroupQuestion } from '$lib/form';
 
-	export let data: RadioGroupQuestion;
+	const data = $$props as RadioGroupQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/radio_group/radio_group_question_input_editor.svelte b/src/lib/components/questions/radio_group/radio_group_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/radio_group/radio_group_question_input_editor.svelte
rename to src/lib/components/questions/radio_group/radio_group_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/select/select_question_input.svelte b/src/lib/components/questions/select/select_question_input.svelte
similarity index 88%
rename from src/lib/components/form/questions/select/select_question_input.svelte
rename to src/lib/components/questions/select/select_question_input.svelte
index b618e2e..33ebf02 100644
--- a/src/lib/components/form/questions/select/select_question_input.svelte
+++ b/src/lib/components/questions/select/select_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { SelectQuestion } from '$lib/form';
 
-	export let data: SelectQuestion;
+	const data = $$props as SelectQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/select/select_question_input_editor.svelte b/src/lib/components/questions/select/select_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/select/select_question_input_editor.svelte
rename to src/lib/components/questions/select/select_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/text/text_question_input.svelte b/src/lib/components/questions/text/text_question_input.svelte
similarity index 94%
rename from src/lib/components/form/questions/text/text_question_input.svelte
rename to src/lib/components/questions/text/text_question_input.svelte
index d94e733..82e2538 100644
--- a/src/lib/components/form/questions/text/text_question_input.svelte
+++ b/src/lib/components/questions/text/text_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { TextQuestion } from '$lib/form';
 
-	export let data: TextQuestion;
+	const data = $$props as TextQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/text/text_question_input_editor.svelte b/src/lib/components/questions/text/text_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/text/text_question_input_editor.svelte
rename to src/lib/components/questions/text/text_question_input_editor.svelte
diff --git a/src/lib/components/questions/textarea/adjustable_textarea_height.ts b/src/lib/components/questions/textarea/adjustable_textarea_height.ts
new file mode 100644
index 0000000..0c4edf5
--- /dev/null
+++ b/src/lib/components/questions/textarea/adjustable_textarea_height.ts
@@ -0,0 +1,22 @@
+import type { Action } from 'svelte/action';
+
+/**
+ * adjustableTextareaHeight is a progressive enhancement for adjusting height
+ * of textarea.
+ *
+ * @see https://svelte.dev/docs/svelte-action
+ */
+export const adjustableTextareaHeight: Action = (node) => {
+	function handleInput() {
+		node.style.height = 'auto';
+		node.style.height = node.scrollHeight + 'px';
+	}
+
+	node.addEventListener('input', handleInput);
+
+	return {
+		destroy() {
+			node.removeEventListener('input', handleInput);
+		}
+	};
+};
diff --git a/src/lib/components/form/questions/textarea/textarea_question_input.svelte b/src/lib/components/questions/textarea/textarea_question_input.svelte
similarity index 58%
rename from src/lib/components/form/questions/textarea/textarea_question_input.svelte
rename to src/lib/components/questions/textarea/textarea_question_input.svelte
index d172100..898bd15 100644
--- a/src/lib/components/form/questions/textarea/textarea_question_input.svelte
+++ b/src/lib/components/questions/textarea/textarea_question_input.svelte
@@ -1,31 +1,14 @@
 <script lang="ts">
-	import type { Action } from 'svelte/action';
 	import type { TextareaQuestion } from '$lib/form';
+	import { adjustableTextareaHeight } from './adjustable_textarea_height';
 
-	export let data: TextareaQuestion;
-
-	// Progressive enhancement for adjusting height of textarea.
-	// https://svelte.dev/docs/svelte-action
-	const adjustTextareaHeight: Action = (node: HTMLElement) => {
-		function handleInput() {
-			node.style.height = 'auto';
-			node.style.height = node.scrollHeight + 'px';
-		}
-
-		node.addEventListener('input', handleInput);
-
-		return {
-			destroy() {
-				node.removeEventListener('input', handleInput);
-			}
-		};
-	};
+	const data = $$props as TextareaQuestion;
 </script>
 
 <fieldset>
 	<legend>{data.content}</legend>
 	<textarea
-		use:adjustTextareaHeight
+		use:adjustableTextareaHeight
 		name={data.name}
 		maxlength={data.maxLength}
 		minlength={data.minLength}
diff --git a/src/lib/components/form/questions/textarea/textarea_question_input_editor.svelte b/src/lib/components/questions/textarea/textarea_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/textarea/textarea_question_input_editor.svelte
rename to src/lib/components/questions/textarea/textarea_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/time/time_question_input.svelte b/src/lib/components/questions/time/time_question_input.svelte
similarity index 87%
rename from src/lib/components/form/questions/time/time_question_input.svelte
rename to src/lib/components/questions/time/time_question_input.svelte
index f3a32e5..32c8602 100644
--- a/src/lib/components/form/questions/time/time_question_input.svelte
+++ b/src/lib/components/questions/time/time_question_input.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { TimeQuestion } from '$lib/form';
 
-	export let data: TimeQuestion;
+	const data = $$props as TimeQuestion;
 </script>
 
 <fieldset>
diff --git a/src/lib/components/form/questions/time/time_question_input_editor.svelte b/src/lib/components/questions/time/time_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/time/time_question_input_editor.svelte
rename to src/lib/components/questions/time/time_question_input_editor.svelte
diff --git a/src/lib/components/form/questions/timezone/timezone_question_input.svelte b/src/lib/components/questions/timezone/timezone_question_input.svelte
similarity index 92%
rename from src/lib/components/form/questions/timezone/timezone_question_input.svelte
rename to src/lib/components/questions/timezone/timezone_question_input.svelte
index 20986c6..41e7254 100644
--- a/src/lib/components/form/questions/timezone/timezone_question_input.svelte
+++ b/src/lib/components/questions/timezone/timezone_question_input.svelte
@@ -2,7 +2,7 @@
 	import type { TimezoneQuestion } from '$lib/form';
 	import { TIMEZONES } from '$lib/timezones';
 
-	export let data: TimezoneQuestion;
+	const data = $$props as TimezoneQuestion;
 
 	let localTimezoneID = '';
 	if (Intl.DateTimeFormat) {
diff --git a/src/lib/components/form/questions/timezone/timezone_question_input_editor.svelte b/src/lib/components/questions/timezone/timezone_question_input_editor.svelte
similarity index 100%
rename from src/lib/components/form/questions/timezone/timezone_question_input_editor.svelte
rename to src/lib/components/questions/timezone/timezone_question_input_editor.svelte
diff --git a/src/lib/form/form.ts b/src/lib/form/form.ts
index 87db17c..225c65a 100644
--- a/src/lib/form/form.ts
+++ b/src/lib/form/form.ts
@@ -40,35 +40,20 @@ export interface Form {
 	questions: QuestionList;
 
 	/**
-	 * message is the Discord message that the form is linked to.
+	 * discordMessageID is the ID of the Discord message that the form is linked to (if any).
 	 */
-	message?: DiscordMessage;
+	discordMessageID?: ID;
 
 	/**
-	 * schedule is the schedule for the form.
-	 *
-	 * If undefined, the form is always open and immediately posted to Discord when created.
+	 * discordChannelID is the ID of the Discord channel that the message is in.
 	 */
-	schedule?: FormSchedule;
+	discordChannelID: ID;
 
 	/**
-	 * allowsMultipleSubmissions is whether or not the form allows multiple
-	 * submissions. Defaults to false.
+	 * discordThreadID is the ID of the Discord thread that the message is in.
 	 */
-	allowsMultipleSubmissions?: boolean;
+	discordThreadID?: ID;
 
-	/**
-	 * anonymized is whether or not the form's submissions are anonymized.
-	 *
-	 * Defaults to false.
-	 */
-	anonymized?: boolean;
-}
-
-/**
- * FormSchedule is the schedule for a form.
- */
-export interface FormSchedule {
 	/**
 	 * startDate is the start time for the form.
 	 *
@@ -87,28 +72,19 @@ export interface FormSchedule {
 	 * timezone is the timezone ID for the form. Defaults to UTC/GMT.
 	 */
 	timezone?: string;
-}
-
-/**
- * DiscordMessage is a Discord message.
- */
-export interface DiscordMessage {
-	/**
-	 * id is the ID of the Discord message that the form is linked to (if any).
-	 */
-	id?: ID;
 
 	/**
-	 * channelID is the ID of the Discord channel that the message is in.
+	 * allowsMultipleSubmissions is whether or not the form allows multiple
+	 * submissions. Defaults to false.
 	 */
-	channelID: ID;
+	allowsMultipleSubmissions?: boolean;
 
 	/**
-	 * threadID is the ID of the Discord thread that the message is in.
+	 * anonymized is whether or not the form's submissions are anonymized.
+	 *
+	 * Defaults to false.
 	 */
-	threadID?: ID;
-
-	// TODO: Add guild ID to target specific guild.
+	anonymized?: boolean;
 }
 
 /**
@@ -239,19 +215,28 @@ export interface RadioGroupQuestion extends QuestionBase {
 	choices: string[];
 
 	/**
-	 * customChoice is whether or not the form field has a custom choice.
+	 * allowCustomChoice is whether or not the form field has a custom choice.
+	 *
+	 * By default, custom choices are not allowed.
 	 */
-	allowCustomChoice: boolean;
+	allowCustomChoice?: boolean;
 
 	/**
-	 * choiceIndex is the value choice index for the question. A value of -1 for custom choice index.
+	 * choiceIndex is the value choice index for the question.
 	 */
 	choiceIndex?: number;
 
 	/**
-	 * DefaultCustomChoice is the value custom choice for the form field.
+	 * customChoice is the value custom choice for the form field.
+	 *
+	 * The custom choice is only used if allowCustomChoice is true.
 	 */
 	customChoice?: string;
+
+	/**
+	 * value is the default value for the question.
+	 */
+	value?: string;
 }
 
 export interface RadioGroupQuestionValue extends QuestionValueBase {
diff --git a/src/lib/form/submission.ts b/src/lib/form/submission.ts
index 8351b93..523e4b9 100644
--- a/src/lib/form/submission.ts
+++ b/src/lib/form/submission.ts
@@ -61,20 +61,7 @@ export function parse(formSchema: Form, formData: FormData): QuestionValue[] {
 			case QuestionType.TEXT:
 			case QuestionType.TEXTAREA:
 			case QuestionType.COLOR:
-			case QuestionType.RADIO_GROUP: {
-				const formValue = formData.get(question.name);
-				if (typeof formValue !== 'string') {
-					throw new Error('invalid form value');
-				}
-
-				data.push({
-					type: question.type,
-					name: question.name,
-					value: formValue
-				} satisfies TextQuestionValue | TextareaQuestionValue | ColorQuestionValue | RadioGroupQuestionValue);
-				break;
-			}
-
+			case QuestionType.RADIO_GROUP:
 			case QuestionType.DATE:
 			case QuestionType.TIME:
 			case QuestionType.DATETIME: {
@@ -87,7 +74,7 @@ export function parse(formSchema: Form, formData: FormData): QuestionValue[] {
 					type: question.type,
 					name: question.name,
 					value: formValue
-				} satisfies DateQuestionValue | TimeQuestionValue | DatetimeQuestionValue);
+				} satisfies TextQuestionValue | TextareaQuestionValue | ColorQuestionValue | RadioGroupQuestionValue | DateQuestionValue | TimeQuestionValue | DatetimeQuestionValue);
 				break;
 			}
 
diff --git a/src/routes/demo/demo_form.ts b/src/routes/demo/demo_form.ts
index 1df58ea..f9ad39e 100644
--- a/src/routes/demo/demo_form.ts
+++ b/src/routes/demo/demo_form.ts
@@ -3,6 +3,9 @@ import { QuestionType } from '$lib/form';
 
 export const demoForm: Form = {
 	id: 'demo_form_id',
+	discordChannelID: '',
+	startDate: '',
+	endDate: null,
 	questions: {
 		data: [
 			{
diff --git a/src/routes/forms/[form_id]/+page.svelte b/src/routes/forms/[form_id]/+page.svelte
index fe5d2b0..29cd523 100644
--- a/src/routes/forms/[form_id]/+page.svelte
+++ b/src/routes/forms/[form_id]/+page.svelte
@@ -1,13 +1,13 @@
 <!-- TODO: Editor page -->
 <script lang="ts">
 	import type { PageData } from './$types';
-	import FormEditor from '$lib/components/form/form_editor/form_editor.svelte';
+	import FormEditor from '$lib/components/form_editor/form_editor.svelte';
 
 	export let data: PageData;
 </script>
 
 {#if data.form}
-	<FormEditor action="" method="POST" data={data.form} />
+	<FormEditor action="" method="POST" value={data.form} />
 {:else}
 	<p>Form not found</p>
 {/if}
diff --git a/src/routes/forms/[form_id]/submissions/[submission_id]/+page.svelte b/src/routes/forms/[form_id]/submissions/[submission_id]/+page.svelte
index 94072ba..b2424b9 100644
--- a/src/routes/forms/[form_id]/submissions/[submission_id]/+page.svelte
+++ b/src/routes/forms/[form_id]/submissions/[submission_id]/+page.svelte
@@ -5,7 +5,6 @@
 </script>
 
 {#if data.submission}
-	<!-- <Submission data={data.submission} /> -->
 	<code>{'<Submission />'}</code>
 {:else}
 	<p>Submission not found</p>
diff --git a/src/routes/forms/new/+server.ts b/src/routes/forms/new/+server.ts
index 6ba4601..3a79906 100644
--- a/src/routes/forms/new/+server.ts
+++ b/src/routes/forms/new/+server.ts
@@ -19,6 +19,9 @@ export const GET: RequestHandler = async () => {
 async function createEmptyForm() {
 	return await s.createForm({
 		id: ulid(),
+		discordChannelID: '',
+		startDate: '',
+		endDate: null,
 		questions: {
 			shuffled: false,
 			data: []