0
25.0.8
Zurich, Yokohama, Xanadu, Washington DC, Vancouver
A full-featured calendar component with month, week, day, and timeline views. Configure data to display edit-ability, behavior, and available views. This component is presentational and requires the user to fetch their own data.
- Display time-based events using different views (calendar or timeline)
- Enable end users to remove, modify, and add events to the calendar
- Customize event visualizations
- Configure available view types
New Feature: Resizable Sections
1. Resizable Calendar Sections (Timeline View)
- Resizing Enabled by Default: Users can resize columns in timeline view by dragging the header margins.
- OOB Support: Drag-to-resize from header section is available out-of-the-box.
- Full section margin dragging (not just header).
- Limits:
- Maximum Width: Up to page width minus 5px (configurable).
- Minimum Width: 30px (configurable).
- Resizing capped at 50% of total calendar width per column.
2. Column Configuration
- Admin Configurable Columns:
- Minimum of 1 column always visible.
- Up to 3 columns total (2 additional) configurable.
Theme & Gradient Color Enhancement
3. Gradient Event Colors – Theme Variable Support
- Current Limitation: Gradient events only accept hardcoded color values (
RGB()or#HEX). - New Feature:
- Allow support for theme variables (e.g.,
--now-color--category-blue-0). - Enables dynamic theming for both dark and light modes.
- Allow support for theme variables (e.g.,
- Use Case: Gradient color visibility issues when hardcoded colors clash with dark/light themes.
- Goal: Event gradients should adapt using variables, as solid colors already do.
Date Selection Logic Enhancement
5. Auto-Date Selection Removed on Month Change
- Previous Behavior: When navigating to another month, same day (e.g., 28th) is auto-selected.
- New Behavior:
- After month/week navigation, no date is selected unless user explicitly selects one.
- In month view:
- Date picker highlights the 1st of month, but main calendar remains unselected.
- In agenda view:
- Label shown as “No date selected” if none is selected.
- Work Week/Week View:
- Only the first day is highlighted in picker.
Mini Calendar – NDS Date-Time Picker Integration
6. Updated Calendar Picker Behavior
- Integrated with NDS date-time picker.
- Picker UI:
- Highlights current date or first day of navigated month/week.
- Allows hover preview of weeks.
- Includes Apply/Cancel actions.
- Picker opens inline in day view and as overlay in week/month views.
- Responsive positioning for smaller screens.
Performance Optimization
7. Calendar Performance Improvements
- Optimized Load Times:
- Faster initial calendar load in workspaces.
- Efficient template loading.
- Reduced unnecessary renders during user interactions.
- Washington DC instance (25.x.x) with UI Builder