@7365admin1/layer-common 4.1.2-staging.245 → 4.1.2-staging.246

package/components/Input/DatePicker.vue

@@ -35,9 +35,15 @@ const dateFormattedReadOnly = ref<string | null>(null)
 
 const dateInput = ref<HTMLInputElement | null>(null)
 const datePickerRef = ref<HTMLInputElement | null>(null)
+let nativeInput: HTMLInputElement | null = null
 
 const isInitialLoad = ref(true)
 
+function handleNativeInputClick(e: MouseEvent) {
+    e.stopPropagation()
+    openDatePicker()
+}
+
 function clearDate() {
     date.value = null
     dateFormattedReadOnly.value = null
@@ -88,15 +94,17 @@ watch(date, () => {
 onMounted(async () => {
     await nextTick()
     isInitialLoad.value = false
-    const nativeInput = (datePickerRef.value as any)?.$el?.querySelector('input')
+    nativeInput = (datePickerRef.value as any)?.$el?.querySelector('input')
     if (nativeInput) {
-        nativeInput.addEventListener('click', (e: MouseEvent) => {
-            e.stopPropagation()
-            openDatePicker()
-        })
+        nativeInput.addEventListener('click', handleNativeInputClick)
     }
 })
 
+onBeforeUnmount(() => {
+    nativeInput?.removeEventListener('click', handleNativeInputClick)
+    nativeInput = null
+})
+
 defineExpose({
     validate
 })

package/components/Input/DateTimePicker.vue

@@ -70,9 +70,15 @@ const inputPlaceholder = computed(
 
 const dateInput = ref<HTMLInputElement | null>(null);
 const dateTimePickerRef = ref<HTMLInputElement | null>(null);
+let nativeInput: HTMLInputElement | null = null;
 
 const isInitialLoad = ref(true);
 
+function handleNativeInputClick(e: MouseEvent) {
+  e.stopPropagation();
+  openDatePicker();
+}
+
 function openDatePicker() {
   setTimeout(() => {
     dateInput.value?.showPicker?.();
@@ -177,17 +183,19 @@ onMounted(async () => {
   await nextTick();
   isInitialLoad.value = false;
   // Wait until Vuetify renders its internal input
-  const nativeInput = (dateTimePickerRef.value as any)?.$el?.querySelector(
+  nativeInput = (dateTimePickerRef.value as any)?.$el?.querySelector(
     "input"
   );
   if (nativeInput) {
-    nativeInput.addEventListener("click", (e: MouseEvent) => {
-      e.stopPropagation();
-      openDatePicker();
-    });
+    nativeInput.addEventListener("click", handleNativeInputClick);
   }
 });
 
+onBeforeUnmount(() => {
+  nativeInput?.removeEventListener("click", handleNativeInputClick);
+  nativeInput = null;
+});
+
 defineExpose({
   validate,
 });

package/package.json

@@ -2,7 +2,7 @@
   "name": "@7365admin1/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "4.1.2-staging.245",
+  "version": "4.1.2-staging.246",
   "author": "7365admin1",
   "main": "./nuxt.config.ts",
   "//files": "What a consumer extending this layer actually loads. Without this npm ships the whole working tree - the changesets, the CI workflows, the render harness in tools/ and any scratch directory that happened to exist at publish time. Nuxt resolves a layer by directory, so every runtime directory below has to stay listed; adding a new top-level runtime directory means adding it here too.",