convert date picker to standalone component

pdb-js/src/app/app.module.ts

@@ -64,7 +64,6 @@ import { MarkdownModule } from "ngx-markdown";
         MainPageComponent,
         HelpPageComponent,
         UploadPageComponent,
-        DatePickerComponent,
         VisualizationPageComponent,
         YAxisDefinitionComponent,
         QueryAutocompleteComponent,
@@ -91,6 +90,7 @@ import { MarkdownModule } from "ngx-markdown";
         AppRoutingModule,
         FormsModule,
         ReactiveFormsModule,
+        DatePickerComponent,
         DragDropModule,
         MatAutocompleteModule,
         MatBadgeModule,

pdb-js/src/app/components/datepicker/date-picker.component.ts

@@ -1,3 +1,4 @@
+import { OverlayModule } from "@angular/cdk/overlay";
 import {
   Component,
   EventEmitter,
@@ -8,9 +9,18 @@ import {
 import {
   ControlValueAccessor,
   FormControl,
+  FormsModule,
   NG_VALUE_ACCESSOR,
+  ReactiveFormsModule,
   Validators,
 } from "@angular/forms";
+import { MatButtonModule } from "@angular/material/button";
+import { MAT_DIALOG_DEFAULT_OPTIONS } from "@angular/material/dialog";
+import { MatFormFieldModule } from "@angular/material/form-field";
+import { MatInputModule } from "@angular/material/input";
+import { MatTabsModule } from "@angular/material/tabs";
+import { BrowserModule } from "@angular/platform-browser";
+import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
 
 export type DateType = "QUICK" | "RELATIVE" | "ABSOLUTE";
 
@@ -29,12 +39,27 @@ export class DatePickerChange {
 @Component({
   selector: "app-date-picker",
   templateUrl: "./date-picker.component.html",
+  standalone: true,
+  imports: [
+    BrowserModule,
+    MatButtonModule,
+    MatFormFieldModule,
+    MatInputModule,
+    MatTabsModule,
+    FormsModule,
+    ReactiveFormsModule,
+    OverlayModule
+  ],
   providers: [
     {
       provide: NG_VALUE_ACCESSOR,
       useExisting: forwardRef(() => DatePickerComponent),
       multi: true,
     },
+    {
+      provide: MAT_DIALOG_DEFAULT_OPTIONS,
+      useValue: { hasBackdrop: true },
+  }
   ],
 })
 export class DatePickerComponent implements ControlValueAccessor {