sprintify-ui 0.0.144 → 0.0.145

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sprintify-ui",
-  "version": "0.0.144",
+  "version": "0.0.145",
   "scripts": {
     "build": "rimraf dist && vue-tsc && vite build",
     "build-fast": "rimraf dist && vite build",

package/src/components/BaseDatePicker.stories.js

@@ -21,7 +21,7 @@ export default {
 const Template = (args) => ({
   components: { BaseDatePicker, ShowValue },
   setup() {
-    const value = ref('2023-01-10T10:00:00Z');
+    const value = ref('2022-01-01');
     return { value, args };
   },
   template: `

package/src/components/BaseDatePicker.vue

@@ -190,15 +190,11 @@ const flatpickrConfig = computed(() => {
 });
 
 // Make sure the model value is always formatted on the parent component
-watch(
-  () => modelValueFormatted.value,
-  () => {
-    if (props.modelValue !== modelValueFormatted.value) {
-      emitUpdate(modelValueFormatted.value);
-    }
-  },
-  { immediate: true }
-);
+onMounted(() => {
+  if (props.modelValue !== modelValueFormatted.value) {
+    emitUpdate(modelValueFormatted.value);
+  }
+});
 
 /*
  | Flatpickr does not seem to observe changes in the value attribute of the input.
@@ -206,20 +202,25 @@ watch(
  | and manually react and apply the changes on the picker
 */
 watch(
-  () => props.modelValue,
-  (newValue) => {
-    if (!picker) {
-      return;
-    }
+  () => modelValueFormatted.value,
+  () => {
+    setPickerDate();
+  },
+  { immediate: true }
+);
 
-    if (!newValue) {
-      picker.clear();
-      return;
-    }
+function setPickerDate() {
+  if (!picker) {
+    return;
+  }
 
-    picker.setDate(newValue, false);
+  if (!modelValueFormatted.value) {
+    picker.clear();
+    return;
   }
-);
+
+  picker.setDate(modelValueFormatted.value, false);
+}
 
 /*
  | If the props in flatpickrConfig are changed
@@ -283,6 +284,8 @@ function init() {
       emitUpdate(listDate[0]);
     },
   });
+
+  setPickerDate();
 }
 
 function clear() {