import { DateFieldYearless } from "@servicetitan/anvil2";
function ExampleComponent() {
return (
<DateFieldYearless
defaultValue={{ month: 3, day: 22 }}
mode="mm/dd"
disableHint={false}
required={false}
/>
); }
DateFieldYearless Props
Uncontrolled initial value for the yearless date.
onChange
(change: DateFieldYearlessChange) => void
Callback fired when the value changes.
Controlled value for the yearless date.
If true, disables the format hint below the field.
Maximum selectable yearless date.
Minimum selectable yearless date.
mode
"mm/dd" | "dd/mm"
default:"mm/dd"
Date input format (yearless).
If true, the field is required.
unavailable
{ dates?: YearlessDate[] }
Yearless dates that are unavailable for selection.
Additional field props
The DateFieldYearless also support the following props which are common to most field components:Additional description below the field.
If true, disables the field.
error
ReactElement | string | boolean
Error message or state.
errorAriaLive
"off" | "polite" | "assertive"
default:"assertive"
ARIA live region setting for error messages.
Additional props for the label element.
If true, shows a loading spinner.
Additional info icon or content for the label.
size
"small" | "medium" | "large"
default:"medium"
Input size.
Suffix element to display inside the input.
type
"text" | "email" | "tel" | "url" | "password" | "number"
default:"text"
Input type.
DateFieldYearlessChange
The onChange callback receives a DateFieldYearlessChange object with the following properties:Whether the input is empty.
Whether the input matches the format and is not empty.
Whether the year-less date is valid according to all constraints (required,
unavailable dates, min/max date, etc.).
The year-less date as an object with keys day and month.