@flusys/ng-email 1.0.0-rc

package/fesm2022/flusys-ng-email-email-config-form.component-BK195yNS.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"flusys-ng-email-email-config-form.component-BK195yNS.mjs","sources":["../../../projects/ng-email/pages/config/email-config-form.component.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  inject,\n  signal,\n} from '@angular/core';\nimport { toSignal } from '@angular/core/rxjs-interop';\nimport { ActivatedRoute, Router } from '@angular/router';\nimport { APP_CONFIG, DEFAULT_APP_NAME } from '@flusys/ng-core';\nimport { LAYOUT_AUTH_STATE } from '@flusys/ng-layout';\nimport { AngularModule, PrimeModule } from '@flusys/ng-shared';\nimport { MessageService } from 'primeng/api';\nimport { EmailProviderEnum } from '../../enums/email-provider.enum';\nimport { IEmailConfig } from '../../interfaces/email-config.interface';\nimport { EmailConfigApiService } from '../../services/email-config-api.service';\n\n/**\n * Email configuration form component (create/edit)\n */\n@Component({\n  selector: 'lib-email-config-form',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [AngularModule, PrimeModule],\n  providers: [MessageService],\n  template: `\n    <div class=\"card\">\n      <!-- Header -->\n      <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 mb-4\">\n        <div>\n          <h3 class=\"text-lg sm:text-xl font-semibold m-0\">\n            {{ isEditMode() ? 'Edit Configuration' : 'New Configuration' }}\n          </h3>\n          @if (showCompanyInfo()) {\n            <p class=\"text-sm text-muted-color mt-1\">\n              Company: {{ currentCompanyName() }}\n            </p>\n          }\n        </div>\n      </div>\n\n      <!-- Form Fields -->\n      <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n          <!-- Common Fields -->\n          <div class=\"field\">\n            <label for=\"name\" class=\"block font-medium mb-2\"\n              >Configuration Name *</label\n            >\n            <input\n              pInputText\n              id=\"name\"\n              [ngModel]=\"formModel.name\"\n              (ngModelChange)=\"updateFormModel('name', $event)\"\n              class=\"w-full\"\n              placeholder=\"e.g., Production SMTP\"\n            />\n          </div>\n\n          <div class=\"field\">\n            <label for=\"provider\" class=\"block font-medium mb-2\"\n              >Email Provider *</label\n            >\n            <p-select\n              id=\"provider\"\n              [options]=\"providerOptions\"\n              [ngModel]=\"formModel.provider\"\n              (ngModelChange)=\"updateFormModel('provider', $event)\"\n              optionLabel=\"label\"\n              optionValue=\"value\"\n              placeholder=\"Select provider\"\n              class=\"w-full\"\n            />\n          </div>\n\n          <div class=\"field\">\n            <label for=\"fromEmail\" class=\"block font-medium mb-2\"\n              >From Email</label\n            >\n            <input\n              pInputText\n              id=\"fromEmail\"\n              [ngModel]=\"formModel.fromEmail\"\n              (ngModelChange)=\"updateFormModel('fromEmail', $event)\"\n              class=\"w-full\"\n              placeholder=\"noreply@example.com\"\n            />\n          </div>\n\n          <div class=\"field\">\n            <label for=\"fromName\" class=\"block font-medium mb-2\"\n              >From Name</label\n            >\n            <input\n              pInputText\n              id=\"fromName\"\n              [ngModel]=\"formModel.fromName\"\n              (ngModelChange)=\"updateFormModel('fromName', $event)\"\n              class=\"w-full\"\n              placeholder=\"FLUSYS\"\n            />\n          </div>\n\n          <div class=\"field flex items-center gap-2\">\n            <p-toggleswitch [ngModel]=\"formModel.isActive\" (ngModelChange)=\"updateFormModel('isActive', $event)\" />\n            <label>Active</label>\n          </div>\n\n          <div class=\"field flex items-center gap-2\">\n            <p-toggleswitch [ngModel]=\"formModel.isDefault\" (ngModelChange)=\"updateFormModel('isDefault', $event)\" />\n            <label>Set as Default</label>\n          </div>\n        </div>\n\n        <!-- SMTP Fields -->\n        @if (formModel.provider === providerEnum.SMTP) {\n          <div class=\"border-t border-surface mt-4 pt-4\">\n            <h3 class=\"font-semibold mb-4\">SMTP Settings</h3>\n            <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n              <div class=\"field\">\n                <label for=\"smtpHost\" class=\"block font-medium mb-2\"\n                  >SMTP Host *</label\n                >\n                <input\n                  pInputText\n                  id=\"smtpHost\"\n                  [ngModel]=\"formModel.smtpHost\"\n                  (ngModelChange)=\"updateFormModel('smtpHost', $event)\"\n                  class=\"w-full\"\n                  placeholder=\"smtp.gmail.com\"\n                />\n              </div>\n              <div class=\"field\">\n                <label for=\"smtpPort\" class=\"block font-medium mb-2\"\n                  >Port *</label\n                >\n                <p-inputNumber\n                  id=\"smtpPort\"\n                  [ngModel]=\"formModel.smtpPort\"\n                  (ngModelChange)=\"updateFormModel('smtpPort', $event)\"\n                  [useGrouping]=\"false\"\n                  class=\"w-full\"\n                  placeholder=\"587\"\n                />\n              </div>\n              <div class=\"field\">\n                <label for=\"smtpUser\" class=\"block font-medium mb-2\"\n                  >Username *</label\n                >\n                <input\n                  pInputText\n                  id=\"smtpUser\"\n                  [ngModel]=\"formModel.smtpUser\"\n                  (ngModelChange)=\"updateFormModel('smtpUser', $event)\"\n                  class=\"w-full\"\n                  placeholder=\"user@gmail.com\"\n                />\n              </div>\n              <div class=\"field\">\n                <label for=\"smtpPass\" class=\"block font-medium mb-2\"\n                  >Password *</label\n                >\n                <p-password\n                  id=\"smtpPass\"\n                  [ngModel]=\"formModel.smtpPass\"\n                  (ngModelChange)=\"updateFormModel('smtpPass', $event)\"\n                  [feedback]=\"false\"\n                  [toggleMask]=\"true\"\n                  styleClass=\"w-full\"\n                  inputStyleClass=\"w-full\"\n                  placeholder=\"App password\"\n                />\n              </div>\n              <div class=\"field flex items-center gap-2\">\n                <p-toggleswitch [ngModel]=\"formModel.smtpSecure\" (ngModelChange)=\"updateFormModel('smtpSecure', $event)\" />\n                <label>Use SSL/TLS (Port 465)</label>\n              </div>\n            </div>\n          </div>\n        }\n\n        <!-- SendGrid Fields -->\n        @if (formModel.provider === providerEnum.SENDGRID) {\n          <div class=\"border-t border-surface mt-4 pt-4\">\n            <h3 class=\"font-semibold mb-4\">SendGrid Settings</h3>\n            <div class=\"grid grid-cols-1 gap-4\">\n              <div class=\"field\">\n                <label for=\"sendgridApiKey\" class=\"block font-medium mb-2\"\n                  >API Key *</label\n                >\n                <p-password\n                  id=\"sendgridApiKey\"\n                  [ngModel]=\"formModel.sendgridApiKey\"\n                  (ngModelChange)=\"updateFormModel('sendgridApiKey', $event)\"\n                  [feedback]=\"false\"\n                  [toggleMask]=\"true\"\n                  styleClass=\"w-full\"\n                  inputStyleClass=\"w-full\"\n                  placeholder=\"SG.xxxx...\"\n                />\n              </div>\n            </div>\n          </div>\n        }\n\n        <!-- Mailgun Fields -->\n        @if (formModel.provider === providerEnum.MAILGUN) {\n          <div class=\"border-t border-surface mt-4 pt-4\">\n            <h3 class=\"font-semibold mb-4\">Mailgun Settings</h3>\n            <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n              <div class=\"field\">\n                <label for=\"mailgunApiKey\" class=\"block font-medium mb-2\"\n                  >API Key *</label\n                >\n                <p-password\n                  id=\"mailgunApiKey\"\n                  [ngModel]=\"formModel.mailgunApiKey\"\n                  (ngModelChange)=\"updateFormModel('mailgunApiKey', $event)\"\n                  [feedback]=\"false\"\n                  [toggleMask]=\"true\"\n                  styleClass=\"w-full\"\n                  inputStyleClass=\"w-full\"\n                  placeholder=\"key-xxxx...\"\n                />\n              </div>\n              <div class=\"field\">\n                <label for=\"mailgunDomain\" class=\"block font-medium mb-2\"\n                  >Domain *</label\n                >\n                <input\n                  pInputText\n                  id=\"mailgunDomain\"\n                  [ngModel]=\"formModel.mailgunDomain\"\n                  (ngModelChange)=\"updateFormModel('mailgunDomain', $event)\"\n                  class=\"w-full\"\n                  placeholder=\"mg.example.com\"\n                />\n              </div>\n              <div class=\"field\">\n                <label for=\"mailgunRegion\" class=\"block font-medium mb-2\"\n                  >Region</label\n                >\n                <p-select\n                  id=\"mailgunRegion\"\n                  [options]=\"regionOptions\"\n                  [ngModel]=\"formModel.mailgunRegion\"\n                  (ngModelChange)=\"updateFormModel('mailgunRegion', $event)\"\n                  optionLabel=\"label\"\n                  optionValue=\"value\"\n                  placeholder=\"Select region\"\n                  class=\"w-full\"\n                />\n              </div>\n            </div>\n          </div>\n        }\n\n        <!-- Form Actions -->\n        <div class=\"flex justify-end gap-2 mt-6 pt-4 border-t border-surface\">\n          <p-button\n            label=\"Cancel\"\n            severity=\"secondary\"\n            [outlined]=\"true\"\n            routerLink=\"../\"\n          />\n          <p-button\n            [label]=\"isEditMode() ? 'Update' : 'Create'\"\n            icon=\"pi pi-save\"\n            [loading]=\"isLoading()\"\n            (onClick)=\"onSave()\"\n          />\n        </div>\n    </div>\n\n    <p-toast />\n  `,\n})\nexport class EmailConfigFormComponent {\n  private readonly route = inject(ActivatedRoute);\n  private readonly router = inject(Router);\n  private readonly configService = inject(EmailConfigApiService);\n  private readonly messageService = inject(MessageService);\n  private readonly appConfig = inject(APP_CONFIG);\n  private readonly companyContext = inject(LAYOUT_AUTH_STATE, { optional: true });\n\n  // Route params as signal\n  private readonly routeParams = toSignal(this.route.paramMap);\n\n  readonly providerEnum = EmailProviderEnum;\n\n  readonly showCompanyInfo = computed(\n    () => this.appConfig.enableCompanyFeature && !!this.companyContext,\n  );\n  readonly currentCompanyName = computed(\n    () => this.companyContext?.currentCompanyInfo()?.name ?? DEFAULT_APP_NAME,\n  );\n\n  readonly isLoading = signal(false);\n  readonly existingConfig = signal<IEmailConfig | null>(null);\n  readonly isEditMode = computed(() => !!this.existingConfig());\n\n  readonly providerOptions = [\n    { label: 'SMTP', value: EmailProviderEnum.SMTP },\n    { label: 'SendGrid', value: EmailProviderEnum.SENDGRID },\n    { label: 'Mailgun', value: EmailProviderEnum.MAILGUN },\n  ];\n\n  readonly regionOptions = [\n    { label: 'US', value: 'us' },\n    { label: 'EU', value: 'eu' },\n  ];\n\n  /** Form model as signal for zoneless change detection */\n  private readonly _formModel = signal({\n    id: '',\n    name: '',\n    provider: EmailProviderEnum.SMTP as EmailProviderEnum,\n    fromEmail: '',\n    fromName: '',\n    isActive: true,\n    isDefault: false,\n    // SMTP\n    smtpHost: '',\n    smtpPort: 587,\n    smtpUser: '',\n    smtpPass: '',\n    smtpSecure: false,\n    // SendGrid\n    sendgridApiKey: '',\n    // Mailgun\n    mailgunApiKey: '',\n    mailgunDomain: '',\n    mailgunRegion: 'us',\n  });\n\n  /** Expose form model for template binding */\n  get formModel() {\n    return this._formModel();\n  }\n\n  /** Update form model field - triggers change detection */\n  updateFormModel<K extends keyof ReturnType<typeof this._formModel>>(\n    field: K,\n    value: ReturnType<typeof this._formModel>[K],\n  ): void {\n    this._formModel.update((m) => ({ ...m, [field]: value }));\n  }\n\n  constructor() {\n    // Effect to handle route-based initialization\n    effect(() => {\n      const params = this.routeParams();\n      if (!params) return;\n\n      const id = params.get('id');\n      if (id) {\n        this.loadConfig(id);\n      }\n    });\n  }\n\n  async loadConfig(id: string): Promise<void> {\n    this.isLoading.set(true);\n    try {\n      const response = await this.configService.findByIdAsync(id);\n      if (response.success && response.data) {\n        const config = response.data;\n        this.existingConfig.set(config);\n\n        this._formModel.set({\n          id: config.id,\n          name: config.name,\n          provider: config.provider,\n          fromEmail: config.fromEmail || '',\n          fromName: config.fromName || '',\n          isActive: config.isActive,\n          isDefault: config.isDefault ?? false,\n          // SMTP\n          smtpHost: config.config?.['host'] || '',\n          smtpPort: config.config?.['port'] || 587,\n          smtpUser: config.config?.['auth']?.['user'] || '',\n          smtpPass: config.config?.['auth']?.['pass'] || '',\n          smtpSecure: config.config?.['secure'] || false,\n          // SendGrid\n          sendgridApiKey: config.config?.['apiKey'] || '',\n          // Mailgun\n          mailgunApiKey: config.config?.['apiKey'] || '',\n          mailgunDomain: config.config?.['domain'] || '',\n          mailgunRegion: config.config?.['region'] || 'us',\n        });\n      }\n    } finally {\n      this.isLoading.set(false);\n    }\n  }\n\n  async onSave(): Promise<void> {\n    if (!this.formModel.name || !this.formModel.provider) {\n      this.messageService.add({\n        severity: 'warn',\n        summary: 'Validation',\n        detail: 'Please fill in all required fields.',\n      });\n      return;\n    }\n\n    // Build provider-specific config\n    let config: Record<string, any> = {};\n    switch (this.formModel.provider) {\n      case EmailProviderEnum.SMTP:\n        config = {\n          host: this.formModel.smtpHost,\n          port: this.formModel.smtpPort,\n          secure: this.formModel.smtpSecure,\n          auth: {\n            user: this.formModel.smtpUser,\n            pass: this.formModel.smtpPass,\n          },\n        };\n        break;\n      case EmailProviderEnum.SENDGRID:\n        config = {\n          apiKey: this.formModel.sendgridApiKey,\n        };\n        break;\n      case EmailProviderEnum.MAILGUN:\n        config = {\n          apiKey: this.formModel.mailgunApiKey,\n          domain: this.formModel.mailgunDomain,\n          region: this.formModel.mailgunRegion,\n        };\n        break;\n    }\n\n    this.isLoading.set(true);\n    try {\n      if (this.isEditMode()) {\n        await this.configService.updateAsync({\n          id: this.formModel.id,\n          name: this.formModel.name,\n          provider: this.formModel.provider,\n          config,\n          fromEmail: this.formModel.fromEmail || undefined,\n          fromName: this.formModel.fromName || undefined,\n          isActive: this.formModel.isActive,\n          isDefault: this.formModel.isDefault,\n        });\n      } else {\n        // ApiResourceService uses UpdateDto which requires id, cast to any for insert\n        await this.configService.insertAsync({\n          name: this.formModel.name,\n          provider: this.formModel.provider,\n          config,\n          fromEmail: this.formModel.fromEmail || undefined,\n          fromName: this.formModel.fromName || undefined,\n          isActive: this.formModel.isActive,\n          isDefault: this.formModel.isDefault,\n        } as any);\n      }\n\n      this.messageService.add({\n        severity: 'success',\n        summary: 'Success',\n        detail: `Configuration ${this.isEditMode() ? 'updated' : 'created'} successfully.`,\n      });\n\n      this.router.navigate(['../'], { relativeTo: this.route });\n    } catch {\n      // Error toast handled by global interceptor\n    } finally {\n      this.isLoading.set(false);\n    }\n  }\n}\n"],"names":["i3","i7","i9"],"mappings":"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"}

