@ieeesa-npm/groups 0.15.3 → 0.15.4

package/fesm2022/ieeesa-npm-groups.mjs

@@ -5,23 +5,25 @@ import { CommonModule } from '@angular/common';
 import * as i3$1 from '@angular/forms';
 import { FormsModule, Validators } from '@angular/forms';
 import * as i2$1 from '@ieeesa-npm/presentation';
-import { SlideToggleComponent, AlignType, FormControlType, DynamicFormComponent, MenuComponent, IconButtonComponent, TextTruncatedDirective, SearchType, ChipsType, TableColumnType, TableColumnSortDirection, ModalConfirmationComponent, DataTableComponent, ModalComponent, SearchComponent, SelectComponent, LegendComponent } from '@ieeesa-npm/presentation';
+import { SlideToggleComponent, AlignType, FormControlType, DynamicFormComponent, MenuComponent, IconButtonComponent, TextTruncatedDirective, SearchType, ExportFormat, PolicyConfirmationDialogComponent, ExportSuccessDialogComponent, ChipsType, TableColumnType, TableColumnSortDirection, ModalConfirmationComponent, DataTableComponent, ExportFormatPopoverComponent, ModalComponent, SearchComponent, SelectComponent, LegendComponent } from '@ieeesa-npm/presentation';
 import * as i2 from '@ieeesa-npm/utility';
 import { AlertsService } from '@ieeesa-npm/utility';
-import { HttpErrorResponse } from '@angular/common/http';
+import * as i1$1 from '@angular/common/http';
+import { HttpErrorResponse, HttpParams } from '@angular/common/http';
 import * as i1 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
-import { BehaviorSubject, map, catchError, Subject, takeUntil, forkJoin, merge } from 'rxjs';
+import { BehaviorSubject, map, catchError, Subject, takeUntil, forkJoin, merge, EMPTY } from 'rxjs';
 import { AlertType, FormStatus, ModalType } from '@ieeesa-npm/models';
 import * as i4 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import { FlatTreeControl } from '@angular/cdk/tree';
-import { takeUntil as takeUntil$1, map as map$1 } from 'rxjs/operators';
+import { takeUntil as takeUntil$1, map as map$1, catchError as catchError$1 } from 'rxjs/operators';
 import { MatIconModule } from '@angular/material/icon';
 import * as i4$1 from '@angular/material/tree';
 import { MatTreeModule } from '@angular/material/tree';
 import * as i5 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
