Skip to main content

CalendarLegendItem

<ui5-calendar-legend-item> | Since 1.23.0

Each ui5-calendar-legend-item represents a legend item, displaying a color with a label. The color is determined by the type property and the label by the text property. If a ui5-special-date is used within the ui5-calendar and a type is set, clicking on a ui5-calendar-legend-item with the same type will emphasize the respective date(s) in the calendar.

Usage​

The ui5-calendar-legend-item is intended to be used within the ui5-calendar-legend component.

ES6 Module Import​

import "@ui5/webcomponents/dist/CalendarLegendItem.js";

Properties​

text​

DescriptionDefines the text content of the Calendar Legend Item.
Typestring | undefined
Defaultundefined

type​

DescriptionDefines the type of the Calendar Legend Item.
Type"None" | "Working" | "NonWorking" | "Type01" | "Type02" | "Type03" | "Type04" | "Type05" | "Type06" | "Type07" | "Type08" | "Type09" | "Type10" | "Type11" | "Type12" | "Type13" | "Type14" | "Type15" | "Type16" | "Type17" | "Type18" | "Type19" | "Type20" (value descriptions in: CalendarLegendItemType)
Default"None"

Slots​

No slots available for this component.

Events​

No events available for this component.

Methods​

No methods available for this component.

CSS Parts​

No CSS parts available for this component.

CSS Custom States​

No CSS custom states available for this component.