package/fesm2022/flusys-ng-email-email-config-list.component-DnIJdHdf.mjs

@@ -0,0 +1,541 @@
+import * as i0 from '@angular/core';
+import { inject, signal, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { Router } from '@angular/router';
+import { firstValueFrom } from 'rxjs';
+import { APP_CONFIG, DEFAULT_APP_NAME } from '@flusys/ng-core';
+import { LAYOUT_AUTH_STATE } from '@flusys/ng-layout';
+import { EMAIL_CONFIG_PERMISSIONS, AngularModule, PrimeModule, HasPermissionDirective } from '@flusys/ng-shared';
+import { ConfirmationService, MessageService } from 'primeng/api';
+import { EmailConfigApiService, EmailProviderEnum } from './flusys-ng-email.mjs';
+import * as i1 from '@angular/forms';
+import * as i2 from 'primeng/button';
+import * as i3 from 'primeng/confirmdialog';
+import * as i4 from 'primeng/dialog';
+import * as i5 from 'primeng/inputtext';
+import * as i7 from 'primeng/table';
+import * as i8 from 'primeng/tag';
+import * as i8$1 from 'primeng/toast';
+import * as i10 from 'primeng/tooltip';
+import * as i11 from '@angular/common';
+
+/**
+ * Email configuration list component
+ */
+class EmailConfigListComponent {
+    // Permission constants for template
+    EMAIL_CONFIG_PERMISSIONS = EMAIL_CONFIG_PERMISSIONS;
+    router = inject(Router);
+    configService = inject(EmailConfigApiService);
+    confirmationService = inject(ConfirmationService);
+    messageService = inject(MessageService);
+    appConfig = inject(APP_CONFIG);
+    companyContext = inject(LAYOUT_AUTH_STATE, { optional: true });
+    isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
+    configs = signal([], ...(ngDevMode ? [{ debugName: "configs" }] : []));
+    totalRecords = signal(0, ...(ngDevMode ? [{ debugName: "totalRecords" }] : []));
+    pageSize = signal(10, ...(ngDevMode ? [{ debugName: "pageSize" }] : []));
+    first = signal(0, ...(ngDevMode ? [{ debugName: "first" }] : []));
+    showCompanyInfo = computed(() => this.appConfig.enableCompanyFeature && !!this.companyContext, ...(ngDevMode ? [{ debugName: "showCompanyInfo" }] : []));
+    currentCompanyName = computed(() => this.companyContext?.currentCompanyInfo()?.name ?? DEFAULT_APP_NAME, ...(ngDevMode ? [{ debugName: "currentCompanyName" }] : []));
+    // Test dialog state (signals for zoneless change detection)
+    showTestDialog = signal(false, ...(ngDevMode ? [{ debugName: "showTestDialog" }] : []));
+    selectedConfig = signal(null, ...(ngDevMode ? [{ debugName: "selectedConfig" }] : []));
+    isSendingTest = signal(false, ...(ngDevMode ? [{ debugName: "isSendingTest" }] : []));
+    testRecipient = signal('', ...(ngDevMode ? [{ debugName: "testRecipient" }] : []));
+    onCreate() {
+        this.router.navigate(['/email/configs/new']);
+    }
+    onEdit(configId) {
+        this.router.navigate(['/email/configs', configId]);
+    }
+    async loadConfigs() {
+        this.isLoading.set(true);
+        try {
+            const response = await firstValueFrom(this.configService.getAll('', {
+                pagination: {
+                    currentPage: Math.floor(this.first() / this.pageSize()),
+                    pageSize: this.pageSize(),
+                },
+                filter: {},
+                select: [],
+                sort: {},
+            }));
+            if (response.success) {
+                this.configs.set(response.data ?? []);
+                this.totalRecords.set(response.meta?.total ?? 0);
+            }
+        }
+        finally {
+            this.isLoading.set(false);
+        }
+    }
+    onLazyLoad(event) {
+        this.first.set(event.first ?? 0);
+        this.pageSize.set(event.rows ?? 10);
+        this.loadConfigs();
+    }
+    getProviderIcon(provider) {
+        switch (provider) {
+            case EmailProviderEnum.SMTP:
+                return 'pi pi-server';
+            case EmailProviderEnum.SENDGRID:
+                return 'pi pi-cloud';
+            case EmailProviderEnum.MAILGUN:
+                return 'pi pi-cloud';
+            default:
+                return 'pi pi-envelope';
+        }
+    }
+    getProviderLabel(provider) {
+        switch (provider) {
+            case EmailProviderEnum.SMTP:
+                return 'SMTP';
+            case EmailProviderEnum.SENDGRID:
+                return 'SendGrid';
+            case EmailProviderEnum.MAILGUN:
+                return 'Mailgun';
+            default:
+                return provider || '';
+        }
+    }
+    getProviderSeverity(provider) {
+        switch (provider) {
+            case EmailProviderEnum.SMTP:
+                return 'info';
+            case EmailProviderEnum.SENDGRID:
+                return 'success';
+            case EmailProviderEnum.MAILGUN:
+                return 'warn';
+            default:
+                return 'secondary';
+        }
+    }
+    onTest(config) {
+        this.selectedConfig.set(config);
+        this.testRecipient.set('');
+        this.showTestDialog.set(true);
+    }
+    async sendTestEmail() {
+        const config = this.selectedConfig();
+        const recipient = this.testRecipient();
+        if (!config || !recipient) {
+            this.messageService.add({
+                severity: 'warn',
+                summary: 'Validation',
+                detail: 'Please enter a recipient email address.',
+            });
+            return;
+        }
+        this.isSendingTest.set(true);
+        try {
+            const response = await firstValueFrom(this.configService.sendTest(config.id, recipient));
+            if (response.data?.success) {
+                this.messageService.add({
+                    severity: 'success',
+                    summary: 'Success',
+                    detail: `Test email sent successfully! Message ID: ${response.data.messageId}`,
+                });
+                this.showTestDialog.set(false);
+            }
+            else {
+                this.messageService.add({
+                    severity: 'error',
+                    summary: 'Error',
+                    detail: response.data?.error || 'Failed to send test email.',
+                });
+            }
+        }
+        catch {
+            // Error toast handled by global interceptor
+        }
+        finally {
+            this.isSendingTest.set(false);
+        }
+    }
+    onDelete(config) {
+        this.confirmationService.confirm({
+            message: `Are you sure you want to delete "${config.name}"?`,
+            header: 'Delete Configuration',
+            icon: 'pi pi-exclamation-triangle',
+            acceptButtonStyleClass: 'p-button-danger',
+            accept: async () => {
+                try {
+                    await this.configService.deleteAsync({ id: config.id, type: 'delete' });
+                    this.messageService.add({
+                        severity: 'success',
+                        summary: 'Success',
+                        detail: 'Configuration deleted successfully.',
+                    });
+                    this.loadConfigs();
+                }
+                catch {
+                    // Error toast handled by global interceptor
+                }
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: EmailConfigListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: EmailConfigListComponent, isStandalone: true, selector: "lib-email-config-list", providers: [ConfirmationService, MessageService], ngImport: i0, template: `
+    <div class="card">
+      <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 mb-4">
+        <div>
+          <h3 class="text-lg sm:text-xl font-semibold m-0">Email Configurations</h3>
+          @if (showCompanyInfo()) {
+            <p class="text-sm text-muted-color mt-1">
+              Company: {{ currentCompanyName() }}
+            </p>
+          }
+        </div>
+        <p-button
+          *hasPermission="EMAIL_CONFIG_PERMISSIONS.CREATE"
+          label="New Configuration"
+          icon="pi pi-plus"
+          (onClick)="onCreate()"
+          styleClass="w-full sm:w-auto"
+        />
+      </div>
+
+      <div class="overflow-x-auto -mx-4 sm:mx-0">
+        <p-table
+          [value]="configs()"
+          [loading]="isLoading()"
+          [paginator]="totalRecords() > 0"
+          [rows]="pageSize()"
+          [first]="first()"
+          [totalRecords]="totalRecords()"
+          [lazy]="true"
+          (onLazyLoad)="onLazyLoad($event)"
+          [rowsPerPageOptions]="[10, 25, 50]"
+          styleClass="p-datatable-sm"
+          [tableStyle]="{ 'min-width': '50rem' }"
+        >
+          <ng-template #header>
+            <tr>
+              <th>Name</th>
+              <th>Provider</th>
+              <th class="hidden md:table-cell">From Email</th>
+              <th>Status</th>
+              <th class="hidden lg:table-cell">Created</th>
+              <th class="w-[120px]">Actions</th>
+            </tr>
+          </ng-template>
+
+          <ng-template #body let-config>
+            <tr>
+              <td>
+                <i [class]="getProviderIcon(config.provider)" class="mr-2 text-muted-color"></i>
+                {{ config.name }}
+                @if (config.isDefault) {
+                  <p-tag value="Default" severity="contrast" class="ml-2" />
+                }
+              </td>
+              <td>
+                <p-tag
+                  [value]="getProviderLabel(config.provider)"
+                  [severity]="getProviderSeverity(config.provider)"
+                />
+              </td>
+              <td class="hidden md:table-cell">{{ config.fromEmail || '-' }}</td>
+              <td>
+                <p-tag
+                  [value]="config.isActive ? 'Active' : 'Inactive'"
+                  [severity]="config.isActive ? 'success' : 'secondary'"
+                />
+              </td>
+              <td class="hidden lg:table-cell">{{ config.createdAt | date: 'short' }}</td>
+              <td>
+                <div class="flex gap-1">
+                  <p-button
+                    *hasPermission="EMAIL_CONFIG_PERMISSIONS.UPDATE"
+                    icon="pi pi-send"
+                    [text]="true"
+                    size="small"
+                    pTooltip="Test"
+                    (onClick)="onTest(config)"
+                  />
+                  <p-button
+                    *hasPermission="EMAIL_CONFIG_PERMISSIONS.UPDATE"
+                    icon="pi pi-pencil"
+                    [text]="true"
+                    severity="secondary"
+                    size="small"
+                    pTooltip="Edit"
+                    (onClick)="onEdit(config.id)"
+                  />
+                  <p-button
+                    *hasPermission="EMAIL_CONFIG_PERMISSIONS.DELETE"
+                    icon="pi pi-trash"
+                    [text]="true"
+                    severity="danger"
+                    size="small"
+                    pTooltip="Delete"
+                    (onClick)="onDelete(config)"
+                  />
+                </div>
+              </td>
+            </tr>
+          </ng-template>
+
+          <ng-template #emptymessage>
+            <tr>
+              <td colspan="6" class="text-center py-4 text-muted-color">
+                No email configurations found. Add a provider to start sending emails.
+              </td>
+            </tr>
+          </ng-template>
+        </p-table>
+      </div>
+    </div>
+
+    <!-- Test Email Dialog -->
+    <p-dialog
+      header="Test Email Configuration"
+      [visible]="showTestDialog()"
+      (visibleChange)="showTestDialog.set($event)"
+      [modal]="true"
+      [style]="{ width: '95vw', maxWidth: '400px' }"
+      [breakpoints]="{ '575px': '95vw' }"
+    >
+      <div class="grid gap-4">
+        <div class="field">
+          <label class="block font-medium mb-2">Configuration</label>
+          <input
+            pInputText
+            [value]="selectedConfig()?.name || ''"
+            class="w-full"
+            [disabled]="true"
+          />
+        </div>
+
+        <div class="field">
+          <label class="block font-medium mb-2">Provider</label>
+          <p-tag
+            [value]="getProviderLabel(selectedConfig()?.provider || '')"
+            [severity]="getProviderSeverity(selectedConfig()?.provider || '')"
+          />
+        </div>
+
+        <div class="field">
+          <label class="block font-medium mb-2">Recipient Email *</label>
+          <input
+            pInputText
+            [ngModel]="testRecipient()"
+            (ngModelChange)="testRecipient.set($event)"
+            class="w-full"
+            placeholder="recipient@example.com"
+            type="email"
+          />
+          <small class="text-muted-color mt-1 block">
+            A test email will be sent to this address
+          </small>
+        </div>
+      </div>
+
+      <ng-template #footer>
+        <p-button
+          label="Cancel"
+          severity="secondary"
+          [outlined]="true"
+          (onClick)="showTestDialog.set(false)"
+        />
+        <p-button
+          label="Send Test"
+          icon="pi pi-send"
+          [loading]="isSendingTest()"
+          (onClick)="sendTestEmail()"
+        />
+      </ng-template>
+    </p-dialog>
+
+    <p-confirmDialog />
+    <p-toast />
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: PrimeModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i3.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "modal", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "component", type: i4.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "maskMotionOptions", "motionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i7.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i8.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "component", type: i8$1.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "motionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i10.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "directive", type: HasPermissionDirective, selector: "[hasPermission]", inputs: ["hasPermission"] }, { kind: "pipe", type: i11.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: EmailConfigListComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'lib-email-config-list',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [AngularModule, PrimeModule, HasPermissionDirective],
+                    providers: [ConfirmationService, MessageService],
+                    template: `
+    <div class="card">
+      <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 mb-4">
+        <div>
+          <h3 class="text-lg sm:text-xl font-semibold m-0">Email Configurations</h3>
+          @if (showCompanyInfo()) {
+            <p class="text-sm text-muted-color mt-1">
+              Company: {{ currentCompanyName() }}
+            </p>
+          }
+        </div>
+        <p-button
+          *hasPermission="EMAIL_CONFIG_PERMISSIONS.CREATE"
+          label="New Configuration"
+          icon="pi pi-plus"
+          (onClick)="onCreate()"
+          styleClass="w-full sm:w-auto"
+        />
+      </div>
+
+      <div class="overflow-x-auto -mx-4 sm:mx-0">
+        <p-table
+          [value]="configs()"
+          [loading]="isLoading()"
+          [paginator]="totalRecords() > 0"
+          [rows]="pageSize()"
+          [first]="first()"
+          [totalRecords]="totalRecords()"
+          [lazy]="true"
+          (onLazyLoad)="onLazyLoad($event)"
+          [rowsPerPageOptions]="[10, 25, 50]"
+          styleClass="p-datatable-sm"
+          [tableStyle]="{ 'min-width': '50rem' }"
+        >
+          <ng-template #header>
+            <tr>
+              <th>Name</th>
+              <th>Provider</th>
+              <th class="hidden md:table-cell">From Email</th>
+              <th>Status</th>
+              <th class="hidden lg:table-cell">Created</th>
+              <th class="w-[120px]">Actions</th>
+            </tr>
+          </ng-template>
+
+          <ng-template #body let-config>
+            <tr>
+              <td>
+                <i [class]="getProviderIcon(config.provider)" class="mr-2 text-muted-color"></i>
+                {{ config.name }}
+                @if (config.isDefault) {
+                  <p-tag value="Default" severity="contrast" class="ml-2" />
+                }
+              </td>
+              <td>
+                <p-tag
+                  [value]="getProviderLabel(config.provider)"
+                  [severity]="getProviderSeverity(config.provider)"
+                />
+              </td>
+              <td class="hidden md:table-cell">{{ config.fromEmail || '-' }}</td>
+              <td>
+                <p-tag
+                  [value]="config.isActive ? 'Active' : 'Inactive'"
+                  [severity]="config.isActive ? 'success' : 'secondary'"
+                />
+              </td>
+              <td class="hidden lg:table-cell">{{ config.createdAt | date: 'short' }}</td>
+              <td>
+                <div class="flex gap-1">
+                  <p-button
+                    *hasPermission="EMAIL_CONFIG_PERMISSIONS.UPDATE"
+                    icon="pi pi-send"
+                    [text]="true"
+                    size="small"
+                    pTooltip="Test"
+                    (onClick)="onTest(config)"
+                  />
+                  <p-button
+                    *hasPermission="EMAIL_CONFIG_PERMISSIONS.UPDATE"
+                    icon="pi pi-pencil"
+                    [text]="true"
+                    severity="secondary"
+                    size="small"
+                    pTooltip="Edit"
+                    (onClick)="onEdit(config.id)"
+                  />
+                  <p-button
+                    *hasPermission="EMAIL_CONFIG_PERMISSIONS.DELETE"
+                    icon="pi pi-trash"
+                    [text]="true"
+                    severity="danger"
+                    size="small"
+                    pTooltip="Delete"
+                    (onClick)="onDelete(config)"
+                  />
+                </div>
+              </td>
+            </tr>
+          </ng-template>
+
+          <ng-template #emptymessage>
+            <tr>
+              <td colspan="6" class="text-center py-4 text-muted-color">
+                No email configurations found. Add a provider to start sending emails.
+              </td>
+            </tr>
+          </ng-template>
+        </p-table>
+      </div>
+    </div>
+
+    <!-- Test Email Dialog -->
+    <p-dialog
+      header="Test Email Configuration"
+      [visible]="showTestDialog()"
+      (visibleChange)="showTestDialog.set($event)"
+      [modal]="true"
+      [style]="{ width: '95vw', maxWidth: '400px' }"
+      [breakpoints]="{ '575px': '95vw' }"
+    >
+      <div class="grid gap-4">
+        <div class="field">
+          <label class="block font-medium mb-2">Configuration</label>
+          <input
+            pInputText
+            [value]="selectedConfig()?.name || ''"
+            class="w-full"
+            [disabled]="true"
+          />
+        </div>
+
+        <div class="field">
+          <label class="block font-medium mb-2">Provider</label>
+          <p-tag
+            [value]="getProviderLabel(selectedConfig()?.provider || '')"
+            [severity]="getProviderSeverity(selectedConfig()?.provider || '')"
+          />
+        </div>
+
+        <div class="field">
+          <label class="block font-medium mb-2">Recipient Email *</label>
+          <input
+            pInputText
+            [ngModel]="testRecipient()"
+            (ngModelChange)="testRecipient.set($event)"
+            class="w-full"
+            placeholder="recipient@example.com"
+            type="email"
+          />
+          <small class="text-muted-color mt-1 block">
+            A test email will be sent to this address
+          </small>
+        </div>
+      </div>
+
+      <ng-template #footer>
+        <p-button
+          label="Cancel"
+          severity="secondary"
+          [outlined]="true"
+          (onClick)="showTestDialog.set(false)"
+        />
+        <p-button
+          label="Send Test"
+          icon="pi pi-send"
+          [loading]="isSendingTest()"
+          (onClick)="sendTestEmail()"
+        />
+      </ng-template>
+    </p-dialog>
+
+    <p-confirmDialog />
+    <p-toast />
+  `,
+                }]
+        }] });
+
+export { EmailConfigListComponent };
+//# sourceMappingURL=flusys-ng-email-email-config-list.component-DnIJdHdf.mjs.map