diff --git a/src/app/carnet/shipping/contact-dialog.component.ts b/src/app/carnet/shipping/contact-dialog.component.ts
new file mode 100644
index 0000000..2618543
--- /dev/null
+++ b/src/app/carnet/shipping/contact-dialog.component.ts
@@ -0,0 +1,61 @@
+import { Component, Inject } from '@angular/core';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
+import { AngularMaterialModule } from '../../shared/module/angular-material.module';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+@Component({
+ selector: 'app-contact-dialog',
+ imports: [AngularMaterialModule, CommonModule, FormsModule],
+ template: `
+
Select Contact
+
+
+
+ {{getContactLabel(contact)}}
+
+
+
+
+
+
+
+ `,
+ styles: [`
+ mat-radio-group {
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+ }
+ mat-radio-button {
+ margin: 4px 0;
+ }
+ `]
+})
+export class ContactDialogComponent {
+ selectedContact: any | null = null;
+
+ constructor(
+ public dialogRef: MatDialogRef,
+ @Inject(MAT_DIALOG_DATA) public data: { contacts: any[] }
+ ) { }
+
+ get contacts() {
+ return this.data.contacts;
+ }
+
+ onSelect(): void {
+ this.dialogRef.close(this.selectedContact);
+ }
+
+ onCancel(): void {
+ this.dialogRef.close();
+ }
+
+ getContactLabel(contact: any): string {
+ return `${contact.firstName} ${contact.middleInitial} ${contact.lastName},
+ ${contact.email}, ${contact.phone}`;
+ }
+}
\ No newline at end of file
diff --git a/src/app/carnet/shipping/shipping.component.html b/src/app/carnet/shipping/shipping.component.html
index 79a3731..3cbcee5 100644
--- a/src/app/carnet/shipping/shipping.component.html
+++ b/src/app/carnet/shipping/shipping.component.html
@@ -33,6 +33,10 @@
+
@@ -249,7 +253,7 @@