A complete iso validation function

[sillvva]

Notes:

• The date regex here also validates the correct number of days in a month, including leap year.
• seconds and milliseconds are optional. seconds must be true for milliseconds to be validated.
• T is optional if date is not validated.
• Time zone is optional, and accepts Z or a UTC offset (ex. +/-hh:mm)

import type { PipeResult } from "valibot";

/**
 * Creates a complete, customizable validation function that validates a datetime.
 *
 * The correct number of days in a month is validated, including leap year.
 *
 * Date Format: yyyy-mm-dd
 * Time Formats: [T]hh:mm[:ss[.sss]][+/-hh:mm] or [T]hh:mm[:ss[.sss]][Z]
 *
 * @param {Object} options The configuration options.
 * @param {boolean} options.date Whether to validate the date.
 * @param {boolean} options.time Whether to validate the time.
 * @param {boolean | "optional"} options.seconds Whether to validate the seconds.
 * @param {boolean | "optional"} options.milliseconds Whether to validate the milliseconds.
 * @param {boolean | "optional"} options.timezone Whether to validate the timezone.
 * @param {string} error The error message.
 *
 * @returns A validation function.
 */
export function iso<TInput extends string>(options?: {
	date?: boolean;
	time?: boolean;
	seconds?: boolean | "optional";
	milliseconds?: boolean | "optional";
	timezone?: boolean | "optional";
	error?: string;
}) {
	return (input: TInput): PipeResult<TInput> => {
		// override default date and time options to true if options is undefined
		const {
			date = true,
			time = true,
			seconds = "optional",
			milliseconds = "optional",
			timezone = "optional",
			error = "Invalid ISO string"
		} = options || {};

		const dateRegex = `((\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-((0[13578]|1[02])-(0[1-9]|[12]\\d|3[01])|(0[469]|11)-(0[1-9]|[12]\\d|30)|(02)-(0[1-9]|1\\d|2[0-8])))`;
		const millisecondsRegex = milliseconds ? `(\\.\\d{3})${milliseconds === "optional" ? "?" : ""}` : "";
		const secondsRegex = seconds ? `(:[0-5]\\d${millisecondsRegex})${seconds === "optional" ? "?" : ""}` : "";
		const timezoneRegex = timezone ? `([+-]([01]\\d|2[0-3]):[0-5]\\d|Z)${timezone === "optional" ? "?" : ""}` : "";
		const timeRegex = `([01]\\d|2[0-3]):[0-5]\\d${secondsRegex}${timezoneRegex}`;
		const regex = new RegExp(`^${date ? dateRegex : ""}${date && time ? "T" : time ? "T?" : ""}${time ? timeRegex : ""}$`);

		if (!regex.test(input)) {
			return {
				issue: {
					validation: "iso",
					message: error,
					input
				}
			};
		}
		return { output: input };
	};
}

[sillvva]

Some examples of valid strings:

"2023-08-05T12:24:59.000Z" // options undefined
"2023-08-05T12:24:59.000-05:00" // options undefined
// seconds, milliseconds, and timezone are optional by default, or you can explicitly exclude them
"2023-08-05T12:24" // {date: true, time: true, seconds: false, timezone: false} or undefined
"2023-08-05T12:24:00-05:00" // {date: true, time: true, milliseconds: false} or undefined
"2023-08-05" // {time: false}
"T12:24:59.000Z" // {date: false}
"12:24" // {date: false, seconds: false, timezone: false}

2023-02-28, 2024-02-29, and 2023-06-30 are valid.

2023-02-29 and 2023-06-31 are invalid.

[fabian-hiller]

Thank you for your contribution. I don't know yet if Valibot should contain such complex validations or if we should leave that to the community and external libraries. As a compromise, I could also imagine an extra repository, which is maintained and extended with the community containing complex and more specialized validations. I am looking forward to feedback on this.

[LBF38]

Hi, I'm just starting experimenting with the valibot lib (and validators lib in general).

First of all, it feels amazing and is flawless to use (as of my little experiences ahah).
However, I stumbled across the date parsing/validation and I thought that valibot will validate my date directly from a string, which it doesn't.
Therefore, I would be for adding this feature to the valibot lib.

For example, one could get a string date and pass it to valibot. After parsing it, the value will be a Date type.

const foo: unknown = "2023-08-25T11:45:30+02:00";
const schema = date(); // Date
const result = safeParse(schema, foo);
if(result.success) {
	console.log(typeof result.output, result.output); // result is of type Date
}

But, for now, it throws an error as it is not parsing the string.

What do you think ?

[sillvva]

@LBF38 I replied to you in a new thread below

[fabian-hiller]

I think we already have a solution for this case: https://valibot.dev/guides/methods/#coerce

[dearlordylord]

https://valibot.dev/guides/methods/#coerce doesn't seem to exist anymore

for anyone stumbling upon this: use check / transform

[fabian-hiller]

More about coerce here: https://valibot.dev/guides/migrate-to-v0.31.0/#coerce-method

[sillvva]

@LBF38

But, for now, it throws an error as it is not parsing the string.

What do you think ?

Try

// Transforms a Date, string, or number into a Date
export const dateSchema = transform(
	// Input types: Date, string, number
	union(
		[date(), string([isoTimestamp()]), number([minValue(0)])], 
		"Must be a valid Date object, ISO string, or UNIX timestamp"
	),
	// Output type: Date
	(input) => new Date(input)
);

[fabian-hiller]

Or:

const DateSchema = coerce(date(), (i) => new Date(i));
const dateOutput = parse(NumberSchema, '2023-07-31'); // Date

