npm - @posiwise/admin-module - Versions diffs - 0.0.179 → 0.0.180 - Mend

@posiwise/admin-module 0.0.179 → 0.0.180

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (24) hide show

package/fesm2022/posiwise-admin-module.mjs CHANGED Viewed

@@ -1,7 +1,7 @@
 import * as i3$1 from '@angular/common';
 import { CommonModule, DatePipe } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Component, ViewChildren, ViewChild, SecurityContext, ViewEncapsulation, EventEmitter, Output, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable } from '@angular/core';
+import { Component, ViewChild, ViewChildren, SecurityContext, ViewEncapsulation, EventEmitter, Output, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable } from '@angular/core';
 import * as i3$2 from '@angular/forms';
 import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i15$1 from '@angular-magic/ngx-gp-autocomplete';
@@ -130,7 +130,7 @@ class GlobalConfigDetailsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: GlobalConfigDetailsComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: GlobalConfigDetailsComponent, selector: "pw-global-config-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Go Back\"\n          (click)=\"back()\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>{{ 'Admin.GlobalConfigMessage.Config' | transloco }}:\n            {{isLoading ? '' : data?.name || 'Add New' }}</span>\n        </h3>\n      </div>\n      <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n    </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n        *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSaveForm()\">\n          <div class=\"row\">\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.GlobalConfigMessage.Name' | transloco\"\n                  class=\"col-md-6 p-0\"\n                  name=\"name\"\n                  [errorMsg]=\"\n                                        'Admin.GlobalConfigMessage.NameValidator' | transloco\n                                    \">\n                  <input type=\"text\"\n                    class=\"form-control\"\n                    formControlName=\"name\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.GlobalConfigMessage.FieldType' | transloco\"\n                  name=\"field_type\"\n                  [errorMsg]=\"\n                                        'Admin.GlobalConfigMessage.FieldTypeValidator' | transloco\n                                    \">\n                  <p-dropdown\n                    [options]=\"fieldTypes\"\n                    formControlName=\"field_type\"\n                    [ngClass]=\"{'is-invalid': submitted && f['field_type'].errors}\"\n                    styleClass=\"w-100\"\n                    optionLabel=\"label\"\n                    optionValue=\"value\"\n                    placeholder=\"Select field type\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.GlobalConfigMessage.Default' | transloco\"\n                  class=\"nowrap\"\n                  name=\"default\">\n                  <ui-switch class=\"d-block\"\n                    formControlName=\"default\"\n                    name=\"default\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['default'].errors }\">\n                  </ui-switch>\n                </pw-input-container>\n              </div>\n            </div>\n\n            <div class=\"col-12 text-end mt-3\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                class=\"btn btn-primary\"\n                *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n                {{ 'Button.Submit' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: GlobalConfigDetailsComponent, selector: "pw-global-config-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Go Back\"\n          (click)=\"back()\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>{{ 'Admin.GlobalConfigMessage.Config' | transloco }}:\n            {{isLoading ? '' : data?.name || 'Add New' }}</span>\n        </h3>\n      </div>\n      <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n    </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n        *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSaveForm()\">\n          <div class=\"row\">\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.GlobalConfigMessage.Name' | transloco\"\n                  class=\"col-md-6 p-0\"\n                  name=\"name\"\n                  [errorMsg]=\"\n                                        'Admin.GlobalConfigMessage.NameValidator' | transloco\n                                    \">\n                  <input type=\"text\"\n                    class=\"form-control\"\n                    formControlName=\"name\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.GlobalConfigMessage.FieldType' | transloco\"\n                  name=\"field_type\"\n                  [errorMsg]=\"\n                                        'Admin.GlobalConfigMessage.FieldTypeValidator' | transloco\n                                    \">\n                  <p-dropdown\n                    [options]=\"fieldTypes\"\n                    formControlName=\"field_type\"\n                    [ngClass]=\"{'is-invalid': submitted && f['field_type'].errors}\"\n                    styleClass=\"w-100\"\n                    optionLabel=\"label\"\n                    optionValue=\"value\"\n                    placeholder=\"Select field type\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.GlobalConfigMessage.Default' | transloco\"\n                  class=\"nowrap\"\n                  name=\"default\">\n                  <ui-switch class=\"d-block\"\n                    formControlName=\"default\"\n                    name=\"default\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['default'].errors }\">\n                  </ui-switch>\n                </pw-input-container>\n              </div>\n            </div>\n\n            <div class=\"col-12 text-end mt-3\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                class=\"btn btn-primary\"\n                *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n                {{ 'Button.Submit' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: GlobalConfigDetailsComponent, decorators: [{
             type: Component,
