# EuiCalendarMonthlyComponent

**Type:** component





**Selector:** `eui-calendar-monthly`

## Inputs
- **date**: `Date` - The reference date for the month. The component will display the month that contains this date.
- **dayTemplate**: `TemplateRef<any>` - Template for rendering each day cell
- **disabledDays**: `Date[]` - Array of disabled days (Date objects)
- **disabledDaysNotInMonth**: `boolean, BooleanInput` - Disable days that are not in the current selected month
- **disableFutureDates**: `boolean, BooleanInput` - Disable selection of future dates
- **disablePastDates**: `boolean, BooleanInput` - Disable selection of past dates
- **disableWeekends**: `boolean, BooleanInput` - Disable selection of weekend dates
- **events**: `EuiCalendarEvent[]` - 
- **fillNextMonth**: `boolean, BooleanInput` - Fill with next month days
- **fillPreviousMonth**: `boolean, BooleanInput` - Fill with previous month days
- **hasEmptyValue**: `boolean, BooleanInput` - 
- **headerTemplate**: `TemplateRef<{ date: Date }>` - Template for rendering each day cell
- **mode**: `"compact" | "truncated"` - Display mode of the calendar ('compact' or 'truncated')
- **startingDay**: `number, NumberInput` - Starting day of the week (0=Monday, 1=Tuesday, ..., 6=Sunday or 'monday', 'tue', 'wed', etc.)

## Outputs
- **newEventAddClicked**: `EuiCalendarDayCell` -