Zod combinator that accepts a dynamic field name

Question

Zod combinator that accepts a dynamic field name

When converting XML to JSON, my library outputs {MyKey: T} for single-element lists and {MyKey: T[]} for multi-element lists. The equivalent TypeScript type is

type XmlJsonArray<T, element extends string> = Record<element, T | T[]>

. To implement this as a Zod schema, I have used the following code:

const XmlJsonArray = <T, element extends string>(element: element, schema: z.Schema<T>) => {
  // TODO what is the best practice here?
  const outerSchema: Record<element, z.Schema<T | T[]>> = {} as any;
  outerSchema[element] = z.union([schema, z.array(schema)]);
  return z.object(outerSchema);
};

Would it be possible to achieve this without resorting to using any?

typescript zod

Answer 1

Answer №1

From @username:

function JsonXmlObject = <Key extends string, Schema extends z.Schema<any>>(
  tag: Key,
  schema: Schema,
) => {
  return z.object({}).setKey(tag, z.union([schema, z.array(schema)]));
};

const data = JsonXmlObject('name', z.string());

The parsing is functioning correctly:

// both cases work
data.parse({ name: 'value' });
data.parse({ name: ['value'] });

Type inference is also successful:

Answer 2

From @username:

function JsonXmlObject = <Key extends string, Schema extends z.Schema<any>>(
  tag: Key,
  schema: Schema,
) => {
  return z.object({}).setKey(tag, z.union([schema, z.array(schema)]));
};

const data = JsonXmlObject('name', z.string());

The parsing is functioning correctly:

// both cases work
data.parse({ name: 'value' });
data.parse({ name: ['value'] });

Type inference is also successful:

Zod combinator that accepts a dynamic field name

Answer №1

Similar questions

The customer's status cannot be determined

Building a React Redux project template using Visual Studio 2019 and tackling some JavaScript challenges

Exploring Angular14: A guide to efficiently looping through the controls of strictly typed FormGroups

Issue regarding angularjs type definitions

Can you use the useCallback function within a nested callback function?

Can you explain the significance of using an exclamation mark after defining a variable in TypeScript?

Utilizing a single component for various purposes with diverse tags in react

Angular - How child components can communicate with their parent components

Using a nodejs module is causing an error in my code

Struggling to Decode Octet-stream Data in Angular 6 HttpClient: Encountering Parsing Failure with Error Prompt: "Failed to parse HTTP response for..."

Leveraging Angular 4 with Firebase to extract data from a database snapshot

Transfer the data stored in the ts variable to a JavaScript file

Ensuring Type Compatibility Between Classes and Object Literals in TypeScript

Insert data into Typeorm even if it already exists

Learn how to effortlessly move a file into a drag-and-drop area on a web page with Playwright

What is the process for importing a TypeScript module from the local directory?

Exploring the integration of LeafLet into Next JS 13 for interactive mapping

Is there a more efficient method to tally specific elements in a sparse array?

creating a JSON array within a function

What steps can I take to troubleshoot and repair my accordion feature within an Angular project?