Unlock seamless workflows and faster delivery with our latest releases - Join the deep dive

Rich Date

An object signifying a point in time. Produces one or two ISO-8601 formatted date strings, depending on usage (see below).

Properties

  • typestring

    Required. Value must be set to richDate.

Options

  • inputUtcboolean

    Set to true if user input is treated as UTC (also known as Coordinated Universal Time, Military Time or "Zulu-time"). If this options is set to true, no local time data will be stored following user input (see sample output below). Default is false.

  • dateFormatstring

    Controls how the date input field formats the displayed date. Use any valid Moment format option. Default is YYYY-MM-DD.

  • timeFormatstring

    Controls how the time input field formats the displayed date. Use any valid Moment format option. Default is HH:mm.

  • inputDateboolean

    Set to true if user is allowed to input a date. Default is true.

  • inputTimeboolean

    Set to true if user is allowed to input a time. Default is true.

  • timeStepnumber

    Number of minutes between each entry in the time input. Default is 15 which lets the user choose between 09:00, 09:15, 09:30 and so on.

  • calendarTodayLabelstring

    Label for the "jump to today" button on the date input widget. Default is today.

  • placeholderDatestring

    Placeholder for the date input field. Default is todays date, formatted as per the dateFormat option.

  • placeholderTimestring

    Placeholder for the time input field. Default is current time, formatted as per the timeFormat option.

Note: As of Sanity v0.117.0, this schema type is not included in new studios by default, but provided by the plugin @sanity/rich-date-input.

Example: Basic usage

By default, options.inputUtc is set to false. Therefore, date object will include timezone data.

Input

{
  title: 'Release date',
  name: 'releaseDate',
  type: 'richDate'
}

Output

{
  "_type": "richDate",
  "utc": "2017-04-18T12:29:00Z",
  "local": "2017-04-18T11:29:00+01:00",
  "timezone": "Europe/Oslo",
  "offset": 60 // utc offset in minutes
}

Example: Basic usage options.inputUtc: true

Input

{
  title: 'Release date',
  name: 'releaseDate',
  type: 'richDate',
  options: {
    inputUtc: true
  }
}

Output

{
  "_type": "richDate",
  "utc": "2017-04-18T12:29:00Z"
}

Example: The whole enchilada

{
  title: 'Release date',
  name: 'releaseDate',
  type: 'richDate',
  options: {
    inputUtc: false,
    dateFormat: 'YYYY-MM-DD',
    timeFormat: 'HH:mm',
    inputDate: true,
    inputTime: true,
    timeStep: 15,
    calendarTodayLabel: 'Today',
    placeholderDate: '2017-04-18',
    placeholderTime: '11:29'
  }
}

Was this article helpful?