Union component test

Author: ciscoheat

src/routes/(v2)/v2/union-component/+page.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+	import Union from './union.svelte';
+	import { superForm as _superForm } from '$lib/index.js';
+	import type { UnionSchema } from './schemas.js';
+
+	export let data;
+
+	const superForm = _superForm<UnionSchema>(data.form);
+</script>
+
+<Union {superForm} />

src/routes/(v2)/v2/union-component/+page.ts

@@ -0,0 +1,9 @@
+import { zod } from '$lib/adapters/zod.js';
+import { superValidate } from '$lib/index.js';
+import { schema } from './schemas.js';
+
+export const load = async () => {
+	const form = await superValidate(zod(schema));
+
+	return { form };
+};

src/routes/(v2)/v2/union-component/global.css

@@ -0,0 +1,51 @@
+:root {
+	--sk-back-h: 206;
+	--sk-back-3-hsl: ;
+	--sk-back-1: hsl(0, 0%, 100%);
+	--sk-back-2: hsl(0, 0%, 100%);
+	--sk-back-3: hsl(206, 64%, 98%);
+	--sk-back-4: hsl(206, 44%, 93%);
+	--sk-back-5: hsl(206, 20%, 80%);
+	--sk-text-1: hsl(0, 0%, 13%);
+	--sk-text-2: hsl(0, 0%, 27%);
+	--sk-text-3: hsl(240, 8%, 44%);
+	--sk-theme-1: hsl(15, 100%, 55%);
+	--sk-theme-2: hsl(240, 8%, 44%);
+	--sk-theme-3: hsl(204, 100%, 63%);
+	--sk-font: 'Overpass', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
+		Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
+	--sk-font-mono: 'Fira Mono', monospace;
+}
+
+body {
+	background-color: var(--sk-back-3);
+	color: var(--sk-text-1);
+	margin: 0.75em;
+	font-family: var(--sk-font);
+	accent-color: var(--sk-theme-1);
+}
+
+@media (prefers-color-scheme: dark) {
+	:root {
+		--sk-back-1: hsl(0, 0%, 10%);
+		--sk-back-2: hsl(0, 0%, 18%);
+		--sk-back-3: hsl(0, 0%, 14%);
+		--sk-back-4: hsl(0, 0%, 22%);
+		--sk-back-5: hsl(0, 0%, 40%);
+		--sk-text-1: hsl(0, 0%, 90%);
+		--sk-text-2: hsl(0, 0%, 80%);
+		--sk-text-3: hsl(0, 0%, 65%);
+	}
+
+	body {
+		color-scheme: dark;
+	}
+
+	a {
+		color: var(--sk-theme-3);
+	}
+
+	a:visited {
+		color: hsl(267, 100%, 75%);
+	}
+}

src/routes/(v2)/v2/union-component/input.svelte

@@ -0,0 +1,13 @@
+<script lang="ts" context="module">
+	type T = Record<string, unknown>;
+</script>
+
+<script lang="ts" generics="T extends Record<string, unknown>">
+	import type { FormPathLeaves, SuperForm } from '$lib/index.js';
+
+	export let superForm: SuperForm<T>;
+	export let field: FormPathLeaves<T>;
+</script>
+
+<p>{superForm.isTainted()}</p>
+<p>{field}</p>

src/routes/(v2)/v2/union-component/schemas.ts

@@ -0,0 +1,23 @@
+import type { Infer } from '$lib/index.js';
+import { z } from 'zod';
+
+export const eventSchema = z.object({
+	name: z.string(),
+	desc: z.string().nullable()
+});
+
+export const eventTemplateSchema = z.object({
+	name: z.string(),
+	id: z.string()
+});
+
+export const admissionSchema = z.object({
+	name: z.string()
+});
+
+export const schema = z.union([eventTemplateSchema, eventSchema, admissionSchema]);
+
+export type UnionSchema =
+	| Infer<typeof eventSchema>
+	| Infer<typeof admissionSchema>
+	| Infer<typeof eventTemplateSchema>;

src/routes/(v2)/v2/union-component/union.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+	import type { SuperForm } from '$lib/index.js';
+	import { type UnionSchema } from './schemas.js';
+	import Input from './input.svelte';
+
+	export let superForm: SuperForm<UnionSchema>;
+</script>
+
+{superForm.isTainted()}
+
+<Input {superForm} field="name" />

src/routes/(v2)/v2/union-component/union2.svelte

@@ -0,0 +1,13 @@
+<script lang="ts" context="module">
+	type T = { name: string };
+</script>
+
+<script lang="ts" generics="T extends { name: string }">
+	import type { SuperForm } from '$lib/index.js';
+	//import type { admissionSchema, eventTemplateSchema, eventSchema } from './schemas.js';
+	import Input from './input.svelte';
+
+	export let superForm: SuperForm<T>;
+</script>
+
+<Input {superForm} field="name" />