let's try this out

huntabyte · Mar 9, 2024 · b6108f9 · b6108f9
1 parent 8c76bcf
commit b6108f9
Show file tree

Hide file tree

Showing 20 changed files with 57 additions and 60 deletions.
diff --git a/apps/www/src/lib/registry/default/example/checkbox-form-multiple.svelte b/apps/www/src/lib/registry/default/example/checkbox-form-multiple.svelte
@@ -70,7 +70,7 @@
 	}
 </script>
 
-<form action="/docs?/checkboxMultiple" method="POST" class="space-y-8" use:enhance>
+<form action="/?/checkboxMultiple" method="POST" class="space-y-8" use:enhance>
 	<Form.Fieldset {form} name="items" class="space-y-0">
 		<div class="mb-4">
 			<Form.Legend class="text-base">Sidebar</Form.Legend>

diff --git a/apps/www/src/lib/registry/default/example/checkbox-form-single.svelte b/apps/www/src/lib/registry/default/example/checkbox-form-single.svelte
@@ -31,7 +31,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form action="/docs?/checkboxSingle" method="POST" class="space-y-6" use:enhance>
+<form action="/?/checkboxSingle" method="POST" class="space-y-6" use:enhance>
 	<Form.Field
 		{form}
 		name="mobile"

diff --git a/apps/www/src/lib/registry/default/example/combobox-form.svelte b/apps/www/src/lib/registry/default/example/combobox-form.svelte
@@ -67,7 +67,7 @@
 	}
 </script>
 
-<form method="POST" action="/docs?/combobox" class="space-y-6" use:enhance>
+<form method="POST" action="/?/combobox" class="space-y-6" use:enhance>
 	<Form.Field {form} name="language" class="flex flex-col">
 		<Popover.Root bind:open let:ids>
 			<Form.Control let:attrs>

diff --git a/apps/www/src/lib/registry/default/example/date-picker-form.svelte b/apps/www/src/lib/registry/default/example/date-picker-form.svelte
@@ -57,7 +57,7 @@
 	let placeholder: DateValue = today(getLocalTimeZone());
 </script>
 
-<form method="POST" action="/docs?/datePicker" class="space-y-8" use:enhance>
+<form method="POST" action="/?/datePicker" class="space-y-8" use:enhance>
 	<Form.Field {form} name="dob" class="flex flex-col">
 		<Form.Control let:attrs>
 			<Form.Label>Date of birth</Form.Label>

diff --git a/apps/www/src/lib/registry/default/example/form-demo.svelte b/apps/www/src/lib/registry/default/example/form-demo.svelte
@@ -31,7 +31,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form action="/docs?/username" method="POST" class="w-2/3 space-y-6" use:enhance>
+<form action="/?/username" method="POST" class="w-2/3 space-y-6" use:enhance>
 	<Form.Field {form} name="username">
 		<Form.Control let:attrs>
 			<Form.Label>Username</Form.Label>

diff --git a/apps/www/src/lib/registry/default/example/radio-group-form.svelte b/apps/www/src/lib/registry/default/example/radio-group-form.svelte
@@ -35,7 +35,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form method="POST" action="/docs?/radioGroup" class="w-2/3 space-y-6" use:enhance>
+<form method="POST" action="/?/radioGroup" class="w-2/3 space-y-6" use:enhance>
 	<Form.Fieldset {form} name="type" class="space-y-3">
 		<Form.Legend>Notify me about...</Form.Legend>
 		<RadioGroup.Root bind:value={$formData.type} class="flex flex-col space-y-1">

diff --git a/apps/www/src/lib/registry/default/example/select-form.svelte b/apps/www/src/lib/registry/default/example/select-form.svelte
@@ -40,7 +40,7 @@
 		: undefined;
 </script>
 
-<form method="POST" action="/docs?/select" class="w-2/3 space-y-6" use:enhance>
+<form method="POST" action="/?/select" class="w-2/3 space-y-6" use:enhance>
 	<Form.Field {form} name="email">
 		<Form.Control let:attrs>
 			<Form.Label>Email</Form.Label>

