Added cardinality inference for SuperStruct.

Author: ciscoheat

src/lib/index.ts

@@ -93,7 +93,13 @@ type SuperStruct<T extends AnyZodObject, Data> = Partial<{
       ? SuperStruct<IntersectUnion<UnwrappedEntity<T>>, Data>
       : UnwrappedRawShape<T, Property> extends AnyZodObject
       ? SuperStruct<UnwrappedRawShape<T, Property>, Data>
-      : UnwrappedRawShape<T, Property> extends ZodArray<infer A>
+      : UnwrappedRawShape<T, Property> extends ZodArray<
+          infer A,
+          // Need to infer Cardinality for extend to work correctly, even though it's unused.
+          // (nonempty changes the cardinality of arrays in the schema)
+          // eslint-disable-next-line @typescript-eslint/no-unused-vars
+          infer Cardinality
+        >
       ? UnwrappedEntity<A> extends ZodUnion<ZodUnionOptions>
         ? SuperStruct<IntersectUnion<UnwrappedEntity<A>>, Data>
         : UnwrappedEntity<A> extends AnyZodObject

src/routes/tests/array-level-error-2/+page.server.ts

@@ -0,0 +1,60 @@
+import { superValidate, message, setError } from '$lib/server';
+import { fail } from '@sveltejs/kit';
+import { z } from 'zod';
+
+import type { Actions, PageServerLoad } from './$types';
+
+/*
+type FormType = {
+	name: any;
+	email: any;
+	days: any;
+};
+*/
+
+const raw = {
+  name: z.string().min(1),
+  email: z.string().email(),
+  days: z.number().min(0).max(6).array().nonempty()
+};
+
+type FormTypeOk = typeof raw;
+
+type FormType = {
+  name: any;
+  email: any;
+  days: z.ZodArray<z.ZodNumber, 'atleastone'>;
+};
+
+const schema = z.object<FormType>({
+  name: z.string().min(1),
+  email: z.string().email(),
+  days: z.number().min(0).max(6).array().nonempty()
+});
+
+///// Load function /////
+
+export const load: PageServerLoad = async () => {
+  const form = await superValidate(schema);
+  return { form };
+};
+
+///// Form actions /////
+
+export const actions: Actions = {
+  default: async ({ request }) => {
+    const form = await superValidate(request, schema);
+
+    const data = form.data;
+
+    if (!data.days?.length) {
+      setError(form, 'days._errors', 'You have to select at least one day!');
+    }
+
+    console.log('POST', form);
+
+    if (!form.valid) return fail(400, { form });
+
+    return message(form, 'Form posted successfully!');
+  }
+};

src/routes/tests/array-level-error-2/+page.svelte

@@ -0,0 +1,126 @@
+<script lang="ts">
+  import { page } from '$app/stores';
+  import { superForm } from '$lib/client';
+  import SuperDebug from '$lib/client/SuperDebug.svelte';
+
+  export let data;
+
+  const Days = [
+    'Saturday',
+    'Sunday',
+    'Monday',
+    'Tuesday',
+    'Wednesday',
+    'Thursday',
+    'Friday'
+  ];
+
+  const { form, errors, message, constraints, enhance } = superForm(
+    data.form
+  );
+</script>
+
+<SuperDebug data={$form} />
+
+<h3>Superforms testing ground</h3>
+
+{#if $message}
+  <div
+    class="status"
+    class:error={$page.status >= 400}
+    class:success={$page.status == 200}
+  >
+    {$message}
+  </div>
+{/if}
+
+<form method="POST" use:enhance>
+  <label>
+    Name<br />
+    <input
+      name="name"
+      aria-invalid={$errors.name ? 'true' : undefined}
+      bind:value={$form.name}
+    />
+    {#if $errors.name}<span class="invalid">{$errors.name}</span>{/if}
+  </label>
+
+  <label>
+    Email<br />
+    <input
+      name="email"
+      type="email"
+      aria-invalid={$errors.email ? 'true' : undefined}
+      bind:value={$form.email}
+    />
+    {#if $errors.email}<span class="invalid">{$errors.email}</span>{/if}
+  </label>
+
+  <div class="checkboxes">
+    {#each Days as day, i}
+      <div class="checkbox">
+        <input
+          id="wday-{i}"
+          type="checkbox"
+          name="days"
+          value={i}
+          bind:group={$form.days}
+          class="w-4 h-4 text-skin-accent bg-skin-fg rounded focus:ring-skin-accent focus:ring-2 cursor-pointer"
+        />
+        <label for="wday-{i}" class="ml-2 text-sm font-medium cursor-pointer"
+          >{day}</label
+        >
+      </div>
+    {/each}
+  </div>
+  <p class="invalid">{$errors.days?._errors || 'No error'}</p>
+  <button>Submit</button>
+</form>
+
+<hr />
+<p>
+  <a target="_blank" href="https://superforms.rocks/api">API Reference</a>
+</p>
+
+<style>
+  .invalid {
+    color: red;
+  }
+
+  .status {
+    color: white;
+    padding: 4px;
+    padding-left: 8px;
+    border-radius: 2px;
+    font-weight: 500;
+  }
+
+  .status.success {
+    background-color: seagreen;
+  }
+
+  .status.error {
+    background-color: #ff2a02;
+  }
+
+  input {
+    background-color: #ddd;
+  }
+
+  a {
+    text-decoration: underline;
+  }
+
+  hr {
+    margin-top: 4rem;
+  }
+
+  form {
+    padding-top: 1rem;
+    padding-bottom: 1rem;
+  }
+  .checkboxes,
+  .checkbox {
+    display: flex;
+  }
+</style>