+import { saveAs } from 'file-saver';
 
 var addUserRoster = {
 	heading: "New User",
@@ -279,6 +281,38 @@ var viewRoster = {
 	searchPlaceholderIndividual: "Search by Name/Email Address/Representing Org",
 	emptyFieldValueReplacedBy: "-"
 };
+var rosterExport = {
+	buttonLabel: "Export",
+	ariaLabel: "Export roster",
+	popoverTitle: "Select the file format for roster export.",
+	formatOptions: {
+		csv: {
+			label: "CSV",
+			subtitle: "Comma separated file",
+			ariaLabel: "Export roster as CSV"
+		},
+		excel: {
+			label: "Excel",
+			subtitle: "Spreadsheet File",
+			ariaLabel: "Export roster as Excel"
+		}
+	},
+	policyDialog: {
+		title: "IEEE Data Access and Use Policy",
+		bodyText: "The application is governed by IEEE's data access and use policy. Data can only be used for its original intended purpose. Click \"Confirm\" to export the data into a CSV/Excel file or click \"Cancel\" to cancel the download.",
+		policyUrl: "https://www.ieee.org/ieee-data-access-and-use-policy.html",
+		policyLinkText: "data access and use policy",
+		cancelLabel: "Cancel",
+		confirmLabel: "Confirm"
+	},
+	successDialog: {
+		message: "The file was downloaded successfully.",
+		closeButton: "Close"
+	},
+	messages: {
+		exportFailed: "Failed to export roster. Please try again."
+	}
+};
 var editUserRoles = {
 	heading: "Edit System User",
 	message: {
@@ -363,6 +397,7 @@ var constants = {
 	deleteGroup: deleteGroup,
 	deleteUsersGroup: deleteUsersGroup,
 	viewRoster: viewRoster,
+	rosterExport: rosterExport,
 	editUserRoles: editUserRoles,
 	errors: errors,
 	ariaLabel: ariaLabel
@@ -379,6 +414,7 @@ var screenTexts = /*#__PURE__*/Object.freeze({
     editGroup: editGroup,
     editUserRoles: editUserRoles,
     errors: errors,
+    rosterExport: rosterExport,
     viewGroups: viewGroups,
     viewRoster: viewRoster
 });
@@ -4286,6 +4322,390 @@ var TableColumnSchemaUserGroup;
     TableColumnSchemaUserGroup["MEMBER_TYPE"] = "memberType";
 })(TableColumnSchemaUserGroup || (TableColumnSchemaUserGroup = {}));
 
+/**
+ * RosterExportService owns the complete group roster export flow:
+ * 1. Manages export popover open/close state
+ * 2. Opens IEEE Data Access and Use Policy confirmation dialog
+ * 3. Calls the backend roster export API (blob response)
+ * 4. Triggers file download via File System Access API / file-saver
+ * 5. Shows success/error dialogs and toasts
+ *
+ * The component only needs to:
+ * - Subscribe to `isPopoverOpen$` for popover visibility
+ * - Call `togglePopover()` on Export button click
+ * - Call `onFormatSelected(format, groupId, groupName)` when user picks a format
+ *
+ * Follows the same pattern as MeetingExportService in the events-and-meetings library.
+ * @export
+ * @class RosterExportService
+ */
+class RosterExportService {
+    constructor(
+    // eslint-disable-next-line no-unused-vars
+    httpClient, 
+    // eslint-disable-next-line no-unused-vars
+    dialog, 
+    // eslint-disable-next-line no-unused-vars
+    alertService) {
+        this.httpClient = httpClient;
+        this.dialog = dialog;
+        this.alertService = alertService;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.constants = screenTexts;
+        this.destroy$ = new Subject();
+        /** Controls popover open/close state */
+        this.isPopoverOpenSubject$ = new BehaviorSubject(false);
+        this.isPopoverOpen$ = this.isPopoverOpenSubject$.asObservable();
+        /** Controls in-progress state for button disable */
+        this.isExportInProgressSubject$ = new BehaviorSubject(false);
+        this.isExportInProgress$ = this.isExportInProgressSubject$.asObservable();
+        /** Format options for the export popover */
+        this.exportFormatOptions = [
+            {
+                label: this.constants?.rosterExport?.formatOptions?.csv?.label ?? 'CSV',
+                value: ExportFormat.CSV,
+                ariaLabel: this.constants?.rosterExport?.formatOptions?.csv?.ariaLabel ?? 'Export roster as CSV',
+            },
+            {
+                label: this.constants?.rosterExport?.formatOptions?.excel?.label ?? 'Excel',
+                value: ExportFormat.EXCEL,
+                ariaLabel: this.constants?.rosterExport?.formatOptions?.excel?.ariaLabel ?? 'Export roster as Excel',
+            },
+        ];
+        /** Subtitle labels for the format selection cards */
+        this.exportFormatSubtitles = {
+            csv: this.constants?.rosterExport?.formatOptions?.csv?.subtitle ?? 'Comma separated file',
+            xls: this.constants?.rosterExport?.formatOptions?.excel?.subtitle ?? 'Spreadsheet File',
+        };
+        /** Popover title */
+        this.popoverTitle = this.constants?.rosterExport?.popoverTitle ?? 'Select the file format for roster export.';
+    }
+    /**
+     * Sets the API base URL for roster export calls.
+     * @param {string} url - Base URL (e.g., 'https://saappsapidev.ieee.org/v1')
+     * @memberof RosterExportService
+     */
+    setApiBaseUrl(url) {
+        this.apiBaseUrl = url;
+    }
+    /**
+     * Toggles the export format popover open/closed.
+     * Called by the component on Export button click.
+     * @memberof RosterExportService
+     */
+    togglePopover() {
+        this.isPopoverOpenSubject$.next(!this.isPopoverOpenSubject$.getValue());
+    }
+    /**
+     * Closes the export format popover.
+     * @memberof RosterExportService
+     */
+    closePopover() {
+        this.isPopoverOpenSubject$.next(false);
+    }
+    /**
+     * Handles format selection from the export popover.
+     * Closes popover, opens IEEE Policy dialog, on confirm triggers export.
+     * This is the main entry point called by the component after user picks a format.
+     * @param {ExportFormat} format - Selected format (CSV or XLS)
+     * @param {string} groupId - The group ID to export the roster for
+     * @param {string} groupName - The group name for filename generation
+     * @memberof RosterExportService
+     */
+    onFormatSelected(format, groupId, groupName) {
+        this.closePopover();
+        const dialogData = {
+            title: this.constants?.rosterExport?.policyDialog?.title ?? 'IEEE Data Access and Use Policy',
+            bodyText: this.constants?.rosterExport?.policyDialog?.bodyText ?? 'The application is governed by IEEE\'s data access and use policy. Data can only be used for its original intended purpose. Click "Confirm" to export the data into a CSV/Excel file or click "Cancel" to cancel the download.',
+            policyUrl: this.constants?.rosterExport?.policyDialog?.policyUrl ?? 'https://www.ieee.org/ieee-data-access-and-use-policy.html',
+            policyLinkText: this.constants?.rosterExport?.policyDialog?.policyLinkText ?? 'data access and use policy',
+            cancelLabel: this.constants?.rosterExport?.policyDialog?.cancelLabel ?? 'Cancel',
+            confirmLabel: this.constants?.rosterExport?.policyDialog?.confirmLabel ?? 'Confirm',
+        };
+        const dialogRef = this.dialog.open(PolicyConfirmationDialogComponent, {
+            data: dialogData,
+            width: '637px',
+            panelClass: ['ieeesa-policy-dialog'],
+        });
+        dialogRef.afterClosed()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((confirmed) => {
+            if (confirmed) {
+                this.startExport(format, groupId, groupName);
+            }
+        });
+    }
+    /**
+     * Starts the export after the user confirms the policy dialog.
+     *
+     * When the File System Access API is available, the native Save picker is opened
+     * HERE — synchronously within the confirm handler — while the user activation from
+     * the confirm click is still valid. (Opening it later, inside the async HTTP
+     * response callback, would exceed the activation window and the browser would
+     * reject it with a SecurityError.) The obtained file handle is then passed to the
+     * HTTP flow, which writes the downloaded bytes to it once the response arrives, so
+     * the success dialog is still shown only AFTER the file is saved.
+     *
+     * If the user cancels the picker we abort before making the request. If the API is
+     * unavailable (Firefox/Safari) we proceed without a handle and fall back to
+     * `saveAs()` after the response.
+     * @param {ExportFormat} format
+     * @param {string} groupId
+     * @param {string} groupName
+     * @memberof RosterExportService
+     */
+    startExport(format, groupId, groupName) {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const showSaveFilePicker = window.showSaveFilePicker;
+        if (typeof showSaveFilePicker !== 'function') {
+            // API unavailable: no handle; executeExport() will use the saveAs() fallback.
+            this.executeExport(format, groupId, groupName, null);
+            return;
+        }
+        const mimeType = format === ExportFormat.CSV
+            ? 'text/csv'
+            : 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
+        const extension = format === ExportFormat.CSV ? '.csv' : '.xlsx';
+        const suggestedName = this.buildFilename(groupName, format);
+        // Open the picker now, while the confirm-click activation is still valid.
+        showSaveFilePicker({
+            suggestedName,
+            types: [
+                {
+                    description: format === ExportFormat.CSV ? 'CSV File' : 'Excel File',
+                    accept: { [mimeType]: [extension] },
+                },
+            ],
+        })
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            .then((handle) => {
+            this.executeExport(format, groupId, groupName, handle);
+        })
+            .catch((error) => {
+            // User cancelled the Save dialog — abort silently, no request made.
+            if (error instanceof DOMException && error.name === 'AbortError') {
+                return;
+            }
+            // Any other picker error: fall back to the saveAs() flow.
+            this.executeExport(format, groupId, groupName, null);
+        });
+    }
+    /**
+     * Executes the roster export API call and writes the downloaded file.
+     * Endpoint: GET /v1/groups/roster/export/{groupId}?format=csv|xlsx
+     * When a pre-obtained file handle is provided (from the picker opened at confirm
+     * time) the bytes are written to it; otherwise it falls back to `saveAs()`.
+     * The success dialog is shown only after the file has been written.
+     * @param {ExportFormat} format - The selected export format
+     * @param {string} groupId - The group identifier
+     * @param {string} groupName - The group name for filename
+     * @param {FileSystemFileHandle | null} fileHandle - Handle from the Save picker, or null
+     * @memberof RosterExportService
+     */
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    executeExport(format, groupId, groupName, fileHandle) {
+        this.isExportInProgressSubject$.next(true);
+        // Backend expects 'csv' or 'xlsx'. The ExportFormat.EXCEL enum value is
+        // 'xls', so it must be mapped to 'xlsx' here — sending 'xls' is rejected
+        // with error code 1079.
+        const formatValue = format === ExportFormat.CSV ? 'csv' : 'xlsx';
+        const params = new HttpParams().set('format', formatValue);
+        const url = `${this.getExportApiUrl()}/groups/roster/export/${groupId}`;
+        this.httpClient
+            .get(url, {
+            params,
+            responseType: 'blob',
+            observe: 'response',
+        })
+            .pipe(map$1((response) => {
+            const filename = this.extractFilenameFromResponse(response, format, groupName);
+            return { blob: response.body, filename };
+        }), catchError$1(() => {
+            this.isExportInProgressSubject$.next(false);
+            this.alertService.showMessage({
+                status: 'custom',
+                message: this.constants?.rosterExport?.messages?.exportFailed ?? 'Failed to export roster. Please try again.',
+                alertType: AlertType.ERROR,
+                isCloseNeeded: true,
+            });
+            // Error is fully handled (alert shown). Complete the stream instead of
+            // rethrowing, so the next-only subscribe does not report it as an
+            // unhandled RxJS error.
+            return EMPTY;
+        }), takeUntil(this.destroy$))
+            .subscribe({
+            next: (result) => {
+                // Write to the pre-obtained handle (picker opened at confirm time) or fall
+                // back to saveAs(). Success dialog only shows after the file is written.
+                this.downloadFile(result.blob, result.filename, format, fileHandle)
+                    .then(({ saved }) => {
+                    this.isExportInProgressSubject$.next(false);
+                    if (saved) {
+                        this.showExportSuccessDialogAfterDownload(result.filename);
+                    }
+                })
+                    .catch(() => {
+                    this.isExportInProgressSubject$.next(false);
+                    this.alertService.showMessage({
+                        status: 'custom',
+                        message: this.constants?.rosterExport?.messages?.exportFailed ?? 'Failed to export roster. Please try again.',
+                        alertType: AlertType.ERROR,
+                        isCloseNeeded: true,
+                    });
+                });
+            },
+        });
+    }
+    /**
+     * Shows the export success dialog after a successful file download.
+     * @param {string} filename - The downloaded filename
+     * @memberof RosterExportService
+     */
+    showExportSuccessDialogAfterDownload(filename) {
+        const successMessage = this.constants?.rosterExport?.successDialog?.message ?? 'The file was downloaded successfully.';
+        const closeLabel = this.constants?.rosterExport?.successDialog?.closeButton ?? 'Close';
+        const dialogData = {
+            message: successMessage,
+            filename,
+            closeLabel,
+        };
+        this.dialog.open(ExportSuccessDialogComponent, {
+            data: dialogData,
+            width: '467px',
+            panelClass: ['ieeesa-export-success-dialog-panel'],
+            autoFocus: false,
+        });
+    }
+    /**
+     * Returns the API base URL for roster export.
+     * @return {string}
+     * @memberof RosterExportService
+     */
+    getExportApiUrl() {
+        if (!this.apiBaseUrl) {
+            throw new Error('RosterExportService apiBaseUrl is not set. Call setApiBaseUrl() before export.');
+        }
+        // apiBaseUrl already carries the version segment (e.g. '.../v1'), same as every
+        // other GroupsService call which is built as `${apiBaseUrl}/groups/...`. So the
+        // caller only appends '/groups/roster/export/{groupId}' — the version is NOT
+        // repeated here. Strip a trailing slash to avoid a double slash before '/groups'.
+        return this.apiBaseUrl.replace(/\/+$/, '');
+    }
+    /**
+     * Extracts filename from Content-Disposition header.
+     * Falls back to buildFilename() if header is missing.
+     * @param {HttpResponse<Blob>} response
+     * @param {ExportFormat} format
+     * @param {string} groupName
+     * @return {string}
+     * @memberof RosterExportService
+     */
+    extractFilenameFromResponse(response, format, groupName) {
+        const contentDisposition = response.headers.get('Content-Disposition');
+        if (contentDisposition) {
+            const filenameMatch = contentDisposition.match(/filename="?([^"]+)"?/);
+            if (filenameMatch && filenameMatch[1]) {
+                return filenameMatch[1].replace(/[/\\:*?"<>|]/g, '_').substring(0, 200);
+            }
+        }
+        return this.buildFilename(groupName, format);
+    }
+    /**
+     * Builds a sanitized filename for the roster export.
+     * Pattern: {SanitizedGroupName}_Roster.{extension}
+     * @param {string} groupName
+     * @param {ExportFormat} format
+     * @return {string}
+     * @memberof RosterExportService
+     */
+    buildFilename(groupName, format) {
+        const sanitized = this.sanitizeGroupName(groupName);
+        const extension = format === ExportFormat.CSV ? 'csv' : 'xlsx';
+        return `${sanitized}_Roster.${extension}`;
+    }
+    /**
+     * Sanitizes the group name for use in a filename.
+     * Replaces non-alphanumeric characters (except hyphen/underscore) with underscore,
+     * collapses consecutive underscores, and truncates to 200 chars.
+     * @param {string} groupName
+     * @return {string}
+     * @memberof RosterExportService
+     */
+    sanitizeGroupName(groupName) {
+        if (!groupName) {
+            return 'Unnamed_Group';
+        }
+        const sanitized = groupName
+            .replace(/[^a-zA-Z0-9_-]/g, '_')
+            .replace(/_+/g, '_')
+            .substring(0, 200);
+        return sanitized || 'Unnamed_Group';
+    }
+    /**
+     * Writes the downloaded bytes to disk and resolves ONLY when the save has actually
+     * completed.
+     *
+     * The Save picker is opened earlier (at policy-confirm time, while user activation
+     * is still valid — see {@link startExport}); this method only writes to the handle
+     * it produced. That keeps the "success dialog after save" ordering without hitting
+     * the SecurityError that occurs when the picker is opened from this async callback.
+     *
+     * When no handle is provided (File System Access API unavailable, or the picker
+     * errored), we fall back to FileSaver's `saveAs()`, which resolves immediately.
+     * @param {Blob} blob - The file contents
+     * @param {string} filename - The suggested filename (used by the saveAs fallback)
+     * @param {ExportFormat} format - The selected export format (drives MIME type)
+     * @param {FileSystemFileHandle | null} fileHandle - Handle from the Save picker, or null
+     * @return {Promise<{ saved: boolean }>} Resolves with `saved: true` once written.
+     * @memberof RosterExportService
+     */
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    async downloadFile(blob, filename, format, fileHandle) {
+        const mimeType = format === ExportFormat.CSV
+            ? 'text/csv'
+            : 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
+        const typedBlob = new Blob([blob], { type: mimeType });
+        // No handle (API unavailable or picker errored) → standard download.
+        if (!fileHandle) {
+            saveAs(typedBlob, filename);
+            return { saved: true };
+        }
+        // Write to the location the user already chose at confirm time.
+        const writable = await fileHandle.createWritable();
+        await writable.write(typedBlob);
+        await writable.close();
+        return { saved: true };
+    }
+    /**
+     * Cleanup — call from the component's ngOnDestroy.
+     * @memberof RosterExportService
+     */
+    destroy() {
+        this.destroy$.next(true);
+        // This service is providedIn: 'root' (singleton), so its state survives
+        // navigation. Reset the UI-facing flags so a new roster component instance
+        // does not inherit a stale-open popover or a permanently-disabled export
+        // button if the user left the page mid-export or with the popover open.
+        this.isPopoverOpenSubject$.next(false);
+        this.isExportInProgressSubject$.next(false);
+        // Signal current takeUntil subscriptions to unsubscribe, then re-create the
+        // subject. This service is a providedIn: 'root' singleton whose destroy() is
+        // called on every ViewRosterComponent teardown; completing destroy$ would
+        // permanently close it, so later exports could never be torn down. A fresh
+        // subject keeps the teardown channel usable across component lifecycles.
+        this.destroy$.next(true);
+        this.destroy$ = new Subject();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RosterExportService, deps: [{ token: i1$1.HttpClient }, { token: i1.MatDialog }, { token: i2.AlertsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RosterExportService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RosterExportService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.HttpClient }, { type: i1.MatDialog }, { type: i2.AlertsService }]; } });
+
 /**
  * ViewRosterComponent implements the functionalities to add, edit, delete user to group roster, assign and modify roles(s) to the group users, and search user from roster.
  * @export
@@ -4303,12 +4723,15 @@ class ViewRosterComponent {
     // eslint-disable-next-line no-unused-vars
     cdr, 
     // eslint-disable-next-line no-unused-vars
-    globalErrorHandlerService) {
+    globalErrorHandlerService, 
+    // eslint-disable-next-line no-unused-vars
+    rosterExportService) {
         this.dialog = dialog;
         this.groupService = groupService;
         this.alertService = alertService;
         this.cdr = cdr;
         this.globalErrorHandlerService = globalErrorHandlerService;
+        this.rosterExportService = rosterExportService;
         this.destroy$ = new Subject();
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         this.constants = screenTexts;
@@ -4342,6 +4765,7 @@ class ViewRosterComponent {
     }
     ngOnInit() {
         this.userInfo = this.groupService?.getUserInfo();
+        this.rosterExportService.setApiBaseUrl(this.groupService?.apiBaseUrl);
         const groupType = this.groupService.getBusinessRuleOfSelectedGroup();
         this.hasClassification = groupType?.hasClassification ?? false;
         this.groupRosterType = groupType?.rosterType;
@@ -4997,21 +5421,53 @@ class ViewRosterComponent {
             isCloseNeeded: true,
         });
     }
+    /**
+     * Toggles the export format popover — delegates to RosterExportService.
+     * @memberof ViewRosterComponent
+     */
+    onExportClick() {
+        this.rosterExportService.togglePopover();
+    }
+    /**
+     * Handles export format selection — delegates to RosterExportService using the
+     * currently selected group's id and name.
+     * @param {ExportFormat} format
+     * @memberof ViewRosterComponent
+     */
+    onExportFormatSelected(format) {
+        const selectedGroupInfo = this.groupService?.getSelectedGroupInfo();
+        const groupId = selectedGroupInfo?.groupId;
+        // Without a group id the export URL would be malformed, so guard here
+        // instead of firing a bad request.
+        if (!groupId) {
+            this.showAlertMessage(this.constants?.errors?.default, AlertType.ERROR);
+            return;
+        }
+        const groupName = selectedGroupInfo?.groupName ?? '';
+        this.rosterExportService.onFormatSelected(format, groupId, groupName);
+    }
     /**
      * NgOnDestroy performs necessary cleanup tasks, such as unsubscribing from subscription when the component is being destroyed.
      * @memberof ViewRosterComponent
      */
     ngOnDestroy() {
+        this.rosterExportService.destroy();
         this.destroy$.next(true);
         this.destroy$.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ViewRosterComponent, deps: [{ token: i1.MatDialog }, { token: GroupsService }, { token: i2.AlertsService }, { token: i0.ChangeDetectorRef }, { token: i2.GlobalErrorHandlerService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ViewRosterComponent, isStandalone: true, selector: "ieeesa-view-roster", ngImport: i0, template: "<ieeesa-data-table\r\n  [tableDataInfo]=\"tableData\"\r\n  [columnSchemaInfo]=\"columnSchema\"\r\n  [searchPlaceHolderText]=\"searchPlaceholderText\"\r\n  [tableActions]=\"rosterActions\"\r\n  [isCellTextOverflowEllipsis]=\"true\"\r\n  [filters]=\"filters\"\r\n  [className]=\"dataTableClassName\"\r\n  [selectedFilterOptions]=\"filterOptions\"\r\n  [defaultSortedColumn]=\"defaultSortedColumn\"\r\n  (selectedFilter)=\"setSelectedFilterOptions($event)\"\r\n  (removeFilteredOption)=\"onFilterGroupUsers($event)\"\r\n  (filteredOptions)=\"onFilterGroupUsers($event)\"\r\n  (searchedValue)=\"onSearchGroupUsers($event)\"\r\n  (selectedRowToEdit)=\"onEditUserRoles($event)\"\r\n  (selectedRowsToDelete)=\"openUserDeleteConfirmationModal($event)\"\r\n  (sortChange)=\"onSortGroupUsers($event)\"\r\n  (addRow)=\"onAddNewUser()\"\r\n></ieeesa-data-table>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.5625rem;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25rem;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625rem;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-45{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.813rem;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375rem;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375rem;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-32{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2rem;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125rem;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875rem;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5rem;line-height:32px;color:#00629b;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625rem;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1.5rem;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5rem;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-btn-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#00629b;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125rem;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-16{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:20px;color:#1c1b1f;letter-spacing:.015625em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-body-sm-12{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.75rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-body-color-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:18px;color:#49454f;letter-spacing:.025em}.ieeesa-body-sm-bold-14{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5rem;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button,.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button,.mat-mdc-button.mat-mdc-button-base.mat-text-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:focus{background:#1f75a7}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:focus{background:#f0f5f9}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:#1d192b1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:#1c1b1f1f;color:#1c1b1f;opacity:.38}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button{background-color:#fff;border:1px solid #00629b;color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:hover{background-color:#6750a414}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:focus{background-color:#f0f5f9}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:active{background:#6750a41f}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:disabled{border:1px solid rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.mat-mdc-button.mat-mdc-button-base.mat-text-button{color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-text-button:hover,.mat-mdc-button.mat-mdc-button-base.mat-text-button:active{background:#6750a414}.mat-mdc-button.mat-mdc-button-base.mat-text-button:disabled{color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.ieeesa-view-more-or-less-button{border:none;background:none;text-decoration:underline;color:#00629b}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}.no-bg-color-btn{color:#00629b;border-radius:3px;border:1px solid #00629b;min-height:40px;height:auto}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane .mat-mdc-tooltip .mdc-tooltip__surface{color:#525252;padding:6px 12px;font-family:Calibri Regular;font-size:1rem;border:1px solid #cac4d0;background:#fff;box-shadow:0 4px 8px #00000040;max-width:unset!important}.cdk-overlay-pane .mat-mdc-option .mdc-list-item__primary-text{font-family:Calibri Regular!important}.cdk-overlay-pane.ieeesa-modal-confirm-dialog,.cdk-overlay-pane.ieeesa-modal-dialog,.cdk-overlay-pane.ieeesa-alert-dialog{width:100%;min-width:312px}.mat-mdc-form-field{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:24px;color:#49454f;letter-spacing:.03125em}.ieeesa-cancel-modal-confirm-dialog{width:25vw!important}.ieeesa-cancel-modal-confirm-dialog .ieeesa-confirmation{padding:1.5em 1.5em 1em}.ieeesa-cancel-modal-confirm-dialog .ieeesa-confirmation .mat-mdc-dialog-content{text-align:center;padding:0 0 1em!important}.mat-mdc-button,.mat-mdc-outlined-button{--mat-mdc-button-persistent-ripple-color: unset}@media (max-width: 768px){.ieeesa-cancel-modal-confirm-dialog{width:90vw!important}}.ieeesa-wrapper-border{border:1px solid #b2b7be;border-top:none;padding:1.5em;border-radius:0 0 4px 4px}.ieeesa-modal-dialog.ieeesa-view-roster{max-width:90vw!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-modal{box-shadow:0 3px #11b7e5 inset,0 4px 24px #00000080;padding-bottom:3em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-modal .mat-mdc-dialog-content{padding:0;min-height:405px}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__content{height:500px}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__no-table-data{height:auto}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__filter{padding-bottom:1em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-filter{--mdc-checkbox-state-layer-size: 2.5em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-filter .ieeesa-chip .mat-mdc-chip{background-color:#fffbfe!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .cdk-column-select{width:7%}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-system-users-roster .cdk-column-name{width:11.25em;max-width:11.25em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-system-users-roster .cdk-column-email{width:15em;max-width:15em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-name{width:11em;max-width:11em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-email{width:13em;max-width:13em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-memberType,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-role,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-employer{width:8.25em;max-width:8.25em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-org_name,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column{width:10em;max-width:10em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-classification{width:15em;max-width:15em}@media (max-width: 576px){.ieeesa-modal-dialog.ieeesa-view-roster{max-width:95vw!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table{padding-right:0!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DataTableComponent, selector: "ieeesa-data-table", inputs: ["tableDataInfo", "nestedTableDataInfo", "columnSchemaInfo", "nestedTableColumnSchemaInfo", "tableActions", "hasNestedTable", "tableColumnActions", "tableColumnActionMenuSize", "tableRowActions", "nestedTableRowActions", "caption", "viewAll", "paginatorConfig", "nestedPaginatorConfig", "legends", "pageIndex", "pageSize", "searchPlaceHolderText", "rowEditButton", "rowDeleteButton", "tableEditButton", "tableDeleteButton", "rowExpandButton", "rowCollapseButton", "isNestedTableHeaderNeeded", "addButton", "defaultColumnSortDirection", "defaultSortedColumn", "isClearSortNeeded", "filters", "selectedFilterOptions", "appliedFilterOptions", "searchType", "className", "searchSupportMessage", "inbuiltSortingNeeded", "isCellTextOverflowEllipsis", "isTableHeaderNeeded", "tableColumnsHeaderText", "verticalColumnHeaderNumber", "scrollbarSupportMessage", "isScrollSupportMessageNeeded", "isStickyHeaderNeeded", "customStickyHeaderNeeded", "headerElementClassName", "minCharToSearch", "searchResultMessage", "rowMenuActionIcon", "canDisableCheckbox", "isEllipsisRequiredForLink"], outputs: ["rowSelected", "selectedRowToEdit", "selectedRowToDelete", "selectedRowsToDelete", "rowLink", "addRow", "columnDataOnRowLinkClick", "menuActionClick", "selectActionMenu", "paginationChange", "selectedFilter", "removeFilteredOption", "filteredOptions", "searchedValue", "sortChange", "selectedRowsInfo", "rowExpansionClick", "tableColumnMenuActionClick", "tableColumnMenuToggleButton", "rowSlideToggle"] }, { kind: "ngmodule", type: MatDialogModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ViewRosterComponent, deps: [{ token: i1.MatDialog }, { token: GroupsService }, { token: i2.AlertsService }, { token: i0.ChangeDetectorRef }, { token: i2.GlobalErrorHandlerService }, { token: RosterExportService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ViewRosterComponent, isStandalone: true, selector: "ieeesa-view-roster", ngImport: i0, template: "<ieeesa-data-table\r\n  [tableDataInfo]=\"tableData\"\r\n  [columnSchemaInfo]=\"columnSchema\"\r\n  [searchPlaceHolderText]=\"searchPlaceholderText\"\r\n  [tableActions]=\"rosterActions\"\r\n  [isCellTextOverflowEllipsis]=\"true\"\r\n  [filters]=\"filters\"\r\n  [className]=\"dataTableClassName\"\r\n  [selectedFilterOptions]=\"filterOptions\"\r\n  [defaultSortedColumn]=\"defaultSortedColumn\"\r\n  (selectedFilter)=\"setSelectedFilterOptions($event)\"\r\n  (removeFilteredOption)=\"onFilterGroupUsers($event)\"\r\n  (filteredOptions)=\"onFilterGroupUsers($event)\"\r\n  (searchedValue)=\"onSearchGroupUsers($event)\"\r\n  (selectedRowToEdit)=\"onEditUserRoles($event)\"\r\n  (selectedRowsToDelete)=\"openUserDeleteConfirmationModal($event)\"\r\n  (sortChange)=\"onSortGroupUsers($event)\"\r\n  (addRow)=\"onAddNewUser()\"\r\n>\r\n  <!-- Export Roster Button + Popover \u2014 projected into the data-table action row,\r\n       inline after the delete icon. -->\r\n  <div dataTableActions class=\"ieeesa-view-roster__export-wrapper\">\r\n    <button\r\n      mat-button\r\n      class=\"mat-tertiary-button ieeesa-view-roster__export-btn\"\r\n      type=\"button\"\r\n      [attr.aria-label]=\"constants?.rosterExport?.ariaLabel\"\r\n      [disabled]=\"rosterExportService.isExportInProgress$ | async\"\r\n      (click)=\"onExportClick()\"\r\n    >\r\n      <svg class=\"ieeesa-view-roster__export-btn-icon\" aria-hidden=\"true\">\r\n        <use xlink:href=\"assets/images/sprites/sprites.svg#icon-export\"></use>\r\n      </svg>\r\n      {{ constants?.rosterExport?.buttonLabel }}\r\n    </button>\r\n\r\n    <ieeesa-export-format-popover\r\n      [formatOptions]=\"rosterExportService.exportFormatOptions\"\r\n      [isOpen]=\"(rosterExportService.isPopoverOpen$ | async) ?? false\"\r\n      [popoverTitle]=\"rosterExportService.popoverTitle\"\r\n      [formatSubtitles]=\"rosterExportService.exportFormatSubtitles\"\r\n      (formatSelected)=\"onExportFormatSelected($event)\"\r\n      (closed)=\"rosterExportService.closePopover()\"\r\n    ></ieeesa-export-format-popover>\r\n  </div>\r\n</ieeesa-data-table>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.5625rem;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25rem;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625rem;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-45{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.813rem;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375rem;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375rem;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-32{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2rem;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125rem;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875rem;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5rem;line-height:32px;color:#00629b;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625rem;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1.5rem;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5rem;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-btn-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#00629b;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125rem;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-16{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:20px;color:#1c1b1f;letter-spacing:.015625em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-body-sm-12{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.75rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-body-color-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:18px;color:#49454f;letter-spacing:.025em}.ieeesa-body-sm-bold-14{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5rem;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button,.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button,.mat-mdc-button.mat-mdc-button-base.mat-text-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:focus{background:#1f75a7}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:focus{background:#f0f5f9}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:#1d192b1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:#1c1b1f1f;color:#1c1b1f;opacity:.38}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button{background-color:#fff;border:1px solid #00629b;color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:hover{background-color:#6750a414}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:focus{background-color:#f0f5f9}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:active{background:#6750a41f}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:disabled{border:1px solid rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.mat-mdc-button.mat-mdc-button-base.mat-text-button{color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-text-button:hover,.mat-mdc-button.mat-mdc-button-base.mat-text-button:active{background:#6750a414}.mat-mdc-button.mat-mdc-button-base.mat-text-button:disabled{color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.ieeesa-view-more-or-less-button{border:none;background:none;text-decoration:underline;color:#00629b}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}.no-bg-color-btn{color:#00629b;border-radius:3px;border:1px solid #00629b;min-height:40px;height:auto}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane .mat-mdc-tooltip .mdc-tooltip__surface{color:#525252;padding:6px 12px;font-family:Calibri Regular;font-size:1rem;border:1px solid #cac4d0;background:#fff;box-shadow:0 4px 8px #00000040;max-width:unset!important}.cdk-overlay-pane .mat-mdc-option .mdc-list-item__primary-text{font-family:Calibri Regular!important}.cdk-overlay-pane.ieeesa-modal-confirm-dialog,.cdk-overlay-pane.ieeesa-modal-dialog,.cdk-overlay-pane.ieeesa-alert-dialog{width:100%;min-width:312px}.mat-mdc-form-field{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:24px;color:#49454f;letter-spacing:.03125em}.ieeesa-cancel-modal-confirm-dialog{width:25vw!important}.ieeesa-cancel-modal-confirm-dialog .ieeesa-confirmation{padding:1.5em 1.5em 1em}.ieeesa-cancel-modal-confirm-dialog .ieeesa-confirmation .mat-mdc-dialog-content{text-align:center;padding:0 0 1em!important}.mat-mdc-button,.mat-mdc-outlined-button{--mat-mdc-button-persistent-ripple-color: unset}@media (max-width: 768px){.ieeesa-cancel-modal-confirm-dialog{width:90vw!important}}.ieeesa-wrapper-border{border:1px solid #b2b7be;border-top:none;padding:1.5em;border-radius:0 0 4px 4px}.ieeesa-modal-dialog.ieeesa-view-roster{max-width:90vw!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-modal{box-shadow:0 3px #11b7e5 inset,0 4px 24px #00000080;padding-bottom:3em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-modal .mat-mdc-dialog-content{padding:0;min-height:405px}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__content{height:500px}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__no-table-data{height:auto}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__filter{padding-bottom:1em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-filter{--mdc-checkbox-state-layer-size: 2.5em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-filter .ieeesa-chip .mat-mdc-chip{background-color:#fffbfe!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .cdk-column-select{width:7%}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-system-users-roster .cdk-column-name{width:11.25em;max-width:11.25em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-system-users-roster .cdk-column-email{width:15em;max-width:15em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-name{width:11em;max-width:11em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-email{width:13em;max-width:13em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-memberType,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-role,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-employer{width:8.25em;max-width:8.25em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-org_name,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column{width:10em;max-width:10em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-classification{width:15em;max-width:15em}@media (max-width: 576px){.ieeesa-modal-dialog.ieeesa-view-roster{max-width:95vw!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table{padding-right:0!important}}.ieeesa-view-roster__export-wrapper{position:relative}.ieeesa-view-roster__export-btn.mat-mdc-button.mat-mdc-button-base{display:inline-flex;flex-direction:row;align-items:center;gap:6px;font-size:13px;white-space:nowrap}.ieeesa-view-roster__export-btn-icon{width:16px;height:16px;flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "component", type: DataTableComponent, selector: "ieeesa-data-table", inputs: ["tableDataInfo", "nestedTableDataInfo", "columnSchemaInfo", "nestedTableColumnSchemaInfo", "tableActions", "hasNestedTable", "tableColumnActions", "tableColumnActionMenuSize", "tableRowActions", "nestedTableRowActions", "caption", "viewAll", "paginatorConfig", "nestedPaginatorConfig", "legends", "pageIndex", "pageSize", "searchPlaceHolderText", "rowEditButton", "rowDeleteButton", "tableEditButton", "tableDeleteButton", "rowExpandButton", "rowCollapseButton", "isNestedTableHeaderNeeded", "addButton", "defaultColumnSortDirection", "defaultSortedColumn", "isClearSortNeeded", "filters", "selectedFilterOptions", "appliedFilterOptions", "searchType", "className", "searchSupportMessage", "inbuiltSortingNeeded", "isCellTextOverflowEllipsis", "isTableHeaderNeeded", "tableColumnsHeaderText", "verticalColumnHeaderNumber", "scrollbarSupportMessage", "isScrollSupportMessageNeeded", "isStickyHeaderNeeded", "customStickyHeaderNeeded", "headerElementClassName", "minCharToSearch", "searchResultMessage", "rowMenuActionIcon", "canDisableCheckbox", "isEllipsisRequiredForLink"], outputs: ["rowSelected", "selectedRowToEdit", "selectedRowToDelete", "selectedRowsToDelete", "rowLink", "addRow", "columnDataOnRowLinkClick", "menuActionClick", "selectActionMenu", "paginationChange", "selectedFilter", "removeFilteredOption", "filteredOptions", "searchedValue", "sortChange", "selectedRowsInfo", "rowExpansionClick", "tableColumnMenuActionClick", "tableColumnMenuToggleButton", "rowSlideToggle"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: ExportFormatPopoverComponent, selector: "ieeesa-export-format-popover", inputs: ["formatOptions", "origin", "isOpen", "popoverTitle", "formatSubtitles"], outputs: ["formatSelected", "closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ViewRosterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ieeesa-view-roster', standalone: true, imports: [CommonModule, DataTableComponent, MatDialogModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ieeesa-data-table\r\n  [tableDataInfo]=\"tableData\"\r\n  [columnSchemaInfo]=\"columnSchema\"\r\n  [searchPlaceHolderText]=\"searchPlaceholderText\"\r\n  [tableActions]=\"rosterActions\"\r\n  [isCellTextOverflowEllipsis]=\"true\"\r\n  [filters]=\"filters\"\r\n  [className]=\"dataTableClassName\"\r\n  [selectedFilterOptions]=\"filterOptions\"\r\n  [defaultSortedColumn]=\"defaultSortedColumn\"\r\n  (selectedFilter)=\"setSelectedFilterOptions($event)\"\r\n  (removeFilteredOption)=\"onFilterGroupUsers($event)\"\r\n  (filteredOptions)=\"onFilterGroupUsers($event)\"\r\n  (searchedValue)=\"onSearchGroupUsers($event)\"\r\n  (selectedRowToEdit)=\"onEditUserRoles($event)\"\r\n  (selectedRowsToDelete)=\"openUserDeleteConfirmationModal($event)\"\r\n  (sortChange)=\"onSortGroupUsers($event)\"\r\n  (addRow)=\"onAddNewUser()\"\r\n></ieeesa-data-table>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.5625rem;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25rem;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625rem;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-45{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.813rem;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375rem;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375rem;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-32{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2rem;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125rem;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875rem;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5rem;line-height:32px;color:#00629b;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625rem;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1.5rem;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5rem;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-btn-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#00629b;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125rem;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-16{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:20px;color:#1c1b1f;letter-spacing:.015625em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-body-sm-12{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.75rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-body-color-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:18px;color:#49454f;letter-spacing:.025em}.ieeesa-body-sm-bold-14{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5rem;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button,.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button,.mat-mdc-button.mat-mdc-button-base.mat-text-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:focus{background:#1f75a7}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:focus{background:#f0f5f9}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:#1d192b1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:#1c1b1f1f;color:#1c1b1f;opacity:.38}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button{background-color:#fff;border:1px solid #00629b;color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:hover{background-color:#6750a414}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:focus{background-color:#f0f5f9}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:active{background:#6750a41f}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:disabled{border:1px solid rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.mat-mdc-button.mat-mdc-button-base.mat-text-button{color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-text-button:hover,.mat-mdc-button.mat-mdc-button-base.mat-text-button:active{background:#6750a414}.mat-mdc-button.mat-mdc-button-base.mat-text-button:disabled{color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.ieeesa-view-more-or-less-button{border:none;background:none;text-decoration:underline;color:#00629b}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}.no-bg-color-btn{color:#00629b;border-radius:3px;border:1px solid #00629b;min-height:40px;height:auto}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane .mat-mdc-tooltip .mdc-tooltip__surface{color:#525252;padding:6px 12px;font-family:Calibri Regular;font-size:1rem;border:1px solid #cac4d0;background:#fff;box-shadow:0 4px 8px #00000040;max-width:unset!important}.cdk-overlay-pane .mat-mdc-option .mdc-list-item__primary-text{font-family:Calibri Regular!important}.cdk-overlay-pane.ieeesa-modal-confirm-dialog,.cdk-overlay-pane.ieeesa-modal-dialog,.cdk-overlay-pane.ieeesa-alert-dialog{width:100%;min-width:312px}.mat-mdc-form-field{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:24px;color:#49454f;letter-spacing:.03125em}.ieeesa-cancel-modal-confirm-dialog{width:25vw!important}.ieeesa-cancel-modal-confirm-dialog .ieeesa-confirmation{padding:1.5em 1.5em 1em}.ieeesa-cancel-modal-confirm-dialog .ieeesa-confirmation .mat-mdc-dialog-content{text-align:center;padding:0 0 1em!important}.mat-mdc-button,.mat-mdc-outlined-button{--mat-mdc-button-persistent-ripple-color: unset}@media (max-width: 768px){.ieeesa-cancel-modal-confirm-dialog{width:90vw!important}}.ieeesa-wrapper-border{border:1px solid #b2b7be;border-top:none;padding:1.5em;border-radius:0 0 4px 4px}.ieeesa-modal-dialog.ieeesa-view-roster{max-width:90vw!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-modal{box-shadow:0 3px #11b7e5 inset,0 4px 24px #00000080;padding-bottom:3em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-modal .mat-mdc-dialog-content{padding:0;min-height:405px}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__content{height:500px}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__no-table-data{height:auto}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__filter{padding-bottom:1em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-filter{--mdc-checkbox-state-layer-size: 2.5em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-filter .ieeesa-chip .mat-mdc-chip{background-color:#fffbfe!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .cdk-column-select{width:7%}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-system-users-roster .cdk-column-name{width:11.25em;max-width:11.25em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-system-users-roster .cdk-column-email{width:15em;max-width:15em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-name{width:11em;max-width:11em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-email{width:13em;max-width:13em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-memberType,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-role,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-employer{width:8.25em;max-width:8.25em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-org_name,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column{width:10em;max-width:10em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-classification{width:15em;max-width:15em}@media (max-width: 576px){.ieeesa-modal-dialog.ieeesa-view-roster{max-width:95vw!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table{padding-right:0!important}}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: GroupsService }, { type: i2.AlertsService }, { type: i0.ChangeDetectorRef }, { type: i2.GlobalErrorHandlerService }]; } });
+            args: [{ selector: 'ieeesa-view-roster', standalone: true, imports: [
+                        CommonModule,
+                        DataTableComponent,
+                        MatDialogModule,
+                        MatButtonModule,
+                        ExportFormatPopoverComponent,
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ieeesa-data-table\r\n  [tableDataInfo]=\"tableData\"\r\n  [columnSchemaInfo]=\"columnSchema\"\r\n  [searchPlaceHolderText]=\"searchPlaceholderText\"\r\n  [tableActions]=\"rosterActions\"\r\n  [isCellTextOverflowEllipsis]=\"true\"\r\n  [filters]=\"filters\"\r\n  [className]=\"dataTableClassName\"\r\n  [selectedFilterOptions]=\"filterOptions\"\r\n  [defaultSortedColumn]=\"defaultSortedColumn\"\r\n  (selectedFilter)=\"setSelectedFilterOptions($event)\"\r\n  (removeFilteredOption)=\"onFilterGroupUsers($event)\"\r\n  (filteredOptions)=\"onFilterGroupUsers($event)\"\r\n  (searchedValue)=\"onSearchGroupUsers($event)\"\r\n  (selectedRowToEdit)=\"onEditUserRoles($event)\"\r\n  (selectedRowsToDelete)=\"openUserDeleteConfirmationModal($event)\"\r\n  (sortChange)=\"onSortGroupUsers($event)\"\r\n  (addRow)=\"onAddNewUser()\"\r\n>\r\n  <!-- Export Roster Button + Popover \u2014 projected into the data-table action row,\r\n       inline after the delete icon. -->\r\n  <div dataTableActions class=\"ieeesa-view-roster__export-wrapper\">\r\n    <button\r\n      mat-button\r\n      class=\"mat-tertiary-button ieeesa-view-roster__export-btn\"\r\n      type=\"button\"\r\n      [attr.aria-label]=\"constants?.rosterExport?.ariaLabel\"\r\n      [disabled]=\"rosterExportService.isExportInProgress$ | async\"\r\n      (click)=\"onExportClick()\"\r\n    >\r\n      <svg class=\"ieeesa-view-roster__export-btn-icon\" aria-hidden=\"true\">\r\n        <use xlink:href=\"assets/images/sprites/sprites.svg#icon-export\"></use>\r\n      </svg>\r\n      {{ constants?.rosterExport?.buttonLabel }}\r\n    </button>\r\n\r\n    <ieeesa-export-format-popover\r\n      [formatOptions]=\"rosterExportService.exportFormatOptions\"\r\n      [isOpen]=\"(rosterExportService.isPopoverOpen$ | async) ?? false\"\r\n      [popoverTitle]=\"rosterExportService.popoverTitle\"\r\n      [formatSubtitles]=\"rosterExportService.exportFormatSubtitles\"\r\n      (formatSelected)=\"onExportFormatSelected($event)\"\r\n      (closed)=\"rosterExportService.closePopover()\"\r\n    ></ieeesa-export-format-popover>\r\n  </div>\r\n</ieeesa-data-table>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.5625rem;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25rem;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625rem;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-45{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.813rem;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375rem;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375rem;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-32{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2rem;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125rem;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875rem;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5rem;line-height:32px;color:#00629b;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625rem;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1.5rem;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5rem;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-btn-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#00629b;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125rem;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-16{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125rem;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:20px;color:#1c1b1f;letter-spacing:.015625em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-body-sm-12{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.75rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-body-color-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875rem;line-height:18px;color:#49454f;letter-spacing:.025em}.ieeesa-body-sm-bold-14{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:.875rem;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5rem;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button,.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button,.mat-mdc-button.mat-mdc-button-base.mat-text-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:focus{background:#1f75a7}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:focus{background:#f0f5f9}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:#1d192b1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:#1c1b1f1f;color:#1c1b1f;opacity:.38}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button{background-color:#fff;border:1px solid #00629b;color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:hover{background-color:#6750a414}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:focus{background-color:#f0f5f9}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:active{background:#6750a41f}.mat-mdc-button.mat-mdc-button-base.mat-tertiary-button:disabled{border:1px solid rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.mat-mdc-button.mat-mdc-button-base.mat-text-button{color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-text-button:hover,.mat-mdc-button.mat-mdc-button-base.mat-text-button:active{background:#6750a414}.mat-mdc-button.mat-mdc-button-base.mat-text-button:disabled{color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.ieeesa-view-more-or-less-button{border:none;background:none;text-decoration:underline;color:#00629b}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Bold;font-style:normal;font-weight:700;font-size:1rem;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}.no-bg-color-btn{color:#00629b;border-radius:3px;border:1px solid #00629b;min-height:40px;height:auto}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane .mat-mdc-tooltip .mdc-tooltip__surface{color:#525252;padding:6px 12px;font-family:Calibri Regular;font-size:1rem;border:1px solid #cac4d0;background:#fff;box-shadow:0 4px 8px #00000040;max-width:unset!important}.cdk-overlay-pane .mat-mdc-option .mdc-list-item__primary-text{font-family:Calibri Regular!important}.cdk-overlay-pane.ieeesa-modal-confirm-dialog,.cdk-overlay-pane.ieeesa-modal-dialog,.cdk-overlay-pane.ieeesa-alert-dialog{width:100%;min-width:312px}.mat-mdc-form-field{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1rem;line-height:24px;color:#49454f;letter-spacing:.03125em}.ieeesa-cancel-modal-confirm-dialog{width:25vw!important}.ieeesa-cancel-modal-confirm-dialog .ieeesa-confirmation{padding:1.5em 1.5em 1em}.ieeesa-cancel-modal-confirm-dialog .ieeesa-confirmation .mat-mdc-dialog-content{text-align:center;padding:0 0 1em!important}.mat-mdc-button,.mat-mdc-outlined-button{--mat-mdc-button-persistent-ripple-color: unset}@media (max-width: 768px){.ieeesa-cancel-modal-confirm-dialog{width:90vw!important}}.ieeesa-wrapper-border{border:1px solid #b2b7be;border-top:none;padding:1.5em;border-radius:0 0 4px 4px}.ieeesa-modal-dialog.ieeesa-view-roster{max-width:90vw!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-modal{box-shadow:0 3px #11b7e5 inset,0 4px 24px #00000080;padding-bottom:3em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-modal .mat-mdc-dialog-content{padding:0;min-height:405px}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__content{height:500px}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__no-table-data{height:auto}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table__filter{padding-bottom:1em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-filter{--mdc-checkbox-state-layer-size: 2.5em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-filter .ieeesa-chip .mat-mdc-chip{background-color:#fffbfe!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .cdk-column-select{width:7%}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-system-users-roster .cdk-column-name{width:11.25em;max-width:11.25em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-system-users-roster .cdk-column-email{width:15em;max-width:15em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-name{width:11em;max-width:11em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-email{width:13em;max-width:13em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-memberType,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-role,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-employer{width:8.25em;max-width:8.25em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-org_name,.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column{width:10em;max-width:10em}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table .ieeesa-individual-roster .cdk-column-classification{width:15em;max-width:15em}@media (max-width: 576px){.ieeesa-modal-dialog.ieeesa-view-roster{max-width:95vw!important}.ieeesa-modal-dialog.ieeesa-view-roster .ieeesa-data-table{padding-right:0!important}}.ieeesa-view-roster__export-wrapper{position:relative}.ieeesa-view-roster__export-btn.mat-mdc-button.mat-mdc-button-base{display:inline-flex;flex-direction:row;align-items:center;gap:6px;font-size:13px;white-space:nowrap}.ieeesa-view-roster__export-btn-icon{width:16px;height:16px;flex-shrink:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: GroupsService }, { type: i2.AlertsService }, { type: i0.ChangeDetectorRef }, { type: i2.GlobalErrorHandlerService }, { type: RosterExportService }]; } });
 
 /**
  * Groups component is a wrapper or container component for groups management reusable component and in this component integrates all group management functionalities and this will be entry component for managing groups when it is consumed in other applications.
@@ -5652,5 +6108,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AddWorkingGroupsComponent, CreateGroupComponent, EditUserRolesComponent, FilterType, GroupAction, GroupFunctionType, GroupNode, GroupRosterType, Groups, GroupsComponent, GroupsDataSource, GroupsModule, GroupsService, GroupsValidationPatterns, ReciprocalCreditSectionComponent, RoleType, RosterFunctionType, TableColumnSchemaUserGroup, TreeViewComponent, representingOrgRequiredValidator, skipWhenArray };
+export { AddWorkingGroupsComponent, CreateGroupComponent, EditUserRolesComponent, FilterType, GroupAction, GroupFunctionType, GroupNode, GroupRosterType, Groups, GroupsComponent, GroupsDataSource, GroupsModule, GroupsService, GroupsValidationPatterns, ReciprocalCreditSectionComponent, RoleType, RosterExportService, RosterFunctionType, TableColumnSchemaUserGroup, TreeViewComponent, representingOrgRequiredValidator, skipWhenArray };
 //# sourceMappingURL=ieeesa-npm-groups.mjs.map