Calendar
The FktCalendar component provides a comprehensive date selection interface with multiple view modes and extensive customization options. Built with Angular signals for optimal performance and reactivity, it supports date, month, and year selection with configurable styling and behavior.
Import
import {FktCalendarComponent} from "frakton-ng/calendar";Basic calendar
Basic calendar with date selection functionality and month/year navigation.
Borderless calendar
Calendar displayed without border for seamless integration into containers.
With disabled dates
Calendar with disabled dates to restrict user selection to valid date ranges.
Disabled Date Rules:
- All past dates are disabled
- Weekends (Saturday & Sunday) are disabled
- 15th of every month (maintenance day)
- December 24-26 (holiday period)
Past dates
Weekends
Blackout dates (15th of month, Dec 24-26)
Disabled Date Rules:
- All past dates are disabled
- Weekends (Saturday & Sunday) are disabled
- 15th of every month (maintenance day)
- December 24-26 (holiday period)
With events
Calendar displaying events and highlighting dates with special significance.
Click History
Click on any date to see interaction history
Click History
@if (clickHistory().length === 0) {
Click on any date to see interaction history
} @else {
@for (item of clickHistory(); track item) {
{{ item }}
}
}
Custom styling
Calendar with custom styling and visual indicators for different date states.
Weekends
Holidays
Past dates