Programmatically setting the Input Range on Date Range Picker

First, thank you for the great plugin! It's beautiful! I am having a really hard time, trying to set up the input dates/times on the range date picker. I am working with Vue 3 and have it working on one of my Vue pages by using range in data() and a watcher, like:

range: {
      start: new Date(this.checkinDate()),
      end: new Date(this.checkoutDate())
      }

watch: {
     range: function() {

            console.log(this.range)
            this.getDuration()

     }
   },

However when I am trying now to have it setup in a separate component that is part of a modal template, it's not working at all. I tried using many different ways and the only thing that is kind of working is the computed property, like:

  computed: {

        range: {
            set (val) {

                console.log("Val is: " + val)
            },
            get () {
                let range = {
                        start: new Date(this.checkin()), 
                        end: new Date(this.checkout())
                }

                return range
            }
        }

    },

I got it so far that it's showing the correct time and date in the fields, but the calendar has no range selection on it and it might be on the wrong month as well.

My checkin and checkout methods basically take the data from my Vuex store, which were set before the modal was pulled up.

 methods: {

        checkin() {
            return moment(this.$store.state.checkin)
                },
        checkout() {
            return moment(this.$store.state.checkout)
        },

Please let me know if you or anyone else can assist, this has been baffling me for a while now...and I really like to keep using this plugin, as it's the best looking one I've seen so far!

Thank you!

nathanreyes / v-calendar

Programmatically setting the Input Range on Date Range Picker #1002