-
Notifications
You must be signed in to change notification settings - Fork 144
Open
Description
Title: Feature request: Render calendar in a selected time zone (events stored as UTC)
Summary
I store all event timestamps in UTC. The scheduler currently renders using the viewer’s device time zone. I need an option to render the entire calendar (grid, headers, event chips, tooltips) in a user-selected IANA time zone.
Current behavior
- Events are saved as UTC.
- UI renders times in the device/browser time zone.
- Users in different regions see different local times for the same event.
Expected behavior
- Provide a prop to control display time zone.
- When set, all calendar UI uses that zone.
- Creating or editing events still returns UTC to the app.
Proposed API (example)
<Scheduler
events={events} // ISO strings in UTC
displayTimeZone="Asia/Dubai" // IANA TZ for rendering only
onEventCreate={(e) => saveAsUTC(e)} // library hands back Date; app persists UTC
/>Details:
displayTimeZone?: stringaccepts an IANA name (e.g., "America/Toronto").- Internal conversions use
Intl.DateTimeFormator a lightweight TZ lib. - If not provided, fall back to device time zone (current behavior).
Why this matters
- Admins schedule global sessions but want a consistent view per chosen region.
- Avoids confusion across DST changes and cross-region teams.
- Pre-converting data outside the component is brittle and does not change headers/slots.
Alternatives considered
-
Manually converting event start/end before passing to the component.
- Problem: headers, slot labels, and drag/resize handles still use device TZ.
Environment
- react-scheduler: [0.3.1]
- React: [18.3.1]
- Browser/OS: [e.g., Chrome 139 on Windows 10]
- Device TZ: [e.g., America/Toronto]
- Desired display TZ: [e.g., Asia/Dubai]
Additional context
Happy to provide a minimal reproduction if needed. If a PR is welcome, confirm preferred approach for time zone handling and any constraints.
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
No labels