vc-layout 2.0.0 → 3.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/README.md +24 -24
  2. package/esm2022/lib/components/global-alert/global-alert/global-alert.component.mjs +85 -85
  3. package/esm2022/lib/components/global-alert/global-alert.module.mjs +1 -1
  4. package/esm2022/lib/components/header/business-cycle/business-cycle.component.mjs +3 -3
  5. package/esm2022/lib/components/header/create-workflow/create-workflow.component.mjs +3 -3
  6. package/esm2022/lib/components/header/header-container/header-container.component.mjs +22 -14
  7. package/esm2022/lib/components/header/header.module.mjs +1 -1
  8. package/esm2022/lib/components/header/queue/queue.component.mjs +37 -37
  9. package/esm2022/lib/components/header/search/search.component.mjs +75 -77
  10. package/esm2022/lib/components/header/support/support.component.mjs +15 -15
  11. package/esm2022/lib/components/header/user-details/user-details.component.mjs +3 -5
  12. package/esm2022/lib/components/product-list/module-list/module-list.component.mjs +133 -80
  13. package/esm2022/lib/components/product-list/preference-list/preference-list.component.mjs +60 -63
  14. package/esm2022/lib/components/product-list/product-list-container/product-list-container.component.mjs +19 -19
  15. package/esm2022/lib/components/product-list/product-list.module.mjs +1 -1
  16. package/esm2022/lib/components/sub-menu/sub-menu-container/sub-menu-container.component.mjs +79 -79
  17. package/esm2022/lib/components/sub-menu/sub-menu.module.mjs +1 -1
  18. package/esm2022/lib/configurations.mjs +1 -1
  19. package/esm2022/lib/constants/alerts.constant.mjs +1 -1
  20. package/esm2022/lib/constants/api.constant.mjs +1 -1
  21. package/esm2022/lib/constants/app-url.constant.mjs +6 -5
  22. package/esm2022/lib/constants/assets.constants.mjs +1 -1
  23. package/esm2022/lib/constants/business-cycle.constant.mjs +1 -2
  24. package/esm2022/lib/constants/product-list.constant.mjs +1 -1
  25. package/esm2022/lib/shared/pipe/check-create-permission.pipe.mjs +1 -1
  26. package/esm2022/lib/shared/pipe/date-format.pipe.mjs +1 -1
  27. package/esm2022/lib/shared/pipe/get-file-url.pipe.mjs +1 -1
  28. package/esm2022/lib/shared/pipe/get-module-icon.pipe.mjs +1 -1
  29. package/esm2022/lib/shared/pipe/pipes.module.mjs +1 -1
  30. package/esm2022/lib/shared/services/RBAC.service.mjs +1 -1
  31. package/esm2022/lib/shared/services/api.service.mjs +1 -1
  32. package/esm2022/lib/shared/services/business-cycle.service.mjs +5 -12
  33. package/esm2022/lib/shared/services/layout.service.mjs +1 -1
  34. package/esm2022/lib/shared/services/product-list.service.mjs +6 -2
  35. package/esm2022/lib/shared/ui-kit/avatar/avatar/avatar.component.mjs +21 -21
  36. package/esm2022/lib/shared/ui-kit/avatar/avatar.module.mjs +1 -1
  37. package/esm2022/lib/shared/ui-kit/formgroup/checkbox/checkbox.component.mjs +3 -3
  38. package/esm2022/lib/shared/ui-kit/formgroup/click-outside.directive.mjs +1 -1
  39. package/esm2022/lib/shared/ui-kit/formgroup/cs-checkbox/cs-checkbox.component.mjs +3 -3
  40. package/esm2022/lib/shared/ui-kit/formgroup/cs-checkbox-indeterminate/cs-checkbox-indeterminate.component.mjs +3 -3
  41. package/esm2022/lib/shared/ui-kit/formgroup/cs-radio/cs-radio.component.mjs +3 -3
  42. package/esm2022/lib/shared/ui-kit/formgroup/cs-radio-group/cs-radio-group.component.mjs +3 -3
  43. package/esm2022/lib/shared/ui-kit/formgroup/cs-select/cs-select.component.mjs +3 -3
  44. package/esm2022/lib/shared/ui-kit/formgroup/cs-switch/cs-switch.component.mjs +3 -3
  45. package/esm2022/lib/shared/ui-kit/formgroup/formgroup.module.mjs +1 -1
  46. package/esm2022/lib/shared/ui-kit/formgroup/pipes/pascal.pipe.mjs +1 -1
  47. package/esm2022/lib/shared/ui-kit/formgroup/pipes/searchMultiSelect.pipe.mjs +1 -1
  48. package/esm2022/lib/shared/ui-kit/page-loader/page-loader.component.mjs +19 -33
  49. package/esm2022/lib/shared/ui-kit/popover/popover-event.directive.mjs +1 -1
  50. package/esm2022/lib/shared/ui-kit/popover/popover-longpress.directive.mjs +1 -1
  51. package/esm2022/lib/shared/ui-kit/popover/popover.component.mjs +3 -3
  52. package/esm2022/lib/shared/ui-kit/popover/popover.directive.mjs +1 -1
  53. package/esm2022/lib/shared/ui-kit/popover/popover.module.mjs +1 -1
  54. package/esm2022/lib/shared/ui-kit/popover/popover.service.mjs +1 -1
  55. package/esm2022/lib/shared/ui-kit/tooltip/tooltip.directive.mjs +1 -1
  56. package/esm2022/lib/shared/ui-kit/tooltip/tooltip.module.mjs +1 -1
  57. package/esm2022/lib/vc-layout.component.mjs +1 -1
  58. package/esm2022/lib/vc-layout.module.mjs +1 -1
  59. package/esm2022/lib/vc-layout.service.mjs +1 -1
  60. package/esm2022/public-api.mjs +1 -1
  61. package/fesm2022/vc-layout.mjs +581 -542
  62. package/fesm2022/vc-layout.mjs.map +1 -1
  63. package/lib/components/header/header-container/header-container.component.d.ts +2 -0
  64. package/lib/components/product-list/module-list/module-list.component.d.ts +10 -0
  65. package/package.json +1 -1
package/fesm2022/vc-layout.mjs CHANGED
@@ -320,9 +320,10 @@ const ASSETS = {
320
320
  };
321
321
 
322
322
  const IN_APP_URL = {
323
- MANAGE_RESPONSIBILITY: '/compliance/#/compliance/manage-responsibility?q={"byResponsibilities":{"type":["manage_responsibilities"],"subType":["CC"]},"byStatus":{"type":["active"],"subType":[]},"filterObject":{"responsibilityCenter":[],"entrustedBy":[],"entrustedTo":[],"riskIds":[],"responsibilityCategory":[]},"timePeriodDetails":{"type":"","selectedPeriod":"","selectedYear":""},"status":""}',
324
- MY_RESPONSIBILITY: '/compliance/#/compliance/manage-responsibility?q={"byResponsibilities":{"type":["my_responsibilities"],"subType":["CC"]},"byStatus":{"type":["active"],"subType":[]},"filterObject":{"responsibilityCenter":[],"entrustedBy":[],"entrustedTo":[],"riskIds":[],"responsibilityCategory":[]},"timePeriodDetails":{"type":"","selectedPeriod":"","selectedYear":""},"status":""}',
325
- QUEUE: '/compliance/#/compliance/manage-responsibility?q={"byResponsibilities":{"type":["responsibilities_in_queue"],"subType":["CC"]},"byStatus":{"type":["responsibilities_in_queue"],"subType":[]},"filterObject":{"responsibilityCenter":[],"entrustedBy":[],"entrustedTo":[],"riskIds":[],"responsibilityCategory":[]},"timePeriodDetails":{"type":"","selectedPeriod":"","selectedYear":""},"status":""}',
323
+ COMPLIANCE_V2: '/compliance/responsibilities',
324
+ MANAGE_RESPONSIBILITY: '/complianceops/responsibilities',
325
+ MY_RESPONSIBILITY: '/complianceops/responsibilities',
326
+ QUEUE: '/complianceops/responsibilities',
326
327
  PROGRAM: '/program/manage-program-categories/programs-overview',
327
328
  DASHBOARD: '/global-dashboard/',
328
329
  TO_DO_RESPONSIBILITIES: '/to-do-responsibilities',
@@ -333,7 +334,7 @@ const IN_APP_URL = {
333
334
  ASSURANCE: '/assurance/test_dashboard',
334
335
  AUDIT: '/global-dashboard/audit_dashboard?module=audit',
335
336
  ISSUE: '/global-dashboard/issue_dashboard?module=issue',
336
- ALL: '/global-dashboard/policy_dashboard?module=policy',
337
+ ALL: '/policyops/',
337
338
  EDIT_PROFILE: '/settings/settings/profile?edit_profile=true',
338
339
  DOWNLOAD_CENTER: '/downloads-center/',
339
340
  PASSWORD_RESET: `/settings/settings/account-access-and-settings/general-settings`,
@@ -482,7 +483,10 @@ class ProductListService {
482
483
  AUDIT: subscriptionList.audit_flag,
483
484
  ALL: subscriptionList.policy_flag,
484
485
  ASSESSMENT: subscriptionList.assessment_flag,
485
- CASE: subscriptionList.case_flag
486
+ CASE: subscriptionList.case_flag,
487
+ COMPLIANCE: subscriptionList.compliance_flag,
488
+ TO_DO_RESPONSIBILITIES: subscriptionList.compliance_flag,
489
+ DASHBOARD: subscriptionList.compliance_flag || subscriptionList.policy_flag
486
490
  };
487
491
  const code = Object.keys(flags).filter((key) => flags[key] === 0);
488
492
  return productList.filter((product) => !code.includes(product.code));
@@ -523,6 +527,7 @@ class ProductListService {
523
527
  * @returns The URL for the compliance page.
524
528
  */
525
529
  setComplianceURL() {
530
+ return IN_APP_URL.COMPLIANCE_V2;
526
531
  const permissions = this.rbacService.getRBACPermissions('compliance');
527
532
  return permissions.includes('CRMR')
528
533
  ? IN_APP_URL.MANAGE_RESPONSIBILITY
@@ -694,41 +699,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
694
699
 
695
700
  class PageLoaderComponent {
696
701
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PageLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
697
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PageLoaderComponent, selector: "app-page-loader", ngImport: i0, template: `<div class="index-loader-area">
698
- <div class="index-left-menu">
699
- <div class="index-left-logo"></div>
700
- <div class="index-left-logo"></div>
701
- <div class="index-left-logo"></div>
702
- <div class="index-left-icon"></div>
703
- <div class="index-left-icon"></div>
704
- <div class="index-left-icon"></div>
705
- <div class="index-left-icon"></div>
706
- <div class="index-left-icon"></div>
707
- <div class="index-left-icon"></div>
708
- <div class="index-left-icon"></div>
709
- <div class="index-left-icon"></div>
710
- <div class="index-left-icon"></div>
711
- </div>
712
- </div>`, isInline: true, styles: [".index-loader-area{display:flex}.index-left-menu{width:48px;background:#161b2f;height:100vh;position:relative}.index-left-logo{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.index-left-logo:before{background:#2d3860;border-radius:50%;content:\"\";width:20px;height:20px}.index-left-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.index-left-icon:before{background:#2d3860;border-radius:50%;content:\"\";width:20px;height:20px}.index-left-icon:last-of-type{position:absolute;bottom:0;left:0}@keyframes spin{to{transform:rotate(360deg)}}@media screen and (max-width: 1365px){.index-v-loader{width:100%}}.beamer_defaultBeamerSelector{bottom:10px!important;right:10px!important;width:30px!important;height:30px!important;background-color:#1e5dd3!important;background-size:60%!important}.beamer_defaultBeamerSelector.beamer_beamerSelector{z-index:2!important}\n"] }); }
702
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PageLoaderComponent, selector: "app-page-loader", ngImport: i0, template: `<div class="index-loader-area">
703
+ <div class="index-left-menu">
704
+ <div class="index-left-logo"></div>
705
+ <div class="index-left-logo"></div>
706
+ <div class="index-left-logo"></div>
707
+ <div class="index-left-icon"></div>
708
+ <div class="index-left-icon"></div>
709
+ </div>
710
+ </div>`, isInline: true, styles: [".index-loader-area{display:flex;height:100%}.index-left-menu{width:48px;background:#161b2f;height:100%;position:relative}.index-left-logo{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.index-left-logo:before{background:#2d3860;border-radius:50%;content:\"\";width:20px;height:20px}.index-left-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.index-left-icon:before{background:#2d3860;border-radius:50%;content:\"\";width:20px;height:20px}.index-left-icon:nth-last-child(2){position:absolute;bottom:3rem;left:0}.index-left-icon:last-of-type{position:absolute;bottom:0;left:0}@keyframes spin{to{transform:rotate(360deg)}}@media screen and (max-width: 1365px){.index-v-loader{width:100%}}.beamer_defaultBeamerSelector{bottom:10px!important;right:10px!important;width:30px!important;height:30px!important;background-color:#1e5dd3!important;background-size:60%!important}.beamer_defaultBeamerSelector.beamer_beamerSelector{z-index:2!important}\n"] }); }
713
711
  }
714
712
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PageLoaderComponent, decorators: [{
715
713
  type: Component,
716
- args: [{ selector: 'app-page-loader', template: `<div class="index-loader-area">
717
- <div class="index-left-menu">
718
- <div class="index-left-logo"></div>
719
- <div class="index-left-logo"></div>
720
- <div class="index-left-logo"></div>
721
- <div class="index-left-icon"></div>
722
- <div class="index-left-icon"></div>
723
- <div class="index-left-icon"></div>
724
- <div class="index-left-icon"></div>
725
- <div class="index-left-icon"></div>
726
- <div class="index-left-icon"></div>
727
- <div class="index-left-icon"></div>
728
- <div class="index-left-icon"></div>
729
- <div class="index-left-icon"></div>
730
- </div>
731
- </div>`, styles: [".index-loader-area{display:flex}.index-left-menu{width:48px;background:#161b2f;height:100vh;position:relative}.index-left-logo{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.index-left-logo:before{background:#2d3860;border-radius:50%;content:\"\";width:20px;height:20px}.index-left-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.index-left-icon:before{background:#2d3860;border-radius:50%;content:\"\";width:20px;height:20px}.index-left-icon:last-of-type{position:absolute;bottom:0;left:0}@keyframes spin{to{transform:rotate(360deg)}}@media screen and (max-width: 1365px){.index-v-loader{width:100%}}.beamer_defaultBeamerSelector{bottom:10px!important;right:10px!important;width:30px!important;height:30px!important;background-color:#1e5dd3!important;background-size:60%!important}.beamer_defaultBeamerSelector.beamer_beamerSelector{z-index:2!important}\n"] }]
714
+ args: [{ selector: 'app-page-loader', template: `<div class="index-loader-area">
715
+ <div class="index-left-menu">
716
+ <div class="index-left-logo"></div>
717
+ <div class="index-left-logo"></div>
718
+ <div class="index-left-logo"></div>
719
+ <div class="index-left-icon"></div>
720
+ <div class="index-left-icon"></div>
721
+ </div>
722
+ </div>`, styles: [".index-loader-area{display:flex;height:100%}.index-left-menu{width:48px;background:#161b2f;height:100%;position:relative}.index-left-logo{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.index-left-logo:before{background:#2d3860;border-radius:50%;content:\"\";width:20px;height:20px}.index-left-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.index-left-icon:before{background:#2d3860;border-radius:50%;content:\"\";width:20px;height:20px}.index-left-icon:nth-last-child(2){position:absolute;bottom:3rem;left:0}.index-left-icon:last-of-type{position:absolute;bottom:0;left:0}@keyframes spin{to{transform:rotate(360deg)}}@media screen and (max-width: 1365px){.index-v-loader{width:100%}}.beamer_defaultBeamerSelector{bottom:10px!important;right:10px!important;width:30px!important;height:30px!important;background-color:#1e5dd3!important;background-size:60%!important}.beamer_defaultBeamerSelector.beamer_beamerSelector{z-index:2!important}\n"] }]
732
723
  }] });
733
724
 
