Serialize/Deserialize zod objects

[hollandThomas]

Hey y'all,

is it possible to de-/serialize zod objects?

Our use case is to dynamically generate forms with Remix and Remix Forms. I'm thinking of something along these lines

import { z } from 'zod';
import { json, useLoaderData, ActionFunction, LoaderFunction } from '@remix-run/node';
import { makeDomainFunction } from 'remix-domains';
import { formAction, Form } from 'remix-forms';

const formSchema = z.object({
  firstName: z.string().nonempty(),
  email: z.string().nonempty().email(),
  howYouFoundOutAboutUs: z.enum(['fromAFriend', 'google']),
});

export const loader: LoaderFunction = async ({ request }) =>
  json({ formSchema: formSchema.serialize() }); // proposed API for serializing schemas into a string

const mutation = makeDomainFunction(schema)(async (values) => value);
export const action: ActionFunction = async ({ request }) =>
  formAction({
    request,
    schema,
    mutation,
    successPath: '/success',
  });

export default () => {
  const { formSchema } = useLoaderData();

  return <Form schema={z.deserialize(formSchema)} />; // proposed API for deserializing strings into a Zod schema
};

Are there any alternatives I'm missing? I found zod-to-json-schema and json-schema-to-zod, just that those don't really deserialize but write zod objects to files. We thought about using eval on those but that seems way too hacky.

[jlalmes]

I have implemented a custom solution based off this: https://kitchen-sink.trpc.io/react-hook-form