Advanced Features | SVAR Svelte Calendar Documentation

PRO

📄️ Recurring Events

This guide covers how to model repeating events in the calendar - daily standups, weekly syncs, monthly planning - and how the store turns a single master record into the concrete instances users see on the grid.

📄️ Custom Views

This guide covers how to reshape one of the built-in views with a config override, and how to build a new view by subclassing ViewModel when an override isn't enough.

📄️ Saving to Server

This guide covers how to keep calendar events in sync with a backend - what the calendar sends out on every change, how the bundled RestDataProvider turns those changes into HTTP requests, and what the server side has to look like.

📄️ Import and Export

This guide explains how to move events between the Calendar widget and external sources - iCalendar (.ics) files and plain JSON arrays. You'll see how to seed the calendar from existing data, save user changes back out, and round-trip events through a backend.

📄️ Context Menu

This guide covers how to attach a right-click menu to events in the calendar - the default edit/delete pair, custom entries, and the gates that hide the menu or its items based on event state.

📄️ Tooltip

This guide covers how to attach a custom hover preview to events. The calendar takes the component, decides when to mount it, and feeds it the right payload depending on the view.

📄️ Event Card

This guide covers the eventPopup extension point - how to render a custom card on event clicks, how it interacts with the built-in editor, and what the injected component receives.

📄️ Calendar groups

How to expose multiple calendars (work, home, holidays) as a sidebar with checkbox filters and a mini date picker

📄️ Localization

Localization controls every word the calendar shows users - toolbar labels, view names, editor field captions, accessibility strings - plus the date and time format strings used by titles, axis headers, and the agenda. You wire it in by wrapping ` (and its companions) in the component from @svar-ui/svelte-core` and passing a merged dictionary.