amountOfMonths
Description
The number of months to display.
Type
number
Default
1
Leave Yamada UI a star
StarCalendar
is a component for displaying or selecting dates in a calendar.
Description
The number of months to display.
Type
number
Default
1
Description
The visual color appearance of the component.
Type
"whiteAlpha" | "blackAlpha" | "gray" | "neutral" | "red" | "rose" | "pink" | "flashy" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia"
Default
primary
Description
Props for calendar control button element.
Type
IconButtonProps
Description
The format used for conversion. Check the docs to see the format of possible modifiers you can pass.
Type
string
Default
'MMMM YYYY'
Docs
https://day.js.org/docs/en/display/format#list-of-localized-formatsDescription
Props for calendar day button element.
Type
Omit<PropsOf<"button">, "ref" | keyof StyleProps> & StyleProps & PseudoProps & { __css?: CSSUIObject | undefined; sx?: CSSUIObject | undefined; css?: Interpolation<...>; } & { ...; } & ThemeProps<...> & ButtonOptions & { ...; }
Description
The initial month of the calendar.
Type
Date
Default
'new Date()'
Description
The initial type of the calendar.
Type
"date" | "month" | "year"
Description
The initial value of the calendar.
Type
NonNullable<Y>
Description
If true
, outside days will be disabled.
Type
boolean
Default
false
Description
If true
, enables date multiple selection.
Type
boolean
Default
false
Description
If true
, enables date range selection.
Type
boolean
Default
false
Description
Callback function to determine whether the day should be disabled.
Type
(date: Date) => boolean
Description
Define the first day of the week.
Type
"sunday" | "monday"
Default
'monday'
Description
Props for calendar header element.
Type
HTMLUIProps<"div">
Description
Define holidays.
Type
Date[]
Description
Props for calendar label button element.
Type
Omit<PropsOf<"button">, "ref" | keyof StyleProps> & StyleProps & PseudoProps & { __css?: CSSUIObject | undefined; sx?: CSSUIObject | undefined; css?: Interpolation<...>; } & { ...; } & ThemeProps<...> & ButtonOptions & { ...; }
Description
The locale of the calendar. Check the docs to see the locale of possible modifiers you can pass.
Type
string
Default
'en'
Docs
https://day.js.org/docs/en/i18n/instance-localeDescription
The maximum possible date.
Type
Date
Description
The maximum selectable value.
Type
number
Description
The minimum possible date.
Type
Date
Description
The month of the calendar.
Type
Date
Description
The format used for conversion. Check the docs to see the format of possible modifiers you can pass.
Type
string
Default
'MM'
Docs
https://day.js.org/docs/en/display/format#list-of-localized-formatsDescription
Props for calendar month button element.
Type
Omit<PropsOf<"button">, "ref" | keyof StyleProps> & StyleProps & PseudoProps & { __css?: CSSUIObject | undefined; sx?: CSSUIObject | undefined; css?: Interpolation<...>; } & { ...; } & ThemeProps<...> & ButtonOptions & { ...; }
Description
Props for calendar next control button element.
Type
IconButtonProps
Description
Ref to a next function.
Type
type ONLY_FOR_FORMAT =
| ((instance: (() => void | undefined) | null) => void)
| MutableRefObject<(() => void | undefined) | null>
Description
The callback invoked when value state changes.
Type
(value: Y) => void
Description
The callback invoked when month state changes.
Type
(value: Date) => void
Description
The callback invoked when type state changes.
Type
(
type: "date" | "month" | "year",
year?: number | undefined,
month?: number | undefined,
) => void
Description
The number of months to paginate.
Type
number
Default
1
Description
Props for calendar previous control button element.
Type
IconButtonProps
Description
Ref to a previous function.
Type
type ONLY_FOR_FORMAT =
| ((instance: (() => void | undefined) | null) => void)
| MutableRefObject<(() => void | undefined) | null>
Description
The size of the Calendar.
Type
"sm" | "md" | "lg" | "full"
Default
md
Description
Props for calendar month table element.
Type
Omit<PropsOf<"table">, "ref" | keyof StyleProps> & StyleProps & PseudoProps & { __css?: CSSUIObject | undefined; sx?: CSSUIObject | undefined; css?: Interpolation<...>; } & { ...; } & { ...; }
Description
If true
, highlight today.
Type
boolean
Default
false
Description
The type of the calendar.
Type
"date" | "month" | "year"
Description
Ref to a type function.
Type
type ONLY_FOR_FORMAT =
| ((instance: (() => void | undefined) | null) => void)
| MutableRefObject<(() => void | undefined) | null>
Description
The value of the calendar.
Type
NonNullable<Y>
Description
The variant of the Calendar.
Type
"solid" | "subtle" | "unstyled"
Default
solid
Description
The format used for conversion. Check the docs to see the format of possible modifiers you can pass.
Type
string
Default
'dd'
Docs
https://day.js.org/docs/en/display/format#list-of-localized-formatsDescription
Props for calendar weekday element.
Type
Omit<PropsOf<"div">, "ref" | keyof StyleProps> & StyleProps & PseudoProps & { __css?: CSSUIObject | undefined; sx?: CSSUIObject | undefined; css?: Interpolation<...>; } & { ...; } & { ...; }
Description
Define weekend days.
Type
number[]
Default
'[0, 6]'
Description
If true
, display the calendar control buttons.
Type
boolean
Default
true
Description
If true
, display the calendar header.
Type
boolean
Default
true
Description
If true
, display the calendar label button.
Type
boolean
Default
true
Description
If true
, display the calendar weekdays.
Type
boolean
Default
true
Description
The format used for conversion. Check the docs to see the format of possible modifiers you can pass.
Type
string
Default
'YYYY'
Docs
https://day.js.org/docs/en/display/format#list-of-localized-formatsDescription
Props for calendar year button element.
Type
Omit<PropsOf<"button">, "ref" | keyof StyleProps> & StyleProps & PseudoProps & { __css?: CSSUIObject | undefined; sx?: CSSUIObject | undefined; css?: Interpolation<...>; } & { ...; } & ThemeProps<...> & ButtonOptions & { ...; }
Edit this page on GitHub