734
725
  class GetModuleIconPipe {
@@ -761,17 +752,70 @@ class ModuleListComponent {
761
752
  this.isSubMenuVisible = true;
762
753
  this.onToggleSubmenu = new EventEmitter();
763
754
  this.ASSETS = ASSETS;
764
- this.PRODUCT_LIST = [...new Set(PRODUCT_LIST)];
755
+ this.PRODUCT_LIST = [];
765
756
  this.assessmentPermission = [];
766
757
  this.apiService.getSubscriptionList();
767
758
  }
768
759
  ngOnInit() {
769
760
  this.setLoader();
761
+ this.initializeProductList();
770
762
  }
771
763
  ngOnChanges() {
772
764
  this.getUserDetails();
773
765
  this.checkModuleSubscription();
774
766
  }
767
+ /**
768
+ * Initialize the product list only after all required data is available
769
+ * This prevents icon flashing by building the filtered list incrementally
770
+ */
771
+ initializeProductList() {
772
+ this.apiService.loggedUserDetail$.subscribe((userData) => {
773
+ this.apiService.subscriptionDetail$.subscribe((subscriptionData) => {
774
+ if (userData && subscriptionData) {
775
+ this.buildFilteredProductList(subscriptionData);
776
+ }
777
+ });
778
+ });
779
+ }
780
+ /**
781
+ * Build the filtered product list incrementally and show all at once
782
+ * This prevents icon flashing by only showing the final filtered result
783
+ */
784
+ buildFilteredProductList(subscriptionData) {
785
+ let filteredList = [...new Set(PRODUCT_LIST)];
786
+ filteredList = this.productListService.subscribedProduct(filteredList, subscriptionData);
787
+ if (!this.assessmentPermissionCheck(this.rbacService.getRBACPermissions('assessment'))) {
788
+ filteredList = filteredList.filter((item) => item.code !== CODES[0]);
789
+ }
790
+ if (this.featureFlag.isFeatureEnabled('ff_cases_enabled')) {
791
+ filteredList = filteredList.filter((item) => item.code !== CODES[1]);
792
+ }
793
+ else {
794
+ filteredList = filteredList.filter((item) => item.code !== CODES[2]);
795
+ }
796
+ if (!this.isSubMenuVisible) {
797
+ filteredList = filteredList.filter((product) => product.code !== 'TOGGLE');
798
+ }
799
+ const hasToDo = filteredList.some((item) => item.code === 'TO_DO_RESPONSIBILITIES');
800
+ if (!hasToDo) {
801
+ filteredList = filteredList.map((item) => {
802
+ if (item.code !== 'DASHBOARD') {
803
+ return item;
804
+ }
805
+ const existingClass = item.class || '';
806
+ const classes = existingClass.split(' ').filter(Boolean);
807
+ if (!classes.includes('dashboard-full')) {
808
+ classes.push('dashboard-full');
809
+ }
810
+ return {
811
+ ...item,
812
+ class: classes.join(' '),
813
+ };
814
+ });
815
+ }
816
+ this.PRODUCT_LIST = filteredList;
817
+ this.setProductList();
818
+ }
775
819
  /**
776
820
  * Handles the toggle event of the submenu for each product.
777
821
  *
@@ -850,87 +894,87 @@ class ModuleListComponent {
850
894
  }
851
895
  }
852
896
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ModuleListComponent, deps: [{ token: ProductListService }, { token: ApiService }, { token: RbacService }], target: i0.ɵɵFactoryTarget.Component }); }
853
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ModuleListComponent, selector: "vc-module-list", inputs: { featureFlag: "featureFlag", activeModule: "activeModule", isSubMenuVisible: "isSubMenuVisible" }, outputs: { onToggleSubmenu: "onToggleSubmenu" }, usesOnChanges: true, ngImport: i0, template: `
854
- <app-page-loader *ngIf="isLoading"></app-page-loader>
855
- <ng-container *ngIf="!isLoading">
856
- <div class="module-list">
857
- <ul class="vx-p-0 vx-m-0">
858
- <li
859
- *ngFor="let eachProduct of PRODUCT_LIST"
860
- class="vx-d-flex vx-align-center vx-justify-center"
861
- [ngClass]="eachProduct.class"
862
- [class.active]="activeModule === eachProduct.code"
863
- >
864
- <a
865
- class="vx-d-flex vx-align-center vx-justify-center vx-w-100"
866
- [ngClass]="eachProduct?.linkClass"
867
- [arTooltip]="eachProduct.name"
868
- placement="right"
869
- type="black"
870
- delay="0"
871
- [tooltipMandatory]="true"
872
- [animate]="true"
873
- (click)="eachProduct?.callback(eachProduct)"
874
- ><img
875
- [src]="eachProduct.code | getModuleIcon : activeModule"
876
- alt=""
877
- width="16"
878
- height="16"
879
- />
880
- <ng-template *ngIf="eachProduct?.code !== 'TOGGLE'">
881
- [href]="eachProduct.url"
882
- </ng-template>
883
- <ng-template *ngElse>
884
- (click)="onSubMenuToggle(eachProduct)"
885
- </ng-template>
886
- </a>
887
- </li>
888
- </ul>
889
- </div>
890
- </ng-container>
891
- `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.module-list ul li{position:relative;z-index:1}.module-list ul li.active:before{background:#4681ef;border-radius:.25rem;content:\"\";position:absolute;top:.5rem;left:.5rem;width:2rem;height:2rem;z-index:-1}@media screen and (max-width: 1366px){.module-list ul li.active:before{top:.25rem}}.module-list ul li.dashboard-list:after{background:#343952;border-radius:.25rem .25rem 0 0;content:\"\";position:absolute;top:.375rem;left:.375rem;width:2.25rem;height:2.625rem;z-index:-2}@media screen and (max-width: 1366px){.module-list ul li.dashboard-list:after{top:.125rem;height:2.375rem}}.module-list ul li.toDoResponsibility-list:after{background:#343952;border-radius:0 0 .25rem .25rem;content:\"\";position:absolute;bottom:.375rem;left:.375rem;width:2.25rem;height:2.625rem;z-index:-2}@media screen and (max-width: 1366px){.module-list ul li.toDoResponsibility-list:after{bottom:.125rem;height:2.375rem}}.module-list ul li a{height:3rem}@media screen and (max-width: 1366px){.module-list ul li a{height:2.5rem}}.module-list ul li a.vc-hamburger{height:2rem}.module-list ul li a img{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PageLoaderComponent, selector: "app-page-loader" }, { kind: "pipe", type: GetModuleIconPipe, name: "getModuleIcon" }] }); }
897
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ModuleListComponent, selector: "vc-module-list", inputs: { featureFlag: "featureFlag", activeModule: "activeModule", isSubMenuVisible: "isSubMenuVisible" }, outputs: { onToggleSubmenu: "onToggleSubmenu" }, usesOnChanges: true, ngImport: i0, template: `
898
+ <app-page-loader *ngIf="isLoading"></app-page-loader>
899
+ <ng-container *ngIf="!isLoading">
900
+ <div class="module-list">
901
+ <ul class="vx-p-0 vx-m-0">
902
+ <li
903
+ *ngFor="let eachProduct of PRODUCT_LIST"
904
+ class="vx-d-flex vx-align-center vx-justify-center"
905
+ [ngClass]="eachProduct.class"
906
+ [class.active]="activeModule === eachProduct.code"
907
+ >
908
+ <a
909
+ class="vx-d-flex vx-align-center vx-justify-center vx-w-100"
910
+ [ngClass]="eachProduct?.linkClass"
911
+ [arTooltip]="eachProduct.name"
912
+ placement="right"
913
+ type="black"
914
+ delay="0"
915
+ [tooltipMandatory]="true"
916
+ [animate]="true"
917
+ (click)="eachProduct?.callback(eachProduct)"
918
+ ><img
919
+ [src]="eachProduct.code | getModuleIcon : activeModule"
920
+ alt=""
921
+ width="16"
922
+ height="16"
923
+ />
924
+ <ng-template *ngIf="eachProduct?.code !== 'TOGGLE'">
925
+ [href]="eachProduct.url"
926
+ </ng-template>
927
+ <ng-template *ngElse>
928
+ (click)="onSubMenuToggle(eachProduct)"
929
+ </ng-template>
930
+ </a>
931
+ </li>
932
+ </ul>
933
+ </div>
934
+ </ng-container>
935
+ `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.module-list ul li{position:relative;z-index:1}.module-list ul li.active:before{background:#4681ef;border-radius:.25rem;content:\"\";position:absolute;top:.5rem;left:.5rem;width:2rem;height:2rem;z-index:-1}@media screen and (max-width: 1366px){.module-list ul li.active:before{top:.25rem}}.module-list ul li.dashboard-list:after{background:#343952;border-radius:.25rem .25rem 0 0;content:\"\";position:absolute;top:.375rem;left:.375rem;width:2.25rem;height:2.625rem;z-index:-2}@media screen and (max-width: 1366px){.module-list ul li.dashboard-list:after{top:.125rem;height:2.375rem}}.module-list ul li.dashboard-list.dashboard-full:after{border-radius:.25rem;top:.375rem;bottom:.375rem;height:auto}@media screen and (max-width: 1366px){.module-list ul li.dashboard-list.dashboard-full:after{top:.125rem;bottom:.125rem}}.module-list ul li.toDoResponsibility-list:after{background:#343952;border-radius:0 0 .25rem .25rem;content:\"\";position:absolute;bottom:.375rem;left:.375rem;width:2.25rem;height:2.625rem;z-index:-2}@media screen and (max-width: 1366px){.module-list ul li.toDoResponsibility-list:after{bottom:.125rem;height:2.375rem}}.module-list ul li a{height:3rem}@media screen and (max-width: 1366px){.module-list ul li a{height:2.5rem}}.module-list ul li a.vc-hamburger{height:2rem}.module-list ul li a img{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PageLoaderComponent, selector: "app-page-loader" }, { kind: "pipe", type: GetModuleIconPipe, name: "getModuleIcon" }] }); }
892
936
  }
893
937
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ModuleListComponent, decorators: [{
894
938
  type: Component,
895
- args: [{ selector: 'vc-module-list', template: `
896
- <app-page-loader *ngIf="isLoading"></app-page-loader>
897
- <ng-container *ngIf="!isLoading">
898
- <div class="module-list">
899
- <ul class="vx-p-0 vx-m-0">
900
- <li
901
- *ngFor="let eachProduct of PRODUCT_LIST"
902
- class="vx-d-flex vx-align-center vx-justify-center"
903
- [ngClass]="eachProduct.class"
904
- [class.active]="activeModule === eachProduct.code"
905
- >
906
- <a
907
- class="vx-d-flex vx-align-center vx-justify-center vx-w-100"
908
- [ngClass]="eachProduct?.linkClass"
909
- [arTooltip]="eachProduct.name"
910
- placement="right"
911
- type="black"
912
- delay="0"
913
- [tooltipMandatory]="true"
914
- [animate]="true"
915
- (click)="eachProduct?.callback(eachProduct)"
916
- ><img
917
- [src]="eachProduct.code | getModuleIcon : activeModule"
918
- alt=""
919
- width="16"
920
- height="16"
921
- />
922
- <ng-template *ngIf="eachProduct?.code !== 'TOGGLE'">
923
- [href]="eachProduct.url"
924
- </ng-template>
925
- <ng-template *ngElse>
926
- (click)="onSubMenuToggle(eachProduct)"
927
- </ng-template>
928
- </a>
929
- </li>
930
- </ul>
931
- </div>
932
- </ng-container>
933
- `, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.module-list ul li{position:relative;z-index:1}.module-list ul li.active:before{background:#4681ef;border-radius:.25rem;content:\"\";position:absolute;top:.5rem;left:.5rem;width:2rem;height:2rem;z-index:-1}@media screen and (max-width: 1366px){.module-list ul li.active:before{top:.25rem}}.module-list ul li.dashboard-list:after{background:#343952;border-radius:.25rem .25rem 0 0;content:\"\";position:absolute;top:.375rem;left:.375rem;width:2.25rem;height:2.625rem;z-index:-2}@media screen and (max-width: 1366px){.module-list ul li.dashboard-list:after{top:.125rem;height:2.375rem}}.module-list ul li.toDoResponsibility-list:after{background:#343952;border-radius:0 0 .25rem .25rem;content:\"\";position:absolute;bottom:.375rem;left:.375rem;width:2.25rem;height:2.625rem;z-index:-2}@media screen and (max-width: 1366px){.module-list ul li.toDoResponsibility-list:after{bottom:.125rem;height:2.375rem}}.module-list ul li a{height:3rem}@media screen and (max-width: 1366px){.module-list ul li a{height:2.5rem}}.module-list ul li a.vc-hamburger{height:2rem}.module-list ul li a img{pointer-events:none}\n"] }]
939
+ args: [{ selector: 'vc-module-list', template: `
940
+ <app-page-loader *ngIf="isLoading"></app-page-loader>
941
+ <ng-container *ngIf="!isLoading">
942
+ <div class="module-list">
943
+ <ul class="vx-p-0 vx-m-0">
944
+ <li
945
+ *ngFor="let eachProduct of PRODUCT_LIST"
946
+ class="vx-d-flex vx-align-center vx-justify-center"
947
+ [ngClass]="eachProduct.class"
948
+ [class.active]="activeModule === eachProduct.code"
949
+ >
950
+ <a
951
+ class="vx-d-flex vx-align-center vx-justify-center vx-w-100"
952
+ [ngClass]="eachProduct?.linkClass"
953
+ [arTooltip]="eachProduct.name"
954
+ placement="right"
955
+ type="black"
956
+ delay="0"
957
+ [tooltipMandatory]="true"
958
+ [animate]="true"
959
+ (click)="eachProduct?.callback(eachProduct)"
960
+ ><img
961
+ [src]="eachProduct.code | getModuleIcon : activeModule"
962
+ alt=""
963
+ width="16"
964
+ height="16"
965
+ />
966
+ <ng-template *ngIf="eachProduct?.code !== 'TOGGLE'">
967
+ [href]="eachProduct.url"
968
+ </ng-template>
969
+ <ng-template *ngElse>
970
+ (click)="onSubMenuToggle(eachProduct)"
971
+ </ng-template>
972
+ </a>
973
+ </li>
974
+ </ul>
975
+ </div>
976
+ </ng-container>
977
+ `, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.module-list ul li{position:relative;z-index:1}.module-list ul li.active:before{background:#4681ef;border-radius:.25rem;content:\"\";position:absolute;top:.5rem;left:.5rem;width:2rem;height:2rem;z-index:-1}@media screen and (max-width: 1366px){.module-list ul li.active:before{top:.25rem}}.module-list ul li.dashboard-list:after{background:#343952;border-radius:.25rem .25rem 0 0;content:\"\";position:absolute;top:.375rem;left:.375rem;width:2.25rem;height:2.625rem;z-index:-2}@media screen and (max-width: 1366px){.module-list ul li.dashboard-list:after{top:.125rem;height:2.375rem}}.module-list ul li.dashboard-list.dashboard-full:after{border-radius:.25rem;top:.375rem;bottom:.375rem;height:auto}@media screen and (max-width: 1366px){.module-list ul li.dashboard-list.dashboard-full:after{top:.125rem;bottom:.125rem}}.module-list ul li.toDoResponsibility-list:after{background:#343952;border-radius:0 0 .25rem .25rem;content:\"\";position:absolute;bottom:.375rem;left:.375rem;width:2.25rem;height:2.625rem;z-index:-2}@media screen and (max-width: 1366px){.module-list ul li.toDoResponsibility-list:after{bottom:.125rem;height:2.375rem}}.module-list ul li a{height:3rem}@media screen and (max-width: 1366px){.module-list ul li a{height:2.5rem}}.module-list ul li a.vc-hamburger{height:2rem}.module-list ul li a img{pointer-events:none}\n"] }]
934
978
  }], ctorParameters: function () { return [{ type: ProductListService }, { type: ApiService }, { type: RbacService }]; }, propDecorators: { featureFlag: [{
935
979
  type: Input
936
980
  }], activeModule: [{
@@ -965,69 +1009,67 @@ class PreferenceListComponent {
965
1009
  });
966
1010
  }
967
1011
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PreferenceListComponent, deps: [{ token: LayoutService }, { token: ApiService }], target: i0.ɵɵFactoryTarget.Component }); }
968
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PreferenceListComponent, selector: "vc-preference-list", inputs: { activeModule: "activeModule" }, ngImport: i0, template: `
969
- <app-page-loader *ngIf="isLoading"></app-page-loader>
970
- <ng-container *ngIf="!isLoading">
971
- <div class="preference-list">
972
- <ul class="vx-p-0 vx-m-0">
973
- <li
974
- *ngFor="let eachItems of PREFERENCE_LIST"
975
- class="vx-d-flex vx-align-center vx-justify-center"
976
- [class.active]="activeModule === eachItems.code"
977
- >
978
- <a
979
- class="vx-d-flex vx-align-center vx-justify-center vx-w-100"
980
- [arTooltip]="eachItems?.name"
981
- placement="right"
982
- type="black"
983
- delay="0"
984
- [tooltipMandatory]="true"
985
- [animate]="true"
986
- [href]="eachItems?.url"
987
- ><img
988
- [src]="eachItems.code | getModuleIcon : activeModule"
989
- alt=""
990
- width="16"
991
- height="16"
992
- /></a>
993
- </li>
994
- </ul>
995
- </div>
996
- </ng-container>
997
- `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.preference-list{width:3rem;position:absolute;bottom:0;left:0}.preference-list ul li{position:relative;z-index:1}.preference-list ul li.active:before{background:#4681ef;border-radius:.25rem;content:\"\";position:absolute;top:.5rem;left:.5rem;width:2rem;height:2rem;z-index:-1}@media screen and (max-width: 1366px){.preference-list ul li.active:before{top:.25rem}}.preference-list ul li a{height:3rem}@media screen and (max-width: 1366px){.preference-list ul li a{height:2.5rem}}.preference-list ul li a img{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PageLoaderComponent, selector: "app-page-loader" }, { kind: "pipe", type: GetModuleIconPipe, name: "getModuleIcon" }] }); }
1012
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PreferenceListComponent, selector: "vc-preference-list", inputs: { activeModule: "activeModule" }, ngImport: i0, template: `
1013
+ <ng-container *ngIf="!isLoading">
1014
+ <div class="preference-list">
1015
+ <ul class="vx-p-0 vx-m-0">
1016
+ <li
1017
+ *ngFor="let eachItems of PREFERENCE_LIST"
1018
+ class="vx-d-flex vx-align-center vx-justify-center"
1019
+ [class.active]="activeModule === eachItems.code"
1020
+ >
1021
+ <a
1022
+ class="vx-d-flex vx-align-center vx-justify-center vx-w-100"
1023
+ [arTooltip]="eachItems?.name"
1024
+ placement="right"
1025
+ type="black"
1026
+ delay="0"
1027
+ [tooltipMandatory]="true"
1028
+ [animate]="true"
1029
+ [href]="eachItems?.url"
1030
+ ><img
1031
+ [src]="eachItems.code | getModuleIcon : activeModule"
1032
+ alt=""
1033
+ width="16"
1034
+ height="16"
1035
+ /></a>
1036
+ </li>
1037
+ </ul>
1038
+ </div>
1039
+ </ng-container>
1040
+ `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.preference-list{width:3rem;position:absolute;bottom:0;left:0}.preference-list ul li{position:relative;z-index:1}.preference-list ul li.active:before{background:#4681ef;border-radius:.25rem;content:\"\";position:absolute;top:.5rem;left:.5rem;width:2rem;height:2rem;z-index:-1}@media screen and (max-width: 1366px){.preference-list ul li.active:before{top:.25rem}}.preference-list ul li a{height:3rem}@media screen and (max-width: 1366px){.preference-list ul li a{height:2.5rem}}.preference-list ul li a img{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "pipe", type: GetModuleIconPipe, name: "getModuleIcon" }] }); }
998
1041
  }
999
1042
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PreferenceListComponent, decorators: [{
1000
1043
  type: Component,
1001
- args: [{ selector: 'vc-preference-list', template: `
1002
- <app-page-loader *ngIf="isLoading"></app-page-loader>
1003
- <ng-container *ngIf="!isLoading">
1004
- <div class="preference-list">
1005
- <ul class="vx-p-0 vx-m-0">
1006
- <li
1007
- *ngFor="let eachItems of PREFERENCE_LIST"
1008
- class="vx-d-flex vx-align-center vx-justify-center"
1009
- [class.active]="activeModule === eachItems.code"
1010
- >
1011
- <a
1012
- class="vx-d-flex vx-align-center vx-justify-center vx-w-100"
1013
- [arTooltip]="eachItems?.name"
1014
- placement="right"
1015
- type="black"
1016
- delay="0"
1017
- [tooltipMandatory]="true"
1018
- [animate]="true"
1019
- [href]="eachItems?.url"
1020
- ><img
1021
- [src]="eachItems.code | getModuleIcon : activeModule"
1022
- alt=""
1023
- width="16"
1024
- height="16"
1025
- /></a>
1026
- </li>
1027
- </ul>
1028
- </div>
1029
- </ng-container>
1030
- `, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.preference-list{width:3rem;position:absolute;bottom:0;left:0}.preference-list ul li{position:relative;z-index:1}.preference-list ul li.active:before{background:#4681ef;border-radius:.25rem;content:\"\";position:absolute;top:.5rem;left:.5rem;width:2rem;height:2rem;z-index:-1}@media screen and (max-width: 1366px){.preference-list ul li.active:before{top:.25rem}}.preference-list ul li a{height:3rem}@media screen and (max-width: 1366px){.preference-list ul li a{height:2.5rem}}.preference-list ul li a img{pointer-events:none}\n"] }]
1044
+ args: [{ selector: 'vc-preference-list', template: `
1045
+ <ng-container *ngIf="!isLoading">
1046
+ <div class="preference-list">
1047
+ <ul class="vx-p-0 vx-m-0">
1048
+ <li
1049
+ *ngFor="let eachItems of PREFERENCE_LIST"
1050
+ class="vx-d-flex vx-align-center vx-justify-center"
1051
+ [class.active]="activeModule === eachItems.code"
1052
+ >
1053
+ <a
1054
+ class="vx-d-flex vx-align-center vx-justify-center vx-w-100"
1055
+ [arTooltip]="eachItems?.name"
1056
+ placement="right"
1057
+ type="black"
1058
+ delay="0"
1059
+ [tooltipMandatory]="true"
1060
+ [animate]="true"
1061
+ [href]="eachItems?.url"
1062
+ ><img
1063
+ [src]="eachItems.code | getModuleIcon : activeModule"
1064
+ alt=""
1065
+ width="16"
1066
+ height="16"
1067
+ /></a>
1068
+ </li>
1069
+ </ul>
1070
+ </div>
1071
+ </ng-container>
1072
+ `, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.preference-list{width:3rem;position:absolute;bottom:0;left:0}.preference-list ul li{position:relative;z-index:1}.preference-list ul li.active:before{background:#4681ef;border-radius:.25rem;content:\"\";position:absolute;top:.5rem;left:.5rem;width:2rem;height:2rem;z-index:-1}@media screen and (max-width: 1366px){.preference-list ul li.active:before{top:.25rem}}.preference-list ul li a{height:3rem}@media screen and (max-width: 1366px){.preference-list ul li a{height:2.5rem}}.preference-list ul li a img{pointer-events:none}\n"] }]
1031
1073
  }], ctorParameters: function () { return [{ type: LayoutService }, { type: ApiService }]; }, propDecorators: { activeModule: [{
1032
1074
  type: Input
1033
1075
  }] } });
@@ -1039,27 +1081,27 @@ class ProductListContainerComponent {
1039
1081
  this.onToggleSubmenu = new EventEmitter();
1040
1082
  }
1041
1083
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ProductListContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1042
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ProductListContainerComponent, selector: "vc-product-list-container", inputs: { featureFlag: "featureFlag", activeModule: "activeModule", isSubMenuVisible: "isSubMenuVisible" }, outputs: { onToggleSubmenu: "onToggleSubmenu" }, ngImport: i0, template: `<div class="product-list-container">
1043
- <vc-module-list
1044
- [featureFlag]="featureFlag"
1045
- [activeModule]="activeModule"
1046
- [isSubMenuVisible]="isSubMenuVisible"
1047
- (onToggleSubmenu)="onToggleSubmenu.emit()"
1048
- ></vc-module-list>
1049
- <vc-preference-list [activeModule]="activeModule"></vc-preference-list>
1050
- </div> `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.product-list-container{width:3rem;height:100%;position:relative;z-index:1}\n"], dependencies: [{ kind: "component", type: ModuleListComponent, selector: "vc-module-list", inputs: ["featureFlag", "activeModule", "isSubMenuVisible"], outputs: ["onToggleSubmenu"] }, { kind: "component", type: PreferenceListComponent, selector: "vc-preference-list", inputs: ["activeModule"] }] }); }
1084
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ProductListContainerComponent, selector: "vc-product-list-container", inputs: { featureFlag: "featureFlag", activeModule: "activeModule", isSubMenuVisible: "isSubMenuVisible" }, outputs: { onToggleSubmenu: "onToggleSubmenu" }, ngImport: i0, template: `<div class="product-list-container">
1085
+ <vc-module-list
1086
+ [featureFlag]="featureFlag"
1087
+ [activeModule]="activeModule"
1088
+ [isSubMenuVisible]="isSubMenuVisible"
1089
+ (onToggleSubmenu)="onToggleSubmenu.emit()"
1090
+ ></vc-module-list>
1091
+ <vc-preference-list [activeModule]="activeModule"></vc-preference-list>
1092
+ </div> `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.product-list-container{width:3rem;height:100%;position:relative;z-index:1}\n"], dependencies: [{ kind: "component", type: ModuleListComponent, selector: "vc-module-list", inputs: ["featureFlag", "activeModule", "isSubMenuVisible"], outputs: ["onToggleSubmenu"] }, { kind: "component", type: PreferenceListComponent, selector: "vc-preference-list", inputs: ["activeModule"] }] }); }
1051
1093
  }
1052
1094
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ProductListContainerComponent, decorators: [{
1053
1095
  type: Component,
1054
- args: [{ selector: 'vc-product-list-container', template: `<div class="product-list-container">
1055
- <vc-module-list
1056
- [featureFlag]="featureFlag"
1057
- [activeModule]="activeModule"
1058
- [isSubMenuVisible]="isSubMenuVisible"
1059
- (onToggleSubmenu)="onToggleSubmenu.emit()"
1060
- ></vc-module-list>
1061
- <vc-preference-list [activeModule]="activeModule"></vc-preference-list>
1062
- </div> `, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.product-list-container{width:3rem;height:100%;position:relative;z-index:1}\n"] }]
1096
+ args: [{ selector: 'vc-product-list-container', template: `<div class="product-list-container">
1097
+ <vc-module-list
1098
+ [featureFlag]="featureFlag"
1099
+ [activeModule]="activeModule"
1100
+ [isSubMenuVisible]="isSubMenuVisible"
1101
+ (onToggleSubmenu)="onToggleSubmenu.emit()"
1102
+ ></vc-module-list>
1103
+ <vc-preference-list [activeModule]="activeModule"></vc-preference-list>
1104
+ </div> `, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.product-list-container{width:3rem;height:100%;position:relative;z-index:1}\n"] }]
1063
1105
  }], propDecorators: { featureFlag: [{
1064
1106
  type: Input
1065
1107
  }], activeModule: [{
@@ -1071,7 +1113,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
1071
1113
  }] } });
1072
1114
 
1073
1115
  const BUSINESS_CYCLE_URL = [
1074
- '/global-dashboard/',
1075
1116
  '/global-dashboard/compliance_dashboard',
1076
1117
  '/global-dashboard/audit_dashboard',
1077
1118
  '/global-dashboard/issue_dashboard',
@@ -1212,93 +1253,93 @@ class GlobalAlertComponent {
1212
1253
  return `https://${window.location.host}${IN_APP_URL.PASSWORD_RESET}`;
1213
1254
  }
1214
1255
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GlobalAlertComponent, deps: [{ token: ApiService }], target: i0.ɵɵFactoryTarget.Component }); }
1215
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GlobalAlertComponent, selector: "vc-global-alert", inputs: { feature: "feature" }, outputs: { subscriptionStatus: "subscriptionStatus" }, ngImport: i0, template: `
1216
- <div
1217
- *ngIf="messages.length > 0"
1218
- class="global-alert vx-d-flex vx-align-center vx-justify-center"
1219
- [class.expired]="messages[activeIndex]?.class === 'HIGH'"
1220
- >
1221
- <i class="icons vx-fs-12 vx-mr-2">&#xe930;</i>
1222
- <!-- <span class="vx-fs-13"
1223
- >Email notifications have been paused by the Key Admin. You will not be able
1224
- to edit your email notifications until the Key Admin turns it back on.</span
1225
- > -->
1226
- <span
1227
- class="vx-fs-13"
1228
- [innerHTML]="messages[activeIndex]?.message"
1229
- ></span>
1230
- <div
1231
- *ngIf="messages.length > 1"
1232
- class="global-alert-action vx-d-flex vx-align-center vx-lh-6"
1233
- >
1234
- <button
1235
- [class.disabled]="activeIndex === 0"
1236
- (click)="activeIndex = activeIndex - 1"
1237
- class="vx-fs-12 vx-p-0 vx-m-0 vx-mr-4 vx-d-flex vx-align-center disabled"
1238
- >
1239
- <i class="icons">&#xe96b;</i>
1240
- </button>
1241
- <span class="vx-fs-13 vx-txt-white">{{ activeIndex + 1 }}</span>
1242
- <span class="divider vx-fs-11 vx-txt-white">/</span>
1243
- <span class="vx-fs-13 vx-fw-600 vx-txt-white">{{
1244
- messages.length
1245
- }}</span>
1246
-
1247
- <button
1248
- (click)="activeIndex = activeIndex + 1"
1249
- [class.disabled]="activeIndex === messages.length - 1"
1250
- class="vx-fs-12 vx-p-0 vx-m-0 vx-ml-4 vx-d-flex vx-align-center"
1251
- >
1252
- <i class="icons">&#xe970;</i>
1253
- </button>
1254
- </div>
1255
- </div>
1256
- `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";::ng-deep .global-alert{background:#343952;height:2.25rem;color:#f7d873}::ng-deep .global-alert.expired{color:#e38b7a}::ng-deep .global-alert.expired a{color:#fac3b7;margin-left:.5rem}::ng-deep .global-alert a{color:#f7d873}::ng-deep .global-alert-action{position:absolute;right:.75rem;top:.375rem}::ng-deep .global-alert-action span{letter-spacing:2px}::ng-deep .global-alert-action button{background:transparent;border-radius:0;border:none;color:#fff}::ng-deep .global-alert-action button.disabled{pointer-events:none;opacity:.5;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
1256
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GlobalAlertComponent, selector: "vc-global-alert", inputs: { feature: "feature" }, outputs: { subscriptionStatus: "subscriptionStatus" }, ngImport: i0, template: `
1257
+ <div
1258
+ *ngIf="messages.length > 0"
1259
+ class="global-alert vx-d-flex vx-align-center vx-justify-center"
1260
+ [class.expired]="messages[activeIndex]?.class === 'HIGH'"
1261
+ >
1262
+ <i class="icons vx-fs-12 vx-mr-2">&#xe930;</i>
1263
+ <!-- <span class="vx-fs-13"
1264
+ >Email notifications have been paused by the Key Admin. You will not be able
1265
+ to edit your email notifications until the Key Admin turns it back on.</span
1266
+ > -->
1267
+ <span
1268
+ class="vx-fs-13"
1269
+ [innerHTML]="messages[activeIndex]?.message"
1270
+ ></span>
1271
+ <div
1272
+ *ngIf="messages.length > 1"
1273
+ class="global-alert-action vx-d-flex vx-align-center vx-lh-6"
1274
+ >
1275
+ <button
1276
+ [class.disabled]="activeIndex === 0"
1277
+ (click)="activeIndex = activeIndex - 1"
1278
+ class="vx-fs-12 vx-p-0 vx-m-0 vx-mr-4 vx-d-flex vx-align-center disabled"
1279
+ >
1280
+ <i class="icons">&#xe96b;</i>
1281
+ </button>
1282
+ <span class="vx-fs-13 vx-txt-white">{{ activeIndex + 1 }}</span>
1283
+ <span class="divider vx-fs-11 vx-txt-white">/</span>
1284
+ <span class="vx-fs-13 vx-fw-600 vx-txt-white">{{
1285
+ messages.length
1286
+ }}</span>
1287
+
1288
+ <button
1289
+ (click)="activeIndex = activeIndex + 1"
1290
+ [class.disabled]="activeIndex === messages.length - 1"
1291
+ class="vx-fs-12 vx-p-0 vx-m-0 vx-ml-4 vx-d-flex vx-align-center"
1292
+ >
1293
+ <i class="icons">&#xe970;</i>
1294
+ </button>
1295
+ </div>
1296
+ </div>
1297
+ `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";::ng-deep .global-alert{background:#343952;height:2.25rem;color:#f7d873}::ng-deep .global-alert.expired{color:#e38b7a}::ng-deep .global-alert.expired a{color:#fac3b7;margin-left:.5rem}::ng-deep .global-alert a{color:#f7d873}::ng-deep .global-alert-action{position:absolute;right:.75rem;top:.375rem}::ng-deep .global-alert-action span{letter-spacing:2px}::ng-deep .global-alert-action button{background:transparent;border-radius:0;border:none;color:#fff}::ng-deep .global-alert-action button.disabled{pointer-events:none;opacity:.5;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
1257
1298
  }
1258
1299
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GlobalAlertComponent, decorators: [{
1259
1300
  type: Component,
1260
- args: [{ selector: 'vc-global-alert', template: `
1261
- <div
1262
- *ngIf="messages.length > 0"
1263
- class="global-alert vx-d-flex vx-align-center vx-justify-center"
1264
- [class.expired]="messages[activeIndex]?.class === 'HIGH'"
1265
- >
1266
- <i class="icons vx-fs-12 vx-mr-2">&#xe930;</i>
1267
- <!-- <span class="vx-fs-13"
1268
- >Email notifications have been paused by the Key Admin. You will not be able
1269
- to edit your email notifications until the Key Admin turns it back on.</span
1270
- > -->
1271
- <span
1272
- class="vx-fs-13"
1273
- [innerHTML]="messages[activeIndex]?.message"
1274
- ></span>
1275
- <div
1276
- *ngIf="messages.length > 1"
1277
- class="global-alert-action vx-d-flex vx-align-center vx-lh-6"
1278
- >
1279
- <button
1280
- [class.disabled]="activeIndex === 0"
1281
- (click)="activeIndex = activeIndex - 1"
1282
- class="vx-fs-12 vx-p-0 vx-m-0 vx-mr-4 vx-d-flex vx-align-center disabled"
1283
- >
1284
- <i class="icons">&#xe96b;</i>
1285
- </button>
1286
- <span class="vx-fs-13 vx-txt-white">{{ activeIndex + 1 }}</span>
1287
- <span class="divider vx-fs-11 vx-txt-white">/</span>
1288
- <span class="vx-fs-13 vx-fw-600 vx-txt-white">{{
1289
- messages.length
1290
- }}</span>
1291
-
1292
- <button
1293
- (click)="activeIndex = activeIndex + 1"
1294
- [class.disabled]="activeIndex === messages.length - 1"
1295
- class="vx-fs-12 vx-p-0 vx-m-0 vx-ml-4 vx-d-flex vx-align-center"
1296
- >
1297
- <i class="icons">&#xe970;</i>
1298
- </button>
1299
- </div>
1300
- </div>
1301
- `, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";::ng-deep .global-alert{background:#343952;height:2.25rem;color:#f7d873}::ng-deep .global-alert.expired{color:#e38b7a}::ng-deep .global-alert.expired a{color:#fac3b7;margin-left:.5rem}::ng-deep .global-alert a{color:#f7d873}::ng-deep .global-alert-action{position:absolute;right:.75rem;top:.375rem}::ng-deep .global-alert-action span{letter-spacing:2px}::ng-deep .global-alert-action button{background:transparent;border-radius:0;border:none;color:#fff}::ng-deep .global-alert-action button.disabled{pointer-events:none;opacity:.5;color:#fff}\n"] }]
1301
+ args: [{ selector: 'vc-global-alert', template: `
1302
+ <div
1303
+ *ngIf="messages.length > 0"
1304
+ class="global-alert vx-d-flex vx-align-center vx-justify-center"
1305
+ [class.expired]="messages[activeIndex]?.class === 'HIGH'"
1306
+ >
1307
+ <i class="icons vx-fs-12 vx-mr-2">&#xe930;</i>
1308
+ <!-- <span class="vx-fs-13"
1309
+ >Email notifications have been paused by the Key Admin. You will not be able
1310
+ to edit your email notifications until the Key Admin turns it back on.</span
1311
+ > -->
1312
+ <span
1313
+ class="vx-fs-13"
1314
+ [innerHTML]="messages[activeIndex]?.message"
1315
+ ></span>
1316
+ <div
1317
+ *ngIf="messages.length > 1"
1318
+ class="global-alert-action vx-d-flex vx-align-center vx-lh-6"
1319
+ >
1320
+ <button
1321
+ [class.disabled]="activeIndex === 0"
1322
+ (click)="activeIndex = activeIndex - 1"
1323
+ class="vx-fs-12 vx-p-0 vx-m-0 vx-mr-4 vx-d-flex vx-align-center disabled"
1324
+ >
1325
+ <i class="icons">&#xe96b;</i>
1326
+ </button>
1327
+ <span class="vx-fs-13 vx-txt-white">{{ activeIndex + 1 }}</span>
1328
+ <span class="divider vx-fs-11 vx-txt-white">/</span>
1329
+ <span class="vx-fs-13 vx-fw-600 vx-txt-white">{{
1330
+ messages.length
1331
+ }}</span>
1332
+
1333
+ <button
1334
+ (click)="activeIndex = activeIndex + 1"
1335
+ [class.disabled]="activeIndex === messages.length - 1"
1336
+ class="vx-fs-12 vx-p-0 vx-m-0 vx-ml-4 vx-d-flex vx-align-center"
1337
+ >
1338
+ <i class="icons">&#xe970;</i>
1339
+ </button>
1340
+ </div>
1341
+ </div>
1342
+ `, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";::ng-deep .global-alert{background:#343952;height:2.25rem;color:#f7d873}::ng-deep .global-alert.expired{color:#e38b7a}::ng-deep .global-alert.expired a{color:#fac3b7;margin-left:.5rem}::ng-deep .global-alert a{color:#f7d873}::ng-deep .global-alert-action{position:absolute;right:.75rem;top:.375rem}::ng-deep .global-alert-action span{letter-spacing:2px}::ng-deep .global-alert-action button{background:transparent;border-radius:0;border:none;color:#fff}::ng-deep .global-alert-action button.disabled{pointer-events:none;opacity:.5;color:#fff}\n"] }]
1302
1343
  }], ctorParameters: function () { return [{ type: ApiService }]; }, propDecorators: { feature: [{
1303
1344
  type: Input
1304
1345
  }], subscriptionStatus: [{
@@ -1321,18 +1362,14 @@ class BusinessCycleService {
1321
1362
  * @returns true if correct business cycle
1322
1363
  */
1323
1364
  isCorrectBusinessCycle(cycle) {
1324
- const localStorageData = localStorage.getItem('businessCycle') ?? null;
1365
+ const localStorageData = localStorage.getItem('businessCycle') ?? '';
1325
1366
  if (!localStorageData) {
1326
1367
  return false;
1327
1368
  }
1328
- const localStorageDataObject = JSON.parse(localStorageData);
1329
- if (Object.keys(localStorageDataObject).length === 0) {
1330
- return false;
1331
- }
1332
- if (localStorageDataObject.userId === this.authorizer.getUserId()) {
1369
+ if (JSON.parse(localStorageData).userId === this.authorizer.getUserId()) {
1333
1370
  for (let i = 0; i < cycle.length; i++) {
1334
1371
  if (cycle[i].start_date ==
1335
- localStorageDataObject?.selectedCycle?.start_date) {
1372
+ JSON.parse(localStorageData)?.selectedCycle?.start_date) {
1336
1373
  return true;
1337
1374
  }
1338
1375
  }
@@ -1380,10 +1417,7 @@ class BusinessCycleService {
1380
1417
  * it is subject variable so we can use it in different component
1381
1418
  */
1382
1419
  isBusinessCycleAvailable() {
1383
- const localStorageData = localStorage.getItem('businessCycle') ?? null;
1384
- if (!localStorageData) {
1385
- return;
1386
- }
1420
+ const localStorageData = localStorage.getItem('businessCycle') ?? '';
1387
1421
  const businessCycleYear = JSON.parse(localStorageData)?.selectedCycle;
1388
1422
  if (businessCycleYear?.selected_cycle_arr?.length === 1) {
1389
1423
  this.selectedBusinessCycle$.next(businessCycleYear);
@@ -1563,11 +1597,11 @@ class PopoverComponent {
1563
1597
  // }, 10);
1564
1598
  }
1565
1599
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopoverComponent, deps: [{ token: PopoverService }], target: i0.ɵɵFactoryTarget.Component }); }
1566
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PopoverComponent, selector: "vui-popover", inputs: { dontCloseonClick: "dontCloseonClick" }, outputs: { closedOnOverlay: "closedOnOverlay" }, viewQueries: [{ propertyName: "popoverRatio", first: true, predicate: ["popoverRatio"], descendants: true }, { propertyName: "popoverContent", first: true, predicate: ["popoverContent"], descendants: true }], ngImport: i0, template: "<div\r\n class=\"vc-overlay\"\r\n *ngIf=\"popoverContainer\"\r\n (click)=\"closePopover('top'); this.closedOnOverlay.emit()\"\r\n></div>\r\n<div\r\n class=\"action\"\r\n [class.active]=\"showPopover\"\r\n *ngIf=\"popoverContainer\"\r\n [style.top.px]=\"positionY\"\r\n [style.left.px]=\"positionX\"\r\n #popoverRatio\r\n id=\"popoverRatio\"\r\n>\r\n <div (click)=\"closePopover(); clickedPopover()\" #popoverContent>\r\n <ng-content></ng-content>\r\n </div>\r\n</div>\r\n", styles: [".action{position:fixed;z-index:13;display:inline-block;opacity:0}.action.active{opacity:1}.vc-overlay{z-index:12;cursor:initial}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
1600
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PopoverComponent, selector: "vui-popover", inputs: { dontCloseonClick: "dontCloseonClick" }, outputs: { closedOnOverlay: "closedOnOverlay" }, viewQueries: [{ propertyName: "popoverRatio", first: true, predicate: ["popoverRatio"], descendants: true }, { propertyName: "popoverContent", first: true, predicate: ["popoverContent"], descendants: true }], ngImport: i0, template: "<div\n class=\"vc-overlay\"\n *ngIf=\"popoverContainer\"\n (click)=\"closePopover('top'); this.closedOnOverlay.emit()\"\n></div>\n<div\n class=\"action\"\n [class.active]=\"showPopover\"\n *ngIf=\"popoverContainer\"\n [style.top.px]=\"positionY\"\n [style.left.px]=\"positionX\"\n #popoverRatio\n id=\"popoverRatio\"\n>\n <div (click)=\"closePopover(); clickedPopover()\" #popoverContent>\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".action{position:fixed;z-index:13;display:inline-block;opacity:0}.action.active{opacity:1}.vc-overlay{z-index:12;cursor:initial}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
1567
1601
  }
1568
1602
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopoverComponent, decorators: [{
1569
1603
  type: Component,
1570
- args: [{ selector: 'vui-popover', template: "<div\r\n class=\"vc-overlay\"\r\n *ngIf=\"popoverContainer\"\r\n (click)=\"closePopover('top'); this.closedOnOverlay.emit()\"\r\n></div>\r\n<div\r\n class=\"action\"\r\n [class.active]=\"showPopover\"\r\n *ngIf=\"popoverContainer\"\r\n [style.top.px]=\"positionY\"\r\n [style.left.px]=\"positionX\"\r\n #popoverRatio\r\n id=\"popoverRatio\"\r\n>\r\n <div (click)=\"closePopover(); clickedPopover()\" #popoverContent>\r\n <ng-content></ng-content>\r\n </div>\r\n</div>\r\n", styles: [".action{position:fixed;z-index:13;display:inline-block;opacity:0}.action.active{opacity:1}.vc-overlay{z-index:12;cursor:initial}\n"] }]
1604
+ args: [{ selector: 'vui-popover', template: "<div\n class=\"vc-overlay\"\n *ngIf=\"popoverContainer\"\n (click)=\"closePopover('top'); this.closedOnOverlay.emit()\"\n></div>\n<div\n class=\"action\"\n [class.active]=\"showPopover\"\n *ngIf=\"popoverContainer\"\n [style.top.px]=\"positionY\"\n [style.left.px]=\"positionX\"\n #popoverRatio\n id=\"popoverRatio\"\n>\n <div (click)=\"closePopover(); clickedPopover()\" #popoverContent>\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".action{position:fixed;z-index:13;display:inline-block;opacity:0}.action.active{opacity:1}.vc-overlay{z-index:12;cursor:initial}\n"] }]
1571
1605
  }], ctorParameters: function () { return [{ type: PopoverService }]; }, propDecorators: { dontCloseonClick: [{
1572
1606
  type: Input
1573
1607
  }], popoverRatio: [{
@@ -1669,11 +1703,11 @@ class CsCheckboxComponent {
1669
1703
  this.ngValueChange.emit(this.ngValue);
1670
1704
  }
1671
1705
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1672
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsCheckboxComponent, selector: "app-cs-checkbox", inputs: { disabled: "disabled", ngValue: "ngValue", value: "value" }, outputs: { ngValueChange: "ngValueChange" }, ngImport: i0, template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\r\n <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\r\n <span class=\"checkbox\">\r\n <span class=\"inner\"></span>\r\n </span>\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n <span class=\"value\"><ng-content></ng-content></span>\r\n</label>\r\n", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:relative;padding:2px;margin-top:0}label.checkbox-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"], dependencies: [{ kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
1706
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsCheckboxComponent, selector: "app-cs-checkbox", inputs: { disabled: "disabled", ngValue: "ngValue", value: "value" }, outputs: { ngValueChange: "ngValueChange" }, ngImport: i0, template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\n <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\n <span class=\"checkbox\">\n <span class=\"inner\"></span>\n </span>\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\n </svg>\n <span class=\"value\"><ng-content></ng-content></span>\n</label>\n", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:relative;padding:2px;margin-top:0}label.checkbox-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"], dependencies: [{ kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
1673
1707
  }
1674
1708
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsCheckboxComponent, decorators: [{
1675
1709
  type: Component,
1676
- args: [{ selector: 'app-cs-checkbox', template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\r\n <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\r\n <span class=\"checkbox\">\r\n <span class=\"inner\"></span>\r\n </span>\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n <span class=\"value\"><ng-content></ng-content></span>\r\n</label>\r\n", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:relative;padding:2px;margin-top:0}label.checkbox-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
1710
+ args: [{ selector: 'app-cs-checkbox', template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\n <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\n <span class=\"checkbox\">\n <span class=\"inner\"></span>\n </span>\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\n </svg>\n <span class=\"value\"><ng-content></ng-content></span>\n</label>\n", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:relative;padding:2px;margin-top:0}label.checkbox-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
1677
1711
  }], ctorParameters: function () { return []; }, propDecorators: { disabled: [{
1678
1712
  type: Input
1679
1713
  }], ngValue: [{
@@ -1969,11 +2003,11 @@ class BusinessCycleComponent {
1969
2003
  }
1970
2004
  }
1971
2005
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BusinessCycleComponent, deps: [{ token: i1$1.AuthorizerService }, { token: BusinessCycleService }, { token: ApiService }], target: i0.ɵɵFactoryTarget.Component }); }
1972
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: BusinessCycleComponent, selector: "vc-business-cycle", inputs: { orgDetails: "orgDetails" }, outputs: { businessCycleChange: "businessCycleChange" }, ngImport: i0, template: "<div\r\n class=\"vc-business-cycle vx-pt-2 vx-pb-2\"\r\n appPopover\r\n (click)=\"businessCyclePop.popover()\"\r\n position=\"left\"\r\n>\r\n <div class=\"heading vx-fs-9 vx-tt-uppercase vx-mb-1 vx-lh-3\">\r\n SHOWING DATA {{ cycleToShow === \"Show Future Due Dates\" ? \"For\" : \"From\" }}\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center vx-justify-between vx-lh-4\">\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <i class=\"icons calendar vx-fs-12 vx-mr-2\">&#xe996;</i>\r\n <span class=\"vx-fs-11 vx-txt-white vx-d-inline-block\">{{\r\n cycleToShow === \"Show Future Due Dates\"\r\n ? \"Future Due Dates\"\r\n : cycleToShow\r\n }}</span>\r\n </div>\r\n <i class=\"icons arrow vx-fs-10 vx-mr-2\">&#xe9e8;</i>\r\n </div>\r\n</div>\r\n\r\n<vui-popover #businessCyclePop [dontCloseonClick]=\"true\">\r\n <div class=\"vc-business-cycle-popover-container\">\r\n <div\r\n class=\"vc-business-cycle-popover-container-top vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\r\n >\r\n <p class=\"vx-fs-11 vx-fw-400 vx-label-txt vx-p-0 vx-m-0\">\r\n You can select upto a max of two consecutive years\r\n </p>\r\n </div>\r\n <div class=\"vc-business-cycle-popover-container-body\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <ng-container\r\n *ngFor=\"let eachCycle of businessCycleList; let i = index\"\r\n >\r\n <li\r\n *ngIf=\"\r\n eachCycle?.business_cycle?.toLowerCase() ===\r\n 'show future due dates'\r\n \"\r\n class=\"vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\r\n [class.future-cycle]=\"true\"\r\n >\r\n <app-cs-checkbox\r\n [ngValue]=\"isSelectedCycle(tempSelectedCycle, eachCycle)\"\r\n (ngValueChange)=\"selectCycle(eachCycle, i)\"\r\n [disabled]=\"eachCycle?.isDisabled\"\r\n >Show Future Due Dates</app-cs-checkbox\r\n >\r\n <i\r\n class=\"icons info-icon vx-fs-12\"\r\n [arTooltip]=\"\r\n 'This option lets you view data that lies outside the current business cycle and are due in the future.'\r\n \"\r\n placement=\"bottom\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n >&#xe91f;</i\r\n >\r\n </li>\r\n <li\r\n *ngIf=\"\r\n eachCycle?.business_cycle?.toLowerCase() !==\r\n 'show future due dates'\r\n \"\r\n class=\"vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\r\n >\r\n <app-cs-checkbox\r\n [ngValue]=\"isSelectedCycle(tempSelectedCycle, eachCycle)\"\r\n (ngValueChange)=\"selectCycle(eachCycle, i)\"\r\n [disabled]=\"eachCycle?.isDisabled\"\r\n >{{ eachCycle?.start_date | dateFormat }} -\r\n <ng-container>\r\n {{ eachCycle?.end_date | dateFormat }}</ng-container\r\n >\r\n </app-cs-checkbox>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </div>\r\n <div\r\n class=\"vc-business-cycle-popover-container-footer vx-d-flex vx-justify-between vx-p-3\"\r\n >\r\n <button\r\n (click)=\"businessCyclePop.closePopover('top')\"\r\n class=\"white vx-fs-11 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-tt-uppercase vx-p-0 vx-m-0 vx-txt-blue\"\r\n >\r\n CANCEL\r\n </button>\r\n <button\r\n (click)=\"setBusinessCycle(); businessCyclePop.closePopover('top')\"\r\n [class.disabled]=\"false\"\r\n class=\"blue vx-fs-11 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-tt-uppercase vx-p-0 vx-m-0 vx-txt-white\"\r\n >\r\n APPLY\r\n </button>\r\n </div>\r\n </div>\r\n</vui-popover>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";::ng-deep .vc-business-cycle{position:relative;width:12.5rem;height:3rem;cursor:pointer;z-index:1}::ng-deep .vc-business-cycle .heading{color:#e3e3e9}::ng-deep .vc-business-cycle i.calendar{color:#e3e3e9}::ng-deep .vc-business-cycle i.arrow{color:#f1f1f1}::ng-deep .vc-business-cycle-popover-container{width:15.625rem;background:#fff;box-shadow:0 4px 8px #1e5dd326;border:1px solid #e3e3e9;border-radius:.25rem;z-index:4}::ng-deep .vc-business-cycle-popover-container-top{background:#f8f8f8}::ng-deep .vc-business-cycle-popover-container-top p{line-height:.875rem}::ng-deep .vc-business-cycle-popover-container-body{background:#fff;max-height:200px;overflow-y:auto}::ng-deep .vc-business-cycle-popover-container-body ul li{list-style:none;margin:0;position:relative}::ng-deep .vc-business-cycle-popover-container-body ul li:before{background:#f1f1f1;content:\"\";position:absolute;left:.75rem;right:.75rem;bottom:0;height:.0625rem;width:calc(100% - 1.5rem)}::ng-deep .vc-business-cycle-popover-container-body ul li:last-of-type:before{display:none}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle{background:#fadd8a}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle:before{display:none}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle app-cs-checkbox label.checkbox-item span.checkbox{background:#fff}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle app-cs-checkbox label.checkbox-item span.value i{margin-left:.375rem}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle .info-icon{margin-left:.375rem;cursor:context-menu}::ng-deep .vc-business-cycle-popover-container-body ul li app-cs-checkbox{display:flex}::ng-deep .vc-business-cycle-popover-container-body ul li app-cs-checkbox label.checkbox-item span.value{font-size:12px!important;color:#161b2f!important;max-width:100%!important}::ng-deep .vc-business-cycle-popover-container-footer{background:#f8f8f8;border-radius:0 0 .25rem .25rem}::ng-deep .vc-business-cycle-popover-container-footer button{width:calc(50% - .125rem);height:1.5rem;border:1px solid transparent;text-transform:uppercase;border-radius:.125rem;line-height:1.375rem}::ng-deep .vc-business-cycle-popover-container-footer button.white{background:#fff;border-color:#dbdbdb}::ng-deep .vc-business-cycle-popover-container-footer button.blue{background:#1e5dd3;border-color:#1e5dd3}::ng-deep .vc-business-cycle-popover-container-footer button.disabled{background:#dbdbdb;color:#747576;border:none;pointer-events:none!important}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PopoverComponent, selector: "vui-popover", inputs: ["dontCloseonClick"], outputs: ["closedOnOverlay"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "position"] }, { kind: "component", type: CsCheckboxComponent, selector: "app-cs-checkbox", inputs: ["disabled", "ngValue", "value"], outputs: ["ngValueChange"] }, { kind: "pipe", type: DateFormatPipe, name: "dateFormat" }] }); }
2006
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: BusinessCycleComponent, selector: "vc-business-cycle", inputs: { orgDetails: "orgDetails" }, outputs: { businessCycleChange: "businessCycleChange" }, ngImport: i0, template: "<div\n class=\"vc-business-cycle vx-pt-2 vx-pb-2\"\n appPopover\n (click)=\"businessCyclePop.popover()\"\n position=\"left\"\n>\n <div class=\"heading vx-fs-9 vx-tt-uppercase vx-mb-1 vx-lh-3\">\n SHOWING DATA {{ cycleToShow === \"Show Future Due Dates\" ? \"For\" : \"From\" }}\n </div>\n <div class=\"vx-d-flex vx-align-center vx-justify-between vx-lh-4\">\n <div class=\"vx-d-flex vx-align-center\">\n <i class=\"icons calendar vx-fs-12 vx-mr-2\">&#xe996;</i>\n <span class=\"vx-fs-11 vx-txt-white vx-d-inline-block\">{{\n cycleToShow === \"Show Future Due Dates\"\n ? \"Future Due Dates\"\n : cycleToShow\n }}</span>\n </div>\n <i class=\"icons arrow vx-fs-10 vx-mr-2\">&#xe9e8;</i>\n </div>\n</div>\n\n<vui-popover #businessCyclePop [dontCloseonClick]=\"true\">\n <div class=\"vc-business-cycle-popover-container\">\n <div\n class=\"vc-business-cycle-popover-container-top vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\n >\n <p class=\"vx-fs-11 vx-fw-400 vx-label-txt vx-p-0 vx-m-0\">\n You can select upto a max of two consecutive years\n </p>\n </div>\n <div class=\"vc-business-cycle-popover-container-body\">\n <ul class=\"vx-p-0 vx-m-0\">\n <ng-container\n *ngFor=\"let eachCycle of businessCycleList; let i = index\"\n >\n <li\n *ngIf=\"\n eachCycle?.business_cycle?.toLowerCase() ===\n 'show future due dates'\n \"\n class=\"vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\n [class.future-cycle]=\"true\"\n >\n <app-cs-checkbox\n [ngValue]=\"isSelectedCycle(tempSelectedCycle, eachCycle)\"\n (ngValueChange)=\"selectCycle(eachCycle, i)\"\n [disabled]=\"eachCycle?.isDisabled\"\n >Show Future Due Dates</app-cs-checkbox\n >\n <i\n class=\"icons info-icon vx-fs-12\"\n [arTooltip]=\"\n 'This option lets you view data that lies outside the current business cycle and are due in the future.'\n \"\n placement=\"bottom\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"true\"\n >&#xe91f;</i\n >\n </li>\n <li\n *ngIf=\"\n eachCycle?.business_cycle?.toLowerCase() !==\n 'show future due dates'\n \"\n class=\"vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\n >\n <app-cs-checkbox\n [ngValue]=\"isSelectedCycle(tempSelectedCycle, eachCycle)\"\n (ngValueChange)=\"selectCycle(eachCycle, i)\"\n [disabled]=\"eachCycle?.isDisabled\"\n >{{ eachCycle?.start_date | dateFormat }} -\n <ng-container>\n {{ eachCycle?.end_date | dateFormat }}</ng-container\n >\n </app-cs-checkbox>\n </li>\n </ng-container>\n </ul>\n </div>\n <div\n class=\"vc-business-cycle-popover-container-footer vx-d-flex vx-justify-between vx-p-3\"\n >\n <button\n (click)=\"businessCyclePop.closePopover('top')\"\n class=\"white vx-fs-11 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-tt-uppercase vx-p-0 vx-m-0 vx-txt-blue\"\n >\n CANCEL\n </button>\n <button\n (click)=\"setBusinessCycle(); businessCyclePop.closePopover('top')\"\n [class.disabled]=\"false\"\n class=\"blue vx-fs-11 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-tt-uppercase vx-p-0 vx-m-0 vx-txt-white\"\n >\n APPLY\n </button>\n </div>\n </div>\n</vui-popover>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";::ng-deep .vc-business-cycle{position:relative;width:12.5rem;height:3rem;cursor:pointer;z-index:1}::ng-deep .vc-business-cycle .heading{color:#e3e3e9}::ng-deep .vc-business-cycle i.calendar{color:#e3e3e9}::ng-deep .vc-business-cycle i.arrow{color:#f1f1f1}::ng-deep .vc-business-cycle-popover-container{width:15.625rem;background:#fff;box-shadow:0 4px 8px #1e5dd326;border:1px solid #e3e3e9;border-radius:.25rem;z-index:4}::ng-deep .vc-business-cycle-popover-container-top{background:#f8f8f8}::ng-deep .vc-business-cycle-popover-container-top p{line-height:.875rem}::ng-deep .vc-business-cycle-popover-container-body{background:#fff;max-height:200px;overflow-y:auto}::ng-deep .vc-business-cycle-popover-container-body ul li{list-style:none;margin:0;position:relative}::ng-deep .vc-business-cycle-popover-container-body ul li:before{background:#f1f1f1;content:\"\";position:absolute;left:.75rem;right:.75rem;bottom:0;height:.0625rem;width:calc(100% - 1.5rem)}::ng-deep .vc-business-cycle-popover-container-body ul li:last-of-type:before{display:none}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle{background:#fadd8a}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle:before{display:none}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle app-cs-checkbox label.checkbox-item span.checkbox{background:#fff}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle app-cs-checkbox label.checkbox-item span.value i{margin-left:.375rem}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle .info-icon{margin-left:.375rem;cursor:context-menu}::ng-deep .vc-business-cycle-popover-container-body ul li app-cs-checkbox{display:flex}::ng-deep .vc-business-cycle-popover-container-body ul li app-cs-checkbox label.checkbox-item span.value{font-size:12px!important;color:#161b2f!important;max-width:100%!important}::ng-deep .vc-business-cycle-popover-container-footer{background:#f8f8f8;border-radius:0 0 .25rem .25rem}::ng-deep .vc-business-cycle-popover-container-footer button{width:calc(50% - .125rem);height:1.5rem;border:1px solid transparent;text-transform:uppercase;border-radius:.125rem;line-height:1.375rem}::ng-deep .vc-business-cycle-popover-container-footer button.white{background:#fff;border-color:#dbdbdb}::ng-deep .vc-business-cycle-popover-container-footer button.blue{background:#1e5dd3;border-color:#1e5dd3}::ng-deep .vc-business-cycle-popover-container-footer button.disabled{background:#dbdbdb;color:#747576;border:none;pointer-events:none!important}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PopoverComponent, selector: "vui-popover", inputs: ["dontCloseonClick"], outputs: ["closedOnOverlay"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "position"] }, { kind: "component", type: CsCheckboxComponent, selector: "app-cs-checkbox", inputs: ["disabled", "ngValue", "value"], outputs: ["ngValueChange"] }, { kind: "pipe", type: DateFormatPipe, name: "dateFormat" }] }); }
1973
2007
  }
1974
2008
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BusinessCycleComponent, decorators: [{
1975
2009
  type: Component,
1976
- args: [{ selector: 'vc-business-cycle', template: "<div\r\n class=\"vc-business-cycle vx-pt-2 vx-pb-2\"\r\n appPopover\r\n (click)=\"businessCyclePop.popover()\"\r\n position=\"left\"\r\n>\r\n <div class=\"heading vx-fs-9 vx-tt-uppercase vx-mb-1 vx-lh-3\">\r\n SHOWING DATA {{ cycleToShow === \"Show Future Due Dates\" ? \"For\" : \"From\" }}\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center vx-justify-between vx-lh-4\">\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <i class=\"icons calendar vx-fs-12 vx-mr-2\">&#xe996;</i>\r\n <span class=\"vx-fs-11 vx-txt-white vx-d-inline-block\">{{\r\n cycleToShow === \"Show Future Due Dates\"\r\n ? \"Future Due Dates\"\r\n : cycleToShow\r\n }}</span>\r\n </div>\r\n <i class=\"icons arrow vx-fs-10 vx-mr-2\">&#xe9e8;</i>\r\n </div>\r\n</div>\r\n\r\n<vui-popover #businessCyclePop [dontCloseonClick]=\"true\">\r\n <div class=\"vc-business-cycle-popover-container\">\r\n <div\r\n class=\"vc-business-cycle-popover-container-top vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\r\n >\r\n <p class=\"vx-fs-11 vx-fw-400 vx-label-txt vx-p-0 vx-m-0\">\r\n You can select upto a max of two consecutive years\r\n </p>\r\n </div>\r\n <div class=\"vc-business-cycle-popover-container-body\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <ng-container\r\n *ngFor=\"let eachCycle of businessCycleList; let i = index\"\r\n >\r\n <li\r\n *ngIf=\"\r\n eachCycle?.business_cycle?.toLowerCase() ===\r\n 'show future due dates'\r\n \"\r\n class=\"vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\r\n [class.future-cycle]=\"true\"\r\n >\r\n <app-cs-checkbox\r\n [ngValue]=\"isSelectedCycle(tempSelectedCycle, eachCycle)\"\r\n (ngValueChange)=\"selectCycle(eachCycle, i)\"\r\n [disabled]=\"eachCycle?.isDisabled\"\r\n >Show Future Due Dates</app-cs-checkbox\r\n >\r\n <i\r\n class=\"icons info-icon vx-fs-12\"\r\n [arTooltip]=\"\r\n 'This option lets you view data that lies outside the current business cycle and are due in the future.'\r\n \"\r\n placement=\"bottom\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n >&#xe91f;</i\r\n >\r\n </li>\r\n <li\r\n *ngIf=\"\r\n eachCycle?.business_cycle?.toLowerCase() !==\r\n 'show future due dates'\r\n \"\r\n class=\"vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\r\n >\r\n <app-cs-checkbox\r\n [ngValue]=\"isSelectedCycle(tempSelectedCycle, eachCycle)\"\r\n (ngValueChange)=\"selectCycle(eachCycle, i)\"\r\n [disabled]=\"eachCycle?.isDisabled\"\r\n >{{ eachCycle?.start_date | dateFormat }} -\r\n <ng-container>\r\n {{ eachCycle?.end_date | dateFormat }}</ng-container\r\n >\r\n </app-cs-checkbox>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </div>\r\n <div\r\n class=\"vc-business-cycle-popover-container-footer vx-d-flex vx-justify-between vx-p-3\"\r\n >\r\n <button\r\n (click)=\"businessCyclePop.closePopover('top')\"\r\n class=\"white vx-fs-11 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-tt-uppercase vx-p-0 vx-m-0 vx-txt-blue\"\r\n >\r\n CANCEL\r\n </button>\r\n <button\r\n (click)=\"setBusinessCycle(); businessCyclePop.closePopover('top')\"\r\n [class.disabled]=\"false\"\r\n class=\"blue vx-fs-11 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-tt-uppercase vx-p-0 vx-m-0 vx-txt-white\"\r\n >\r\n APPLY\r\n </button>\r\n </div>\r\n </div>\r\n</vui-popover>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";::ng-deep .vc-business-cycle{position:relative;width:12.5rem;height:3rem;cursor:pointer;z-index:1}::ng-deep .vc-business-cycle .heading{color:#e3e3e9}::ng-deep .vc-business-cycle i.calendar{color:#e3e3e9}::ng-deep .vc-business-cycle i.arrow{color:#f1f1f1}::ng-deep .vc-business-cycle-popover-container{width:15.625rem;background:#fff;box-shadow:0 4px 8px #1e5dd326;border:1px solid #e3e3e9;border-radius:.25rem;z-index:4}::ng-deep .vc-business-cycle-popover-container-top{background:#f8f8f8}::ng-deep .vc-business-cycle-popover-container-top p{line-height:.875rem}::ng-deep .vc-business-cycle-popover-container-body{background:#fff;max-height:200px;overflow-y:auto}::ng-deep .vc-business-cycle-popover-container-body ul li{list-style:none;margin:0;position:relative}::ng-deep .vc-business-cycle-popover-container-body ul li:before{background:#f1f1f1;content:\"\";position:absolute;left:.75rem;right:.75rem;bottom:0;height:.0625rem;width:calc(100% - 1.5rem)}::ng-deep .vc-business-cycle-popover-container-body ul li:last-of-type:before{display:none}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle{background:#fadd8a}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle:before{display:none}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle app-cs-checkbox label.checkbox-item span.checkbox{background:#fff}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle app-cs-checkbox label.checkbox-item span.value i{margin-left:.375rem}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle .info-icon{margin-left:.375rem;cursor:context-menu}::ng-deep .vc-business-cycle-popover-container-body ul li app-cs-checkbox{display:flex}::ng-deep .vc-business-cycle-popover-container-body ul li app-cs-checkbox label.checkbox-item span.value{font-size:12px!important;color:#161b2f!important;max-width:100%!important}::ng-deep .vc-business-cycle-popover-container-footer{background:#f8f8f8;border-radius:0 0 .25rem .25rem}::ng-deep .vc-business-cycle-popover-container-footer button{width:calc(50% - .125rem);height:1.5rem;border:1px solid transparent;text-transform:uppercase;border-radius:.125rem;line-height:1.375rem}::ng-deep .vc-business-cycle-popover-container-footer button.white{background:#fff;border-color:#dbdbdb}::ng-deep .vc-business-cycle-popover-container-footer button.blue{background:#1e5dd3;border-color:#1e5dd3}::ng-deep .vc-business-cycle-popover-container-footer button.disabled{background:#dbdbdb;color:#747576;border:none;pointer-events:none!important}\n"] }]
2010
+ args: [{ selector: 'vc-business-cycle', template: "<div\n class=\"vc-business-cycle vx-pt-2 vx-pb-2\"\n appPopover\n (click)=\"businessCyclePop.popover()\"\n position=\"left\"\n>\n <div class=\"heading vx-fs-9 vx-tt-uppercase vx-mb-1 vx-lh-3\">\n SHOWING DATA {{ cycleToShow === \"Show Future Due Dates\" ? \"For\" : \"From\" }}\n </div>\n <div class=\"vx-d-flex vx-align-center vx-justify-between vx-lh-4\">\n <div class=\"vx-d-flex vx-align-center\">\n <i class=\"icons calendar vx-fs-12 vx-mr-2\">&#xe996;</i>\n <span class=\"vx-fs-11 vx-txt-white vx-d-inline-block\">{{\n cycleToShow === \"Show Future Due Dates\"\n ? \"Future Due Dates\"\n : cycleToShow\n }}</span>\n </div>\n <i class=\"icons arrow vx-fs-10 vx-mr-2\">&#xe9e8;</i>\n </div>\n</div>\n\n<vui-popover #businessCyclePop [dontCloseonClick]=\"true\">\n <div class=\"vc-business-cycle-popover-container\">\n <div\n class=\"vc-business-cycle-popover-container-top vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\n >\n <p class=\"vx-fs-11 vx-fw-400 vx-label-txt vx-p-0 vx-m-0\">\n You can select upto a max of two consecutive years\n </p>\n </div>\n <div class=\"vc-business-cycle-popover-container-body\">\n <ul class=\"vx-p-0 vx-m-0\">\n <ng-container\n *ngFor=\"let eachCycle of businessCycleList; let i = index\"\n >\n <li\n *ngIf=\"\n eachCycle?.business_cycle?.toLowerCase() ===\n 'show future due dates'\n \"\n class=\"vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\n [class.future-cycle]=\"true\"\n >\n <app-cs-checkbox\n [ngValue]=\"isSelectedCycle(tempSelectedCycle, eachCycle)\"\n (ngValueChange)=\"selectCycle(eachCycle, i)\"\n [disabled]=\"eachCycle?.isDisabled\"\n >Show Future Due Dates</app-cs-checkbox\n >\n <i\n class=\"icons info-icon vx-fs-12\"\n [arTooltip]=\"\n 'This option lets you view data that lies outside the current business cycle and are due in the future.'\n \"\n placement=\"bottom\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"true\"\n >&#xe91f;</i\n >\n </li>\n <li\n *ngIf=\"\n eachCycle?.business_cycle?.toLowerCase() !==\n 'show future due dates'\n \"\n class=\"vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\"\n >\n <app-cs-checkbox\n [ngValue]=\"isSelectedCycle(tempSelectedCycle, eachCycle)\"\n (ngValueChange)=\"selectCycle(eachCycle, i)\"\n [disabled]=\"eachCycle?.isDisabled\"\n >{{ eachCycle?.start_date | dateFormat }} -\n <ng-container>\n {{ eachCycle?.end_date | dateFormat }}</ng-container\n >\n </app-cs-checkbox>\n </li>\n </ng-container>\n </ul>\n </div>\n <div\n class=\"vc-business-cycle-popover-container-footer vx-d-flex vx-justify-between vx-p-3\"\n >\n <button\n (click)=\"businessCyclePop.closePopover('top')\"\n class=\"white vx-fs-11 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-tt-uppercase vx-p-0 vx-m-0 vx-txt-blue\"\n >\n CANCEL\n </button>\n <button\n (click)=\"setBusinessCycle(); businessCyclePop.closePopover('top')\"\n [class.disabled]=\"false\"\n class=\"blue vx-fs-11 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-tt-uppercase vx-p-0 vx-m-0 vx-txt-white\"\n >\n APPLY\n </button>\n </div>\n </div>\n</vui-popover>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";::ng-deep .vc-business-cycle{position:relative;width:12.5rem;height:3rem;cursor:pointer;z-index:1}::ng-deep .vc-business-cycle .heading{color:#e3e3e9}::ng-deep .vc-business-cycle i.calendar{color:#e3e3e9}::ng-deep .vc-business-cycle i.arrow{color:#f1f1f1}::ng-deep .vc-business-cycle-popover-container{width:15.625rem;background:#fff;box-shadow:0 4px 8px #1e5dd326;border:1px solid #e3e3e9;border-radius:.25rem;z-index:4}::ng-deep .vc-business-cycle-popover-container-top{background:#f8f8f8}::ng-deep .vc-business-cycle-popover-container-top p{line-height:.875rem}::ng-deep .vc-business-cycle-popover-container-body{background:#fff;max-height:200px;overflow-y:auto}::ng-deep .vc-business-cycle-popover-container-body ul li{list-style:none;margin:0;position:relative}::ng-deep .vc-business-cycle-popover-container-body ul li:before{background:#f1f1f1;content:\"\";position:absolute;left:.75rem;right:.75rem;bottom:0;height:.0625rem;width:calc(100% - 1.5rem)}::ng-deep .vc-business-cycle-popover-container-body ul li:last-of-type:before{display:none}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle{background:#fadd8a}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle:before{display:none}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle app-cs-checkbox label.checkbox-item span.checkbox{background:#fff}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle app-cs-checkbox label.checkbox-item span.value i{margin-left:.375rem}::ng-deep .vc-business-cycle-popover-container-body ul li.future-cycle .info-icon{margin-left:.375rem;cursor:context-menu}::ng-deep .vc-business-cycle-popover-container-body ul li app-cs-checkbox{display:flex}::ng-deep .vc-business-cycle-popover-container-body ul li app-cs-checkbox label.checkbox-item span.value{font-size:12px!important;color:#161b2f!important;max-width:100%!important}::ng-deep .vc-business-cycle-popover-container-footer{background:#f8f8f8;border-radius:0 0 .25rem .25rem}::ng-deep .vc-business-cycle-popover-container-footer button{width:calc(50% - .125rem);height:1.5rem;border:1px solid transparent;text-transform:uppercase;border-radius:.125rem;line-height:1.375rem}::ng-deep .vc-business-cycle-popover-container-footer button.white{background:#fff;border-color:#dbdbdb}::ng-deep .vc-business-cycle-popover-container-footer button.blue{background:#1e5dd3;border-color:#1e5dd3}::ng-deep .vc-business-cycle-popover-container-footer button.disabled{background:#dbdbdb;color:#747576;border:none;pointer-events:none!important}\n"] }]
1977
2011
  }], ctorParameters: function () { return [{ type: i1$1.AuthorizerService }, { type: BusinessCycleService }, { type: ApiService }]; }, propDecorators: { businessCycleChange: [{
1978
2012
  type: Output
1979
2013
  }], orgDetails: [{
@@ -2021,85 +2055,83 @@ class SearchComponent {
2021
2055
  this.router.url.subscribe((url) => this.onSearch('search', ''));
2022
2056
  }
2023
2057
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchComponent, deps: [{ token: i0.Renderer2 }, { token: i1$4.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
2024
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SearchComponent, selector: "vc-search", inputs: { isAdvanceSearch: "isAdvanceSearch" }, outputs: { onSearchAction: "onSearchAction" }, viewQueries: [{ propertyName: "searchArea", first: true, predicate: ["searchArea"], descendants: true }, { propertyName: "searchBox", first: true, predicate: ["searchBox"], descendants: true }], ngImport: i0, template: `
2025
- <div
2026
- class="vc-search"
2027
- (click)="isDivClicked = true"
2028
- [class.searchFocus]="isDivClicked"
2029
- #searchArea
2030
- >
2031
- <input
2032
- [(ngModel)]="searchValue"
2033
- (keyup)="onKeyUp($event)"
2034
- (focusOut)="isDivClicked = false"
2035
- type="text"
2036
- class="vx-fs-11 vx-fw-300 vx-neutral-0"
2037
- placeholder="Search"
2038
- #searchBox
2039
- />
2040
- <i class="icons serachIcon vx-fs-10 vx-neutral-0">&#xe90b;</i>
2041
-
2042
- <div
2043
- *ngIf="isAdvanceSearch"
2044
- (click)="onSearch('advanceSearch', '')"
2045
- class="vc-advance-search-btn vx-d-flex vx-align-center vx-justify-center"
2046
- [arTooltip]="'Advance Search'"
2047
- placement="bottom"
2048
- type="black"
2049
- delay="0"
2050
- [tooltipMandatory]="true"
2051
- >
2052
- <i class="icons vx-fs-12 vx-gray-40">&#xea91;</i>
2053
- </div>
2054
- <i
2055
- *ngIf="searchValue"
2056
- (click)="onCrossClick()"
2057
- class="icons crossIcon vx-fs-10 vx-neutral-0"
2058
- >&#xe9ae;</i
2059
- >
2060
- </div>
2061
- `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.vc-search{position:relative}.vc-search.searchFocus input{background:#fff;color:#565a6f;outline:none;width:30rem;height:1.875rem}.vc-search.searchFocus input::placeholder{color:#a9aab6}.vc-search.searchFocus .serachIcon{color:#565a6f}.vc-search.searchFocus .crossIcon{color:#565a6f;display:block}.vc-search.searchFocus .vc-advance-search-btn{background:#e3e3e9;border-radius:50px;top:3px}.vc-search.searchFocus .vc-advance-search-btn i{color:#565a6f}.vc-search input{background:transparent;border-radius:1.5rem;border:1px solid #565a6f;padding:0 2rem 0 1.5rem;height:1.75rem;width:18rem;transition:all .3s ease-out}.vc-search input:hover{border-color:#787a8c}.vc-search input::placeholder{color:#fff}.vc-search i{position:absolute;cursor:pointer;left:.625rem;top:.625rem;z-index:1}.vc-search i.crossIcon{left:unset;right:.75rem}.vc-search .vc-advance-search-btn{width:1.5rem;height:1.5rem;position:absolute;right:.25rem;top:.125rem;cursor:pointer}.vc-search .vc-advance-search-btn i{position:static}.vc-search .vc-advance-search-btn~i.crossIcon{right:2.5rem}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
2058
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SearchComponent, selector: "vc-search", inputs: { isAdvanceSearch: "isAdvanceSearch" }, outputs: { onSearchAction: "onSearchAction" }, viewQueries: [{ propertyName: "searchArea", first: true, predicate: ["searchArea"], descendants: true }, { propertyName: "searchBox", first: true, predicate: ["searchBox"], descendants: true }], ngImport: i0, template: `
2059
+ <div
2060
+ class="vc-search"
2061
+ (click)="isDivClicked = true"
2062
+ [class.searchFocus]="isDivClicked"
2063
+ #searchArea
2064
+ >
2065
+ <input
2066
+ [(ngModel)]="searchValue"
2067
+ (keyup)="onKeyUp($event)"
2068
+ (focusOut)="isDivClicked = false"
2069
+ type="text"
2070
+ placeholder="Search"
2071
+ #searchBox
2072
+ />
2073
+ <i class="icons serachIcon vx-fs-10 vx-txt-white">&#xe90b;</i>
2074
+
2075
+ <div
2076
+ *ngIf="isAdvanceSearch"
2077
+ (click)="onSearch('advanceSearch', '')"
2078
+ class="vc-advance-search-btn vx-d-flex vx-align-center vx-justify-center"
2079
+ [arTooltip]="'Advance Search'"
2080
+ placement="bottom"
2081
+ type="black"
2082
+ delay="0"
2083
+ [tooltipMandatory]="true"
2084
+ >
2085
+ <i class="icons vx-fs-12">&#xea91;</i>
2086
+ </div>
2087
+ <i
2088
+ *ngIf="searchValue"
2089
+ (click)="onCrossClick()"
2090
+ class="icons crossIcon vx-fs-10 vx-txt-white"
2091
+ >&#xe9ae;</i
2092
+ >
2093
+ </div>
2094
+ `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.vc-search{position:relative}.vc-search.searchFocus input{background:#fff;color:#565a6f;outline:none;width:30rem;height:1.875rem}.vc-search.searchFocus input::placeholder{color:#a9aab6}.vc-search.searchFocus .serachIcon{color:#565a6f}.vc-search.searchFocus .crossIcon{color:#565a6f;display:block}.vc-search.searchFocus .vc-advance-search-btn{background:#e3e3e9;border-radius:50px;top:3px}.vc-search.searchFocus .vc-advance-search-btn i{color:#565a6f}.vc-search input{background:transparent;border-radius:24px;border:1px solid #565a6f;color:#fff;font-size:11px;font-weight:300;padding:0 2rem 0 1.5rem;height:1.75rem;width:18rem;transition:all .3s ease-out}.vc-search input:hover{border-color:#787a8c}.vc-search input::placeholder{color:#fff}.vc-search i{position:absolute;cursor:pointer;left:10px;top:10px;z-index:1}.vc-search i.crossIcon{left:unset;right:.75rem}.vc-search .vc-advance-search-btn{width:1.5rem;height:1.5rem;position:absolute;right:.25rem;top:.125rem;cursor:pointer}.vc-search .vc-advance-search-btn i{color:#cdced6;position:static}.vc-search .vc-advance-search-btn~i.crossIcon{right:2.5rem}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
2062
2095
  }
2063
2096
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchComponent, decorators: [{
2064
2097
  type: Component,
2065
- args: [{ selector: 'vc-search', template: `
2066
- <div
2067
- class="vc-search"
2068
- (click)="isDivClicked = true"
2069
- [class.searchFocus]="isDivClicked"
2070
- #searchArea
2071
- >
2072
- <input
2073
- [(ngModel)]="searchValue"
2074
- (keyup)="onKeyUp($event)"
2075
- (focusOut)="isDivClicked = false"
2076
- type="text"
2077
- class="vx-fs-11 vx-fw-300 vx-neutral-0"
2078
- placeholder="Search"
2079
- #searchBox
2080
- />
2081
- <i class="icons serachIcon vx-fs-10 vx-neutral-0">&#xe90b;</i>
2082
-
2083
- <div
2084
- *ngIf="isAdvanceSearch"
2085
- (click)="onSearch('advanceSearch', '')"
2086
- class="vc-advance-search-btn vx-d-flex vx-align-center vx-justify-center"
2087
- [arTooltip]="'Advance Search'"
2088
- placement="bottom"
2089
- type="black"
2090
- delay="0"
2091
- [tooltipMandatory]="true"
2092
- >
2093
- <i class="icons vx-fs-12 vx-gray-40">&#xea91;</i>
2094
- </div>
2095
- <i
2096
- *ngIf="searchValue"
2097
- (click)="onCrossClick()"
2098
- class="icons crossIcon vx-fs-10 vx-neutral-0"
2099
- >&#xe9ae;</i
2100
- >
2101
- </div>
2102
- `, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.vc-search{position:relative}.vc-search.searchFocus input{background:#fff;color:#565a6f;outline:none;width:30rem;height:1.875rem}.vc-search.searchFocus input::placeholder{color:#a9aab6}.vc-search.searchFocus .serachIcon{color:#565a6f}.vc-search.searchFocus .crossIcon{color:#565a6f;display:block}.vc-search.searchFocus .vc-advance-search-btn{background:#e3e3e9;border-radius:50px;top:3px}.vc-search.searchFocus .vc-advance-search-btn i{color:#565a6f}.vc-search input{background:transparent;border-radius:1.5rem;border:1px solid #565a6f;padding:0 2rem 0 1.5rem;height:1.75rem;width:18rem;transition:all .3s ease-out}.vc-search input:hover{border-color:#787a8c}.vc-search input::placeholder{color:#fff}.vc-search i{position:absolute;cursor:pointer;left:.625rem;top:.625rem;z-index:1}.vc-search i.crossIcon{left:unset;right:.75rem}.vc-search .vc-advance-search-btn{width:1.5rem;height:1.5rem;position:absolute;right:.25rem;top:.125rem;cursor:pointer}.vc-search .vc-advance-search-btn i{position:static}.vc-search .vc-advance-search-btn~i.crossIcon{right:2.5rem}\n"] }]
2098
+ args: [{ selector: 'vc-search', template: `
2099
+ <div
2100
+ class="vc-search"
2101
+ (click)="isDivClicked = true"
2102
+ [class.searchFocus]="isDivClicked"
2103
+ #searchArea
2104
+ >
2105
+ <input
2106
+ [(ngModel)]="searchValue"
2107
+ (keyup)="onKeyUp($event)"
2108
+ (focusOut)="isDivClicked = false"
2109
+ type="text"
2110
+ placeholder="Search"
2111
+ #searchBox
2112
+ />
2113
+ <i class="icons serachIcon vx-fs-10 vx-txt-white">&#xe90b;</i>
2114
+
2115
+ <div
2116
+ *ngIf="isAdvanceSearch"
2117
+ (click)="onSearch('advanceSearch', '')"
2118
+ class="vc-advance-search-btn vx-d-flex vx-align-center vx-justify-center"
2119
+ [arTooltip]="'Advance Search'"
2120
+ placement="bottom"
2121
+ type="black"
2122
+ delay="0"
2123
+ [tooltipMandatory]="true"
2124
+ >
2125
+ <i class="icons vx-fs-12">&#xea91;</i>
2126
+ </div>
2127
+ <i
2128
+ *ngIf="searchValue"
2129
+ (click)="onCrossClick()"
2130
+ class="icons crossIcon vx-fs-10 vx-txt-white"
2131
+ >&#xe9ae;</i
2132
+ >
2133
+ </div>
2134
+ `, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.vc-search{position:relative}.vc-search.searchFocus input{background:#fff;color:#565a6f;outline:none;width:30rem;height:1.875rem}.vc-search.searchFocus input::placeholder{color:#a9aab6}.vc-search.searchFocus .serachIcon{color:#565a6f}.vc-search.searchFocus .crossIcon{color:#565a6f;display:block}.vc-search.searchFocus .vc-advance-search-btn{background:#e3e3e9;border-radius:50px;top:3px}.vc-search.searchFocus .vc-advance-search-btn i{color:#565a6f}.vc-search input{background:transparent;border-radius:24px;border:1px solid #565a6f;color:#fff;font-size:11px;font-weight:300;padding:0 2rem 0 1.5rem;height:1.75rem;width:18rem;transition:all .3s ease-out}.vc-search input:hover{border-color:#787a8c}.vc-search input::placeholder{color:#fff}.vc-search i{position:absolute;cursor:pointer;left:10px;top:10px;z-index:1}.vc-search i.crossIcon{left:unset;right:.75rem}.vc-search .vc-advance-search-btn{width:1.5rem;height:1.5rem;position:absolute;right:.25rem;top:.125rem;cursor:pointer}.vc-search .vc-advance-search-btn i{color:#cdced6;position:static}.vc-search .vc-advance-search-btn~i.crossIcon{right:2.5rem}\n"] }]
2103
2135
  }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i1$4.ActivatedRoute }]; }, propDecorators: { isAdvanceSearch: [{
2104
2136
  type: Input
2105
2137
  }], searchArea: [{
@@ -2119,11 +2151,11 @@ class CreateWorkflowComponent {
2119
2151
  }
2120
2152
  ngOnInit() { }
2121
2153
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CreateWorkflowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2122
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CreateWorkflowComponent, selector: "vc-create-workflow", inputs: { iframeLoading: "iframeLoading" }, outputs: { openWorkflow: "openWorkflow" }, ngImport: i0, template: "<div\r\n class=\"header-create-workflow vx-fs-16 vx-txt-white vx-d-flex vx-align-center vx-justify-center\"\r\n (click)=\"openWorkflow.emit()\"\r\n [class.disabled-workflow]=\"iframeLoading\"\r\n [arTooltip]=\"'Create'\"\r\n placement=\"bottom\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n>\r\n +\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";.header-create-workflow{background:#1e5dd3;border-radius:3rem;cursor:pointer;width:1.5rem;height:1.5rem;margin-left:1.75rem;transition:all .3s ease-in-out}.header-create-workflow.disabled-workflow{filter:grayscale(100%);pointer-events:none}\n"], dependencies: [{ kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }] }); }
2154
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CreateWorkflowComponent, selector: "vc-create-workflow", inputs: { iframeLoading: "iframeLoading" }, outputs: { openWorkflow: "openWorkflow" }, ngImport: i0, template: "<div\n class=\"header-create-workflow vx-fs-16 vx-txt-white vx-d-flex vx-align-center vx-justify-center\"\n (click)=\"openWorkflow.emit()\"\n [class.disabled-workflow]=\"iframeLoading\"\n [arTooltip]=\"'Create'\"\n placement=\"bottom\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"true\"\n>\n +\n</div>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";.header-create-workflow{background:#1e5dd3;border-radius:3rem;cursor:pointer;width:1.5rem;height:1.5rem;margin-left:1.75rem;transition:all .3s ease-in-out}.header-create-workflow.disabled-workflow{filter:grayscale(100%);pointer-events:none}\n"], dependencies: [{ kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }] }); }
2123
2155
  }
2124
2156
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CreateWorkflowComponent, decorators: [{
2125
2157
  type: Component,
2126
- args: [{ selector: 'vc-create-workflow', template: "<div\r\n class=\"header-create-workflow vx-fs-16 vx-txt-white vx-d-flex vx-align-center vx-justify-center\"\r\n (click)=\"openWorkflow.emit()\"\r\n [class.disabled-workflow]=\"iframeLoading\"\r\n [arTooltip]=\"'Create'\"\r\n placement=\"bottom\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n>\r\n +\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";.header-create-workflow{background:#1e5dd3;border-radius:3rem;cursor:pointer;width:1.5rem;height:1.5rem;margin-left:1.75rem;transition:all .3s ease-in-out}.header-create-workflow.disabled-workflow{filter:grayscale(100%);pointer-events:none}\n"] }]
2158
+ args: [{ selector: 'vc-create-workflow', template: "<div\n class=\"header-create-workflow vx-fs-16 vx-txt-white vx-d-flex vx-align-center vx-justify-center\"\n (click)=\"openWorkflow.emit()\"\n [class.disabled-workflow]=\"iframeLoading\"\n [arTooltip]=\"'Create'\"\n placement=\"bottom\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"true\"\n>\n +\n</div>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";.header-create-workflow{background:#1e5dd3;border-radius:3rem;cursor:pointer;width:1.5rem;height:1.5rem;margin-left:1.75rem;transition:all .3s ease-in-out}.header-create-workflow.disabled-workflow{filter:grayscale(100%);pointer-events:none}\n"] }]
2127
2159
  }], ctorParameters: function () { return []; }, propDecorators: { iframeLoading: [{
2128
2160
  type: Input
2129
2161
  }], openWorkflow: [{
@@ -2141,45 +2173,45 @@ class QueueComponent {
2141
2173
  this.queueURL = this.layoutService.baseUrl + IN_APP_URL.QUEUE;
2142
2174
  }
2143
2175
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: QueueComponent, deps: [{ token: ApiService }, { token: LayoutService }], target: i0.ɵɵFactoryTarget.Component }); }
2144
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: QueueComponent, selector: "vc-queue", ngImport: i0, template: `
2145
- <a
2146
- *ngIf="apiService?.queueCount$ | async"
2147
- class="header-queue vx-d-flex vx-align-center vx-justify-center"
2148
- [arTooltip]="'View Responsibilities in Queue'"
2149
- placement="bottom-right"
2150
- type="black"
2151
- delay="0"
2152
- [href]="queueURL"
2153
- [tooltipMandatory]="true"
2154
- >
2155
- <i class="icons vx-fs-12 vx-txt-white">&#xea27;</i>
2156
- <span
2157
- class="queue-value vx-fs-9 vx-fw-500 vx-txt-white vx-d-flex vx-align-center vx-justify-center vx-pl-1 vx-pr-1"
2158
- >{{ apiService?.queueCount$ | async }}</span
2159
- >
2160
- </a>
2161
- `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";.header-queue{background:#e87315;border-radius:3rem;width:1.5rem;height:1.5rem;margin-left:1.75rem;position:relative;text-decoration:none!important}.header-queue .queue-value{background:#c7381b;border-radius:1.25rem;border:.125rem solid #161b2f;height:1rem;min-width:1.125rem;position:absolute;top:-.375rem;right:-.625rem}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }] }); }
2176
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: QueueComponent, selector: "vc-queue", ngImport: i0, template: `
2177
+ <a
2178
+ *ngIf="apiService?.queueCount$ | async"
2179
+ class="header-queue vx-d-flex vx-align-center vx-justify-center"
2180
+ [arTooltip]="'View Responsibilities in Queue'"
2181
+ placement="bottom-right"
2182
+ type="black"
2183
+ delay="0"
2184
+ [href]="queueURL"
2185
+ [tooltipMandatory]="true"
2186
+ >
2187
+ <i class="icons vx-fs-12 vx-txt-white">&#xea27;</i>
2188
+ <span
2189
+ class="queue-value vx-fs-9 vx-fw-500 vx-txt-white vx-d-flex vx-align-center vx-justify-center vx-pl-1 vx-pr-1"
2190
+ >{{ apiService?.queueCount$ | async }}</span
2191
+ >
2192
+ </a>
2193
+ `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";.header-queue{background:#e87315;border-radius:3rem;width:1.5rem;height:1.5rem;margin-left:1.75rem;position:relative}.header-queue .queue-value{background:#c7381b;border-radius:1.25rem;border:.125rem solid #161b2f;height:1rem;min-width:1.125rem;position:absolute;top:-.375rem;right:-.625rem}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }] }); }
2162
2194
  }
2163
2195
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: QueueComponent, decorators: [{
2164
2196
  type: Component,
2165
- args: [{ selector: 'vc-queue', template: `
2166
- <a
2167
- *ngIf="apiService?.queueCount$ | async"
2168
- class="header-queue vx-d-flex vx-align-center vx-justify-center"
2169
- [arTooltip]="'View Responsibilities in Queue'"
2170
- placement="bottom-right"
2171
- type="black"
2172
- delay="0"
2173
- [href]="queueURL"
2174
- [tooltipMandatory]="true"
2175
- >
2176
- <i class="icons vx-fs-12 vx-txt-white">&#xea27;</i>
2177
- <span
2178
- class="queue-value vx-fs-9 vx-fw-500 vx-txt-white vx-d-flex vx-align-center vx-justify-center vx-pl-1 vx-pr-1"
2179
- >{{ apiService?.queueCount$ | async }}</span
2180
- >
2181
- </a>
2182
- `, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";.header-queue{background:#e87315;border-radius:3rem;width:1.5rem;height:1.5rem;margin-left:1.75rem;position:relative;text-decoration:none!important}.header-queue .queue-value{background:#c7381b;border-radius:1.25rem;border:.125rem solid #161b2f;height:1rem;min-width:1.125rem;position:absolute;top:-.375rem;right:-.625rem}\n"] }]
2197
+ args: [{ selector: 'vc-queue', template: `
2198
+ <a
2199
+ *ngIf="apiService?.queueCount$ | async"
2200
+ class="header-queue vx-d-flex vx-align-center vx-justify-center"
2201
+ [arTooltip]="'View Responsibilities in Queue'"
2202
+ placement="bottom-right"
2203
+ type="black"
2204
+ delay="0"
2205
+ [href]="queueURL"
2206
+ [tooltipMandatory]="true"
2207
+ >
2208
+ <i class="icons vx-fs-12 vx-txt-white">&#xea27;</i>
2209
+ <span
2210
+ class="queue-value vx-fs-9 vx-fw-500 vx-txt-white vx-d-flex vx-align-center vx-justify-center vx-pl-1 vx-pr-1"
2211
+ >{{ apiService?.queueCount$ | async }}</span
2212
+ >
2213
+ </a>
2214
+ `, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";.header-queue{background:#e87315;border-radius:3rem;width:1.5rem;height:1.5rem;margin-left:1.75rem;position:relative}.header-queue .queue-value{background:#c7381b;border-radius:1.25rem;border:.125rem solid #161b2f;height:1rem;min-width:1.125rem;position:absolute;top:-.375rem;right:-.625rem}\n"] }]
2183
2215
  }], ctorParameters: function () { return [{ type: ApiService }, { type: LayoutService }]; } });
2184
2216
 
2185
2217
  class GetFileUrlPipe {
@@ -2210,37 +2242,35 @@ class AvatarComponent {
2210
2242
  this.shortName = this.authService.getUser()?.short_name ?? '';
2211
2243
  }
2212
2244
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarComponent, deps: [{ token: i1$1.AuthorizerService }], target: i0.ɵɵFactoryTarget.Component }); }
2213
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AvatarComponent, selector: "vc-avatar", inputs: { userInfo: "userInfo", type: "type" }, ngImport: i0, template: `
2214
- <div class="vx-avatar " [ngClass]="type">
2215
- <span *ngIf="!userInfo?.profile_pic" class="blue">{{ shortName }}</span>
2216
- <img
2217
- *ngIf="userInfo?.profile_pic"
2218
- [src]="userInfo?.profile_pic | getFileUrl"
2219
- alt=""
2220
- />
2221
- </div>
2222
- `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/avatars/avatars.css\";\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: GetFileUrlPipe, name: "getFileUrl" }] }); }
2245
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AvatarComponent, selector: "vc-avatar", inputs: { userInfo: "userInfo", type: "type" }, ngImport: i0, template: `
2246
+ <div class="vx-avatar " [ngClass]="type">
2247
+ <span *ngIf="!userInfo?.profile_pic" class="blue">{{ shortName }}</span>
2248
+ <img
2249
+ *ngIf="userInfo?.profile_pic"
2250
+ [src]="userInfo?.profile_pic | getFileUrl"
2251
+ alt=""
2252
+ />
2253
+ </div>
2254
+ `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/avatars/avatars.css\";\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: GetFileUrlPipe, name: "getFileUrl" }] }); }
2223
2255
  }
2224
2256
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarComponent, decorators: [{
2225
2257
  type: Component,
2226
- args: [{ selector: 'vc-avatar', template: `
2227
- <div class="vx-avatar " [ngClass]="type">
2228
- <span *ngIf="!userInfo?.profile_pic" class="blue">{{ shortName }}</span>
2229
- <img
2230
- *ngIf="userInfo?.profile_pic"
2231
- [src]="userInfo?.profile_pic | getFileUrl"
2232
- alt=""
2233
- />
2234
- </div>
2235
- `, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/avatars/avatars.css\";\n"] }]
2258
+ args: [{ selector: 'vc-avatar', template: `
2259
+ <div class="vx-avatar " [ngClass]="type">
2260
+ <span *ngIf="!userInfo?.profile_pic" class="blue">{{ shortName }}</span>
2261
+ <img
2262
+ *ngIf="userInfo?.profile_pic"
2263
+ [src]="userInfo?.profile_pic | getFileUrl"
2264
+ alt=""
2265
+ />
2266
+ </div>
2267
+ `, styles: ["@import\"https://cdn.v-comply.com/design-system/css/avatars/avatars.css\";\n"] }]
2236
2268
  }], ctorParameters: function () { return [{ type: i1$1.AuthorizerService }]; }, propDecorators: { userInfo: [{
2237
2269
  type: Input
2238
2270
  }], type: [{
2239
2271
  type: Input
2240
2272
  }] } });
2241
2273
 
2242
- // for local testing
2243
- // import { AuthorizerService } from '../../../../../../vcomply-authorizer/src/lib/services/authorizer.service';
2244
2274
  class UserDetailsComponent {
2245
2275
  constructor(layoutService, authService) {
2246
2276
  this.layoutService = layoutService;
@@ -2254,11 +2284,11 @@ class UserDetailsComponent {
2254
2284
  this.authService.logout();
2255
2285
  }
2256
2286
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UserDetailsComponent, deps: [{ token: LayoutService }, { token: i1$1.AuthorizerService }], target: i0.ɵɵFactoryTarget.Component }); }
2257
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: UserDetailsComponent, selector: "vc-user-details", inputs: { userDetails: "userDetails", subscriptionDetails: "subscriptionDetails" }, ngImport: i0, template: "<div\r\n class=\"header-user-details\"\r\n [arTooltip]=\"'View Your Profile'\"\r\n placement=\"bottom-right\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n appPopover\r\n (click)=\"userInfo.popover()\"\r\n position=\"right\"\r\n>\r\n <vc-avatar [userInfo]=\"userDetails\"></vc-avatar>\r\n</div>\r\n\r\n<vui-popover #userInfo [dontCloseonClick]=\"true\">\r\n <div class=\"header-user-details-box vx-mt-3 vx-bg-neutral-0 vx-radius-4\">\r\n <div\r\n class=\"header-user-details-box-top vx-d-flex vx-align-center vx-p-3 vx-pl-2 vx-pr-2\"\r\n >\r\n <vc-avatar [userInfo]=\"userDetails\" [type]=\"'x-lg'\"></vc-avatar>\r\n <div class=\"header-user-details-box-top-right vx-ml-4\">\r\n <div\r\n class=\"userName vx-fs-13 vx-fw-600 vx-neutral-100 vx-lh-5 vx-tt-capitalize\"\r\n [arTooltip]=\"userDetails?.member_name\"\r\n placement=\"bottom-left\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"false\"\r\n >\r\n {{ userDetails?.member_name }}\r\n </div>\r\n <div\r\n class=\"userEmail vx-fs-11 vx-gray-60 vx-lh-4\"\r\n [arTooltip]=\"userDetails?.member_email\"\r\n placement=\"bottom-left\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"false\"\r\n >\r\n {{ userDetails?.member_email }}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"header-user-details-box-mid\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li\r\n class=\"vx-fs-11 vx-d-flex vx-align-center vx-p-3 vx-pl-2 vx-pr-2 vx-lh-4\"\r\n >\r\n <span class=\"vx-neutral-100 vx-fw-500 vx-tt-uppercase\"\r\n >SUBSCRIPTION :</span\r\n >\r\n <span\r\n [class.expired]=\"subscriptionDetails?.after_expired_days_allow\"\r\n >{{\r\n subscriptionDetails?.after_expired_days_allow\r\n ? \"Expired\"\r\n : \"Active\"\r\n }}</span\r\n >\r\n </li>\r\n <li\r\n class=\"vx-fs-11 vx-d-flex vx-align-center vx-p-3 vx-pl-2 vx-pr-2 vx-lh-4\"\r\n >\r\n <span class=\"vx-neutral-100 vx-fw-500 vx-tt-uppercase\"\r\n >EXPIRING ON :</span\r\n >\r\n <span class=\"vx-gray-60\">{{\r\n subscriptionDetails?.expiredDetails | date: \"dd MMM yyyy\"\r\n }}</span>\r\n </li>\r\n <li\r\n class=\"vx-fs-11 vx-d-flex vx-align-center vx-p-3 vx-pl-2 vx-pr-2 vx-lh-4\"\r\n >\r\n <span class=\"vx-neutral-100 vx-fw-500 vx-tt-uppercase\"\r\n >Support Pin :</span\r\n >\r\n <span class=\"vx-gray-60\">{{ userDetails?.calling_pin }}</span>\r\n </li>\r\n </ul>\r\n </div>\r\n <div\r\n class=\"header-user-details-box-bottom vx-d-flex vx-align-center vx-justify-center vx-pt-3 vx-pb-3\"\r\n >\r\n <button (click)=\"editProfile()\" class=\"vx-button subtle small primary\">\r\n Edit Profile\r\n </button>\r\n <button (click)=\"logout()\" class=\"vx-button bold small primary\">\r\n Log out\r\n </button>\r\n </div>\r\n </div>\r\n</vui-popover>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/border-radius/border-radius.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/button/button.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";::ng-deep .header-user-details{cursor:pointer;margin-left:1.75rem}::ng-deep .header-user-details vc-avatar .vx-avatar{border:none;width:1.5rem;height:1.5rem}::ng-deep .header-user-details vc-avatar .vx-avatar span{font-size:10px;font-weight:400}::ng-deep .header-user-details-box{border:1px solid #e3e3e9;box-shadow:0 4px 8px #1e5dd326;width:17.5rem}::ng-deep .header-user-details-box-top vc-avatar .vx-avatar{border:.125rem solid #f2f2f5;width:5rem;height:5rem}::ng-deep .header-user-details-box-top vc-avatar .vx-avatar span{font-size:18px;font-weight:600}::ng-deep .header-user-details-box-top-right{width:calc(100% - 6rem)}::ng-deep .header-user-details-box-top-right .userName{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .header-user-details-box-top-right .userEmail{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .header-user-details-box-mid ul li{border-bottom:1px solid #e3e3e9}::ng-deep .header-user-details-box-mid ul li:first-of-type span:nth-child(2){color:#34aa44}::ng-deep .header-user-details-box-mid ul li span{position:relative}::ng-deep .header-user-details-box-mid ul li span:first-of-type{width:6rem}::ng-deep .header-user-details-box-mid ul li span.expired{color:#c7381b!important}::ng-deep .header-user-details-box-bottom button{margin:0 .125rem!important}\n"], dependencies: [{ kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: AvatarComponent, selector: "vc-avatar", inputs: ["userInfo", "type"] }, { kind: "component", type: PopoverComponent, selector: "vui-popover", inputs: ["dontCloseonClick"], outputs: ["closedOnOverlay"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "position"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
2287
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: UserDetailsComponent, selector: "vc-user-details", inputs: { userDetails: "userDetails", subscriptionDetails: "subscriptionDetails" }, ngImport: i0, template: "<div\n class=\"header-user-details\"\n [arTooltip]=\"'View Your Profile'\"\n placement=\"bottom-right\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"true\"\n appPopover\n (click)=\"userInfo.popover()\"\n position=\"right\"\n>\n <vc-avatar [userInfo]=\"userDetails\"></vc-avatar>\n</div>\n\n<vui-popover #userInfo [dontCloseonClick]=\"true\">\n <div class=\"header-user-details-box vx-mt-3 vx-pl-2 vx-pr-2\">\n <div\n class=\"header-user-details-box-top vx-d-flex vx-align-center vx-pt-2 vx-pb-2\"\n >\n <vc-avatar [userInfo]=\"userDetails\" [type]=\"'x-lg'\"></vc-avatar>\n <div class=\"header-user-details-box-top-right vx-ml-2\">\n <div\n class=\"userName vx-fs-13 vx-fw-500 vx-label-txt vx-tt-capitalize\"\n [arTooltip]=\"userDetails?.member_name\"\n placement=\"bottom-left\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"false\"\n >\n {{ userDetails?.member_name }}\n </div>\n <div\n class=\"userEmail vx-fs-11 vx-paragraph-txt\"\n [arTooltip]=\"userDetails?.member_email\"\n placement=\"bottom-left\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"false\"\n >\n {{ userDetails?.member_email }}\n </div>\n </div>\n </div>\n <div class=\"header-user-details-box-mid\">\n <ul class=\"vx-p-0 vx-m-0\">\n <li\n class=\"vx-fs-12 vx-d-flex vx-align-center vx-justify-between vx-pt-2 vx-pb-2 vx-lh-4\"\n >\n <span class=\"vx-label-txt vx-fw-500 vx-tt-uppercase vx-pl-3\"\n >SUBSCRIPTION :</span\n >\n <span\n [class.expired]=\"subscriptionDetails?.after_expired_days_allow\"\n >{{\n subscriptionDetails?.after_expired_days_allow\n ? \"Expired\"\n : \"Active\"\n }}</span\n >\n </li>\n <li\n class=\"vx-fs-12 vx-d-flex vx-align-center vx-justify-between vx-pt-2 vx-pb-2 vx-lh-4\"\n >\n <span class=\"vx-label-txt vx-fw-500 vx-tt-uppercase vx-pl-3\"\n >EXPIRING ON :</span\n >\n <span class=\"vx-paragraph-txt\">{{\n subscriptionDetails?.expiredDetails | date : \"dd MMM yyyy\"\n }}</span>\n </li>\n <li\n class=\"vx-fs-12 vx-d-flex vx-align-center vx-justify-between vx-pt-2 vx-pb-2 vx-lh-4\"\n >\n <span class=\"vx-label-txt vx-fw-500 vx-tt-uppercase vx-pl-3\"\n >Support Pin :</span\n >\n <span class=\"vx-paragraph-txt\">{{ userDetails?.calling_pin }}</span>\n </li>\n </ul>\n </div>\n <div\n class=\"header-user-details-box-bottom vx-d-flex vx-align-center vx-justify-center vx-pt-3 vx-pb-3\"\n >\n <button\n (click)=\"editProfile()\"\n class=\"editProfile-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0\"\n >\n Edit Profile\n </button>\n <button\n (click)=\"logout()\"\n class=\"logout-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0\"\n >\n Log out\n </button>\n </div>\n </div>\n</vui-popover>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";::ng-deep .header-user-details{cursor:pointer;margin-left:18px}::ng-deep .header-user-details vc-avatar .vx-avatar{border:none;width:1.5rem;height:1.5rem}::ng-deep .header-user-details vc-avatar .vx-avatar span{font-size:10px;font-weight:400}::ng-deep .header-user-details-box{background:#fff;border:1px solid #e3e3e9;border-radius:.25rem;box-shadow:0 4px 8px #1e5dd326;width:19rem}::ng-deep .header-user-details-box-top vc-avatar .vx-avatar{border:none;width:5rem;height:5rem}::ng-deep .header-user-details-box-top vc-avatar .vx-avatar span{font-size:18px;font-weight:600}::ng-deep .header-user-details-box-top-right{width:calc(100% - 5.5rem)}::ng-deep .header-user-details-box-top-right .userName{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .header-user-details-box-top-right .userEmail{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .header-user-details-box-mid ul li{border-bottom:1px solid #f1f1f1}::ng-deep .header-user-details-box-mid ul li span{width:50%;position:relative}::ng-deep .header-user-details-box-mid ul li span:first-of-type:before{background:#1e5dd3;color:#34aa44;content:\"\";position:absolute;left:.125rem;top:.125rem;width:1px;height:.75rem}::ng-deep .header-user-details-box-mid ul li span.expired{color:#d93b41}::ng-deep .header-user-details-box-bottom button{border-radius:.125rem;height:1.5rem;margin:0 .125rem!important}::ng-deep .header-user-details-box-bottom button.editProfile-btn{background:#fff;border:1px solid #1e5dd3}::ng-deep .header-user-details-box-bottom button.logout-btn{background:#1e5dd3;border:1px solid #1e5dd3}\n"], dependencies: [{ kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: AvatarComponent, selector: "vc-avatar", inputs: ["userInfo", "type"] }, { kind: "component", type: PopoverComponent, selector: "vui-popover", inputs: ["dontCloseonClick"], outputs: ["closedOnOverlay"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "position"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
2258
2288
  }
2259
2289
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UserDetailsComponent, decorators: [{
2260
2290
  type: Component,
2261
- args: [{ selector: 'vc-user-details', template: "<div\r\n class=\"header-user-details\"\r\n [arTooltip]=\"'View Your Profile'\"\r\n placement=\"bottom-right\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n appPopover\r\n (click)=\"userInfo.popover()\"\r\n position=\"right\"\r\n>\r\n <vc-avatar [userInfo]=\"userDetails\"></vc-avatar>\r\n</div>\r\n\r\n<vui-popover #userInfo [dontCloseonClick]=\"true\">\r\n <div class=\"header-user-details-box vx-mt-3 vx-bg-neutral-0 vx-radius-4\">\r\n <div\r\n class=\"header-user-details-box-top vx-d-flex vx-align-center vx-p-3 vx-pl-2 vx-pr-2\"\r\n >\r\n <vc-avatar [userInfo]=\"userDetails\" [type]=\"'x-lg'\"></vc-avatar>\r\n <div class=\"header-user-details-box-top-right vx-ml-4\">\r\n <div\r\n class=\"userName vx-fs-13 vx-fw-600 vx-neutral-100 vx-lh-5 vx-tt-capitalize\"\r\n [arTooltip]=\"userDetails?.member_name\"\r\n placement=\"bottom-left\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"false\"\r\n >\r\n {{ userDetails?.member_name }}\r\n </div>\r\n <div\r\n class=\"userEmail vx-fs-11 vx-gray-60 vx-lh-4\"\r\n [arTooltip]=\"userDetails?.member_email\"\r\n placement=\"bottom-left\"\r\n type=\"black\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"false\"\r\n >\r\n {{ userDetails?.member_email }}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"header-user-details-box-mid\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li\r\n class=\"vx-fs-11 vx-d-flex vx-align-center vx-p-3 vx-pl-2 vx-pr-2 vx-lh-4\"\r\n >\r\n <span class=\"vx-neutral-100 vx-fw-500 vx-tt-uppercase\"\r\n >SUBSCRIPTION :</span\r\n >\r\n <span\r\n [class.expired]=\"subscriptionDetails?.after_expired_days_allow\"\r\n >{{\r\n subscriptionDetails?.after_expired_days_allow\r\n ? \"Expired\"\r\n : \"Active\"\r\n }}</span\r\n >\r\n </li>\r\n <li\r\n class=\"vx-fs-11 vx-d-flex vx-align-center vx-p-3 vx-pl-2 vx-pr-2 vx-lh-4\"\r\n >\r\n <span class=\"vx-neutral-100 vx-fw-500 vx-tt-uppercase\"\r\n >EXPIRING ON :</span\r\n >\r\n <span class=\"vx-gray-60\">{{\r\n subscriptionDetails?.expiredDetails | date: \"dd MMM yyyy\"\r\n }}</span>\r\n </li>\r\n <li\r\n class=\"vx-fs-11 vx-d-flex vx-align-center vx-p-3 vx-pl-2 vx-pr-2 vx-lh-4\"\r\n >\r\n <span class=\"vx-neutral-100 vx-fw-500 vx-tt-uppercase\"\r\n >Support Pin :</span\r\n >\r\n <span class=\"vx-gray-60\">{{ userDetails?.calling_pin }}</span>\r\n </li>\r\n </ul>\r\n </div>\r\n <div\r\n class=\"header-user-details-box-bottom vx-d-flex vx-align-center vx-justify-center vx-pt-3 vx-pb-3\"\r\n >\r\n <button (click)=\"editProfile()\" class=\"vx-button subtle small primary\">\r\n Edit Profile\r\n </button>\r\n <button (click)=\"logout()\" class=\"vx-button bold small primary\">\r\n Log out\r\n </button>\r\n </div>\r\n </div>\r\n</vui-popover>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/border-radius/border-radius.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/button/button.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";::ng-deep .header-user-details{cursor:pointer;margin-left:1.75rem}::ng-deep .header-user-details vc-avatar .vx-avatar{border:none;width:1.5rem;height:1.5rem}::ng-deep .header-user-details vc-avatar .vx-avatar span{font-size:10px;font-weight:400}::ng-deep .header-user-details-box{border:1px solid #e3e3e9;box-shadow:0 4px 8px #1e5dd326;width:17.5rem}::ng-deep .header-user-details-box-top vc-avatar .vx-avatar{border:.125rem solid #f2f2f5;width:5rem;height:5rem}::ng-deep .header-user-details-box-top vc-avatar .vx-avatar span{font-size:18px;font-weight:600}::ng-deep .header-user-details-box-top-right{width:calc(100% - 6rem)}::ng-deep .header-user-details-box-top-right .userName{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .header-user-details-box-top-right .userEmail{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .header-user-details-box-mid ul li{border-bottom:1px solid #e3e3e9}::ng-deep .header-user-details-box-mid ul li:first-of-type span:nth-child(2){color:#34aa44}::ng-deep .header-user-details-box-mid ul li span{position:relative}::ng-deep .header-user-details-box-mid ul li span:first-of-type{width:6rem}::ng-deep .header-user-details-box-mid ul li span.expired{color:#c7381b!important}::ng-deep .header-user-details-box-bottom button{margin:0 .125rem!important}\n"] }]
2291
+ args: [{ selector: 'vc-user-details', template: "<div\n class=\"header-user-details\"\n [arTooltip]=\"'View Your Profile'\"\n placement=\"bottom-right\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"true\"\n appPopover\n (click)=\"userInfo.popover()\"\n position=\"right\"\n>\n <vc-avatar [userInfo]=\"userDetails\"></vc-avatar>\n</div>\n\n<vui-popover #userInfo [dontCloseonClick]=\"true\">\n <div class=\"header-user-details-box vx-mt-3 vx-pl-2 vx-pr-2\">\n <div\n class=\"header-user-details-box-top vx-d-flex vx-align-center vx-pt-2 vx-pb-2\"\n >\n <vc-avatar [userInfo]=\"userDetails\" [type]=\"'x-lg'\"></vc-avatar>\n <div class=\"header-user-details-box-top-right vx-ml-2\">\n <div\n class=\"userName vx-fs-13 vx-fw-500 vx-label-txt vx-tt-capitalize\"\n [arTooltip]=\"userDetails?.member_name\"\n placement=\"bottom-left\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"false\"\n >\n {{ userDetails?.member_name }}\n </div>\n <div\n class=\"userEmail vx-fs-11 vx-paragraph-txt\"\n [arTooltip]=\"userDetails?.member_email\"\n placement=\"bottom-left\"\n type=\"black\"\n delay=\"0\"\n [tooltipMandatory]=\"false\"\n >\n {{ userDetails?.member_email }}\n </div>\n </div>\n </div>\n <div class=\"header-user-details-box-mid\">\n <ul class=\"vx-p-0 vx-m-0\">\n <li\n class=\"vx-fs-12 vx-d-flex vx-align-center vx-justify-between vx-pt-2 vx-pb-2 vx-lh-4\"\n >\n <span class=\"vx-label-txt vx-fw-500 vx-tt-uppercase vx-pl-3\"\n >SUBSCRIPTION :</span\n >\n <span\n [class.expired]=\"subscriptionDetails?.after_expired_days_allow\"\n >{{\n subscriptionDetails?.after_expired_days_allow\n ? \"Expired\"\n : \"Active\"\n }}</span\n >\n </li>\n <li\n class=\"vx-fs-12 vx-d-flex vx-align-center vx-justify-between vx-pt-2 vx-pb-2 vx-lh-4\"\n >\n <span class=\"vx-label-txt vx-fw-500 vx-tt-uppercase vx-pl-3\"\n >EXPIRING ON :</span\n >\n <span class=\"vx-paragraph-txt\">{{\n subscriptionDetails?.expiredDetails | date : \"dd MMM yyyy\"\n }}</span>\n </li>\n <li\n class=\"vx-fs-12 vx-d-flex vx-align-center vx-justify-between vx-pt-2 vx-pb-2 vx-lh-4\"\n >\n <span class=\"vx-label-txt vx-fw-500 vx-tt-uppercase vx-pl-3\"\n >Support Pin :</span\n >\n <span class=\"vx-paragraph-txt\">{{ userDetails?.calling_pin }}</span>\n </li>\n </ul>\n </div>\n <div\n class=\"header-user-details-box-bottom vx-d-flex vx-align-center vx-justify-center vx-pt-3 vx-pb-3\"\n >\n <button\n (click)=\"editProfile()\"\n class=\"editProfile-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0\"\n >\n Edit Profile\n </button>\n <button\n (click)=\"logout()\"\n class=\"logout-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0\"\n >\n Log out\n </button>\n </div>\n </div>\n</vui-popover>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";::ng-deep .header-user-details{cursor:pointer;margin-left:18px}::ng-deep .header-user-details vc-avatar .vx-avatar{border:none;width:1.5rem;height:1.5rem}::ng-deep .header-user-details vc-avatar .vx-avatar span{font-size:10px;font-weight:400}::ng-deep .header-user-details-box{background:#fff;border:1px solid #e3e3e9;border-radius:.25rem;box-shadow:0 4px 8px #1e5dd326;width:19rem}::ng-deep .header-user-details-box-top vc-avatar .vx-avatar{border:none;width:5rem;height:5rem}::ng-deep .header-user-details-box-top vc-avatar .vx-avatar span{font-size:18px;font-weight:600}::ng-deep .header-user-details-box-top-right{width:calc(100% - 5.5rem)}::ng-deep .header-user-details-box-top-right .userName{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .header-user-details-box-top-right .userEmail{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .header-user-details-box-mid ul li{border-bottom:1px solid #f1f1f1}::ng-deep .header-user-details-box-mid ul li span{width:50%;position:relative}::ng-deep .header-user-details-box-mid ul li span:first-of-type:before{background:#1e5dd3;color:#34aa44;content:\"\";position:absolute;left:.125rem;top:.125rem;width:1px;height:.75rem}::ng-deep .header-user-details-box-mid ul li span.expired{color:#d93b41}::ng-deep .header-user-details-box-bottom button{border-radius:.125rem;height:1.5rem;margin:0 .125rem!important}::ng-deep .header-user-details-box-bottom button.editProfile-btn{background:#fff;border:1px solid #1e5dd3}::ng-deep .header-user-details-box-bottom button.logout-btn{background:#1e5dd3;border:1px solid #1e5dd3}\n"] }]
2262
2292
  }], ctorParameters: function () { return [{ type: LayoutService }, { type: i1$1.AuthorizerService }]; }, propDecorators: { userDetails: [{
2263
2293
  type: Input
2264
2294
  }], subscriptionDetails: [{
@@ -2272,23 +2302,23 @@ class SupportComponent {
2272
2302
  }
2273
2303
  ngOnInit() { }
2274
2304
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SupportComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2275
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SupportComponent, selector: "vc-support", outputs: { openSupport: "openSupport" }, ngImport: i0, template: `<div
2276
- (click)="openSupport.emit()"
2277
- class="header-support vx-fs-11 vx-neutral-0 vx-tt-uppercase vx-p-1 vx-pl-2 vx-pr-2 vx-mr-2 vx-d-flex vx-align-center vx-radius-4"
2278
- >
2279
- <img [src]="ASSETS.support_icon" alt="Support" width="18" height="14" />
2280
- SUPPORT
2281
- </div>`, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.header-support{cursor:pointer;height:1.5rem;position:relative}.header-support:before{background:#74757690;content:\"\";position:absolute;top:0;right:-.5rem;width:1px;height:1.5rem}.header-support:hover{background:#343952}.header-support img{margin-right:.375rem}\n"] }); }
2305
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SupportComponent, selector: "vc-support", outputs: { openSupport: "openSupport" }, ngImport: i0, template: `<div
2306
+ (click)="openSupport.emit()"
2307
+ class="header-support vx-fs-11 vx-txt-white vx-tt-uppercase vx-p-1 vx-pl-3 vx-pr-3 vx-d-flex vx-align-center"
2308
+ >
2309
+ <img [src]="ASSETS.support_icon" alt="Support" width="18" height="14" />
2310
+ SUPPORT
2311
+ </div>`, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.header-support{border-radius:.125rem;cursor:pointer;height:1.5rem;position:relative;margin-right:6px}.header-support:before{background:#74757690;content:\"\";position:absolute;top:0;right:-.5rem;width:1px;height:1.5rem}.header-support:hover{background:#343952}.header-support img{margin-right:.375rem}\n"] }); }
2282
2312
  }
2283
2313
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SupportComponent, decorators: [{
2284
2314
  type: Component,
2285
- args: [{ selector: 'vc-support', template: `<div
2286
- (click)="openSupport.emit()"
2287
- class="header-support vx-fs-11 vx-neutral-0 vx-tt-uppercase vx-p-1 vx-pl-2 vx-pr-2 vx-mr-2 vx-d-flex vx-align-center vx-radius-4"
2288
- >
2289
- <img [src]="ASSETS.support_icon" alt="Support" width="18" height="14" />
2290
- SUPPORT
2291
- </div>`, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.header-support{cursor:pointer;height:1.5rem;position:relative}.header-support:before{background:#74757690;content:\"\";position:absolute;top:0;right:-.5rem;width:1px;height:1.5rem}.header-support:hover{background:#343952}.header-support img{margin-right:.375rem}\n"] }]
2315
+ args: [{ selector: 'vc-support', template: `<div
2316
+ (click)="openSupport.emit()"
2317
+ class="header-support vx-fs-11 vx-txt-white vx-tt-uppercase vx-p-1 vx-pl-3 vx-pr-3 vx-d-flex vx-align-center"
2318
+ >
2319
+ <img [src]="ASSETS.support_icon" alt="Support" width="18" height="14" />
2320
+ SUPPORT
2321
+ </div>`, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.header-support{border-radius:.125rem;cursor:pointer;height:1.5rem;position:relative;margin-right:6px}.header-support:before{background:#74757690;content:\"\";position:absolute;top:0;right:-.5rem;width:1px;height:1.5rem}.header-support:hover{background:#343952}.header-support img{margin-right:.375rem}\n"] }]
2292
2322
  }], ctorParameters: function () { return []; }, propDecorators: { openSupport: [{
2293
2323
  type: Output
2294
2324
  }] } });
@@ -2319,6 +2349,7 @@ class HeaderContainerComponent {
2319
2349
  this.showBusinessCycle = BUSINESS_CYCLE_URL;
2320
2350
  this.currentUrl = '';
2321
2351
  this.defaultURL = '';
2352
+ this.showCreateWorkflow = true;
2322
2353
  this.showSearch = false;
2323
2354
  this.isAdvanceSearch = false;
2324
2355
  this.iframeLoading = false;
@@ -2332,6 +2363,7 @@ class HeaderContainerComponent {
2332
2363
  ngOnInit() {
2333
2364
  this.checkXmasCapVisibility();
2334
2365
  this.checkSnowFallVisibility();
2366
+ this.checkComplianceFlag();
2335
2367
  }
2336
2368
  ngOnDestroy() {
2337
2369
  // Clear interval to prevent memory leaks
@@ -2379,22 +2411,29 @@ class HeaderContainerComponent {
2379
2411
  // If today is after December 20, use January 7 of next year as the end date
2380
2412
  if (today.getMonth() === 11 && today.getDate() >= 20) {
2381
2413
  startDate = new Date(currentYear, 11, 20); // December 20 of current year
2382
- endDate = new Date(currentYear + 1, 0, 7, 23, 59, 59); // January 7 of next year
2414
+ endDate = new Date(currentYear + 1, 0, 3, 23, 59, 59); // January 7 of next year
2383
2415
  }
2384
2416
  else {
2385
2417
  // Otherwise, use December 20 of the previous year and January 7 of the current year
2386
2418
  startDate = new Date(currentYear - 1, 11, 20); // December 20 of previous year
2387
- endDate = new Date(currentYear, 0, 7, 23, 59, 59); // January 7 of current year
2419
+ endDate = new Date(currentYear, 0, 3, 23, 59, 59); // January 7 of current year
2388
2420
  }
2389
2421
  // Check if today is within the range
2390
2422
  this.isXmasCapVisible = today >= startDate && today <= endDate;
2391
2423
  }
2424
+ checkComplianceFlag() {
2425
+ this.apiService.subscriptionDetail$.subscribe((subscriptionData) => {
2426
+ if (subscriptionData) {
2427
+ this.showCreateWorkflow = subscriptionData.compliance_flag === 1;
2428
+ }
2429
+ });
2430
+ }
2392
2431
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderContainerComponent, deps: [{ token: ApiService }, { token: LayoutService }, { token: i1$4.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
2393
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderContainerComponent, selector: "vc-header-container", inputs: { showSearch: "showSearch", featureFlag: "featureFlag", isAdvanceSearch: "isAdvanceSearch", iframeLoading: "iframeLoading" }, outputs: { businessCycleChange: "businessCycleChange", openDialog: "openDialog", onSearchAction: "onSearchAction" }, ngImport: i0, template: "<vc-global-alert [feature]=\"featureFlag\"></vc-global-alert>\r\n<div\r\n class=\"header-container vx-d-flex vx-align-center vx-justify-between vx-pr-3\"\r\n>\r\n <div id=\"snowfall\" *ngIf=\"isXmasCapVisible\" [class.animate]=\"showAnimation\">\r\n <div class=\"snow\"></div>\r\n <div class=\"snow1\"></div>\r\n <div class=\"snow2\"></div>\r\n </div>\r\n <div class=\"header-container-left vx-d-flex vx-align-center\">\r\n <a\r\n class=\"product-logo vx-d-flex vx-align-center vx-justify-center vx-mr-3\"\r\n [arTooltip]=\"'Go to Dashboard'\"\r\n placement=\"right\"\r\n type=\"white\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n [animate]=\"true\"\r\n [href]=\"defaultURL\"\r\n >\r\n <img\r\n *ngIf=\"isXmasCapVisible\"\r\n class=\"xmas-cap\"\r\n [src]=\"ASSETS.xmas_cap\"\r\n alt=\"Santa Cap\"\r\n width=\"20\"\r\n height=\"20\" />\r\n <img [src]=\"ASSETS.v_icon\" alt=\"VComply\" width=\"24\" height=\"24\"\r\n /></a>\r\n <vc-business-cycle\r\n *ngIf=\"isBusinessCycleVisible\"\r\n (businessCycleChange)=\"businessCycleChangeHandler($event)\"\r\n ></vc-business-cycle>\r\n </div>\r\n <div class=\"search-area\">\r\n <vc-search\r\n *ngIf=\"showSearch\"\r\n [isAdvanceSearch]=\"isAdvanceSearch\"\r\n (onSearchAction)=\"onSearchAction.emit($event)\"\r\n ></vc-search>\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <vc-support (openSupport)=\"openDialog.emit('SUPPORT')\"></vc-support>\r\n <vc-create-workflow\r\n *ngIf=\"apiService.loggedUserDetail$ | async | checkPermission\"\r\n (openWorkflow)=\"openDialog.emit('WORKFLOW')\"\r\n [iframeLoading]=\"iframeLoading\"\r\n ></vc-create-workflow>\r\n <vc-queue></vc-queue>\r\n <vc-user-details\r\n [userDetails]=\"apiService.loggedUserDetail$ | async\"\r\n [subscriptionDetails]=\"apiService.subscriptionDetail$ | async\"\r\n ></vc-user-details>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.header-container{height:3rem}.header-container-left{width:16.25rem}.header-container .product-logo{width:3rem;height:3rem;position:relative}.header-container .product-logo img{pointer-events:none}.header-container .product-logo img.xmas-cap{position:absolute;top:.25rem;left:.375rem}#snowfall{position:absolute;width:100%;height:6.25rem;z-index:-1}.animate .snow{position:absolute;border-radius:50%;filter:blur(1px);background-color:#fff;width:.625rem;height:.625rem;top:-1000px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation:snowfall 7s linear,fadeOut 7s ease-out forwards}.animate .snow:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-150px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-250px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow1{position:absolute;border-radius:50%;filter:blur(2px);background-color:#fff;width:9px;height:9px;top:-850px;left:123px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation-delay:-3s;animation:snowfall 9s linear,fadeOut 9s ease-out forwards}.animate .snow1:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-350px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow1:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-450px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow2{position:absolute;border-radius:50%;filter:blur(1.5px);background-color:#fff;width:9px;height:9px;top:-900px;left:-50px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation-delay:-4s;animation:snowfall 14s linear,fadeOut 14s ease-out forwards}.animate .snow2:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-550px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow2:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-650px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}@keyframes snowfall{to{transform:translateY(1500px)}}@keyframes fadeOut{0%{opacity:0}50%{opacity:1}to{opacity:0}}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: GlobalAlertComponent, selector: "vc-global-alert", inputs: ["feature"], outputs: ["subscriptionStatus"] }, { kind: "component", type: BusinessCycleComponent, selector: "vc-business-cycle", inputs: ["orgDetails"], outputs: ["businessCycleChange"] }, { kind: "component", type: SearchComponent, selector: "vc-search", inputs: ["isAdvanceSearch"], outputs: ["onSearchAction"] }, { kind: "component", type: CreateWorkflowComponent, selector: "vc-create-workflow", inputs: ["iframeLoading"], outputs: ["openWorkflow"] }, { kind: "component", type: QueueComponent, selector: "vc-queue" }, { kind: "component", type: UserDetailsComponent, selector: "vc-user-details", inputs: ["userDetails", "subscriptionDetails"] }, { kind: "component", type: SupportComponent, selector: "vc-support", outputs: ["openSupport"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: CreatePermissionPipe, name: "checkPermission" }] }); }
2432
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderContainerComponent, selector: "vc-header-container", inputs: { showSearch: "showSearch", featureFlag: "featureFlag", isAdvanceSearch: "isAdvanceSearch", iframeLoading: "iframeLoading" }, outputs: { businessCycleChange: "businessCycleChange", openDialog: "openDialog", onSearchAction: "onSearchAction" }, ngImport: i0, template: "<vc-global-alert [feature]=\"featureFlag\"></vc-global-alert>\n<div\n class=\"header-container vx-d-flex vx-align-center vx-justify-between vx-pr-3\"\n>\n <div id=\"snowfall\" *ngIf=\"isXmasCapVisible\" [class.animate]=\"showAnimation\">\n <div class=\"snow\"></div>\n <div class=\"snow1\"></div>\n <div class=\"snow2\"></div>\n </div>\n <div class=\"header-container-left vx-d-flex vx-align-center\">\n <a\n class=\"product-logo vx-d-flex vx-align-center vx-justify-center vx-mr-3\"\n [href]=\"defaultURL\"\n >\n <img\n *ngIf=\"isXmasCapVisible\"\n class=\"xmas-cap\"\n [src]=\"ASSETS.xmas_cap\"\n alt=\"Santa Cap\"\n width=\"20\"\n height=\"20\" />\n <img [src]=\"ASSETS.v_icon\" alt=\"VComply\" width=\"24\" height=\"24\"\n /></a>\n <vc-business-cycle\n *ngIf=\"isBusinessCycleVisible\"\n (businessCycleChange)=\"businessCycleChangeHandler($event)\"\n ></vc-business-cycle>\n </div>\n <div class=\"search-area\">\n <vc-search\n *ngIf=\"showSearch\"\n [isAdvanceSearch]=\"isAdvanceSearch\"\n (onSearchAction)=\"onSearchAction.emit($event)\"\n ></vc-search>\n </div>\n <div class=\"vx-d-flex vx-align-center\">\n <vc-support (openSupport)=\"openDialog.emit('SUPPORT')\"></vc-support>\n <vc-create-workflow\n *ngIf=\"(apiService.loggedUserDetail$ | async | checkPermission) && showCreateWorkflow\"\n (openWorkflow)=\"openDialog.emit('WORKFLOW')\"\n [iframeLoading]=\"iframeLoading\"\n ></vc-create-workflow>\n <vc-queue></vc-queue>\n <vc-user-details\n [userDetails]=\"apiService.loggedUserDetail$ | async\"\n [subscriptionDetails]=\"apiService.subscriptionDetail$ | async\"\n ></vc-user-details>\n </div>\n</div>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.header-container{height:3rem}.header-container-left{width:260px}.header-container .product-logo{width:3rem;height:3rem;position:relative}.header-container .product-logo img{pointer-events:none}.header-container .product-logo img.xmas-cap{position:absolute;top:.25rem;left:.375rem}#snowfall{position:absolute;width:100%;height:100px;z-index:-1}.animate .snow{position:absolute;border-radius:50%;filter:blur(1px);background-color:#fff;width:10px;height:10px;top:-1000px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation:snowfall 7s linear,fadeOut 7s ease-out forwards}.animate .snow:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-150px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-250px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow1{position:absolute;border-radius:50%;filter:blur(2px);background-color:#fff;width:9px;height:9px;top:-850px;left:123px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation-delay:-3s;animation:snowfall 9s linear,fadeOut 9s ease-out forwards}.animate .snow1:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-350px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow1:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-450px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow2{position:absolute;border-radius:50%;filter:blur(1.5px);background-color:#fff;width:9px;height:9px;top:-900px;left:-50px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation-delay:-4s;animation:snowfall 14s linear,fadeOut 14s ease-out forwards}.animate .snow2:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-550px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow2:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-650px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}@keyframes snowfall{to{transform:translateY(1500px)}}@keyframes fadeOut{0%{opacity:0}50%{opacity:1}to{opacity:0}}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GlobalAlertComponent, selector: "vc-global-alert", inputs: ["feature"], outputs: ["subscriptionStatus"] }, { kind: "component", type: BusinessCycleComponent, selector: "vc-business-cycle", inputs: ["orgDetails"], outputs: ["businessCycleChange"] }, { kind: "component", type: SearchComponent, selector: "vc-search", inputs: ["isAdvanceSearch"], outputs: ["onSearchAction"] }, { kind: "component", type: CreateWorkflowComponent, selector: "vc-create-workflow", inputs: ["iframeLoading"], outputs: ["openWorkflow"] }, { kind: "component", type: QueueComponent, selector: "vc-queue" }, { kind: "component", type: UserDetailsComponent, selector: "vc-user-details", inputs: ["userDetails", "subscriptionDetails"] }, { kind: "component", type: SupportComponent, selector: "vc-support", outputs: ["openSupport"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: CreatePermissionPipe, name: "checkPermission" }] }); }
2394
2433
  }
2395
2434
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderContainerComponent, decorators: [{
2396
2435
  type: Component,
2397
- args: [{ selector: 'vc-header-container', template: "<vc-global-alert [feature]=\"featureFlag\"></vc-global-alert>\r\n<div\r\n class=\"header-container vx-d-flex vx-align-center vx-justify-between vx-pr-3\"\r\n>\r\n <div id=\"snowfall\" *ngIf=\"isXmasCapVisible\" [class.animate]=\"showAnimation\">\r\n <div class=\"snow\"></div>\r\n <div class=\"snow1\"></div>\r\n <div class=\"snow2\"></div>\r\n </div>\r\n <div class=\"header-container-left vx-d-flex vx-align-center\">\r\n <a\r\n class=\"product-logo vx-d-flex vx-align-center vx-justify-center vx-mr-3\"\r\n [arTooltip]=\"'Go to Dashboard'\"\r\n placement=\"right\"\r\n type=\"white\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n [animate]=\"true\"\r\n [href]=\"defaultURL\"\r\n >\r\n <img\r\n *ngIf=\"isXmasCapVisible\"\r\n class=\"xmas-cap\"\r\n [src]=\"ASSETS.xmas_cap\"\r\n alt=\"Santa Cap\"\r\n width=\"20\"\r\n height=\"20\" />\r\n <img [src]=\"ASSETS.v_icon\" alt=\"VComply\" width=\"24\" height=\"24\"\r\n /></a>\r\n <vc-business-cycle\r\n *ngIf=\"isBusinessCycleVisible\"\r\n (businessCycleChange)=\"businessCycleChangeHandler($event)\"\r\n ></vc-business-cycle>\r\n </div>\r\n <div class=\"search-area\">\r\n <vc-search\r\n *ngIf=\"showSearch\"\r\n [isAdvanceSearch]=\"isAdvanceSearch\"\r\n (onSearchAction)=\"onSearchAction.emit($event)\"\r\n ></vc-search>\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <vc-support (openSupport)=\"openDialog.emit('SUPPORT')\"></vc-support>\r\n <vc-create-workflow\r\n *ngIf=\"apiService.loggedUserDetail$ | async | checkPermission\"\r\n (openWorkflow)=\"openDialog.emit('WORKFLOW')\"\r\n [iframeLoading]=\"iframeLoading\"\r\n ></vc-create-workflow>\r\n <vc-queue></vc-queue>\r\n <vc-user-details\r\n [userDetails]=\"apiService.loggedUserDetail$ | async\"\r\n [subscriptionDetails]=\"apiService.subscriptionDetail$ | async\"\r\n ></vc-user-details>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";.header-container{height:3rem}.header-container-left{width:16.25rem}.header-container .product-logo{width:3rem;height:3rem;position:relative}.header-container .product-logo img{pointer-events:none}.header-container .product-logo img.xmas-cap{position:absolute;top:.25rem;left:.375rem}#snowfall{position:absolute;width:100%;height:6.25rem;z-index:-1}.animate .snow{position:absolute;border-radius:50%;filter:blur(1px);background-color:#fff;width:.625rem;height:.625rem;top:-1000px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation:snowfall 7s linear,fadeOut 7s ease-out forwards}.animate .snow:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-150px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-250px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow1{position:absolute;border-radius:50%;filter:blur(2px);background-color:#fff;width:9px;height:9px;top:-850px;left:123px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation-delay:-3s;animation:snowfall 9s linear,fadeOut 9s ease-out forwards}.animate .snow1:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-350px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow1:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-450px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow2{position:absolute;border-radius:50%;filter:blur(1.5px);background-color:#fff;width:9px;height:9px;top:-900px;left:-50px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation-delay:-4s;animation:snowfall 14s linear,fadeOut 14s ease-out forwards}.animate .snow2:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-550px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow2:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-650px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}@keyframes snowfall{to{transform:translateY(1500px)}}@keyframes fadeOut{0%{opacity:0}50%{opacity:1}to{opacity:0}}\n"] }]
2436
+ args: [{ selector: 'vc-header-container', template: "<vc-global-alert [feature]=\"featureFlag\"></vc-global-alert>\n<div\n class=\"header-container vx-d-flex vx-align-center vx-justify-between vx-pr-3\"\n>\n <div id=\"snowfall\" *ngIf=\"isXmasCapVisible\" [class.animate]=\"showAnimation\">\n <div class=\"snow\"></div>\n <div class=\"snow1\"></div>\n <div class=\"snow2\"></div>\n </div>\n <div class=\"header-container-left vx-d-flex vx-align-center\">\n <a\n class=\"product-logo vx-d-flex vx-align-center vx-justify-center vx-mr-3\"\n [href]=\"defaultURL\"\n >\n <img\n *ngIf=\"isXmasCapVisible\"\n class=\"xmas-cap\"\n [src]=\"ASSETS.xmas_cap\"\n alt=\"Santa Cap\"\n width=\"20\"\n height=\"20\" />\n <img [src]=\"ASSETS.v_icon\" alt=\"VComply\" width=\"24\" height=\"24\"\n /></a>\n <vc-business-cycle\n *ngIf=\"isBusinessCycleVisible\"\n (businessCycleChange)=\"businessCycleChangeHandler($event)\"\n ></vc-business-cycle>\n </div>\n <div class=\"search-area\">\n <vc-search\n *ngIf=\"showSearch\"\n [isAdvanceSearch]=\"isAdvanceSearch\"\n (onSearchAction)=\"onSearchAction.emit($event)\"\n ></vc-search>\n </div>\n <div class=\"vx-d-flex vx-align-center\">\n <vc-support (openSupport)=\"openDialog.emit('SUPPORT')\"></vc-support>\n <vc-create-workflow\n *ngIf=\"(apiService.loggedUserDetail$ | async | checkPermission) && showCreateWorkflow\"\n (openWorkflow)=\"openDialog.emit('WORKFLOW')\"\n [iframeLoading]=\"iframeLoading\"\n ></vc-create-workflow>\n <vc-queue></vc-queue>\n <vc-user-details\n [userDetails]=\"apiService.loggedUserDetail$ | async\"\n [subscriptionDetails]=\"apiService.subscriptionDetail$ | async\"\n ></vc-user-details>\n </div>\n</div>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.header-container{height:3rem}.header-container-left{width:260px}.header-container .product-logo{width:3rem;height:3rem;position:relative}.header-container .product-logo img{pointer-events:none}.header-container .product-logo img.xmas-cap{position:absolute;top:.25rem;left:.375rem}#snowfall{position:absolute;width:100%;height:100px;z-index:-1}.animate .snow{position:absolute;border-radius:50%;filter:blur(1px);background-color:#fff;width:10px;height:10px;top:-1000px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation:snowfall 7s linear,fadeOut 7s ease-out forwards}.animate .snow:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-150px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-250px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow1{position:absolute;border-radius:50%;filter:blur(2px);background-color:#fff;width:9px;height:9px;top:-850px;left:123px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation-delay:-3s;animation:snowfall 9s linear,fadeOut 9s ease-out forwards}.animate .snow1:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-350px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow1:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-450px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow2{position:absolute;border-radius:50%;filter:blur(1.5px);background-color:#fff;width:9px;height:9px;top:-900px;left:-50px;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff;animation-delay:-4s;animation:snowfall 14s linear,fadeOut 14s ease-out forwards}.animate .snow2:before{content:\"\";width:7px;height:7px;position:absolute;background-color:#fff;left:200px;top:-550px;border-radius:50%;box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}.animate .snow2:after{content:\"\";width:5px;height:5px;position:absolute;background-color:#fff;left:300px;top:-650px;border-radius:50%;filter:blur(1px);box-shadow:20px 20px 1px #fff,60px 40px 1px #fff,160px 135px 1px #fff,260px 240px 1px #fff,360px 340px 1px #fff,460px 440px 1px #fff,560px 340px 1px #fff,660px 240px 1px #fff,760px 140px 1px #fff,260px 640px 1px #fff,160px 340px 1px #fff,260px 440px 1px #fff,760px 140px 1px #fff,860px 40px 1px #fff,760px 140px 1px #fff,1260px 120px 1px #fff,1460px 10px 1px #fff,1560px 30px 1px #fff,1590px 124px 1px #fff,1680px 415px 1px #fff,1720px 335px 1px #fff,1000px 212px 1px #fff,990px 311px 1px #fff,888px 122px 1px #fff,765px 10px 1px #fff,635px 15px 1px #fff,554px 111px 1px #fff,455px 222px 1px #fff,125px 105px 1px #fff,275px 96px 1px #fff,245px 40px 1px #fff,230px 70px 1px #fff,285px 17px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,360px 340px 1px #fff,430px 210px 1px #fff,523px 23px 1px #fff,1650px 335px 1px #fff,1777px 123px 1px #fff,1800px 222px 1px #fff,1360px 140px 1px #fff}@keyframes snowfall{to{transform:translateY(1500px)}}@keyframes fadeOut{0%{opacity:0}50%{opacity:1}to{opacity:0}}\n"] }]
2398
2437
  }], ctorParameters: function () { return [{ type: ApiService }, { type: LayoutService }, { type: i1$4.ActivatedRoute }]; }, propDecorators: { showSearch: [{
2399
2438
  type: Input
2400
2439
  }], featureFlag: [{
@@ -2422,87 +2461,87 @@ class SubMenuContainerComponent {
2422
2461
  this.onCloseSubMenu.emit();
2423
2462
  }
2424
2463
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SubMenuContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2425
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SubMenuContainerComponent, selector: "vc-sub-menu-container", inputs: { subMenuData: "subMenuData", eachProduct: "eachProduct", moduleTitle: "moduleTitle" }, outputs: { onCloseSubMenu: "onCloseSubMenu" }, ngImport: i0, template: `
2426
- <div
2427
- class="sub-menu-container vx-pl-2 vx-pr-2 vx-pb-5"
2428
- [class.hide]="false"
2429
- >
2430
- <div
2431
- class="top-close-area vx-d-flex vx-align-center vx-justify-between vx-mb-2"
2432
- >
2433
- <div class="vx-fs-11 vx-fw-500 vx-gray-50 vx-lh-4 vx-ml-2">
2434
- {{ moduleTitle }}
2435
- </div>
2436
- <button
2437
- (click)="onSubMenuClose()"
2438
- class="vx-fs-8 vx-d-flex vx-align-center vx-justify-center vx-p-0 vx-m-0"
2439
- [arTooltip]="'Close'"
2440
- placement="left"
2441
- type="white"
2442
- delay="0"
2443
- [tooltipMandatory]="true"
2444
- >
2445
- <i class="icons">&#xe96b;</i>
2446
- </button>
2447
- </div>
2448
- <ul *ngIf="subMenuData?.length" class="vx-m-0 vx-p-0">
2449
- <li
2450
- class="vx-mb-2"
2451
- *ngFor="let eachMenu of subMenuData"
2452
- [ngClass]="eachMenu?.class"
2453
- >
2454
- <a
2455
- class="vx-fs-13 vx-fw-400 vx-txt-white vx-p-2 vx-d-block"
2456
- [href]="eachMenu?.href"
2457
- >{{ eachMenu?.name }}</a
2458
- >
2459
- </li>
2460
- </ul>
2461
- <ng-content></ng-content>
2462
- </div>
2463
- `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";::ng-deep .sub-menu-container{background:#282e48;border-radius:.75rem 0 0 .75rem;height:calc(100% - .25rem);width:13rem;position:relative;transition:all .1s ease-out}::ng-deep .sub-menu-container.hide{margin-left:-13rem}::ng-deep .sub-menu-container.hide:before{display:none}::ng-deep .sub-menu-container:before{background:#282e48;content:\"\";position:absolute;top:0;right:-2rem;width:2rem;height:100%}::ng-deep .sub-menu-container .top-close-area{position:relative;padding:10px 0}::ng-deep .sub-menu-container .top-close-area:before{background:#565a6f;content:\"\";position:absolute;bottom:0;left:0;width:100%;height:1px}::ng-deep .sub-menu-container .top-close-area button{background:#e3e3e9;border-radius:.125rem;border:none;width:1rem;height:1rem}::ng-deep .sub-menu-container ul{list-style-type:none}::ng-deep .sub-menu-container ul li a{border-radius:.25rem;width:100%;height:2rem;text-decoration:none}::ng-deep .sub-menu-container ul li a:hover{background:#565a6f}::ng-deep .sub-menu-container ul li.active a{background:#565a6f}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }] }); }
2464
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SubMenuContainerComponent, selector: "vc-sub-menu-container", inputs: { subMenuData: "subMenuData", eachProduct: "eachProduct", moduleTitle: "moduleTitle" }, outputs: { onCloseSubMenu: "onCloseSubMenu" }, ngImport: i0, template: `
2465
+ <div
2466
+ class="sub-menu-container vx-pl-2 vx-pr-2 vx-pb-5"
2467
+ [class.hide]="false"
2468
+ >
2469
+ <div
2470
+ class="top-close-area vx-d-flex vx-align-center vx-justify-between vx-mb-2"
2471
+ >
2472
+ <div class="vx-fs-11 vx-fw-500 vx-gray-50 vx-lh-4 vx-ml-2">
2473
+ {{ moduleTitle }}
2474
+ </div>
2475
+ <button
2476
+ (click)="onSubMenuClose()"
2477
+ class="vx-fs-8 vx-d-flex vx-align-center vx-justify-center vx-p-0 vx-m-0"
2478
+ [arTooltip]="'Close'"
2479
+ placement="left"
2480
+ type="white"
2481
+ delay="0"
2482
+ [tooltipMandatory]="true"
2483
+ >
2484
+ <i class="icons">&#xe96b;</i>
2485
+ </button>
2486
+ </div>
2487
+ <ul *ngIf="subMenuData?.length" class="vx-m-0 vx-p-0">
2488
+ <li
2489
+ class="vx-mb-2"
2490
+ *ngFor="let eachMenu of subMenuData"
2491
+ [ngClass]="eachMenu?.class"
2492
+ >
2493
+ <a
2494
+ class="vx-fs-13 vx-fw-400 vx-txt-white vx-p-2 vx-d-block"
2495
+ [href]="eachMenu?.href"
2496
+ >{{ eachMenu?.name }}</a
2497
+ >
2498
+ </li>
2499
+ </ul>
2500
+ <ng-content></ng-content>
2501
+ </div>
2502
+ `, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";::ng-deep .sub-menu-container{background:#282e48;border-radius:.75rem 0 0 .75rem;height:calc(100% - .25rem);width:13rem;position:relative;transition:all .1s ease-out}::ng-deep .sub-menu-container.hide{margin-left:-13rem}::ng-deep .sub-menu-container.hide:before{display:none}::ng-deep .sub-menu-container:before{background:#282e48;content:\"\";position:absolute;top:0;right:-2rem;width:2rem;height:100%}::ng-deep .sub-menu-container .top-close-area{position:relative;padding:10px 0}::ng-deep .sub-menu-container .top-close-area:before{background:#565a6f;content:\"\";position:absolute;bottom:0;left:0;width:100%;height:1px}::ng-deep .sub-menu-container .top-close-area button{background:#e3e3e9;border-radius:.125rem;border:none;width:1rem;height:1rem}::ng-deep .sub-menu-container ul{list-style-type:none}::ng-deep .sub-menu-container ul li a{border-radius:.25rem;width:100%;height:2rem;text-decoration:none}::ng-deep .sub-menu-container ul li a:hover{background:#565a6f}::ng-deep .sub-menu-container ul li.active a{background:#565a6f}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }] }); }
2464
2503
  }
2465
2504
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SubMenuContainerComponent, decorators: [{
2466
2505
  type: Component,
2467
- args: [{ selector: 'vc-sub-menu-container', template: `
2468
- <div
2469
- class="sub-menu-container vx-pl-2 vx-pr-2 vx-pb-5"
2470
- [class.hide]="false"
2471
- >
2472
- <div
2473
- class="top-close-area vx-d-flex vx-align-center vx-justify-between vx-mb-2"
2474
- >
2475
- <div class="vx-fs-11 vx-fw-500 vx-gray-50 vx-lh-4 vx-ml-2">
2476
- {{ moduleTitle }}
2477
- </div>
2478
- <button
2479
- (click)="onSubMenuClose()"
2480
- class="vx-fs-8 vx-d-flex vx-align-center vx-justify-center vx-p-0 vx-m-0"
2481
- [arTooltip]="'Close'"
2482
- placement="left"
2483
- type="white"
2484
- delay="0"
2485
- [tooltipMandatory]="true"
2486
- >
2487
- <i class="icons">&#xe96b;</i>
2488
- </button>
2489
- </div>
2490
- <ul *ngIf="subMenuData?.length" class="vx-m-0 vx-p-0">
2491
- <li
2492
- class="vx-mb-2"
2493
- *ngFor="let eachMenu of subMenuData"
2494
- [ngClass]="eachMenu?.class"
2495
- >
2496
- <a
2497
- class="vx-fs-13 vx-fw-400 vx-txt-white vx-p-2 vx-d-block"
2498
- [href]="eachMenu?.href"
2499
- >{{ eachMenu?.name }}</a
2500
- >
2501
- </li>
2502
- </ul>
2503
- <ng-content></ng-content>
2504
- </div>
2505
- `, styles: ["@import\"https://cdn.v-comply.com/design-system/css-v2/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css-v2/padding/padding-left.css\";::ng-deep .sub-menu-container{background:#282e48;border-radius:.75rem 0 0 .75rem;height:calc(100% - .25rem);width:13rem;position:relative;transition:all .1s ease-out}::ng-deep .sub-menu-container.hide{margin-left:-13rem}::ng-deep .sub-menu-container.hide:before{display:none}::ng-deep .sub-menu-container:before{background:#282e48;content:\"\";position:absolute;top:0;right:-2rem;width:2rem;height:100%}::ng-deep .sub-menu-container .top-close-area{position:relative;padding:10px 0}::ng-deep .sub-menu-container .top-close-area:before{background:#565a6f;content:\"\";position:absolute;bottom:0;left:0;width:100%;height:1px}::ng-deep .sub-menu-container .top-close-area button{background:#e3e3e9;border-radius:.125rem;border:none;width:1rem;height:1rem}::ng-deep .sub-menu-container ul{list-style-type:none}::ng-deep .sub-menu-container ul li a{border-radius:.25rem;width:100%;height:2rem;text-decoration:none}::ng-deep .sub-menu-container ul li a:hover{background:#565a6f}::ng-deep .sub-menu-container ul li.active a{background:#565a6f}\n"] }]
2506
+ args: [{ selector: 'vc-sub-menu-container', template: `
2507
+ <div
2508
+ class="sub-menu-container vx-pl-2 vx-pr-2 vx-pb-5"
2509
+ [class.hide]="false"
2510
+ >
2511
+ <div
2512
+ class="top-close-area vx-d-flex vx-align-center vx-justify-between vx-mb-2"
2513
+ >
2514
+ <div class="vx-fs-11 vx-fw-500 vx-gray-50 vx-lh-4 vx-ml-2">
2515
+ {{ moduleTitle }}
2516
+ </div>
2517
+ <button
2518
+ (click)="onSubMenuClose()"
2519
+ class="vx-fs-8 vx-d-flex vx-align-center vx-justify-center vx-p-0 vx-m-0"
2520
+ [arTooltip]="'Close'"
2521
+ placement="left"
2522
+ type="white"
2523
+ delay="0"
2524
+ [tooltipMandatory]="true"
2525
+ >
2526
+ <i class="icons">&#xe96b;</i>
2527
+ </button>
2528
+ </div>
2529
+ <ul *ngIf="subMenuData?.length" class="vx-m-0 vx-p-0">
2530
+ <li
2531
+ class="vx-mb-2"
2532
+ *ngFor="let eachMenu of subMenuData"
2533
+ [ngClass]="eachMenu?.class"
2534
+ >
2535
+ <a
2536
+ class="vx-fs-13 vx-fw-400 vx-txt-white vx-p-2 vx-d-block"
2537
+ [href]="eachMenu?.href"
2538
+ >{{ eachMenu?.name }}</a
2539
+ >
2540
+ </li>
2541
+ </ul>
2542
+ <ng-content></ng-content>
2543
+ </div>
2544
+ `, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";::ng-deep .sub-menu-container{background:#282e48;border-radius:.75rem 0 0 .75rem;height:calc(100% - .25rem);width:13rem;position:relative;transition:all .1s ease-out}::ng-deep .sub-menu-container.hide{margin-left:-13rem}::ng-deep .sub-menu-container.hide:before{display:none}::ng-deep .sub-menu-container:before{background:#282e48;content:\"\";position:absolute;top:0;right:-2rem;width:2rem;height:100%}::ng-deep .sub-menu-container .top-close-area{position:relative;padding:10px 0}::ng-deep .sub-menu-container .top-close-area:before{background:#565a6f;content:\"\";position:absolute;bottom:0;left:0;width:100%;height:1px}::ng-deep .sub-menu-container .top-close-area button{background:#e3e3e9;border-radius:.125rem;border:none;width:1rem;height:1rem}::ng-deep .sub-menu-container ul{list-style-type:none}::ng-deep .sub-menu-container ul li a{border-radius:.25rem;width:100%;height:2rem;text-decoration:none}::ng-deep .sub-menu-container ul li a:hover{background:#565a6f}::ng-deep .sub-menu-container ul li.active a{background:#565a6f}\n"] }]
2506
2545
  }], ctorParameters: function () { return []; }, propDecorators: { subMenuData: [{
2507
2546
  type: Input
2508
2547
  }], eachProduct: [{
@@ -2687,11 +2726,11 @@ class CsRadioComponent {
2687
2726
  this.checkedEvent.emit(evt);
2688
2727
  }
2689
2728
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2690
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsRadioComponent, selector: "app-cs-radio", inputs: { disabled: "disabled", readonly: "readonly", name: "name", checked: "checked", value: "value" }, outputs: { checkedEvent: "checkedEvent" }, ngImport: i0, template: "<label class=\"radio-item\" [class.readonly]=\"readonly\">\r\n <input type=\"radio\" [disabled]=\"disabled\" [name]=\"name\" [value]=\"value\" [checked]=\"checked\" (change)=\"changeState($event)\" />\r\n <span class=\"radio\">\r\n <span class=\"inner\"></span>\r\n </span>\r\n <svg class=\"radiomark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"radiomark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <circle class=\"radiomark__check\" cx=\"26\" cy=\"26\" r=\"5\" fill=\"none\" />\r\n </svg>\r\n <span class=\"value\"><ng-content></ng-content></span>\r\n</label>\r\n", styles: ["label{max-width:600px}label.radio-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.radio-item.readonly{pointer-events:none}label.radio-item span{display:inline-flex;align-items:center}label.radio-item span.radio{background:#fff;height:16px;width:16px;border-radius:50%;border:1px solid #dbdbdb;position:relative;padding:5px;margin-top:0}label.radio-item span.radio .inner{height:10px;width:10px;border-radius:50%;background:#fff;display:none}label.radio-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.radio-item span.value:empty{display:none}label.radio-item svg{display:none;margin-top:0}label.radio-item input[type=radio]{display:none}label.radio-item input[type=radio]:checked+span.radio{display:none}label.radio-item input[type=radio]:checked~svg{display:block}label.radio-item input[type=radio]:disabled~*{opacity:.7}.radiomark{width:16px;height:16px;border-radius:50%;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.radiomark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.radiomark__check{stroke-dasharray:100;stroke-dashoffset:100;stroke-width:10;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }); }
2729
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsRadioComponent, selector: "app-cs-radio", inputs: { disabled: "disabled", readonly: "readonly", name: "name", checked: "checked", value: "value" }, outputs: { checkedEvent: "checkedEvent" }, ngImport: i0, template: "<label class=\"radio-item\" [class.readonly]=\"readonly\">\n <input type=\"radio\" [disabled]=\"disabled\" [name]=\"name\" [value]=\"value\" [checked]=\"checked\" (change)=\"changeState($event)\" />\n <span class=\"radio\">\n <span class=\"inner\"></span>\n </span>\n <svg class=\"radiomark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"radiomark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <circle class=\"radiomark__check\" cx=\"26\" cy=\"26\" r=\"5\" fill=\"none\" />\n </svg>\n <span class=\"value\"><ng-content></ng-content></span>\n</label>\n", styles: ["label{max-width:600px}label.radio-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.radio-item.readonly{pointer-events:none}label.radio-item span{display:inline-flex;align-items:center}label.radio-item span.radio{background:#fff;height:16px;width:16px;border-radius:50%;border:1px solid #dbdbdb;position:relative;padding:5px;margin-top:0}label.radio-item span.radio .inner{height:10px;width:10px;border-radius:50%;background:#fff;display:none}label.radio-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.radio-item span.value:empty{display:none}label.radio-item svg{display:none;margin-top:0}label.radio-item input[type=radio]{display:none}label.radio-item input[type=radio]:checked+span.radio{display:none}label.radio-item input[type=radio]:checked~svg{display:block}label.radio-item input[type=radio]:disabled~*{opacity:.7}.radiomark{width:16px;height:16px;border-radius:50%;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.radiomark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.radiomark__check{stroke-dasharray:100;stroke-dashoffset:100;stroke-width:10;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }); }
2691
2730
  }
2692
2731
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsRadioComponent, decorators: [{
2693
2732
  type: Component,
2694
- args: [{ selector: 'app-cs-radio', template: "<label class=\"radio-item\" [class.readonly]=\"readonly\">\r\n <input type=\"radio\" [disabled]=\"disabled\" [name]=\"name\" [value]=\"value\" [checked]=\"checked\" (change)=\"changeState($event)\" />\r\n <span class=\"radio\">\r\n <span class=\"inner\"></span>\r\n </span>\r\n <svg class=\"radiomark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"radiomark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <circle class=\"radiomark__check\" cx=\"26\" cy=\"26\" r=\"5\" fill=\"none\" />\r\n </svg>\r\n <span class=\"value\"><ng-content></ng-content></span>\r\n</label>\r\n", styles: ["label{max-width:600px}label.radio-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.radio-item.readonly{pointer-events:none}label.radio-item span{display:inline-flex;align-items:center}label.radio-item span.radio{background:#fff;height:16px;width:16px;border-radius:50%;border:1px solid #dbdbdb;position:relative;padding:5px;margin-top:0}label.radio-item span.radio .inner{height:10px;width:10px;border-radius:50%;background:#fff;display:none}label.radio-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.radio-item span.value:empty{display:none}label.radio-item svg{display:none;margin-top:0}label.radio-item input[type=radio]{display:none}label.radio-item input[type=radio]:checked+span.radio{display:none}label.radio-item input[type=radio]:checked~svg{display:block}label.radio-item input[type=radio]:disabled~*{opacity:.7}.radiomark{width:16px;height:16px;border-radius:50%;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.radiomark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.radiomark__check{stroke-dasharray:100;stroke-dashoffset:100;stroke-width:10;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
2733
+ args: [{ selector: 'app-cs-radio', template: "<label class=\"radio-item\" [class.readonly]=\"readonly\">\n <input type=\"radio\" [disabled]=\"disabled\" [name]=\"name\" [value]=\"value\" [checked]=\"checked\" (change)=\"changeState($event)\" />\n <span class=\"radio\">\n <span class=\"inner\"></span>\n </span>\n <svg class=\"radiomark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"radiomark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <circle class=\"radiomark__check\" cx=\"26\" cy=\"26\" r=\"5\" fill=\"none\" />\n </svg>\n <span class=\"value\"><ng-content></ng-content></span>\n</label>\n", styles: ["label{max-width:600px}label.radio-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.radio-item.readonly{pointer-events:none}label.radio-item span{display:inline-flex;align-items:center}label.radio-item span.radio{background:#fff;height:16px;width:16px;border-radius:50%;border:1px solid #dbdbdb;position:relative;padding:5px;margin-top:0}label.radio-item span.radio .inner{height:10px;width:10px;border-radius:50%;background:#fff;display:none}label.radio-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.radio-item span.value:empty{display:none}label.radio-item svg{display:none;margin-top:0}label.radio-item input[type=radio]{display:none}label.radio-item input[type=radio]:checked+span.radio{display:none}label.radio-item input[type=radio]:checked~svg{display:block}label.radio-item input[type=radio]:disabled~*{opacity:.7}.radiomark{width:16px;height:16px;border-radius:50%;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.radiomark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.radiomark__check{stroke-dasharray:100;stroke-dashoffset:100;stroke-width:10;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
2695
2734
  }], ctorParameters: function () { return []; }, propDecorators: { disabled: [{
2696
2735
  type: Input
2697
2736
  }], readonly: [{
@@ -2717,11 +2756,11 @@ class CsSwitchComponent {
2717
2756
  this.ngValueChange.emit(this.ngValue);
2718
2757
  }
2719
2758
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2720
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsSwitchComponent, selector: "app-cs-switch", inputs: { disabled: "disabled", ngValue: "ngValue", value: "value", tooltipMessage: "tooltipMessage", position: "position" }, outputs: { ngValueChange: "ngValueChange" }, ngImport: i0, template: "<label class=\"cs-switch\" [class.top]=\"position == 'top'\">\r\n <!-- [class.large]=\"large\" -->\r\n <span class=\"value\">\r\n <span [innerHTML]=\"value\" *ngIf=\"value != undefined\"></span>\r\n <!-- <span class=\"notification\" *ngIf=\"!tooltipMessage\" [appTooltip]=\"tooltipMessage\" placement=\"bottom-right\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">\r\n <i class=\"vc-icons\">&#xe9f3;</i>\r\n </span> -->\r\n </span>\r\n <!-- [class.last]=\"last\" -->\r\n <span\r\n class=\"switch\"\r\n *ngIf=\"tooltipMessage === '' || tooltipMessage === undefined\"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n [(ngModel)]=\"ngValue\"\r\n (ngModelChange)=\"valueChanged()\"\r\n [disabled]=\"disabled\"\r\n />\r\n <span class=\"switch-box\">\r\n <span class=\"switch-ball\"></span>\r\n </span>\r\n </span>\r\n <span\r\n class=\"switch\"\r\n *ngIf=\"tooltipMessage !== '' && tooltipMessage !== undefined\"\r\n [arTooltip]=\"tooltipMessage\"\r\n placement=\"bottom-right\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n [(ngModel)]=\"ngValue\"\r\n (ngModelChange)=\"valueChanged()\"\r\n [disabled]=\"disabled\"\r\n />\r\n <span class=\"switch-box\">\r\n <span class=\"switch-ball\"></span>\r\n </span>\r\n </span>\r\n</label>\r\n", styles: ["label.cs-switch{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;margin:0;padding:0}label.cs-switch.top{align-items:flex-start}label.cs-switch span.value{font-size:12px;color:#161b2f;font-weight:400;display:flex;justify-content:space-between;width:calc(100% - 35px);align-items:flex-start}label.cs-switch span.switch{position:relative;display:block;width:25px;height:14px}label.cs-switch span.switch input{position:absolute;opacity:0;margin:0;width:100%;height:100%;z-index:1;cursor:pointer}label.cs-switch span.switch input:checked+span.switch-box{background:#34aa44;border:1px solid #34aa44}label.cs-switch span.switch input:checked+span.switch-box .switch-ball{left:13px}label.cs-switch span.switch input:disabled{pointer-events:none}label.cs-switch span.switch input:disabled+.switch-box{opacity:.5}label.cs-switch span.switch-box{height:100%;width:100%;border-radius:11px;background:#bcbcbc;border:1px solid #bcbcbc;display:block;transition:all .2s ease-in-out}label.cs-switch span.switch-ball{height:10px;width:10px;background:#fff;border-radius:50%;border:1px solid #ffffff;display:block;position:absolute;left:2px;top:2px;bottom:1px;transition:all .2s ease-in-out}label.cs-switch span.notification{display:inline-flex;font-size:12px;cursor:pointer;color:#4681ef;align-items:center;line-height:20px;margin:0 10px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }] }); }
2759
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsSwitchComponent, selector: "app-cs-switch", inputs: { disabled: "disabled", ngValue: "ngValue", value: "value", tooltipMessage: "tooltipMessage", position: "position" }, outputs: { ngValueChange: "ngValueChange" }, ngImport: i0, template: "<label class=\"cs-switch\" [class.top]=\"position == 'top'\">\n <!-- [class.large]=\"large\" -->\n <span class=\"value\">\n <span [innerHTML]=\"value\" *ngIf=\"value != undefined\"></span>\n <!-- <span class=\"notification\" *ngIf=\"!tooltipMessage\" [appTooltip]=\"tooltipMessage\" placement=\"bottom-right\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">\n <i class=\"vc-icons\">&#xe9f3;</i>\n </span> -->\n </span>\n <!-- [class.last]=\"last\" -->\n <span\n class=\"switch\"\n *ngIf=\"tooltipMessage === '' || tooltipMessage === undefined\"\n >\n <input\n type=\"checkbox\"\n [(ngModel)]=\"ngValue\"\n (ngModelChange)=\"valueChanged()\"\n [disabled]=\"disabled\"\n />\n <span class=\"switch-box\">\n <span class=\"switch-ball\"></span>\n </span>\n </span>\n <span\n class=\"switch\"\n *ngIf=\"tooltipMessage !== '' && tooltipMessage !== undefined\"\n [arTooltip]=\"tooltipMessage\"\n placement=\"bottom-right\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n >\n <input\n type=\"checkbox\"\n [(ngModel)]=\"ngValue\"\n (ngModelChange)=\"valueChanged()\"\n [disabled]=\"disabled\"\n />\n <span class=\"switch-box\">\n <span class=\"switch-ball\"></span>\n </span>\n </span>\n</label>\n", styles: ["label.cs-switch{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;margin:0;padding:0}label.cs-switch.top{align-items:flex-start}label.cs-switch span.value{font-size:12px;color:#161b2f;font-weight:400;display:flex;justify-content:space-between;width:calc(100% - 35px);align-items:flex-start}label.cs-switch span.switch{position:relative;display:block;width:25px;height:14px}label.cs-switch span.switch input{position:absolute;opacity:0;margin:0;width:100%;height:100%;z-index:1;cursor:pointer}label.cs-switch span.switch input:checked+span.switch-box{background:#34aa44;border:1px solid #34aa44}label.cs-switch span.switch input:checked+span.switch-box .switch-ball{left:13px}label.cs-switch span.switch input:disabled{pointer-events:none}label.cs-switch span.switch input:disabled+.switch-box{opacity:.5}label.cs-switch span.switch-box{height:100%;width:100%;border-radius:11px;background:#bcbcbc;border:1px solid #bcbcbc;display:block;transition:all .2s ease-in-out}label.cs-switch span.switch-ball{height:10px;width:10px;background:#fff;border-radius:50%;border:1px solid #ffffff;display:block;position:absolute;left:2px;top:2px;bottom:1px;transition:all .2s ease-in-out}label.cs-switch span.notification{display:inline-flex;font-size:12px;cursor:pointer;color:#4681ef;align-items:center;line-height:20px;margin:0 10px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }] }); }
2721
2760
  }
2722
2761
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsSwitchComponent, decorators: [{
2723
2762
  type: Component,
2724
- args: [{ selector: 'app-cs-switch', template: "<label class=\"cs-switch\" [class.top]=\"position == 'top'\">\r\n <!-- [class.large]=\"large\" -->\r\n <span class=\"value\">\r\n <span [innerHTML]=\"value\" *ngIf=\"value != undefined\"></span>\r\n <!-- <span class=\"notification\" *ngIf=\"!tooltipMessage\" [appTooltip]=\"tooltipMessage\" placement=\"bottom-right\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">\r\n <i class=\"vc-icons\">&#xe9f3;</i>\r\n </span> -->\r\n </span>\r\n <!-- [class.last]=\"last\" -->\r\n <span\r\n class=\"switch\"\r\n *ngIf=\"tooltipMessage === '' || tooltipMessage === undefined\"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n [(ngModel)]=\"ngValue\"\r\n (ngModelChange)=\"valueChanged()\"\r\n [disabled]=\"disabled\"\r\n />\r\n <span class=\"switch-box\">\r\n <span class=\"switch-ball\"></span>\r\n </span>\r\n </span>\r\n <span\r\n class=\"switch\"\r\n *ngIf=\"tooltipMessage !== '' && tooltipMessage !== undefined\"\r\n [arTooltip]=\"tooltipMessage\"\r\n placement=\"bottom-right\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n >\r\n <input\r\n type=\"checkbox\"\r\n [(ngModel)]=\"ngValue\"\r\n (ngModelChange)=\"valueChanged()\"\r\n [disabled]=\"disabled\"\r\n />\r\n <span class=\"switch-box\">\r\n <span class=\"switch-ball\"></span>\r\n </span>\r\n </span>\r\n</label>\r\n", styles: ["label.cs-switch{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;margin:0;padding:0}label.cs-switch.top{align-items:flex-start}label.cs-switch span.value{font-size:12px;color:#161b2f;font-weight:400;display:flex;justify-content:space-between;width:calc(100% - 35px);align-items:flex-start}label.cs-switch span.switch{position:relative;display:block;width:25px;height:14px}label.cs-switch span.switch input{position:absolute;opacity:0;margin:0;width:100%;height:100%;z-index:1;cursor:pointer}label.cs-switch span.switch input:checked+span.switch-box{background:#34aa44;border:1px solid #34aa44}label.cs-switch span.switch input:checked+span.switch-box .switch-ball{left:13px}label.cs-switch span.switch input:disabled{pointer-events:none}label.cs-switch span.switch input:disabled+.switch-box{opacity:.5}label.cs-switch span.switch-box{height:100%;width:100%;border-radius:11px;background:#bcbcbc;border:1px solid #bcbcbc;display:block;transition:all .2s ease-in-out}label.cs-switch span.switch-ball{height:10px;width:10px;background:#fff;border-radius:50%;border:1px solid #ffffff;display:block;position:absolute;left:2px;top:2px;bottom:1px;transition:all .2s ease-in-out}label.cs-switch span.notification{display:inline-flex;font-size:12px;cursor:pointer;color:#4681ef;align-items:center;line-height:20px;margin:0 10px}\n"] }]
2763
+ args: [{ selector: 'app-cs-switch', template: "<label class=\"cs-switch\" [class.top]=\"position == 'top'\">\n <!-- [class.large]=\"large\" -->\n <span class=\"value\">\n <span [innerHTML]=\"value\" *ngIf=\"value != undefined\"></span>\n <!-- <span class=\"notification\" *ngIf=\"!tooltipMessage\" [appTooltip]=\"tooltipMessage\" placement=\"bottom-right\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">\n <i class=\"vc-icons\">&#xe9f3;</i>\n </span> -->\n </span>\n <!-- [class.last]=\"last\" -->\n <span\n class=\"switch\"\n *ngIf=\"tooltipMessage === '' || tooltipMessage === undefined\"\n >\n <input\n type=\"checkbox\"\n [(ngModel)]=\"ngValue\"\n (ngModelChange)=\"valueChanged()\"\n [disabled]=\"disabled\"\n />\n <span class=\"switch-box\">\n <span class=\"switch-ball\"></span>\n </span>\n </span>\n <span\n class=\"switch\"\n *ngIf=\"tooltipMessage !== '' && tooltipMessage !== undefined\"\n [arTooltip]=\"tooltipMessage\"\n placement=\"bottom-right\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n >\n <input\n type=\"checkbox\"\n [(ngModel)]=\"ngValue\"\n (ngModelChange)=\"valueChanged()\"\n [disabled]=\"disabled\"\n />\n <span class=\"switch-box\">\n <span class=\"switch-ball\"></span>\n </span>\n </span>\n</label>\n", styles: ["label.cs-switch{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;margin:0;padding:0}label.cs-switch.top{align-items:flex-start}label.cs-switch span.value{font-size:12px;color:#161b2f;font-weight:400;display:flex;justify-content:space-between;width:calc(100% - 35px);align-items:flex-start}label.cs-switch span.switch{position:relative;display:block;width:25px;height:14px}label.cs-switch span.switch input{position:absolute;opacity:0;margin:0;width:100%;height:100%;z-index:1;cursor:pointer}label.cs-switch span.switch input:checked+span.switch-box{background:#34aa44;border:1px solid #34aa44}label.cs-switch span.switch input:checked+span.switch-box .switch-ball{left:13px}label.cs-switch span.switch input:disabled{pointer-events:none}label.cs-switch span.switch input:disabled+.switch-box{opacity:.5}label.cs-switch span.switch-box{height:100%;width:100%;border-radius:11px;background:#bcbcbc;border:1px solid #bcbcbc;display:block;transition:all .2s ease-in-out}label.cs-switch span.switch-ball{height:10px;width:10px;background:#fff;border-radius:50%;border:1px solid #ffffff;display:block;position:absolute;left:2px;top:2px;bottom:1px;transition:all .2s ease-in-out}label.cs-switch span.notification{display:inline-flex;font-size:12px;cursor:pointer;color:#4681ef;align-items:center;line-height:20px;margin:0 10px}\n"] }]
2725
2764
  }], ctorParameters: function () { return []; }, propDecorators: { disabled: [{
2726
2765
  type: Input
2727
2766
  }], ngValue: [{
@@ -2740,11 +2779,11 @@ class CsRadioGroupComponent {
2740
2779
  constructor() { }
2741
2780
  ngOnInit() { }
2742
2781
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2743
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsRadioGroupComponent, selector: "app-cs-radio-group", ngImport: i0, template: "<app-cs-radio>fefre</app-cs-radio>\r\n<app-cs-radio>fefre</app-cs-radio>\r\n<app-cs-radio>fefre</app-cs-radio>\r\n<app-cs-radio>fefre</app-cs-radio>\r\n", styles: [""], dependencies: [{ kind: "component", type: CsRadioComponent, selector: "app-cs-radio", inputs: ["disabled", "readonly", "name", "checked", "value"], outputs: ["checkedEvent"] }] }); }
2782
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsRadioGroupComponent, selector: "app-cs-radio-group", ngImport: i0, template: "<app-cs-radio>fefre</app-cs-radio>\n<app-cs-radio>fefre</app-cs-radio>\n<app-cs-radio>fefre</app-cs-radio>\n<app-cs-radio>fefre</app-cs-radio>\n", styles: [""], dependencies: [{ kind: "component", type: CsRadioComponent, selector: "app-cs-radio", inputs: ["disabled", "readonly", "name", "checked", "value"], outputs: ["checkedEvent"] }] }); }
2744
2783
  }
2745
2784
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsRadioGroupComponent, decorators: [{
2746
2785
  type: Component,
2747
- args: [{ selector: 'app-cs-radio-group', template: "<app-cs-radio>fefre</app-cs-radio>\r\n<app-cs-radio>fefre</app-cs-radio>\r\n<app-cs-radio>fefre</app-cs-radio>\r\n<app-cs-radio>fefre</app-cs-radio>\r\n" }]
2786
+ args: [{ selector: 'app-cs-radio-group', template: "<app-cs-radio>fefre</app-cs-radio>\n<app-cs-radio>fefre</app-cs-radio>\n<app-cs-radio>fefre</app-cs-radio>\n<app-cs-radio>fefre</app-cs-radio>\n" }]
2748
2787
  }], ctorParameters: function () { return []; } });
2749
2788
 
2750
2789
  class ClickOutsideDirective {
@@ -2844,11 +2883,11 @@ class CsSelectComponent {
2844
2883
  this.dropdownOption = false;
2845
2884
  }
2846
2885
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2847
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsSelectComponent, selector: "app-cs-select", inputs: { dataList: "dataList", dropdownLabel: "dropdownLabel", displayProperty: "displayProperty", selectedValue: "selectedValue", isRequired: "isRequired", dropdownSubLabel: "dropdownSubLabel", disabled: "disabled", placeholder: "placeholder", stylex: "stylex", valueKey: "valueKey", multipleSelect: "multipleSelect", colorProperty: "colorProperty", colorSelected: "colorSelected" }, outputs: { selectedData: "selectedData", selectedValueChange: "selectedValueChange" }, viewQueries: [{ propertyName: "option", first: true, predicate: ["option"], descendants: true }, { propertyName: "content", first: true, predicate: ["optionList"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"input-group\" (clickOutside)=\"dropdownOption = false\">\r\n <label *ngIf=\"dropdownLabel != undefined\">\r\n {{ dropdownLabel }} <span class=\"sub-label\">{{ dropdownSubLabel }}</span>\r\n <span class=\"required\" *ngIf=\"isRequired\">*</span></label\r\n >\r\n <div class=\"custom-select-box\" [class.disabled]=\"disabled\">\r\n <input\r\n type=\"text\"\r\n [class.line]=\"stylex\"\r\n [placeholder]=\"placeholder\"\r\n [value]=\"selectedValue | pascal\"\r\n readonly\r\n (click)=\"openDropdown($event)\"\r\n (keyup.enter)=\"openDropdown($event)\"\r\n (keyup.arrowup)=\"openDropdown($event)\"\r\n (keyup.arrowdown)=\"openDropdown($event)\"\r\n *ngIf=\"!colorProperty\"\r\n />\r\n <span\r\n class=\"show-label\"\r\n *ngIf=\"colorProperty\"\r\n (click)=\"openDropdown($event)\"\r\n >\r\n <span\r\n class=\"label\"\r\n [innerHTML]=\"selectedValue\"\r\n [style.backgroundColor]=\"colorSelected + '1A'\"\r\n [style.color]=\"colorSelected\"\r\n ></span>\r\n </span>\r\n <!-- <span class=\"arrow\" [class.line]=\"stylex\">\r\n <i class=\"icons\">&#xe919;</i>\r\n </span> -->\r\n <div\r\n class=\"overlay active\"\r\n *ngIf=\"dropdownOption === true\"\r\n (click)=\"closeDropdown()\"\r\n ></div>\r\n <ul\r\n class=\"list-of-option\"\r\n *ngIf=\"dropdownOption === true && !colorProperty\"\r\n #optionList\r\n (keyup.Escape)=\"closeDropdown()\"\r\n [style.top.px]=\"getTop\"\r\n [style.left.px]=\"getLeft\"\r\n [style.min-width.px]=\"getWidth\"\r\n [style.max-width.px]=\"maxWidth\"\r\n [class.active]=\"activeDoropdown\"\r\n >\r\n <li *ngFor=\"let data of dataList\">\r\n <label>\r\n <input\r\n type=\"radio\"\r\n [value]=\"data[valueKey]\"\r\n name=\"sliceLabel\"\r\n (change)=\"selectOption(data)\"\r\n #option\r\n (keyup.enter)=\"closeDropdown()\"\r\n class=\"pointer-none\"\r\n />\r\n <span\r\n (click)=\"closeDropdown(); selectOption(data)\"\r\n *ngIf=\"displayProperty && displayProperty !== ''\"\r\n class=\"value\"\r\n [arTooltip]=\"data[displayProperty]\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n >{{ data[displayProperty] }}</span\r\n >\r\n <span\r\n (click)=\"closeDropdown(); selectOption(data)\"\r\n *ngIf=\"!displayProperty || displayProperty === ''\"\r\n class=\"value\"\r\n [arTooltip]=\"data\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n >{{ data }}</span\r\n >\r\n </label>\r\n </li>\r\n </ul>\r\n <ul\r\n class=\"list-of-option\"\r\n *ngIf=\"dropdownOption === true && colorProperty\"\r\n #optionList\r\n (keyup.Escape)=\"closeDropdown()\"\r\n [style.top.px]=\"getTop\"\r\n [style.left.px]=\"getLeft\"\r\n [style.min-width.px]=\"getWidth\"\r\n [style.max-width.px]=\"maxWidth\"\r\n [class.active]=\"activeDoropdown\"\r\n >\r\n <li *ngFor=\"let data of dataList\">\r\n <label class=\"colors\">\r\n <input\r\n type=\"radio\"\r\n [value]=\"data[valueKey]\"\r\n name=\"sliceLabel\"\r\n (click)=\"selectOption(data)\"\r\n #option\r\n (keyup.enter)=\"closeDropdown()\"\r\n class=\"pointer-none\"\r\n />\r\n <span\r\n (click)=\"selectOption(data)\"\r\n *ngIf=\"displayProperty && displayProperty !== ''\"\r\n class=\"value\"\r\n [arTooltip]=\"data[displayProperty]\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n [ngStyle]=\"{ color: data.segment_color }\"\r\n [style.backgroundColor]=\"data.segment_color + '1A'\"\r\n >{{ data[displayProperty] }}</span\r\n >\r\n <span\r\n (click)=\"selectOption(data)\"\r\n *ngIf=\"!displayProperty || displayProperty === ''\"\r\n class=\"value\"\r\n [arTooltip]=\"data\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n [ngStyle]=\"{ color: data.segment_color }\"\r\n [style.backgroundColor]=\"data.segment_color + '1A'\"\r\n >{{ data }}</span\r\n >\r\n </label>\r\n </li>\r\n </ul>\r\n </div>\r\n</div>\r\n", styles: [".input-group{position:relative;margin-bottom:0}.input-group label{font-size:11px;color:#161b2f;font-weight:500;line-height:16px;margin-bottom:5px;text-transform:uppercase;display:block}.input-group label span.required{color:#eb2424;font-size:14px}.input-group label span.sub-label{color:#747576;font-size:11px;font-weight:400;margin-left:3px}.input-group input[type=text],.input-group .show-label{height:36px;line-height:16px;font-size:13px;color:#747576;font-weight:400;background:#fff;border:1px solid #dbdbdb;border-radius:4px;width:100%;padding:10px 13px;display:block;outline:none;overflow:hidden;text-overflow:ellipsis}.input-group input[type=text].line,.input-group .show-label.line{border:none;border-bottom:1px solid #dbdbdb;border-radius:0;padding-left:0}.input-group .show-label{display:flex;padding:6px;padding-right:25px!important;cursor:pointer}.input-group .show-label .label{white-space:nowrap;padding:2px 5px;height:100%;overflow:hidden;text-overflow:ellipsis;display:block;width:100%;text-transform:uppercase;font-size:11px;font-weight:600;line-height:15px;pointer-events:none}.input-group:focus-within input[type=text]{border-color:#1e5dd3;box-shadow:0 3px 6px #1e5dd333}.input-group:focus-within input[type=text].line{box-shadow:none}.input-group .custom-select-box{background:#fff;position:relative}.input-group .custom-select-box:after{border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px;border-color:#707070;content:\"\";display:inline-block;right:15px;position:absolute;top:calc(50% - 4px);width:5px;height:5px;transform:rotate(45deg)}.input-group .custom-select-box input[type=text],.input-group .custom-select-box .input{cursor:pointer;padding-right:30px;background:transparent}.input-group .custom-select-box input[type=text].line,.input-group .custom-select-box .input.line{padding-right:20px}.input-group .custom-select-box.disabled{filter:grayscale(1);pointer-events:none}.input-group .arrow{position:absolute;right:17px;color:#747576;bottom:8px;font-size:10px;pointer-events:none}.input-group .arrow.line{right:5px}ul.list-of-option{position:fixed;overflow:auto;max-height:200px;padding:0;margin:0;display:block;border:1px solid #dbdbdb;box-shadow:0 3px 6px #1e5dd333;z-index:2147483002;background:#fff;border-radius:2px;opacity:0}ul.list-of-option.reset{top:inherit;bottom:100%;box-shadow:0 -3px 6px #1e5dd333}ul.list-of-option.active{opacity:1}ul.list-of-option li{width:100%;display:block;margin-bottom:0;padding:0;height:auto}ul.list-of-option li label{line-height:23px;font-size:13px;font-weight:400;border-radius:4px;display:flex;position:relative;margin:0;align-items:center}ul.list-of-option li label input[type=radio]{position:absolute;margin:0;height:100%;width:100%;opacity:0;left:0;cursor:pointer}ul.list-of-option li label input[type=radio]:checked+span,ul.list-of-option li label input[type=radio]:hover+span{background:#dcdcdc}ul.list-of-option li label span.value{color:#747576;font-size:14px;line-height:21px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;padding:5px 15px;width:100%;text-transform:none;cursor:pointer;text-align:left}ul.list-of-option li label.multiselect{padding:0 15px}ul.list-of-option li label.multiselect span.checkbox{display:inline-block;border:1px solid #dbdbdb;border-radius:2px;height:16px;width:16px;position:relative;padding:2px}ul.list-of-option li label input[type=checkbox]{position:absolute;margin:0;height:100%;width:100%;opacity:0;cursor:pointer}ul.list-of-option li label input[type=checkbox]:checked+span{background:#dcdcdc}ul.list-of-option li label input[type=checkbox]:checked+span.checkbox{border-color:#34aa44;background:#34aa44}ul.list-of-option li label input[type=checkbox]:checked+span.checkbox:after{width:8px;height:3px;border-bottom:2px solid #ffffff;border-left:2px solid #ffffff;transform:rotate(-45deg);content:\"\";position:absolute;top:3px;left:2px}ul.list-of-option li label.colors{padding:3px 5px}ul.list-of-option li label.colors span.value{padding:3px 6px;line-height:16px;font-size:11px;font-weight:600}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { kind: "pipe", type: PascalPipe, name: "pascal" }] }); }
2886
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsSelectComponent, selector: "app-cs-select", inputs: { dataList: "dataList", dropdownLabel: "dropdownLabel", displayProperty: "displayProperty", selectedValue: "selectedValue", isRequired: "isRequired", dropdownSubLabel: "dropdownSubLabel", disabled: "disabled", placeholder: "placeholder", stylex: "stylex", valueKey: "valueKey", multipleSelect: "multipleSelect", colorProperty: "colorProperty", colorSelected: "colorSelected" }, outputs: { selectedData: "selectedData", selectedValueChange: "selectedValueChange" }, viewQueries: [{ propertyName: "option", first: true, predicate: ["option"], descendants: true }, { propertyName: "content", first: true, predicate: ["optionList"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"input-group\" (clickOutside)=\"dropdownOption = false\">\n <label *ngIf=\"dropdownLabel != undefined\">\n {{ dropdownLabel }} <span class=\"sub-label\">{{ dropdownSubLabel }}</span>\n <span class=\"required\" *ngIf=\"isRequired\">*</span></label\n >\n <div class=\"custom-select-box\" [class.disabled]=\"disabled\">\n <input\n type=\"text\"\n [class.line]=\"stylex\"\n [placeholder]=\"placeholder\"\n [value]=\"selectedValue | pascal\"\n readonly\n (click)=\"openDropdown($event)\"\n (keyup.enter)=\"openDropdown($event)\"\n (keyup.arrowup)=\"openDropdown($event)\"\n (keyup.arrowdown)=\"openDropdown($event)\"\n *ngIf=\"!colorProperty\"\n />\n <span\n class=\"show-label\"\n *ngIf=\"colorProperty\"\n (click)=\"openDropdown($event)\"\n >\n <span\n class=\"label\"\n [innerHTML]=\"selectedValue\"\n [style.backgroundColor]=\"colorSelected + '1A'\"\n [style.color]=\"colorSelected\"\n ></span>\n </span>\n <!-- <span class=\"arrow\" [class.line]=\"stylex\">\n <i class=\"icons\">&#xe919;</i>\n </span> -->\n <div\n class=\"overlay active\"\n *ngIf=\"dropdownOption === true\"\n (click)=\"closeDropdown()\"\n ></div>\n <ul\n class=\"list-of-option\"\n *ngIf=\"dropdownOption === true && !colorProperty\"\n #optionList\n (keyup.Escape)=\"closeDropdown()\"\n [style.top.px]=\"getTop\"\n [style.left.px]=\"getLeft\"\n [style.min-width.px]=\"getWidth\"\n [style.max-width.px]=\"maxWidth\"\n [class.active]=\"activeDoropdown\"\n >\n <li *ngFor=\"let data of dataList\">\n <label>\n <input\n type=\"radio\"\n [value]=\"data[valueKey]\"\n name=\"sliceLabel\"\n (change)=\"selectOption(data)\"\n #option\n (keyup.enter)=\"closeDropdown()\"\n class=\"pointer-none\"\n />\n <span\n (click)=\"closeDropdown(); selectOption(data)\"\n *ngIf=\"displayProperty && displayProperty !== ''\"\n class=\"value\"\n [arTooltip]=\"data[displayProperty]\"\n placement=\"bottom-left\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n >{{ data[displayProperty] }}</span\n >\n <span\n (click)=\"closeDropdown(); selectOption(data)\"\n *ngIf=\"!displayProperty || displayProperty === ''\"\n class=\"value\"\n [arTooltip]=\"data\"\n placement=\"bottom-left\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n >{{ data }}</span\n >\n </label>\n </li>\n </ul>\n <ul\n class=\"list-of-option\"\n *ngIf=\"dropdownOption === true && colorProperty\"\n #optionList\n (keyup.Escape)=\"closeDropdown()\"\n [style.top.px]=\"getTop\"\n [style.left.px]=\"getLeft\"\n [style.min-width.px]=\"getWidth\"\n [style.max-width.px]=\"maxWidth\"\n [class.active]=\"activeDoropdown\"\n >\n <li *ngFor=\"let data of dataList\">\n <label class=\"colors\">\n <input\n type=\"radio\"\n [value]=\"data[valueKey]\"\n name=\"sliceLabel\"\n (click)=\"selectOption(data)\"\n #option\n (keyup.enter)=\"closeDropdown()\"\n class=\"pointer-none\"\n />\n <span\n (click)=\"selectOption(data)\"\n *ngIf=\"displayProperty && displayProperty !== ''\"\n class=\"value\"\n [arTooltip]=\"data[displayProperty]\"\n placement=\"bottom-left\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n [ngStyle]=\"{ color: data.segment_color }\"\n [style.backgroundColor]=\"data.segment_color + '1A'\"\n >{{ data[displayProperty] }}</span\n >\n <span\n (click)=\"selectOption(data)\"\n *ngIf=\"!displayProperty || displayProperty === ''\"\n class=\"value\"\n [arTooltip]=\"data\"\n placement=\"bottom-left\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n [ngStyle]=\"{ color: data.segment_color }\"\n [style.backgroundColor]=\"data.segment_color + '1A'\"\n >{{ data }}</span\n >\n </label>\n </li>\n </ul>\n </div>\n</div>\n", styles: [".input-group{position:relative;margin-bottom:0}.input-group label{font-size:11px;color:#161b2f;font-weight:500;line-height:16px;margin-bottom:5px;text-transform:uppercase;display:block}.input-group label span.required{color:#eb2424;font-size:14px}.input-group label span.sub-label{color:#747576;font-size:11px;font-weight:400;margin-left:3px}.input-group input[type=text],.input-group .show-label{height:36px;line-height:16px;font-size:13px;color:#747576;font-weight:400;background:#fff;border:1px solid #dbdbdb;border-radius:4px;width:100%;padding:10px 13px;display:block;outline:none;overflow:hidden;text-overflow:ellipsis}.input-group input[type=text].line,.input-group .show-label.line{border:none;border-bottom:1px solid #dbdbdb;border-radius:0;padding-left:0}.input-group .show-label{display:flex;padding:6px;padding-right:25px!important;cursor:pointer}.input-group .show-label .label{white-space:nowrap;padding:2px 5px;height:100%;overflow:hidden;text-overflow:ellipsis;display:block;width:100%;text-transform:uppercase;font-size:11px;font-weight:600;line-height:15px;pointer-events:none}.input-group:focus-within input[type=text]{border-color:#1e5dd3;box-shadow:0 3px 6px #1e5dd333}.input-group:focus-within input[type=text].line{box-shadow:none}.input-group .custom-select-box{background:#fff;position:relative}.input-group .custom-select-box:after{border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px;border-color:#707070;content:\"\";display:inline-block;right:15px;position:absolute;top:calc(50% - 4px);width:5px;height:5px;transform:rotate(45deg)}.input-group .custom-select-box input[type=text],.input-group .custom-select-box .input{cursor:pointer;padding-right:30px;background:transparent}.input-group .custom-select-box input[type=text].line,.input-group .custom-select-box .input.line{padding-right:20px}.input-group .custom-select-box.disabled{filter:grayscale(1);pointer-events:none}.input-group .arrow{position:absolute;right:17px;color:#747576;bottom:8px;font-size:10px;pointer-events:none}.input-group .arrow.line{right:5px}ul.list-of-option{position:fixed;overflow:auto;max-height:200px;padding:0;margin:0;display:block;border:1px solid #dbdbdb;box-shadow:0 3px 6px #1e5dd333;z-index:2147483002;background:#fff;border-radius:2px;opacity:0}ul.list-of-option.reset{top:inherit;bottom:100%;box-shadow:0 -3px 6px #1e5dd333}ul.list-of-option.active{opacity:1}ul.list-of-option li{width:100%;display:block;margin-bottom:0;padding:0;height:auto}ul.list-of-option li label{line-height:23px;font-size:13px;font-weight:400;border-radius:4px;display:flex;position:relative;margin:0;align-items:center}ul.list-of-option li label input[type=radio]{position:absolute;margin:0;height:100%;width:100%;opacity:0;left:0;cursor:pointer}ul.list-of-option li label input[type=radio]:checked+span,ul.list-of-option li label input[type=radio]:hover+span{background:#dcdcdc}ul.list-of-option li label span.value{color:#747576;font-size:14px;line-height:21px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;padding:5px 15px;width:100%;text-transform:none;cursor:pointer;text-align:left}ul.list-of-option li label.multiselect{padding:0 15px}ul.list-of-option li label.multiselect span.checkbox{display:inline-block;border:1px solid #dbdbdb;border-radius:2px;height:16px;width:16px;position:relative;padding:2px}ul.list-of-option li label input[type=checkbox]{position:absolute;margin:0;height:100%;width:100%;opacity:0;cursor:pointer}ul.list-of-option li label input[type=checkbox]:checked+span{background:#dcdcdc}ul.list-of-option li label input[type=checkbox]:checked+span.checkbox{border-color:#34aa44;background:#34aa44}ul.list-of-option li label input[type=checkbox]:checked+span.checkbox:after{width:8px;height:3px;border-bottom:2px solid #ffffff;border-left:2px solid #ffffff;transform:rotate(-45deg);content:\"\";position:absolute;top:3px;left:2px}ul.list-of-option li label.colors{padding:3px 5px}ul.list-of-option li label.colors span.value{padding:3px 6px;line-height:16px;font-size:11px;font-weight:600}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { kind: "pipe", type: PascalPipe, name: "pascal" }] }); }
2848
2887
  }
2849
2888
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsSelectComponent, decorators: [{
2850
2889
  type: Component,
2851
- args: [{ selector: 'app-cs-select', template: "<div class=\"input-group\" (clickOutside)=\"dropdownOption = false\">\r\n <label *ngIf=\"dropdownLabel != undefined\">\r\n {{ dropdownLabel }} <span class=\"sub-label\">{{ dropdownSubLabel }}</span>\r\n <span class=\"required\" *ngIf=\"isRequired\">*</span></label\r\n >\r\n <div class=\"custom-select-box\" [class.disabled]=\"disabled\">\r\n <input\r\n type=\"text\"\r\n [class.line]=\"stylex\"\r\n [placeholder]=\"placeholder\"\r\n [value]=\"selectedValue | pascal\"\r\n readonly\r\n (click)=\"openDropdown($event)\"\r\n (keyup.enter)=\"openDropdown($event)\"\r\n (keyup.arrowup)=\"openDropdown($event)\"\r\n (keyup.arrowdown)=\"openDropdown($event)\"\r\n *ngIf=\"!colorProperty\"\r\n />\r\n <span\r\n class=\"show-label\"\r\n *ngIf=\"colorProperty\"\r\n (click)=\"openDropdown($event)\"\r\n >\r\n <span\r\n class=\"label\"\r\n [innerHTML]=\"selectedValue\"\r\n [style.backgroundColor]=\"colorSelected + '1A'\"\r\n [style.color]=\"colorSelected\"\r\n ></span>\r\n </span>\r\n <!-- <span class=\"arrow\" [class.line]=\"stylex\">\r\n <i class=\"icons\">&#xe919;</i>\r\n </span> -->\r\n <div\r\n class=\"overlay active\"\r\n *ngIf=\"dropdownOption === true\"\r\n (click)=\"closeDropdown()\"\r\n ></div>\r\n <ul\r\n class=\"list-of-option\"\r\n *ngIf=\"dropdownOption === true && !colorProperty\"\r\n #optionList\r\n (keyup.Escape)=\"closeDropdown()\"\r\n [style.top.px]=\"getTop\"\r\n [style.left.px]=\"getLeft\"\r\n [style.min-width.px]=\"getWidth\"\r\n [style.max-width.px]=\"maxWidth\"\r\n [class.active]=\"activeDoropdown\"\r\n >\r\n <li *ngFor=\"let data of dataList\">\r\n <label>\r\n <input\r\n type=\"radio\"\r\n [value]=\"data[valueKey]\"\r\n name=\"sliceLabel\"\r\n (change)=\"selectOption(data)\"\r\n #option\r\n (keyup.enter)=\"closeDropdown()\"\r\n class=\"pointer-none\"\r\n />\r\n <span\r\n (click)=\"closeDropdown(); selectOption(data)\"\r\n *ngIf=\"displayProperty && displayProperty !== ''\"\r\n class=\"value\"\r\n [arTooltip]=\"data[displayProperty]\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n >{{ data[displayProperty] }}</span\r\n >\r\n <span\r\n (click)=\"closeDropdown(); selectOption(data)\"\r\n *ngIf=\"!displayProperty || displayProperty === ''\"\r\n class=\"value\"\r\n [arTooltip]=\"data\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n >{{ data }}</span\r\n >\r\n </label>\r\n </li>\r\n </ul>\r\n <ul\r\n class=\"list-of-option\"\r\n *ngIf=\"dropdownOption === true && colorProperty\"\r\n #optionList\r\n (keyup.Escape)=\"closeDropdown()\"\r\n [style.top.px]=\"getTop\"\r\n [style.left.px]=\"getLeft\"\r\n [style.min-width.px]=\"getWidth\"\r\n [style.max-width.px]=\"maxWidth\"\r\n [class.active]=\"activeDoropdown\"\r\n >\r\n <li *ngFor=\"let data of dataList\">\r\n <label class=\"colors\">\r\n <input\r\n type=\"radio\"\r\n [value]=\"data[valueKey]\"\r\n name=\"sliceLabel\"\r\n (click)=\"selectOption(data)\"\r\n #option\r\n (keyup.enter)=\"closeDropdown()\"\r\n class=\"pointer-none\"\r\n />\r\n <span\r\n (click)=\"selectOption(data)\"\r\n *ngIf=\"displayProperty && displayProperty !== ''\"\r\n class=\"value\"\r\n [arTooltip]=\"data[displayProperty]\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n [ngStyle]=\"{ color: data.segment_color }\"\r\n [style.backgroundColor]=\"data.segment_color + '1A'\"\r\n >{{ data[displayProperty] }}</span\r\n >\r\n <span\r\n (click)=\"selectOption(data)\"\r\n *ngIf=\"!displayProperty || displayProperty === ''\"\r\n class=\"value\"\r\n [arTooltip]=\"data\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"true\"\r\n [ngStyle]=\"{ color: data.segment_color }\"\r\n [style.backgroundColor]=\"data.segment_color + '1A'\"\r\n >{{ data }}</span\r\n >\r\n </label>\r\n </li>\r\n </ul>\r\n </div>\r\n</div>\r\n", styles: [".input-group{position:relative;margin-bottom:0}.input-group label{font-size:11px;color:#161b2f;font-weight:500;line-height:16px;margin-bottom:5px;text-transform:uppercase;display:block}.input-group label span.required{color:#eb2424;font-size:14px}.input-group label span.sub-label{color:#747576;font-size:11px;font-weight:400;margin-left:3px}.input-group input[type=text],.input-group .show-label{height:36px;line-height:16px;font-size:13px;color:#747576;font-weight:400;background:#fff;border:1px solid #dbdbdb;border-radius:4px;width:100%;padding:10px 13px;display:block;outline:none;overflow:hidden;text-overflow:ellipsis}.input-group input[type=text].line,.input-group .show-label.line{border:none;border-bottom:1px solid #dbdbdb;border-radius:0;padding-left:0}.input-group .show-label{display:flex;padding:6px;padding-right:25px!important;cursor:pointer}.input-group .show-label .label{white-space:nowrap;padding:2px 5px;height:100%;overflow:hidden;text-overflow:ellipsis;display:block;width:100%;text-transform:uppercase;font-size:11px;font-weight:600;line-height:15px;pointer-events:none}.input-group:focus-within input[type=text]{border-color:#1e5dd3;box-shadow:0 3px 6px #1e5dd333}.input-group:focus-within input[type=text].line{box-shadow:none}.input-group .custom-select-box{background:#fff;position:relative}.input-group .custom-select-box:after{border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px;border-color:#707070;content:\"\";display:inline-block;right:15px;position:absolute;top:calc(50% - 4px);width:5px;height:5px;transform:rotate(45deg)}.input-group .custom-select-box input[type=text],.input-group .custom-select-box .input{cursor:pointer;padding-right:30px;background:transparent}.input-group .custom-select-box input[type=text].line,.input-group .custom-select-box .input.line{padding-right:20px}.input-group .custom-select-box.disabled{filter:grayscale(1);pointer-events:none}.input-group .arrow{position:absolute;right:17px;color:#747576;bottom:8px;font-size:10px;pointer-events:none}.input-group .arrow.line{right:5px}ul.list-of-option{position:fixed;overflow:auto;max-height:200px;padding:0;margin:0;display:block;border:1px solid #dbdbdb;box-shadow:0 3px 6px #1e5dd333;z-index:2147483002;background:#fff;border-radius:2px;opacity:0}ul.list-of-option.reset{top:inherit;bottom:100%;box-shadow:0 -3px 6px #1e5dd333}ul.list-of-option.active{opacity:1}ul.list-of-option li{width:100%;display:block;margin-bottom:0;padding:0;height:auto}ul.list-of-option li label{line-height:23px;font-size:13px;font-weight:400;border-radius:4px;display:flex;position:relative;margin:0;align-items:center}ul.list-of-option li label input[type=radio]{position:absolute;margin:0;height:100%;width:100%;opacity:0;left:0;cursor:pointer}ul.list-of-option li label input[type=radio]:checked+span,ul.list-of-option li label input[type=radio]:hover+span{background:#dcdcdc}ul.list-of-option li label span.value{color:#747576;font-size:14px;line-height:21px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;padding:5px 15px;width:100%;text-transform:none;cursor:pointer;text-align:left}ul.list-of-option li label.multiselect{padding:0 15px}ul.list-of-option li label.multiselect span.checkbox{display:inline-block;border:1px solid #dbdbdb;border-radius:2px;height:16px;width:16px;position:relative;padding:2px}ul.list-of-option li label input[type=checkbox]{position:absolute;margin:0;height:100%;width:100%;opacity:0;cursor:pointer}ul.list-of-option li label input[type=checkbox]:checked+span{background:#dcdcdc}ul.list-of-option li label input[type=checkbox]:checked+span.checkbox{border-color:#34aa44;background:#34aa44}ul.list-of-option li label input[type=checkbox]:checked+span.checkbox:after{width:8px;height:3px;border-bottom:2px solid #ffffff;border-left:2px solid #ffffff;transform:rotate(-45deg);content:\"\";position:absolute;top:3px;left:2px}ul.list-of-option li label.colors{padding:3px 5px}ul.list-of-option li label.colors span.value{padding:3px 6px;line-height:16px;font-size:11px;font-weight:600}\n"] }]
2890
+ args: [{ selector: 'app-cs-select', template: "<div class=\"input-group\" (clickOutside)=\"dropdownOption = false\">\n <label *ngIf=\"dropdownLabel != undefined\">\n {{ dropdownLabel }} <span class=\"sub-label\">{{ dropdownSubLabel }}</span>\n <span class=\"required\" *ngIf=\"isRequired\">*</span></label\n >\n <div class=\"custom-select-box\" [class.disabled]=\"disabled\">\n <input\n type=\"text\"\n [class.line]=\"stylex\"\n [placeholder]=\"placeholder\"\n [value]=\"selectedValue | pascal\"\n readonly\n (click)=\"openDropdown($event)\"\n (keyup.enter)=\"openDropdown($event)\"\n (keyup.arrowup)=\"openDropdown($event)\"\n (keyup.arrowdown)=\"openDropdown($event)\"\n *ngIf=\"!colorProperty\"\n />\n <span\n class=\"show-label\"\n *ngIf=\"colorProperty\"\n (click)=\"openDropdown($event)\"\n >\n <span\n class=\"label\"\n [innerHTML]=\"selectedValue\"\n [style.backgroundColor]=\"colorSelected + '1A'\"\n [style.color]=\"colorSelected\"\n ></span>\n </span>\n <!-- <span class=\"arrow\" [class.line]=\"stylex\">\n <i class=\"icons\">&#xe919;</i>\n </span> -->\n <div\n class=\"overlay active\"\n *ngIf=\"dropdownOption === true\"\n (click)=\"closeDropdown()\"\n ></div>\n <ul\n class=\"list-of-option\"\n *ngIf=\"dropdownOption === true && !colorProperty\"\n #optionList\n (keyup.Escape)=\"closeDropdown()\"\n [style.top.px]=\"getTop\"\n [style.left.px]=\"getLeft\"\n [style.min-width.px]=\"getWidth\"\n [style.max-width.px]=\"maxWidth\"\n [class.active]=\"activeDoropdown\"\n >\n <li *ngFor=\"let data of dataList\">\n <label>\n <input\n type=\"radio\"\n [value]=\"data[valueKey]\"\n name=\"sliceLabel\"\n (change)=\"selectOption(data)\"\n #option\n (keyup.enter)=\"closeDropdown()\"\n class=\"pointer-none\"\n />\n <span\n (click)=\"closeDropdown(); selectOption(data)\"\n *ngIf=\"displayProperty && displayProperty !== ''\"\n class=\"value\"\n [arTooltip]=\"data[displayProperty]\"\n placement=\"bottom-left\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n >{{ data[displayProperty] }}</span\n >\n <span\n (click)=\"closeDropdown(); selectOption(data)\"\n *ngIf=\"!displayProperty || displayProperty === ''\"\n class=\"value\"\n [arTooltip]=\"data\"\n placement=\"bottom-left\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n >{{ data }}</span\n >\n </label>\n </li>\n </ul>\n <ul\n class=\"list-of-option\"\n *ngIf=\"dropdownOption === true && colorProperty\"\n #optionList\n (keyup.Escape)=\"closeDropdown()\"\n [style.top.px]=\"getTop\"\n [style.left.px]=\"getLeft\"\n [style.min-width.px]=\"getWidth\"\n [style.max-width.px]=\"maxWidth\"\n [class.active]=\"activeDoropdown\"\n >\n <li *ngFor=\"let data of dataList\">\n <label class=\"colors\">\n <input\n type=\"radio\"\n [value]=\"data[valueKey]\"\n name=\"sliceLabel\"\n (click)=\"selectOption(data)\"\n #option\n (keyup.enter)=\"closeDropdown()\"\n class=\"pointer-none\"\n />\n <span\n (click)=\"selectOption(data)\"\n *ngIf=\"displayProperty && displayProperty !== ''\"\n class=\"value\"\n [arTooltip]=\"data[displayProperty]\"\n placement=\"bottom-left\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n [ngStyle]=\"{ color: data.segment_color }\"\n [style.backgroundColor]=\"data.segment_color + '1A'\"\n >{{ data[displayProperty] }}</span\n >\n <span\n (click)=\"selectOption(data)\"\n *ngIf=\"!displayProperty || displayProperty === ''\"\n class=\"value\"\n [arTooltip]=\"data\"\n placement=\"bottom-left\"\n delay=\"0\"\n type=\"black\"\n [tooltipMandatory]=\"true\"\n [ngStyle]=\"{ color: data.segment_color }\"\n [style.backgroundColor]=\"data.segment_color + '1A'\"\n >{{ data }}</span\n >\n </label>\n </li>\n </ul>\n </div>\n</div>\n", styles: [".input-group{position:relative;margin-bottom:0}.input-group label{font-size:11px;color:#161b2f;font-weight:500;line-height:16px;margin-bottom:5px;text-transform:uppercase;display:block}.input-group label span.required{color:#eb2424;font-size:14px}.input-group label span.sub-label{color:#747576;font-size:11px;font-weight:400;margin-left:3px}.input-group input[type=text],.input-group .show-label{height:36px;line-height:16px;font-size:13px;color:#747576;font-weight:400;background:#fff;border:1px solid #dbdbdb;border-radius:4px;width:100%;padding:10px 13px;display:block;outline:none;overflow:hidden;text-overflow:ellipsis}.input-group input[type=text].line,.input-group .show-label.line{border:none;border-bottom:1px solid #dbdbdb;border-radius:0;padding-left:0}.input-group .show-label{display:flex;padding:6px;padding-right:25px!important;cursor:pointer}.input-group .show-label .label{white-space:nowrap;padding:2px 5px;height:100%;overflow:hidden;text-overflow:ellipsis;display:block;width:100%;text-transform:uppercase;font-size:11px;font-weight:600;line-height:15px;pointer-events:none}.input-group:focus-within input[type=text]{border-color:#1e5dd3;box-shadow:0 3px 6px #1e5dd333}.input-group:focus-within input[type=text].line{box-shadow:none}.input-group .custom-select-box{background:#fff;position:relative}.input-group .custom-select-box:after{border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px;border-color:#707070;content:\"\";display:inline-block;right:15px;position:absolute;top:calc(50% - 4px);width:5px;height:5px;transform:rotate(45deg)}.input-group .custom-select-box input[type=text],.input-group .custom-select-box .input{cursor:pointer;padding-right:30px;background:transparent}.input-group .custom-select-box input[type=text].line,.input-group .custom-select-box .input.line{padding-right:20px}.input-group .custom-select-box.disabled{filter:grayscale(1);pointer-events:none}.input-group .arrow{position:absolute;right:17px;color:#747576;bottom:8px;font-size:10px;pointer-events:none}.input-group .arrow.line{right:5px}ul.list-of-option{position:fixed;overflow:auto;max-height:200px;padding:0;margin:0;display:block;border:1px solid #dbdbdb;box-shadow:0 3px 6px #1e5dd333;z-index:2147483002;background:#fff;border-radius:2px;opacity:0}ul.list-of-option.reset{top:inherit;bottom:100%;box-shadow:0 -3px 6px #1e5dd333}ul.list-of-option.active{opacity:1}ul.list-of-option li{width:100%;display:block;margin-bottom:0;padding:0;height:auto}ul.list-of-option li label{line-height:23px;font-size:13px;font-weight:400;border-radius:4px;display:flex;position:relative;margin:0;align-items:center}ul.list-of-option li label input[type=radio]{position:absolute;margin:0;height:100%;width:100%;opacity:0;left:0;cursor:pointer}ul.list-of-option li label input[type=radio]:checked+span,ul.list-of-option li label input[type=radio]:hover+span{background:#dcdcdc}ul.list-of-option li label span.value{color:#747576;font-size:14px;line-height:21px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;padding:5px 15px;width:100%;text-transform:none;cursor:pointer;text-align:left}ul.list-of-option li label.multiselect{padding:0 15px}ul.list-of-option li label.multiselect span.checkbox{display:inline-block;border:1px solid #dbdbdb;border-radius:2px;height:16px;width:16px;position:relative;padding:2px}ul.list-of-option li label input[type=checkbox]{position:absolute;margin:0;height:100%;width:100%;opacity:0;cursor:pointer}ul.list-of-option li label input[type=checkbox]:checked+span{background:#dcdcdc}ul.list-of-option li label input[type=checkbox]:checked+span.checkbox{border-color:#34aa44;background:#34aa44}ul.list-of-option li label input[type=checkbox]:checked+span.checkbox:after{width:8px;height:3px;border-bottom:2px solid #ffffff;border-left:2px solid #ffffff;transform:rotate(-45deg);content:\"\";position:absolute;top:3px;left:2px}ul.list-of-option li label.colors{padding:3px 5px}ul.list-of-option li label.colors span.value{padding:3px 6px;line-height:16px;font-size:11px;font-weight:600}\n"] }]
2852
2891
  }], propDecorators: { dataList: [{
2853
2892
  type: Input
2854
2893
  }], dropdownLabel: [{
@@ -2923,11 +2962,11 @@ class CsCheckboxIndeterminateComponent {
2923
2962
  this.ngValueChange.emit(emitValue);
2924
2963
  }
2925
2964
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsCheckboxIndeterminateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2926
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsCheckboxIndeterminateComponent, selector: "app-cs-checkbox-indeterminate", inputs: { disabled: "disabled", ngValue: "ngValue", value: "value" }, outputs: { ngValueChange: "ngValueChange" }, ngImport: i0, template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\r\n <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\r\n <span class=\"checkbox\">\r\n <span class=\"inner\"></span>\r\n </span>\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\r\n </svg>\r\n <span class=\"value\"><ng-content></ng-content></span>\r\n </label>\r\n ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;max-width:100%;position:relative;padding:0 0 0 28px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;left:0;top:0;padding:2px;margin-top:0}label.checkbox-item span.value{display:block;color:#747576;font-size:14px;line-height:16px;font-weight:400;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"], dependencies: [{ kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
2965
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsCheckboxIndeterminateComponent, selector: "app-cs-checkbox-indeterminate", inputs: { disabled: "disabled", ngValue: "ngValue", value: "value" }, outputs: { ngValueChange: "ngValueChange" }, ngImport: i0, template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\n <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\n <span class=\"checkbox\">\n <span class=\"inner\"></span>\n </span>\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\n </svg>\n <span class=\"value\"><ng-content></ng-content></span>\n </label>\n ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;max-width:100%;position:relative;padding:0 0 0 28px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;left:0;top:0;padding:2px;margin-top:0}label.checkbox-item span.value{display:block;color:#747576;font-size:14px;line-height:16px;font-weight:400;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"], dependencies: [{ kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
2927
2966
  }
2928
2967
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsCheckboxIndeterminateComponent, decorators: [{
2929
2968
  type: Component,
2930
- args: [{ selector: 'app-cs-checkbox-indeterminate', template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\r\n <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\r\n <span class=\"checkbox\">\r\n <span class=\"inner\"></span>\r\n </span>\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\r\n </svg>\r\n <span class=\"value\"><ng-content></ng-content></span>\r\n </label>\r\n ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;max-width:100%;position:relative;padding:0 0 0 28px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;left:0;top:0;padding:2px;margin-top:0}label.checkbox-item span.value{display:block;color:#747576;font-size:14px;line-height:16px;font-weight:400;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
2969
+ args: [{ selector: 'app-cs-checkbox-indeterminate', template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\n <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\n <span class=\"checkbox\">\n <span class=\"inner\"></span>\n </span>\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\n </svg>\n <span class=\"value\"><ng-content></ng-content></span>\n </label>\n ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;max-width:100%;position:relative;padding:0 0 0 28px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;left:0;top:0;padding:2px;margin-top:0}label.checkbox-item span.value{display:block;color:#747576;font-size:14px;line-height:16px;font-weight:400;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
2931
2970
  }], ctorParameters: function () { return []; }, propDecorators: { disabled: [{
2932
2971
  type: Input
2933
2972
  }], ngValue: [{
@@ -2966,11 +3005,11 @@ class CheckboxComponent {
2966
3005
  this.onTouched();
2967
3006
  }
2968
3007
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2969
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CheckboxComponent, selector: "vui-checkbox", inputs: { disabled: "disabled", checked: "checked", indeterminateEnabled: "indeterminateEnabled" }, providers: [CHECKBOX_VALUE_ACCESSOR], ngImport: i0, template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\r\n <input type=\"checkbox\" [checked]=\"checked\" [disabled]=\"disabled\" (change)=\"valueChanged()\"/>\r\n <span class=\"checkbox\">\r\n <span class=\"inner\"></span>\r\n </span>\r\n <!-- svg for checkmark -->\r\n <ng-container *ngIf=\"!indeterminateEnabled\">\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"indeterminateEnabled\">\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\r\n </svg>\r\n </ng-container>\r\n \r\n <span class=\"value\"><ng-content></ng-content></span>\r\n </label>\r\n ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;width:100%;position:relative;padding:0 0 0 16px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;top:0;left:0;padding:2px;margin-top:0}label.checkbox-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px);-webkit-user-select:none;user-select:none}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7;pointer-events:none}.disabled{opacity:.4!important;pointer-events:none}.checkmark{width:16px;height:16px;border-radius:2px;position:absolute;top:0;left:0;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
3008
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CheckboxComponent, selector: "vui-checkbox", inputs: { disabled: "disabled", checked: "checked", indeterminateEnabled: "indeterminateEnabled" }, providers: [CHECKBOX_VALUE_ACCESSOR], ngImport: i0, template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\n <input type=\"checkbox\" [checked]=\"checked\" [disabled]=\"disabled\" (change)=\"valueChanged()\"/>\n <span class=\"checkbox\">\n <span class=\"inner\"></span>\n </span>\n <!-- svg for checkmark -->\n <ng-container *ngIf=\"!indeterminateEnabled\">\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\n </svg>\n </ng-container>\n \n <ng-container *ngIf=\"indeterminateEnabled\">\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\n </svg>\n </ng-container>\n \n <span class=\"value\"><ng-content></ng-content></span>\n </label>\n ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;width:100%;position:relative;padding:0 0 0 16px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;top:0;left:0;padding:2px;margin-top:0}label.checkbox-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px);-webkit-user-select:none;user-select:none}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7;pointer-events:none}.disabled{opacity:.4!important;pointer-events:none}.checkmark{width:16px;height:16px;border-radius:2px;position:absolute;top:0;left:0;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
2970
3009
  }
2971
3010
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxComponent, decorators: [{
2972
3011
  type: Component,
2973
- args: [{ selector: 'vui-checkbox', providers: [CHECKBOX_VALUE_ACCESSOR], inputs: ['disabled', 'checked', 'indeterminateEnabled'], template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\r\n <input type=\"checkbox\" [checked]=\"checked\" [disabled]=\"disabled\" (change)=\"valueChanged()\"/>\r\n <span class=\"checkbox\">\r\n <span class=\"inner\"></span>\r\n </span>\r\n <!-- svg for checkmark -->\r\n <ng-container *ngIf=\"!indeterminateEnabled\">\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"indeterminateEnabled\">\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\r\n </svg>\r\n </ng-container>\r\n \r\n <span class=\"value\"><ng-content></ng-content></span>\r\n </label>\r\n ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;width:100%;position:relative;padding:0 0 0 16px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;top:0;left:0;padding:2px;margin-top:0}label.checkbox-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px);-webkit-user-select:none;user-select:none}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7;pointer-events:none}.disabled{opacity:.4!important;pointer-events:none}.checkmark{width:16px;height:16px;border-radius:2px;position:absolute;top:0;left:0;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
3012
+ args: [{ selector: 'vui-checkbox', providers: [CHECKBOX_VALUE_ACCESSOR], inputs: ['disabled', 'checked', 'indeterminateEnabled'], template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\">\n <input type=\"checkbox\" [checked]=\"checked\" [disabled]=\"disabled\" (change)=\"valueChanged()\"/>\n <span class=\"checkbox\">\n <span class=\"inner\"></span>\n </span>\n <!-- svg for checkmark -->\n <ng-container *ngIf=\"!indeterminateEnabled\">\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\n </svg>\n </ng-container>\n \n <ng-container *ngIf=\"indeterminateEnabled\">\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\n </svg>\n </ng-container>\n \n <span class=\"value\"><ng-content></ng-content></span>\n </label>\n ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;width:100%;position:relative;padding:0 0 0 16px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;top:0;left:0;padding:2px;margin-top:0}label.checkbox-item span.value{color:#4e4e4e;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px);-webkit-user-select:none;user-select:none}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7;pointer-events:none}.disabled{opacity:.4!important;pointer-events:none}.checkmark{width:16px;height:16px;border-radius:2px;position:absolute;top:0;left:0;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
2974
3013
  }] });
2975
3014
 
2976
3015
  class FormgroupModule {