Troubleshooting

Documentation index

SymptomCheck and fix
Blank calendar or “no plugin provides the view”Register the matching plugin and use an exact view name. React plugins require remounting if changed.
Unstyled or compressed layoutImport z-cal/style.css. Inspect host/container dimensions and CSS overrides.
Month cells leave unused vertical spaceSet height; for '100%', define the parent's height and the React host's height. Use dayMaxEvents: true for uniform crowded rows.
Responsive week still shows seven narrow columnsEnable responsiveWeek; use timeGridWeek or a view inheriting it. Resource week views do not implement this option.
Custom event text overlaps neighboring columnsKeep custom content within the event width using clipping/ellipsis and shrinkable flex children; preserve the built-in cx-event-time/cx-event-title classes where useful.
“requires the Temporal API”Import z-cal/polyfill before using the library in that runtime.
getTime() is missingCallback dates are Temporal values. Use toString() or epochMilliseconds on a zoned value; all-day dates are PlainDate.
Event appears at the wrong timeCheck the calendar timeZone and whether the input includes an offset. Offset-free inputs represent wall-clock time; UTC inputs represent an instant.
All-day event ends a day earlyEnds are exclusive. A one-day event on September 7 ends on September 8.
Timed event has no durationSupply end. Missing timed ends are point events, not implicitly one-hour events.
Cannot drag/select/resizeRegister Interaction; set editable and/or selectable. Check per-event overrides and synchronous constraints.
Drag selection shows a highlight but no event/formImplement the select callback, open your form, and call addEvent or update application state.
Editor closes or highlight disappears when clickedUse unselectCancel for the editor selector, or unselectAuto: false and explicit unselect() after save/cancel.
Events disappear after a React renderKeep unchanged arrays stable and decide whether React state or the instance owns edits. A replacement events prop is authoritative.
In-place array mutation does not update the viewUse a new array/object for intentional React changes, or use the instance API.
Remote refresh overwrites local editsPersist edits before refetching and ensure the server returns them. Stable IDs retain mounted elements, not unsaved server data.
Source stays loadingReturn a promise or call success/failure from callback sources. Do not leave them unsettled.
JSON feed has no eventsReturn an array, check the requested range/timezone, HTTP status, console errors, and CORS. Use a function source for custom auth headers.
updateEvent({ id, title }) fails or loses fieldsIt is a replacement operation requiring start. Preserve the complete input fields you want to retain.
React import cannot be resolvedInstall z-cal, then import z-cal/react. Install React/React DOM 19; do not install the subpath as a package.
SSR output contains only an empty divExpected: the calendar grid mounts on the client. Keep direct DOM calls out of server rendering.
New plugin prop does not change available viewsRemount <Calendar> with a different key; plugins are fixed per instance.
CSS utilities do not override calendar stylesCheck cascade-layer order; see styling.

Short timed events

Set eventMinHeight: 28 to give short events at least 28 CSS pixels of height in time-grid and resource time-grid views. The engine includes the expanded boxes in collision packing and fits them inside the visible slot range. All colliding cards remain visible; hover or keyboard-focus a card to read its full title and time range. Avoid forcing heights with CSS, which bypasses packing. Increasing slotHeight instead scales the entire grid and all event heights proportionally.

Report a reproducible issue

Include the installed z-cal version, browser/runtime versions, framework, view/plugin list, timezone, container dimensions, and a minimal event input. For date problems, include the exact start/end strings and expected displayed dates. For remote sources, use a small sanitized response. Avoid credentials or private event content. Report issues in the repository.