Calendar View
The Calendar View element displays a monthly calendar with events. Users can navigate between months and see events marked on specific days.
Features
- Month navigation with previous/next arrows
- Day grid with real dates for the current month
- Today highlight with accent color
- Event indicators — colored bars on days with events
- Configurable first day of week (Sunday or Monday)
- Optional week numbers column
Settings
| Setting | Description | Default |
|---|---|---|
| Default View | Calendar view type: month, week, or day | month |
| Accent Color | Color for today highlight and active elements | #4285F4 |
| First Day of Week | Start week on Sunday (0) or Monday (1) | 0 (Sunday) |
| Height | Calendar height in pixels | 350 |
| Show Week Numbers | Display week number column on the left | false |
Events
Each event has:
- Title — event name
- Date — date string (YYYY-MM-DD)
- Time — time string (e.g., "10:00")
- Color — event indicator color
Click + Add to add events. Click x to remove.
Use Cases
- Event scheduling dashboards
- Content publishing calendars
- Appointment overview displays
- Project milestone tracking
Styling
The Calendar View supports standard Container color and dimension settings:
- Background color, border, padding, margin
- Border radius and width
Questions?
If you have any questions, please don't hesitate to contact us. Alternatively, you can submit an issue on this platform.