@finema/core 2.17.4 → 2.18.1

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@finema/core",
-  "version": "2.17.4",
+  "version": "2.18.1",
   "configKey": "core",
   "builder": {
     "@nuxt/module-builder": "1.0.1",

package/dist/module.mjs

@@ -3,7 +3,7 @@ import defu from 'defu';
 import * as theme from '../dist/runtime/theme/index.js';
 
 const name = "@finema/core";
-const version = "2.17.4";
+const version = "2.18.1";
 
 const nuxtAppOptions = {
   head: {

package/dist/runtime/components/Form/InputDateTime/index.vue

@@ -1,7 +1,7 @@
 <template>
   <FieldWrapper v-bind="wrapperProps">
     <Datepicker
-      :model-value="value"
+      :model-value="innerValue"
       :disabled="wrapperProps.disabled"
       cancel-text="ยกเลิก"
       select-text="เลือก"
@@ -60,7 +60,7 @@
 <script setup>
 import Datepicker from "@vuepic/vue-datepicker";
 import FieldWrapper from "#core/components/Form/FieldWrapper.vue";
-import { computed, TimeHelper, useAppConfig, useFieldHOC, useUiConfig } from "#imports";
+import { computed, TimeHelper, useAppConfig, useFieldHOC, useUiConfig, ref, watch, onMounted } from "#imports";
 import "@vuepic/vue-datepicker/dist/main.css";
 import { dateTimeTheme } from "#core/theme/dateTime";
 const props = defineProps({
@@ -93,6 +93,27 @@ const {
   value,
   wrapperProps
 } = useFieldHOC(props);
+const innerValue = ref();
+const initializeValue = () => {
+  const currentValue = value.value;
+  if (currentValue) {
+    innerValue.value = typeof currentValue === "string" ? new Date(currentValue) : currentValue;
+  } else {
+    innerValue.value = void 0;
+  }
+};
+watch(value, (newValue) => {
+  if (newValue) {
+    innerValue.value = typeof newValue === "string" ? new Date(newValue) : newValue;
+  } else {
+    innerValue.value = void 0;
+  }
+}, {
+  immediate: false
+});
+onMounted(() => {
+  initializeValue();
+});
 const format = (date) => {
   if (props.disabledTime) {
     return TimeHelper.displayDate(date);

package/dist/runtime/components/Form/InputDateTimeRange/index.vue

@@ -63,7 +63,7 @@
 <script setup>
 import Datepicker from "@vuepic/vue-datepicker";
 import FieldWrapper from "#core/components/Form/FieldWrapper.vue";
-import { TimeHelper, ref, useFieldHOC, useAppConfig, computed, useUiConfig } from "#imports";
+import { TimeHelper, ref, useFieldHOC, useAppConfig, computed, useUiConfig, watch, onMounted } from "#imports";
 import "@vuepic/vue-datepicker/dist/main.css";
 import { dateTimeTheme } from "#core/theme/dateTime";
 const props = defineProps({
@@ -98,6 +98,30 @@ const {
   wrapperProps
 } = useFieldHOC(props);
 const innerValueRef = ref([]);
+const initializeValue = () => {
+  const currentValue = value.value;
+  if (currentValue) {
+    const start = typeof currentValue.start === "string" ? new Date(currentValue.start) : currentValue.start;
+    const end = typeof currentValue.end === "string" ? new Date(currentValue.end) : currentValue.end;
+    innerValueRef.value = [start, end];
+  } else {
+    innerValueRef.value = [];
+  }
+};
+watch(value, (newValue) => {
+  if (newValue && (newValue.start || newValue.end)) {
+    const start = typeof newValue.start === "string" ? new Date(newValue.start) : newValue.start;
+    const end = typeof newValue.end === "string" ? new Date(newValue.end) : newValue.end;
+    innerValueRef.value = [start, end];
+  } else if (!newValue) {
+    innerValueRef.value = [];
+  }
+}, {
+  immediate: false
+});
+onMounted(() => {
+  initializeValue();
+});
 const format = (date) => {
   if (props.disabledTime) {
     return date.length > 0 ? TimeHelper.displayDate(date[0]) + " - " + TimeHelper.displayDate(date[1] ?? date[0]) : "";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@finema/core",
-  "version": "2.17.4",
+  "version": "2.18.1",
   "repository": "https://gitlab.finema.co/finema/ui-kit",
   "license": "MIT",
   "author": "Finema Dev Core Team",