fix: resolve memory leaks by detached elements and event listeners

Author: sahilrajthapa

src/VueDatePicker/components/DatePicker/DpCalendar.vue

@@ -114,7 +114,7 @@
 </template>
 
 <script lang="ts" setup>
-    import { computed, nextTick, onMounted, ref } from 'vue';
+    import { computed, nextTick, onMounted, onUnmounted, ref } from 'vue';
     import { getISOWeek, getWeek } from 'date-fns';
 
     import {
@@ -216,6 +216,19 @@
         }
     });
 
+    onUnmounted(() => {
+        if (!defaultedConfig.value.noSwipe) {
+            if (calendarWrapRef.value) {
+                calendarWrapRef.value.removeEventListener('touchstart', onTouchStart);
+                calendarWrapRef.value.removeEventListener('touchend', onTouchEnd);
+                calendarWrapRef.value.removeEventListener('touchmove', onTouchMove);
+            }
+        }
+        if (props.monthChangeOnScroll && calendarWrapRef.value) {
+            calendarWrapRef.value.removeEventListener('wheel', onScroll);
+        }
+    });
+
     const getTransitionName = (isNext: boolean) => {
         if (isNext) return props.vertical ? 'vNext' : 'next';
         return props.vertical ? 'vPrevious' : 'previous';

src/VueDatePicker/components/DatepickerMenu.vue

@@ -217,13 +217,6 @@
                 focusMenu();
             }
             if (menu) {
-                const stopDefault = (event: Event) => {
-                    isMenuActive.value = true;
-                    if (defaultedConfig.value.allowPreventDefault) {
-                        event.preventDefault();
-                    }
-                    checkStopPropagation(event, defaultedConfig.value, true);
-                };
                 menu.addEventListener('pointerdown', stopDefault);
                 menu.addEventListener('mousedown', stopDefault);
             }
@@ -233,7 +226,14 @@
 
     onUnmounted(() => {
         window.removeEventListener('resize', getCalendarWidth);
-        document.addEventListener('mousedown', handleClickOutside);
+        document.removeEventListener('mousedown', handleClickOutside);
+
+        const menu = unrefElement(dpMenuRef);
+    
+        if (menu) {
+            menu.removeEventListener('pointerdown', stopDefault);
+            menu.removeEventListener('mousedown', stopDefault);
+        }
     });
 
     const getCalendarWidth = (): void => {
@@ -306,6 +306,14 @@
         }),
     );
 
+    const stopDefault = (event: Event) => {
+        isMenuActive.value = true;
+        if (defaultedConfig.value.allowPreventDefault) {
+            event.preventDefault();
+        }
+        checkStopPropagation(event, defaultedConfig.value, true);
+    };
+    
     const handleDpMenuClick = (ev: Event) => {
         checkStopPropagation(ev, defaultedConfig.value, true);
     };