Aphex
Schema Types

Date

Date picker with configurable display format.

The date type stores date values. It renders a text input with an integrated calendar picker. Dates are always stored in ISO format (YYYY-MM-DD) regardless of the display format.

Definition

import type { DateField } from '@aphexcms/cms-core';
{
  name: 'publishDate',
  type: 'date',
  title: 'Publish Date',
  validation: (Rule) => Rule.required()
}

Properties

PropertyTypeRequiredDescription
namestringYesField identifier.
type'date'YesMust be 'date'.
titlestringYesLabel shown in the admin UI.
descriptionstringNoHelp text shown below the label.
optionsobjectNoDisplay options. See Options.
initialValuestring | () => string | Promise<string>NoDefault value in ISO format.
validation(Rule) => RuleNoValidation rules.

Options

OptionTypeDefaultUsedDescription
dateFormatstring'YYYY-MM-DD'YesDisplay format using dayjs tokens. The input placeholder also reflects this format.
calendarTodayLabelstring-Not yetDefined in the type but not yet used by the component.

Common format tokens

TokenExampleDescription
YYYY20254-digit year
MM01-122-digit month
DD01-312-digit day

Examples

Default format

{
  name: 'birthday',
  type: 'date',
  title: 'Birthday'
}

Custom display format

{
  name: 'eventDate',
  type: 'date',
  title: 'Event Date',
  options: {
    dateFormat: 'DD/MM/YYYY'
  }
}

With initial value

{
  name: 'startDate',
  type: 'date',
  title: 'Start Date',
  initialValue: () => new Date().toISOString().split('T')[0]
}

Validation

Available rules: required(), custom(fn), error(msg), warning(msg), info(msg)

Edit on GitHub

Last updated on