[LBF38]

Thanks for the solutions, pretty neat !

Btw, isn't a shame that TypeScript doesn't do it natively ? (only static types for now)

[sillvva]

True, but that has its own issues, such as expecting an input of type Date, and the coerce() callback parameter is of type unknown, which the Date constructor doesn't like:

With transform, everything is typed correctly

[fabian-hiller]

Uhh, should we switch it to any?

[sillvva]

Probably not. You can use type narrowing with unknown, and so it's still useful where you need the same input and output types. For example, I used it to create a custom withDefault function. I had previously mentioned one on another post, but eventually settled on this version instead.

export function withDefault<TSchema extends BaseSchema>(schema: TSchema, value: Input<TSchema>) {
	return coerce(schema, (input) =>
		typeof value === "string"
			? `${input}`.trim() || value
			: !input || (typeof value == "number" && isNaN(Number(input)))
			? value
			: input
	);
}

With dates, what your really want to validate is the input. Otherwise, you could get Invalid Date {} or Date with the Epoch time (Jan 1, 1970), both of which still passes the date() schema.

[LBF38]

@sillvva
How do you integrate your solution inside another schema ? like the following :

export const SystemStatus = object({
	alloc: number(),
	//...
	startTime: date(), // TODO: change it to use your solution.
	sys: number(),
	tilde: string(),
	//...
});

[fabian-hiller]

You can nest schemas.

[fabian-hiller]

export const dateSchema = transform(
	// Input types: Date, string, number
	union(
		[date(), string([isoTimestamp()]), number([minValue(0)])], 
		"Must be a valid Date object, ISO string, or UNIX timestamp"
	),
	// Output type: Date
	(input) => new Date(input)
);

export const SystemStatus = object({
	alloc: number(),
	//...
	startTime: dateSchema,
	sys: number(),
	tilde: string(),
	//...
});

[LBF38]

Awesome ! (I need to RTFM ahah)

[LBF38]

How do you validate Date string like the following ?
2023-08-25T11:45:30+02:00

[sillvva]

With the above function, it would just be:
string([iso({ date: true, time: true, milliseconds: false })])
or
string([iso({ date: true, time: true, milliseconds: false, error: "custom error" })])

It handles both Z or [+-]hh:mm time zones by default.

[LBF38]

Well, I have the following error when using the code you provide.

No overload matches this call.
  Overload 1 of 2, '(pipe?: Pipe<string> | undefined): StringSchema<string>', gave the following error.
    Type '(input: string) => { validation: string; message: string; input: string; output?: undefined; } | { output: string; validation?: undefined; message?: undefined; input?: undefined; }' is not assignable to type '(value: string) => PipeResult<string>'.
      Type '{ validation: string; message: string; input: string; output?: undefined; } | { output: string; validation?: undefined; message?: undefined; input?: undefined; }' is not assignable to type 'PipeResult<string>'.
        Type '{ validation: string; message: string; input: string; output?: undefined; }' is not assignable to type 'PipeResult<string>'.
          Property 'issue' is missing in type '{ validation: string; message: string; input: string; output?: undefined; }' but required in type '{ output?: undefined; issue: Pick<Issue, "input" | "validation" | "message">; }'.
  Overload 2 of 2, '(error?: string | undefined, pipe?: Pipe<string> | undefined): StringSchema<string>', gave the following error.
    Argument of type '((input: string) => { validation: string; message: string; input: string; output?: undefined; } | { output: string; validation?: undefined; message?: undefined; input?: undefined; })[]' is not assignable to parameter of type 'string'.

Here is my code :

// Transforms a Date, string, or number into a Date
export const dateValidation = transform(
	// Input types: Date, string, number
	union(
		[date(), string([iso()]), number([minValue(0)])],
		"Must be a valid Date object, ISO string, or UNIX timestamp"
	),
	// Output type: Date
	(input) => new Date(input)
);

And iso is the function you've provided at the beginning.

[LBF38]

The solution is to modify the return type in the iso type.
It should be :

if (!regex.test(input)) {
			return {
				issue: { // notice the change.
					validation: "iso",
					message: error,
					input,
				},
			};
		}
		return { output: input };

[sillvva]

Ah yeah. I had it right in my own code, of course. I missed that when updating the function here.

Edit: Updated, and added PipeResult<TInput> type to the function.

[estubmo]

A question that might be relevant to this discussion:

How come something like 2021-09-30T21 is a valid ISO 8601 date, but can't be parsed with new Date()?

Valibot parses these as valid, while zod parses them as invalid:
https://stackblitz.com/edit/node-tfnfne?file=test%2Fbasic.test.ts

Here's a jsfiddle with an input field if you want to test more: https://jsfiddle.net/wq7tjec7/14/

[fabian-hiller]

The pipeline is an AND condition. You have to write each of string([isoTimestamp(), isoDate(), isoDateTime()])] as a separate string to create an OR link by union.

const DateTimeSchemaValibot = transform(
  union(
    [date(), string([isoTimestamp(), isoDate(), isoDateTime()])],
    'Must be a valid Date object, ISO string, or UNIX timestamp'
  ),
  (input) => new Date(input)
);

[fabian-hiller]

And Valibot also supports coerce in case you need it

[estubmo]

Alright, I wasn't aware of the pipeline being a AND condition, that's valuable information. Might be worth explicitly mentioning that as a caveat in the docs.

I should try out coerce. Thank you.

[fabian-hiller]

Yes we should add that to the pipeline docs