Validators

Type Aliases

RuleValidators

type RuleValidators = (flatten) => object[];

Parameters

Returns

object

TypeValidators

type TypeValidators = object;

Index Signature

[key: string]: object

ValidatorConfig

type ValidatorConfig = object;

Properties

rules?

optional rules: RuleValidators;

types?

optional types: TypeValidators;

ValidatorError

type ValidatorError = object;

Properties

message

message: string;

name

name: string;

path

path: string;

value?

optional value: unknown;

ValidatorReturn

type ValidatorReturn = object;

Properties

errors

errors: ValidatorError[];

warnings

warnings: string[];

Variables

borderTokenPropertyTypes

const borderTokenPropertyTypes: Record<string, string>;

BorderTokenSchema

const BorderTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"border">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
     color: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniString<string>]>;
     style: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniUnion<readonly [ZodMiniString<...>, ZodMiniObject<..., ...>]>]>;
     width: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
        unit: ZodMiniUnion<...>;
        value: ZodMiniNumber<...>;
     }, $strict>]>;
  }, $strict>]>;
}, $strict>;

ColorTokenSchema

const ColorTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"color">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniString<string>]>;
}, $strict>;

A schema for a color token. Reference: https://tr.designtokens.org/format/#color

Example

{
 *  $type: "color",
 *  $value: "#000000",
 *  $description: "The primary color of the application."
 * }

Returns

The color token schema.

CubicBezierTokenSchema

const CubicBezierTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"cubicBezier">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniArray<ZodMiniUnion<readonly [ZodMiniNumber<number>, ZodMiniString<string>]>>]>;
}, $strict>;

A schema for a cubic bezier token. The cubic bezier token is an array of 4 numbers. The first and third numbers must be between 0 and 1. Reference: https://tr.designtokens.org/format/#cubic-bezier

Example

{
 *  $type: "cubicBezier",
 *  $value: [0.42, 0, 0.58, 1]
 * }

Returns

The cubic bezier token schema.

DimensionTokenSchema

const DimensionTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"dimension">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
     unit: ZodMiniUnion<readonly [ZodMiniLiteral<"px">, ZodMiniLiteral<"rem">]>;
     value: ZodMiniNumber<number>;
  }, $strict>]>;
}, $strict>;

A schema for a dimension token. The dimension token is an object with a value and a unit. The unit can be "px" or "rem". Reference: https://tr.designtokens.org/format/#dimension

Example

{
 *  $type: "dimension",
 *  $value: {
 *    value: 16,
 *    unit: "px"
 *  },
 *  $description: "The size of the button."
 * }

Returns

The dimension token schema.

dtcgJsonSchemas

const dtcgJsonSchemas: TypeValidators;

DurationTokenSchema

const DurationTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"duration">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
     unit: ZodMiniUnion<readonly [ZodMiniLiteral<"ms">, ZodMiniLiteral<"s">]>;
     value: ZodMiniNumber<number>;
  }, $strict>]>;
}, $strict>;

A schema for a duration token. The duration token is an object with a value and a unit. The unit can be "ms" or "s". Reference: https://tr.designtokens.org/format/#duration

Example

{
 *  $type: "duration",
 *  $value: {
 *    value: 300,
 *    unit: "ms"
 *  },
 *  $description: "The duration of the animation."
 * }

Returns

The duration token schema.

FontFamilyTokenSchema

const FontFamilyTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"fontFamily">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniArray<ZodMiniString<string>>]>]>;
}, $strict>;

A schema for a font family token. Reference: https://tr.designtokens.org/format/#fontfamily

Example

{
 *  $type: "fontFamily",
 *  $value: "Arial",
 *  $description: "The primary font family of the application."
 * }

Returns

The font family token schema.

FontWeightTokenSchema

const FontWeightTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"fontWeight">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniUnion<readonly [ZodMiniNumber<number>, ZodMiniString<string>]>]>;
}, $strict>;

A schema for a font weight token. Reference: https://tr.designtokens.org/format/#fontweight

Example

{
 *  $type: "fontWeight",
 *  $value: 400,
 *  $description: "The font weight of the text."
 * }

Returns

The font weight token schema.

fontWeightValues

const fontWeightValues: object;

Helper constant for font weight values. The keys are the font weight values and the values are the possible names. Reference: https://tr.designtokens.org/format/#font-weight

Type declaration

gradientTokenPropertyTypes

const gradientTokenPropertyTypes: Record<string, string>;

GradientTokenSchema

const GradientTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"gradient">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniArray<ZodMiniUnion<readonly [ZodMiniObject<{
     color: ZodMiniUnion<readonly [..., ...]>;
     position: ZodMiniUnion<readonly [..., ...]>;
  }, $strict>, ZodMiniString<string>]>>]>;
}, $strict>;

A schema for a gradient token.

Interpretation of position: Specification is not clear about whether the position needs to be between 0 and 1. Because it says "If a number value outside of that range is given, it MUST be considered as if it were clamped to the range [0, 1]". So, it is assumed that the position can be any number. However, it is recommended to use a number between 0 and 1. Reference: https://tr.designtokens.org/format/#gradient

Example

{
 *  $type: "gradient",
 *  $value: [
 *    {
 *      color: "#000000",
 *      position: 0
 *    },
 *    {
 *      color: "#FFFFFF",
 *      position: 1
 *    }
 *  ]
 * }

Returns

The gradient token schema.

lineCapPredefinedValues

const lineCapPredefinedValues: readonly ["butt", "round", "square"];

NumberTokenSchema

const NumberTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"number">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniNumber<number>]>;
}, $strict>;

