Yup

Object schemas can provide default values for their fields using .default(). Calling .default() on the schema itself builds out the object shape and fills in all defaults for the entire nested structure.

Warning on Nested Objects: If a nested object is optional but contains non-optional fields, validation might fail unexpectedly because Yup casts the input before validating. To avoid this, either set the nested default to undefined or mark it as nullable() and default to null.

let schema = object({
  name: string().default(''),
});

schema.default(); // -> { name: '' }

// To avoid unexpected validation failures in nested objects:
let safeSchema = object({
  id: string().required(),
  names: object({
    first: string().required(),
  }).default(undefined), // Option 1: Set default to undefined
  // OR
  // names: object({ first: string().required() }).nullable().default(null), // Option 2
});

To create an entirely new schema type, inherit from an existing schema class (e.g., DateSchema, StringSchema) rather than the abstract Schema class.

Guidelines for extending schemas:

• Immutability: Never mutate an existing schema instance. Always use .clone() to create a new instance before applying mutations. Built-in methods like .test() and .transform() handle cloning automatically.
• Transforms: Transforms should never mutate the input value. If a value is invalid, return an invalid object (like NaN or InvalidDate) instead of null.
• Type Safety: By the time validations run, the value is guaranteed to be the correct type, though it may still be null or undefined.

import { DateSchema } from 'yup';

class MomentDateSchema extends DateSchema {
  static create() {
    return MomentDateSchema();
  }

  constructor() {
    super();
    this._validFormats = [];

    this.withMutation(() => {
      this.transform(function (value, originalValue) {
        if (this.isType(value))
          // we have a valid value
          return value;
        return Moment(originalValue, this._validFormats, true);
      });
    });
  }

  _typeCheck(value) {
    return (
      super._typeCheck(value) || (moment.isMoment(value) && value.isValid())
    );
  }

  format(formats) {
    if (!formats) throw new Error('must enter a valid format');
    let next = this.clone();
    next._validFormats = {}.concat(formats);
    return next;
  }
}

let schema = new MomentDateSchema();

schema.format('YYYY-MM-DD').cast('It is 2012-05-25'); // => Fri May 25 2012 00:00:00 GMT-0400 (Eastern Daylight Time)

Yup is a schema builder used for runtime value parsing and validation. You can define a schema to transform values to match a specific shape, assert the validity of existing values, or both.

Schemas are built by chaining methods together. They consist of two main components:

1. Parsing actions (transforms): Coercing or casting values into the correct type.
2. Assertions (tests): Validating that the value meets specific criteria.

Key features include:

• Powerful TypeScript support via InferType to derive static types from schemas.
• Built-in async validation support.
• Extensibility for custom type-safe methods.
• Compatibility with Standard Schema.

import { object, string, number, date, InferType } from 'yup';

let userSchema = object({
  name: string().required(),
  age: number().required().positive().integer(),
  email: string().email(),
  website: string().url().nullable(),
  createdOn: date().default(() => new Date()),
});

// parse and assert validity
let user = await userSchema.validate(await fetchUser());

type User = InferType<typeof userSchema>;

Yup implements the Standard Schema specification, allowing it to interoperate with other tools that support this common interface. A StandardSchema object provides a ~standard property containing metadata and a validate method.

StandardSchema Interface

• version: Must be 1.
• vendor: A string identifying the implementation (e.g., yup).
• validate(value: unknown): An async or sync function that returns a StandardResult.
• types?: Optional metadata describing the input and output types.

StandardResult Types

• StandardSuccessResult: Contains the validated value.
• StandardFailureResult: Contains an array of issues.

StandardIssue Structure

Each issue includes:

• message: A string describing the error.
• path?: An array of PropertyKey or StandardPathSegment indicating where the error occurred.

For multi-language support, setLocale can accept functions that return objects containing translation keys and values. These objects can then be passed to an i18n library like i18next.

import { setLocale } from 'yup';

setLocale({
  mixed: {
    default: 'field_invalid',
  },
  number: {
    min: ({ min }) => ({ key: 'field_too_short', values: { min } }),
    max: ({ max }) => ({ key: 'field_too_big', values: { max } }),
  },
});

let schema = yup.object().shape({
  name: yup.string(),
});

try {
  await schema.validate({ name: 'jimmy' });
} catch (err) {
  // Map error keys to your i18n library
  const messages = err.errors.map((err) => i18next.t(err.key, err.values));
}

import { setLocale } from 'yup';

setLocale({
  // use constant translation keys for messages without values
  mixed: {
    default: 'field_invalid',
  },
  // use functions to generate an error object that includes the value from the schema
  number: {
    min: ({ min }) => ({ key: 'field_too_short', values: { min } }),
    max: ({ max }) => ({ key: 'field_too_big', values: { max } }),
  },
});

// ...
let schema = yup.object().shape({
  name: yup.string(),
});

try {
  await schema.validate({ name: 'jimmy', age: 11 });
} catch (err) {
  messages = err.errors.map((err) => i18next.t(err.key));
}