@@ -345,7 +345,7 @@ class ContactUsListComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ContactUsListComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ContactUsListComponent, selector: "pw-contact-us-list", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center text-end\">\n    <h2 class=\"card-title p-0 float-start\">Contact Us</h2>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Contact US</strong> module shows all submissions from the contact forms embedded on select landing pages.<br/>\n    It\u2019s your central hub to track and follow up with interested users or potential leads.</p>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.contact_request\"\n    [paginator]=\"data.object_count !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <!--sort order should be default empty when page load-->\n\n    <!-- Caption Header, Search Bar -->\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-contact\">\n        <div class=\"col-12 col-sm-3\">\n          <p-dropdown\n            [options]=\"[\n              { label: 'Select status', value: null },\n              { label: 'Open', value: false },\n              { label: 'Closed', value: true }\n            ]\"\n            placeholder=\"Select status\"\n            (onChange)=\"filterClosed($event.value)\">\n          </p-dropdown>\n        </div>\n        <div class=\"text-end ms-auto\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <input type=\"text\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"tt.filterGlobal($event.target.value, 'contains')\" />\n        </div>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          {{ 'Admin.ContactUs.CreatedAt' | transloco }}\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"name\">\n          {{ 'Label.Name' | transloco }}\n          <p-sortIcon field=\"name\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"email\">\n          {{ 'Label.Email' | transloco }}\n          <p-sortIcon field=\"email\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"subject\">\n          {{ 'Admin.ContactUs.Subject' | transloco }}\n          <p-sortIcon field=\"subject\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"message\">\n          {{ 'Admin.ContactUs.Message' | transloco }}\n          <p-sortIcon field=\"message\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n          scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"name\">{{ item?.name }}</td>\n        <td data-head=\"email\">\n          <a href=\"mailto:{{ item?.email }}\">{{ item?.email }}</a>\n        </td>\n        <td data-head=\"subject\">{{ item?.subject }}</td>\n        <td data-head=\"message\">\n          <span\n            [ngbTooltip]=\"item?.message\"\n            container=\"body\"\n            tooltipClass=\"custom-tooltip\"\n            placement=\"bottom\"\n            >\n            {{ item?.message | textTruncate: 200 }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            <li *ngIf=\"!item.closed\"\n              ngbTooltip=\"Close\"\n              class=\"me-2 me-sm-3\"\n              (keydown.enter)=\"toggleRecord(item.id, true)\"\n              (click)=\"toggleRecord(item.id, true)\">\n              <i class=\"fa fa-times delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li *ngIf=\"item.closed\"\n              ngbTooltip=\"Re Open\"\n              class=\"me-2 me-sm-3\"\n              (keydown.enter)=\"onKeyDown($event, item.id)\"\n              (click)=\"toggleRecord(item.id, false)\">\n              <i class=\"fa fa-retweet edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n   <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n    </pw-no-data>\n</div>\n  <span class=\"total-records-count\"  *ngIf=\"data.object_count !== 0\">Total: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n  <pw-no-data [withImage]=\"true\" message=\"No Contact Requests\"> </pw-no-data>\n</div>\n", styles: [".search-contact{display:flex;justify-content:space-between}@media (min-width: 320px) and (max-width: 720px){.search-contact{display:block}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ContactUsListComponent, selector: "pw-contact-us-list", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center text-end\">\n    <h2 class=\"card-title p-0 float-start\">Contact Us</h2>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Contact US</strong> module shows all submissions from the contact forms embedded on select landing pages.<br/>\n    It\u2019s your central hub to track and follow up with interested users or potential leads.</p>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.contact_request\"\n    [paginator]=\"data.object_count !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <!--sort order should be default empty when page load-->\n\n    <!-- Caption Header, Search Bar -->\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-contact\">\n        <div class=\"col-12 col-sm-3\">\n          <p-dropdown\n            [options]=\"[\n              { label: 'Select status', value: null },\n              { label: 'Open', value: false },\n              { label: 'Closed', value: true }\n            ]\"\n            placeholder=\"Select status\"\n            (onChange)=\"filterClosed($event.value)\">\n          </p-dropdown>\n        </div>\n        <div class=\"text-end ms-auto\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <input type=\"text\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"tt.filterGlobal($event.target.value, 'contains')\" />\n        </div>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          {{ 'Admin.ContactUs.CreatedAt' | transloco }}\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"name\">\n          {{ 'Label.Name' | transloco }}\n          <p-sortIcon field=\"name\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"email\">\n          {{ 'Label.Email' | transloco }}\n          <p-sortIcon field=\"email\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"subject\">\n          {{ 'Admin.ContactUs.Subject' | transloco }}\n          <p-sortIcon field=\"subject\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"message\">\n          {{ 'Admin.ContactUs.Message' | transloco }}\n          <p-sortIcon field=\"message\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n          scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"name\">{{ item?.name }}</td>\n        <td data-head=\"email\">\n          <a href=\"mailto:{{ item?.email }}\">{{ item?.email }}</a>\n        </td>\n        <td data-head=\"subject\">{{ item?.subject }}</td>\n        <td data-head=\"message\">\n          <span\n            [ngbTooltip]=\"item?.message\"\n            container=\"body\"\n            tooltipClass=\"custom-tooltip\"\n            placement=\"bottom\"\n            >\n            {{ item?.message | textTruncate: 200 }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            <li *ngIf=\"!item.closed\"\n              ngbTooltip=\"Close\"\n              class=\"me-2 me-sm-3\"\n              (keydown.enter)=\"toggleRecord(item.id, true)\"\n              (click)=\"toggleRecord(item.id, true)\">\n              <i class=\"fa fa-times delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li *ngIf=\"item.closed\"\n              ngbTooltip=\"Re Open\"\n              class=\"me-2 me-sm-3\"\n              (keydown.enter)=\"onKeyDown($event, item.id)\"\n              (click)=\"toggleRecord(item.id, false)\">\n              <i class=\"fa fa-retweet edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n   <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n    </pw-no-data>\n</div>\n  <span class=\"total-records-count\"  *ngIf=\"data.object_count !== 0\">Total: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n  <pw-no-data [withImage]=\"true\" message=\"No Contact Requests\"> </pw-no-data>\n</div>\n", styles: [".search-contact{display:flex;justify-content:space-between}@media (min-width: 320px) and (max-width: 720px){.search-contact{display:block}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ContactUsListComponent, decorators: [{
             type: Component,
@@ -681,7 +681,7 @@ class SubscriptionCredentialsDetailsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SubscriptionCredentialsDetailsComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SubscriptionCredentialsDetailsComponent, selector: "pw-subscription-credentials-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          (click)=\"back()\"\n          class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>{{\n                            'Admin.SubscriptionCredentialMessages.SubscriptionCredential'\n                                | transloco\n                        }}: {{ isLoading ? '' :  (data?.name || 'Add New') }}</span>\n        </h3>\n      </div>\n\n      <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n    </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n        *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSaveForm()\">\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-4\">\n              <pw-input-container [label]=\"\n                                    'Admin.SubscriptionCredentialMessages.Credential' | transloco\n                                \"\n                name=\"credential_id\"\n                [errorMsg]=\"\n                                    'Admin.SubscriptionCredentialMessages.CredentialValidation'\n                                        | transloco\n                                \">\n                <p-dropdown\n                  [options]=\"allCredentials\"\n                  formControlName=\"credential_id\"\n                  [ngClass]=\"{'is-invalid': submitted && f['credential_id'].errors}\"\n                  optionLabel=\"name\"\n                  optionValue=\"id\"\n                  [placeholder]=\"'Admin.SubscriptionCredentialMessages.SelectCredential' | transloco\">\n                  <ng-template pTemplate=\"selectedItem\">\n                    <div *ngIf=\"form.get('credential_id').value\">\n                      {{getSelectedCredentialName()}} - {{getSelectedCredentialField()}}\n                    </div>\n                  </ng-template>\n                  <ng-template pTemplate=\"item\" let-option>\n                    {{option.name}} - {{option.field}}\n                  </ng-template>\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-4\">\n              <pw-input-container [label]=\"'Admin.SubscriptionCredentialMessages.Value' | transloco\"\n                name=\"value\"\n                [errorMsg]=\"\n                                    'Admin.SubscriptionCredentialMessages.ValueValidation'\n                                        | transloco\n                                \">\n                <input type=\"text\"\n                  class=\"form-control\"\n                  formControlName=\"value\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['value'].errors }\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 text-end mt-3\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                class=\"btn btn-primary\"\n                *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n                {{ 'Button.Submit' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SubscriptionCredentialsDetailsComponent, selector: "pw-subscription-credentials-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          (click)=\"back()\"\n          class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>{{\n                            'Admin.SubscriptionCredentialMessages.SubscriptionCredential'\n                                | transloco\n                        }}: {{ isLoading ? '' :  (data?.name || 'Add New') }}</span>\n        </h3>\n      </div>\n\n      <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n    </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n        *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSaveForm()\">\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-4\">\n              <pw-input-container [label]=\"\n                                    'Admin.SubscriptionCredentialMessages.Credential' | transloco\n                                \"\n                name=\"credential_id\"\n                [errorMsg]=\"\n                                    'Admin.SubscriptionCredentialMessages.CredentialValidation'\n                                        | transloco\n                                \">\n                <p-dropdown\n                  [options]=\"allCredentials\"\n                  formControlName=\"credential_id\"\n                  [ngClass]=\"{'is-invalid': submitted && f['credential_id'].errors}\"\n                  optionLabel=\"name\"\n                  optionValue=\"id\"\n                  [placeholder]=\"'Admin.SubscriptionCredentialMessages.SelectCredential' | transloco\">\n                  <ng-template pTemplate=\"selectedItem\">\n                    <div *ngIf=\"form.get('credential_id').value\">\n                      {{getSelectedCredentialName()}} - {{getSelectedCredentialField()}}\n                    </div>\n                  </ng-template>\n                  <ng-template pTemplate=\"item\" let-option>\n                    {{option.name}} - {{option.field}}\n                  </ng-template>\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-4\">\n              <pw-input-container [label]=\"'Admin.SubscriptionCredentialMessages.Value' | transloco\"\n                name=\"value\"\n                [errorMsg]=\"\n                                    'Admin.SubscriptionCredentialMessages.ValueValidation'\n                                        | transloco\n                                \">\n                <input type=\"text\"\n                  class=\"form-control\"\n                  formControlName=\"value\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['value'].errors }\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 text-end mt-3\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                class=\"btn btn-primary\"\n                *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n                {{ 'Button.Submit' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -1375,7 +1375,7 @@ class DomainConfigBuildComponent extends AppBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DomainConfigBuildComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }, { token: i1$2.ProductService }, { token: i2$1.NgbModal }, { token: i3$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: DomainConfigBuildComponent, selector: "pw-domain-config-build", viewQueries: [{ propertyName: "partnerCropper", first: true, predicate: ["partnerCropper"], descendants: true }, { propertyName: "uploader", predicate: CustomUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n  <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"isLoading\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n  <form [formGroup]=\"form\"\n    (ngSubmit)=\"onSave()\">\n    <div class=\"row\">\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n          name=\"master_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n          <p-dropdown\n          [options]=\"masterSubscriptionsList\"\n          formControlName=\"master_subscription_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n          placeholder=\"Select Master Subscription\">\n        </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"\n                        'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n                    \"\n          name=\"master_subscription_product_id\">\n          <p-dropdown\n            [options]=\"masterSubscriptionProductList\"\n            formControlName=\"master_subscription_product_id\"\n            [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n            [placeholder]=\"'Select Master Product'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n          name=\"blog_feature_key\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"blog_feature_key\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n          name=\"main_tos_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n          <p-dropdown\n          [options]=\"subscriptionTosList\"\n          formControlName=\"main_tos_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n          [placeholder]=\"'Select Main TOS'\"\n          optionValue=\"id\">\n          <ng-template pTemplate=\"selectedItem\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n          <ng-template pTemplate=\"item\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n        </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n          name=\"crm_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n          <p-dropdown\n            [options]=\"crmSubscriptionsList\"\n            formControlName=\"crm_subscription_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n            [placeholder]=\"'Select CRM Subscription'\"\n            optionValue=\"id\">\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n          </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n          name=\"crm_product_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n          <p-dropdown\n            [options]=\"crmProductList\"\n            formControlName=\"crm_product_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n            [placeholder]=\"'Select CRM Product'\"\n            optionValue=\"id\"\n            >\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n          name=\"crm_source_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n          <p-dropdown\n            [options]=\"crmSourcesList\"\n            formControlName=\"crm_source_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n            [placeholder]=\"'Select CRM Source'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields end-->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n          name=\"is_product_domain\">\n          <ui-switch size=\"small\"\n            uncheckedLabel=\"false\"\n            checkedLabel=\"true\"\n            formControlName=\"is_product_domain\"\n            name=\"is_product_domain\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n          name=\"can_register_through_main_page\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n            name=\"can_register_through_main_page\" [ngClass]=\"{\n                                  'is-invalid': submitted && f['can_register_through_main_page'].errors\n                              }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n            name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n            name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n    </div>\n\n    <div class=\"my-5\">\n      <h3>Pre-Built Pages Config (Resources, Landing Pages, etc)</h3>\n\n      <p-accordion class=\"mt-5\">\n        <p-accordionTab [header]=\"'Instructions - README FIRST'\">\n          <div class=\"mb-3\">\n            <p>We've built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n              UIs for onboarding users.</p>\n            <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n              <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n              Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n            <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n              <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n              appear in the <strong>Admin > Users section</strong>.</p>\n            <p>Once you've selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n              the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n              <strong>/join/trial3</strong>.</p>\n            <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n              out.</p>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Subscribe to Product/Newsletter Config'\">\n          <div class=\"mb-3\">\n            <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n              /join/trial2, etc.</p>\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                  form.get('trial_product_id').touched &&\n                                                  form.get('trial_product_id').invalid\n                                                      ? { border: '1px solid #ff586b' }\n                                                      : { border: '1px solid gray' }\n                                              \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n                                          \">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_book_demo_url'].errors\n                                              }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_cta_iframe'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_join_message'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_pdf_download_text'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"trial_image\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n                [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image2\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_pdf_image\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg2\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Header Section'\">\n          <div class=\"row mt-4\" formGroupName=\"header\">\n            <h4 class=\"mb-4\">Header Section</h4>\n\n            <!-- Headline -->\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container label=\"Header Headline\" name=\"headline\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"headline\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Video URL -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Video URL\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Background Image URL -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"bg_image_url\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description -->\n            <div class=\"col-12\">\n              <pw-input-container label=\"Header Description\" name=\"description\">\n                <textarea\n                  class=\"form-control\"\n                  rows=\"5\"\n                  formControlName=\"description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n                ></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Sub Headings -->\n            <div formArrayName=\"sub_headings\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(headerSubHeadings, $event)\">\n              <div\n                *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3 align-items-center\"\n                cdkDrag\n              >\n                <div class=\"col-md-10\">\n                  <pw-input-container label=\"Sub Header Description\" name=\"description\">\n                    <textarea\n                      class=\"form-control\"\n                      rows=\"3\"\n                      formControlName=\"description\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n                    ></textarea>\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeHeaderSubHeading(i)\"\n                    (keydown.enter)=\"removeHeaderSubHeading(i)\"\n                    (keydown.space)=\"removeHeaderSubHeading(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\">\n                + Add Sub Heading\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Resources Section'\">\n          <div class=\"row row mt-4 mb-4\">\n            <h4 class=\"mb-3\">Resources Section</h4>\n            <div class=\"col-12 col-sm-6\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"resources_tagline\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"resource_image\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Unique Selling Proposition Section (USP) '\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n            <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Video Url\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12\">\n              <pw-input-container label=\"USPs Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- USP Items -->\n            <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(uspsItems, $event)\">\n              <div\n                *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3 align-items-center\"\n                cdkDrag\n              >\n                <div class=\"col-sm-10\">\n                  <pw-input-container label=\"Item Description\" name=\"description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeUspItem(i)\"\n                    (keydown.enter)=\"removeUspItem(i)\"\n                    (keydown.space)=\"removeUspItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n                + Add USP Item\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Partners (Clients) Section'\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n            <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n\n            <!-- Title -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Partner Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description -->\n            <div class=\"col-12\">\n              <pw-input-container label=\"Partners Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Partner Items with Drag Support -->\n            <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(partnersItems, $event)\">\n              <div\n                *ngFor=\"let item of partnersItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 align-items-start\"\n                cdkDrag\n              >\n                <!-- Name -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Name\" class=\"col-12\" name=\"name\">\n                    <input class=\"form-control\" formControlName=\"name\" />\n                  </pw-input-container>\n                </div>\n\n                <!-- Blog URL + Drag Handle -->\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Blog Url\" name=\"blog_url\">\n                      <input class=\"form-control\" formControlName=\"blog_url\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n\n                <!-- Video URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Video Url\" name=\"video_url\">\n                    <input class=\"form-control\" formControlName=\"video_url\" />\n                  </pw-input-container>\n                </div>\n\n                <!-- Image URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Image Url\" name=\"image_url\">\n                    <input class=\"form-control\" formControlName=\"image_url\" />\n                  </pw-input-container>\n                </div>\n\n                <!-- Delete Icon -->\n                <div class=\"col-md-12 text-end mt-2\">\n                  <i\n                    ngbTooltip=\"Remove\"\n                    (click)=\"removePartnerItem(i)\"\n                    (keydown.enter)=\"removePartnerItem(i)\"\n                    (keydown.space)=\"removePartnerItem(i)\"\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <!-- Add New Partner -->\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Testimonials Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n            <h4 class=\"mb-4\">Testimonials Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Items List -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(testimonialsItems, $event)\">\n              <div\n                *ngFor=\"let item of testimonialsItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 align-items-start\"\n                cdkDrag\n              >\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Name\" name=\"name\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"name\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Blog URL\" name=\"blog_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Testimonial\" class=\"col-md-10\" name=\"testimonial\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    ngbTooltip=\"Remove\"\n                    (click)=\"removeTestimonialItem(i)\"\n                    (keydown.enter)=\"removeTestimonialItem(i)\"\n                    (keydown.space)=\"removeTestimonialItem(i)\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">\n                  + Add Testimonial\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Video Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n            <h4 class=\"mb-3\">Video Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Video Items -->\n            <div\n              formArrayName=\"items\"\n              class=\"col-12 mt-3\"\n              cdkDropList\n              (cdkDropListDropped)=\"dropItems(videosItems, $event)\"\n            >\n              <div\n                *ngFor=\"let item of videosItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 align-items-start\"\n                cdkDrag\n              >\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Title\" name=\"title\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Blog URL\" name=\"blog_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-10\" name=\"description\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeVideoItem(i)\"\n                    (keydown.enter)=\"removeVideoItem(i)\"\n                    (keydown.space)=\"removeVideoItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">\n                  + Add Video\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Call to Actions Section (CTAs)'\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n            <h4 class=\"mb-4\">CTAs Section</h4>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Image URL\" name=\"image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Button Text\" name=\"button_text\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"button_text\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12\">\n              <pw-input-container label=\"Description\" name=\"description\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n              </pw-input-container>\n            </div>\n\n            <!-- CTA Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(ctasItems, $event)\">\n              <div\n                *ngFor=\"let item of ctasItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 align-items-start\"\n                cdkDrag\n              >\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Image URL\" name=\"image_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Cta URL\" name=\"cta_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"cta_url\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Video URL\" name=\"video_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Title\" name=\"title\">\n                    <input class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Description\" name=\"description\">\n                    <input class=\"form-control\" formControlName=\"description\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-5\">\n                  <pw-input-container label=\"Button Text\" name=\"button_text\">\n                    <input class=\"form-control\" formControlName=\"button_text\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeCtasItem(i)\"\n                    (keydown.enter)=\"removeCtasItem(i)\"\n                    (keydown.space)=\"removeCtasItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Integrations Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n            <h4 class=\"mb-3\">Integrations Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12\" name=\"title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"description\">\n              <textarea class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n            </pw-input-container>\n\n            <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(integrationsItems, $event)\">\n              <div\n                *ngFor=\"let item of integrationsItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 rounded bg-light\"\n                cdkDrag\n              >\n                <pw-input-container label=\"Title\" class=\"col-md-6\" name=\"title\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Description\" name=\"description\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\" name=\"blog_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n                  <i\n                    class=\"fa fa-trash delete-icon align-self-center\"\n                    (click)=\"removeIntegrationItem(i)\"\n                    (keydown.enter)=\"removeIntegrationItem(i)\"\n                    (keydown.space)=\"removeIntegrationItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Contact Us Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n            <h4 class=\"mb-3\">Contact Us Section</h4>\n\n            <pw-input-container label=\"Url\" class=\"col-md-6\" name=\"url\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n            </pw-input-container>\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <div formArrayName=\"questions\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsQuestions, $event)\">\n              <div\n                *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3\"\n                cdkDrag\n              >\n                <pw-input-container label=\"Question\" class=\"col-md-10\" name=\"question\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"question\" />\n                </pw-input-container>\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeContactUsQuestion(i)\"\n                    (keydown.enter)=\"removeContactUsQuestion(i)\"\n                    (keydown.space)=\"removeContactUsQuestion(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-12 mt-3\" formArrayName=\"options\" cdkDropList [cdkDropListData]=\"getQuestionOptions(i).controls\" (cdkDropListDropped)=\"dropContactUsOptions(i, $event)\">\n                  <div\n                    class=\"row align-items-center mb-2 border p-3\"\n                    *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\"\n                    [formGroupName]=\"j\"\n                    cdkDrag\n                  >\n                    <pw-input-container label=\"Option\" class=\"col-md-10\" name=\"option\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"option\" />\n                    </pw-input-container>\n\n                    <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n                      <i\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        (click)=\"removeContactUsOption(i, j)\"\n                        (keydown.enter)=\"removeContactUsOption(i, j)\"\n                        (keydown.space)=\"removeContactUsOption(i, j)\"\n                        ngbTooltip=\"Remove Option\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n\n                    <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder option\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <div class=\"text-start\">\n                    <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\">\n                      + Add Option\n                    </button>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-3\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">\n                  + Add Question\n                </button>\n              </div>\n            </div>\n\n            <div formArrayName=\"hubspot\" class=\"col-12 mt-4\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsHubspotItems, $event)\">\n              <h5 class=\"mb-4\">Hubspot Embeds</h5>\n\n              <div\n                *ngFor=\"let hub of contactUsHubspotItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-2\"\n                cdkDrag\n              >\n              <pw-input-container label=\"ID\" class=\"col-md-5\" name=\"id\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"id\" />\n              </pw-input-container>\n\n              <pw-input-container label=\"Position\" class=\"col-md-6\" name=\"position\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"position\" />\n              </pw-input-container>\n              <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-3\">\n                <i\n                  class=\"fa fa-bars cursor-move\"\n                  cdkDragHandle\n                  ngbTooltip=\"Drag to reorder\"\n                  aria-hidden=\"true\"\n                ></i>\n              </div>\n\n                <pw-input-container label=\"Div\" class=\"col-10\" name=\"div\">\n                  <textarea\n                    class=\"form-control\"\n                    rows=\"5\"\n                    formControlName=\"div\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['div']?.errors }\"\n                  ></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeHubspotItem(i)\"\n                    (keydown.enter)=\"removeHubspotItem(i)\"\n                    (keydown.space)=\"removeHubspotItem(i)\"\n                    ngbTooltip=\"Remove Hubspot Embed\"\n                    aria-hidden=\"true\">\n</i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addHubspotItem()\">\n                  + Add Hubspot Embed\n                </button>\n              </div>\n            </div>\n\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Book a Demo Section'\">\n          <div class=\"row mt-4\">\n            <div class=\"col-12\">\n              <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n              <div formGroupName=\"book_demo\">\n                <pw-input-container label=\"Title\" name=\"title\">\n                  <input type=\"text\" formControlName=\"title\" class=\"form-control\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" name=\"description\">\n                  <input type=\"text\" formControlName=\"description\" class=\"form-control\" />\n                </pw-input-container>\n\n                <div formArrayName=\"items\" cdkDropList (cdkDropListDropped)=\"dropBookDemoLinks($event)\">\n                  <div\n                    *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\"\n                    [formGroupName]=\"i\"\n                    class=\"row mb-3 border p-3 align-items-center\"\n                    cdkDrag\n                  >\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link Title\" name=\"title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link URL\" name=\"url\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n                      <i\n                        ngbTooltip=\"Remove\"\n                        (click)=\"removeBookDemoLink(i)\"\n                        (keydown.enter)=\"removeBookDemoLink(i)\"\n                        (keydown.space)=\"removeBookDemoLink(i)\"\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n\n                    <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">\n                    + Add Book Demo Link\n                  </button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Navbar Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"navbar\">\n            <h4 class=\"mb-3\">Navbar Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(navbarItems, $event)\">\n              <div\n                *ngFor=\"let item of navbarItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3\"\n                cdkDrag\n              >\n                <div class=\"row align-items-center\">\n                  <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n\n                  <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                  </pw-input-container>\n\n                  <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n                    <i\n                      class=\"fa fa-trash delete-icon text-danger\"\n                      (click)=\"removeNavbarItem(i)\"\n                      (keydown.enter)=\"removeNavbarItem(i)\"\n                      (keydown.space)=\"removeNavbarItem(i)\"\n                      ngbTooltip=\"Remove Navbar Item\"\n                      aria-hidden=\"true\"\n                    ></i>\n                  </div>\n\n                  <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n                    <i\n                      class=\"fa fa-bars cursor-move\"\n                      cdkDragHandle\n                      ngbTooltip=\"Drag to reorder\"\n                      aria-hidden=\"true\"\n                    ></i>\n                  </div>\n                </div>\n\n                <div\n                  class=\"col-12 mt-3\"\n                  formArrayName=\"subtitles\"\n                  cdkDropList\n                  [cdkDropListData]=\"getNavbarSubtitles(i).controls\"\n                  (cdkDropListDropped)=\"dropNavbarSubtitles(i, $event)\"\n                >\n                  <div\n                    *ngFor=\"let sub of getNavbarSubtitles(i).controls; let j = index\"\n                    [formGroupName]=\"j\"\n                    class=\"row border p-3 mb-2 align-items-center\"\n                    cdkDrag\n                  >\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Title\" name=\"title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Path\" name=\"path\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n                      <i\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        (click)=\"removeSubtitle(i, j)\"\n                        (keydown.enter)=\"removeSubtitle(i, j)\"\n                        (keydown.space)=\"removeSubtitle(i, j)\"\n                        ngbTooltip=\"Remove Subtitle\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n\n                    <div class=\"col-md-1 d-flex justify-content-end\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder subtitle\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addSubtitle(i)\">\n                    + Add Subtitle\n                  </button>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addNavbarItem()\">\n                + Add Navbar Item\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Footer Links Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"footer_links\">\n            <h4 class=\"mb-3\">Footer Links Section</h4>\n\n            <div\n              formArrayName=\"items\"\n              class=\"col-12\"\n              cdkDropList\n              (cdkDropListDropped)=\"dropItems(footerLinksItems, $event)\"\n            >\n              <div\n                *ngFor=\"let item of footerLinksItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3\"\n                cdkDrag\n              >\n                <div class=\"row align-items-center\">\n\n                  <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n\n                  <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                  </pw-input-container>\n                  <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n                    <i\n                      class=\"fa fa-trash delete-icon text-danger\"\n                      (click)=\"removeFooterLinkItem(i)\"\n                      (keydown.enter)=\"removeFooterLinkItem(i)\"\n                      (keydown.space)=\"removeFooterLinkItem(i)\"\n                      ngbTooltip=\"Remove Footer Item\"\n                      aria-hidden=\"true\"\n                    ></i>\n                  </div>\n                  <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n                    <i\n                      class=\"fa fa-bars cursor-move\"\n                      cdkDragHandle\n                      ngbTooltip=\"Drag to reorder\"\n                      aria-hidden=\"true\"\n                    ></i>\n                  </div>\n\n                </div>\n\n                <div\n                  class=\"col-12 mt-3\"\n                  formArrayName=\"subtitles\"\n                  cdkDropList\n                  [cdkDropListData]=\"getFooterSubtitles(i).controls\"\n                  (cdkDropListDropped)=\"dropFooterSubtitles(i, $event)\"\n                >\n                  <div\n                    *ngFor=\"let sub of getFooterSubtitles(i).controls; let j = index\"\n                    [formGroupName]=\"j\"\n                    class=\"row border p-3 mb-2 align-items-center\"\n                    cdkDrag\n                  >\n\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Title\" name=\"title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Path\" name=\"path\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                      </pw-input-container>\n                    </div>\n\n\n\n\n                    <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n                      <i\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        (click)=\"removeFooterSubtitle(i, j)\"\n                        (keydown.enter)=\"removeFooterSubtitle(i, j)\"\n                        (keydown.space)=\"removeFooterSubtitle(i, j)\"\n                        ngbTooltip=\"Remove Subtitle\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                    <div class=\"col-md-1 d-flex justify-content-end\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder subtitle\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <button\n                    type=\"button\"\n                    class=\"btn btn-sm btn-primary mt-2\"\n                    (click)=\"addFooterSubtitle(i)\"\n                  >\n                    + Add Subtitle\n                  </button>\n                </div>\n              </div>\n\n              <button\n                type=\"button\"\n                class=\"btn btn-primary mt-2 mb-2\"\n                (click)=\"addFooterLinkItem()\"\n              >\n                + Add Footer Link\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n\n\n        <p-accordionTab [header]=\"'Guides Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"guides\">\n            <h4 class=\"mb-3\">Guides Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div cdkDropList (cdkDropListDropped)=\"dropItems(guidesItems, $event)\">\n                <div\n                  *ngFor=\"let item of guidesItems.controls; let i = index\"\n                  [formGroupName]=\"i\"\n                  class=\"border p-3 mb-3\"\n                  cdkDrag\n                >\n                  <div class=\"row align-items-start\">\n\n                    <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                    </pw-input-container>\n\n                    <pw-input-container label=\"Button Text\" class=\"col-md-6\" name=\"button_text\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"button_text\" />\n                    </pw-input-container>\n                    <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <div class=\"row mt-2\">\n                    <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                    </pw-input-container>\n\n                    <pw-input-container label=\"Guide URL\" class=\"col-md-6\" name=\"guide_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"guide_url\" />\n                    </pw-input-container>\n                  </div>\n\n                  <div class=\"row mt-2\">\n                    <pw-input-container label=\"Description\" class=\"col-md-11\" name=\"description\">\n                      <textarea\n                        class=\"form-control\"\n                        rows=\"5\"\n                        formControlName=\"description\"\n                        [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n                      ></textarea>\n                    </pw-input-container>\n\n                    <div class=\"col-md-1 d-flex align-items-start justify-content-center mt-3\">\n                      <i\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        (click)=\"removeGuideItem(i)\"\n                        (keydown.enter)=\"removeGuideItem(i)\"\n                        (keydown.space)=\"removeGuideItem(i)\"\n                        ngbTooltip=\"Remove Guide\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addGuideItem()\">\n                  + Add Guide\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n        <p-accordionTab [header]=\"'AB Tests Section'\">\n          <div class=\"row mt-3 mb-4\">\n            <h4 class=\"mb-3\">AB Tests</h4>\n            <div formArrayName=\"ab_tests\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(abTests, $event)\">\n              <div\n                *ngFor=\"let abTest of abTests.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3 border p-3\"\n                cdkDrag\n              >\n                <pw-input-container label=\"Description\" class=\"col-md-5\" name=\"description\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Experiment Name\" class=\"col-md-6\" name=\"experiment_name\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"experiment_name\" />\n                </pw-input-container>\n\n\n                <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <pw-input-container label=\"DB Shard\" class=\"col-md-6\" name=\"db_shard\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"db_shard\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Microservice Name\" class=\"col-md-6\" name=\"microservice_name\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"microservice_name\" />\n                </pw-input-container>\n\n                <div class=\"col-md-12 text-end mt-2\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeAbTest(i)\"\n                    (keydown.enter)=\"removeAbTest(i)\"\n                    (keydown.space)=\"removeAbTest(i)\"\n                    ngbTooltip=\"Remove AB Test\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addAbTest()\">+ Add AB Test</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n\n\n        <p-accordionTab [header]=\"'Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)'\">\n          <div class=\"mb-3\">\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                form.get('cs_product_id').touched &&\n                                                form.get('cs_product_id').invalid\n                                                    ? { border: '1px solid #ff586b' }\n                                                    : { border: '1px solid gray' }\n                                            \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                            'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n                                        \">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['cs_pdf_download_text'].errors\n                                            }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"cs_image\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image2\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n                [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_pdf_image\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n                [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n                [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg2\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n                [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n      </p-accordion>\n    </div>\n\n    <div class=\"col-12 text-end mt-3\">\n      <button type=\"button\"\n        class=\"btn btn-outline-default me-2\"\n        (click)=\"back()\">\n        {{ 'Button.Cancel' | transloco }}\n      </button>\n      <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n        class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n    </div>\n  </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Partner Image</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n    <pw-image-cropper\n      aspectRatio=\"auto\"\n      (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n      (closeEvent)=\"onClosePartnerModal()\"\n    ></pw-image-cropper>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7$1.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i7$1.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i13.CustomUploaderComponent, selector: "pw-custom-uploader", inputs: ["controlName", "previewData", "aspectRatio", "title"], outputs: ["saveEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: DomainConfigBuildComponent, selector: "pw-domain-config-build", viewQueries: [{ propertyName: "partnerCropper", first: true, predicate: ["partnerCropper"], descendants: true }, { propertyName: "uploader", predicate: CustomUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n  <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"isLoading\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n  <form [formGroup]=\"form\"\n    (ngSubmit)=\"onSave()\">\n    <div class=\"row\">\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n          name=\"master_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n          <p-dropdown\n          [options]=\"masterSubscriptionsList\"\n          formControlName=\"master_subscription_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n          placeholder=\"Select Master Subscription\">\n        </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"\n                        'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n                    \"\n          name=\"master_subscription_product_id\">\n          <p-dropdown\n            [options]=\"masterSubscriptionProductList\"\n            formControlName=\"master_subscription_product_id\"\n            [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n            [placeholder]=\"'Select Master Product'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n          name=\"blog_feature_key\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"blog_feature_key\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n          name=\"main_tos_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n          <p-dropdown\n          [options]=\"subscriptionTosList\"\n          formControlName=\"main_tos_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n          [placeholder]=\"'Select Main TOS'\"\n          optionValue=\"id\">\n          <ng-template pTemplate=\"selectedItem\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n          <ng-template pTemplate=\"item\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n        </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n          name=\"crm_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n          <p-dropdown\n            [options]=\"crmSubscriptionsList\"\n            formControlName=\"crm_subscription_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n            [placeholder]=\"'Select CRM Subscription'\"\n            optionValue=\"id\">\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n          </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n          name=\"crm_product_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n          <p-dropdown\n            [options]=\"crmProductList\"\n            formControlName=\"crm_product_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n            [placeholder]=\"'Select CRM Product'\"\n            optionValue=\"id\"\n            >\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n          name=\"crm_source_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n          <p-dropdown\n            [options]=\"crmSourcesList\"\n            formControlName=\"crm_source_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n            [placeholder]=\"'Select CRM Source'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields end-->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n          name=\"is_product_domain\">\n          <ui-switch size=\"small\"\n            uncheckedLabel=\"false\"\n            checkedLabel=\"true\"\n            formControlName=\"is_product_domain\"\n            name=\"is_product_domain\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n          name=\"can_register_through_main_page\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n            name=\"can_register_through_main_page\" [ngClass]=\"{\n                                  'is-invalid': submitted && f['can_register_through_main_page'].errors\n                              }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n            name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n            name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n    </div>\n\n    <div class=\"my-5\">\n      <h3>Pre-Built Pages Config (Resources, Landing Pages, etc)</h3>\n\n      <p-accordion class=\"mt-5\">\n        <p-accordionTab [header]=\"'Instructions - README FIRST'\">\n          <div class=\"mb-3\">\n            <p>We've built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n              UIs for onboarding users.</p>\n            <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n              <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n              Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n            <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n              <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n              appear in the <strong>Admin > Users section</strong>.</p>\n            <p>Once you've selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n              the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n              <strong>/join/trial3</strong>.</p>\n            <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n              out.</p>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Subscribe to Product/Newsletter Config'\">\n          <div class=\"mb-3\">\n            <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n              /join/trial2, etc.</p>\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                  form.get('trial_product_id').touched &&\n                                                  form.get('trial_product_id').invalid\n                                                      ? { border: '1px solid #ff586b' }\n                                                      : { border: '1px solid gray' }\n                                              \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n                                          \">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_book_demo_url'].errors\n                                              }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_cta_iframe'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_join_message'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_pdf_download_text'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"trial_image\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n                [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image2\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_pdf_image\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg2\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Header Section'\">\n          <div class=\"row mt-4\" formGroupName=\"header\">\n            <h4 class=\"mb-4\">Header Section</h4>\n\n            <!-- Headline -->\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container label=\"Header Headline\" name=\"headline\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"headline\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Video URL -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Video URL\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Background Image URL -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"bg_image_url\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description -->\n            <div class=\"col-12\">\n              <pw-input-container label=\"Header Description\" name=\"description\">\n                <textarea\n                  class=\"form-control\"\n                  rows=\"5\"\n                  formControlName=\"description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n                ></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Sub Headings -->\n            <div formArrayName=\"sub_headings\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(headerSubHeadings, $event)\">\n              <div\n                *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3 align-items-center\"\n                cdkDrag\n              >\n                <div class=\"col-md-10\">\n                  <pw-input-container label=\"Sub Header Description\" name=\"description\">\n                    <textarea\n                      class=\"form-control\"\n                      rows=\"3\"\n                      formControlName=\"description\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n                    ></textarea>\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeHeaderSubHeading(i)\"\n                    (keydown.enter)=\"removeHeaderSubHeading(i)\"\n                    (keydown.space)=\"removeHeaderSubHeading(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\">\n                + Add Sub Heading\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Resources Section'\">\n          <div class=\"row row mt-4 mb-4\">\n            <h4 class=\"mb-3\">Resources Section</h4>\n            <div class=\"col-12 col-sm-6\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"resources_tagline\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"resource_image\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Unique Selling Proposition Section (USP) '\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n            <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Video Url\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12\">\n              <pw-input-container label=\"USPs Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- USP Items -->\n            <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(uspsItems, $event)\">\n              <div\n                *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3 align-items-center\"\n                cdkDrag\n              >\n                <div class=\"col-sm-10\">\n                  <pw-input-container label=\"Item Description\" name=\"description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeUspItem(i)\"\n                    (keydown.enter)=\"removeUspItem(i)\"\n                    (keydown.space)=\"removeUspItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n                + Add USP Item\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Partners (Clients) Section'\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n            <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n\n            <!-- Title -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Partner Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description -->\n            <div class=\"col-12\">\n              <pw-input-container label=\"Partners Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Partner Items with Drag Support -->\n            <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(partnersItems, $event)\">\n              <div\n                *ngFor=\"let item of partnersItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 align-items-start\"\n                cdkDrag\n              >\n                <!-- Name -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Name\" class=\"col-12\" name=\"name\">\n                    <input class=\"form-control\" formControlName=\"name\" />\n                  </pw-input-container>\n                </div>\n\n                <!-- Blog URL + Drag Handle -->\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Blog Url\" name=\"blog_url\">\n                      <input class=\"form-control\" formControlName=\"blog_url\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n\n                <!-- Video URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Video Url\" name=\"video_url\">\n                    <input class=\"form-control\" formControlName=\"video_url\" />\n                  </pw-input-container>\n                </div>\n\n                <!-- Image URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Image Url\" name=\"image_url\">\n                    <input class=\"form-control\" formControlName=\"image_url\" />\n                  </pw-input-container>\n                </div>\n\n                <!-- Delete Icon -->\n                <div class=\"col-md-12 text-end mt-2\">\n                  <i\n                    ngbTooltip=\"Remove\"\n                    (click)=\"removePartnerItem(i)\"\n                    (keydown.enter)=\"removePartnerItem(i)\"\n                    (keydown.space)=\"removePartnerItem(i)\"\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <!-- Add New Partner -->\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Testimonials Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n            <h4 class=\"mb-4\">Testimonials Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Items List -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(testimonialsItems, $event)\">\n              <div\n                *ngFor=\"let item of testimonialsItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 align-items-start\"\n                cdkDrag\n              >\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Name\" name=\"name\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"name\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Blog URL\" name=\"blog_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Testimonial\" class=\"col-md-10\" name=\"testimonial\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    ngbTooltip=\"Remove\"\n                    (click)=\"removeTestimonialItem(i)\"\n                    (keydown.enter)=\"removeTestimonialItem(i)\"\n                    (keydown.space)=\"removeTestimonialItem(i)\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">\n                  + Add Testimonial\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Video Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n            <h4 class=\"mb-3\">Video Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Video Items -->\n            <div\n              formArrayName=\"items\"\n              class=\"col-12 mt-3\"\n              cdkDropList\n              (cdkDropListDropped)=\"dropItems(videosItems, $event)\"\n            >\n              <div\n                *ngFor=\"let item of videosItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 align-items-start\"\n                cdkDrag\n              >\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Title\" name=\"title\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Blog URL\" name=\"blog_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-10\" name=\"description\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeVideoItem(i)\"\n                    (keydown.enter)=\"removeVideoItem(i)\"\n                    (keydown.space)=\"removeVideoItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">\n                  + Add Video\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Call to Actions Section (CTAs)'\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n            <h4 class=\"mb-4\">CTAs Section</h4>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Image URL\" name=\"image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Button Text\" name=\"button_text\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"button_text\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12\">\n              <pw-input-container label=\"Description\" name=\"description\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n              </pw-input-container>\n            </div>\n\n            <!-- CTA Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(ctasItems, $event)\">\n              <div\n                *ngFor=\"let item of ctasItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 align-items-start\"\n                cdkDrag\n              >\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Image URL\" name=\"image_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Cta URL\" name=\"cta_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"cta_url\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Video URL\" name=\"video_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Title\" name=\"title\">\n                    <input class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Description\" name=\"description\">\n                    <input class=\"form-control\" formControlName=\"description\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-5\">\n                  <pw-input-container label=\"Button Text\" name=\"button_text\">\n                    <input class=\"form-control\" formControlName=\"button_text\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeCtasItem(i)\"\n                    (keydown.enter)=\"removeCtasItem(i)\"\n                    (keydown.space)=\"removeCtasItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Integrations Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n            <h4 class=\"mb-3\">Integrations Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12\" name=\"title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"description\">\n              <textarea class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n            </pw-input-container>\n\n            <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(integrationsItems, $event)\">\n              <div\n                *ngFor=\"let item of integrationsItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 rounded bg-light\"\n                cdkDrag\n              >\n                <pw-input-container label=\"Title\" class=\"col-md-6\" name=\"title\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <div class=\"col-md-5\">\n                    <pw-input-container label=\"Description\" name=\"description\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                    </pw-input-container>\n                </div>\n\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\" name=\"blog_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n                  <i\n                    class=\"fa fa-trash delete-icon align-self-center\"\n                    (click)=\"removeIntegrationItem(i)\"\n                    (keydown.enter)=\"removeIntegrationItem(i)\"\n                    (keydown.space)=\"removeIntegrationItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Contact Us Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n            <h4 class=\"mb-3\">Contact Us Section</h4>\n\n            <pw-input-container label=\"Url\" class=\"col-md-6\" name=\"url\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n            </pw-input-container>\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <div formArrayName=\"questions\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsQuestions, $event)\">\n              <div\n                *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3\"\n                cdkDrag\n              >\n                <pw-input-container label=\"Question\" class=\"col-md-10\" name=\"question\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"question\" />\n                </pw-input-container>\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeContactUsQuestion(i)\"\n                    (keydown.enter)=\"removeContactUsQuestion(i)\"\n                    (keydown.space)=\"removeContactUsQuestion(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder question\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <div class=\"col-12 mt-3\" formArrayName=\"options\" cdkDropList [cdkDropListData]=\"getQuestionOptions(i).controls\" (cdkDropListDropped)=\"dropContactUsOptions(i, $event)\">\n                  <div\n                    class=\"row align-items-center mb-2 border p-3\"\n                    *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\"\n                    [formGroupName]=\"j\"\n                    cdkDrag\n                  >\n                    <pw-input-container label=\"Option\" class=\"col-md-10\" name=\"option\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"option\" />\n                    </pw-input-container>\n\n                    <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n                      <i\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        (click)=\"removeContactUsOption(i, j)\"\n                        (keydown.enter)=\"removeContactUsOption(i, j)\"\n                        (keydown.space)=\"removeContactUsOption(i, j)\"\n                        ngbTooltip=\"Remove Option\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n\n                    <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder option\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <div class=\"text-start\">\n                    <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\">\n                      + Add Option\n                    </button>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-3\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">\n                  + Add Question\n                </button>\n              </div>\n            </div>\n\n            <div formArrayName=\"hubspot\" class=\"col-12 mt-4\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsHubspotItems, $event)\">\n              <h5 class=\"mb-4\">Hubspot Embeds</h5>\n\n              <div\n                *ngFor=\"let hub of contactUsHubspotItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-2\"\n                cdkDrag\n              >\n              <pw-input-container label=\"ID\" class=\"col-md-5\" name=\"id\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"id\" />\n              </pw-input-container>\n\n              <pw-input-container label=\"Position\" class=\"col-md-6\" name=\"position\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"position\" />\n              </pw-input-container>\n              <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-3\">\n                <i\n                  class=\"fa fa-bars cursor-move\"\n                  cdkDragHandle\n                  ngbTooltip=\"Drag to reorder\"\n                  aria-hidden=\"true\"\n                ></i>\n              </div>\n\n                <pw-input-container label=\"Div\" class=\"col-10\" name=\"div\">\n                  <textarea\n                    class=\"form-control\"\n                    rows=\"5\"\n                    formControlName=\"div\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['div']?.errors }\"\n                  ></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeHubspotItem(i)\"\n                    (keydown.enter)=\"removeHubspotItem(i)\"\n                    (keydown.space)=\"removeHubspotItem(i)\"\n                    ngbTooltip=\"Remove Hubspot Embed\"\n                    aria-hidden=\"true\">\n</i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addHubspotItem()\">\n                  + Add Hubspot Embed\n                </button>\n              </div>\n            </div>\n\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Book a Demo Section'\">\n          <div class=\"row mt-4\">\n            <div class=\"col-12\">\n              <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n              <div formGroupName=\"book_demo\">\n                <pw-input-container label=\"Title\" name=\"title\">\n                  <input type=\"text\" formControlName=\"title\" class=\"form-control\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" name=\"description\">\n                  <input type=\"text\" formControlName=\"description\" class=\"form-control\" />\n                </pw-input-container>\n\n                <div formArrayName=\"items\" cdkDropList (cdkDropListDropped)=\"dropBookDemoLinks($event)\">\n                  <div\n                    *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\"\n                    [formGroupName]=\"i\"\n                    class=\"row mb-3 border p-3 align-items-center\"\n                    cdkDrag\n                  >\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link Title\" name=\"title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link URL\" name=\"url\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n                      <i\n                        ngbTooltip=\"Remove\"\n                        (click)=\"removeBookDemoLink(i)\"\n                        (keydown.enter)=\"removeBookDemoLink(i)\"\n                        (keydown.space)=\"removeBookDemoLink(i)\"\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n\n                    <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">\n                    + Add Book Demo Link\n                  </button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Navbar Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"navbar\">\n            <h4 class=\"mb-3\">Navbar Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(navbarItems, $event)\">\n              <div\n                *ngFor=\"let item of navbarItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3\"\n                cdkDrag\n              >\n                <div class=\"row align-items-center\">\n                  <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n\n                  <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                  </pw-input-container>\n\n                  <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n                    <i\n                      class=\"fa fa-trash delete-icon text-danger\"\n                      (click)=\"removeNavbarItem(i)\"\n                      (keydown.enter)=\"removeNavbarItem(i)\"\n                      (keydown.space)=\"removeNavbarItem(i)\"\n                      ngbTooltip=\"Remove Navbar Item\"\n                      aria-hidden=\"true\"\n                    ></i>\n                  </div>\n\n                  <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n                    <i\n                      class=\"fa fa-bars cursor-move\"\n                      cdkDragHandle\n                      ngbTooltip=\"Drag to reorder\"\n                      aria-hidden=\"true\"\n                    ></i>\n                  </div>\n                </div>\n\n                <div\n                  class=\"col-12 mt-3\"\n                  formArrayName=\"subtitles\"\n                  cdkDropList\n                  [cdkDropListData]=\"getNavbarSubtitles(i).controls\"\n                  (cdkDropListDropped)=\"dropNavbarSubtitles(i, $event)\"\n                >\n                  <div\n                    *ngFor=\"let sub of getNavbarSubtitles(i).controls; let j = index\"\n                    [formGroupName]=\"j\"\n                    class=\"row border p-3 mb-2 align-items-center\"\n                    cdkDrag\n                  >\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Title\" name=\"title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Path\" name=\"path\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n                      <i\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        (click)=\"removeSubtitle(i, j)\"\n                        (keydown.enter)=\"removeSubtitle(i, j)\"\n                        (keydown.space)=\"removeSubtitle(i, j)\"\n                        ngbTooltip=\"Remove Subtitle\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n\n                    <div class=\"col-md-1 d-flex justify-content-end\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder subtitle\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addSubtitle(i)\">\n                    + Add Subtitle\n                  </button>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addNavbarItem()\">\n                + Add Navbar Item\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Footer Links Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"footer_links\">\n            <h4 class=\"mb-3\">Footer Links Section</h4>\n\n            <div\n              formArrayName=\"items\"\n              class=\"col-12\"\n              cdkDropList\n              (cdkDropListDropped)=\"dropItems(footerLinksItems, $event)\"\n            >\n              <div\n                *ngFor=\"let item of footerLinksItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3\"\n                cdkDrag\n              >\n                <div class=\"row align-items-center\">\n\n                  <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n\n                  <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                  </pw-input-container>\n                  <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n                    <i\n                      class=\"fa fa-trash delete-icon text-danger\"\n                      (click)=\"removeFooterLinkItem(i)\"\n                      (keydown.enter)=\"removeFooterLinkItem(i)\"\n                      (keydown.space)=\"removeFooterLinkItem(i)\"\n                      ngbTooltip=\"Remove Footer Item\"\n                      aria-hidden=\"true\"\n                    ></i>\n                  </div>\n                  <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n                    <i\n                      class=\"fa fa-bars cursor-move\"\n                      cdkDragHandle\n                      ngbTooltip=\"Drag to reorder\"\n                      aria-hidden=\"true\"\n                    ></i>\n                  </div>\n\n                </div>\n\n                <div\n                  class=\"col-12 mt-3\"\n                  formArrayName=\"subtitles\"\n                  cdkDropList\n                  [cdkDropListData]=\"getFooterSubtitles(i).controls\"\n                  (cdkDropListDropped)=\"dropFooterSubtitles(i, $event)\"\n                >\n                  <div\n                    *ngFor=\"let sub of getFooterSubtitles(i).controls; let j = index\"\n                    [formGroupName]=\"j\"\n                    class=\"row border p-3 mb-2 align-items-center\"\n                    cdkDrag\n                  >\n\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Title\" name=\"title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Path\" name=\"path\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                      </pw-input-container>\n                    </div>\n\n\n\n\n                    <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n                      <i\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        (click)=\"removeFooterSubtitle(i, j)\"\n                        (keydown.enter)=\"removeFooterSubtitle(i, j)\"\n                        (keydown.space)=\"removeFooterSubtitle(i, j)\"\n                        ngbTooltip=\"Remove Subtitle\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                    <div class=\"col-md-1 d-flex justify-content-end\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder subtitle\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <button\n                    type=\"button\"\n                    class=\"btn btn-sm btn-primary mt-2\"\n                    (click)=\"addFooterSubtitle(i)\"\n                  >\n                    + Add Subtitle\n                  </button>\n                </div>\n              </div>\n\n              <button\n                type=\"button\"\n                class=\"btn btn-primary mt-2 mb-2\"\n                (click)=\"addFooterLinkItem()\"\n              >\n                + Add Footer Link\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n\n\n        <p-accordionTab [header]=\"'Guides Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"guides\">\n            <h4 class=\"mb-3\">Guides Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div cdkDropList (cdkDropListDropped)=\"dropItems(guidesItems, $event)\">\n                <div\n                  *ngFor=\"let item of guidesItems.controls; let i = index\"\n                  [formGroupName]=\"i\"\n                  class=\"border p-3 mb-3\"\n                  cdkDrag\n                >\n                  <div class=\"row align-items-start\">\n\n                    <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                    </pw-input-container>\n\n                    <pw-input-container label=\"Button Text\" class=\"col-md-6\" name=\"button_text\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"button_text\" />\n                    </pw-input-container>\n                    <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n                      <i\n                        class=\"fa fa-bars cursor-move\"\n                        cdkDragHandle\n                        ngbTooltip=\"Drag to reorder\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n\n                  <div class=\"row mt-2\">\n                    <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                    </pw-input-container>\n\n                    <pw-input-container label=\"Guide URL\" class=\"col-md-6\" name=\"guide_url\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"guide_url\" />\n                    </pw-input-container>\n                  </div>\n\n                  <div class=\"row mt-2\">\n                    <pw-input-container label=\"Description\" class=\"col-md-11\" name=\"description\">\n                      <textarea\n                        class=\"form-control\"\n                        rows=\"5\"\n                        formControlName=\"description\"\n                        [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n                      ></textarea>\n                    </pw-input-container>\n\n                    <div class=\"col-md-1 d-flex align-items-start justify-content-center mt-3\">\n                      <i\n                        class=\"fa fa-trash delete-icon text-danger\"\n                        (click)=\"removeGuideItem(i)\"\n                        (keydown.enter)=\"removeGuideItem(i)\"\n                        (keydown.space)=\"removeGuideItem(i)\"\n                        ngbTooltip=\"Remove Guide\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addGuideItem()\">\n                  + Add Guide\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n        <p-accordionTab [header]=\"'AB Tests Section'\">\n          <div class=\"row mt-3 mb-4\">\n            <h4 class=\"mb-3\">AB Tests</h4>\n            <div formArrayName=\"ab_tests\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(abTests, $event)\">\n              <div\n                *ngFor=\"let abTest of abTests.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3 border p-3\"\n                cdkDrag\n              >\n                <pw-input-container label=\"Description\" class=\"col-md-5\" name=\"description\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Experiment Name\" class=\"col-md-6\" name=\"experiment_name\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"experiment_name\" />\n                </pw-input-container>\n\n\n                <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n                  <i\n                    class=\"fa fa-bars cursor-move\"\n                    cdkDragHandle\n                    ngbTooltip=\"Drag to reorder\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n\n                <pw-input-container label=\"DB Shard\" class=\"col-md-6\" name=\"db_shard\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"db_shard\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Microservice Name\" class=\"col-md-6\" name=\"microservice_name\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"microservice_name\" />\n                </pw-input-container>\n\n                <div class=\"col-md-12 text-end mt-2\">\n                  <i\n                    class=\"fa fa-trash delete-icon text-danger\"\n                    (click)=\"removeAbTest(i)\"\n                    (keydown.enter)=\"removeAbTest(i)\"\n                    (keydown.space)=\"removeAbTest(i)\"\n                    ngbTooltip=\"Remove AB Test\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addAbTest()\">+ Add AB Test</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n\n\n        <p-accordionTab [header]=\"'Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)'\">\n          <div class=\"mb-3\">\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                form.get('cs_product_id').touched &&\n                                                form.get('cs_product_id').invalid\n                                                    ? { border: '1px solid #ff586b' }\n                                                    : { border: '1px solid gray' }\n                                            \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                            'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n                                        \">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['cs_pdf_download_text'].errors\n                                            }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"cs_image\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image2\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n                [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_pdf_image\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n                [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n                [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg2\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n                [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n      </p-accordion>\n    </div>\n\n    <div class=\"col-12 text-end mt-3\">\n      <button type=\"button\"\n        class=\"btn btn-outline-default me-2\"\n        (click)=\"back()\">\n        {{ 'Button.Cancel' | transloco }}\n      </button>\n      <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n        class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n    </div>\n  </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Partner Image</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n    <pw-image-cropper\n      aspectRatio=\"auto\"\n      (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n      (closeEvent)=\"onClosePartnerModal()\"\n    ></pw-image-cropper>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7$1.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i7$1.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i13.CustomUploaderComponent, selector: "pw-custom-uploader", inputs: ["controlName", "previewData", "aspectRatio", "title"], outputs: ["saveEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -1488,7 +1488,7 @@ class DomainConfigCoreComponent extends AppBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DomainConfigCoreComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: DomainConfigCoreComponent, selector: "pw-domain-config-core", usesInheritance: true, ngImport: i0, template: "<h3>Core Configuration</h3>\n<div>\n  <p class=\"mb-5\">The following details are required to correctly set up your domain.<br/>\n    Make sure each field is completed accurately to ensure smooth operation and full feature access.\n  </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"isLoading\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<form [formGroup]=\"form\"\n  (ngSubmit)=\"onSave()\" *ngIf=\"!isLoading\">\n  <div class=\"row\">\n\n\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [label]=\"'Admin.DomainConfig.CompanyName' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyName' | transloco\" name=\"company_name\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"company_name\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['company_name'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyEmail' | transloco\" name=\"company_email\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"company_email\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['company_email'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyUrl' | transloco\" name=\"company_url\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"company_url\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\" *rbacAllow=\"'Pages.SuperAdmin'\">\n      <pw-input-container\n        [label]=\"'Layout'\"\n        [errorMsg]=\"'Layout is required'\"\n        name=\"layout\">\n        <p-dropdown\n          formControlName=\"layout\"\n          [options]=\"layoutOptions\"\n          optionLabel=\"label\"\n          optionValue=\"value\"\n          placeholder=\"Select Layout\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['layout'].errors }\">\n        </p-dropdown>\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [showTooltip]=\"true\"\n        [label]=\"'Admin.DomainConfig.HostName' | transloco\"\n        [tooltipText]=\"'Admin.DomainConfig.Tooltip.HostName' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.HostName' | transloco\"\n        name=\"host_name\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"host_name\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['host_name'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [showTooltip]=\"true\"\n        [label]=\"'Admin.DomainConfig.InternalPath' | transloco\"\n        [tooltipText]=\"'Admin.DomainConfig.Tooltip.InternalPath' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.InternalPath' | transloco\"\n        name=\"internal_path\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"internal_path\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['internal_path'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.Description' | transloco\"\n        [tooltipText]=\"'Admin.DomainConfig.Tooltip.Description'| transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.Description' | transloco\" name=\"description\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"description\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"\n        [tooltipText]=\"'Admin.DomainConfig.Tooltip.FrontendRepoName'| transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.FrontendRepoName' | transloco\" name=\"frontend_repo_name\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"frontend_repo_name\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['frontend_repo_name'].errors }\" />\n      </pw-input-container>\n    </div>\n\n    <ng-container>\n\n      <h3 class=\"mt-4\">Database and Webhook Configuration</h3>\n      <p class=\"mb-5\">These settings control database and webhook integrations.<br/>\n        Do not modify them unless you\u2019re confident in what you\u2019re doing \u2014 incorrect changes may disrupt system functionality.</p>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [showTooltip]=\"true\"\n          [label]=\"'Admin.DomainConfig.ShardName' | transloco\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardName' | transloco\"\n          [errorMsg]=\"'Admin.DomainConfig.Validation.ShardName' | transloco\"\n          name=\"shard_name\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"shard_name\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['shard_name'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [showTooltip]=\"true\"\n          [label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardUrl' | transloco\"\n          [errorMsg]=\"'Admin.DomainConfig.Validation.ShardUrl' | transloco\"\n          name=\"shard_url\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"shard_url\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['shard_url'].errors }\" />\n        </pw-input-container>\n      </div>\n\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [showTooltip]=\"true\"\n          [label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.IntraServicesToken'| transloco\"\n          [errorMsg]=\"'Admin.DomainConfig.Validation.IntraServicesToken' | transloco\"\n          name=\"intraservices_token\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"intraservices_token\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['intraservices_token'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [showTooltip]=\"true\"\n          [label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.WebhookToken'| transloco\"\n          [errorMsg]=\"'Admin.DomainConfig.Validation.WebhookToken' | transloco\"\n          name=\"webhook_token\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"webhook_token\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['webhook_token'].errors }\" />\n        </pw-input-container>\n      </div>\n\n\n    </ng-container>\n\n  </div>\n\n  <div class=\"col-12 text-end mt-3\">\n    <button type=\"button\"\n      class=\"btn btn-outline-default me-2\"\n      (click)=\"back()\">\n      {{ 'Button.Cancel' | transloco }}\n    </button>\n    <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n      class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n  </div>\n</form>\n", dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: DomainConfigCoreComponent, selector: "pw-domain-config-core", usesInheritance: true, ngImport: i0, template: "<h3>Core Configuration</h3>\n<div>\n  <p class=\"mb-5\">The following details are required to correctly set up your domain.<br/>\n    Make sure each field is completed accurately to ensure smooth operation and full feature access.\n  </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"isLoading\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<form [formGroup]=\"form\"\n  (ngSubmit)=\"onSave()\" *ngIf=\"!isLoading\">\n  <div class=\"row\">\n\n\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [label]=\"'Admin.DomainConfig.CompanyName' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyName' | transloco\" name=\"company_name\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"company_name\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['company_name'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [label]=\"'Admin.DomainConfig.CompanyEmail' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyEmail' | transloco\" name=\"company_email\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"company_email\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['company_email'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [label]=\"'Admin.DomainConfig.CompanyUrl' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.CompanyUrl' | transloco\" name=\"company_url\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"company_url\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\" *rbacAllow=\"'Pages.SuperAdmin'\">\n      <pw-input-container\n        [label]=\"'Layout'\"\n        [errorMsg]=\"'Layout is required'\"\n        name=\"layout\">\n        <p-dropdown\n          formControlName=\"layout\"\n          [options]=\"layoutOptions\"\n          optionLabel=\"label\"\n          optionValue=\"value\"\n          placeholder=\"Select Layout\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['layout'].errors }\">\n        </p-dropdown>\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [showTooltip]=\"true\"\n        [label]=\"'Admin.DomainConfig.HostName' | transloco\"\n        [tooltipText]=\"'Admin.DomainConfig.Tooltip.HostName' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.HostName' | transloco\"\n        name=\"host_name\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"host_name\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['host_name'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [showTooltip]=\"true\"\n        [label]=\"'Admin.DomainConfig.InternalPath' | transloco\"\n        [tooltipText]=\"'Admin.DomainConfig.Tooltip.InternalPath' | transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.InternalPath' | transloco\"\n        name=\"internal_path\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"internal_path\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['internal_path'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.Description' | transloco\"\n        [tooltipText]=\"'Admin.DomainConfig.Tooltip.Description'| transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.Description' | transloco\" name=\"description\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"description\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"col-12 col-sm-3\">\n      <pw-input-container [showTooltip]=\"true\" [label]=\"'Admin.DomainConfig.FrontendRepoName' | transloco\"\n        [tooltipText]=\"'Admin.DomainConfig.Tooltip.FrontendRepoName'| transloco\"\n        [errorMsg]=\"'Admin.DomainConfig.Validation.FrontendRepoName' | transloco\" name=\"frontend_repo_name\">\n        <input type=\"text\" class=\"form-control\" formControlName=\"frontend_repo_name\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['frontend_repo_name'].errors }\" />\n      </pw-input-container>\n    </div>\n\n    <ng-container>\n\n      <h3 class=\"mt-4\">Database and Webhook Configuration</h3>\n      <p class=\"mb-5\">These settings control database and webhook integrations.<br/>\n        Do not modify them unless you\u2019re confident in what you\u2019re doing \u2014 incorrect changes may disrupt system functionality.</p>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [showTooltip]=\"true\"\n          [label]=\"'Admin.DomainConfig.ShardName' | transloco\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardName' | transloco\"\n          [errorMsg]=\"'Admin.DomainConfig.Validation.ShardName' | transloco\"\n          name=\"shard_name\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"shard_name\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['shard_name'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [showTooltip]=\"true\"\n          [label]=\"'Admin.DomainConfig.ShardUrl' | transloco\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.ShardUrl' | transloco\"\n          [errorMsg]=\"'Admin.DomainConfig.Validation.ShardUrl' | transloco\"\n          name=\"shard_url\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"shard_url\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['shard_url'].errors }\" />\n        </pw-input-container>\n      </div>\n\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [showTooltip]=\"true\"\n          [label]=\"'Admin.DomainConfig.IntraServicesToken' | transloco\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.IntraServicesToken'| transloco\"\n          [errorMsg]=\"'Admin.DomainConfig.Validation.IntraServicesToken' | transloco\"\n          name=\"intraservices_token\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"intraservices_token\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['intraservices_token'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [showTooltip]=\"true\"\n          [label]=\"'Admin.DomainConfig.WebhookToken' | transloco\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.WebhookToken'| transloco\"\n          [errorMsg]=\"'Admin.DomainConfig.Validation.WebhookToken' | transloco\"\n          name=\"webhook_token\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"webhook_token\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['webhook_token'].errors }\" />\n        </pw-input-container>\n      </div>\n\n\n    </ng-container>\n\n  </div>\n\n  <div class=\"col-12 text-end mt-3\">\n    <button type=\"button\"\n      class=\"btn btn-outline-default me-2\"\n      (click)=\"back()\">\n      {{ 'Button.Cancel' | transloco }}\n    </button>\n    <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n      class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n  </div>\n</form>\n", dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -2164,7 +2164,7 @@ class AddFaqComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AddFaqComponent, deps: [{ token: i1$2.CommonService }, { token: i1.AdminService }, { token: i1$2.ProductService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AddFaqComponent, selector: "pw-admin-add-edit-incident", viewQueries: [{ propertyName: "editForm", first: true, predicate: ["editForm"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\n<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n      <div class=\"dashboard-body\">\n          <div class=\"me-auto col-xs-6 mt-4\">\n              <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i\n                      class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n              <h3 class=\"mt-3\">Add FAQ</h3>\n          </div>\n          <div class=\"p-2 mt-3\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"row\">\n                <pw-input-container class=\"col-12\" [label]=\"'Admin.Faq.Question' | transloco\" name=\"question\"\n                  [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                  <input type=\"text\" formControlName=\"question\" class=\"form-control\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['question'].errors }\" />\n                </pw-input-container>\n              </div>\n              <div class=\"row\">\n                <pw-input-container class=\"col-12 quill-editor\"\n                  [label]=\"'Admin.Faq.Answer' | transloco\"\n                  name=\"answer\"\n                  [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                  <quill-editor [styles]=\"{ height: '200px'}\" formControlName=\"answer\" class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['answer'].errors, 'quill-container': true  }\">\n                  </quill-editor>\n                </pw-input-container>\n              </div>\n              <div class=\"row justify-content-between\">\n                <div class=\"col-lg-2\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Category' | transloco\"\n                    [label]=\"'Admin.Faq.Category' | transloco\" name=\"category\"\n                    [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                    <p-dropdown [options]=\"categories\" class=\"dropdown-bg-transparent\" (onChange)=\"onChange($event)\"\n                      placeholder=\"Select\" formControlName=\"category\" id=\"category-dropdown\">\n                    </p-dropdown>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-lg-2\" *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Product' | transloco\"\n                    [label]=\"'Admin.Faq.Product' | transloco\" name=\"product_id\"\n                    [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                    <p-dropdown [options]=\"productList\" class=\"dropdown-bg-transparent\" formControlName=\"product_id\"\n                     >\n                    </p-dropdown>\n                  </pw-input-container>\n                </div>\n                <!-- Features keys-->\n                <div class=\"col-lg-2\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Features' | transloco\"\n                    [label]=\"'Admin.Faq.Features' | transloco\" name=\"feature_keys\">\n                    <p-multiSelect [options]=\"featureKeysList\" placeholder=\"Select feature keys\" [showHeader]=\"true\"\n                      [showToggleAll]=\"true\" formControlName=\"feature_keys\" appendTo=\"body\"></p-multiSelect>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-lg-2\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Position' | transloco\"\n                      [label]=\"'Admin.Faq.Position' | transloco\" name=\"position\"\n                      [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                      <div class=\"position\">\n                        <input type=\"number\" min=\"0\" formControlName=\"position\" class=\"form-control\" />\n                      </div>\n                    </pw-input-container>\n                  </div>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"visible\">\n                    {{ 'Admin.Faq.Visible' | transloco }}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                        <span class=\"tooltiptext gradient-custom-branding\">\n                            {{ 'Admin.Faq.Tooltip.Visible' | transloco  }}\n                        </span>\n                    </span>\n                  </label><br />\n                  <ui-switch id=\"visible\" formControlName=\"visible\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"public\">\n                    {{ 'Admin.Faq.Public' | transloco }}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.Public' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch id=\"public\" formControlName=\"public\"></ui-switch>\n                </div>\n\n              </div>\n              <div class=\"row\" *rbacAllow=\"'SuperAdmin'\">\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_shared_faq\" class=\"text-warning\">{{ 'Admin.Faq.SharedFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.SharedFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label>\n                  <br />\n                  <ui-switch name=\"is_shared_faq\" formControlName=\"is_shared_faq\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_admin_faq\" class=\"text-warning\">{{ 'Admin.Faq.AdminFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.AdminFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch formControlName=\"is_admin_faq\" name=\"is_admin_faq\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_build_faq\" class=\"text-warning\">{{ 'Admin.Faq.BuildFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.BuildFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch formControlName=\"is_build_faq\" name=\"is_build_faq\"></ui-switch>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-12 mt-4\">\n                  <div class=\"mb-3 text-end\">\n                    <button type=\"button\" class=\"btn btn-outline-default me-2\" data-bs-toggle=\"collapse\" href=\"#faqCollapse\"\n                       aria-expanded=\"false\" aria-controls=\"faqCollapse\" (keydown.enter)=\"onCancel()\" (click)=\"onCancel()\" > {{ 'Button.Cancel' | transloco }} </button>\n                    <button class=\"btn btn-primary\" [buttonBusy]=\"buttonBusy\">{{ 'Button.Save' | transloco }}</button>\n                  </div>\n                </div>\n              </div>\n            </form>\n\n          </div>\n      </div>\n  </div>\n</div>\n\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.tooltip-info-circle:after{left:.5rem!important}\n"], dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AddFaqComponent, selector: "pw-admin-add-edit-incident", viewQueries: [{ propertyName: "editForm", first: true, predicate: ["editForm"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\n<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n      <div class=\"dashboard-body\">\n          <div class=\"me-auto col-xs-6 mt-4\">\n              <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i\n                      class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n              <h3 class=\"mt-3\">Add FAQ</h3>\n          </div>\n          <div class=\"p-2 mt-3\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"row\">\n                <pw-input-container class=\"col-12\" [label]=\"'Admin.Faq.Question' | transloco\" name=\"question\"\n                  [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                  <input type=\"text\" formControlName=\"question\" class=\"form-control\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['question'].errors }\" />\n                </pw-input-container>\n              </div>\n              <div class=\"row\">\n                <pw-input-container class=\"col-12 quill-editor\"\n                  [label]=\"'Admin.Faq.Answer' | transloco\"\n                  name=\"answer\"\n                  [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                  <quill-editor [styles]=\"{ height: '200px'}\" formControlName=\"answer\" class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['answer'].errors, 'quill-container': true  }\">\n                  </quill-editor>\n                </pw-input-container>\n              </div>\n              <div class=\"row justify-content-between\">\n                <div class=\"col-lg-2\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Category' | transloco\"\n                    [label]=\"'Admin.Faq.Category' | transloco\" name=\"category\"\n                    [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                    <p-dropdown [options]=\"categories\" class=\"dropdown-bg-transparent\" (onChange)=\"onChange($event)\"\n                      placeholder=\"Select\" formControlName=\"category\" id=\"category-dropdown\">\n                    </p-dropdown>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-lg-2\" *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Product' | transloco\"\n                    [label]=\"'Admin.Faq.Product' | transloco\" name=\"product_id\"\n                    [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                    <p-dropdown [options]=\"productList\" class=\"dropdown-bg-transparent\" formControlName=\"product_id\"\n                     >\n                    </p-dropdown>\n                  </pw-input-container>\n                </div>\n                <!-- Features keys-->\n                <div class=\"col-lg-2\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Features' | transloco\"\n                    [label]=\"'Admin.Faq.Features' | transloco\" name=\"feature_keys\">\n                    <p-multiSelect [options]=\"featureKeysList\" placeholder=\"Select feature keys\" [showHeader]=\"true\"\n                      [showToggleAll]=\"true\" formControlName=\"feature_keys\" appendTo=\"body\"></p-multiSelect>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-lg-2\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Position' | transloco\"\n                      [label]=\"'Admin.Faq.Position' | transloco\" name=\"position\"\n                      [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                      <div class=\"position\">\n                        <input type=\"number\" min=\"0\" formControlName=\"position\" class=\"form-control\" />\n                      </div>\n                    </pw-input-container>\n                  </div>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"visible\">\n                    {{ 'Admin.Faq.Visible' | transloco }}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                        <span class=\"tooltiptext gradient-custom-branding\">\n                            {{ 'Admin.Faq.Tooltip.Visible' | transloco  }}\n                        </span>\n                    </span>\n                  </label><br />\n                  <ui-switch id=\"visible\" formControlName=\"visible\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"public\">\n                    {{ 'Admin.Faq.Public' | transloco }}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.Public' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch id=\"public\" formControlName=\"public\"></ui-switch>\n                </div>\n\n              </div>\n              <div class=\"row\" *rbacAllow=\"'SuperAdmin'\">\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_shared_faq\" class=\"text-warning\">{{ 'Admin.Faq.SharedFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.SharedFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label>\n                  <br />\n                  <ui-switch name=\"is_shared_faq\" formControlName=\"is_shared_faq\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_admin_faq\" class=\"text-warning\">{{ 'Admin.Faq.AdminFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.AdminFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch formControlName=\"is_admin_faq\" name=\"is_admin_faq\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_build_faq\" class=\"text-warning\">{{ 'Admin.Faq.BuildFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.BuildFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch formControlName=\"is_build_faq\" name=\"is_build_faq\"></ui-switch>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-12 mt-4\">\n                  <div class=\"mb-3 text-end\">\n                    <button type=\"button\" class=\"btn btn-outline-default me-2\" data-bs-toggle=\"collapse\" href=\"#faqCollapse\"\n                       aria-expanded=\"false\" aria-controls=\"faqCollapse\" (keydown.enter)=\"onCancel()\" (click)=\"onCancel()\" > {{ 'Button.Cancel' | transloco }} </button>\n                    <button class=\"btn btn-primary\" [buttonBusy]=\"buttonBusy\">{{ 'Button.Save' | transloco }}</button>\n                  </div>\n                </div>\n              </div>\n            </form>\n\n          </div>\n      </div>\n  </div>\n</div>\n\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.tooltip-info-circle:after{left:.5rem!important}\n"], dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AddFaqComponent, decorators: [{
             type: Component,
@@ -2346,7 +2346,7 @@ class EditFaqComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: EditFaqComponent, deps: [{ token: i1$2.CommonService }, { token: i1.AdminService }, { token: i1$2.ProductService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: EditFaqComponent, selector: "pw-admin-edit-incident", viewQueries: [{ propertyName: "editForm", first: true, predicate: ["editForm"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\n<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n      <div class=\"dashboard-body\">\n          <div class=\"me-auto col-xs-6 mt-4\">\n              <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i\n                      class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n              <h3 class=\"mt-3\">Edit FAQ</h3>\n          </div>\n          <div class=\"w-100 text-center mt-3\"\n          *ngIf=\"isLoaded\">\n          <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n        </div>\n          <div class=\"p-2 mt-3\" *ngIf=\"!isLoaded\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"row\">\n                <pw-input-container class=\"col-12\" [label]=\"'Admin.Faq.Question' | transloco\" name=\"question\"\n                  [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                  <input type=\"text\" formControlName=\"question\" class=\"form-control\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['question'].errors }\" />\n                </pw-input-container>\n              </div>\n              <div class=\"row\">\n                <pw-input-container class=\"col-12 quill-editor\"\n                  [label]=\"'Admin.Faq.Answer' | transloco\"\n                  name=\"answer\"\n                  [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                  <quill-editor [styles]=\"{ height: '200px'}\" formControlName=\"answer\" class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['answer'].errors, 'quill-container': true  }\">\n                  </quill-editor>\n                </pw-input-container>\n              </div>\n              <div class=\"row justify-content-between\">\n                <div class=\"col-lg-2\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Category' | transloco\"\n                    [label]=\"'Admin.Faq.Category' | transloco\" name=\"category\"\n                    [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                    <p-dropdown [options]=\"categories\" class=\"dropdown-bg-transparent\" (onChange)=\"onChange($event)\"\n                      placeholder=\"Select\" formControlName=\"category\" id=\"category-dropdown\">\n                    </p-dropdown>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-lg-2\" *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Product' | transloco\"\n                    [label]=\"'Admin.Faq.Product' | transloco\" name=\"product_id\"\n                    [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                    <p-dropdown [options]=\"productList\" class=\"dropdown-bg-transparent\" formControlName=\"product_id\"\n                      >\n                    </p-dropdown>\n                  </pw-input-container>\n                </div>\n                <!-- Features keys-->\n                <div class=\"col-lg-2\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Features' | transloco\"\n                    [label]=\"'Admin.Faq.Features' | transloco\" name=\"feature_keys\">\n                    <p-multiSelect [options]=\"featureKeysList\" placeholder=\"Select feature keys\" [showHeader]=\"true\"\n                      [showToggleAll]=\"true\" formControlName=\"feature_keys\" appendTo=\"body\"></p-multiSelect>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-lg-2\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Position' | transloco\"\n                      [label]=\"'Admin.Faq.Position' | transloco\" name=\"position\"\n                      [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                      <div class=\"position\">\n                        <input type=\"number\" min=\"0\" formControlName=\"position\" class=\"form-control\" />\n                      </div>\n                    </pw-input-container>\n                  </div>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"visible\">\n                    {{ 'Admin.Faq.Visible' | transloco }}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                        <span class=\"tooltiptext gradient-custom-branding\">\n                            {{ 'Admin.Faq.Tooltip.Visible' | transloco  }}\n                        </span>\n                    </span>\n                  </label><br />\n                  <ui-switch id=\"visible\" formControlName=\"visible\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"public\">\n                    {{ 'Admin.Faq.Public' | transloco }}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.Public' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch id=\"public\" formControlName=\"public\"></ui-switch>\n                </div>\n\n              </div>\n              <div class=\"row\" *rbacAllow=\"'SuperAdmin'\">\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_shared_faq\" class=\"text-warning\">{{ 'Admin.Faq.SharedFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.SharedFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label>\n                  <br />\n                  <ui-switch name=\"is_shared_faq\" formControlName=\"is_shared_faq\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_admin_faq\" class=\"text-warning\">{{ 'Admin.Faq.AdminFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.AdminFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch formControlName=\"is_admin_faq\" name=\"is_admin_faq\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_build_faq\" class=\"text-warning\">{{ 'Admin.Faq.BuildFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.BuildFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch formControlName=\"is_build_faq\" name=\"is_build_faq\"></ui-switch>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-12 mt-4\">\n                  <div class=\"mb-3 text-end\">\n                    <button type=\"button\" class=\"btn btn-outline-default me-2\" data-bs-toggle=\"collapse\" href=\"#faqCollapse\"\n                      aria-expanded=\"false\" aria-controls=\"faqCollapse\" (keydown.enter)=\"onCancel()\"  (click)=\"onCancel()\"> {{ 'Button.Cancel' | transloco }} </button>\n                    <button class=\"btn btn-primary\" [buttonBusy]=\"buttonBusy\">{{ 'Button.Save' | transloco }}</button>\n                  </div>\n                </div>\n              </div>\n            </form>\n\n          </div>\n      </div>\n  </div>\n</div>\n\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.tooltip-info-circle:after{left:.5rem!important}\n"], dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: EditFaqComponent, selector: "pw-admin-edit-incident", viewQueries: [{ propertyName: "editForm", first: true, predicate: ["editForm"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\n<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n      <div class=\"dashboard-body\">\n          <div class=\"me-auto col-xs-6 mt-4\">\n              <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i\n                      class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n              <h3 class=\"mt-3\">Edit FAQ</h3>\n          </div>\n          <div class=\"w-100 text-center mt-3\"\n          *ngIf=\"isLoaded\">\n          <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n        </div>\n          <div class=\"p-2 mt-3\" *ngIf=\"!isLoaded\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"row\">\n                <pw-input-container class=\"col-12\" [label]=\"'Admin.Faq.Question' | transloco\" name=\"question\"\n                  [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                  <input type=\"text\" formControlName=\"question\" class=\"form-control\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['question'].errors }\" />\n                </pw-input-container>\n              </div>\n              <div class=\"row\">\n                <pw-input-container class=\"col-12 quill-editor\"\n                  [label]=\"'Admin.Faq.Answer' | transloco\"\n                  name=\"answer\"\n                  [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                  <quill-editor [styles]=\"{ height: '200px'}\" formControlName=\"answer\" class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['answer'].errors, 'quill-container': true  }\">\n                  </quill-editor>\n                </pw-input-container>\n              </div>\n              <div class=\"row justify-content-between\">\n                <div class=\"col-lg-2\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Category' | transloco\"\n                    [label]=\"'Admin.Faq.Category' | transloco\" name=\"category\"\n                    [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                    <p-dropdown [options]=\"categories\" class=\"dropdown-bg-transparent\" (onChange)=\"onChange($event)\"\n                      placeholder=\"Select\" formControlName=\"category\" id=\"category-dropdown\">\n                    </p-dropdown>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-lg-2\" *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Product' | transloco\"\n                    [label]=\"'Admin.Faq.Product' | transloco\" name=\"product_id\"\n                    [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                    <p-dropdown [options]=\"productList\" class=\"dropdown-bg-transparent\" formControlName=\"product_id\"\n                      >\n                    </p-dropdown>\n                  </pw-input-container>\n                </div>\n                <!-- Features keys-->\n                <div class=\"col-lg-2\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Features' | transloco\"\n                    [label]=\"'Admin.Faq.Features' | transloco\" name=\"feature_keys\">\n                    <p-multiSelect [options]=\"featureKeysList\" placeholder=\"Select feature keys\" [showHeader]=\"true\"\n                      [showToggleAll]=\"true\" formControlName=\"feature_keys\" appendTo=\"body\"></p-multiSelect>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-lg-2\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Faq.Tooltip.Position' | transloco\"\n                      [label]=\"'Admin.Faq.Position' | transloco\" name=\"position\"\n                      [errorMsg]=\"'Admin.Faq.Validation.FieldRequired' | transloco\">\n                      <div class=\"position\">\n                        <input type=\"number\" min=\"0\" formControlName=\"position\" class=\"form-control\" />\n                      </div>\n                    </pw-input-container>\n                  </div>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"visible\">\n                    {{ 'Admin.Faq.Visible' | transloco }}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                        <span class=\"tooltiptext gradient-custom-branding\">\n                            {{ 'Admin.Faq.Tooltip.Visible' | transloco  }}\n                        </span>\n                    </span>\n                  </label><br />\n                  <ui-switch id=\"visible\" formControlName=\"visible\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"public\">\n                    {{ 'Admin.Faq.Public' | transloco }}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.Public' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch id=\"public\" formControlName=\"public\"></ui-switch>\n                </div>\n\n              </div>\n              <div class=\"row\" *rbacAllow=\"'SuperAdmin'\">\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_shared_faq\" class=\"text-warning\">{{ 'Admin.Faq.SharedFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.SharedFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label>\n                  <br />\n                  <ui-switch name=\"is_shared_faq\" formControlName=\"is_shared_faq\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_admin_faq\" class=\"text-warning\">{{ 'Admin.Faq.AdminFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.AdminFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch formControlName=\"is_admin_faq\" name=\"is_admin_faq\"></ui-switch>\n                </div>\n                <div class=\"col-4 col-lg-2\">\n                  <label for=\"is_build_faq\" class=\"text-warning\">{{ 'Admin.Faq.BuildFaq' | transloco}}\n                    <span class=\"info-circle tooltip-wrap tooltip-info-circle\">\n                      <span class=\"tooltiptext gradient-custom-branding\">\n                          {{ 'Admin.Faq.Tooltip.BuildFaq' | transloco  }}\n                      </span>\n                    </span>\n                  </label><br />\n                  <ui-switch formControlName=\"is_build_faq\" name=\"is_build_faq\"></ui-switch>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-12 mt-4\">\n                  <div class=\"mb-3 text-end\">\n                    <button type=\"button\" class=\"btn btn-outline-default me-2\" data-bs-toggle=\"collapse\" href=\"#faqCollapse\"\n                      aria-expanded=\"false\" aria-controls=\"faqCollapse\" (keydown.enter)=\"onCancel()\"  (click)=\"onCancel()\"> {{ 'Button.Cancel' | transloco }} </button>\n                    <button class=\"btn btn-primary\" [buttonBusy]=\"buttonBusy\">{{ 'Button.Save' | transloco }}</button>\n                  </div>\n                </div>\n              </div>\n            </form>\n\n          </div>\n      </div>\n  </div>\n</div>\n\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.tooltip-info-circle:after{left:.5rem!important}\n"], dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: EditFaqComponent, decorators: [{
             type: Component,
@@ -3257,7 +3257,7 @@ class LoginNotificationDetailsComponent extends AppBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: LoginNotificationDetailsComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }, { token: i1$2.ProductService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: LoginNotificationDetailsComponent, selector: "pw-login-notification-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          [routerLink]=\"[routers.loginNotifications]\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n        </a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>{{ id ? 'Edit' : 'Add New' }}: Dashboard Notification</span>\n        </h3>\n      </div>\n      <div class=\"w-100 text-center mt-3\"\n        *ngIf=\"isLoading\">\n        <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n      </div>\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n          *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-4 col-md-3\"\n              *ngIf=\"loginNotificationTypes$ | async as types\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.LoginNotification.Tooltip.NotificationType' | transloco\"\n                [label]=\"'Admin.LoginNotification.NotificationType' | transloco\"\n                name=\"notification_type\"\n                [errorMsg]=\"\n                                    'Admin.LoginNotification.Validation.NotificationType'\n                                        | transloco\n                                \">\n\n                <p-dropdown\n                  [options]=\"types['available_types']\"\n                  formControlName=\"notification_type\"\n                  [ngClass]=\"{'is-invalid': submitted && f['notification_type'].errors}\"\n                  [placeholder]=\"'Select Type'\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <!-- Feature keys -->\n            <div class=\"mb-3 col-12 col-sm-4 col-md-3\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.LoginNotification.Tooltip.Features' | transloco\"\n                [label]=\"'Admin.LoginNotification.Features' | transloco\"\n                name=\"feature_keys\"\n                [errorMsg]=\"\n                                    'Admin.LoginNotification.Validation.Features' | transloco\n                                \">\n                <p-multiSelect [options]=\"featureKeys\"\n                  placeholder=\"Select feature keys\"\n                  [showHeader]=\"true\"\n                  [showToggleAll]=\"true\"\n                  formControlName=\"feature_keys\"\n                  appendTo=\"body\"></p-multiSelect>\n              </pw-input-container>\n            </div>\n            <!-- visible_from -->\n            <div class=\"col-12 col-sm-4 col-md-2 mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.LoginNotification.Tooltip.VisibleFrom' | transloco\"\n                  [label]=\"'Admin.LoginNotification.VisibleFrom' | transloco\"\n                  name=\"visible_from\"\n                  [errorMsg]=\"\n                                        'Admin.LoginNotification.Validation.VisibleFrom' | transloco\n                                    \">\n                    <p-calendar formControlName=\"visible_from\"\n                      [showIcon]=\"true\"\n                      [showTime]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Visible Date'\"\n                      [ngClass]=\"{\n                                                'is-invalid': submitted && f['visible_from'].errors\n                                            }\">\n                    </p-calendar>\n                </pw-input-container>\n            </div>\n            <!-- visible_until -->\n            <div class=\"col-12 col-sm-4 col-md-2 mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.LoginNotification.Tooltip.VisibleUntil' | transloco\"\n                  [label]=\"'Admin.LoginNotification.VisibleUntil' | transloco\"\n                  name=\"visible_until\"\n                  [errorMsg]=\"\n                                        'Admin.LoginNotification.Validation.VisibleUntil'\n                                            | transloco\n                                    \">\n                  <div>\n                    <p-calendar formControlName=\"visible_until\"\n                      [showIcon]=\"true\"\n                      [showTime]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Visible Until Date'\"\n                      [ngClass]=\"{\n                                                'is-invalid': submitted && f['visible_until'].errors\n                                            }\">\n                    </p-calendar>\n                  </div>\n                </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-sm-4 col-md-2\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.LoginNotification.Tooltip.Permanent'|transloco\"\n                [label]=\"'Admin.LoginNotification.IsPermanent' | transloco\"\n                name=\"is_permanent\">\n                <ui-switch formControlName=\"is_permanent\"\n                  name=\"is_permanent\">\n                </ui-switch>\n              </pw-input-container>\n            </div>\n            <!-- body -->\n            <div class=\"col-12 col-sm-12\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.LoginNotification.Tooltip.Body' | transloco\"\n                [isLeftTooltip]=\"true\"\n                [label]=\"'Admin.LoginNotification.Body' | transloco\"\n                name=\"body\"\n                [errorMsg]=\"'Admin.LoginNotification.Validation.Body' | transloco\">\n                <textarea rows=\"3\"\n                  type=\"text\"\n                  class=\"form-control\"\n                  formControlName=\"body\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\"></textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"col-12 text-end mt-3\">\n            <button type=\"button\"\n              class=\"btn btn-outline-default me-2\"\n              (click)=\"back()\">\n              {{ 'Button.Cancel' | transloco }}\n            </button>\n            <button type=\"submit\"\n              [buttonBusy]=\"buttonBusy\"\n              class=\"btn btn-primary\">\n              {{ 'Button.Submit' | transloco }}\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".form-select{border-radius:5px!important;border:1px solid #ced4da;height:36px!important}\n"], dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: LoginNotificationDetailsComponent, selector: "pw-login-notification-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          [routerLink]=\"[routers.loginNotifications]\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n        </a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>{{ id ? 'Edit' : 'Add New' }}: Dashboard Notification</span>\n        </h3>\n      </div>\n      <div class=\"w-100 text-center mt-3\"\n        *ngIf=\"isLoading\">\n        <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n      </div>\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n          *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-4 col-md-3\"\n              *ngIf=\"loginNotificationTypes$ | async as types\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.LoginNotification.Tooltip.NotificationType' | transloco\"\n                [label]=\"'Admin.LoginNotification.NotificationType' | transloco\"\n                name=\"notification_type\"\n                [errorMsg]=\"\n                                    'Admin.LoginNotification.Validation.NotificationType'\n                                        | transloco\n                                \">\n\n                <p-dropdown\n                  [options]=\"types['available_types']\"\n                  formControlName=\"notification_type\"\n                  [ngClass]=\"{'is-invalid': submitted && f['notification_type'].errors}\"\n                  [placeholder]=\"'Select Type'\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <!-- Feature keys -->\n            <div class=\"mb-3 col-12 col-sm-4 col-md-3\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.LoginNotification.Tooltip.Features' | transloco\"\n                [label]=\"'Admin.LoginNotification.Features' | transloco\"\n                name=\"feature_keys\"\n                [errorMsg]=\"\n                                    'Admin.LoginNotification.Validation.Features' | transloco\n                                \">\n                <p-multiSelect [options]=\"featureKeys\"\n                  placeholder=\"Select feature keys\"\n                  [showHeader]=\"true\"\n                  [showToggleAll]=\"true\"\n                  formControlName=\"feature_keys\"\n                  appendTo=\"body\"></p-multiSelect>\n              </pw-input-container>\n            </div>\n            <!-- visible_from -->\n            <div class=\"col-12 col-sm-4 col-md-2 mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.LoginNotification.Tooltip.VisibleFrom' | transloco\"\n                  [label]=\"'Admin.LoginNotification.VisibleFrom' | transloco\"\n                  name=\"visible_from\"\n                  [errorMsg]=\"\n                                        'Admin.LoginNotification.Validation.VisibleFrom' | transloco\n                                    \">\n                    <p-calendar formControlName=\"visible_from\"\n                      [showIcon]=\"true\"\n                      [showTime]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Visible Date'\"\n                      [ngClass]=\"{\n                                                'is-invalid': submitted && f['visible_from'].errors\n                                            }\">\n                    </p-calendar>\n                </pw-input-container>\n            </div>\n            <!-- visible_until -->\n            <div class=\"col-12 col-sm-4 col-md-2 mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.LoginNotification.Tooltip.VisibleUntil' | transloco\"\n                  [label]=\"'Admin.LoginNotification.VisibleUntil' | transloco\"\n                  name=\"visible_until\"\n                  [errorMsg]=\"\n                                        'Admin.LoginNotification.Validation.VisibleUntil'\n                                            | transloco\n                                    \">\n                  <div>\n                    <p-calendar formControlName=\"visible_until\"\n                      [showIcon]=\"true\"\n                      [showTime]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Visible Until Date'\"\n                      [ngClass]=\"{\n                                                'is-invalid': submitted && f['visible_until'].errors\n                                            }\">\n                    </p-calendar>\n                  </div>\n                </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-sm-4 col-md-2\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.LoginNotification.Tooltip.Permanent'|transloco\"\n                [label]=\"'Admin.LoginNotification.IsPermanent' | transloco\"\n                name=\"is_permanent\">\n                <ui-switch formControlName=\"is_permanent\"\n                  name=\"is_permanent\">\n                </ui-switch>\n              </pw-input-container>\n            </div>\n            <!-- body -->\n            <div class=\"col-12 col-sm-12\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.LoginNotification.Tooltip.Body' | transloco\"\n                [isLeftTooltip]=\"true\"\n                [label]=\"'Admin.LoginNotification.Body' | transloco\"\n                name=\"body\"\n                [errorMsg]=\"'Admin.LoginNotification.Validation.Body' | transloco\">\n                <textarea rows=\"3\"\n                  type=\"text\"\n                  class=\"form-control\"\n                  formControlName=\"body\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\"></textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"col-12 text-end mt-3\">\n            <button type=\"button\"\n              class=\"btn btn-outline-default me-2\"\n              (click)=\"back()\">\n              {{ 'Button.Cancel' | transloco }}\n            </button>\n            <button type=\"submit\"\n              [buttonBusy]=\"buttonBusy\"\n              class=\"btn btn-primary\">\n              {{ 'Button.Submit' | transloco }}\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".form-select{border-radius:5px!important;border:1px solid #ced4da;height:36px!important}\n"], dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -3451,7 +3451,7 @@ class MailerDetailsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: MailerDetailsComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: MailerDetailsComponent, selector: "pw-mailer-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\" [routerLink]=\"[routers.mailerDetails]\" class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n        </a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>Mailer: {{ isLoading ? '' : (data?.id ? \"Edit\" : 'Add New') }}</span>\n        </h3>\n      </div>\n\n    <div class=\"w-100 text-center mt-3\" *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n    </div>\n\n    <div class=\"p-2 mt-3\" *ngIf=\"!isLoading\">\n      <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n        <div class=\"row\">\n          <!-- Subject Field -->\n         <!-- Subject Field -->\n<div class=\"col-12 col-md-6\">\n  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Mailer.Tooltip.Subject' | transloco\"\n    [label]=\"'Label.Subject' | transloco\" class=\"mb-3\" name=\"subject\" [errorMsg]=\"'Admin.Mailer.Validation.Subject' | transloco\">\n    <input type=\"text\" class=\"form-control\" formControlName=\"subject\" [ngClass]=\"{ 'is-invalid': submitted && f['subject'].errors }\" />\n  </pw-input-container>\n</div>\n\n<!-- Body Field -->\n<div class=\"col-12 col-md-6\">\n  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Mailer.Tooltip.TemplateName' | transloco\"\n  [label]=\"'Label.TemplateName' | transloco\" class=\"mb-3\" name=\"template_name\" [errorMsg]=\"'Admin.Mailer.Validation.TemplateName' | transloco\">\n              <p-dropdown [options]=\"availableMailerTypes\"\n                formControlName=\"template_name\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['template_name'].errors }\">\n              </p-dropdown>\n            </pw-input-container>\n</div>\n<pw-input-container  [showTooltip]=\"true\" [tooltipText]=\"'Admin.Mailer.Tooltip.Body' | transloco\"\n[isLeftTooltip]=\"true\"\n[label]=\"'Label.Body' | transloco\" class=\"mb-3\" name=\"body\" [errorMsg]=\"'Admin.Mailer.Validation.Body' | transloco\">\n<quill-editor [styles]=\"{ height: '450px' }\"\n  class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n  formControlName=\"body\"\n  [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors, 'quill-container': true  }\">\n</quill-editor>\n</pw-input-container>\n\n          <!-- Form Actions -->\n          <div class=\"col-12 text-end mt-3\">\n            <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\">\n              {{ 'Button.Cancel' | transloco }}\n            </button>\n            <button type=\"submit\" [buttonBusy]=\"buttonBusy\" class=\"btn btn-primary\">\n              {{ 'Button.Submit' | transloco }}\n            </button>\n          </div>\n        </div>\n      </form>\n    </div>\n  </div>\n</div>\n</div>", dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: MailerDetailsComponent, selector: "pw-mailer-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\" [routerLink]=\"[routers.mailerDetails]\" class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n        </a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>Mailer: {{ isLoading ? '' : (data?.id ? \"Edit\" : 'Add New') }}</span>\n        </h3>\n      </div>\n\n    <div class=\"w-100 text-center mt-3\" *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n    </div>\n\n    <div class=\"p-2 mt-3\" *ngIf=\"!isLoading\">\n      <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n        <div class=\"row\">\n          <!-- Subject Field -->\n         <!-- Subject Field -->\n<div class=\"col-12 col-md-6\">\n  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Mailer.Tooltip.Subject' | transloco\"\n    [label]=\"'Label.Subject' | transloco\" class=\"mb-3\" name=\"subject\" [errorMsg]=\"'Admin.Mailer.Validation.Subject' | transloco\">\n    <input type=\"text\" class=\"form-control\" formControlName=\"subject\" [ngClass]=\"{ 'is-invalid': submitted && f['subject'].errors }\" />\n  </pw-input-container>\n</div>\n\n<!-- Body Field -->\n<div class=\"col-12 col-md-6\">\n  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Mailer.Tooltip.TemplateName' | transloco\"\n  [label]=\"'Label.TemplateName' | transloco\" class=\"mb-3\" name=\"template_name\" [errorMsg]=\"'Admin.Mailer.Validation.TemplateName' | transloco\">\n              <p-dropdown [options]=\"availableMailerTypes\"\n                formControlName=\"template_name\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['template_name'].errors }\">\n              </p-dropdown>\n            </pw-input-container>\n</div>\n<pw-input-container  [showTooltip]=\"true\" [tooltipText]=\"'Admin.Mailer.Tooltip.Body' | transloco\"\n[isLeftTooltip]=\"true\"\n[label]=\"'Label.Body' | transloco\" class=\"mb-3\" name=\"body\" [errorMsg]=\"'Admin.Mailer.Validation.Body' | transloco\">\n<quill-editor [styles]=\"{ height: '450px' }\"\n  class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n  formControlName=\"body\"\n  [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors, 'quill-container': true  }\">\n</quill-editor>\n</pw-input-container>\n\n          <!-- Form Actions -->\n          <div class=\"col-12 text-end mt-3\">\n            <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\">\n              {{ 'Button.Cancel' | transloco }}\n            </button>\n            <button type=\"submit\" [buttonBusy]=\"buttonBusy\" class=\"btn btn-primary\">\n              {{ 'Button.Submit' | transloco }}\n            </button>\n          </div>\n        </div>\n      </form>\n    </div>\n  </div>\n</div>\n</div>", dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -3882,7 +3882,7 @@ class NewsletterItemDetailsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: NewsletterItemDetailsComponent, deps: [{ token: i1.AdminService }, { token: i1$2.TagService }, { token: i1$2.ProductService }, { token: i1$2.AuthService }, { token: i0.Injector }, { token: i3$4.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: NewsletterItemDetailsComponent, selector: "pw-newsletter-item-details", viewQueries: [{ propertyName: "placesRef", first: true, predicate: ["ngxPlaces"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          [routerLink]=\"[routers.newsletter]\"\n          class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"\">Newsletter Item: {{ isLoading ? '' : (data?.title ? data?.title : 'Add New') }}</h3>\n      </div>\n      <div class=\"mt-1\">\n        <p class=\"my-4\">\n          To personalize the subject or body, use {{ userNameSyntax }} to insert the user\u2019s name.\n        </p>\n        <div class=\"w-100 text-center mt-3\"\n        *ngIf=\"isLoading\">\n        <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n      </div>\n        <form [formGroup]=\"form\"\n        *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <!-- Title -->\n            <pw-input-container [label]=\"'Admin.NewsletterItem.Title' | transloco\"\n              class=\"col-md-6\"\n              name=\"title\"\n              [errorMsg]=\"'Admin.NewsletterItem.Validation.Title' | transloco\">\n              <input type=\"text\"\n                class=\"form-control\"\n                formControlName=\"title\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n            </pw-input-container>\n            <!-- Newsletter -->\n            <pw-input-container [label]=\"'Admin.NewsletterItem.Newsletter' | transloco\"\n              class=\"col-md-6\"\n              name=\"newsletter_id\"\n              [errorMsg]=\"'Admin.NewsletterItem.Validation.Newsletter' | transloco\">\n              <p-dropdown [options]=\"newsletters\"\n                formControlName=\"newsletter_id\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['newsletter_id'].errors }\">\n              </p-dropdown>\n            </pw-input-container>\n            <!-- Rich Text Editor -->\n            <pw-input-container [label]=\"'Admin.NewsletterItem.Body' | transloco\"\n              class=\"col-12\"\n              name=\"body\"\n              [errorMsg]=\"'Admin.NewsletterItem.Validation.Body' | transloco\">\n              <quill-editor [styles]=\"{ height: '450px' }\"\n                class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n                formControlName=\"body\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors, 'quill-container': true  }\">\n              </quill-editor>\n            </pw-input-container>\n            <!-- Location -->\n            <pw-input-container [showTooltip]=\"true\"\n              [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Location' | transloco\"\n              [label]=\"'Admin.NewsletterItem.Location' | transloco\"\n              class=\"col-md-6\"\n              name=\"location\">\n              <input ngx-gp-autocomplete\n                class=\"form-control\"\n                #places=\"ngx-places\"\n                formControlName=\"location\"\n                (onAddressChange)=\"handleAddressChange($event)\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n            </pw-input-container>\n            <div class=\"ui-fluid skills-modal col-12 col-md-6 mt-1 mb-3\">\n              <label for=\"\">{{ 'Admin.NewsletterItem.Tags' | transloco }}\n                <span class=\"ms-1 tooltip-wrap\"\n                  [pTooltip]=\"'Admin.NewsletterItem.Tooltip.Tags' | transloco\"\n                  [appendTo]=\"'body'\"\n                  [tooltipPosition]=\"'top'\">\n                  <i class=\"fas fa-info-circle\"></i>\n                </span>\n              </label>\n              <p-autoComplete [(ngModel)]=\"selectedTags\"\n                [suggestions]=\"tagsSuggestion\"\n                dataKey=\"id\"\n                field=\"name\"\n                (completeMethod)=\"search($event)\"\n                styleClass=\"w-100\"\n                [minLength]=\"1\"\n                [maxlength]=\"10\"\n                [dropdown]=\"true\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                placeholder=\"Tags\"\n                [multiple]=\"true\"></p-autoComplete>\n            </div>\n            <!-- Products -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Products' | transloco\"\n                [label]=\"'Admin.NewsletterItem.Products' | transloco\"\n                name=\"product_ids\">\n                <p-multiSelect [options]=\"products\"\n                  placeholder=\"Select Products\"\n                  [showHeader]=\"true\"\n                  [showToggleAll]=\"true\"\n                  formControlName=\"product_ids\"\n                  appendTo=\"body\"></p-multiSelect>\n              </pw-input-container>\n            </div>\n            <!-- Features -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Features' | transloco\"\n                [label]=\"'Admin.NewsletterItem.Features' | transloco\"\n                name=\"feature_keys\">\n                <p-multiSelect [options]=\"featureKeys\"\n                  placeholder=\"Select feature keys\"\n                  [showHeader]=\"true\"\n                  [showToggleAll]=\"true\"\n                  formControlName=\"feature_keys\"\n                  appendTo=\"body\"></p-multiSelect>\n              </pw-input-container>\n            </div>\n            <!-- Previous Newsletter Items -->\n            <div class=\"col-12\"\n              [ngClass]=\"f['main_tag_id'].value ? 'col-md-3' : 'col-md-6'\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.NewsletterItem.PreviousNewsletter' | transloco\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.PreviousNewsletter'\n                                            | transloco\n                                    \"\n                  name=\"main_tag_id\">\n                  <p-dropdown [options]=\"newsletterItems\"\n                    formControlName=\"main_tag_id\"\n                    [ngClass]=\"{\n                                            'is-invalid': submitted && f['main_tag_id'].errors\n                                        }\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- DAYS TO WAIT -->\n            <div class=\"col-md-3 col-xs-6\"\n              *ngIf=\"form.get('main_tag_id').value\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.NewsletterItem.DaysToWait' | transloco\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.DaysToWaitFromPreviousNewsletter'\n                                            | transloco\n                                    \"\n                  name=\"days_to_wait_from_previous_newsletter\">\n                  <input type=\"number\"\n                    class=\"form-control\"\n                    formControlName=\"days_to_wait_from_previous_newsletter\"\n                    [ngClass]=\"{\n                                            'is-invalid':\n                                                submitted &&\n                                                f['days_to_wait_from_previous_newsletter'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- IS SENT -->\n            <div class=\"col-md-3 col-xs-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.NewsletterItem.SendDate' | transloco\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.SendDate' | transloco\n                                    \"\n                  [errorMsg]=\"\n                                        'Admin.NewsletterItem.Validation.SendDate' | transloco\n                                    \"\n                  name=\"send_at\">\n                  <div>\n                    <p-calendar formControlName=\"send_at\"\n                      [showIcon]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Send Date'\"\n                      [ngClass]=\"{\n                                                'is-invalid': submitted && f['send_at'].errors\n                                            }\">\n                    </p-calendar>\n                  </div>\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- Expiry Date for Newsletter -->\n            <div class=\"col-md-3 col-xs-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.SendUntil' | transloco\n                                    \"\n                  [label]=\"'Admin.NewsletterItem.SendUntil' | transloco\"\n                  name=\"send_until\"\n                  [errorMsg]=\"\n                                        'Admin.NewsletterItem.Validation.SendUntil' | transloco\n                                    \">\n                  <div>\n                    <p-calendar formControlName=\"send_until\"\n                      [showIcon]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Send Until Date'\"\n                      [ngClass]=\"{\n                                                'is-invalid': submitted && f['send_until'].errors\n                                            }\">\n                    </p-calendar>\n                  </div>\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- Only new users -->\n            <div class=\"col-md-3\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.OnlyNewUsers' | transloco\n                                    \"\n                  [label]=\"'Admin.NewsletterItem.OnlyNewUsers' | transloco\"\n                  name=\"only_new_users\">\n                  <ui-switch formControlName=\"only_new_users\"\n                    name=\"only_new_users\"\n                    [ngClass]=\"{\n                                            'is-invalid': submitted && f['only_new_users'].errors\n                                        }\">\n                  </ui-switch>\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- IS PUSHED -->\n            <div class=\"col-md-3\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.ShouldDeliver' | transloco\n                                    \"\n                  [label]=\"'Admin.NewsletterItem.ShouldDeliver' | transloco\"\n                  name=\"is_pushed\">\n                  <ui-switch formControlName=\"is_pushed\"\n                    name=\"is_pushed\"\n                    [ngClass]=\"{\n                                            'is-invalid': submitted && f['is_pushed'].errors\n                                        }\">\n                  </ui-switch>\n                </pw-input-container>\n              </div>\n            </div>\n          </div>\n          <div class=\"row\"></div>\n          <div class=\"row text-end mt-3\">\n            <div class=\"col-12\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Save' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i15$1.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: NewsletterItemDetailsComponent, selector: "pw-newsletter-item-details", viewQueries: [{ propertyName: "placesRef", first: true, predicate: ["ngxPlaces"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          [routerLink]=\"[routers.newsletter]\"\n          class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"\">Newsletter Item: {{ isLoading ? '' : (data?.title ? data?.title : 'Add New') }}</h3>\n      </div>\n      <div class=\"mt-1\">\n        <p class=\"my-4\">\n          To personalize the subject or body, use {{ userNameSyntax }} to insert the user\u2019s name.\n        </p>\n        <div class=\"w-100 text-center mt-3\"\n        *ngIf=\"isLoading\">\n        <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n      </div>\n        <form [formGroup]=\"form\"\n        *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <!-- Title -->\n            <pw-input-container [label]=\"'Admin.NewsletterItem.Title' | transloco\"\n              class=\"col-md-6\"\n              name=\"title\"\n              [errorMsg]=\"'Admin.NewsletterItem.Validation.Title' | transloco\">\n              <input type=\"text\"\n                class=\"form-control\"\n                formControlName=\"title\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n            </pw-input-container>\n            <!-- Newsletter -->\n            <pw-input-container [label]=\"'Admin.NewsletterItem.Newsletter' | transloco\"\n              class=\"col-md-6\"\n              name=\"newsletter_id\"\n              [errorMsg]=\"'Admin.NewsletterItem.Validation.Newsletter' | transloco\">\n              <p-dropdown [options]=\"newsletters\"\n                formControlName=\"newsletter_id\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['newsletter_id'].errors }\">\n              </p-dropdown>\n            </pw-input-container>\n            <!-- Rich Text Editor -->\n            <pw-input-container [label]=\"'Admin.NewsletterItem.Body' | transloco\"\n              class=\"col-12\"\n              name=\"body\"\n              [errorMsg]=\"'Admin.NewsletterItem.Validation.Body' | transloco\">\n              <quill-editor [styles]=\"{ height: '450px' }\"\n                class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n                formControlName=\"body\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors, 'quill-container': true  }\">\n              </quill-editor>\n            </pw-input-container>\n            <!-- Location -->\n            <pw-input-container [showTooltip]=\"true\"\n              [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Location' | transloco\"\n              [label]=\"'Admin.NewsletterItem.Location' | transloco\"\n              class=\"col-md-6\"\n              name=\"location\">\n              <input ngx-gp-autocomplete\n                class=\"form-control\"\n                #places=\"ngx-places\"\n                formControlName=\"location\"\n                (onAddressChange)=\"handleAddressChange($event)\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n            </pw-input-container>\n            <div class=\"ui-fluid skills-modal col-12 col-md-6 mt-1 mb-3\">\n              <label for=\"\">{{ 'Admin.NewsletterItem.Tags' | transloco }}\n                <span class=\"ms-1 tooltip-wrap\"\n                  [pTooltip]=\"'Admin.NewsletterItem.Tooltip.Tags' | transloco\"\n                  [appendTo]=\"'body'\"\n                  [tooltipPosition]=\"'top'\">\n                  <i class=\"fas fa-info-circle\"></i>\n                </span>\n              </label>\n              <p-autoComplete [(ngModel)]=\"selectedTags\"\n                [suggestions]=\"tagsSuggestion\"\n                dataKey=\"id\"\n                field=\"name\"\n                (completeMethod)=\"search($event)\"\n                styleClass=\"w-100\"\n                [minLength]=\"1\"\n                [maxlength]=\"10\"\n                [dropdown]=\"true\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                placeholder=\"Tags\"\n                [multiple]=\"true\"></p-autoComplete>\n            </div>\n            <!-- Products -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Products' | transloco\"\n                [label]=\"'Admin.NewsletterItem.Products' | transloco\"\n                name=\"product_ids\">\n                <p-multiSelect [options]=\"products\"\n                  placeholder=\"Select Products\"\n                  [showHeader]=\"true\"\n                  [showToggleAll]=\"true\"\n                  formControlName=\"product_ids\"\n                  appendTo=\"body\"></p-multiSelect>\n              </pw-input-container>\n            </div>\n            <!-- Features -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Features' | transloco\"\n                [label]=\"'Admin.NewsletterItem.Features' | transloco\"\n                name=\"feature_keys\">\n                <p-multiSelect [options]=\"featureKeys\"\n                  placeholder=\"Select feature keys\"\n                  [showHeader]=\"true\"\n                  [showToggleAll]=\"true\"\n                  formControlName=\"feature_keys\"\n                  appendTo=\"body\"></p-multiSelect>\n              </pw-input-container>\n            </div>\n            <!-- Previous Newsletter Items -->\n            <div class=\"col-12\"\n              [ngClass]=\"f['main_tag_id'].value ? 'col-md-3' : 'col-md-6'\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.NewsletterItem.PreviousNewsletter' | transloco\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.PreviousNewsletter'\n                                            | transloco\n                                    \"\n                  name=\"main_tag_id\">\n                  <p-dropdown [options]=\"newsletterItems\"\n                    formControlName=\"main_tag_id\"\n                    [ngClass]=\"{\n                                            'is-invalid': submitted && f['main_tag_id'].errors\n                                        }\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- DAYS TO WAIT -->\n            <div class=\"col-md-3 col-xs-6\"\n              *ngIf=\"form.get('main_tag_id').value\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.NewsletterItem.DaysToWait' | transloco\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.DaysToWaitFromPreviousNewsletter'\n                                            | transloco\n                                    \"\n                  name=\"days_to_wait_from_previous_newsletter\">\n                  <input type=\"number\"\n                    class=\"form-control\"\n                    formControlName=\"days_to_wait_from_previous_newsletter\"\n                    [ngClass]=\"{\n                                            'is-invalid':\n                                                submitted &&\n                                                f['days_to_wait_from_previous_newsletter'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- IS SENT -->\n            <div class=\"col-md-3 col-xs-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.NewsletterItem.SendDate' | transloco\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.SendDate' | transloco\n                                    \"\n                  [errorMsg]=\"\n                                        'Admin.NewsletterItem.Validation.SendDate' | transloco\n                                    \"\n                  name=\"send_at\">\n                  <div>\n                    <p-calendar formControlName=\"send_at\"\n                      [showIcon]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Send Date'\"\n                      [ngClass]=\"{\n                                                'is-invalid': submitted && f['send_at'].errors\n                                            }\">\n                    </p-calendar>\n                  </div>\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- Expiry Date for Newsletter -->\n            <div class=\"col-md-3 col-xs-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.SendUntil' | transloco\n                                    \"\n                  [label]=\"'Admin.NewsletterItem.SendUntil' | transloco\"\n                  name=\"send_until\"\n                  [errorMsg]=\"\n                                        'Admin.NewsletterItem.Validation.SendUntil' | transloco\n                                    \">\n                  <div>\n                    <p-calendar formControlName=\"send_until\"\n                      [showIcon]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Send Until Date'\"\n                      [ngClass]=\"{\n                                                'is-invalid': submitted && f['send_until'].errors\n                                            }\">\n                    </p-calendar>\n                  </div>\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- Only new users -->\n            <div class=\"col-md-3\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.OnlyNewUsers' | transloco\n                                    \"\n                  [label]=\"'Admin.NewsletterItem.OnlyNewUsers' | transloco\"\n                  name=\"only_new_users\">\n                  <ui-switch formControlName=\"only_new_users\"\n                    name=\"only_new_users\"\n                    [ngClass]=\"{\n                                            'is-invalid': submitted && f['only_new_users'].errors\n                                        }\">\n                  </ui-switch>\n                </pw-input-container>\n              </div>\n            </div>\n            <!-- IS PUSHED -->\n            <div class=\"col-md-3\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"\n                                        'Admin.NewsletterItem.Tooltip.ShouldDeliver' | transloco\n                                    \"\n                  [label]=\"'Admin.NewsletterItem.ShouldDeliver' | transloco\"\n                  name=\"is_pushed\">\n                  <ui-switch formControlName=\"is_pushed\"\n                    name=\"is_pushed\"\n                    [ngClass]=\"{\n                                            'is-invalid': submitted && f['is_pushed'].errors\n                                        }\">\n                  </ui-switch>\n                </pw-input-container>\n              </div>\n            </div>\n          </div>\n          <div class=\"row\"></div>\n          <div class=\"row text-end mt-3\">\n            <div class=\"col-12\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Save' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i15$1.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -5030,7 +5030,7 @@ class ProductDetailsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ProductDetailsComponent, deps: [{ token: i0.Injector }, { token: i1$2.ProductService }, { token: i2$1.NgbModal }, { token: i1.AdminService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ProductDetailsComponent, selector: "pw-product-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\"\n          aria-hidden=\"true\"></i></a>\n        <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n    </div>\n    <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n    </div>\n      <div class=\"my-4\" *ngIf=\"!isLoading\">\n        <div class=\"mb-5\">\n          <p-accordion>\n            <p-accordionTab [header]=\"'How To'\">\n              <div class=\"row\">\n                <div class=\"col-12 col-md-6\">\n                  <h4>Product / Feature logic</h4>\n                  <p> Logic for back-end/front-end permissions binding:\n                    <br /> * product.category (these are features) =&gt; type of product, i.e., seat_pricing or item_pricing\n                    <br /> * product.feature_key =&gt; this describes the main feature\n                    <br /> * product.permission_key =&gt; users can be subscribed to only one product of same permission_key\n                    <br /> * product.product_key =&gt; this is unique to each product, it defines the permission for frontend binding\n                    <br /> * Example of permission =&gt; {{ 'Pages.Product.{permission_key}.{product_key}' }}\n                    <br /> * If it's a feature associated to an existing project, you can to set the \"dependency product\" accordingly. </p>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <h4>If it's a Free Product</h4>\n                  <p> Stripe Plan needs to be nil. <br /> \"Price\" per Unit needs to be set as 0. <br /> \"Trial Days\" needs\n                    to be something like 99999. <br /> The product should be set as \"visible===false\". </p>\n                </div>\n              </div>\n            </p-accordionTab>\n          </p-accordion>\n        </div>\n        <div class=\"row\" *ngIf=\"id\">\n          <div class=\"col-md-6\">\n            <div class=\"text-center mt-5\">\n              <div class=\"image-container\">\n                <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n                    [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n                    [tooltipPosition]=\"'top'\">\n                    <i class=\"fas fa-info-circle\"></i>\n                  </span>\n                </h4>\n                <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo w-100 h-100\"\n                  (error)=\"handleImageError($event, 'assets/img/icons/demo_logo1.png')\" />\n                <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n                  <div class=\"overlay-text\">\n                    <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"col-md-6\">\n            <div class=\"text-center mt-5\">\n              <div class=\"image-container\">\n                <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n                    [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n                    [tooltipPosition]=\"'top'\">\n                    <i class=\"fas fa-info-circle\"></i>\n                  </span>\n                </h4>\n                <img [src]=\"squaredLogo\" alt=\"Company Logo\" width=\"70\" class=\"squared_logo\" height=\"70\"\n                (error)=\"handleImageError($event, 'assets/img/icons/company.png')\" />\n                <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n                  <div class=\"overlay-text\">\n                    <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n        <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <div class=\"col-12 col-md-6\">\n              <div class=\"row\">\n                <div class=\"col-md-6\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n                    [label]=\"'Label.Name' | transloco\" class=\"col-md-6 p-0\" name=\"name\"\n                    [isLeftTooltip]=\"true\"\n                    [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"name\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-6\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n                    [label]=\"'Admin.Products.NickName' | transloco\" class=\"col-md-6 p-0\" name=\"nickname\" [errorMsg]=\"\n                                            'Admin.Products.Validation.NickName' | transloco\n                                        \">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"nickname\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['nickname'].errors\n                                            }\" />\n                  </pw-input-container>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"row\">\n                <div class=\"mb-3 col-12 col-md-6\">\n                  <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" class=\"col-md-6 p-0\" name=\"min_units\"\n                    [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n                    <input type=\"number\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['min_units'].errors\n                                            }\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"mb-3 col-12 col-md-6\">\n                  <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" class=\"col-md-6 p-0\" name=\"max_units\"\n                    [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n                    <input type=\"number\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['max_units'].errors\n                                            }\" />\n                  </pw-input-container>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <label class=\"info-circle\" for=\"productList\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<span\n                  class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Products.Tooltip.DependencyProducts' |\n                  transloco }}</span>\n              </label>\n              <p-multiSelect [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n                [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n                maxSelectedLabels=\"1\" appendTo=\"body\">\n              </p-multiSelect>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n                  [label]=\"'Admin.Products.StripePlan' | transloco\" class=\"col-md-6 p-0\" name=\"stripe_plan_id\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"stripe_plan_id\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n                  [isLeftTooltip]=\"true\"\n                  [label]=\"'Admin.Products.Price' | transloco\" class=\"col-md-6 p-0\" name=\"price_per_unit\"\n                  [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n                  <input type=\"text\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['price_per_unit'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n                  [label]=\"'Admin.Products.TrialDays' | transloco\" class=\"col-md-6 p-0\" name=\"trial_days\"\n                  [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n                  <input type=\"number\" min=\"1\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['trial_days'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n                  [label]=\"'Admin.Products.MaxTrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits_trial\">\n                  <input type=\"number\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['max_hits_trial'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n                  [label]=\"'Admin.Products.TrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits\">\n                  <input type=\"number\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n                [label]=\"'Admin.Products.Description' | transloco\" name=\"description\"\n                [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n                <quill-editor [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\" id=\"descriptionEditor\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n                </quill-editor>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n                [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\">\n                <quill-editor [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\" id=\"signupInstructionsEditor\" [ngClass]=\"{\n                                        'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n                                    }\">\n                </quill-editor>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n                [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\">\n                <quill-editor [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\" id=\"signupEmployeesEditor\" [ngClass]=\"{\n                                        'is-invalid':\n                                            submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n                                    }\">\n                </quill-editor>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n                  [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" [errorMsg]=\"\n                                        'Admin.Products.Validation.PermissionKey' | transloco\n                                    \">\n                  <input type=\"text\" class=\"form-control\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['permission_key'].errors\n                                        }\" formControlName=\"permission_key\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n                  [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\"\n                  [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n                  <input type=\"text\" class=\"form-control\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['feature_key'].errors\n                                        }\" formControlName=\"feature_key\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\" class=\"col-md-6 p-0\"\n                  [showTooltip]=\"true\" [tooltipText]=\"\n                                        'Admin.Products.Tooltip.PermissionKey' | transloco\n                                    \" name=\"product_key\"\n                  [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"product_key\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['product_key'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.Products.Category' | transloco\" class=\"col-md-6 p-0\"\n                  [showTooltip]=\"true\" [tooltipText]=\"\n                                        'Admin.Products.Tooltip.PermissionKey' | transloco\n                                    \" name=\"category\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n                  <p-dropdown [options]=\"categories\" class=\"dropdown-bg-transparent\" formControlName=\"category\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n                  [label]=\"'Admin.Products.BillingFrequency' | transloco\" class=\"col-md-6 p-0\" name=\"billing_frequency\">\n                  <p-dropdown [options]=\"frequency\" class=\"dropdown-bg-transparent\" formControlName=\"billing_frequency\"\n                    [required]=\"true\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['billing_frequency'].errors\n                                        }\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n                  [label]=\"'Admin.Products.DocumentationUrl' | transloco\" class=\"col-md-6 p-0\" name=\"documentation_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"documentation_url\" [ngClass]=\"{\n                    'is-invalid': submitted && f['documentation_url'].errors\n                }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n                  [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\">\n                  <p-dropdown\n                    [options]=\"allTos\"\n                    formControlName=\"product_privacy_service_id\"\n                    [placeholder]=\"'Select Privacy Service'\"\n                    optionValue=\"id\"\n                    optionLabel=\"title\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n                  [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\">\n                  <p-dropdown\n                    [options]=\"productsList\"\n                    formControlName=\"master_product_id\"\n                    [placeholder]=\"'Select Master Product'\"\n                    optionValue=\"value\"\n                    optionLabel=\"label\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"mb-3 col-xs-12 col-sm-6 col-md-4\">\n              <label class=\"info-circle\" for=\"Roles\">{{ 'Admin.Products.AssignedRoles' | transloco }} <span\n                  class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Subscriptions.Tooltip.AssignedRoles' |\n                  transloco }}</span>\n              </label>\n              <p-multiSelect [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"></p-multiSelect>\n            </div>\n            <div class=\"col-12 col-md-4\" *ngIf=\"supportedCurrency$ | async as currency\">\n              <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n                [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\"\n                [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n                <p-dropdown\n                  [options]=\"currency['regions']\"\n                  formControlName=\"currency\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n                  [placeholder]=\"'Select Currency'\"\n                  [showClear]=\"false\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-4\" *ngIf=\"supportedRegions$ | async as region\">\n              <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n                [isLeftTooltip]=\"true\"\n                [label]=\"'Admin.Products.Region' | transloco\" name=\"region\"\n                [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n                <p-dropdown\n                  [options]=\"region['regions']\"\n                  formControlName=\"region\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n                  [placeholder]=\"'Select Region'\"\n                  [showClear]=\"false\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n                [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n                  [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\">\n                  <p-multiSelect [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n                    [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n                    [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n                  </p-multiSelect>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n                  [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\">\n                  <p-dropdown\n                    [options]=\"prorationBehaviors\"\n                    formControlName=\"proration_behavior\"\n                    [placeholder]=\"'Select Proration Behavior'\"\n                    optionValue=\"value\"\n                    optionLabel=\"label\"\n                    [showClear]=\"true\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n                  [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\">\n                  <p-dropdown\n                    [options]=\"unsubscribeBehaviors\"\n                    formControlName=\"unsubscribe_stripe_behavior\"\n                    [placeholder]=\"'Select Unsubscribe Stripe Behavior'\"\n                    optionValue=\"value\"\n                    optionLabel=\"label\"\n                    [showClear]=\"true\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <!--start toggles -->\n            <div class=\"col-12 row mt-4\">\n              <div class=\"col\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n                    [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\">\n                    <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n                    [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\">\n                    <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['multiple_allowed'].errors\n                                            }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n                    [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\">\n                    <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n                    [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\">\n                    <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['members_visible'].errors\n                                            }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n                    [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\">\n                    <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['chat_visible'].errors\n                                            }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n                    [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\">\n                    <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['is_master_product'].errors\n                                            }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n            </div>\n            <!-- end toggles -->\n          </div>\n          <div class=\"row text-end mt-4\">\n            <div class=\"col-12\">\n              <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n                transloco }} </button>\n              <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n                | transloco }} </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n<ng-template #content let-modal>\n  <div class=\"modal-header\">\n    <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n    <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n    <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n  <div class=\"modal-header\">\n    <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n    <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n    <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n", styles: [".nowrap{white-space:nowrap}textarea{height:180px}.full-logo{object-fit:cover;width:280px}\n"], dependencies: [{ kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7$1.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i7$1.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.NumberDirective, selector: "input[numbersOnly]" }, { kind: "directive", type: i7.LazyImgDirective, selector: "img" }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ProductDetailsComponent, selector: "pw-product-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\"\n          aria-hidden=\"true\"></i></a>\n        <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n    </div>\n    <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n    </div>\n      <div class=\"my-4\" *ngIf=\"!isLoading\">\n        <div class=\"mb-5\">\n          <p-accordion>\n            <p-accordionTab [header]=\"'How To'\">\n              <div class=\"row\">\n                <div class=\"col-12 col-md-6\">\n                  <h4>Product / Feature logic</h4>\n                  <p> Logic for back-end/front-end permissions binding:\n                    <br /> * product.category (these are features) =&gt; type of product, i.e., seat_pricing or item_pricing\n                    <br /> * product.feature_key =&gt; this describes the main feature\n                    <br /> * product.permission_key =&gt; users can be subscribed to only one product of same permission_key\n                    <br /> * product.product_key =&gt; this is unique to each product, it defines the permission for frontend binding\n                    <br /> * Example of permission =&gt; {{ 'Pages.Product.{permission_key}.{product_key}' }}\n                    <br /> * If it's a feature associated to an existing project, you can to set the \"dependency product\" accordingly. </p>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <h4>If it's a Free Product</h4>\n                  <p> Stripe Plan needs to be nil. <br /> \"Price\" per Unit needs to be set as 0. <br /> \"Trial Days\" needs\n                    to be something like 99999. <br /> The product should be set as \"visible===false\". </p>\n                </div>\n              </div>\n            </p-accordionTab>\n          </p-accordion>\n        </div>\n        <div class=\"row\" *ngIf=\"id\">\n          <div class=\"col-md-6\">\n            <div class=\"text-center mt-5\">\n              <div class=\"image-container\">\n                <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n                    [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n                    [tooltipPosition]=\"'top'\">\n                    <i class=\"fas fa-info-circle\"></i>\n                  </span>\n                </h4>\n                <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo w-100 h-100\"\n                  (error)=\"handleImageError($event, 'assets/img/icons/demo_logo1.png')\" />\n                <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n                  <div class=\"overlay-text\">\n                    <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"col-md-6\">\n            <div class=\"text-center mt-5\">\n              <div class=\"image-container\">\n                <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n                    [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n                    [tooltipPosition]=\"'top'\">\n                    <i class=\"fas fa-info-circle\"></i>\n                  </span>\n                </h4>\n                <img [src]=\"squaredLogo\" alt=\"Company Logo\" width=\"70\" class=\"squared_logo\" height=\"70\"\n                (error)=\"handleImageError($event, 'assets/img/icons/company.png')\" />\n                <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n                  <div class=\"overlay-text\">\n                    <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n        <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <div class=\"col-12 col-md-6\">\n              <div class=\"row\">\n                <div class=\"col-md-6\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n                    [label]=\"'Label.Name' | transloco\" class=\"col-md-6 p-0\" name=\"name\"\n                    [isLeftTooltip]=\"true\"\n                    [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"name\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-6\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n                    [label]=\"'Admin.Products.NickName' | transloco\" class=\"col-md-6 p-0\" name=\"nickname\" [errorMsg]=\"\n                                            'Admin.Products.Validation.NickName' | transloco\n                                        \">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"nickname\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['nickname'].errors\n                                            }\" />\n                  </pw-input-container>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"row\">\n                <div class=\"mb-3 col-12 col-md-6\">\n                  <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" class=\"col-md-6 p-0\" name=\"min_units\"\n                    [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n                    <input type=\"number\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['min_units'].errors\n                                            }\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"mb-3 col-12 col-md-6\">\n                  <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" class=\"col-md-6 p-0\" name=\"max_units\"\n                    [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n                    <input type=\"number\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['max_units'].errors\n                                            }\" />\n                  </pw-input-container>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <label class=\"info-circle\" for=\"productList\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<span\n                  class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Products.Tooltip.DependencyProducts' |\n                  transloco }}</span>\n              </label>\n              <p-multiSelect [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n                [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n                maxSelectedLabels=\"1\" appendTo=\"body\">\n              </p-multiSelect>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n                  [label]=\"'Admin.Products.StripePlan' | transloco\" class=\"col-md-6 p-0\" name=\"stripe_plan_id\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"stripe_plan_id\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n                  [isLeftTooltip]=\"true\"\n                  [label]=\"'Admin.Products.Price' | transloco\" class=\"col-md-6 p-0\" name=\"price_per_unit\"\n                  [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n                  <input type=\"text\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['price_per_unit'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n                  [label]=\"'Admin.Products.TrialDays' | transloco\" class=\"col-md-6 p-0\" name=\"trial_days\"\n                  [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n                  <input type=\"number\" min=\"1\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['trial_days'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n                  [label]=\"'Admin.Products.MaxTrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits_trial\">\n                  <input type=\"number\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['max_hits_trial'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n                  [label]=\"'Admin.Products.TrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits\">\n                  <input type=\"number\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n                [label]=\"'Admin.Products.Description' | transloco\" name=\"description\"\n                [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n                <quill-editor [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\" id=\"descriptionEditor\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n                </quill-editor>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n                [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\">\n                <quill-editor [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\" id=\"signupInstructionsEditor\" [ngClass]=\"{\n                                        'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n                                    }\">\n                </quill-editor>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n                [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\">\n                <quill-editor [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\" id=\"signupEmployeesEditor\" [ngClass]=\"{\n                                        'is-invalid':\n                                            submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n                                    }\">\n                </quill-editor>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n                  [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" [errorMsg]=\"\n                                        'Admin.Products.Validation.PermissionKey' | transloco\n                                    \">\n                  <input type=\"text\" class=\"form-control\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['permission_key'].errors\n                                        }\" formControlName=\"permission_key\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n                  [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\"\n                  [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n                  <input type=\"text\" class=\"form-control\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['feature_key'].errors\n                                        }\" formControlName=\"feature_key\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\" class=\"col-md-6 p-0\"\n                  [showTooltip]=\"true\" [tooltipText]=\"\n                                        'Admin.Products.Tooltip.PermissionKey' | transloco\n                                    \" name=\"product_key\"\n                  [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"product_key\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['product_key'].errors\n                                        }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Admin.Products.Category' | transloco\" class=\"col-md-6 p-0\"\n                  [showTooltip]=\"true\" [tooltipText]=\"\n                                        'Admin.Products.Tooltip.PermissionKey' | transloco\n                                    \" name=\"category\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n                  <p-dropdown [options]=\"categories\" class=\"dropdown-bg-transparent\" formControlName=\"category\"\n                    [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n                  [label]=\"'Admin.Products.BillingFrequency' | transloco\" class=\"col-md-6 p-0\" name=\"billing_frequency\">\n                  <p-dropdown [options]=\"frequency\" class=\"dropdown-bg-transparent\" formControlName=\"billing_frequency\"\n                    [required]=\"true\" [ngClass]=\"{\n                                            'is-invalid': submitted && f['billing_frequency'].errors\n                                        }\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n                  [label]=\"'Admin.Products.DocumentationUrl' | transloco\" class=\"col-md-6 p-0\" name=\"documentation_url\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"documentation_url\" [ngClass]=\"{\n                    'is-invalid': submitted && f['documentation_url'].errors\n                }\" />\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n                  [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\">\n                  <p-dropdown\n                    [options]=\"allTos\"\n                    formControlName=\"product_privacy_service_id\"\n                    [placeholder]=\"'Select Privacy Service'\"\n                    optionValue=\"id\"\n                    optionLabel=\"title\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n                  [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\">\n                  <p-dropdown\n                    [options]=\"productsList\"\n                    formControlName=\"master_product_id\"\n                    [placeholder]=\"'Select Master Product'\"\n                    optionValue=\"value\"\n                    optionLabel=\"label\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"mb-3 col-xs-12 col-sm-6 col-md-4\">\n              <label class=\"info-circle\" for=\"Roles\">{{ 'Admin.Products.AssignedRoles' | transloco }} <span\n                  class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Subscriptions.Tooltip.AssignedRoles' |\n                  transloco }}</span>\n              </label>\n              <p-multiSelect [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"></p-multiSelect>\n            </div>\n            <div class=\"col-12 col-md-4\" *ngIf=\"supportedCurrency$ | async as currency\">\n              <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n                [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\"\n                [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n                <p-dropdown\n                  [options]=\"currency['regions']\"\n                  formControlName=\"currency\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n                  [placeholder]=\"'Select Currency'\"\n                  [showClear]=\"false\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-4\" *ngIf=\"supportedRegions$ | async as region\">\n              <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n                [isLeftTooltip]=\"true\"\n                [label]=\"'Admin.Products.Region' | transloco\" name=\"region\"\n                [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n                <p-dropdown\n                  [options]=\"region['regions']\"\n                  formControlName=\"region\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n                  [placeholder]=\"'Select Region'\"\n                  [showClear]=\"false\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-4\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n                [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n                  [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\">\n                  <p-multiSelect [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n                    [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n                    [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n                  </p-multiSelect>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n                  [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\">\n                  <p-dropdown\n                    [options]=\"prorationBehaviors\"\n                    formControlName=\"proration_behavior\"\n                    [placeholder]=\"'Select Proration Behavior'\"\n                    optionValue=\"value\"\n                    optionLabel=\"label\"\n                    [showClear]=\"true\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n              <div class=\"mb-3\">\n                <pw-input-container [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n                  [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\">\n                  <p-dropdown\n                    [options]=\"unsubscribeBehaviors\"\n                    formControlName=\"unsubscribe_stripe_behavior\"\n                    [placeholder]=\"'Select Unsubscribe Stripe Behavior'\"\n                    optionValue=\"value\"\n                    optionLabel=\"label\"\n                    [showClear]=\"true\">\n                  </p-dropdown>\n                </pw-input-container>\n              </div>\n            </div>\n            <!--start toggles -->\n            <div class=\"col-12 row mt-4\">\n              <div class=\"col\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n                    [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\">\n                    <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n                    [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\">\n                    <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['multiple_allowed'].errors\n                                            }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n                    [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\">\n                    <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n                    [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\">\n                    <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['members_visible'].errors\n                                            }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n                    [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\">\n                    <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['chat_visible'].errors\n                                            }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n              <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n                <div class=\"mb-3\">\n                  <pw-input-container [showTooltip]=\"true\"\n                    [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n                    [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\">\n                    <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['is_master_product'].errors\n                                            }\">\n                    </ui-switch>\n                  </pw-input-container>\n                </div>\n              </div>\n            </div>\n            <!-- end toggles -->\n          </div>\n          <div class=\"row text-end mt-4\">\n            <div class=\"col-12\">\n              <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n                transloco }} </button>\n              <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n                | transloco }} </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n<ng-template #content let-modal>\n  <div class=\"modal-header\">\n    <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n    <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n    <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n  <div class=\"modal-header\">\n    <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n    <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n    <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n", styles: [".nowrap{white-space:nowrap}textarea{height:180px}.full-logo{object-fit:cover;width:280px}\n"], dependencies: [{ kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7$1.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i7$1.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.NumberDirective, selector: "input[numbersOnly]" }, { kind: "directive", type: i7.LazyImgDirective, selector: "img" }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -5610,7 +5610,7 @@ class ResourceAdminDetailsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ResourceAdminDetailsComponent, deps: [{ token: i2$1.NgbModal }, { token: i1.AdminService }, { token: i0.Injector }, { token: i1$2.TagService }, { token: i1$2.SubscriptionService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourceAdminDetailsComponent, selector: "pw-resources-details-index", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          (click)=\"navigateToResourceList()\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n         Add or edit resource\n        </h3>\n      </div>\n      <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n        <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n        *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <!-- Title -->\n            <pw-input-container [label]=\"'Label.Title' | transloco\"\n              class=\"col-12\"\n              name=\"title\"\n              [errorMsg]=\"'Resource.Posts.Validation.Title' | transloco\">\n              <input type=\"text\"\n                class=\"form-control\"\n                formControlName=\"title\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n            </pw-input-container>\n\n            <!-- Blurb -->\n            <pw-input-container [label]=\"'Resource.Posts.Blurb' | transloco\"\n              class=\"col-12\"\n              name=\"blurb\"\n              class=\"blurb\"\n              [showTooltip]=\"true\"\n              [tooltipText]=\"'The blurb is used for the metadata.description field'\">\n              <textarea class=\"form-control\"\n                rows=\"3\"\n                formControlName=\"blurb\"\n                placeholder=\"Short description for SEO meta description\"></textarea>\n            </pw-input-container>\n\n\n            <!-- Rich Text Editor -->\n            <pw-input-container [label]=\"'Resource.Posts.Body' | transloco\"\n              class=\"col-9 col-md-9 col-sm-12\"\n              name=\"body\"\n              [errorMsg]=\"'Resource.Posts.Validation.Body' | transloco\">\n              <quill-editor [styles]=\"{ height: '500px' }\"\n              class=\"quillEditor\" [modules]=\"editorConfig\"\n                formControlName=\"body\"\n                [ngClass]=\"{\n                  'w-100': true,\n                  'quill-container': true,\n                  'is-invalid': submitted && f['body'].errors\n                }\">\n              </quill-editor>\n            </pw-input-container>\n            <div class=\"col-12 col-md-3 col-sm-4 my-4\">\n              <div class=\"text-center mb-4\">\n                <label for=\"coverPicture\">{{ 'Resource.Posts.CoverPicture' | transloco }}</label>\n                <div class=\"text-center text-center d-flex flex-column align-items-center\">\n                  <img [src]=\"(image !== null && !image?.includes('default-photo.jpg') )? image : 'assets/img/resource/blog.png'\"\n                      (keydown.enter)=\"openModal(content)\"\n                      (click)=\"openModal(content)\"\n                      class=\"image w-100\" alt=\"Modal\"\n                      (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n                      <div class=\"d-flex justify-content-between align-items-center mt-2\">\n                        <a class=\"d-inline-block\" (click)=\"openModal(content)\">\n                          {{ slug !== 'create' ? 'Edit' : 'Add' }} Picture\n                        </a>\n                        <i\n                        class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n                        title=\"Remove Image\"\n                        (click)=\"deleteCoverImage()\"\n                        (keydown.enter)=\"deleteCoverImage()\"\n                        *ngIf=\"image && !image.includes('default-photo.jpg')\">\n                        </i>\n                      </div>\n                </div>\n              </div>\n\n              <!-- Rectangular Picture -->\n              <div class=\"text-center d-flex flex-column align-items-center\">\n                <label for=\"rectangularPicture\">Rectangular Picture</label>\n                <img\n                  [src]=\"(rectangularImage !== null && !rectangularImage?.includes('default-photo.jpg')) ? rectangularImage : 'assets/img/resource/blog.png'\"\n                  (keydown.enter)=\"openRectModal(rectContent)\"\n                  (click)=\"openRectModal(rectContent)\"\n                  class=\"image rec-img\"\n                  [ngClass]=\"{ 'w-100': rectangularImage === null || rectangularImage?.includes('default-photo.jpg') }\"\n                  alt=\"Uploaded rectangular media preview\"\n                  (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n                  <div class=\"d-flex justify-content-between align-items-center mt-2\">\n                    <a class=\"d-inline-block\" (click)=\"openRectModal(rectContent)\">\n                      {{ slug !== 'create' ? 'Edit' : 'Add' }} Picture\n                    </a>\n                    <i\n                      class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n                      title=\"Remove Image\"\n                      (click)=\"deleteRectangularImage()\"\n                      (keydown.enter)=\"deleteRectangularImage()\"\n                      *ngIf=\"rectangularImage && !rectangularImage.includes('default-photo.jpg')\">\n                    </i>\n                  </div>\n\n              </div>\n\n            </div>\n            <pw-input-container [label]=\"'Resource.Posts.CtaText' | transloco\"\n              class=\"col-12 col-md-6\"\n              [showTooltip]=\"true\"\n              [tooltipText]=\"'Resource.Posts.Tooltip.CtaText' | transloco\"\n              name=\"cta_text\">\n              <input type=\"text\"\n                class=\"form-control\"\n                formControlName=\"cta_text\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container [label]=\"'Resource.Posts.ExternalUrl' | transloco\"\n              class=\"col-12 col-md-6\"\n              [showTooltip]=\"true\"\n              [tooltipText]=\"'Resource.Posts.Tooltip.ExternalUrl' | transloco\"\n              name=\"external_url\">\n              <input type=\"text\"\n                class=\"form-control\"\n                formControlName=\"external_url\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['external_url'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container [label]=\"'Resource.Posts.Tags' | transloco \" class=\"ui-fluid skills-modal col-12 col-md-6 col-sm-12 tags\"\n              [showTooltip]=\"true\" [tooltipText]=\"'Resource.Posts.Tooltip.CtaText' | transloco\" name=\"cta_text\">\n              <p-autoComplete [(ngModel)]=\"selectedTags\" class=\"body-bg\" [suggestions]=\"tagsSuggestion\" dataKey=\"id\" field=\"name\"\n                (completeMethod)=\"search($event)\" styleClass=\"w-100\" [minLength]=\"1\" [maxlength]=\"10\" [dropdown]=\"true\"\n                [ngModelOptions]=\"{ standalone: true }\" placeholder=\"Tags\" [multiple]=\"true\">\n              </p-autoComplete>\n            </pw-input-container>\n\n            <pw-input-container [label]=\"'Author' | transloco\"\n              class=\"col-12 col-md-4 col-sm-6\"\n              name=\"author_id\"\n              [errorMsg]=\"'Please select an author' | transloco\">\n              <p-dropdown\n                formControlName=\"author_id\"\n                [options]=\"availableAuthors\"\n                optionLabel=\"label\"\n                optionValue=\"value\"\n                [placeholder]=\"'Select Author' | transloco\"\n                [loading]=\"authorsLoading\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['author_id'].errors }\"\n                styleClass=\"w-100\">\n                <ng-template pTemplate=\"item\" let-author>\n                  <div>\n                    <div>{{ author.label }}</div>\n                  </div>\n                </ng-template>\n              </p-dropdown>\n            </pw-input-container>\n\n\n            <!-- WHEN and AUTHOR on same line -->\n            <div class=\"col-12 col-md-2 col-sm-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Resource.Posts.When' | transloco\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Resource.Posts.Tooltip.When' | transloco\"\n                  name=\"when\">\n                  <div>\n                    <p-calendar formControlName=\"when\"\n                      [showIcon]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Select Date'\"\n                      [ngClass]=\"{'is-invalid': submitted && f['when'].errors}\">\n                    </p-calendar>\n                  </div>\n                </pw-input-container>\n              </div>\n            </div>\n\n            <!-- Author Dropdown -->\n            <!-- Three toggles on next line -->\n            <div class=\"col-12\">\n              <div class=\"row\">\n                <div class=\"col-12 col-md-2 col-sm-6\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Resource.Posts.Tooltip.ShowCase' | transloco\"\n                      [label]=\"'Resource.Posts.ShowCase' | transloco\" name=\"showcase\">\n                      <ui-switch class=\"d-block\" formControlName=\"showcase\" name=\"showcase\">\n                      </ui-switch>\n                    </pw-input-container>\n                  </div>\n                </div>\n\n                <!--Published At -->\n                <div class=\"col-12 col-md-2 col-sm-6\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\"\n                      [tooltipText]=\"'Resource.Posts.Tooltip.Published' | transloco\"\n                      [label]=\"'Resource.Posts.Published' | transloco\"\n                      name=\"published_at\">\n                      <ui-switch class=\"d-block\"\n                      formControlName=\"published_at\"\n                      name=\"published_at\">\n                    </ui-switch>\n                    </pw-input-container>\n                  </div>\n                </div>\n\n                <!--Accepted At -->\n                <div class=\"col-12 col-md-2 col-sm-6 accept-icon\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\"\n                      [tooltipText]=\"'Resource.Posts.Tooltip.AcceptedByAdmin' | transloco\"\n                      [label]=\"'Resource.Posts.AcceptedByAdmin' | transloco\"\n                      name=\"accepted_at\">\n                      <ui-switch class=\"d-block\"\n                      formControlName=\"accepted_at\"\n                      name=\"accepted_at\">\n                    </ui-switch>\n                    </pw-input-container>\n                  </div>\n                </div>\n              </div>\n            </div>\n\n          </div>\n          <div class=\"row text-end mt-4\">\n            <div class=\"col-12\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"navigateToResourceList()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"submitted\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Submit' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n\n\n<ng-template #content\n  let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Picture</h5>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload a JPG, GIF, or PNG file. (Do not upload pictures containing celebrities,\n      nudity, artwork or copyrighted images.)</small>\n    <pw-image-cropper #profile\n      aspectRatio=\"auto\"\n      (imageSelectionEvent)=\"onImageSelection($event)\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n\n<ng-template #rectContent let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Picture</h5>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n    </button>\n  </div>\n\n  <div class=\"modal-body\">\n    <small>\n      You can upload a JPG, GIF, or PNG file. (Do not upload pictures containing celebrities,\n      nudity, artwork or copyrighted images.)\n    </small>\n\n\n    <pw-image-cropper\n      #profile\n      [aspectRatio]=\"'dynamic'\"\n      [dynamicData]=\"getAspectRatio()\"\n      (imageSelectionEvent)=\"onRectangularImageSelection($event)\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n", styles: [".col-md-6.display-grid{display:grid}body .ui-autocomplete.ui-autocomplete-multiple .ui-autocomplete-multiple-container{width:100%}body .ui-inputtext{padding:0}.comment{border:1px solid rgb(238,238,238)}.is-invalid .ql-container.ql-snow,.is-invalid .ql-toolbar.ql-snow{border-color:#dc3545}.rec-img{max-width:100%;max-height:400px!important}.body-bg span .ui-autocomplete-multiple-container{background-color:#f5f7fa}.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-token{color:var(--tabs_text)}.tags .info-circle .tooltiptext:after{left:25px!important}.tags .info-circle .tooltiptext{left:-30px!important}.blurb .info-circle .tooltiptext:after{left:50px!important}.blurb .info-circle .tooltiptext{left:-55px!important}.accept-icon .info-circle .tooltiptext:after{left:110px!important}.accept-icon .info-circle .tooltiptext{right:-85px!important}\n"], dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourceAdminDetailsComponent, selector: "pw-resources-details-index", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          (click)=\"navigateToResourceList()\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n         Add or edit resource\n        </h3>\n      </div>\n      <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n        <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n        *ngIf=\"!isLoading\"\n          (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <!-- Title -->\n            <pw-input-container [label]=\"'Label.Title' | transloco\"\n              class=\"col-12\"\n              name=\"title\"\n              [errorMsg]=\"'Resource.Posts.Validation.Title' | transloco\">\n              <input type=\"text\"\n                class=\"form-control\"\n                formControlName=\"title\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n            </pw-input-container>\n\n            <!-- Blurb -->\n            <pw-input-container [label]=\"'Resource.Posts.Blurb' | transloco\"\n              class=\"col-12\"\n              name=\"blurb\"\n              class=\"blurb\"\n              [showTooltip]=\"true\"\n              [tooltipText]=\"'The blurb is used for the metadata.description field'\">\n              <textarea class=\"form-control\"\n                rows=\"3\"\n                formControlName=\"blurb\"\n                placeholder=\"Short description for SEO meta description\"></textarea>\n            </pw-input-container>\n\n\n            <!-- Rich Text Editor -->\n            <pw-input-container [label]=\"'Resource.Posts.Body' | transloco\"\n              class=\"col-9 col-md-9 col-sm-12\"\n              name=\"body\"\n              [errorMsg]=\"'Resource.Posts.Validation.Body' | transloco\">\n              <quill-editor [styles]=\"{ height: '500px' }\"\n              class=\"quillEditor\" [modules]=\"editorConfig\"\n                formControlName=\"body\"\n                [ngClass]=\"{\n                  'w-100': true,\n                  'quill-container': true,\n                  'is-invalid': submitted && f['body'].errors\n                }\">\n              </quill-editor>\n            </pw-input-container>\n            <div class=\"col-12 col-md-3 col-sm-4 my-4\">\n              <div class=\"text-center mb-4\">\n                <label for=\"coverPicture\">{{ 'Resource.Posts.CoverPicture' | transloco }}</label>\n                <div class=\"text-center text-center d-flex flex-column align-items-center\">\n                  <img [src]=\"(image !== null && !image?.includes('default-photo.jpg') )? image : 'assets/img/resource/blog.png'\"\n                      (keydown.enter)=\"openModal(content)\"\n                      (click)=\"openModal(content)\"\n                      class=\"image w-100\" alt=\"Modal\"\n                      (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n                      <div class=\"d-flex justify-content-between align-items-center mt-2\">\n                        <a class=\"d-inline-block\" (click)=\"openModal(content)\">\n                          {{ slug !== 'create' ? 'Edit' : 'Add' }} Picture\n                        </a>\n                        <i\n                        class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n                        title=\"Remove Image\"\n                        (click)=\"deleteCoverImage()\"\n                        (keydown.enter)=\"deleteCoverImage()\"\n                        *ngIf=\"image && !image.includes('default-photo.jpg')\">\n                        </i>\n                      </div>\n                </div>\n              </div>\n\n              <!-- Rectangular Picture -->\n              <div class=\"text-center d-flex flex-column align-items-center\">\n                <label for=\"rectangularPicture\">Rectangular Picture</label>\n                <img\n                  [src]=\"(rectangularImage !== null && !rectangularImage?.includes('default-photo.jpg')) ? rectangularImage : 'assets/img/resource/blog.png'\"\n                  (keydown.enter)=\"openRectModal(rectContent)\"\n                  (click)=\"openRectModal(rectContent)\"\n                  class=\"image rec-img\"\n                  [ngClass]=\"{ 'w-100': rectangularImage === null || rectangularImage?.includes('default-photo.jpg') }\"\n                  alt=\"Uploaded rectangular media preview\"\n                  (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n                  <div class=\"d-flex justify-content-between align-items-center mt-2\">\n                    <a class=\"d-inline-block\" (click)=\"openRectModal(rectContent)\">\n                      {{ slug !== 'create' ? 'Edit' : 'Add' }} Picture\n                    </a>\n                    <i\n                      class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n                      title=\"Remove Image\"\n                      (click)=\"deleteRectangularImage()\"\n                      (keydown.enter)=\"deleteRectangularImage()\"\n                      *ngIf=\"rectangularImage && !rectangularImage.includes('default-photo.jpg')\">\n                    </i>\n                  </div>\n\n              </div>\n\n            </div>\n            <pw-input-container [label]=\"'Resource.Posts.CtaText' | transloco\"\n              class=\"col-12 col-md-6\"\n              [showTooltip]=\"true\"\n              [tooltipText]=\"'Resource.Posts.Tooltip.CtaText' | transloco\"\n              name=\"cta_text\">\n              <input type=\"text\"\n                class=\"form-control\"\n                formControlName=\"cta_text\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container [label]=\"'Resource.Posts.ExternalUrl' | transloco\"\n              class=\"col-12 col-md-6\"\n              [showTooltip]=\"true\"\n              [tooltipText]=\"'Resource.Posts.Tooltip.ExternalUrl' | transloco\"\n              name=\"external_url\">\n              <input type=\"text\"\n                class=\"form-control\"\n                formControlName=\"external_url\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['external_url'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container [label]=\"'Resource.Posts.Tags' | transloco \" class=\"ui-fluid skills-modal col-12 col-md-6 col-sm-12 tags\"\n              [showTooltip]=\"true\" [tooltipText]=\"'Resource.Posts.Tooltip.CtaText' | transloco\" name=\"cta_text\">\n              <p-autoComplete [(ngModel)]=\"selectedTags\" class=\"body-bg\" [suggestions]=\"tagsSuggestion\" dataKey=\"id\" field=\"name\"\n                (completeMethod)=\"search($event)\" styleClass=\"w-100\" [minLength]=\"1\" [maxlength]=\"10\" [dropdown]=\"true\"\n                [ngModelOptions]=\"{ standalone: true }\" placeholder=\"Tags\" [multiple]=\"true\">\n              </p-autoComplete>\n            </pw-input-container>\n\n            <pw-input-container [label]=\"'Author' | transloco\"\n              class=\"col-12 col-md-4 col-sm-6\"\n              name=\"author_id\"\n              [errorMsg]=\"'Please select an author' | transloco\">\n              <p-dropdown\n                formControlName=\"author_id\"\n                [options]=\"availableAuthors\"\n                optionLabel=\"label\"\n                optionValue=\"value\"\n                [placeholder]=\"'Select Author' | transloco\"\n                [loading]=\"authorsLoading\"\n                [ngClass]=\"{ 'is-invalid': submitted && f['author_id'].errors }\"\n                styleClass=\"w-100\">\n                <ng-template pTemplate=\"item\" let-author>\n                  <div>\n                    <div>{{ author.label }}</div>\n                  </div>\n                </ng-template>\n              </p-dropdown>\n            </pw-input-container>\n\n\n            <!-- WHEN and AUTHOR on same line -->\n            <div class=\"col-12 col-md-2 col-sm-6\">\n              <div class=\"mb-3\">\n                <pw-input-container [label]=\"'Resource.Posts.When' | transloco\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Resource.Posts.Tooltip.When' | transloco\"\n                  name=\"when\">\n                  <div>\n                    <p-calendar formControlName=\"when\"\n                      [showIcon]=\"true\"\n                      dateFormat=\"dd-M-yy\"\n                      [placeholder]=\"'Select Date'\"\n                      [ngClass]=\"{'is-invalid': submitted && f['when'].errors}\">\n                    </p-calendar>\n                  </div>\n                </pw-input-container>\n              </div>\n            </div>\n\n            <!-- Author Dropdown -->\n            <!-- Three toggles on next line -->\n            <div class=\"col-12\">\n              <div class=\"row\">\n                <div class=\"col-12 col-md-2 col-sm-6\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Resource.Posts.Tooltip.ShowCase' | transloco\"\n                      [label]=\"'Resource.Posts.ShowCase' | transloco\" name=\"showcase\">\n                      <ui-switch class=\"d-block\" formControlName=\"showcase\" name=\"showcase\">\n                      </ui-switch>\n                    </pw-input-container>\n                  </div>\n                </div>\n\n                <!--Published At -->\n                <div class=\"col-12 col-md-2 col-sm-6\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\"\n                      [tooltipText]=\"'Resource.Posts.Tooltip.Published' | transloco\"\n                      [label]=\"'Resource.Posts.Published' | transloco\"\n                      name=\"published_at\">\n                      <ui-switch class=\"d-block\"\n                      formControlName=\"published_at\"\n                      name=\"published_at\">\n                    </ui-switch>\n                    </pw-input-container>\n                  </div>\n                </div>\n\n                <!--Accepted At -->\n                <div class=\"col-12 col-md-2 col-sm-6 accept-icon\">\n                  <div class=\"mb-3\">\n                    <pw-input-container [showTooltip]=\"true\"\n                      [tooltipText]=\"'Resource.Posts.Tooltip.AcceptedByAdmin' | transloco\"\n                      [label]=\"'Resource.Posts.AcceptedByAdmin' | transloco\"\n                      name=\"accepted_at\">\n                      <ui-switch class=\"d-block\"\n                      formControlName=\"accepted_at\"\n                      name=\"accepted_at\">\n                    </ui-switch>\n                    </pw-input-container>\n                  </div>\n                </div>\n              </div>\n            </div>\n\n          </div>\n          <div class=\"row text-end mt-4\">\n            <div class=\"col-12\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"navigateToResourceList()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"submitted\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Submit' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n\n\n<ng-template #content\n  let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Picture</h5>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload a JPG, GIF, or PNG file. (Do not upload pictures containing celebrities,\n      nudity, artwork or copyrighted images.)</small>\n    <pw-image-cropper #profile\n      aspectRatio=\"auto\"\n      (imageSelectionEvent)=\"onImageSelection($event)\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n\n<ng-template #rectContent let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Picture</h5>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n    </button>\n  </div>\n\n  <div class=\"modal-body\">\n    <small>\n      You can upload a JPG, GIF, or PNG file. (Do not upload pictures containing celebrities,\n      nudity, artwork or copyrighted images.)\n    </small>\n\n\n    <pw-image-cropper\n      #profile\n      [aspectRatio]=\"'dynamic'\"\n      [dynamicData]=\"getAspectRatio()\"\n      (imageSelectionEvent)=\"onRectangularImageSelection($event)\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n", styles: [".col-md-6.display-grid{display:grid}body .ui-autocomplete.ui-autocomplete-multiple .ui-autocomplete-multiple-container{width:100%}body .ui-inputtext{padding:0}.comment{border:1px solid rgb(238,238,238)}.is-invalid .ql-container.ql-snow,.is-invalid .ql-toolbar.ql-snow{border-color:#dc3545}.rec-img{max-width:100%;max-height:400px!important}.body-bg span .ui-autocomplete-multiple-container{background-color:#f5f7fa}.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-token{color:var(--tabs_text)}.tags .info-circle .tooltiptext:after{left:25px!important}.tags .info-circle .tooltiptext{left:-30px!important}.blurb .info-circle .tooltiptext:after{left:50px!important}.blurb .info-circle .tooltiptext{left:-55px!important}.accept-icon .info-circle .tooltiptext:after{left:110px!important}.accept-icon .info-circle .tooltiptext{right:-85px!important}\n"], dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -6658,7 +6658,7 @@ class SubscriptionDetailsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SubscriptionDetailsComponent, deps: [{ token: i1$2.SubscriptionService }, { token: i1.AdminService }, { token: i3$1.DatePipe }, { token: i1$2.CommonService }, { token: i1$2.NgbDateCustomParserFormatter }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SubscriptionDetailsComponent, selector: "pw-subscription-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n        routerLink=\"/admin/subscriptions/list\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>Subscription Details</span>\n        </h3>\n        <span class=\"badge rounded-pill bg-danger ms-2\"\n    *ngIf=\"currentSubscriber?.is_deleted\">Deleted</span>\n      </div>\n      <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n    </div>\n    <div  *ngIf=\"!isLoading\">\n\n      <ul ngbNav\n        #nav=\"ngbNav\"\n        class=\"nav-tabs\">\n        <li [ngbNavItem]=\"1\">\n          <a ngbNavLink>Subscription</a>\n          <ng-template ngbNavContent>\n            <div class=\"container-fluid pw-tab overflow-hidden\">\n              <div class=\"dashboard\">\n                <div class=\"dashboard-body\">\n                  <div class=\"mt-4\">\n                    <form [formGroup]=\"form\"\n                      (ngSubmit)=\"saveDetails()\">\n                      <div class=\"row\">\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Organization' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Organization' | transloco\"\n                            name=\"organisation\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"organisation\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.ContactName' | transloco\"\n                            [label]=\"'Admin.Subscriptions.ContactName' | transloco\"\n                            name=\"contact_name\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"contact_name\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.ContactEmail' | transloco\"\n                            [label]=\"'Admin.Subscriptions.ContactEmail' | transloco\"\n                            name=\"contact_email\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"contact_email\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.ContactTel' | transloco\"\n                            [label]=\"'Admin.Subscriptions.ContactTel' | transloco\"\n                            name=\"contact_tel\">\n                            <input type=\"text\"\n                              formControlName=\"contact_tel\"\n                              class=\"form-control\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [label]=\"'Tax Id'\"\n                            [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.TaxId' | transloco\"\n                            name=\"tax_id\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"tax_id\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                          *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                          <label class=\"info-circle\" for=\"productList\">{{ 'Admin.Subscriptions.AssignedRoles' | transloco }}\n                            <span class=\"tooltiptext gradient-custom-branding\">{{\n                                                      'Admin.Subscriptions.Tooltip.AssignedRoles'\n                                                          | transloco\n                                                  }}</span>\n                          </label>\n\n                          <p-multiSelect [options]=\"allRoles\"\n                            formControlName=\"roles\"\n                            appendTo=\"body\"></p-multiSelect>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                          *ngIf=\"organizationTypes$ | async as types\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\"\n                            [label]=\"'Organization.OrganizationType' | transloco\"\n                            name=\"organization_type_id\">\n                            <p-dropdown\n                              [options]=\"types['organization_types']\"\n                              formControlName=\"organization_type_id\"\n                              [placeholder]=\"'Select Organization Type'\"\n                              optionValue=\"id\"\n                              optionLabel=\"name\">\n                            </p-dropdown>\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-sm-6 col-md-3\"\n                          *ngIf=\"organizationIndustries$ | async as industries\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\"\n                            [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                            name=\"organization_industry_id\">\n                            <p-dropdown\n                              [options]=\"industries['organization_industries']\"\n                              formControlName=\"organization_industry_id\"\n                              [placeholder]=\"'Select Organization Industry'\"\n                              optionValue=\"id\"\n                              optionLabel=\"name\">\n                            </p-dropdown>\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-sm-6 col-md-3\"\n                          *ngIf=\"organizationSizes$ | async as sizes\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\"\n                            [label]=\"'Size' | transloco\"\n                            name=\"organization_size_id\">\n                            <p-dropdown\n                              [options]=\"sizes['organization_sizes']\"\n                              formControlName=\"organization_size_id\"\n                              [placeholder]=\"'Select Organization Size'\"\n                              optionValue=\"id\"\n                              optionLabel=\"name\">\n                            </p-dropdown>\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.CompanyUrl' | transloco\"\n                            [label]=\"'Admin.Subscriptions.CompanyUrl' | transloco\"\n                            name=\"company_url\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"company_url\" />\n                          </pw-input-container>\n                        </div>\n\n                        <!-- Readonly Starts -->\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Reference' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Reference' | transloco\"\n                            name=\"reference_number\">\n                            <input type=\"text\"\n                              readonly\n                              class=\"form-control\"\n                              data-control=\"reference\"\n                              *ngIf=\"form\"\n                              [value]=\"form.get('reference_number')?.value\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.UnitsInUse' | transloco\"\n                            [label]=\"'Admin.Subscriptions.UnitsInUse' | transloco\"\n                            name=\"units_in_use\">\n                            <input type=\"text\"\n                              readonly\n                              class=\"form-control\"\n                              formControlName=\"units_in_use\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.MaxUnits' | transloco\"\n                            [label]=\"'Admin.Subscriptions.MaxUnits' | transloco\"\n                            name=\"max_units\">\n                            <input type=\"text\"\n                              readonly\n                              class=\"form-control\"\n                              formControlName=\"max_units\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.CalculatedPrice' | transloco\"\n                            [label]=\"'Admin.Subscriptions.CalculatedPrice' | transloco\"\n                            name=\"calculated_price\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              readonly\n                              formControlName=\"calculated_price\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.MainExpiryDate' | transloco\"\n                            [label]=\"\n                                                      'Admin.Subscriptions.MainExpiryDate' | transloco\n                                                  \"\n                            name=\"expires_at\">\n                            <div class=\"input-group\">\n                              <input class=\"form-control\"\n                                container=\"body\"\n                                placeholder=\"Expiry Date\"\n                                formControlName=\"expires_at\"\n                                [readonly]=\"true\"\n                                ngbDatepicker\n                                #c=\"ngbDatepicker\" />\n                              <div class=\"input-group-append\">\n                                <button class=\"btn btn-primary\"\n                                  [disabled]=\"true\"\n                                  (click)=\"c.toggle()\"\n                                  type=\"button\">\n                                  <i\n                                                                  class=\"fa fa-calendar\"\n                                                                  aria-hidden=\"true\"\n                                                              ></i>\n                                </button>\n                              </div>\n                            </div>\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                          *rbacAllow=\"'SuperAdmin'\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.PurchasedSeats' | transloco\"\n                            [label]=\"'Admin.Subscriptions.PurchasedSeats' | transloco\"\n                            name=\"purchased_units\">\n                            <input type=\"number\"\n                              min=\"0\"\n                              readonly\n                              class=\"form-control\"\n                              formControlName=\"purchased_units\" />\n                          </pw-input-container>\n                        </div>\n\n                        <!-- Readonly Ends -->\n                      </div>\n                      <!-- social links -->\n                      <h3>Social Links</h3>\n                      <div class=\"row\">\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Facebook' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Facebook' | transloco\"\n                            name=\"facebook_handle\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"facebook_handle\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Twitter' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Twitter' | transloco\"\n                            name=\"twitter_handle\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"twitter_handle\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Linkedin' | transloco\"\n                            [label]=\"'Admin.Subscriptions.LinkedIn' | transloco\"\n                            name=\"linkedin_handle\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"linkedin_handle\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Reddit' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Reddit' | transloco\"\n                            name=\"reddit_handle\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"reddit_handle\" />\n                          </pw-input-container>\n                        </div>\n                      </div>\n                      <ng-container *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                        <h3>Security</h3>\n                        <div class=\"row\">\n                          <div class=\"col-12 col-sm-3\">\n                            <pw-input-container [showTooltip]=\"true\"\n                              [tooltipText]=\"'Admin.Subscriptions.Tooltip.Enforce2fa'| transloco\"\n                              label=\"Enforce 2FA\"\n                              name=\"enforce_2fa\">\n                              <ui-switch formControlName=\"enforce_2fa\"\n                                name=\"enforce_2fa\">\n                              </ui-switch>\n                            </pw-input-container>\n                          </div>\n                        </div>\n                      </ng-container>\n                      <div class=\"row text-end mt-4\">\n                        <div class=\"col-12\">\n                          <button type=\"button\"\n                            class=\"btn btn-outline-default me-2\"\n                            (click)=\"back()\">\n                            {{ 'Button.Cancel' | transloco }}\n                          </button>\n                          <button type=\"submit\"\n                            [buttonBusy]=\"submitted\"\n                            class=\"btn btn-primary\"\n                            *rbacAllow=\"'Pages.Admin.Subscription.Edit'\">\n                            {{ 'Button.Save' | transloco }}\n                          </button>\n                        </div>\n                      </div>\n                    </form>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </ng-template>\n        </li>\n        <li [ngbNavItem]=\"2\">\n          <a ngbNavLink>Products</a>\n          <ng-template ngbNavContent>\n            <pw-subscription-products></pw-subscription-products>\n          </ng-template>\n        </li>\n        <li [ngbNavItem]=\"3\">\n          <a ngbNavLink>Members</a>\n          <ng-template ngbNavContent>\n            <pw-subscription-users></pw-subscription-users>\n          </ng-template>\n        </li>\n        <li [ngbNavItem]=\"4\"\n          *rbacAllow=\"'SuperAdmin'\">\n          <a ngbNavLink>Ambassadors</a>\n          <ng-template ngbNavContent>\n            <pw-subscription-agents-list></pw-subscription-agents-list>\n          </ng-template>\n        </li>\n      </ul>\n    <div [ngbNavOutlet]=\"nav\"></div>\n    </div>\n    </div>\n  </div>\n</div>\n", styles: [".ui-autocomplete-multiple-container,.ui-fluid.skills-modal p-autocomplete{background:transparent}\n"], dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i2$1.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2$1.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2$1.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2$1.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2$1.NgbNavLink, selector: "a[ngbNavLink]" }, { kind: "directive", type: i2$1.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2$1.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$1.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "component", type: SubscriptionProductsComponent, selector: "pw-subscription-products" }, { kind: "component", type: SubscriptionUsersComponent, selector: "pw-subscription-users" }, { kind: "component", type: SubscriptionAgentsListComponent, selector: "pw-subscription-agents-list" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SubscriptionDetailsComponent, selector: "pw-subscription-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n        routerLink=\"/admin/subscriptions/list\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          <span>Subscription Details</span>\n        </h3>\n        <span class=\"badge rounded-pill bg-danger ms-2\"\n    *ngIf=\"currentSubscriber?.is_deleted\">Deleted</span>\n      </div>\n      <div class=\"w-100 text-center mt-3\"\n      *ngIf=\"isLoading\">\n      <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n    </div>\n    <div  *ngIf=\"!isLoading\">\n\n      <ul ngbNav\n        #nav=\"ngbNav\"\n        class=\"nav-tabs\">\n        <li [ngbNavItem]=\"1\">\n          <a ngbNavLink>Subscription</a>\n          <ng-template ngbNavContent>\n            <div class=\"container-fluid pw-tab overflow-hidden\">\n              <div class=\"dashboard\">\n                <div class=\"dashboard-body\">\n                  <div class=\"mt-4\">\n                    <form [formGroup]=\"form\"\n                      (ngSubmit)=\"saveDetails()\">\n                      <div class=\"row\">\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Organization' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Organization' | transloco\"\n                            name=\"organisation\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"organisation\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.ContactName' | transloco\"\n                            [label]=\"'Admin.Subscriptions.ContactName' | transloco\"\n                            name=\"contact_name\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"contact_name\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.ContactEmail' | transloco\"\n                            [label]=\"'Admin.Subscriptions.ContactEmail' | transloco\"\n                            name=\"contact_email\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"contact_email\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.ContactTel' | transloco\"\n                            [label]=\"'Admin.Subscriptions.ContactTel' | transloco\"\n                            name=\"contact_tel\">\n                            <input type=\"text\"\n                              formControlName=\"contact_tel\"\n                              class=\"form-control\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [label]=\"'Tax Id'\"\n                            [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.TaxId' | transloco\"\n                            name=\"tax_id\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"tax_id\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                          *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                          <label class=\"info-circle\" for=\"productList\">{{ 'Admin.Subscriptions.AssignedRoles' | transloco }}\n                            <span class=\"tooltiptext gradient-custom-branding\">{{\n                                                      'Admin.Subscriptions.Tooltip.AssignedRoles'\n                                                          | transloco\n                                                  }}</span>\n                          </label>\n\n                          <p-multiSelect [options]=\"allRoles\"\n                            formControlName=\"roles\"\n                            appendTo=\"body\"></p-multiSelect>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                          *ngIf=\"organizationTypes$ | async as types\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\"\n                            [label]=\"'Organization.OrganizationType' | transloco\"\n                            name=\"organization_type_id\">\n                            <p-dropdown\n                              [options]=\"types['organization_types']\"\n                              formControlName=\"organization_type_id\"\n                              [placeholder]=\"'Select Organization Type'\"\n                              optionValue=\"id\"\n                              optionLabel=\"name\">\n                            </p-dropdown>\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-sm-6 col-md-3\"\n                          *ngIf=\"organizationIndustries$ | async as industries\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\"\n                            [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                            name=\"organization_industry_id\">\n                            <p-dropdown\n                              [options]=\"industries['organization_industries']\"\n                              formControlName=\"organization_industry_id\"\n                              [placeholder]=\"'Select Organization Industry'\"\n                              optionValue=\"id\"\n                              optionLabel=\"name\">\n                            </p-dropdown>\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-sm-6 col-md-3\"\n                          *ngIf=\"organizationSizes$ | async as sizes\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\"\n                            [label]=\"'Size' | transloco\"\n                            name=\"organization_size_id\">\n                            <p-dropdown\n                              [options]=\"sizes['organization_sizes']\"\n                              formControlName=\"organization_size_id\"\n                              [placeholder]=\"'Select Organization Size'\"\n                              optionValue=\"id\"\n                              optionLabel=\"name\">\n                            </p-dropdown>\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.CompanyUrl' | transloco\"\n                            [label]=\"'Admin.Subscriptions.CompanyUrl' | transloco\"\n                            name=\"company_url\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"company_url\" />\n                          </pw-input-container>\n                        </div>\n\n                        <!-- Readonly Starts -->\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Reference' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Reference' | transloco\"\n                            name=\"reference_number\">\n                            <input type=\"text\"\n                              readonly\n                              class=\"form-control\"\n                              data-control=\"reference\"\n                              *ngIf=\"form\"\n                              [value]=\"form.get('reference_number')?.value\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.UnitsInUse' | transloco\"\n                            [label]=\"'Admin.Subscriptions.UnitsInUse' | transloco\"\n                            name=\"units_in_use\">\n                            <input type=\"text\"\n                              readonly\n                              class=\"form-control\"\n                              formControlName=\"units_in_use\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.MaxUnits' | transloco\"\n                            [label]=\"'Admin.Subscriptions.MaxUnits' | transloco\"\n                            name=\"max_units\">\n                            <input type=\"text\"\n                              readonly\n                              class=\"form-control\"\n                              formControlName=\"max_units\" />\n                          </pw-input-container>\n                        </div>\n\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.CalculatedPrice' | transloco\"\n                            [label]=\"'Admin.Subscriptions.CalculatedPrice' | transloco\"\n                            name=\"calculated_price\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              readonly\n                              formControlName=\"calculated_price\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.MainExpiryDate' | transloco\"\n                            [label]=\"\n                                                      'Admin.Subscriptions.MainExpiryDate' | transloco\n                                                  \"\n                            name=\"expires_at\">\n                            <div class=\"input-group\">\n                              <input class=\"form-control\"\n                                container=\"body\"\n                                placeholder=\"Expiry Date\"\n                                formControlName=\"expires_at\"\n                                [readonly]=\"true\"\n                                ngbDatepicker\n                                #c=\"ngbDatepicker\" />\n                              <div class=\"input-group-append\">\n                                <button class=\"btn btn-primary\"\n                                  [disabled]=\"true\"\n                                  (click)=\"c.toggle()\"\n                                  type=\"button\">\n                                  <i\n                                                                  class=\"fa fa-calendar\"\n                                                                  aria-hidden=\"true\"\n                                                              ></i>\n                                </button>\n                              </div>\n                            </div>\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                          *rbacAllow=\"'SuperAdmin'\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.PurchasedSeats' | transloco\"\n                            [label]=\"'Admin.Subscriptions.PurchasedSeats' | transloco\"\n                            name=\"purchased_units\">\n                            <input type=\"number\"\n                              min=\"0\"\n                              readonly\n                              class=\"form-control\"\n                              formControlName=\"purchased_units\" />\n                          </pw-input-container>\n                        </div>\n\n                        <!-- Readonly Ends -->\n                      </div>\n                      <!-- social links -->\n                      <h3>Social Links</h3>\n                      <div class=\"row\">\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Facebook' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Facebook' | transloco\"\n                            name=\"facebook_handle\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"facebook_handle\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Twitter' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Twitter' | transloco\"\n                            name=\"twitter_handle\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"twitter_handle\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Linkedin' | transloco\"\n                            [label]=\"'Admin.Subscriptions.LinkedIn' | transloco\"\n                            name=\"linkedin_handle\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"linkedin_handle\" />\n                          </pw-input-container>\n                        </div>\n                        <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\">\n                          <pw-input-container [showTooltip]=\"true\"\n                            [tooltipText]=\"'Admin.Subscriptions.Tooltip.Reddit' | transloco\"\n                            [label]=\"'Admin.Subscriptions.Reddit' | transloco\"\n                            name=\"reddit_handle\">\n                            <input type=\"text\"\n                              class=\"form-control\"\n                              formControlName=\"reddit_handle\" />\n                          </pw-input-container>\n                        </div>\n                      </div>\n                      <ng-container *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                        <h3>Security</h3>\n                        <div class=\"row\">\n                          <div class=\"col-12 col-sm-3\">\n                            <pw-input-container [showTooltip]=\"true\"\n                              [tooltipText]=\"'Admin.Subscriptions.Tooltip.Enforce2fa'| transloco\"\n                              label=\"Enforce 2FA\"\n                              name=\"enforce_2fa\">\n                              <ui-switch formControlName=\"enforce_2fa\"\n                                name=\"enforce_2fa\">\n                              </ui-switch>\n                            </pw-input-container>\n                          </div>\n                        </div>\n                      </ng-container>\n                      <div class=\"row text-end mt-4\">\n                        <div class=\"col-12\">\n                          <button type=\"button\"\n                            class=\"btn btn-outline-default me-2\"\n                            (click)=\"back()\">\n                            {{ 'Button.Cancel' | transloco }}\n                          </button>\n                          <button type=\"submit\"\n                            [buttonBusy]=\"submitted\"\n                            class=\"btn btn-primary\"\n                            *rbacAllow=\"'Pages.Admin.Subscription.Edit'\">\n                            {{ 'Button.Save' | transloco }}\n                          </button>\n                        </div>\n                      </div>\n                    </form>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </ng-template>\n        </li>\n        <li [ngbNavItem]=\"2\">\n          <a ngbNavLink>Products</a>\n          <ng-template ngbNavContent>\n            <pw-subscription-products></pw-subscription-products>\n          </ng-template>\n        </li>\n        <li [ngbNavItem]=\"3\">\n          <a ngbNavLink>Members</a>\n          <ng-template ngbNavContent>\n            <pw-subscription-users></pw-subscription-users>\n          </ng-template>\n        </li>\n        <li [ngbNavItem]=\"4\"\n          *rbacAllow=\"'SuperAdmin'\">\n          <a ngbNavLink>Ambassadors</a>\n          <ng-template ngbNavContent>\n            <pw-subscription-agents-list></pw-subscription-agents-list>\n          </ng-template>\n        </li>\n      </ul>\n    <div [ngbNavOutlet]=\"nav\"></div>\n    </div>\n    </div>\n  </div>\n</div>\n", styles: [".ui-autocomplete-multiple-container,.ui-fluid.skills-modal p-autocomplete{background:transparent}\n"], dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i2$1.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2$1.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2$1.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2$1.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2$1.NgbNavLink, selector: "a[ngbNavLink]" }, { kind: "directive", type: i2$1.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2$1.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$1.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "component", type: SubscriptionProductsComponent, selector: "pw-subscription-products" }, { kind: "component", type: SubscriptionUsersComponent, selector: "pw-subscription-users" }, { kind: "component", type: SubscriptionAgentsListComponent, selector: "pw-subscription-agents-list" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SubscriptionDetailsComponent, decorators: [{
             type: Component,
@@ -7421,7 +7421,7 @@ class InviteUsersComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: InviteUsersComponent, deps: [{ token: i3$2.UntypedFormBuilder }, { token: i1.AdminService }, { token: i1$2.ProductService }, { token: i0.Injector }, { token: i1$2.CommonService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: InviteUsersComponent, selector: "pw-invite-users", viewQueries: [{ propertyName: "refProduct", first: true, predicate: ["refProduct"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard user-details\">\n    <div class=\"dashboard-body\">\n\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          (click)=\"back()\"\n          class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n          <h3 class=\"\">Invite New User</h3>\n          <p>Here you can send an invitation to a new user to try any of our products</p>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n  (ngSubmit)=\"onSave()\">\n  <div class=\"row\">\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Label.FirstName' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.FirstName' | transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"first_name\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.FirstName' | transloco\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"first_name\"\n          [ngClass]=\"{\n                        'is-invalid':\n                            form.get('first_name').touched && form.get('first_name').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Label.LastName' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.LastName' | transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"last_name\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.LastName' | transloco\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"last_name\"\n          [ngClass]=\"{\n                        'is-invalid': form.get('last_name').touched && form.get('last_name').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Label.Email' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.Email' | transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"email\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.Email' | transloco\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"email\"\n          [ngClass]=\"{\n                        'is-invalid': form.get('email').touched && form.get('email').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Label.Product' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n        name=\"product_id\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n        <p-autoComplete #refProduct\n        [suggestions]=\"filteredProducts\"\n          formControlName=\"product_id\"\n          dataKey=\"id\"\n          field=\"label\"\n          [dropdown]=\"true\"\n          [delay]=\"1000\"\n          [type]=\"'search'\"\n          (completeMethod)=\"searchProduct($event)\"\n          (onSelect)=\"onProductChange($event)\"\n          (onClear)=\"onProductClear($event)\"\n          styleClass=\"w-100\"\n          placeholder=\"Search Product\"\n          [inputStyle]=\"\n                        form.get('product_id').touched && form.get('product_id').invalid\n                            ? { border: '1px solid #ff586b' }\n                            : { border: '1px solid gray' }\n                    \"\n          [multiple]=\"false\">\n        </p-autoComplete>\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container label=\"{{'Label.Seats' | transloco}}{{unitsText}}\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.Units' | transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"units\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.Units' | transloco\">\n        <input type=\"number\"\n          class=\"form-control\"\n          formControlName=\"units\"\n          [ngClass]=\"{\n                        'is-invalid': form.get('units').touched && form.get('units').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Admin.Subscriptions.MinUnits' | transloco\"\n        [showTooltip]=\"true\"\n        name=\"min_units\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.MinUnits' | transloco\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.MinUnits' | transloco\">\n        <input type=\"number\"\n          min=\"0\"\n          [max]=\"form.get('units').value\"\n          class=\"form-control\"\n          formControlName=\"min_units\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\"\n      *ngIf=\"organizationIndustries$ | async as industries\">\n      <pw-input-container [label]=\"'Organization.OrganizationIndustry' | transloco\"\n        name=\"organization_industry_id\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry'| transloco\">\n        <p-dropdown\n          [options]=\"industries['organization_industries']\"\n          formControlName=\"organization_industry_id\"\n          [placeholder]=\"'Select Organization Industry'\"\n          optionValue=\"id\"\n          optionLabel=\"name\">\n        </p-dropdown>\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Organization.OrganizationName' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationName'| transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"name\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"name\"\n          [ngClass]=\"{\n                        'is-invalid': form.get('name').touched && form.get('name').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\"\n      *ngIf=\"organizationTypes$ | async as types\">\n      <pw-input-container [label]=\"'Organization.OrganizationType' | transloco\"\n        name=\"organization_type_id\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType'| transloco\">\n        <p-dropdown\n          [options]=\"types['organization_types']\"\n          formControlName=\"organization_type_id\"\n          [placeholder]=\"'Select Organization Type'\"\n          optionValue=\"id\"\n          optionLabel=\"name\">\n        </p-dropdown>\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\"\n      *ngIf=\"organizationSizes$ | async as sizes\">\n      <pw-input-container [label]=\"'Organization.OrganizationSize' | transloco\"\n        name=\"organization_size_id\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize'| transloco\">\n        <p-dropdown\n              [options]=\"sizes['organization_sizes']\"\n              formControlName=\"organization_size_id\"\n              [placeholder]=\"'Select Organization Size'\"\n              optionValue=\"id\"\n              optionLabel=\"name\">\n            </p-dropdown>\n      </pw-input-container>\n    </div>\n  </div>\n  <div class=\"row\">\n    <div class=\"col-12 text-end\">\n      <input type=\"button\"\n        class=\"btn btn-outline-primary me-3\"\n        value=\"Cancel\"\n        (click)=\"form.reset(); totalRecordsUnFiltered = 0; back()\" />\n      <button type=\"submit\"\n        [buttonBusy]=\"buttonBusy\"\n        [disabled]=\"buttonBusy\"\n        class=\"btn btn-primary\">Invite</button>\n    </div>\n  </div>\n</form>\n      </div>\n    </div>\n  </div>\n</div>", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}\n"], dependencies: [{ kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: InviteUsersComponent, selector: "pw-invite-users", viewQueries: [{ propertyName: "refProduct", first: true, predicate: ["refProduct"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard user-details\">\n    <div class=\"dashboard-body\">\n\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          (click)=\"back()\"\n          class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n          <h3 class=\"\">Invite New User</h3>\n          <p>Here you can send an invitation to a new user to try any of our products</p>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n  (ngSubmit)=\"onSave()\">\n  <div class=\"row\">\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Label.FirstName' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.FirstName' | transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"first_name\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.FirstName' | transloco\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"first_name\"\n          [ngClass]=\"{\n                        'is-invalid':\n                            form.get('first_name').touched && form.get('first_name').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Label.LastName' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.LastName' | transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"last_name\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.LastName' | transloco\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"last_name\"\n          [ngClass]=\"{\n                        'is-invalid': form.get('last_name').touched && form.get('last_name').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Label.Email' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.Email' | transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"email\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.Email' | transloco\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"email\"\n          [ngClass]=\"{\n                        'is-invalid': form.get('email').touched && form.get('email').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Label.Product' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n        name=\"product_id\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n        <p-autoComplete #refProduct\n        [suggestions]=\"filteredProducts\"\n          formControlName=\"product_id\"\n          dataKey=\"id\"\n          field=\"label\"\n          [dropdown]=\"true\"\n          [delay]=\"1000\"\n          [type]=\"'search'\"\n          (completeMethod)=\"searchProduct($event)\"\n          (onSelect)=\"onProductChange($event)\"\n          (onClear)=\"onProductClear($event)\"\n          styleClass=\"w-100\"\n          placeholder=\"Search Product\"\n          [inputStyle]=\"\n                        form.get('product_id').touched && form.get('product_id').invalid\n                            ? { border: '1px solid #ff586b' }\n                            : { border: '1px solid gray' }\n                    \"\n          [multiple]=\"false\">\n        </p-autoComplete>\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container label=\"{{'Label.Seats' | transloco}}{{unitsText}}\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.Units' | transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"units\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.Units' | transloco\">\n        <input type=\"number\"\n          class=\"form-control\"\n          formControlName=\"units\"\n          [ngClass]=\"{\n                        'is-invalid': form.get('units').touched && form.get('units').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Admin.Subscriptions.MinUnits' | transloco\"\n        [showTooltip]=\"true\"\n        name=\"min_units\"\n        [errorMsg]=\"'Admin.Subscriptions.Validation.MinUnits' | transloco\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.MinUnits' | transloco\">\n        <input type=\"number\"\n          min=\"0\"\n          [max]=\"form.get('units').value\"\n          class=\"form-control\"\n          formControlName=\"min_units\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\"\n      *ngIf=\"organizationIndustries$ | async as industries\">\n      <pw-input-container [label]=\"'Organization.OrganizationIndustry' | transloco\"\n        name=\"organization_industry_id\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry'| transloco\">\n        <p-dropdown\n          [options]=\"industries['organization_industries']\"\n          formControlName=\"organization_industry_id\"\n          [placeholder]=\"'Select Organization Industry'\"\n          optionValue=\"id\"\n          optionLabel=\"name\">\n        </p-dropdown>\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\">\n      <pw-input-container [label]=\"'Organization.OrganizationName' | transloco\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationName'| transloco\"\n        class=\"col-md-6 p-0\"\n        name=\"name\">\n        <input type=\"text\"\n          class=\"form-control\"\n          formControlName=\"name\"\n          [ngClass]=\"{\n                        'is-invalid': form.get('name').touched && form.get('name').invalid\n                    }\" />\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\"\n      *ngIf=\"organizationTypes$ | async as types\">\n      <pw-input-container [label]=\"'Organization.OrganizationType' | transloco\"\n        name=\"organization_type_id\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType'| transloco\">\n        <p-dropdown\n          [options]=\"types['organization_types']\"\n          formControlName=\"organization_type_id\"\n          [placeholder]=\"'Select Organization Type'\"\n          optionValue=\"id\"\n          optionLabel=\"name\">\n        </p-dropdown>\n      </pw-input-container>\n    </div>\n    <div class=\"mb-3 col-sm-4\"\n      *ngIf=\"organizationSizes$ | async as sizes\">\n      <pw-input-container [label]=\"'Organization.OrganizationSize' | transloco\"\n        name=\"organization_size_id\"\n        [showTooltip]=\"true\"\n        [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize'| transloco\">\n        <p-dropdown\n              [options]=\"sizes['organization_sizes']\"\n              formControlName=\"organization_size_id\"\n              [placeholder]=\"'Select Organization Size'\"\n              optionValue=\"id\"\n              optionLabel=\"name\">\n            </p-dropdown>\n      </pw-input-container>\n    </div>\n  </div>\n  <div class=\"row\">\n    <div class=\"col-12 text-end\">\n      <input type=\"button\"\n        class=\"btn btn-outline-primary me-3\"\n        value=\"Cancel\"\n        (click)=\"form.reset(); totalRecordsUnFiltered = 0; back()\" />\n      <button type=\"submit\"\n        [buttonBusy]=\"buttonBusy\"\n        [disabled]=\"buttonBusy\"\n        class=\"btn btn-primary\">Invite</button>\n    </div>\n  </div>\n</form>\n      </div>\n    </div>\n  </div>\n</div>", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}\n"], dependencies: [{ kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: InviteUsersComponent, decorators: [{
             type: Component,
@@ -7695,11 +7695,11 @@ class SubscriptionsListComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SubscriptionsListComponent, deps: [{ token: i1$2.ProductService }, { token: i1.AdminService }, { token: i3$2.UntypedFormBuilder }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1$2.CommonService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SubscriptionsListComponent, selector: "pw-subscriptions-list", viewQueries: [{ propertyName: "refProduct", first: true, predicate: ["refProduct"], descendants: true }, { propertyName: "recoverSubscriptionPasswordModal", first: true, predicate: ["recoverSubscriptionPasswordModal"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div\n    class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Subscriptions</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      [routerLink]=\"[routers.inviteUsers]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Invite a User to a Trial\n    </a>\n  </div>\n</div>\n<div class=\"p-2 mt-3\">\n  <div class=\"w-100 text-center mt-3\">\n    <ng-template [ngIf]=\"!isLoaded\">\n      <p-progressSpinner> </p-progressSpinner>\n    </ng-template>\n  </div>\n  <div class=\"primeng-datatable-container table-responsive mt-0\"\n    [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n    <p-table #dt\n      [value]=\"subscriptions\"\n      [paginator]=\"totalRecords !== 0\"\n      [rows]=\"PAGE_SIZE\"\n      [lazy]=\"true\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        <ng-container *ngIf=\"subscriptionInsights\">\n          <div class=\"row mb-4\">\n            <ng-container *ngFor=\"let temp of objectKeys(subscriptionInsights)\">\n              <div class=\"col-12 col-lg-3 mt-2 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    <ng-container *ngFor=\"let item of subscriptionInsights[temp]\">\n                      <div>\n                        <p class=\"mb-0 px-2\">{{ item?.title }}\n                          <span *ngIf=\"item?.info\"\n                            [pTooltip]=\"item?.info\">\n                            <i class=\"fas fa-info-circle\"></i>\n                          </span>\n                        </p>\n                        <h4 class=\"fw-bold mt-2 mb-2\">\n                          {{ item?.value }}\n                        </h4>\n                      </div>\n                    </ng-container>\n                  </div>\n                </div>\n              </div>\n            </ng-container>\n          </div>\n        </ng-container>\n        <div class=\"search-filter\">\n          <div class=\"col-12 col-sm-4\">\n            <p-multiSelect placeholder=\"Select Feature Keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              [(ngModel)]=\"selectedFeatureKeys\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          <div class=\"col-12 col-sm-4\">\n            <p-dropdown\n              [options]=\"subscriptionStatus\"\n              [placeholder]=\"'Select status'\"\n              (onChange)=\"filterByStatus($event.value)\"\n              [(ngModel)]=\"status\">\n            </p-dropdown>\n          </div>\n          <div class=\"text-end\">\n            <i class=\"fa fa-search mt-2 me-2 d-none\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"30\"\n              placeholder=\"Search Subscription...\"\n              class=\"mw-90\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Subscriptions.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"organisation\">\n            {{ 'Admin.Subscriptions.Organization' | transloco }}\n            <p-sortIcon field=\"organisation\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_name\">\n            {{ 'Admin.Subscriptions.ContactName' | transloco }}\n            <p-sortIcon field=\"contact_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_email\">\n            {{ 'Admin.Subscriptions.ContactEmail' | transloco }}\n            <p-sortIcon field=\"contact_email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Product' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Currency' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.PricePerMonth' | transloco }}</th>\n          <th scope=\"true\"\n            pSortableColumn=\"stripe_customer_id\">\n            {{ 'Admin.Subscriptions.Paid' | transloco }}\n            <p-sortIcon field=\"stripe_customer_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Billing' | transloco }}</th>\n          <th scope=\"true\"\n            class=\"expires-at-width\">\n            {{ 'Admin.Subscriptions.ExpiresAt' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_total\">\n            {{ 'Admin.Subscriptions.SessionsTotal' | transloco }}\n            <p-sortIcon field=\"sessions_total\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"deleted_at\">\n            {{ 'Admin.Subscriptions.Deleted' | transloco }}\n            <p-sortIcon field=\"deleted_at\"></p-sortIcon>\n          </th>\n          <th class=\"actions-list-two\"\n            scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-item>\n        <tr>\n          <td data-head=\"id\">{{ item.id }}</td>\n          <td data-head=\"Organization\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.organisation\"\n              tooltipPosition=\"top\">{{ item.organisation | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"ContactName\"\n            class=\"custom-break-word\">\n            {{ item.contact_name }}\n          </td>\n          <td data-head=\"ContactEmail\">{{ item.contact_email }}</td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n              tooltipPosition=\"top\">{{ item.productName }}</span>\n          </td>\n          <td data-head=\"Currency\">\n            <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n              color=\"blue-grey\"\n              class=\"badge\">{{ item.currency }}</span>\n          </td>\n          <td data-head=\"Price/M\">\n            <span>{{ (item.price / 100).toFixed(2) | currency:item.currency }}\n              <i\n                              class=\"fa fa-info-circle\"\n                              *ngIf=\"item?.discount && objectKeys(item?.discount)?.length\"\n                              aria-hidden=\"true\"\n                              [pTooltip]=\"item?.discount | json\"\n                              tooltipPosition=\"top\"\n                          ></i>\n            </span>\n          </td>\n          <td data-head=\"Paid\">\n            <ng-container *ngIf=\"item?.unsubscribed_at\">\n              <span class=\"badge bg-warning d-inline-flex align-items-center\">\n                Unsub\n                <i class=\"fa fa-info-circle ms-2\"\n                  *ngIf=\"item?.reason_to_cancel\"\n                  [pTooltip]=\"item.reason_to_cancel\"\n                   tooltipPosition=\"top\"\n                   aria-hidden=\"true\"></i>\n              </span>\n            </ng-container>\n            <ng-container *ngIf=\"!item?.unsubscribed_at\">\n              <ng-template [ngIf]=\"item?.stripe_customer_id || item?.external_payment\"\n                [ngIfElse]=\"noBlock\">\n                <span class=\"badge bg-success\">Yes</span>\n              </ng-template>\n              <ng-template #noBlock>\n                <span class=\"badge bg-blue-grey\">No</span>\n              </ng-template>\n            </ng-container>\n            <span *ngIf=\"item?.pause_collection && objectKeys(item?.pause_collection)?.length\"\n              class=\"ms-2\"\n              [pTooltip]=\"item?.pause_collection | json\"\n              tooltipPosition=\"top\">\n              <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n            </span>\n          </td>\n          <td data-head=\"Billing\">\n            <span class=\"badge\"\n              [appDynamicBadge]=\"{\n                              itemsArray: billingFrequency,\n                              item: item?.billingFrequency\n                          }\"\n              color=\"blue-grey\">{{ item.billingFrequency }}</span>\n          </td>\n          <td data-head=\"Expires\">\n            <span [ngClass]=\"getExpiresAtColor(item)\">{{item?.expires_at | dateFormat}}</span><br />\n            <span>{{item?.created_at | sinceAgo}}</span>\n          </td>\n          <td data-head=\"S#\">{{ item?.sessions_total }}</td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': item?.sessions_last_month < 3\n                          }\">{{ item?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Deleted\">\n            <span *ngIf=\"item?.deleted_at\"\n              class=\"badge bg-danger\">Yes</span>\n            <span *ngIf=\"!item?.deleted_at\"\n              class=\"badge bg-blue-grey\">No</span>\n          </td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Edit\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.subscriptionDetails, item.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              <ng-container *ngIf=\"item.deleted; else showDelete\">\n                <li ngbTooltip=\"Reactivate subscription\"\n                    class=\"me-2 me-sm-3\"\n                    *rbacAllow=\"'Pages.Alpha'\"\n                    (keydown.enter)=\"openRecoverSubscriptionModal(item)\"\n                    (click)=\"openRecoverSubscriptionModal(item)\">\n                  <i class=\"fa fa-trash delete-icon text-success\" aria-hidden=\"true\"></i>\n                </li>\n              </ng-container>\n              <ng-template #showDelete>\n                <li ngbTooltip=\"Delete\"\n                    class=\"me-2 me-sm-3\"\n                    *rbacAllow=\"'Pages.Admin.Subscription.Delete'\"\n                    (keydown.enter)=\"onDelete(item)\"\n                    (click)=\"onDelete(item)\">\n                    <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </li>\n              </ng-template>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n    <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n  </div>\n</div>\n<pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionMessage' | transloco\" *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n</pw-no-data>\n<pw-password-validation\n  #recoverSubscriptionPasswordModal\n  (successEvent)=\"onRecoverConfirmed()\">\n</pw-password-validation>\n\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary .card{padding-bottom:0}.summary .card .card-body{padding-top:20px;text-align:center}.summary .card .card-body p,.summary .card .card-body h4{font-size:14px}@media (min-width: 320px) and (max-width: 720px){.primeng-datatable-container .search-filter{display:flex;flex-direction:column;gap:.5rem;justify-content:space-between}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i3$1.JsonPipe, name: "json" }, { kind: "pipe", type: i3$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.SinceAgoPipe, name: "sinceAgo" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SubscriptionsListComponent, selector: "pw-subscriptions-list", viewQueries: [{ propertyName: "refProduct", first: true, predicate: ["refProduct"], descendants: true }, { propertyName: "recoverSubscriptionPasswordModal", first: true, predicate: ["recoverSubscriptionPasswordModal"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div\n    class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Subscriptions</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      [routerLink]=\"[routers.inviteUsers]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Invite a User to a Trial\n    </a>\n  </div>\n</div>\n<div class=\"p-2 mt-3\">\n  <div class=\"w-100 text-center mt-3\">\n    <ng-template [ngIf]=\"!isLoaded\">\n      <p-progressSpinner> </p-progressSpinner>\n    </ng-template>\n  </div>\n  <div class=\"primeng-datatable-container table-responsive mt-0\"\n    [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n    <p-table #dt\n      [value]=\"subscriptions\"\n      [paginator]=\"totalRecords !== 0\"\n      [rows]=\"PAGE_SIZE\"\n      [lazy]=\"true\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        <ng-container *ngIf=\"subscriptionInsights\">\n          <div class=\"row mb-4\">\n            <ng-container *ngFor=\"let temp of objectKeys(subscriptionInsights)\">\n              <div class=\"col-12 col-lg-3 mt-2 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    <ng-container *ngFor=\"let item of subscriptionInsights[temp]\">\n                      <div>\n                        <p class=\"mb-0 px-2\">{{ item?.title }}\n                          <span *ngIf=\"item?.info\"\n                            [pTooltip]=\"item?.info\">\n                            <i class=\"fas fa-info-circle\"></i>\n                          </span>\n                        </p>\n                        <h4 class=\"fw-bold mt-2 mb-2\">\n                          {{ item?.value }}\n                        </h4>\n                      </div>\n                    </ng-container>\n                  </div>\n                </div>\n              </div>\n            </ng-container>\n          </div>\n        </ng-container>\n        <div class=\"search-filter\">\n          <div class=\"col-12 col-sm-4\">\n            <p-multiSelect placeholder=\"Select Feature Keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              [(ngModel)]=\"selectedFeatureKeys\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          <div class=\"col-12 col-sm-4\">\n            <p-dropdown\n              [options]=\"subscriptionStatus\"\n              [placeholder]=\"'Select status'\"\n              (onChange)=\"filterByStatus($event.value)\"\n              [(ngModel)]=\"status\">\n            </p-dropdown>\n          </div>\n          <div class=\"text-end\">\n            <i class=\"fa fa-search mt-2 me-2 d-none\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"30\"\n              placeholder=\"Search Subscription...\"\n              class=\"mw-90\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Subscriptions.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"organisation\">\n            {{ 'Admin.Subscriptions.Organization' | transloco }}\n            <p-sortIcon field=\"organisation\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_name\">\n            {{ 'Admin.Subscriptions.ContactName' | transloco }}\n            <p-sortIcon field=\"contact_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_email\">\n            {{ 'Admin.Subscriptions.ContactEmail' | transloco }}\n            <p-sortIcon field=\"contact_email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Product' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Currency' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.PricePerMonth' | transloco }}</th>\n          <th scope=\"true\"\n            pSortableColumn=\"stripe_customer_id\">\n            {{ 'Admin.Subscriptions.Paid' | transloco }}\n            <p-sortIcon field=\"stripe_customer_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Billing' | transloco }}</th>\n          <th scope=\"true\"\n            class=\"expires-at-width\">\n            {{ 'Admin.Subscriptions.ExpiresAt' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_total\">\n            {{ 'Admin.Subscriptions.SessionsTotal' | transloco }}\n            <p-sortIcon field=\"sessions_total\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"deleted_at\">\n            {{ 'Admin.Subscriptions.Deleted' | transloco }}\n            <p-sortIcon field=\"deleted_at\"></p-sortIcon>\n          </th>\n          <th class=\"actions-list-two\"\n            scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-item>\n        <tr>\n          <td data-head=\"id\">{{ item.id }}</td>\n          <td data-head=\"Organization\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.organisation\"\n              tooltipPosition=\"top\">{{ item.organisation | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"ContactName\"\n            class=\"custom-break-word\">\n            {{ item.contact_name }}\n          </td>\n          <td data-head=\"ContactEmail\">{{ item.contact_email }}</td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n              tooltipPosition=\"top\">{{ item.productName }}</span>\n          </td>\n          <td data-head=\"Currency\">\n            <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n              color=\"blue-grey\"\n              class=\"badge\">{{ item.currency }}</span>\n          </td>\n          <td data-head=\"Price/M\">\n            <span>{{ (item.price / 100).toFixed(2) | currency:item.currency }}\n              <i\n                              class=\"fa fa-info-circle\"\n                              *ngIf=\"item?.discount && objectKeys(item?.discount)?.length\"\n                              aria-hidden=\"true\"\n                              [pTooltip]=\"item?.discount | json\"\n                              tooltipPosition=\"top\"\n                          ></i>\n            </span>\n          </td>\n          <td data-head=\"Paid\">\n            <ng-container *ngIf=\"item?.unsubscribed_at\">\n              <span class=\"badge bg-warning d-inline-flex align-items-center\">\n                Unsub\n                <i class=\"fa fa-info-circle ms-2\"\n                  *ngIf=\"item?.reason_to_cancel\"\n                  [pTooltip]=\"item.reason_to_cancel\"\n                   tooltipPosition=\"top\"\n                   aria-hidden=\"true\"></i>\n              </span>\n            </ng-container>\n            <ng-container *ngIf=\"!item?.unsubscribed_at\">\n              <ng-template [ngIf]=\"(item?.stripe_customer_id || item?.external_payment) && item?.signed_up_at\"\n                [ngIfElse]=\"noBlock\">\n                <span class=\"badge bg-success\">Yes</span>\n              </ng-template>\n              <ng-template #noBlock>\n                <span class=\"badge bg-blue-grey\">No</span>\n              </ng-template>\n            </ng-container>\n            <span *ngIf=\"item?.pause_collection && objectKeys(item?.pause_collection)?.length\"\n              class=\"ms-2\"\n              [pTooltip]=\"item?.pause_collection | json\"\n              tooltipPosition=\"top\">\n              <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n            </span>\n          </td>\n          <td data-head=\"Billing\">\n            <span class=\"badge\"\n              [appDynamicBadge]=\"{\n                              itemsArray: billingFrequency,\n                              item: item?.billingFrequency\n                          }\"\n              color=\"blue-grey\">{{ item.billingFrequency }}</span>\n          </td>\n          <td data-head=\"Expires\">\n            <span [ngClass]=\"getExpiresAtColor(item)\">{{item?.expires_at | dateFormat}}</span><br />\n            <span>{{item?.created_at | sinceAgo}}</span>\n          </td>\n          <td data-head=\"S#\">{{ item?.sessions_total }}</td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': item?.sessions_last_month < 3\n                          }\">{{ item?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Deleted\">\n            <span *ngIf=\"item?.deleted_at\"\n              class=\"badge bg-danger\">Yes</span>\n            <span *ngIf=\"!item?.deleted_at\"\n              class=\"badge bg-blue-grey\">No</span>\n          </td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Edit\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.subscriptionDetails, item.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              <ng-container *ngIf=\"item.deleted; else showDelete\">\n                <li ngbTooltip=\"Reactivate subscription\"\n                    class=\"me-2 me-sm-3\"\n                    *rbacAllow=\"'Pages.Alpha'\"\n                    (keydown.enter)=\"openRecoverSubscriptionModal(item)\"\n                    (click)=\"openRecoverSubscriptionModal(item)\">\n                  <i class=\"fa fa-trash delete-icon text-success\" aria-hidden=\"true\"></i>\n                </li>\n              </ng-container>\n              <ng-template #showDelete>\n                <li ngbTooltip=\"Delete\"\n                    class=\"me-2 me-sm-3\"\n                    *rbacAllow=\"'Pages.Admin.Subscription.Delete'\"\n                    (keydown.enter)=\"onDelete(item)\"\n                    (click)=\"onDelete(item)\">\n                    <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </li>\n              </ng-template>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n    <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n  </div>\n</div>\n<pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionMessage' | transloco\" *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n</pw-no-data>\n<pw-password-validation\n  #recoverSubscriptionPasswordModal\n  (successEvent)=\"onRecoverConfirmed()\">\n</pw-password-validation>\n\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary .card{padding-bottom:0}.summary .card .card-body{padding-top:20px;text-align:center}.summary .card .card-body p,.summary .card .card-body h4{font-size:14px}@media (min-width: 320px) and (max-width: 720px){.primeng-datatable-container .search-filter{display:flex;flex-direction:column;gap:.5rem;justify-content:space-between}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i3$1.JsonPipe, name: "json" }, { kind: "pipe", type: i3$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.SinceAgoPipe, name: "sinceAgo" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SubscriptionsListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-subscriptions-list', template: "<div class=\"row\">\n  <div\n    class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Subscriptions</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      [routerLink]=\"[routers.inviteUsers]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Invite a User to a Trial\n    </a>\n  </div>\n</div>\n<div class=\"p-2 mt-3\">\n  <div class=\"w-100 text-center mt-3\">\n    <ng-template [ngIf]=\"!isLoaded\">\n      <p-progressSpinner> </p-progressSpinner>\n    </ng-template>\n  </div>\n  <div class=\"primeng-datatable-container table-responsive mt-0\"\n    [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n    <p-table #dt\n      [value]=\"subscriptions\"\n      [paginator]=\"totalRecords !== 0\"\n      [rows]=\"PAGE_SIZE\"\n      [lazy]=\"true\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        <ng-container *ngIf=\"subscriptionInsights\">\n          <div class=\"row mb-4\">\n            <ng-container *ngFor=\"let temp of objectKeys(subscriptionInsights)\">\n              <div class=\"col-12 col-lg-3 mt-2 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    <ng-container *ngFor=\"let item of subscriptionInsights[temp]\">\n                      <div>\n                        <p class=\"mb-0 px-2\">{{ item?.title }}\n                          <span *ngIf=\"item?.info\"\n                            [pTooltip]=\"item?.info\">\n                            <i class=\"fas fa-info-circle\"></i>\n                          </span>\n                        </p>\n                        <h4 class=\"fw-bold mt-2 mb-2\">\n                          {{ item?.value }}\n                        </h4>\n                      </div>\n                    </ng-container>\n                  </div>\n                </div>\n              </div>\n            </ng-container>\n          </div>\n        </ng-container>\n        <div class=\"search-filter\">\n          <div class=\"col-12 col-sm-4\">\n            <p-multiSelect placeholder=\"Select Feature Keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              [(ngModel)]=\"selectedFeatureKeys\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          <div class=\"col-12 col-sm-4\">\n            <p-dropdown\n              [options]=\"subscriptionStatus\"\n              [placeholder]=\"'Select status'\"\n              (onChange)=\"filterByStatus($event.value)\"\n              [(ngModel)]=\"status\">\n            </p-dropdown>\n          </div>\n          <div class=\"text-end\">\n            <i class=\"fa fa-search mt-2 me-2 d-none\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"30\"\n              placeholder=\"Search Subscription...\"\n              class=\"mw-90\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Subscriptions.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"organisation\">\n            {{ 'Admin.Subscriptions.Organization' | transloco }}\n            <p-sortIcon field=\"organisation\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_name\">\n            {{ 'Admin.Subscriptions.ContactName' | transloco }}\n            <p-sortIcon field=\"contact_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_email\">\n            {{ 'Admin.Subscriptions.ContactEmail' | transloco }}\n            <p-sortIcon field=\"contact_email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Product' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Currency' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.PricePerMonth' | transloco }}</th>\n          <th scope=\"true\"\n            pSortableColumn=\"stripe_customer_id\">\n            {{ 'Admin.Subscriptions.Paid' | transloco }}\n            <p-sortIcon field=\"stripe_customer_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Billing' | transloco }}</th>\n          <th scope=\"true\"\n            class=\"expires-at-width\">\n            {{ 'Admin.Subscriptions.ExpiresAt' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_total\">\n            {{ 'Admin.Subscriptions.SessionsTotal' | transloco }}\n            <p-sortIcon field=\"sessions_total\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"deleted_at\">\n            {{ 'Admin.Subscriptions.Deleted' | transloco }}\n            <p-sortIcon field=\"deleted_at\"></p-sortIcon>\n          </th>\n          <th class=\"actions-list-two\"\n            scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-item>\n        <tr>\n          <td data-head=\"id\">{{ item.id }}</td>\n          <td data-head=\"Organization\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.organisation\"\n              tooltipPosition=\"top\">{{ item.organisation | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"ContactName\"\n            class=\"custom-break-word\">\n            {{ item.contact_name }}\n          </td>\n          <td data-head=\"ContactEmail\">{{ item.contact_email }}</td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n              tooltipPosition=\"top\">{{ item.productName }}</span>\n          </td>\n          <td data-head=\"Currency\">\n            <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n              color=\"blue-grey\"\n              class=\"badge\">{{ item.currency }}</span>\n          </td>\n          <td data-head=\"Price/M\">\n            <span>{{ (item.price / 100).toFixed(2) | currency:item.currency }}\n              <i\n                              class=\"fa fa-info-circle\"\n                              *ngIf=\"item?.discount && objectKeys(item?.discount)?.length\"\n                              aria-hidden=\"true\"\n                              [pTooltip]=\"item?.discount | json\"\n                              tooltipPosition=\"top\"\n                          ></i>\n            </span>\n          </td>\n          <td data-head=\"Paid\">\n            <ng-container *ngIf=\"item?.unsubscribed_at\">\n              <span class=\"badge bg-warning d-inline-flex align-items-center\">\n                Unsub\n                <i class=\"fa fa-info-circle ms-2\"\n                  *ngIf=\"item?.reason_to_cancel\"\n                  [pTooltip]=\"item.reason_to_cancel\"\n                   tooltipPosition=\"top\"\n                   aria-hidden=\"true\"></i>\n              </span>\n            </ng-container>\n            <ng-container *ngIf=\"!item?.unsubscribed_at\">\n              <ng-template [ngIf]=\"item?.stripe_customer_id || item?.external_payment\"\n                [ngIfElse]=\"noBlock\">\n                <span class=\"badge bg-success\">Yes</span>\n              </ng-template>\n              <ng-template #noBlock>\n                <span class=\"badge bg-blue-grey\">No</span>\n              </ng-template>\n            </ng-container>\n            <span *ngIf=\"item?.pause_collection && objectKeys(item?.pause_collection)?.length\"\n              class=\"ms-2\"\n              [pTooltip]=\"item?.pause_collection | json\"\n              tooltipPosition=\"top\">\n              <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n            </span>\n          </td>\n          <td data-head=\"Billing\">\n            <span class=\"badge\"\n              [appDynamicBadge]=\"{\n                              itemsArray: billingFrequency,\n                              item: item?.billingFrequency\n                          }\"\n              color=\"blue-grey\">{{ item.billingFrequency }}</span>\n          </td>\n          <td data-head=\"Expires\">\n            <span [ngClass]=\"getExpiresAtColor(item)\">{{item?.expires_at | dateFormat}}</span><br />\n            <span>{{item?.created_at | sinceAgo}}</span>\n          </td>\n          <td data-head=\"S#\">{{ item?.sessions_total }}</td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': item?.sessions_last_month < 3\n                          }\">{{ item?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Deleted\">\n            <span *ngIf=\"item?.deleted_at\"\n              class=\"badge bg-danger\">Yes</span>\n            <span *ngIf=\"!item?.deleted_at\"\n              class=\"badge bg-blue-grey\">No</span>\n          </td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Edit\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.subscriptionDetails, item.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              <ng-container *ngIf=\"item.deleted; else showDelete\">\n                <li ngbTooltip=\"Reactivate subscription\"\n                    class=\"me-2 me-sm-3\"\n                    *rbacAllow=\"'Pages.Alpha'\"\n                    (keydown.enter)=\"openRecoverSubscriptionModal(item)\"\n                    (click)=\"openRecoverSubscriptionModal(item)\">\n                  <i class=\"fa fa-trash delete-icon text-success\" aria-hidden=\"true\"></i>\n                </li>\n              </ng-container>\n              <ng-template #showDelete>\n                <li ngbTooltip=\"Delete\"\n                    class=\"me-2 me-sm-3\"\n                    *rbacAllow=\"'Pages.Admin.Subscription.Delete'\"\n                    (keydown.enter)=\"onDelete(item)\"\n                    (click)=\"onDelete(item)\">\n                    <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </li>\n              </ng-template>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n    <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n  </div>\n</div>\n<pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionMessage' | transloco\" *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n</pw-no-data>\n<pw-password-validation\n  #recoverSubscriptionPasswordModal\n  (successEvent)=\"onRecoverConfirmed()\">\n</pw-password-validation>\n\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary .card{padding-bottom:0}.summary .card .card-body{padding-top:20px;text-align:center}.summary .card .card-body p,.summary .card .card-body h4{font-size:14px}@media (min-width: 320px) and (max-width: 720px){.primeng-datatable-container .search-filter{display:flex;flex-direction:column;gap:.5rem;justify-content:space-between}}\n"] }]
+            args: [{ selector: 'pw-subscriptions-list', template: "<div class=\"row\">\n  <div\n    class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Subscriptions</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      [routerLink]=\"[routers.inviteUsers]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Invite a User to a Trial\n    </a>\n  </div>\n</div>\n<div class=\"p-2 mt-3\">\n  <div class=\"w-100 text-center mt-3\">\n    <ng-template [ngIf]=\"!isLoaded\">\n      <p-progressSpinner> </p-progressSpinner>\n    </ng-template>\n  </div>\n  <div class=\"primeng-datatable-container table-responsive mt-0\"\n    [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n    <p-table #dt\n      [value]=\"subscriptions\"\n      [paginator]=\"totalRecords !== 0\"\n      [rows]=\"PAGE_SIZE\"\n      [lazy]=\"true\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        <ng-container *ngIf=\"subscriptionInsights\">\n          <div class=\"row mb-4\">\n            <ng-container *ngFor=\"let temp of objectKeys(subscriptionInsights)\">\n              <div class=\"col-12 col-lg-3 mt-2 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    <ng-container *ngFor=\"let item of subscriptionInsights[temp]\">\n                      <div>\n                        <p class=\"mb-0 px-2\">{{ item?.title }}\n                          <span *ngIf=\"item?.info\"\n                            [pTooltip]=\"item?.info\">\n                            <i class=\"fas fa-info-circle\"></i>\n                          </span>\n                        </p>\n                        <h4 class=\"fw-bold mt-2 mb-2\">\n                          {{ item?.value }}\n                        </h4>\n                      </div>\n                    </ng-container>\n                  </div>\n                </div>\n              </div>\n            </ng-container>\n          </div>\n        </ng-container>\n        <div class=\"search-filter\">\n          <div class=\"col-12 col-sm-4\">\n            <p-multiSelect placeholder=\"Select Feature Keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              [(ngModel)]=\"selectedFeatureKeys\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          <div class=\"col-12 col-sm-4\">\n            <p-dropdown\n              [options]=\"subscriptionStatus\"\n              [placeholder]=\"'Select status'\"\n              (onChange)=\"filterByStatus($event.value)\"\n              [(ngModel)]=\"status\">\n            </p-dropdown>\n          </div>\n          <div class=\"text-end\">\n            <i class=\"fa fa-search mt-2 me-2 d-none\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"30\"\n              placeholder=\"Search Subscription...\"\n              class=\"mw-90\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Subscriptions.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"organisation\">\n            {{ 'Admin.Subscriptions.Organization' | transloco }}\n            <p-sortIcon field=\"organisation\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_name\">\n            {{ 'Admin.Subscriptions.ContactName' | transloco }}\n            <p-sortIcon field=\"contact_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_email\">\n            {{ 'Admin.Subscriptions.ContactEmail' | transloco }}\n            <p-sortIcon field=\"contact_email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Product' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Currency' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.PricePerMonth' | transloco }}</th>\n          <th scope=\"true\"\n            pSortableColumn=\"stripe_customer_id\">\n            {{ 'Admin.Subscriptions.Paid' | transloco }}\n            <p-sortIcon field=\"stripe_customer_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Billing' | transloco }}</th>\n          <th scope=\"true\"\n            class=\"expires-at-width\">\n            {{ 'Admin.Subscriptions.ExpiresAt' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_total\">\n            {{ 'Admin.Subscriptions.SessionsTotal' | transloco }}\n            <p-sortIcon field=\"sessions_total\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"deleted_at\">\n            {{ 'Admin.Subscriptions.Deleted' | transloco }}\n            <p-sortIcon field=\"deleted_at\"></p-sortIcon>\n          </th>\n          <th class=\"actions-list-two\"\n            scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-item>\n        <tr>\n          <td data-head=\"id\">{{ item.id }}</td>\n          <td data-head=\"Organization\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.organisation\"\n              tooltipPosition=\"top\">{{ item.organisation | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"ContactName\"\n            class=\"custom-break-word\">\n            {{ item.contact_name }}\n          </td>\n          <td data-head=\"ContactEmail\">{{ item.contact_email }}</td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n              tooltipPosition=\"top\">{{ item.productName }}</span>\n          </td>\n          <td data-head=\"Currency\">\n            <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n              color=\"blue-grey\"\n              class=\"badge\">{{ item.currency }}</span>\n          </td>\n          <td data-head=\"Price/M\">\n            <span>{{ (item.price / 100).toFixed(2) | currency:item.currency }}\n              <i\n                              class=\"fa fa-info-circle\"\n                              *ngIf=\"item?.discount && objectKeys(item?.discount)?.length\"\n                              aria-hidden=\"true\"\n                              [pTooltip]=\"item?.discount | json\"\n                              tooltipPosition=\"top\"\n                          ></i>\n            </span>\n          </td>\n          <td data-head=\"Paid\">\n            <ng-container *ngIf=\"item?.unsubscribed_at\">\n              <span class=\"badge bg-warning d-inline-flex align-items-center\">\n                Unsub\n                <i class=\"fa fa-info-circle ms-2\"\n                  *ngIf=\"item?.reason_to_cancel\"\n                  [pTooltip]=\"item.reason_to_cancel\"\n                   tooltipPosition=\"top\"\n                   aria-hidden=\"true\"></i>\n              </span>\n            </ng-container>\n            <ng-container *ngIf=\"!item?.unsubscribed_at\">\n              <ng-template [ngIf]=\"(item?.stripe_customer_id || item?.external_payment) && item?.signed_up_at\"\n                [ngIfElse]=\"noBlock\">\n                <span class=\"badge bg-success\">Yes</span>\n              </ng-template>\n              <ng-template #noBlock>\n                <span class=\"badge bg-blue-grey\">No</span>\n              </ng-template>\n            </ng-container>\n            <span *ngIf=\"item?.pause_collection && objectKeys(item?.pause_collection)?.length\"\n              class=\"ms-2\"\n              [pTooltip]=\"item?.pause_collection | json\"\n              tooltipPosition=\"top\">\n              <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n            </span>\n          </td>\n          <td data-head=\"Billing\">\n            <span class=\"badge\"\n              [appDynamicBadge]=\"{\n                              itemsArray: billingFrequency,\n                              item: item?.billingFrequency\n                          }\"\n              color=\"blue-grey\">{{ item.billingFrequency }}</span>\n          </td>\n          <td data-head=\"Expires\">\n            <span [ngClass]=\"getExpiresAtColor(item)\">{{item?.expires_at | dateFormat}}</span><br />\n            <span>{{item?.created_at | sinceAgo}}</span>\n          </td>\n          <td data-head=\"S#\">{{ item?.sessions_total }}</td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': item?.sessions_last_month < 3\n                          }\">{{ item?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Deleted\">\n            <span *ngIf=\"item?.deleted_at\"\n              class=\"badge bg-danger\">Yes</span>\n            <span *ngIf=\"!item?.deleted_at\"\n              class=\"badge bg-blue-grey\">No</span>\n          </td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Edit\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.subscriptionDetails, item.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              <ng-container *ngIf=\"item.deleted; else showDelete\">\n                <li ngbTooltip=\"Reactivate subscription\"\n                    class=\"me-2 me-sm-3\"\n                    *rbacAllow=\"'Pages.Alpha'\"\n                    (keydown.enter)=\"openRecoverSubscriptionModal(item)\"\n                    (click)=\"openRecoverSubscriptionModal(item)\">\n                  <i class=\"fa fa-trash delete-icon text-success\" aria-hidden=\"true\"></i>\n                </li>\n              </ng-container>\n              <ng-template #showDelete>\n                <li ngbTooltip=\"Delete\"\n                    class=\"me-2 me-sm-3\"\n                    *rbacAllow=\"'Pages.Admin.Subscription.Delete'\"\n                    (keydown.enter)=\"onDelete(item)\"\n                    (click)=\"onDelete(item)\">\n                    <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </li>\n              </ng-template>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n    <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n  </div>\n</div>\n<pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionMessage' | transloco\" *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n</pw-no-data>\n<pw-password-validation\n  #recoverSubscriptionPasswordModal\n  (successEvent)=\"onRecoverConfirmed()\">\n</pw-password-validation>\n\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary .card{padding-bottom:0}.summary .card .card-body{padding-top:20px;text-align:center}.summary .card .card-body p,.summary .card .card-body h4{font-size:14px}@media (min-width: 320px) and (max-width: 720px){.primeng-datatable-container .search-filter{display:flex;flex-direction:column;gap:.5rem;justify-content:space-between}}\n"] }]
         }], ctorParameters: () => [{ type: i1$2.ProductService }, { type: i1.AdminService }, { type: i3$2.UntypedFormBuilder }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: i1$2.CommonService }], propDecorators: { refProduct: [{
                 type: ViewChild,
                 args: ['refProduct']
@@ -8002,7 +8002,7 @@ class TagDetailsComponent extends AppBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: TagDetailsComponent, deps: [{ token: i0.Injector }, { token: i1$2.TagService }, { token: i0.ChangeDetectorRef }, { token: i2$1.NgbModal }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: TagDetailsComponent, selector: "pw-tag-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          (click)=\"back()\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n        </a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          {{ currentTag ? 'Edit Tag' : 'Create Tag' }}\n        </h3>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <!-- Tag Name -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.TagName' | transloco\"\n                errorMsg=\"This field is required.\" name=\"name\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"name\" placeholder=\"Tag Name\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Tag Type -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.TagType' | transloco\"\n                errorMsg=\"This field is required.\" name=\"tag_type\">\n                <p-dropdown [options]=\"tagTypes\" formControlName=\"tag_type\"\n                  placeholder=\"Tag Types\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n\n            <!-- Category -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.Category' | transloco\"\n                errorMsg=\"This field is required.\" name=\"tag_category_id\">\n                <p-dropdown [options]=\"tagCategories\" formControlName=\"tag_category_id\"\n                  placeholder=\"Category\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n\n            <!-- Icon Name -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.IconName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Tags.Tooltip.IconName' | transloco\"\n                name=\"icon_name\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"icon_name\" placeholder=\"Icon Name\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Title and Meta Title on same line -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Label.Title' | transloco\" name=\"title\"\n                errorMsg=\"This field is required.\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" placeholder=\"Title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Meta Title -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Meta Title' | transloco\" name=\"meta_title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"meta_title\" placeholder=\"Meta Title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description and Meta Description on same line -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.Description' | transloco\" name=\"description\"\n                errorMsg=\"This field is required.\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\" placeholder=\"Description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Meta Description -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Meta Description' | transloco\" name=\"meta_description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"meta_description\" placeholder=\"Meta Description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Visible In Resources toggle moved to bottom -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Tags.Tooltip.VisibleInResources' | transloco\"\n                [label]=\"'Admin.Tags.VisibleInResources' | transloco\"\n                name=\"visible_in_resources\">\n                <ui-switch class=\"d-block\" formControlName=\"visible_in_resources\"></ui-switch>\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-4 display-grid mt-2 text-center\">\n              <label for=\"tagImage\">{{ 'Admin.Tags.Image' | transloco }}</label>\n              <div class=\"text-center d-flex flex-column align-items-end\">\n                <img [src]=\"image !== null ? image : 'assets/img/resource/blog.png'\"\n                     (click)=\"openModal(imageModal)\"\n                     (keydown.enter)=\"openModal(imageModal)\"\n                     class=\"image cropped-img\"\n                     [ngClass]=\"{ 'w-100': image === null }\"\n                     alt=\"Tag preview\"\n                     (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n                     <div class=\"d-flex justify-content-between align-items-center mt-2\">\n                        <a aria-label=\"Open image cropper\"\n                          class=\"d-inline-block mt-2\"\n                          (click)=\"openModal(imageModal)\">\n                          {{ currentTag ? 'Update' : 'Add' }} Image\n                        </a>\n                        <i\n                        class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n                        title=\"Remove Image\"\n                        (click)=\"deleteTagImage()\"\n                        (keydown.enter)=\"deleteTagImage()\"\n                        *ngIf=\"image && !image.includes('default-photo.jpg') && !image.includes('no_image_uploaded_squared.png')\">\n                        </i>\n                    </div>\n              </div>\n            </div>\n\n            <!-- Image Upload -->\n          </div>\n\n          <div class=\"row text-end mt-4\">\n            <div class=\"col-12\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                [disabled]=\"!form.valid\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Save' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n\n\n<ng-template #imageModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Image</h5>\n    <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload a JPG, GIF, or PNG file. Avoid artwork, celebrities, or copyrighted images.</small>\n    <pw-image-cropper\n      #cropper\n      aspectRatio=\"dynamic\"\n      (imageSelectionEvent)=\"onImageSelected($event)\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: TagDetailsComponent, selector: "pw-tag-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a aria-label=\"Navigate to Target\"\n          (click)=\"back()\"\n          class=\"previous\">\n          <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n        </a>\n        <h3 class=\"m-subheader__title m-subheader__title--separator\">\n          {{ currentTag ? 'Edit Tag' : 'Create Tag' }}\n        </h3>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n          <div class=\"row\">\n            <!-- Tag Name -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.TagName' | transloco\"\n                errorMsg=\"This field is required.\" name=\"name\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"name\" placeholder=\"Tag Name\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Tag Type -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.TagType' | transloco\"\n                errorMsg=\"This field is required.\" name=\"tag_type\">\n                <p-dropdown [options]=\"tagTypes\" formControlName=\"tag_type\"\n                  placeholder=\"Tag Types\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n\n            <!-- Category -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.Category' | transloco\"\n                errorMsg=\"This field is required.\" name=\"tag_category_id\">\n                <p-dropdown [options]=\"tagCategories\" formControlName=\"tag_category_id\"\n                  placeholder=\"Category\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n\n            <!-- Icon Name -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.IconName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Tags.Tooltip.IconName' | transloco\"\n                name=\"icon_name\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"icon_name\" placeholder=\"Icon Name\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Title and Meta Title on same line -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Label.Title' | transloco\" name=\"title\"\n                errorMsg=\"This field is required.\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" placeholder=\"Title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Meta Title -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Meta Title' | transloco\" name=\"meta_title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"meta_title\" placeholder=\"Meta Title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description and Meta Description on same line -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Admin.Tags.Description' | transloco\" name=\"description\"\n                errorMsg=\"This field is required.\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\" placeholder=\"Description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Meta Description -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [label]=\"'Meta Description' | transloco\" name=\"meta_description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"meta_description\" placeholder=\"Meta Description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Visible In Resources toggle moved to bottom -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Tags.Tooltip.VisibleInResources' | transloco\"\n                [label]=\"'Admin.Tags.VisibleInResources' | transloco\"\n                name=\"visible_in_resources\">\n                <ui-switch class=\"d-block\" formControlName=\"visible_in_resources\"></ui-switch>\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-4 display-grid mt-2 text-center\">\n              <label for=\"tagImage\">{{ 'Admin.Tags.Image' | transloco }}</label>\n              <div class=\"text-center d-flex flex-column align-items-end\">\n                <img [src]=\"image !== null ? image : 'assets/img/resource/blog.png'\"\n                     (click)=\"openModal(imageModal)\"\n                     (keydown.enter)=\"openModal(imageModal)\"\n                     class=\"image cropped-img\"\n                     [ngClass]=\"{ 'w-100': image === null }\"\n                     alt=\"Tag preview\"\n                     (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n                     <div class=\"d-flex justify-content-between align-items-center mt-2\">\n                        <a aria-label=\"Open image cropper\"\n                          class=\"d-inline-block mt-2\"\n                          (click)=\"openModal(imageModal)\">\n                          {{ currentTag ? 'Update' : 'Add' }} Image\n                        </a>\n                        <i\n                        class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n                        title=\"Remove Image\"\n                        (click)=\"deleteTagImage()\"\n                        (keydown.enter)=\"deleteTagImage()\"\n                        *ngIf=\"image && !image.includes('default-photo.jpg') && !image.includes('no_image_uploaded_squared.png')\">\n                        </i>\n                    </div>\n              </div>\n            </div>\n\n            <!-- Image Upload -->\n          </div>\n\n          <div class=\"row text-end mt-4\">\n            <div class=\"col-12\">\n              <button type=\"button\"\n                class=\"btn btn-outline-default me-2\"\n                (click)=\"back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                [disabled]=\"!form.valid\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Save' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n\n\n<ng-template #imageModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Image</h5>\n    <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload a JPG, GIF, or PNG file. Avoid artwork, celebrities, or copyrighted images.</small>\n    <pw-image-cropper\n      #cropper\n      aspectRatio=\"dynamic\"\n      (imageSelectionEvent)=\"onImageSelected($event)\"\n      (closeEvent)=\"onClose()\">\n    </pw-image-cropper>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i7.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i7.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: TagDetailsComponent, decorators: [{
             type: Component,
@@ -8643,7 +8643,7 @@ class AhoyEventsComponent extends AppBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AhoyEventsComponent, deps: [{ token: i0.Injector }, { token: i2$1.NgbModal }, { token: i1$2.AhoyService }, { token: i1.AdminDataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AhoyEventsComponent, selector: "pw-ahoy-events", viewQueries: [{ propertyName: "multiSelector", first: true, predicate: ["multiSelector"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Ahoy Events</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.events\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [sortField]=\"defaultSortField\"\n      [sortOrder]=\"defaultSortOrder\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n            <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-multiSelect #multiSelector [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter by users\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\"\n              [lazy]=\"true\"\n              (scroll)=\"onScroll($event)\"\n              (onPanelShow)=\"onPanelShow()\"\n              [loading]=\"userLoading\"\n              (onFilter)=\"handleFilter($event)\"\n              >\n            </p-multiSelect>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Events...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"name\">\n            {{ 'Label.Name' | transloco }}\n            <p-sortIcon field=\"name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">\n            {{ 'Admin.Tracking.Properties' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"time\">\n            {{ 'Admin.Tracking.Time' | transloco }}\n            <p-sortIcon field=\"time\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"user_id\">\n            {{ 'Admin.Tracking.User' | transloco }}\n            <p-sortIcon field=\"user_id\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-event>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"Name\">{{ event.name }}</td>\n          <td data-head=\"Properties\">\n            <span *ngIf=\"(event?.properties | json) !== '{}'\" class=\"badge bg-info cursor-pointer\"\n              (click)=\"revealProp(objModal,event?.properties)\" (keydown.enter)=\"revealProp(objModal,event?.properties)\">Reveal properties</span></td>\n          <td data-head=\"Time\">{{ event.time | dateFormat: 'datetime'}}</td>\n          <td data-head=\"User\">\n            <span *ngIf=\"event?.user_id\">\n              <span *ngIf=\"event?.user\"><a [routerLink]=\"['/members', event?.user?.slug]\">{{ event?.user?.first_name }} {{ event?.user?.last_name }}</a></span>\n              <span *ngIf=\"!event?.user\">{{ event?.user_id }}</span>\n            </span>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoEventsDataMessage' | transloco\"> </pw-no-data>\n</div>\n<!-- Object Modal -->\n<ng-template #objModal\n  let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"modal-title\">{{ 'Admin.Tracking.Properties' | transloco }}</h4>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <div *ngIf=\"activeObject\">\n      <ngx-json-viewer [json]=\"activeObject\"\n        [expanded]=\"false\"></ngx-json-viewer>\n    </div>\n  </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i9$1.NgxJsonViewerComponent, selector: "ngx-json-viewer", inputs: ["json", "expanded", "depth", "_currentDepth"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i3$1.JsonPipe, name: "json" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AhoyEventsComponent, selector: "pw-ahoy-events", viewQueries: [{ propertyName: "multiSelector", first: true, predicate: ["multiSelector"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Ahoy Events</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.events\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [sortField]=\"defaultSortField\"\n      [sortOrder]=\"defaultSortOrder\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n            <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-multiSelect #multiSelector [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter by users\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\"\n              [lazy]=\"true\"\n              (scroll)=\"onScroll($event)\"\n              (onPanelShow)=\"onPanelShow()\"\n              [loading]=\"userLoading\"\n              (onFilter)=\"handleFilter($event)\"\n              >\n            </p-multiSelect>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Events...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"name\">\n            {{ 'Label.Name' | transloco }}\n            <p-sortIcon field=\"name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">\n            {{ 'Admin.Tracking.Properties' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"time\">\n            {{ 'Admin.Tracking.Time' | transloco }}\n            <p-sortIcon field=\"time\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"user_id\">\n            {{ 'Admin.Tracking.User' | transloco }}\n            <p-sortIcon field=\"user_id\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-event>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"Name\">{{ event.name }}</td>\n          <td data-head=\"Properties\">\n            <span *ngIf=\"(event?.properties | json) !== '{}'\" class=\"badge bg-info cursor-pointer\"\n              (click)=\"revealProp(objModal,event?.properties)\" (keydown.enter)=\"revealProp(objModal,event?.properties)\">Reveal properties</span></td>\n          <td data-head=\"Time\">{{ event.time | dateFormat: 'datetime'}}</td>\n          <td data-head=\"User\">\n            <span *ngIf=\"event?.user_id\">\n              <span *ngIf=\"event?.user\"><a [routerLink]=\"['/members', event?.user?.slug]\">{{ event?.user?.first_name }} {{ event?.user?.last_name }}</a></span>\n              <span *ngIf=\"!event?.user\">{{ event?.user_id }}</span>\n            </span>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoEventsDataMessage' | transloco\"> </pw-no-data>\n</div>\n<!-- Object Modal -->\n<ng-template #objModal\n  let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"modal-title\">{{ 'Admin.Tracking.Properties' | transloco }}</h4>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <div *ngIf=\"activeObject\">\n      <ngx-json-viewer [json]=\"activeObject\"\n        [expanded]=\"false\"></ngx-json-viewer>\n    </div>\n  </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i9$1.NgxJsonViewerComponent, selector: "ngx-json-viewer", inputs: ["json", "expanded", "depth", "_currentDepth"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i3$1.JsonPipe, name: "json" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AhoyEventsComponent, decorators: [{
             type: Component,
@@ -8823,7 +8823,7 @@ class AhoyMessagesComponent extends AppBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AhoyMessagesComponent, deps: [{ token: i0.Injector }, { token: i1$2.AhoyService }, { token: i0.ChangeDetectorRef }, { token: i1.AdminDataService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AhoyMessagesComponent, selector: "pw-ahoy-messages", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Ahoy Messages</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.messages\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [sortField]=\"'sent_at'\"\n      [sortOrder]=\"-1\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n          <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-multiSelect #multiSelector [options]=\"searchOptions\"\n            (onChange)=\"onSearchOptionChange($event)\"\n            placeholder=\"Filter by users\"\n            [(ngModel)]=\"filterSource\"\n            [showToggleAll]=\"true\"\n            [showHeader]=\"true\"\n            appendTo=\"body\"\n            [lazy]=\"true\"\n            (scroll)=\"onScroll($event)\"\n            (onPanelShow)=\"onPanelShow()\"\n            [loading]=\"userLoading\"\n            (onFilter)=\"handleFilter($event)\"\n            >\n          </p-multiSelect>\n          </div>\n          <div class=\"col-sm-2 mx-3\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Messages...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"mailer\">\n            {{ 'Admin.Tracking.Mailer' | transloco }}\n            <p-sortIcon field=\"mailer\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sent_at\">\n            {{ 'Admin.Tracking.SentAt' | transloco }}\n            <p-sortIcon field=\"sent_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"subject\">\n            {{ 'Admin.Tracking.Subject' | transloco }}\n            <p-sortIcon field=\"subject\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"to\">\n            {{ 'Admin.Tracking.To' | transloco }}\n            <p-sortIcon field=\"to\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"user_id\">\n            {{ 'Admin.Tracking.User' | transloco }}\n            <p-sortIcon field=\"user_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"clicked_at\">\n            {{ 'Admin.Tracking.LastClickedAt' | transloco }}\n            <p-sortIcon field=\"clicked_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"opened_at\">\n            {{ 'Admin.Tracking.LastOpenedAt' | transloco }}\n            <p-sortIcon field=\"opened_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"click_count\">\n            {{ 'Admin.Tracking.ClickCount' | transloco }}\n            <p-sortIcon field=\"click_count\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"open_count\">\n            {{ 'Admin.Tracking.OpenCount' | transloco }}\n            <p-sortIcon field=\"open_count\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-messages>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"Mailer\">{{ messages.mailer }}</td>\n          <td data-head=\"Sent At\">{{ messages.sent_at | dateFormat: 'datetime' }}</td>\n          <td data-head=\"Subject\">{{ messages.subject | textTruncate: 30 }}</td>\n          <td data-head=\"To\">{{ messages.to }}</td>\n          <td data-head=\"User\">\n            <span *ngIf=\"messages?.user_id\">\n              <span *ngIf=\"messages?.user\"><a [routerLink]=\"['/members', messages?.user?.slug]\">{{ messages?.user?.first_name }} {{ messages?.user?.last_name }}</a></span>\n              <span *ngIf=\"!messages?.user\">{{ messages?.user_id }}</span>\n            </span>\n          </td>\n          <td data-head=\"Last Clicked At\">\n            {{ messages?.clicked_at | dateFormat: 'datetime' }}\n          </td>\n          <td data-head=\"Last Opened At\">\n            {{ messages?.opened_at | dateFormat: 'datetime' }}\n          </td>\n          <td data-head=\"Click Count\">{{ messages?.click_count }}</td>\n          <td data-head=\"Open Count\">{{ messages?.open_count }}</td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoMessagesDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AhoyMessagesComponent, selector: "pw-ahoy-messages", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Ahoy Messages</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.messages\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [sortField]=\"'sent_at'\"\n      [sortOrder]=\"-1\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n          <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-multiSelect #multiSelector [options]=\"searchOptions\"\n            (onChange)=\"onSearchOptionChange($event)\"\n            placeholder=\"Filter by users\"\n            [(ngModel)]=\"filterSource\"\n            [showToggleAll]=\"true\"\n            [showHeader]=\"true\"\n            appendTo=\"body\"\n            [lazy]=\"true\"\n            (scroll)=\"onScroll($event)\"\n            (onPanelShow)=\"onPanelShow()\"\n            [loading]=\"userLoading\"\n            (onFilter)=\"handleFilter($event)\"\n            >\n          </p-multiSelect>\n          </div>\n          <div class=\"col-sm-2 mx-3\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Messages...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"mailer\">\n            {{ 'Admin.Tracking.Mailer' | transloco }}\n            <p-sortIcon field=\"mailer\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sent_at\">\n            {{ 'Admin.Tracking.SentAt' | transloco }}\n            <p-sortIcon field=\"sent_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"subject\">\n            {{ 'Admin.Tracking.Subject' | transloco }}\n            <p-sortIcon field=\"subject\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"to\">\n            {{ 'Admin.Tracking.To' | transloco }}\n            <p-sortIcon field=\"to\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"user_id\">\n            {{ 'Admin.Tracking.User' | transloco }}\n            <p-sortIcon field=\"user_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"clicked_at\">\n            {{ 'Admin.Tracking.LastClickedAt' | transloco }}\n            <p-sortIcon field=\"clicked_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"opened_at\">\n            {{ 'Admin.Tracking.LastOpenedAt' | transloco }}\n            <p-sortIcon field=\"opened_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"click_count\">\n            {{ 'Admin.Tracking.ClickCount' | transloco }}\n            <p-sortIcon field=\"click_count\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"open_count\">\n            {{ 'Admin.Tracking.OpenCount' | transloco }}\n            <p-sortIcon field=\"open_count\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-messages>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"Mailer\">{{ messages.mailer }}</td>\n          <td data-head=\"Sent At\">{{ messages.sent_at | dateFormat: 'datetime' }}</td>\n          <td data-head=\"Subject\">{{ messages.subject | textTruncate: 30 }}</td>\n          <td data-head=\"To\">{{ messages.to }}</td>\n          <td data-head=\"User\">\n            <span *ngIf=\"messages?.user_id\">\n              <span *ngIf=\"messages?.user\"><a [routerLink]=\"['/members', messages?.user?.slug]\">{{ messages?.user?.first_name }} {{ messages?.user?.last_name }}</a></span>\n              <span *ngIf=\"!messages?.user\">{{ messages?.user_id }}</span>\n            </span>\n          </td>\n          <td data-head=\"Last Clicked At\">\n            {{ messages?.clicked_at | dateFormat: 'datetime' }}\n          </td>\n          <td data-head=\"Last Opened At\">\n            {{ messages?.opened_at | dateFormat: 'datetime' }}\n          </td>\n          <td data-head=\"Click Count\">{{ messages?.click_count }}</td>\n          <td data-head=\"Open Count\">{{ messages?.open_count }}</td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoMessagesDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AhoyMessagesComponent, decorators: [{
             type: Component,
@@ -8997,7 +8997,7 @@ class AhoyVisitsComponent extends AppBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AhoyVisitsComponent, deps: [{ token: i0.Injector }, { token: i1$2.AhoyService }, { token: i1.AdminDataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AhoyVisitsComponent, selector: "pw-ahoy-visits", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Ahoy Visits</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.visits\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [sortField]=\"'started_at'\"\n      [sortOrder]=\"-1\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n            <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n            <div class=\"col-sm-2\">\n              <p-multiSelect #multiSelector [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter by users\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\"\n              [lazy]=\"true\"\n              (scroll)=\"onScroll($event)\"\n              (onPanelShow)=\"onPanelShow()\"\n              [loading]=\"userLoading\"\n              (onFilter)=\"handleFilter($event)\"\n            >\n          </p-multiSelect>\n            </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"yy-M-dd\"\n              >\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"yy-M-dd\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Visits...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"browser\">\n            {{ 'Admin.Tracking.Browser' | transloco }}\n            <p-sortIcon field=\"browser\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"device_type\">\n            {{ 'Admin.Tracking.DeviceType' | transloco }}\n            <p-sortIcon field=\"device_type\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"ip\">\n            {{ 'Admin.Tracking.Ip' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"referring_domain\">\n            {{ 'Admin.Tracking.Domain' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"landing_page\">\n            {{ 'Admin.Tracking.LandingPage' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"country\">\n            {{ 'Admin.Tracking.Country' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"region\">\n            {{ 'Admin.Tracking.Region' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"city\">\n            {{ 'Admin.Tracking.City' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"os\">\n            {{ 'Admin.Tracking.Os' | transloco }}\n            <p-sortIcon field=\"os\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">\n            {{ 'Admin.Tracking.User' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"started_at\">\n            {{ 'Admin.Tracking.StartedAt' | transloco }}\n            <p-sortIcon field=\"started_at\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-visits>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"Browser\">{{ visits.browser }}</td>\n          <td data-head=\"Device Type\">{{ visits.device_type }}</td>\n          <td data-head=\"IP\">{{ visits.ip }}</td>\n          <td data-head=\"referring_domain\">\n            <span [ngbTooltip]=\"visits.referring_domain\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.referring_domain | textTruncate: 20 }}\n            </span>\n          </td>\n          <td data-head=\"landing_page\">\n            <span [ngbTooltip]=\"visits.landing_page\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.landing_page | textTruncate: 20 }}\n            </span>\n           </td>\n          <td data-head=\"country\">\n            <span [ngbTooltip]=\"visits.country\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.country | textTruncate: 20 }}\n            </span>\n          </td>\n          <td data-head=\"region\">\n            <span [ngbTooltip]=\"visits.region\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.region | textTruncate: 20 }}\n            </span>\n          </td>\n          <td data-head=\"city\">\n            <span [ngbTooltip]=\"visits.city\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.city | textTruncate: 20 }}\n            </span></td>\n          <td data-head=\"OS\">{{ visits.os }}</td>\n          <td data-head=\"User\">\n            <span *ngIf=\"visits?.user_id\">\n              <span *ngIf=\"visits?.user\"><a [routerLink]=\"['/members', visits?.user?.slug]\">{{ visits?.user?.first_name }} {{ visits?.user?.last_name }}</a></span>\n              <span *ngIf=\"!visits?.user\">{{ visits?.user_id }}</span>\n            </span>\n          </td>\n          <td data-head=\"Started At\">{{ visits.started_at | dateFormat : 'datetime' }}</td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoVistitsDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td,.table-responsive th{font-size:11px!important}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AhoyVisitsComponent, selector: "pw-ahoy-visits", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Ahoy Visits</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.visits\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [sortField]=\"'started_at'\"\n      [sortOrder]=\"-1\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n            <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n            <div class=\"col-sm-2\">\n              <p-multiSelect #multiSelector [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter by users\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\"\n              [lazy]=\"true\"\n              (scroll)=\"onScroll($event)\"\n              (onPanelShow)=\"onPanelShow()\"\n              [loading]=\"userLoading\"\n              (onFilter)=\"handleFilter($event)\"\n            >\n          </p-multiSelect>\n            </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"yy-M-dd\"\n              >\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"yy-M-dd\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Visits...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"browser\">\n            {{ 'Admin.Tracking.Browser' | transloco }}\n            <p-sortIcon field=\"browser\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"device_type\">\n            {{ 'Admin.Tracking.DeviceType' | transloco }}\n            <p-sortIcon field=\"device_type\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"ip\">\n            {{ 'Admin.Tracking.Ip' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"referring_domain\">\n            {{ 'Admin.Tracking.Domain' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"landing_page\">\n            {{ 'Admin.Tracking.LandingPage' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"country\">\n            {{ 'Admin.Tracking.Country' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"region\">\n            {{ 'Admin.Tracking.Region' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"city\">\n            {{ 'Admin.Tracking.City' | transloco }}\n            <p-sortIcon field=\"ip\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"os\">\n            {{ 'Admin.Tracking.Os' | transloco }}\n            <p-sortIcon field=\"os\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">\n            {{ 'Admin.Tracking.User' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"started_at\">\n            {{ 'Admin.Tracking.StartedAt' | transloco }}\n            <p-sortIcon field=\"started_at\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-visits>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"Browser\">{{ visits.browser }}</td>\n          <td data-head=\"Device Type\">{{ visits.device_type }}</td>\n          <td data-head=\"IP\">{{ visits.ip }}</td>\n          <td data-head=\"referring_domain\">\n            <span [ngbTooltip]=\"visits.referring_domain\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.referring_domain | textTruncate: 20 }}\n            </span>\n          </td>\n          <td data-head=\"landing_page\">\n            <span [ngbTooltip]=\"visits.landing_page\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.landing_page | textTruncate: 20 }}\n            </span>\n           </td>\n          <td data-head=\"country\">\n            <span [ngbTooltip]=\"visits.country\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.country | textTruncate: 20 }}\n            </span>\n          </td>\n          <td data-head=\"region\">\n            <span [ngbTooltip]=\"visits.region\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.region | textTruncate: 20 }}\n            </span>\n          </td>\n          <td data-head=\"city\">\n            <span [ngbTooltip]=\"visits.city\"\n              tooltipClass=\"custom-tooltip\"\n              placement=\"top\"  container=\"body\"> {{ visits.city | textTruncate: 20 }}\n            </span></td>\n          <td data-head=\"OS\">{{ visits.os }}</td>\n          <td data-head=\"User\">\n            <span *ngIf=\"visits?.user_id\">\n              <span *ngIf=\"visits?.user\"><a [routerLink]=\"['/members', visits?.user?.slug]\">{{ visits?.user?.first_name }} {{ visits?.user?.last_name }}</a></span>\n              <span *ngIf=\"!visits?.user\">{{ visits?.user_id }}</span>\n            </span>\n          </td>\n          <td data-head=\"Started At\">{{ visits.started_at | dateFormat : 'datetime' }}</td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoVistitsDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td,.table-responsive th{font-size:11px!important}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AhoyVisitsComponent, decorators: [{
             type: Component,
@@ -9172,7 +9172,7 @@ class EventsComponent extends AppBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: EventsComponent, deps: [{ token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1$2.AhoyService }, { token: i1.AdminDataService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: EventsComponent, selector: "pw-events", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Events</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.events\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n            <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-multiSelect #multiSelector [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter by users\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\"\n              [lazy]=\"true\"\n              (scroll)=\"onScroll($event)\"\n              (onPanelShow)=\"onPanelShow()\"\n              [loading]=\"userLoading\"\n              (onFilter)=\"handleFilter($event)\"\n            >\n            </p-multiSelect>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Events...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"created_at\">\n            {{ 'Admin.Tracking.CreatedAt' | transloco }}\n            <p-sortIcon field=\"created_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"event_type\">\n            {{ 'Admin.Tracking.EventType' | transloco }}\n            <p-sortIcon field=\"event_type\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"related_entity_type\">\n            {{ 'Admin.Tracking.EntityType' | transloco }}\n            <p-sortIcon field=\"related_entity_type\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"updated_at\">\n            {{ 'Admin.Tracking.UpdatedAt' | transloco }}\n            <p-sortIcon field=\"updated_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"user_id\">\n            {{ 'Admin.Tracking.User' | transloco }}\n            <p-sortIcon field=\"user_id\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-events>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"Created At\">{{ events.created_at | dateFormat: 'datetime' }}</td>\n          <td data-head=\"Event Type\">{{ events.event_type }}</td>\n          <td data-head=\"Entity Type\">{{ events.related_entity_type }}</td>\n          <td data-head=\"Updated At\">{{ events.updated_at | dateFormat : 'datetime'}}</td>\n          <td data-head=\"User\">\n            <span *ngIf=\"events?.user_id\">\n              <span *ngIf=\"events?.user\"><a [routerLink]=\"['/members', events?.user?.slug]\">{{ events?.user?.first_name }} {{ events?.user?.last_name }}</a></span>\n              <span *ngIf=\"!events?.user\">{{ events?.user_id }}</span>\n            </span>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoEventDataMessage' | transloco\"> </pw-no-data>\n</div>", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: EventsComponent, selector: "pw-events", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Events</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.events\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n            <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-multiSelect #multiSelector [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter by users\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\"\n              [lazy]=\"true\"\n              (scroll)=\"onScroll($event)\"\n              (onPanelShow)=\"onPanelShow()\"\n              [loading]=\"userLoading\"\n              (onFilter)=\"handleFilter($event)\"\n            >\n            </p-multiSelect>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Events...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"created_at\">\n            {{ 'Admin.Tracking.CreatedAt' | transloco }}\n            <p-sortIcon field=\"created_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"event_type\">\n            {{ 'Admin.Tracking.EventType' | transloco }}\n            <p-sortIcon field=\"event_type\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"related_entity_type\">\n            {{ 'Admin.Tracking.EntityType' | transloco }}\n            <p-sortIcon field=\"related_entity_type\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"updated_at\">\n            {{ 'Admin.Tracking.UpdatedAt' | transloco }}\n            <p-sortIcon field=\"updated_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"user_id\">\n            {{ 'Admin.Tracking.User' | transloco }}\n            <p-sortIcon field=\"user_id\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-events>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"Created At\">{{ events.created_at | dateFormat: 'datetime' }}</td>\n          <td data-head=\"Event Type\">{{ events.event_type }}</td>\n          <td data-head=\"Entity Type\">{{ events.related_entity_type }}</td>\n          <td data-head=\"Updated At\">{{ events.updated_at | dateFormat : 'datetime'}}</td>\n          <td data-head=\"User\">\n            <span *ngIf=\"events?.user_id\">\n              <span *ngIf=\"events?.user\"><a [routerLink]=\"['/members', events?.user?.slug]\">{{ events?.user?.first_name }} {{ events?.user?.last_name }}</a></span>\n              <span *ngIf=\"!events?.user\">{{ events?.user_id }}</span>\n            </span>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoEventDataMessage' | transloco\"> </pw-no-data>\n</div>", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: EventsComponent, decorators: [{
             type: Component,
@@ -9400,7 +9400,7 @@ class VersionsComponent extends AppBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: VersionsComponent, deps: [{ token: i0.Injector }, { token: i1$2.AhoyService }, { token: i2$1.NgbModal }, { token: i1.AdminDataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: VersionsComponent, selector: "pw-versions", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Versions</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.versions\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n            <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-multiSelect #multiSelector [options]=\"searchOptions\"\n            (onChange)=\"onSearchOptionChange($event)\"\n            placeholder=\"Filter by users\"\n            [(ngModel)]=\"filterSource\"\n            [showToggleAll]=\"true\"\n            [showHeader]=\"true\"\n            appendTo=\"body\"\n            [lazy]=\"true\"\n            (scroll)=\"onScroll($event)\"\n            (onPanelShow)=\"onPanelShow()\"\n            [loading]=\"userLoading\"\n            (onFilter)=\"handleFilter($event)\"\n          >\n            </p-multiSelect>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2 \">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Versions...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"author\">\n            {{ 'Admin.Tracking.User' | transloco }}\n            <p-sortIcon field=\"author\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"created_at\">\n            {{ 'Admin.Tracking.CreatedAt' | transloco }}\n            <p-sortIcon field=\"created_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"event\">\n            {{ 'Admin.Tracking.Event' | transloco }}\n            <p-sortIcon field=\"event\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"item_type\">\n            {{ 'Admin.Tracking.ItemType' | transloco }}\n            <p-sortIcon field=\"item_type\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"item_id\">\n            {{ 'Admin.Tracking.ItemId' | transloco }}\n            <p-sortIcon field=\"item_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"object\">\n            {{ 'Admin.Tracking.Object' | transloco }}\n            <p-sortIcon field=\"object\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"updated_at\">\n            {{ 'Admin.Tracking.UpdatedAt' | transloco }}\n            <p-sortIcon field=\"updated_at\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-version>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"User\">\n            <span *ngIf=\"version?.author\"><a [routerLink]=\"['/members', version?.author?.slug]\">{{ version?.author?.first_name }}\n                {{ version?.author?.last_name }}</a></span>\n            <span *ngIf=\"!version?.author && version?.whoDoneIt\">{{\n                            version?.whoDoneIt\n                        }}</span>\n          </td>\n          <td data-head=\"Created At\">{{ version.created_at | dateFormat: 'datetime' }}</td>\n          <td data-head=\"Event\">\n            <span class=\"badge\"\n              color=\"warning\"\n              [appDynamicBadge]=\"{\n                                        itemsArray: events,\n                                        item: version?.event\n                                    }\">{{version?.event}}</span>\n          </td>\n          <td data-head=\"Item Type\">{{ version.item_type }}</td>\n          <td data-head=\"Item Id\">{{ version.item_id }}</td>\n          <td data-head=\"Object\">\n            <span (click)=\"openObjectModal(objModal, version?.object)\"\n                  (keydown.enter)=\"openObjectModal(objModal, version?.object)\"\n              class=\"badge bg-info cursor-pointer\">Open Object</span>\n          </td>\n          <td data-head=\"Updated At\">{{ version.updated_at | dateFormat: 'datetime' }}</td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoVersionsDataMessage' | transloco\"> </pw-no-data>\n</div>\n<!-- Object Modal -->\n<ng-template #objModal\n  let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"modal-title\">{{ 'Admin.Tracking.Object' | transloco }}</h4>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <div *ngIf=\"activeObject\">\n      <ngx-json-viewer [json]=\"activeObject\"\n        [expanded]=\"false\"></ngx-json-viewer>\n    </div>\n  </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i9$1.NgxJsonViewerComponent, selector: "ngx-json-viewer", inputs: ["json", "expanded", "depth", "_currentDepth"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: VersionsComponent, selector: "pw-versions", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Versions</h2>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"data.versions\"\n      [paginator]=\"data.object_count !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"data.object_count\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"row\">\n          <div *rbacAllow=\"'SuperAdmin'\"\n            class=\"col-sm-2 mb-2 mb-md-0\">\n            <p-dropdown\n              [options]=\"microServices\"\n              (onChange)=\"onServiceChange($event.value)\"\n              [placeholder]=\"'Select Service'\"\n              optionLabel=\"name\"\n              optionValue=\"name\">\n            </p-dropdown>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-multiSelect #multiSelector [options]=\"searchOptions\"\n            (onChange)=\"onSearchOptionChange($event)\"\n            placeholder=\"Filter by users\"\n            [(ngModel)]=\"filterSource\"\n            [showToggleAll]=\"true\"\n            [showHeader]=\"true\"\n            appendTo=\"body\"\n            [lazy]=\"true\"\n            (scroll)=\"onScroll($event)\"\n            (onPanelShow)=\"onPanelShow()\"\n            [loading]=\"userLoading\"\n            (onFilter)=\"handleFilter($event)\"\n          >\n            </p-multiSelect>\n          </div>\n          <div class=\"col-sm-2\">\n            <p-calendar [showTime]=\"true\"\n              [appendTo]=\"'body'\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'Start Date'\"\n              [(ngModel)]=\"startDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col-sm-2 \">\n            <p-calendar [appendTo]=\"'body'\"\n              [showTime]=\"true\"\n              (onSelect)=\"onDateSelection()\"\n              [placeholder]=\"'End Date'\"\n              [(ngModel)]=\"endDate\"\n              [showIcon]=\"true\"\n              dateFormat=\"dd-M-yy\">\n            </p-calendar>\n          </div>\n          <div class=\"col d-flex align-items-center\">\n            <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"50\"\n              placeholder=\"Search Versions...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n              class=\"mw-90 form-control bg-white\" />\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"author\">\n            {{ 'Admin.Tracking.User' | transloco }}\n            <p-sortIcon field=\"author\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"created_at\">\n            {{ 'Admin.Tracking.CreatedAt' | transloco }}\n            <p-sortIcon field=\"created_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"event\">\n            {{ 'Admin.Tracking.Event' | transloco }}\n            <p-sortIcon field=\"event\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"item_type\">\n            {{ 'Admin.Tracking.ItemType' | transloco }}\n            <p-sortIcon field=\"item_type\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"item_id\">\n            {{ 'Admin.Tracking.ItemId' | transloco }}\n            <p-sortIcon field=\"item_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"object\">\n            {{ 'Admin.Tracking.Object' | transloco }}\n            <p-sortIcon field=\"object\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"updated_at\">\n            {{ 'Admin.Tracking.UpdatedAt' | transloco }}\n            <p-sortIcon field=\"updated_at\"></p-sortIcon>\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-version>\n        <tr [class.d-none]=\"loading\">\n          <td data-head=\"User\">\n            <span *ngIf=\"version?.author\"><a [routerLink]=\"['/members', version?.author?.slug]\">{{ version?.author?.first_name }}\n                {{ version?.author?.last_name }}</a></span>\n            <span *ngIf=\"!version?.author && version?.whoDoneIt\">{{\n                            version?.whoDoneIt\n                        }}</span>\n          </td>\n          <td data-head=\"Created At\">{{ version.created_at | dateFormat: 'datetime' }}</td>\n          <td data-head=\"Event\">\n            <span class=\"badge\"\n              color=\"warning\"\n              [appDynamicBadge]=\"{\n                                        itemsArray: events,\n                                        item: version?.event\n                                    }\">{{version?.event}}</span>\n          </td>\n          <td data-head=\"Item Type\">{{ version.item_type }}</td>\n          <td data-head=\"Item Id\">{{ version.item_id }}</td>\n          <td data-head=\"Object\">\n            <span (click)=\"openObjectModal(objModal, version?.object)\"\n                  (keydown.enter)=\"openObjectModal(objModal, version?.object)\"\n              class=\"badge bg-info cursor-pointer\">Open Object</span>\n          </td>\n          <td data-head=\"Updated At\">{{ version.updated_at | dateFormat: 'datetime' }}</td>\n        </tr>\n      </ng-template>\n    </p-table>\n    <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n      </pw-no-data>\n    </div>\n    <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoVersionsDataMessage' | transloco\"> </pw-no-data>\n</div>\n<!-- Object Modal -->\n<ng-template #objModal\n  let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"modal-title\">{{ 'Admin.Tracking.Object' | transloco }}</h4>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <div *ngIf=\"activeObject\">\n      <ngx-json-viewer [json]=\"activeObject\"\n        [expanded]=\"false\"></ngx-json-viewer>\n    </div>\n  </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 767px){.table-responsive td,.table-responsive th{font-size:11px!important}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i9$1.NgxJsonViewerComponent, selector: "ngx-json-viewer", inputs: ["json", "expanded", "depth", "_currentDepth"] }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i7.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i7.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: VersionsComponent, decorators: [{
             type: Component,