DocsLogin
Schema Types

Schema Types

s.string()

Use the s.string() schema to represent text. You can use the `render` method to change how strings are represented in the UI.

Methods:
.validate: method

Custom validation function

.maxLength(n): method

Maximum length validation

.minLength(n): method

Minimum length validation

.regex(pattern): method

Regex pattern validation

s.string().regex(/Example/)
.render: method

Change how this string is rendered in the UI. When it is configured to be rendered as textarea, a textarea is used instead of a regular input field.

s.string().render({ as: "textarea" })
Example:
Example
s.string().maxLength(100)

s.number()

Number type with optional validation

Methods:
.validate: method

Custom validation function

.min(n): method

Minimum value validation

.max(n): method

Maximum value validation

Example:
Example
s.number().min(0).max(100)

s.boolean()

Boolean type

Methods:
.validate: method

Custom validation function

Example:
Example
s.boolean()

s.literal(string)

Literal value type. This is mainly used together with unions. It is rendered as a dropdown menu in the UI

Methods:
.validate: method

Custom validation function

Example:
Example
s.union(s.literal("primary"), s.literal("secondary"))

s.object(object)

Object type with defined properties

Methods:
.validate: method

Custom validation function

Example:
Example
s.object({
  title: s.string(),
  count: s.number()
})

s.array(schema)

Array type with element schema

Methods:
.validate: method

Custom validation function

Example:
Example
s.array(s.string())

s.record(schema)

Record type with element schema

A record is a collection of key-value pairs. It can be used as a list of objects that have a unique key.

Methods:
.validate: method

Custom validation function

.render: method

Render the record as a list

s.record(s.object({
  name: s.string(),
  age: s.number(),
})).render({ as: "list", select: ({ key, val }) => ({ title: val.name, subtitle: val.age }) })
.router: method

Use the router method to automatically generate pages for each entry in the record

Example:
s.record(s.object({
  name: s.string(),
  age: s.number(),
}))

s.union(...s.literal(value))

Union type (one of multiple literal values). Rendered as a dropdown menu in the UI

Methods:
.validate: method

Custom validation function

Example:
Example
s.union(
  s.literal("small"),
  s.literal("large")
)

s.union("type", ...s.literal(value))

Discriminated (tagged) union type. Rendered as an objectct where the first field is the tag type which is rendered as a dropdown in the UI.

Methods:
.validate: method

Custom validation function

Example:
Example
s.union(
  "type",
  s.object({
    type: s.literal("number"),
    num: s.number(),
  }),
  s.object({
    type: s.literal("string"),
    str: s.string(),
  })
)

s.keyOf(schema)

Key reference to another Val module

Methods:
.validate: method

Custom validation function

Example:
Example
import keysVal from "./keys.val"; // this must be a record
s.keyOf(keysVal)

s.image()

Images. Use s.image for schema, then c.image for content. Also note by adding .remote you can enable remote images

See: /docs/images, /docs/remote
Options:
accept: string

The accept value is a comma-separated list of one or more image types, or unique file type specifiers, describing which file types to allow.

s.image({ accept: "image/webp" })
Methods:
.validate: method

Custom validation function

.remote: method

Enable remote images

Example:
Example
const schema = s.image();
export default c.define("/content/image.val.ts", schema, 
  c.image("/public/val/hero.jpg", { //  NOTE: the actual files must be in the public/val folder
    width: 1200,
    height: 800,
    alt: "Hero image"
  }
)

s.file()

Generic files. Use s.file for schema, then c.file for content.

NOTE: if you limit the accept to video as the example below, the file will be treated as a video in Val Studio.

See: /docs/files, /docs/remote
Options:
accept: string

The accept value is a comma-separated list of one or more image types, or unique file type specifiers, describing which file types to allow.

s.file({ accept: "video/*" })
Methods:
.validate: method

Custom validation function

.remote: method

Enable remote files

Example:
const schema = s.file({ accept: "video/*" });
export default c.define("/content/file.val.ts", schema, 
  c.file("/public/val/video.mp4") // NOTE: the actual files must be in the public/val folder
)

s.richtext(options)

Rich text with configurable formatting options

Methods:
.validate: method

Custom validation function

Example:
Example
s.richtext({
  style: {
    bold: true,
    italic: true,
    lineThrough: true
  },
  block: {
    p: true,
    h1: true,
    h2: true,
    ul: true,
    ol: true
  },
  inline: {
    a: true,
    img: true
  }
})

.nullable()

Makes any schema type nullable

Example:
Example
s.string().nullable()

.validate()

Custom validation function

Example:
Example
s.string().validate(str => {
   if (str === "test") {
     return "Test is not allowed";
   }
   return str;
})