@posiwise/admin-module 0.0.238 → 0.0.239

package/fesm2022/posiwise-admin-module.mjs

@@ -3,7 +3,7 @@ import { CommonModule, DatePipe } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Component, ViewChild, ViewChildren, SecurityContext, ViewEncapsulation, EventEmitter, Output, Pipe, ChangeDetectionStrategy, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable } from '@angular/core';
 import * as i3$1 from '@angular/forms';
-import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { Validators, UntypedFormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i13$2 from '@angular-magic/ngx-gp-autocomplete';
 import { NgxGpAutocompleteModule } from '@angular-magic/ngx-gp-autocomplete';
 import * as i1 from '@posiwise/admin-module-utils';
@@ -7618,7 +7618,10 @@ class SubscriptionDetailsComponent extends AppBaseComponent {
         this.isLoading = true;
         this.allAgents = [];
         this.allRoles = [];
+        // One or more comma-separated emails, no surrounding spaces (optional field).
+        this.commaSeparatedEmails = /^([^\s@,]+@[^\s@,]+\.[^\s@,]+)(,[^\s@,]+@[^\s@,]+\.[^\s@,]+)*$/;
         this.form = AppAdmin.getSubscriptionsForm();
+        this.form.addControl('invoice_recipient_emails', new UntypedFormControl('', [Validators.pattern(this.commaSeparatedEmails)]));
     }
     ngOnInit() {
         this.subscriptionId = PermissionService.selectedSubscription?.id;
@@ -7730,6 +7733,7 @@ class SubscriptionDetailsComponent extends AppBaseComponent {
                 address: formValue.address,
                 tax_id: formValue.tax_id,
                 contact_email: formValue.contact_email,
+                invoice_recipient_emails: formValue.invoice_recipient_emails,
                 contact_tel: formValue.contact_tel,
                 organization_type_id: formValue.organization_type_id,
                 organization_industry_id: formValue.organization_industry_id,
@@ -7793,11 +7797,11 @@ class SubscriptionDetailsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: SubscriptionDetailsComponent, deps: [{ token: i1$1.SubscriptionService }, { token: i1.AdminService }, { token: i3.DatePipe }, { token: i1$1.CommonService }, { token: i1$1.NgbDateCustomParserFormatter }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: SubscriptionDetailsComponent, isStandalone: false, 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          @if (currentSubscriber?.is_deleted) {\n            <span class=\"badge rounded-pill bg-danger ms-2\"\n            >Deleted</span>\n          }\n        </div>\n        @if (isLoading) {\n          <div class=\"w-100 text-center mt-3\"\n            >\n            <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n          </div>\n        }\n        @if (!isLoading) {\n          <div >\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                            <h3>{{ 'Admin.Subscriptions.Section.IdentityContact' | transloco }}</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.Organization' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.Organization' | transloco\"\n                                  name=\"organisation\"\n                                  controlId=\"sub-details-organisation\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-organisation\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Organization' | transloco\"\n                                    formControlName=\"organisation\" />\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.ContactName' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.ContactName' | transloco\"\n                                  name=\"contact_name\"\n                                  controlId=\"sub-details-contact_name\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_name\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactName' | transloco\"\n                                    formControlName=\"contact_name\" />\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.ContactEmail' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.ContactEmail' | transloco\"\n                                  name=\"contact_email\"\n                                  controlId=\"sub-details-contact_email\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_email\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactEmail' | transloco\"\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                                  controlId=\"sub-details-contact_tel\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_tel\"\n                                    formControlName=\"contact_tel\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactTel' | transloco\"\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]=\"'Admin.Subscriptions.TaxId' | transloco\"\n                                  [showTooltip]=\"true\"\n                                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.TaxId' | transloco\"\n                                  name=\"tax_id\"\n                                  controlId=\"sub-details-tax_id\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-tax_id\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.TaxId' | transloco\"\n                                    formControlName=\"tax_id\" />\n                                </pw-input-container>\n                              </div>\n                              <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                                *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                                <span class=\"pw-label-style\" id=\"subscription-details-roles-label\" [pTooltip]=\"'Admin.Subscriptions.Tooltip.AssignedRoles' | transloco\" tooltipPosition=\"top\" appendTo=\"body\">{{ 'Admin.Subscriptions.AssignedRoles' | transloco }}\n                                  <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\n                                </span>\n                                <p-multiSelect inputId=\"subscription-details-roles\" [options]=\"allRoles\"\n                                  formControlName=\"roles\"\n                                  appendTo=\"body\"\n                                  [placeholder]=\"'Admin.Subscriptions.Placeholder.AssignedRoles' | transloco\"\n                                  [ariaLabelledBy]=\"'subscription-details-roles-label'\"\n                                [ariaLabel]=\"'Admin.Subscriptions.AssignedRoles' | transloco\"></p-multiSelect>\n                              </div>\n                              @if (organizationTypes$ | async; as types) {\n                                <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\"\n                                    [label]=\"'Organization.OrganizationType' | transloco\"\n                                    name=\"organization_type_id\" controlId=\"subscription-organization_type_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_type_id-label'\"\n                                      [ariaLabel]=\"'Organization.OrganizationType' | transloco\"\n                                      [options]=\"types['organization_types']\"\n                                      formControlName=\"organization_type_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationType' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\n                                  </pw-input-container>\n                                </div>\n                              }\n                              @if (organizationIndustries$ | async; as industries) {\n                                <div class=\"mb-3 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\"\n                                    [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                                    name=\"organization_industry_id\" controlId=\"subscription-organization_industry_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_industry_id-label'\"\n                                      [ariaLabel]=\"'Organization.OrganizationIndustry' | transloco\"\n                                      [options]=\"industries['organization_industries']\"\n                                      formControlName=\"organization_industry_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationIndustry' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\n                                  </pw-input-container>\n                                </div>\n                              }\n                              @if (organizationSizes$ | async; as sizes) {\n                                <div class=\"mb-3 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\"\n                                    [label]=\"'Size' | transloco\"\n                                    name=\"organization_size_id\" controlId=\"subscription-organization_size_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_size_id-label'\"\n                                      [ariaLabel]=\"'Size' | transloco\"\n                                      [options]=\"sizes['organization_sizes']\"\n                                      formControlName=\"organization_size_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationSize' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\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                                  controlId=\"sub-details-company_url\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-company_url\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.CompanyUrl' | transloco\"\n                                    formControlName=\"company_url\" />\n                                </pw-input-container>\n                              </div>\n                            </div>\n                            <h3>{{ 'Admin.Subscriptions.Section.PlanSeats' | transloco }}</h3>\n                            <div class=\"row\">\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                                  controlId=\"sub-details-reference_number\">\n                                  @if (form) {\n                                    <input type=\"text\"\n                                      id=\"sub-details-reference_number\"\n                                      readonly\n                                      class=\"form-control\"\n                                      data-control=\"reference\"\n                                      [value]=\"form.get('reference_number')?.value\" />\n                                  }\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.UnitsInUse' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.UnitsInUse' | transloco\"\n                                  name=\"units_in_use\"\n                                  controlId=\"sub-details-units_in_use\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-units_in_use\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"units_in_use\" />\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.MaxUnits' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.MaxUnits' | transloco\"\n                                  name=\"max_units\"\n                                  controlId=\"sub-details-max_units\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-max_units\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"max_units\" />\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.CalculatedPrice' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.CalculatedPrice' | transloco\"\n                                  name=\"calculated_price\"\n                                  controlId=\"sub-details-calculated_price\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-calculated_price\"\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\" controlId=\"sub-details-expires_at\">\n                                  <div class=\"input-group\">\n                                    <input class=\"form-control\"\n                                      id=\"sub-details-expires_at\"\n                                      name=\"expires_at\"\n                                      container=\"body\"\n                                      formControlName=\"expires_at\"\n                                      [readonly]=\"true\"\n                                      ngbDatepicker\n                                      #c=\"ngbDatepicker\" />\n                                      <button class=\"btn btn-primary\"\n                                        type=\"button\"\n                                        [disabled]=\"true\"\n                                        aria-label=\"Open date picker\"\n                                        (click)=\"c.toggle()\">\n                                        <i\n                                          class=\"fa fa-calendar\"\n                                          aria-hidden=\"true\"\n                                        ></i>\n                                      </button>\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                                  controlId=\"sub-details-purchased_units\">\n                                  <input type=\"number\"\n                                    id=\"sub-details-purchased_units\"\n                                    min=\"0\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"purchased_units\" />\n                                </pw-input-container>\n                              </div>\n                              <!-- Readonly Ends -->\n                            </div>\n                            <!-- social links -->\n                            <h3>{{ 'Admin.Subscriptions.Section.SocialLinks' | transloco }}</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                                  controlId=\"sub-details-facebook_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-facebook_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Facebook' | transloco\"\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                                  controlId=\"sub-details-twitter_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-twitter_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Twitter' | transloco\"\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                                  controlId=\"sub-details-linkedin_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-linkedin_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.LinkedIn' | transloco\"\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                                  controlId=\"sub-details-reddit_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-reddit_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Reddit' | transloco\"\n                                    formControlName=\"reddit_handle\" />\n                                </pw-input-container>\n                              </div>\n                            </div>\n                            <ng-container *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                              <h3>{{ 'Admin.Subscriptions.Section.Security' | transloco }}</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\" controlId=\"subscription-enforce_2fa\" [useAriaLabelledbyOnly]=\"true\">\n                                    <ui-switch formControlName=\"enforce_2fa\"\n                                      [attr.aria-labelledby]=\"'subscription-enforce_2fa-label'\"\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        }\n      </div>\n    </div>\n  </div>\n", styles: [".ui-autocomplete-multiple-container,.ui-fluid.skills-modal p-autocomplete{background:transparent}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}:host ::ng-deep .pw-label-style+p-multiselect{margin-top:6px}:host ::ng-deep .input-group .btn{min-height:36px;display:inline-flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i7$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "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", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.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$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "component", type: i10.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.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2.NgbNavLink, selector: "a[ngbNavLink]" }, { kind: "directive", type: i2.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i3$2.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i14.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i14.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.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.AsyncPipe, name: "async" }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: SubscriptionDetailsComponent, isStandalone: false, 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          @if (currentSubscriber?.is_deleted) {\n            <span class=\"badge rounded-pill bg-danger ms-2\"\n            >Deleted</span>\n          }\n        </div>\n        @if (isLoading) {\n          <div class=\"w-100 text-center mt-3\"\n            >\n            <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n          </div>\n        }\n        @if (!isLoading) {\n          <div >\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                            <h3>{{ 'Admin.Subscriptions.Section.IdentityContact' | transloco }}</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.Organization' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.Organization' | transloco\"\n                                  name=\"organisation\"\n                                  controlId=\"sub-details-organisation\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-organisation\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Organization' | transloco\"\n                                    formControlName=\"organisation\" />\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.ContactName' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.ContactName' | transloco\"\n                                  name=\"contact_name\"\n                                  controlId=\"sub-details-contact_name\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_name\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactName' | transloco\"\n                                    formControlName=\"contact_name\" />\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.ContactEmail' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.ContactEmail' | transloco\"\n                                  name=\"contact_email\"\n                                  controlId=\"sub-details-contact_email\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_email\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactEmail' | transloco\"\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.InvoiceRecipientEmails' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.InvoiceRecipientEmails' | transloco\"\n                                  name=\"invoice_recipient_emails\"\n                                  controlId=\"sub-details-invoice_recipient_emails\"\n                                  [errorMsg]=\"'Admin.Subscriptions.Validation.InvoiceRecipientEmails' | transloco\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-invoice_recipient_emails\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.InvoiceRecipientEmails' | transloco\"\n                                    formControlName=\"invoice_recipient_emails\"\n                                    [ngClass]=\"{\n                                      'is-invalid': form.get('invoice_recipient_emails').touched && form.get('invoice_recipient_emails').invalid\n                                    }\" />\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                                  controlId=\"sub-details-contact_tel\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_tel\"\n                                    formControlName=\"contact_tel\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactTel' | transloco\"\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]=\"'Admin.Subscriptions.TaxId' | transloco\"\n                                  [showTooltip]=\"true\"\n                                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.TaxId' | transloco\"\n                                  name=\"tax_id\"\n                                  controlId=\"sub-details-tax_id\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-tax_id\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.TaxId' | transloco\"\n                                    formControlName=\"tax_id\" />\n                                </pw-input-container>\n                              </div>\n                              <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                                *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                                <span class=\"pw-label-style\" id=\"subscription-details-roles-label\" [pTooltip]=\"'Admin.Subscriptions.Tooltip.AssignedRoles' | transloco\" tooltipPosition=\"top\" appendTo=\"body\">{{ 'Admin.Subscriptions.AssignedRoles' | transloco }}\n                                  <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\n                                </span>\n                                <p-multiSelect inputId=\"subscription-details-roles\" [options]=\"allRoles\"\n                                  formControlName=\"roles\"\n                                  appendTo=\"body\"\n                                  [placeholder]=\"'Admin.Subscriptions.Placeholder.AssignedRoles' | transloco\"\n                                  [ariaLabelledBy]=\"'subscription-details-roles-label'\"\n                                [ariaLabel]=\"'Admin.Subscriptions.AssignedRoles' | transloco\"></p-multiSelect>\n                              </div>\n                              @if (organizationTypes$ | async; as types) {\n                                <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\"\n                                    [label]=\"'Organization.OrganizationType' | transloco\"\n                                    name=\"organization_type_id\" controlId=\"subscription-organization_type_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_type_id-label'\"\n                                      [ariaLabel]=\"'Organization.OrganizationType' | transloco\"\n                                      [options]=\"types['organization_types']\"\n                                      formControlName=\"organization_type_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationType' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\n                                  </pw-input-container>\n                                </div>\n                              }\n                              @if (organizationIndustries$ | async; as industries) {\n                                <div class=\"mb-3 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\"\n                                    [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                                    name=\"organization_industry_id\" controlId=\"subscription-organization_industry_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_industry_id-label'\"\n                                      [ariaLabel]=\"'Organization.OrganizationIndustry' | transloco\"\n                                      [options]=\"industries['organization_industries']\"\n                                      formControlName=\"organization_industry_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationIndustry' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\n                                  </pw-input-container>\n                                </div>\n                              }\n                              @if (organizationSizes$ | async; as sizes) {\n                                <div class=\"mb-3 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\"\n                                    [label]=\"'Size' | transloco\"\n                                    name=\"organization_size_id\" controlId=\"subscription-organization_size_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_size_id-label'\"\n                                      [ariaLabel]=\"'Size' | transloco\"\n                                      [options]=\"sizes['organization_sizes']\"\n                                      formControlName=\"organization_size_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationSize' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\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                                  controlId=\"sub-details-company_url\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-company_url\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.CompanyUrl' | transloco\"\n                                    formControlName=\"company_url\" />\n                                </pw-input-container>\n                              </div>\n                            </div>\n                            <h3>{{ 'Admin.Subscriptions.Section.PlanSeats' | transloco }}</h3>\n                            <div class=\"row\">\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                                  controlId=\"sub-details-reference_number\">\n                                  @if (form) {\n                                    <input type=\"text\"\n                                      id=\"sub-details-reference_number\"\n                                      readonly\n                                      class=\"form-control\"\n                                      data-control=\"reference\"\n                                      [value]=\"form.get('reference_number')?.value\" />\n                                  }\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.UnitsInUse' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.UnitsInUse' | transloco\"\n                                  name=\"units_in_use\"\n                                  controlId=\"sub-details-units_in_use\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-units_in_use\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"units_in_use\" />\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.MaxUnits' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.MaxUnits' | transloco\"\n                                  name=\"max_units\"\n                                  controlId=\"sub-details-max_units\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-max_units\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"max_units\" />\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.CalculatedPrice' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.CalculatedPrice' | transloco\"\n                                  name=\"calculated_price\"\n                                  controlId=\"sub-details-calculated_price\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-calculated_price\"\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\" controlId=\"sub-details-expires_at\">\n                                  <div class=\"input-group\">\n                                    <input class=\"form-control\"\n                                      id=\"sub-details-expires_at\"\n                                      name=\"expires_at\"\n                                      container=\"body\"\n                                      formControlName=\"expires_at\"\n                                      [readonly]=\"true\"\n                                      ngbDatepicker\n                                      #c=\"ngbDatepicker\" />\n                                      <button class=\"btn btn-primary\"\n                                        type=\"button\"\n                                        [disabled]=\"true\"\n                                        aria-label=\"Open date picker\"\n                                        (click)=\"c.toggle()\">\n                                        <i\n                                          class=\"fa fa-calendar\"\n                                          aria-hidden=\"true\"\n                                        ></i>\n                                      </button>\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                                  controlId=\"sub-details-purchased_units\">\n                                  <input type=\"number\"\n                                    id=\"sub-details-purchased_units\"\n                                    min=\"0\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"purchased_units\" />\n                                </pw-input-container>\n                              </div>\n                              <!-- Readonly Ends -->\n                            </div>\n                            <!-- social links -->\n                            <h3>{{ 'Admin.Subscriptions.Section.SocialLinks' | transloco }}</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                                  controlId=\"sub-details-facebook_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-facebook_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Facebook' | transloco\"\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                                  controlId=\"sub-details-twitter_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-twitter_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Twitter' | transloco\"\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                                  controlId=\"sub-details-linkedin_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-linkedin_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.LinkedIn' | transloco\"\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                                  controlId=\"sub-details-reddit_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-reddit_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Reddit' | transloco\"\n                                    formControlName=\"reddit_handle\" />\n                                </pw-input-container>\n                              </div>\n                            </div>\n                            <ng-container *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                              <h3>{{ 'Admin.Subscriptions.Section.Security' | transloco }}</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\" controlId=\"subscription-enforce_2fa\" [useAriaLabelledbyOnly]=\"true\">\n                                    <ui-switch formControlName=\"enforce_2fa\"\n                                      [attr.aria-labelledby]=\"'subscription-enforce_2fa-label'\"\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        }\n      </div>\n    </div>\n  </div>\n", styles: [".ui-autocomplete-multiple-container,.ui-fluid.skills-modal p-autocomplete{background:transparent}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}:host ::ng-deep .pw-label-style+p-multiselect{margin-top:6px}:host ::ng-deep .input-group .btn{min-height:36px;display:inline-flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i7$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "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", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.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$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "component", type: i10.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.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2.NgbNavLink, selector: "a[ngbNavLink]" }, { kind: "directive", type: i2.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i3$2.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i14.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i14.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.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.AsyncPipe, name: "async" }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: SubscriptionDetailsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-subscription-details', standalone: false, 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          @if (currentSubscriber?.is_deleted) {\n            <span class=\"badge rounded-pill bg-danger ms-2\"\n            >Deleted</span>\n          }\n        </div>\n        @if (isLoading) {\n          <div class=\"w-100 text-center mt-3\"\n            >\n            <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n          </div>\n        }\n        @if (!isLoading) {\n          <div >\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                            <h3>{{ 'Admin.Subscriptions.Section.IdentityContact' | transloco }}</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.Organization' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.Organization' | transloco\"\n                                  name=\"organisation\"\n                                  controlId=\"sub-details-organisation\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-organisation\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Organization' | transloco\"\n                                    formControlName=\"organisation\" />\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.ContactName' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.ContactName' | transloco\"\n                                  name=\"contact_name\"\n                                  controlId=\"sub-details-contact_name\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_name\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactName' | transloco\"\n                                    formControlName=\"contact_name\" />\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.ContactEmail' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.ContactEmail' | transloco\"\n                                  name=\"contact_email\"\n                                  controlId=\"sub-details-contact_email\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_email\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactEmail' | transloco\"\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                                  controlId=\"sub-details-contact_tel\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_tel\"\n                                    formControlName=\"contact_tel\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactTel' | transloco\"\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]=\"'Admin.Subscriptions.TaxId' | transloco\"\n                                  [showTooltip]=\"true\"\n                                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.TaxId' | transloco\"\n                                  name=\"tax_id\"\n                                  controlId=\"sub-details-tax_id\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-tax_id\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.TaxId' | transloco\"\n                                    formControlName=\"tax_id\" />\n                                </pw-input-container>\n                              </div>\n                              <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                                *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                                <span class=\"pw-label-style\" id=\"subscription-details-roles-label\" [pTooltip]=\"'Admin.Subscriptions.Tooltip.AssignedRoles' | transloco\" tooltipPosition=\"top\" appendTo=\"body\">{{ 'Admin.Subscriptions.AssignedRoles' | transloco }}\n                                  <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\n                                </span>\n                                <p-multiSelect inputId=\"subscription-details-roles\" [options]=\"allRoles\"\n                                  formControlName=\"roles\"\n                                  appendTo=\"body\"\n                                  [placeholder]=\"'Admin.Subscriptions.Placeholder.AssignedRoles' | transloco\"\n                                  [ariaLabelledBy]=\"'subscription-details-roles-label'\"\n                                [ariaLabel]=\"'Admin.Subscriptions.AssignedRoles' | transloco\"></p-multiSelect>\n                              </div>\n                              @if (organizationTypes$ | async; as types) {\n                                <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\"\n                                    [label]=\"'Organization.OrganizationType' | transloco\"\n                                    name=\"organization_type_id\" controlId=\"subscription-organization_type_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_type_id-label'\"\n                                      [ariaLabel]=\"'Organization.OrganizationType' | transloco\"\n                                      [options]=\"types['organization_types']\"\n                                      formControlName=\"organization_type_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationType' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\n                                  </pw-input-container>\n                                </div>\n                              }\n                              @if (organizationIndustries$ | async; as industries) {\n                                <div class=\"mb-3 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\"\n                                    [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                                    name=\"organization_industry_id\" controlId=\"subscription-organization_industry_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_industry_id-label'\"\n                                      [ariaLabel]=\"'Organization.OrganizationIndustry' | transloco\"\n                                      [options]=\"industries['organization_industries']\"\n                                      formControlName=\"organization_industry_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationIndustry' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\n                                  </pw-input-container>\n                                </div>\n                              }\n                              @if (organizationSizes$ | async; as sizes) {\n                                <div class=\"mb-3 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\"\n                                    [label]=\"'Size' | transloco\"\n                                    name=\"organization_size_id\" controlId=\"subscription-organization_size_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_size_id-label'\"\n                                      [ariaLabel]=\"'Size' | transloco\"\n                                      [options]=\"sizes['organization_sizes']\"\n                                      formControlName=\"organization_size_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationSize' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\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                                  controlId=\"sub-details-company_url\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-company_url\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.CompanyUrl' | transloco\"\n                                    formControlName=\"company_url\" />\n                                </pw-input-container>\n                              </div>\n                            </div>\n                            <h3>{{ 'Admin.Subscriptions.Section.PlanSeats' | transloco }}</h3>\n                            <div class=\"row\">\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                                  controlId=\"sub-details-reference_number\">\n                                  @if (form) {\n                                    <input type=\"text\"\n                                      id=\"sub-details-reference_number\"\n                                      readonly\n                                      class=\"form-control\"\n                                      data-control=\"reference\"\n                                      [value]=\"form.get('reference_number')?.value\" />\n                                  }\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.UnitsInUse' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.UnitsInUse' | transloco\"\n                                  name=\"units_in_use\"\n                                  controlId=\"sub-details-units_in_use\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-units_in_use\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"units_in_use\" />\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.MaxUnits' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.MaxUnits' | transloco\"\n                                  name=\"max_units\"\n                                  controlId=\"sub-details-max_units\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-max_units\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"max_units\" />\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.CalculatedPrice' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.CalculatedPrice' | transloco\"\n                                  name=\"calculated_price\"\n                                  controlId=\"sub-details-calculated_price\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-calculated_price\"\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\" controlId=\"sub-details-expires_at\">\n                                  <div class=\"input-group\">\n                                    <input class=\"form-control\"\n                                      id=\"sub-details-expires_at\"\n                                      name=\"expires_at\"\n                                      container=\"body\"\n                                      formControlName=\"expires_at\"\n                                      [readonly]=\"true\"\n                                      ngbDatepicker\n                                      #c=\"ngbDatepicker\" />\n                                      <button class=\"btn btn-primary\"\n                                        type=\"button\"\n                                        [disabled]=\"true\"\n                                        aria-label=\"Open date picker\"\n                                        (click)=\"c.toggle()\">\n                                        <i\n                                          class=\"fa fa-calendar\"\n                                          aria-hidden=\"true\"\n                                        ></i>\n                                      </button>\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                                  controlId=\"sub-details-purchased_units\">\n                                  <input type=\"number\"\n                                    id=\"sub-details-purchased_units\"\n                                    min=\"0\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"purchased_units\" />\n                                </pw-input-container>\n                              </div>\n                              <!-- Readonly Ends -->\n                            </div>\n                            <!-- social links -->\n                            <h3>{{ 'Admin.Subscriptions.Section.SocialLinks' | transloco }}</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                                  controlId=\"sub-details-facebook_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-facebook_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Facebook' | transloco\"\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                                  controlId=\"sub-details-twitter_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-twitter_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Twitter' | transloco\"\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                                  controlId=\"sub-details-linkedin_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-linkedin_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.LinkedIn' | transloco\"\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                                  controlId=\"sub-details-reddit_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-reddit_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Reddit' | transloco\"\n                                    formControlName=\"reddit_handle\" />\n                                </pw-input-container>\n                              </div>\n                            </div>\n                            <ng-container *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                              <h3>{{ 'Admin.Subscriptions.Section.Security' | transloco }}</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\" controlId=\"subscription-enforce_2fa\" [useAriaLabelledbyOnly]=\"true\">\n                                    <ui-switch formControlName=\"enforce_2fa\"\n                                      [attr.aria-labelledby]=\"'subscription-enforce_2fa-label'\"\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        }\n      </div>\n    </div>\n  </div>\n", styles: [".ui-autocomplete-multiple-container,.ui-fluid.skills-modal p-autocomplete{background:transparent}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}:host ::ng-deep .pw-label-style+p-multiselect{margin-top:6px}:host ::ng-deep .input-group .btn{min-height:36px;display:inline-flex;align-items:center;justify-content:center}\n"] }]
+            args: [{ selector: 'pw-subscription-details', standalone: false, 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          @if (currentSubscriber?.is_deleted) {\n            <span class=\"badge rounded-pill bg-danger ms-2\"\n            >Deleted</span>\n          }\n        </div>\n        @if (isLoading) {\n          <div class=\"w-100 text-center mt-3\"\n            >\n            <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n          </div>\n        }\n        @if (!isLoading) {\n          <div >\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                            <h3>{{ 'Admin.Subscriptions.Section.IdentityContact' | transloco }}</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.Organization' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.Organization' | transloco\"\n                                  name=\"organisation\"\n                                  controlId=\"sub-details-organisation\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-organisation\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Organization' | transloco\"\n                                    formControlName=\"organisation\" />\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.ContactName' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.ContactName' | transloco\"\n                                  name=\"contact_name\"\n                                  controlId=\"sub-details-contact_name\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_name\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactName' | transloco\"\n                                    formControlName=\"contact_name\" />\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.ContactEmail' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.ContactEmail' | transloco\"\n                                  name=\"contact_email\"\n                                  controlId=\"sub-details-contact_email\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_email\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactEmail' | transloco\"\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.InvoiceRecipientEmails' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.InvoiceRecipientEmails' | transloco\"\n                                  name=\"invoice_recipient_emails\"\n                                  controlId=\"sub-details-invoice_recipient_emails\"\n                                  [errorMsg]=\"'Admin.Subscriptions.Validation.InvoiceRecipientEmails' | transloco\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-invoice_recipient_emails\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.InvoiceRecipientEmails' | transloco\"\n                                    formControlName=\"invoice_recipient_emails\"\n                                    [ngClass]=\"{\n                                      'is-invalid': form.get('invoice_recipient_emails').touched && form.get('invoice_recipient_emails').invalid\n                                    }\" />\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                                  controlId=\"sub-details-contact_tel\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-contact_tel\"\n                                    formControlName=\"contact_tel\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactTel' | transloco\"\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]=\"'Admin.Subscriptions.TaxId' | transloco\"\n                                  [showTooltip]=\"true\"\n                                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.TaxId' | transloco\"\n                                  name=\"tax_id\"\n                                  controlId=\"sub-details-tax_id\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-tax_id\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.TaxId' | transloco\"\n                                    formControlName=\"tax_id\" />\n                                </pw-input-container>\n                              </div>\n                              <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                                *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                                <span class=\"pw-label-style\" id=\"subscription-details-roles-label\" [pTooltip]=\"'Admin.Subscriptions.Tooltip.AssignedRoles' | transloco\" tooltipPosition=\"top\" appendTo=\"body\">{{ 'Admin.Subscriptions.AssignedRoles' | transloco }}\n                                  <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\n                                </span>\n                                <p-multiSelect inputId=\"subscription-details-roles\" [options]=\"allRoles\"\n                                  formControlName=\"roles\"\n                                  appendTo=\"body\"\n                                  [placeholder]=\"'Admin.Subscriptions.Placeholder.AssignedRoles' | transloco\"\n                                  [ariaLabelledBy]=\"'subscription-details-roles-label'\"\n                                [ariaLabel]=\"'Admin.Subscriptions.AssignedRoles' | transloco\"></p-multiSelect>\n                              </div>\n                              @if (organizationTypes$ | async; as types) {\n                                <div class=\"mb-3 col-xs-12 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\"\n                                    [label]=\"'Organization.OrganizationType' | transloco\"\n                                    name=\"organization_type_id\" controlId=\"subscription-organization_type_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_type_id-label'\"\n                                      [ariaLabel]=\"'Organization.OrganizationType' | transloco\"\n                                      [options]=\"types['organization_types']\"\n                                      formControlName=\"organization_type_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationType' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\n                                  </pw-input-container>\n                                </div>\n                              }\n                              @if (organizationIndustries$ | async; as industries) {\n                                <div class=\"mb-3 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\"\n                                    [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                                    name=\"organization_industry_id\" controlId=\"subscription-organization_industry_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_industry_id-label'\"\n                                      [ariaLabel]=\"'Organization.OrganizationIndustry' | transloco\"\n                                      [options]=\"industries['organization_industries']\"\n                                      formControlName=\"organization_industry_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationIndustry' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\n                                  </pw-input-container>\n                                </div>\n                              }\n                              @if (organizationSizes$ | async; as sizes) {\n                                <div class=\"mb-3 col-sm-6 col-md-3\"\n                                  >\n                                  <pw-input-container [showTooltip]=\"true\"\n                                    [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\"\n                                    [label]=\"'Size' | transloco\"\n                                    name=\"organization_size_id\" controlId=\"subscription-organization_size_id\" [useAriaLabelledbyOnly]=\"true\">\n                                    <p-select\n                                      [ariaLabelledBy]=\"'subscription-organization_size_id-label'\"\n                                      [ariaLabel]=\"'Size' | transloco\"\n                                      [options]=\"sizes['organization_sizes']\"\n                                      formControlName=\"organization_size_id\"\n                                      [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationSize' | transloco\"\n                                      optionValue=\"id\"\n                                      optionLabel=\"name\">\n                                    </p-select>\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                                  controlId=\"sub-details-company_url\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-company_url\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.CompanyUrl' | transloco\"\n                                    formControlName=\"company_url\" />\n                                </pw-input-container>\n                              </div>\n                            </div>\n                            <h3>{{ 'Admin.Subscriptions.Section.PlanSeats' | transloco }}</h3>\n                            <div class=\"row\">\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                                  controlId=\"sub-details-reference_number\">\n                                  @if (form) {\n                                    <input type=\"text\"\n                                      id=\"sub-details-reference_number\"\n                                      readonly\n                                      class=\"form-control\"\n                                      data-control=\"reference\"\n                                      [value]=\"form.get('reference_number')?.value\" />\n                                  }\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.UnitsInUse' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.UnitsInUse' | transloco\"\n                                  name=\"units_in_use\"\n                                  controlId=\"sub-details-units_in_use\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-units_in_use\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"units_in_use\" />\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.MaxUnits' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.MaxUnits' | transloco\"\n                                  name=\"max_units\"\n                                  controlId=\"sub-details-max_units\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-max_units\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"max_units\" />\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.CalculatedPrice' | transloco\"\n                                  [label]=\"'Admin.Subscriptions.CalculatedPrice' | transloco\"\n                                  name=\"calculated_price\"\n                                  controlId=\"sub-details-calculated_price\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-calculated_price\"\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\" controlId=\"sub-details-expires_at\">\n                                  <div class=\"input-group\">\n                                    <input class=\"form-control\"\n                                      id=\"sub-details-expires_at\"\n                                      name=\"expires_at\"\n                                      container=\"body\"\n                                      formControlName=\"expires_at\"\n                                      [readonly]=\"true\"\n                                      ngbDatepicker\n                                      #c=\"ngbDatepicker\" />\n                                      <button class=\"btn btn-primary\"\n                                        type=\"button\"\n                                        [disabled]=\"true\"\n                                        aria-label=\"Open date picker\"\n                                        (click)=\"c.toggle()\">\n                                        <i\n                                          class=\"fa fa-calendar\"\n                                          aria-hidden=\"true\"\n                                        ></i>\n                                      </button>\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                                  controlId=\"sub-details-purchased_units\">\n                                  <input type=\"number\"\n                                    id=\"sub-details-purchased_units\"\n                                    min=\"0\"\n                                    readonly\n                                    class=\"form-control\"\n                                    formControlName=\"purchased_units\" />\n                                </pw-input-container>\n                              </div>\n                              <!-- Readonly Ends -->\n                            </div>\n                            <!-- social links -->\n                            <h3>{{ 'Admin.Subscriptions.Section.SocialLinks' | transloco }}</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                                  controlId=\"sub-details-facebook_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-facebook_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Facebook' | transloco\"\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                                  controlId=\"sub-details-twitter_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-twitter_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Twitter' | transloco\"\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                                  controlId=\"sub-details-linkedin_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-linkedin_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.LinkedIn' | transloco\"\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                                  controlId=\"sub-details-reddit_handle\">\n                                  <input type=\"text\"\n                                    id=\"sub-details-reddit_handle\"\n                                    class=\"form-control\"\n                                    [placeholder]=\"'Admin.Subscriptions.Placeholder.Reddit' | transloco\"\n                                    formControlName=\"reddit_handle\" />\n                                </pw-input-container>\n                              </div>\n                            </div>\n                            <ng-container *rbacAllow=\"'SubscriptionSuperAdmin'\">\n                              <h3>{{ 'Admin.Subscriptions.Section.Security' | transloco }}</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\" controlId=\"subscription-enforce_2fa\" [useAriaLabelledbyOnly]=\"true\">\n                                    <ui-switch formControlName=\"enforce_2fa\"\n                                      [attr.aria-labelledby]=\"'subscription-enforce_2fa-label'\"\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        }\n      </div>\n    </div>\n  </div>\n", styles: [".ui-autocomplete-multiple-container,.ui-fluid.skills-modal p-autocomplete{background:transparent}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}:host ::ng-deep .pw-label-style+p-multiselect{margin-top:6px}:host ::ng-deep .input-group .btn{min-height:36px;display:inline-flex;align-items:center;justify-content:center}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.SubscriptionService }, { type: i1.AdminService }, { type: i3.DatePipe }, { type: i1$1.CommonService }, { type: i1$1.NgbDateCustomParserFormatter }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
 
 class SubscriptionProductDetailsComponent extends AppBaseComponent {
@@ -8411,6 +8415,8 @@ class InviteUsersComponent extends AppBaseComponent {
             first_name: ['', Validators.required],
             last_name: ['', Validators.required],
             email: ['', [Validators.required, Validators.email]],
+            contact_email: ['', [Validators.email]],
+            invoice_recipient_emails: ['', [this.commaSeparatedEmailsValidator()]],
             organization_industry_id: [''],
             organization_type_id: [''],
             organization_size_id: [''],
@@ -8457,6 +8463,31 @@ class InviteUsersComponent extends AppBaseComponent {
             this.cdr.markForCheck();
         });
     }
+    commaSeparatedEmailsValidator() {
+        return (control) => {
+            if (!control.value) {
+                return null; // Optional field — allow empty values
+            }
+            const value = control.value;
+            // Reject spaces around commas (comma-space or space-comma patterns)
+            if (value.includes(',') && (value.includes(', ') || value.includes(' ,'))) {
+                return { invalidFormat: true };
+            }
+            // Reject any part that has surrounding or internal spaces
+            const emailParts = value.split(',');
+            if (emailParts.some((part) => part.trim() !== part || part.includes(' '))) {
+                return { invalidFormat: true };
+            }
+            // Validate each email
+            const emails = emailParts.map((email) => email.trim());
+            for (const email of emails) {
+                if (email && !ValidationService.email(email)) {
+                    return { invalidEmail: true };
+                }
+            }
+            return null;
+        };
+    }
     onSave() {
         if (this.form.invalid) {
             FormHelperService.validateAllFormFields(this.form);
@@ -8466,6 +8497,8 @@ class InviteUsersComponent extends AppBaseComponent {
             const productId = this.form.get('product_id').value.id;
             const inviteObj = {
                 email: this.form.get('email').value,
+                contact_email: this.form.get('contact_email').value,
+                invoice_recipient_emails: this.form.get('invoice_recipient_emails').value,
                 first_name: this.form.get('first_name').value,
                 last_name: this.form.get('last_name').value,
                 units: this.form.get('units').value,
@@ -8584,11 +8617,11 @@ class InviteUsersComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: InviteUsersComponent, deps: [{ token: i3$1.UntypedFormBuilder }, { token: i1.AdminService }, { token: i1$1.ProductService }, { token: i0.Injector }, { token: i1$1.CommonService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: InviteUsersComponent, isStandalone: false, 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=\"\">{{ 'Admin.Subscriptions.InviteNewUser' | transloco }}</h3>\n        <p>{{ 'Admin.Subscriptions.InviteNewUserDescription' | transloco }}</p>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n          (ngSubmit)=\"onSave()\">\n\n          <h3>{{ 'Admin.Subscriptions.Section.UserDetails' | transloco }}</h3>\n          <div class=\"row\">\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.FirstName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.FirstName' | transloco\"\n                name=\"first_name\"\n                controlId=\"invite-first_name\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.FirstName' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-first_name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InviteFirstName' | transloco\"\n                  formControlName=\"first_name\"\n                  [ngClass]=\"{\n                    'is-invalid': form.get('first_name').touched && form.get('first_name').invalid\n                  }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.LastName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.LastName' | transloco\"\n                name=\"last_name\"\n                controlId=\"invite-last_name\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.LastName' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-last_name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InviteLastName' | transloco\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.Email' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.Email' | transloco\"\n                name=\"email\"\n                controlId=\"invite-email\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Email' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-email\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Label.EmailPlaceholder' | transloco\"\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>\n\n          <h3>{{ 'Admin.Subscriptions.Section.ProductSeats' | transloco }}</h3>\n          <div class=\"row\">\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.Product' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n                name=\"product_id\"\n                controlId=\"invite-product_id\"\n                [useAriaLabelledbyOnly]=\"true\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n                <p-autoComplete appendTo=\"body\" #refProduct\n                  [suggestions]=\"filteredProducts\"\n                  [ariaLabelledBy]=\"'invite-product_id-label'\"\n                  [ariaLabel]=\"'Label.Product' | transloco\"\n                  formControlName=\"product_id\"\n                  dataKey=\"id\"\n                  optionLabel=\"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]=\"'Admin.Subscriptions.Placeholder.SearchProducts' | transloco\"\n                  [inputStyleClass]=\"form.get('product_id').touched && form.get('product_id').invalid ? 'is-invalid' : ''\"\n                  [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container label=\"{{'Label.Seats' | transloco}}{{unitsText}}\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.Units' | transloco\"\n                name=\"units\"\n                controlId=\"invite-units\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Units' | transloco\">\n                <input type=\"number\"\n                  id=\"invite-units\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Admin.Subscriptions.MinUnits' | transloco\"\n                [showTooltip]=\"true\"\n                name=\"min_units\"\n                controlId=\"invite-min_units\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.MinUnits' | transloco\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.MinUnits' | transloco\">\n                <input type=\"number\"\n                  id=\"invite-min_units\"\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>\n\n          <h3>{{ 'Admin.Subscriptions.Section.Organization' | transloco }}</h3>\n          <div class=\"row\">\n            @if (organizationIndustries$ | async; as industries) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                  name=\"organization_industry_id\"\n                  controlId=\"invite-organization_industry_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_industry_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationIndustry' | transloco\"\n                    [options]=\"industries['organization_industries']\"\n                    formControlName=\"organization_industry_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationIndustry' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            @if (organizationSizes$ | async; as sizes) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationSize' | transloco\"\n                  name=\"organization_size_id\"\n                  controlId=\"invite-organization_size_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_size_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationSize' | transloco\"\n                    [options]=\"sizes['organization_sizes']\"\n                    formControlName=\"organization_size_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationSize' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            @if (organizationTypes$ | async; as types) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationType' | transloco\"\n                  name=\"organization_type_id\"\n                  controlId=\"invite-organization_type_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_type_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationType' | transloco\"\n                    [options]=\"types['organization_types']\"\n                    formControlName=\"organization_type_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationType' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Organization.OrganizationName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationName' | transloco\"\n                name=\"name\"\n                controlId=\"invite-organization-name\">\n                <input type=\"text\"\n                  id=\"invite-organization-name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.Organization' | transloco\"\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>\n\n          <div class=\"row\">\n            <div class=\"col-12 text-end\">\n              <button type=\"button\"\n                class=\"btn btn-secondary me-3\"\n                (click)=\"form.reset(); totalRecordsUnFiltered = 0; back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                [disabled]=\"buttonBusy\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Invite' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";: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: color-mix(in srgb, var(--first, rgb(23 105 225)) 85%, #000000);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255);--dashboard_bg: rgb(255 255 255);--public-btn-radius: 24px}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}\n"], dependencies: [{ kind: "component", type: i4$2.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "addOnTab", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "addOnBlur", "separator", "appendTo", "motionOptions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onAdd", "onFocus", "onBlur", "onDropdownClick", "onClear", "onInputKeydown", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.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$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "component", type: i3$2.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i14.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: InviteUsersComponent, isStandalone: false, 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=\"\">{{ 'Admin.Subscriptions.InviteNewUser' | transloco }}</h3>\n        <p>{{ 'Admin.Subscriptions.InviteNewUserDescription' | transloco }}</p>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n          (ngSubmit)=\"onSave()\">\n\n          <h3>{{ 'Admin.Subscriptions.Section.UserDetails' | transloco }}</h3>\n          <div class=\"row\">\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.FirstName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.FirstName' | transloco\"\n                name=\"first_name\"\n                controlId=\"invite-first_name\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.FirstName' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-first_name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InviteFirstName' | transloco\"\n                  formControlName=\"first_name\"\n                  [ngClass]=\"{\n                    'is-invalid': form.get('first_name').touched && form.get('first_name').invalid\n                  }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.LastName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.LastName' | transloco\"\n                name=\"last_name\"\n                controlId=\"invite-last_name\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.LastName' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-last_name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InviteLastName' | transloco\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.Email' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.Email' | transloco\"\n                name=\"email\"\n                controlId=\"invite-email\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Email' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-email\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Label.EmailPlaceholder' | transloco\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Admin.Subscriptions.ContactEmail' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.ContactEmail' | transloco\"\n                name=\"contact_email\"\n                controlId=\"invite-contact_email\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.ContactEmail' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-contact_email\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactEmail' | transloco\"\n                  formControlName=\"contact_email\"\n                  [ngClass]=\"{\n                    'is-invalid': form.get('contact_email').touched && form.get('contact_email').invalid\n                  }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Admin.Subscriptions.InvoiceRecipientEmails' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.InvoiceRecipientEmails' | transloco\"\n                name=\"invoice_recipient_emails\"\n                controlId=\"invite-invoice_recipient_emails\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.InvoiceRecipientEmails' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-invoice_recipient_emails\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InvoiceRecipientEmails' | transloco\"\n                  formControlName=\"invoice_recipient_emails\"\n                  [ngClass]=\"{\n                    'is-invalid': form.get('invoice_recipient_emails').touched && form.get('invoice_recipient_emails').invalid\n                  }\" />\n              </pw-input-container>\n            </div>\n          </div>\n\n          <h3>{{ 'Admin.Subscriptions.Section.ProductSeats' | transloco }}</h3>\n          <div class=\"row\">\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.Product' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n                name=\"product_id\"\n                controlId=\"invite-product_id\"\n                [useAriaLabelledbyOnly]=\"true\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n                <p-autoComplete appendTo=\"body\" #refProduct\n                  [suggestions]=\"filteredProducts\"\n                  [ariaLabelledBy]=\"'invite-product_id-label'\"\n                  [ariaLabel]=\"'Label.Product' | transloco\"\n                  formControlName=\"product_id\"\n                  dataKey=\"id\"\n                  optionLabel=\"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]=\"'Admin.Subscriptions.Placeholder.SearchProducts' | transloco\"\n                  [inputStyleClass]=\"form.get('product_id').touched && form.get('product_id').invalid ? 'is-invalid' : ''\"\n                  [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container label=\"{{'Label.Seats' | transloco}}{{unitsText}}\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.Units' | transloco\"\n                name=\"units\"\n                controlId=\"invite-units\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Units' | transloco\">\n                <input type=\"number\"\n                  id=\"invite-units\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Admin.Subscriptions.MinUnits' | transloco\"\n                [showTooltip]=\"true\"\n                name=\"min_units\"\n                controlId=\"invite-min_units\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.MinUnits' | transloco\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.MinUnits' | transloco\">\n                <input type=\"number\"\n                  id=\"invite-min_units\"\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>\n\n          <h3>{{ 'Admin.Subscriptions.Section.Organization' | transloco }}</h3>\n          <div class=\"row\">\n            @if (organizationIndustries$ | async; as industries) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                  name=\"organization_industry_id\"\n                  controlId=\"invite-organization_industry_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_industry_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationIndustry' | transloco\"\n                    [options]=\"industries['organization_industries']\"\n                    formControlName=\"organization_industry_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationIndustry' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            @if (organizationSizes$ | async; as sizes) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationSize' | transloco\"\n                  name=\"organization_size_id\"\n                  controlId=\"invite-organization_size_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_size_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationSize' | transloco\"\n                    [options]=\"sizes['organization_sizes']\"\n                    formControlName=\"organization_size_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationSize' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            @if (organizationTypes$ | async; as types) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationType' | transloco\"\n                  name=\"organization_type_id\"\n                  controlId=\"invite-organization_type_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_type_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationType' | transloco\"\n                    [options]=\"types['organization_types']\"\n                    formControlName=\"organization_type_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationType' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Organization.OrganizationName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationName' | transloco\"\n                name=\"name\"\n                controlId=\"invite-organization-name\">\n                <input type=\"text\"\n                  id=\"invite-organization-name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.Organization' | transloco\"\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>\n\n          <div class=\"row\">\n            <div class=\"col-12 text-end\">\n              <button type=\"button\"\n                class=\"btn btn-secondary me-3\"\n                (click)=\"form.reset(); totalRecordsUnFiltered = 0; back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                [disabled]=\"buttonBusy\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Invite' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";: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: color-mix(in srgb, var(--first, rgb(23 105 225)) 85%, #000000);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255);--dashboard_bg: rgb(255 255 255);--public-btn-radius: 24px}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}\n"], dependencies: [{ kind: "component", type: i4$2.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "addOnTab", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "addOnBlur", "separator", "appendTo", "motionOptions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onAdd", "onFocus", "onBlur", "onDropdownClick", "onClear", "onInputKeydown", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.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$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "component", type: i3$2.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i14.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: InviteUsersComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-invite-users', standalone: false, 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=\"\">{{ 'Admin.Subscriptions.InviteNewUser' | transloco }}</h3>\n        <p>{{ 'Admin.Subscriptions.InviteNewUserDescription' | transloco }}</p>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n          (ngSubmit)=\"onSave()\">\n\n          <h3>{{ 'Admin.Subscriptions.Section.UserDetails' | transloco }}</h3>\n          <div class=\"row\">\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.FirstName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.FirstName' | transloco\"\n                name=\"first_name\"\n                controlId=\"invite-first_name\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.FirstName' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-first_name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InviteFirstName' | transloco\"\n                  formControlName=\"first_name\"\n                  [ngClass]=\"{\n                    'is-invalid': form.get('first_name').touched && form.get('first_name').invalid\n                  }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.LastName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.LastName' | transloco\"\n                name=\"last_name\"\n                controlId=\"invite-last_name\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.LastName' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-last_name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InviteLastName' | transloco\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.Email' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.Email' | transloco\"\n                name=\"email\"\n                controlId=\"invite-email\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Email' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-email\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Label.EmailPlaceholder' | transloco\"\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>\n\n          <h3>{{ 'Admin.Subscriptions.Section.ProductSeats' | transloco }}</h3>\n          <div class=\"row\">\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.Product' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n                name=\"product_id\"\n                controlId=\"invite-product_id\"\n                [useAriaLabelledbyOnly]=\"true\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n                <p-autoComplete appendTo=\"body\" #refProduct\n                  [suggestions]=\"filteredProducts\"\n                  [ariaLabelledBy]=\"'invite-product_id-label'\"\n                  [ariaLabel]=\"'Label.Product' | transloco\"\n                  formControlName=\"product_id\"\n                  dataKey=\"id\"\n                  optionLabel=\"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]=\"'Admin.Subscriptions.Placeholder.SearchProducts' | transloco\"\n                  [inputStyleClass]=\"form.get('product_id').touched && form.get('product_id').invalid ? 'is-invalid' : ''\"\n                  [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container label=\"{{'Label.Seats' | transloco}}{{unitsText}}\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.Units' | transloco\"\n                name=\"units\"\n                controlId=\"invite-units\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Units' | transloco\">\n                <input type=\"number\"\n                  id=\"invite-units\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Admin.Subscriptions.MinUnits' | transloco\"\n                [showTooltip]=\"true\"\n                name=\"min_units\"\n                controlId=\"invite-min_units\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.MinUnits' | transloco\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.MinUnits' | transloco\">\n                <input type=\"number\"\n                  id=\"invite-min_units\"\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>\n\n          <h3>{{ 'Admin.Subscriptions.Section.Organization' | transloco }}</h3>\n          <div class=\"row\">\n            @if (organizationIndustries$ | async; as industries) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                  name=\"organization_industry_id\"\n                  controlId=\"invite-organization_industry_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_industry_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationIndustry' | transloco\"\n                    [options]=\"industries['organization_industries']\"\n                    formControlName=\"organization_industry_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationIndustry' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            @if (organizationSizes$ | async; as sizes) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationSize' | transloco\"\n                  name=\"organization_size_id\"\n                  controlId=\"invite-organization_size_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_size_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationSize' | transloco\"\n                    [options]=\"sizes['organization_sizes']\"\n                    formControlName=\"organization_size_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationSize' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            @if (organizationTypes$ | async; as types) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationType' | transloco\"\n                  name=\"organization_type_id\"\n                  controlId=\"invite-organization_type_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_type_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationType' | transloco\"\n                    [options]=\"types['organization_types']\"\n                    formControlName=\"organization_type_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationType' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Organization.OrganizationName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationName' | transloco\"\n                name=\"name\"\n                controlId=\"invite-organization-name\">\n                <input type=\"text\"\n                  id=\"invite-organization-name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.Organization' | transloco\"\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>\n\n          <div class=\"row\">\n            <div class=\"col-12 text-end\">\n              <button type=\"button\"\n                class=\"btn btn-secondary me-3\"\n                (click)=\"form.reset(); totalRecordsUnFiltered = 0; back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                [disabled]=\"buttonBusy\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Invite' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";: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: color-mix(in srgb, var(--first, rgb(23 105 225)) 85%, #000000);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255);--dashboard_bg: rgb(255 255 255);--public-btn-radius: 24px}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}\n"] }]
+            args: [{ selector: 'pw-invite-users', standalone: false, 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=\"\">{{ 'Admin.Subscriptions.InviteNewUser' | transloco }}</h3>\n        <p>{{ 'Admin.Subscriptions.InviteNewUserDescription' | transloco }}</p>\n      </div>\n\n      <div class=\"p-2 mt-3\">\n        <form [formGroup]=\"form\"\n          (ngSubmit)=\"onSave()\">\n\n          <h3>{{ 'Admin.Subscriptions.Section.UserDetails' | transloco }}</h3>\n          <div class=\"row\">\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.FirstName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.FirstName' | transloco\"\n                name=\"first_name\"\n                controlId=\"invite-first_name\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.FirstName' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-first_name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InviteFirstName' | transloco\"\n                  formControlName=\"first_name\"\n                  [ngClass]=\"{\n                    'is-invalid': form.get('first_name').touched && form.get('first_name').invalid\n                  }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.LastName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.LastName' | transloco\"\n                name=\"last_name\"\n                controlId=\"invite-last_name\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.LastName' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-last_name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InviteLastName' | transloco\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.Email' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.Email' | transloco\"\n                name=\"email\"\n                controlId=\"invite-email\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Email' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-email\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Label.EmailPlaceholder' | transloco\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Admin.Subscriptions.ContactEmail' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.ContactEmail' | transloco\"\n                name=\"contact_email\"\n                controlId=\"invite-contact_email\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.ContactEmail' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-contact_email\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.ContactEmail' | transloco\"\n                  formControlName=\"contact_email\"\n                  [ngClass]=\"{\n                    'is-invalid': form.get('contact_email').touched && form.get('contact_email').invalid\n                  }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Admin.Subscriptions.InvoiceRecipientEmails' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.InvoiceRecipientEmails' | transloco\"\n                name=\"invoice_recipient_emails\"\n                controlId=\"invite-invoice_recipient_emails\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.InvoiceRecipientEmails' | transloco\">\n                <input type=\"text\"\n                  id=\"invite-invoice_recipient_emails\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.InvoiceRecipientEmails' | transloco\"\n                  formControlName=\"invoice_recipient_emails\"\n                  [ngClass]=\"{\n                    'is-invalid': form.get('invoice_recipient_emails').touched && form.get('invoice_recipient_emails').invalid\n                  }\" />\n              </pw-input-container>\n            </div>\n          </div>\n\n          <h3>{{ 'Admin.Subscriptions.Section.ProductSeats' | transloco }}</h3>\n          <div class=\"row\">\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Label.Product' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n                name=\"product_id\"\n                controlId=\"invite-product_id\"\n                [useAriaLabelledbyOnly]=\"true\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n                <p-autoComplete appendTo=\"body\" #refProduct\n                  [suggestions]=\"filteredProducts\"\n                  [ariaLabelledBy]=\"'invite-product_id-label'\"\n                  [ariaLabel]=\"'Label.Product' | transloco\"\n                  formControlName=\"product_id\"\n                  dataKey=\"id\"\n                  optionLabel=\"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]=\"'Admin.Subscriptions.Placeholder.SearchProducts' | transloco\"\n                  [inputStyleClass]=\"form.get('product_id').touched && form.get('product_id').invalid ? 'is-invalid' : ''\"\n                  [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container label=\"{{'Label.Seats' | transloco}}{{unitsText}}\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.Units' | transloco\"\n                name=\"units\"\n                controlId=\"invite-units\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.Units' | transloco\">\n                <input type=\"number\"\n                  id=\"invite-units\"\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-12 col-md-4\">\n              <pw-input-container [label]=\"'Admin.Subscriptions.MinUnits' | transloco\"\n                [showTooltip]=\"true\"\n                name=\"min_units\"\n                controlId=\"invite-min_units\"\n                [errorMsg]=\"'Admin.Subscriptions.Validation.MinUnits' | transloco\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.MinUnits' | transloco\">\n                <input type=\"number\"\n                  id=\"invite-min_units\"\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>\n\n          <h3>{{ 'Admin.Subscriptions.Section.Organization' | transloco }}</h3>\n          <div class=\"row\">\n            @if (organizationIndustries$ | async; as industries) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationIndustry' | transloco\"\n                  name=\"organization_industry_id\"\n                  controlId=\"invite-organization_industry_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationIndustry' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_industry_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationIndustry' | transloco\"\n                    [options]=\"industries['organization_industries']\"\n                    formControlName=\"organization_industry_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationIndustry' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            @if (organizationSizes$ | async; as sizes) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationSize' | transloco\"\n                  name=\"organization_size_id\"\n                  controlId=\"invite-organization_size_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationSize' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_size_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationSize' | transloco\"\n                    [options]=\"sizes['organization_sizes']\"\n                    formControlName=\"organization_size_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationSize' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            @if (organizationTypes$ | async; as types) {\n              <div class=\"mb-3 col-12 col-md-4\">\n                <pw-input-container [label]=\"'Organization.OrganizationType' | transloco\"\n                  name=\"organization_type_id\"\n                  controlId=\"invite-organization_type_id\"\n                  [useAriaLabelledbyOnly]=\"true\"\n                  [showTooltip]=\"true\"\n                  [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationType' | transloco\">\n                  <p-select\n                    [ariaLabelledBy]=\"'invite-organization_type_id-label'\"\n                    [ariaLabel]=\"'Organization.OrganizationType' | transloco\"\n                    [options]=\"types['organization_types']\"\n                    formControlName=\"organization_type_id\"\n                    [placeholder]=\"'Admin.Subscriptions.Placeholder.OrganizationType' | transloco\"\n                    optionValue=\"id\"\n                    optionLabel=\"name\">\n                  </p-select>\n                </pw-input-container>\n              </div>\n            }\n            <div class=\"mb-3 col-12 col-md-4\">\n              <pw-input-container [label]=\"'Organization.OrganizationName' | transloco\"\n                [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.Subscriptions.Tooltip.OrganizationName' | transloco\"\n                name=\"name\"\n                controlId=\"invite-organization-name\">\n                <input type=\"text\"\n                  id=\"invite-organization-name\"\n                  class=\"form-control\"\n                  [placeholder]=\"'Admin.Subscriptions.Placeholder.Organization' | transloco\"\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>\n\n          <div class=\"row\">\n            <div class=\"col-12 text-end\">\n              <button type=\"button\"\n                class=\"btn btn-secondary me-3\"\n                (click)=\"form.reset(); totalRecordsUnFiltered = 0; back()\">\n                {{ 'Button.Cancel' | transloco }}\n              </button>\n              <button type=\"submit\"\n                [buttonBusy]=\"buttonBusy\"\n                [disabled]=\"buttonBusy\"\n                class=\"btn btn-primary\">\n                {{ 'Button.Invite' | transloco }}\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";: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: color-mix(in srgb, var(--first, rgb(23 105 225)) 85%, #000000);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255);--dashboard_bg: rgb(255 255 255);--public-btn-radius: 24px}:host form>h3{display:block;border-top:1px solid #e2e5ea;margin-top:2rem;padding-top:1.25rem}:host form>h3:first-child{border-top:0;margin-top:.5rem;padding-top:0}\n"] }]
         }], ctorParameters: () => [{ type: i3$1.UntypedFormBuilder }, { type: i1.AdminService }, { type: i1$1.ProductService }, { type: i0.Injector }, { type: i1$1.CommonService }, { type: i0.ChangeDetectorRef }], propDecorators: { refProduct: [{
                 type: ViewChild,
                 args: ['refProduct']