feat: make options reactive

src/component.js

@@ -63,13 +63,15 @@ export default {
       },
       defaultOptions: {
         format: 'D MMM YYYY'
-      },
-      mergedOptions: {}
+      }
     };
   },
   computed: {
     elementAttributes(): Object {
       return Object.assign({}, this.$attrs, this.elAttrs);
+    },
+    mergedOptions() {
+      return Object.assign({}, this.defaultOptions, this.options);
     }
   },
   render(h: Function): Object {
@@ -79,9 +81,6 @@ export default {
       value: this.inputValue(this.value)
     }, this.$slots.default);
   },
-  beforeMount() {
-    this.mergedOptions = Object.assign({}, this.defaultOptions, this.options);
-  },
   mounted() {
     this.create();
 
@@ -98,6 +97,14 @@ export default {
   beforeDestroy() {
     this.destroy();
   },
+  watch: {
+    options: {
+      handler() {
+        this.reload();
+      },
+      deep: true
+    }
+  },
   methods: {
     create() {
       this.mergedOptions.field = this.$el;
@@ -126,6 +133,10 @@ export default {
     destroy() {
       this.pikaday.destroy();
     },
+    reload() {
+      this.destroy();
+      this.create();
+    },
     change(value: typeof undefined | null | Date) {
       this.$emit('input', value);
       this.$emit('input-value', this.inputValue(value));