diff --git a/src/components/date-picker/date-picker.tsx b/src/components/date-picker/date-picker.tsx
index e8174de01e..3b3dfdbb2a 100644
--- a/src/components/date-picker/date-picker.tsx
+++ b/src/components/date-picker/date-picker.tsx
@@ -185,6 +185,10 @@ export class DatePicker {
         this.updateInternalFormatAndType();
     }
 
+    public disconnectedCallback() {
+        this.hideCalendar();
+    }
+
     public render() {
         const inputProps: any = {
             onAction: this.clearValue,