Skip to content
On this page

Upgrade Guide

This document outlines how to upgrade VCalendar from v2 to v3.

Some changes introduced in versions previous to 3.0.0-alpha.9 have also been rolled back. They will be noted with the following warning:

Pre 3.0.0-alpha.9

Deprecated Screens Mixin

The included screens mixin that supplied the $screens function has been removed. Responsive calendar layouts are still possible using a dedicated screen utility plugin like vue-screen-utils.

Read more


Replace from-page, to-page, from-date, and to-date props

Use the initial-page and initial-page-position props to correctly set the initial months for a calendar.

Read more

Replace is-expanded prop

The expanded prop should now be used in lieu of is-expanded to set full-width calendars.

Replace Highlight Fill Mode

The none option for attribute.highlight.fillMode has been deprecated in favor of the more descriptive outline option.

Read more

Repeating dates config

When using repeating dates with date expressions, repeat rules must now be nested within a repeat object. This change was made to support repeating date ranges, which was not possible in v2.

Also, the separate repeat interval keys (dailyInterval, weeklyInterval, monthlyInterval, yearlyInterval) have been deprecated in favor of the every key.

  <VCalendar :attributes="attributes" />

<script setup>
import { ref } from 'vue';

const attributes = ref([
    highlight: true,
    dates: {
      start: new Date(2022, 10, 7),
      repeat: {
        every: [2, 'weeks'],
        weekdays: 2,

Read more

Added moveBy

Any direct calls of the move function on the calendar to move forward and back by n number of months should now use moveBy.

Read more


Deprecate modelConfig prop

Use the number and string model modifiers in favor of the modelConfig prop. Provide the masks.modelValue prop if a string mask is needed.

Read more

Soft-Deprecate is-range

Using the is-range prop to bind to date ranges is soft-deprecated. To bind to date ranges, use the range model modifier.

Read more.

Deprecate minute-increment and valid-hours props

Pre 3.0.0-alpha.9

The minute-increment and valid-hours props have been deprecated in favor of using the rules prop.

Read more

Released under the MIT License.