diff --git a/apps/www/src/lib/registry/default/example/switch-form.svelte b/apps/www/src/lib/registry/default/example/switch-form.svelte
@@ -32,7 +32,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form method="POST" action="/docs?/switch" class="w-full space-y-6" use:enhance>
+<form method="POST" action="/?/switch" class="w-full space-y-6" use:enhance>
 	<fieldset>
 		<legend class="mb-4 text-lg font-medium"> Email Notifications </legend>
 		<div class="space-y-4">

diff --git a/apps/www/src/lib/registry/default/example/textarea-form.svelte b/apps/www/src/lib/registry/default/example/textarea-form.svelte
@@ -35,7 +35,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form method="POST" action="/docs?/textarea" class="w-2/3 space-y-6" use:enhance>
+<form method="POST" action="/?/textarea" class="w-2/3 space-y-6" use:enhance>
 	<Form.Field {form} name="bio">
 		<Form.Control let:attrs>
 			<Form.Label>Bio</Form.Label>

diff --git a/apps/www/src/lib/registry/new-york/example/checkbox-form-multiple.svelte b/apps/www/src/lib/registry/new-york/example/checkbox-form-multiple.svelte
@@ -69,7 +69,7 @@
 	}
 </script>
 
-<form action="/docs?/checkboxMultiple" method="POST" class="space-y-8" use:enhance>
+<form action="/?/checkboxMultiple" method="POST" class="space-y-8" use:enhance>
 	<Form.Fieldset {form} name="items" class="space-y-0">
 		<div class="mb-4">
 			<Form.Legend class="text-base">Sidebar</Form.Legend>

diff --git a/apps/www/src/lib/registry/new-york/example/checkbox-form-single.svelte b/apps/www/src/lib/registry/new-york/example/checkbox-form-single.svelte
@@ -31,7 +31,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form action="/docs?/checkboxSingle" method="POST" class="space-y-6" use:enhance>
+<form action="/?/checkboxSingle" method="POST" class="space-y-6" use:enhance>
 	<Form.Field
 		{form}
 		name="mobile"

diff --git a/apps/www/src/lib/registry/new-york/example/combobox-form.svelte b/apps/www/src/lib/registry/new-york/example/combobox-form.svelte
@@ -67,7 +67,7 @@
 	}
 </script>
 
-<form method="POST" action="/docs?/combobox" class="space-y-6" use:enhance>
+<form method="POST" action="/?/combobox" class="space-y-6" use:enhance>
 	<Form.Field {form} name="language" class="flex flex-col">
 		<Popover.Root bind:open let:ids>
 			<Form.Control let:attrs>

diff --git a/apps/www/src/lib/registry/new-york/example/date-picker-form.svelte b/apps/www/src/lib/registry/new-york/example/date-picker-form.svelte
@@ -57,7 +57,7 @@
 	let placeholder: DateValue = today(getLocalTimeZone());
 </script>
 
-<form method="POST" action="/docs?/datePicker" class="space-y-8" use:enhance>
+<form method="POST" action="/?/datePicker" class="space-y-8" use:enhance>
 	<Form.Field {form} name="dob" class="flex flex-col">
 		<Form.Control let:attrs>
 			<Form.Label>Date of birth</Form.Label>

diff --git a/apps/www/src/lib/registry/new-york/example/form-demo.svelte b/apps/www/src/lib/registry/new-york/example/form-demo.svelte
@@ -32,7 +32,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form action="/docs?/username" method="POST" class="w-2/3 space-y-6" use:enhance>
+<form action="/?/username" method="POST" class="w-2/3 space-y-6" use:enhance>
 	<Form.Field {form} name="username">
 		<Form.Control let:attrs>
 			<Form.Label>Username</Form.Label>

diff --git a/apps/www/src/lib/registry/new-york/example/radio-group-form.svelte b/apps/www/src/lib/registry/new-york/example/radio-group-form.svelte
@@ -35,7 +35,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form method="POST" action="/docs?/radioGroup" class="w-2/3 space-y-6" use:enhance>
+<form method="POST" action="/?/radioGroup" class="w-2/3 space-y-6" use:enhance>
 	<Form.Fieldset {form} name="type" class="space-y-3">
 		<Form.Legend>Notify me about...</Form.Legend>
 		<RadioGroup.Root bind:value={$formData.type} class="flex flex-col space-y-1">