A schema for a number token. Reference: https://tr.designtokens.org/format/#number

Example

{
 *  $type: "number",
 *  $value: 16,
 *  $description: "The size of the button."
 * }

Returns

The number token schema.

ReferenceValueSchema

const ReferenceValueSchema: ZodMiniString<string>;

shadowTokenPropertyTypes

const shadowTokenPropertyTypes: Record<string, string>;

ShadowTokenSchema

const ShadowTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"shadow">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniUnion<readonly [ZodMiniObject<{
     blur: ZodMiniUnion<readonly [ZodMiniString<...>, ZodMiniObject<..., ...>]>;
     color: ZodMiniUnion<readonly [ZodMiniString<...>, ZodMiniString<...>]>;
     inset: ZodMiniOptional<ZodMiniBoolean<boolean>>;
     offsetX: ZodMiniUnion<readonly [ZodMiniString<...>, ZodMiniObject<..., ...>]>;
     offsetY: ZodMiniUnion<readonly [ZodMiniString<...>, ZodMiniObject<..., ...>]>;
     spread: ZodMiniUnion<readonly [ZodMiniString<...>, ZodMiniObject<..., ...>]>;
   }, $strict>, ZodMiniArray<ZodMiniUnion<readonly [ZodMiniObject<{
     blur: ...;
     color: ...;
     inset: ...;
     offsetX: ...;
     offsetY: ...;
     spread: ...;
  }, $strict>, ZodMiniString<string>]>>]>]>;
}, $strict>;

A schema for a shadow token. Reference: https://tr.designtokens.org/format/#shadow

Example

{
 *  $type: "shadow",
 *  $value: {
 *    color: "#000000",
 *    offsetX: "0px",
 *    offsetY: "4px",
 *    blur: "8px",
 *    spread: "0px",
 *    inset: false
 *  }
 * }

Returns

The shadow token schema.

StrictStringSchema

const StrictStringSchema: ZodMiniString<string>;

strokePredefinedValues

const strokePredefinedValues: readonly ["solid", "dashed", "dotted", "double", "groove", "ridge", "outset", "inset"];

strokeStyleTokenPropertyTypes

const strokeStyleTokenPropertyTypes: Record<string, string>;

StrokeStyleTokenSchema

const StrokeStyleTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"strokeStyle">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
     dashArray: ZodMiniArray<ZodMiniUnion<readonly [..., ...]>>;
     lineCap: ZodMiniString<string>;
  }, $strict>]>]>;
}, $strict>;

transitionTokenPropertyTypes

const transitionTokenPropertyTypes: Record<string, string>;

TransitionTokenSchema

const TransitionTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"transition">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
     delay: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
        unit: ZodMiniUnion<...>;
        value: ZodMiniNumber<...>;
     }, $strict>]>;
     duration: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
        unit: ZodMiniUnion<...>;
        value: ZodMiniNumber<...>;
     }, $strict>]>;
     timingFunction: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniArray<ZodMiniUnion<readonly [..., ...]>>]>;
  }, $strict>]>;
}, $strict>;

typographyTokenPropertyTypes

const typographyTokenPropertyTypes: Record<string, TokenType>;

TypographyTokenSchema

const TypographyTokenSchema: ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<"typography">>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
     fontFamily: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniUnion<readonly [ZodMiniString<...>, ZodMiniArray<...>]>]>;
     fontSize: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
        unit: ZodMiniUnion<...>;
        value: ZodMiniNumber<...>;
     }, $strict>]>;
     fontWeight: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniUnion<readonly [ZodMiniNumber<...>, ZodMiniString<...>]>]>;
     letterSpacing: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniObject<{
        unit: ZodMiniUnion<...>;
        value: ZodMiniNumber<...>;
     }, $strict>]>;
     lineHeight: ZodMiniUnion<readonly [ZodMiniString<string>, ZodMiniNumber<number>]>;
  }, $strict>]>;
}, $strict>;

A schema for a typography token. Reference: https://tr.designtokens.org/format/#typography

Example

{
 *  $type: "typography",
 *  $value: {
 *    fontFamily: "Arial",
 *    fontSize: "16px",
 *    fontWeight: 400,
 *    letterSpacing: "1px",
 *    lineHeight: 1.5
 *  },
 *  $description: "The typography of the application."
 * }

Returns

The typography token schema.

Functions

createSchema()

function createSchema<T, V>(type, value): ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniLiteral<T>>;
  $value: ZodMiniUnion<readonly [ZodMiniString<string>, V]>;
}, $strict>;

Creates a schema for a token.

Type Parameters

Parameters

Returns

ZodMiniObject<{ $description: ZodMiniOptional<ZodMiniString<string>>; $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>; $type: ZodMiniOptional<ZodMiniLiteral<T>>; $value: ZodMiniUnion<readonly [ZodMiniString<string>, V]>; }, $strict>

The token schema.

dtcgValidator()

function dtcgValidator(value, config): ValidatorReturn;

Validate the token group. The function checks if the token group is valid and if the references are correct.

Parameters

Returns

ValidatorReturn

True if the value is a valid token group

GroupSchema()

function GroupSchema(customTypes?): ZodMiniObject<{
  $description: ZodMiniOptional<ZodMiniString<string>>;
  $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>;
  $type: ZodMiniOptional<ZodMiniString<string>>;
}, $loose>;

Parameters

Returns

ZodMiniObject<{ $description: ZodMiniOptional<ZodMiniString<string>>; $extensions: ZodMiniOptional<ZodMiniRecord<ZodMiniString<string>, ZodMiniUnknown>>; $type: ZodMiniOptional<ZodMiniString<string>>; }, $loose>