diff --git a/apps/www/src/lib/registry/new-york/example/select-form.svelte b/apps/www/src/lib/registry/new-york/example/select-form.svelte
@@ -40,7 +40,7 @@
 		: undefined;
 </script>
 
-<form method="POST" action="/docs?/select" class="w-2/3 space-y-6" use:enhance>
+<form method="POST" action="/?/select" class="w-2/3 space-y-6" use:enhance>
 	<Form.Field {form} name="email">
 		<Form.Control let:attrs>
 			<Form.Label>Email</Form.Label>

diff --git a/apps/www/src/lib/registry/new-york/example/switch-form.svelte b/apps/www/src/lib/registry/new-york/example/switch-form.svelte
@@ -32,7 +32,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form method="POST" action="/docs?/switch" class="w-full space-y-6" use:enhance>
+<form method="POST" action="/?/switch" class="w-full space-y-6" use:enhance>
 	<fieldset>
 		<legend class="mb-4 text-lg font-medium"> Email Notifications </legend>
 		<div class="space-y-4">

diff --git a/apps/www/src/lib/registry/new-york/example/textarea-form.svelte b/apps/www/src/lib/registry/new-york/example/textarea-form.svelte
@@ -35,7 +35,7 @@
 	const { form: formData, enhance } = form;
 </script>
 
-<form method="POST" action="/docs?/textarea" class="w-2/3 space-y-6" use:enhance>
+<form method="POST" action="/?/textarea" class="w-2/3 space-y-6" use:enhance>
 	<Form.Field {form} name="bio">
 		<Form.Control let:attrs>
 			<Form.Label>Bio</Form.Label>

diff --git a/apps/www/src/routes/+page.server.ts b/apps/www/src/routes/+page.server.ts
@@ -1,4 +1,42 @@
-import type { PageServerLoad } from "./$types.js";
+import { fail } from "@sveltejs/kit";
+import { zod } from "sveltekit-superforms/adapters";
+import { superValidate } from "sveltekit-superforms";
+import type { Actions, RequestEvent, PageServerLoad } from "./$types.js";
+import type { AnyZodObject } from "zod";
+
+import { formSchema } from "$lib/registry/default/example/form-demo.svelte";
+import { formSchema as checkboxSingleSchema } from "$lib/registry/default/example/checkbox-form-single.svelte";
+import { formSchema as radioGroupSchema } from "$lib/registry/default/example/radio-group-form.svelte";
+import { formSchema as selectSchema } from "$lib/registry/default/example/select-form.svelte";
+import { formSchema as switchSchema } from "$lib/registry/default/example/switch-form.svelte";
+import { formSchema as textareaSchema } from "$lib/registry/default/example/textarea-form.svelte";
+import { formSchema as comboboxFormSchema } from "$lib/registry/default/example/combobox-form.svelte";
+import { formSchema as datePickerFormSchema } from "$lib/registry/default/example/date-picker-form.svelte";
+import { formSchema as checkboxMultipleSchema } from "$lib/registry/default/example/checkbox-form-multiple.svelte";
+
+export const actions: Actions = {
+	username: async (e) => handleForm(e, formSchema),
+	checkboxSingle: async (e) => handleForm(e, checkboxSingleSchema),
+	checkboxMultiple: async (e) => handleForm(e, checkboxMultipleSchema),
+	radioGroup: async (e) => handleForm(e, radioGroupSchema),
+	select: async (e) => handleForm(e, selectSchema),
+	switch: async (e) => handleForm(e, switchSchema),
+	textarea: async (e) => handleForm(e, textareaSchema),
+	combobox: async (e) => handleForm(e, comboboxFormSchema),
+	datePicker: async (e) => handleForm(e, datePickerFormSchema),
+};
+
+async function handleForm(event: RequestEvent, schema: AnyZodObject) {
+	const form = await superValidate(event, zod(schema));
+	if (!form.valid) {
+		return fail(400, {
+			form,
+		});
+	}
+	return {
+		form,
+	};
+}
 
 export const load: PageServerLoad = async (event) => {
 	const layoutCookie = event.cookies.get("PaneForge:layout");

diff --git a/apps/www/src/routes/docs/+page.server.ts b/apps/www/src/routes/docs/+page.server.ts