@posiwise/resource-contact-us 0.0.10 → 0.0.11

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 (10) hide show
  1. package/fesm2022/posiwise-resource-contact-us.mjs +17 -17
  2. package/fesm2022/posiwise-resource-contact-us.mjs.map +1 -1
  3. package/package.json +3 -5
  4. package/esm2022/index.mjs +0 -6
  5. package/esm2022/lib/demo-cards/demo-cards.component.mjs +0 -101
  6. package/esm2022/lib/demo-cards/demo-cards.module.mjs +0 -44
  7. package/esm2022/lib/resource-contact-us/resource-contact-us.component.mjs +0 -562
  8. package/esm2022/lib/resource-contact-us/resource-contact-us.module.mjs +0 -94
  9. package/esm2022/lib/shared/resource-modal.interface.mjs +0 -2
  10. package/esm2022/posiwise-resource-contact-us.mjs +0 -5
package/fesm2022/posiwise-resource-contact-us.mjs CHANGED
@@ -3,7 +3,7 @@ import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
3
3
  import * as i7 from '@angular/common';
4
4
  import { DOCUMENT, CommonModule } from '@angular/common';
5
5
  import * as i0 from '@angular/core';
6
- import { Component, ChangeDetectionStrategy, Inject, ViewChild, Input, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
6
+ import { Input, ViewChild, Inject, ChangeDetectionStrategy, Component, CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
7
7
  import * as i1 from '@angular/forms';
8
8
  import { Validators, ReactiveFormsModule, FormsModule } from '@angular/forms';
9
9
  import * as i4 from '@angular/platform-browser';
@@ -515,12 +515,12 @@ class Trial4ContactUsComponent extends AppBaseComponent {
515
515
  canEditResources() {
516
516
  return this.canEditResourcesValue;
517
517
  }
518
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: Trial4ContactUsComponent, deps: [{ token: i1.UntypedFormBuilder }, { token: i2.AuthService }, { token: i3.CrmService }, { token: i4.DomSanitizer }, { token: i5.AdminService }, { token: i0.Injector }, { token: i2.AbTestService }, { token: i6.NgbModal }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
519
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: Trial4ContactUsComponent, selector: "pw-trial-4-contact-us", inputs: { subscriptionId: "subscriptionId", sourceId: "sourceId", masterSubscriptionId: "masterSubscriptionId", experimentName: "experimentName", microserviceName: "microserviceName", shardName: "shardName", user: "user", userLoggedIn: "userLoggedIn" }, viewQueries: [{ propertyName: "footerSection", first: true, predicate: ["footerSection"], descendants: true, static: true }, { propertyName: "content", first: true, predicate: ["bookMeeting"], descendants: true, static: true }, { propertyName: "editFooterLinksModal", first: true, predicate: ["editFooterLinksModal"], descendants: true }, { propertyName: "logoModal", first: true, predicate: ["logoModal"], descendants: true }, { propertyName: "logoUploader", first: true, predicate: ["logoUploader"], descendants: true }, { propertyName: "hubspotEditModal", first: true, predicate: ["hubspotEditModal"], descendants: true }, { propertyName: "socialEditModal", first: true, predicate: ["socialEditModal"], descendants: true }, { propertyName: "questionsEditModal", first: true, predicate: ["questionsEditModal"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<section #footerSection class=\"bg-black text-white py-5 footer-section\">\n <div class=\"container\">\n <div class=\"row\">\n\n <!-- LEFT COLUMN -->\n <div class=\"col-md-6 mb-4 d-flex flex-column justify-content-between\" [ngClass]=\"{ 'site-column': getFooterHubspotForm() }\">\n <div>\n <h3 class=\"mb-4 d-flex align-items-center\">\n <span class=\"me-2 text-white\">Site Map:</span>\n <i *ngIf=\"canEditResourcesValue\" class=\"fa fa-edit in-page-edit-icon cursor-pointer text-white ms-3\" (click)=\"openEditFooterLinksModal(editFooterLinksModal)\" (keydown.enter)=\"openEditFooterLinksModal(editFooterLinksModal)\" (keydown.space)=\"openEditFooterLinksModal(editFooterLinksModal)\" ngbTooltip=\"Edit Footer Links\"></i>\n </h3>\n <ul class=\"mt-4\">\n <li routerLink=\"/\"\n class=\"cursor-pointer user-info-label link-label\"> Home </li>\n <li *ngFor=\"let link of footerLinks\" [routerLink]=\"link?.path\"\n class=\"cursor-pointer user-info-label link-label mt-4\"><span *ngIf=\"link?.title\">{{link?.title}}</span> </li>\n <li routerLink=\"/login\"\n class=\"cursor-pointer user-info-label mt-4 link-label\"> Log in </li>\n <li [routerLink]=\"'/privacy-and-tos/' + tosId\"\n class=\"cursor-pointer user-info-label mt-4 link-label\"> Privacy statement </li>\n </ul>\n <p class=\"address-section email-section mb-4\">\n <span class=\"user-info-label\">Email: </span>\n <ng-container *ngIf=\"!isEditingEmail; else editEmail\">\n <span class=\"user-info\">{{ email }}</span>\n <i *ngIf=\"canEditResourcesValue\" class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3\" (click)=\"isEditingEmail = true\" (keydown.enter)=\"isEditingEmail = true\" (keydown.space)=\"isEditingEmail = true\"></i>\n </ng-container>\n\n <ng-template #editEmail>\n <input\n class=\"form-control d-inline w-auto\"\n [(ngModel)]=\"editingEmail\"\n />\n <button class=\"btn btn-sm btn-primary ms-2\" (click)=\"saveEmail()\">Save</button>\n <button class=\"btn btn-sm btn-secondary ms-2\" (click)=\"isEditingEmail = false\">Cancel</button>\n </ng-template>\n </p>\n <span class=\"email-section mt-3 address-text\">\n <span class=\"user-info-label\">\n Address:\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon cursor-pointer ms-2 text-white\"\n title=\"Edit Address\"\n (click)=\"isEditingStreet = true\"\n (keydown.enter)=\"isEditingStreet = true\"\n (keydown.space)=\"isEditingStreet = true\"></i>\n </span><br/>\n\n <ng-container *ngIf=\"!isEditingStreet; else editStreetBlock\">\n <span class=\"address-text user-info\">{{ street }}</span>\n </ng-container>\n\n <ng-template #editStreetBlock>\n <div class=\"d-flex align-items-center mt-3\">\n <input class=\"form-control form-control-sm\" [(ngModel)]=\"editingStreet\" />\n <button class=\"btn btn-sm btn-primary ms-2\" (click)=\"saveStreet()\">Save</button>\n <button class=\"btn btn-sm btn-secondary ms-2\" (click)=\"cancelStreet()\">Cancel</button>\n </div>\n </ng-template>\n\n </span>\n\n </div>\n <div class=\"d-flex\">\n <img [src]=\"logo\"\n alt=\"Company logo\"\n class=\"img-fluid mt-4 logo-image cursor-pointer\"\n width=\"160\"\n height=\"35\"\n (click)=\"scrollToTop()\"\n (keydown.enter)=\"scrollToTop()\"\n (keydown.space)=\"scrollToTop()\"\n title=\"Click to go to top of page\" />\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon fa-sm ms-3 cursor-pointer text-white align-self-center mt-3\"\n (click)=\"openLogoEditModal()\"\n (keydown.enter)=\"openLogoEditModal()\"\n (keydown.space)=\"openLogoEditModal()\"\n title=\"Edit Logo\"></i>\n </div>\n </div>\n\n <!-- RIGHT COLUMN -->\n <div class=\"col-md-6\">\n <ng-container *ngIf=\"getFooterHubspotForm() as footerItem; else defaultForm\">\n <div class=\"d-flex\">\n <div\n class=\"hubspot-container w-100 content-loaded\"\n [innerHTML]=\"hubspotHtml\"\n (load)=\"onHubspotLoad($event)\">\n </div>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer\"\n (click)=\"openHubspotEditModal(footerItem)\"\n (keydown.enter)=\"openHubspotEditModal(footerItem)\"\n (keydown.space)=\"openHubspotEditModal(footerItem)\"\n title=\"Edit Hubspot Embed\"></i>\n </div>\n </ng-container>\n\n <ng-template #defaultForm>\n <div class=\"d-flex\">\n <h3 class=\"text-white mb-4\"> <span class=\"text-white\">Get in touch:</span></h3>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3 mt-2\"\n (click)=\"openQuestionsEditModal()\"\n (keydown.enter)=\"openQuestionsEditModal()\"\n (keydown.space)=\"openQuestionsEditModal()\"\n title=\"Edit Questions\"></i>\n </div>\n <div class=\"contact-form\">\n <form [formGroup]=\"form\">\n <div class=\"mb-3\">\n <div class=\"email\">\n <div class=\"form-field\">\n <label for=\"email\">Email:</label>\n <div class=\"w-100\">\n <input type=\"text\"\n class=\"mb-1\"\n id=\"email\"\n formControlName=\"email\" />\n <pw-field-error-display [displayError]=\"\n !form.get('email').valid && (form.get('email').touched || submitted)\n \"\n errorMsg=\"Email is required\">\n </pw-field-error-display>\n </div>\n </div>\n <div class=\"form-field\">\n <label for=\"first_name\">First name:</label>\n <div class=\"w-100\">\n <input input type=\"text\"\n id=\"first_name\"\n formControlName=\"first_name\" />\n <pw-field-error-display [displayError]=\"\n !form.get('first_name').valid && (form.get('first_name').touched || submitted)\n \"\n errorMsg=\"First name is required\">\n </pw-field-error-display>\n </div>\n </div>\n <div class=\"form-field\">\n <label for=\"last_name\">Last name:</label>\n <input type=\"text\"\n id=\"last_name\"\n formControlName=\"last_name\" />\n </div>\n <div class=\"form-field\">\n <label for=\"company\">Company:</label>\n <input type=\"text\"\n id=\"company\"\n formControlName=\"company\" />\n </div>\n <div class=\"form-field\" *ngIf=\"hasValidOptions()\">\n <label for=\"psa\" class=\"select-label\">{{question}}</label>\n <p-dropdown\n formControlName=\"psa\"\n [options]=\"psaOptions\"\n [placeholder]=\"'Select PSA'\"\n styleClass=\"input-select\">\n </p-dropdown>\n </div>\n <div class=\"form-field\">\n <label for=\"enquiry\" class=\"select-label\">How can we help you?</label>\n <div class=\"enquiry-field\">\n <textarea id=\"enquiry\" formControlName=\"enquiry\" class=\"\">\n </textarea>\n <pw-field-error-display [displayError]=\"\n !form.get('enquiry').valid && (form.get('enquiry').touched || submitted)\n \"\n errorMsg=\"Enquiry is required\">\n </pw-field-error-display>\n </div>\n </div>\n </div>\n </div>\n <div class=\"text-end\">\n <div class=\"captcha-wrapper-container\"\n *ngIf=\"isCaptchaVerified\">\n <ngx-recaptcha2 [ngModelOptions]=\"{ standalone: true }\"\n [siteKey]=\"captchaKeyV2\"\n size=\"normal\"\n [(ngModel)]=\"recaptcha\"\n (success)=\"handleSuccess($event)\">\n </ngx-recaptcha2>\n </div>\n <button type=\"submit\"\n (click)=\"onSubmit()\"\n *ngIf=\"!isCaptchaVerified\"\n class=\"sign-btn sign-header-btn mt-3\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n\n <div class=\"d-flex align-items-center mt-4\">\n <div class=\"icons d-flex align-items-center\">\n <a [eventTracker]=\"{\n category: 'youtube',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n [href]=\"youtubeUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <img src=\"/assets/img/icons/youtube.png\"\n class=\"img-fluid youtube-icon\"\n width=\"54\"\n height=\"54\"\n alt=\"\" />\n </a>\n <a [eventTracker]=\"{\n category: 'linkedin',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n [href]=\"linkedInUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n class=\"ms-3\">\n <img src=\"/assets/img/icons/social/linkedin.svg\"\n class=\"img-fluid linkedin-icon\"\n width=\"48\"\n height=\"48\"\n alt=\"\" />\n </a>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3\"\n (click)=\"openSocialEditModal()\"\n (keydown.enter)=\"openSocialEditModal()\"\n (keydown.space)=\"openSocialEditModal()\"\n title=\"Edit Social Links & Company Name\"></i>\n </div>\n <div class=\"copyright text-white\">\n 2025 {{companyName}}.\n </div>\n </div>\n </form>\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n\n\n\n<ng-template #bookMeeting\n let-modal>\n <div class=\"modal-header\">\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <h3 class=\"text-center modal-basic-title\">\n Thanks for getting in touch! Our team will be in contact shortly, or we\n can compare calendars now &amp; schedule a time\n </h3>\n <button type=\"button\"\n [eventTracker]=\"{\n category: 'request-demo',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n (click)=\"navigateToBookMeeting()\"\n class=\"sign-btn sign-header-btn mx-auto d-block mb-3\">\n Let's do it\n </button>\n </div>\n</ng-template>\n\n\n<ng-template #editFooterLinksModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Footer Links</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Footer Links Section</h4>\n <div cdkDropList (cdkDropListDropped)=\"dropFooterLinks($event)\">\n <div *ngFor=\"let footer of editingFooterLinks.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-5 mb-2\">\n <label for=\"footerTitle{{i}}\" class=\"form-label\">Title</label>\n <input id=\"footerTitle{{i}}\" class=\"form-control\" [(ngModel)]=\"footer.title\" />\n </div>\n <div class=\"col-md-5 mb-2\">\n <label for=\"footerPath{{i}}\" class=\"form-label\">Path</label>\n <input id=\"footerPath{{i}}\" class=\"form-control\" [(ngModel)]=\"footer.path\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeFooterLink(i)\" (keydown.enter)=\"removeFooterLink(i)\" (keydown.space)=\"removeFooterLink(i)\"></i>\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n\n <!-- Subtitles -->\n <div cdkDropList (cdkDropListDropped)=\"dropSubtitles(i, $event)\">\n <div *ngFor=\"let sub of footer.subtitles; let j = index\" class=\"row border p-3 mb-2 align-items-center\" cdkDrag>\n <div class=\"col-md-5\">\n <label for=\"subtitleTitle{{i}}{{j}}\" class=\"form-label\">Subtitle Title</label>\n <input id=\"subtitleTitle{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"sub.title\" />\n </div>\n <div class=\"col-md-5\">\n <label for=\"subtitlePath{{i}}{{j}}\" class=\"form-label\">Subtitle Path</label>\n <input id=\"subtitlePath{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"sub.path\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeSubtitle(i, j)\" (keydown.enter)=\"removeSubtitle(i, j)\" (keydown.space)=\"removeSubtitle(i, j)\"></i>\n <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm mt-2\" (click)=\"addSubtitle(i)\">\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-3\" (click)=\"addFooterLink()\">\n + Add Footer Link\n </button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveFooterLinks(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n\n\n<ng-template #logoModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Logo</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <pw-custom-uploader\n [aspectRatio]=\"'fullLogo'\"\n [title]=\"'Main Contrast Logo'\"\n [controlName]=\"'logo_main_contrast'\"\n [previewData]=\"previewData\"\n (saveEvent)=\"onSaveFile($event)\">\n </pw-custom-uploader>\n </div>\n</ng-template>\n\n\n\n<ng-template #hubspotEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Hubspot Embed</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label for=\"hubspotId\" class=\"form-label\">Hubspot ID</label>\n <input id=\"hubspotId\" [(ngModel)]=\"editingHubspotId\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"hubspotEmbedDiv\" class=\"form-label\">Embed DIV</label>\n <textarea id=\"hubspotEmbedDiv\" [(ngModel)]=\"editingHubspotHtml\" rows=\"8\" class=\"form-control\"></textarea>\n </div>\n </div>\n <div class=\"modal-footer\">\n <button class=\"btn btn-primary\" (click)=\"saveHubspotHtml(modal)\">Save</button>\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n </div>\n</ng-template>\n\n\n<ng-template #socialEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Social Links & Company Name</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label for=\"youtubeUrl\" class=\"form-label\">YouTube URL</label>\n <input id=\"youtubeUrl\" [(ngModel)]=\"editingYoutubeUrl\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"linkedinUrl\" class=\"form-label\">LinkedIn URL</label>\n <input id=\"linkedinUrl\" [(ngModel)]=\"editingLinkedInUrl\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"companyName\" class=\"form-label\">Company Name</label>\n <input id=\"companyName\" [(ngModel)]=\"editingCompanyName\" class=\"form-control\" />\n </div>\n </div>\n <div class=\"modal-footer\">\n <button class=\"btn btn-primary\" (click)=\"saveSocialLinks(modal)\">Save</button>\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n </div>\n</ng-template>\n\n\n\n<ng-template #questionsEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Questions</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Questions Section</h4>\n <div cdkDropList (cdkDropListDropped)=\"dropQuestions($event)\">\n <div *ngFor=\"let q of editingQuestions; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-11 mb-2\">\n <label for=\"questionText{{i}}\" class=\"form-label\">Question</label>\n <input id=\"questionText{{i}}\" class=\"form-control\" [(ngModel)]=\"q.question\" placeholder=\"Enter question\" />\n </div>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-4\">\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n\n <!-- Options Section -->\n <div cdkDropList (cdkDropListDropped)=\"dropQuestionOptions(i, $event)\">\n <div *ngFor=\"let opt of q.options; let j = index\" class=\"row border p-3 mb-2 align-items-center\" cdkDrag>\n <div class=\"col-md-7 mb-2\">\n <label for=\"questionOption{{i}}{{j}}\" class=\"form-label\">Option</label>\n <input id=\"questionOption{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"opt.option\" placeholder=\"Enter option\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeQuestionOption(i, j)\" (keydown.enter)=\"removeQuestionOption(i, j)\" (keydown.enter)=\"removeQuestionOption(i, j)\"></i>\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm mt-2\" (click)=\"addQuestionOption(i)\">+ Add Option</button>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-3\" (click)=\"addNewQuestion()\">+ Add Question</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveQuestions(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n", styles: [".product-explainer-section{background-color:#000}.footer-section{min-height:500px}@media (min-width: 768px){.footer-section{min-height:600px}}.footer-section .container{transition:opacity .3s ease,visibility .3s ease}.footer-section input.form-control,.footer-section select.form-control,.footer-section textarea.form-control{background-color:#fff;border:none;color:#000;font-size:14px}.btn-primary{background-color:#007bff;border:none}.site-column{margin-top:2.9rem}.email-section{color:#fff;font-size:2rem}.address-section{margin-top:5rem}.address-text{line-height:2.2rem}.user-info{font-size:1.5rem}.user-info-label{font-size:1.7rem;font-weight:700}.contact-form form .form-field{display:flex;align-items:center;margin-bottom:1.2rem}.contact-form form .form-field label{width:130px;min-width:130px;margin:0;font-size:14px;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:1px}.contact-form form .form-field p-dropdown{width:100%}.contact-form form .form-field input,.contact-form form .form-field select,.contact-form form .form-field textarea,.contact-form form .form-field ::ng-deep p-dropdown .p-inputwrapper{flex:1;border:none;border-radius:30px;padding:12px 20px;font-size:14px;width:100%!important;max-width:100%;color:#000}.contact-form form .form-field textarea{resize:vertical}.contact-form form .submit-button{background-color:#3b82f6;border:none;border-radius:30px;font-size:16px;font-weight:500;padding:10px 24px;margin-top:1.2rem}.input-select{height:43px}.select-label{width:210px!important}.copyright{margin-top:2rem;margin-left:4rem;font-size:19px;font-weight:700}.d-flex img{margin-right:0!important}.youtube-icon{height:38px}.enquiry-field{margin-left:.5rem;width:63%}::ng-deep .text-danger{margin-top:.25rem!important;margin-left:.5rem!important}.hubspot-container{min-height:400px;transition:opacity .3s ease}.hubspot-container:not(.content-loaded){opacity:0;pointer-events:none}.hubspot-container.content-loaded{opacity:1}@media (min-width: 768px){.hubspot-container{margin-top:-3rem}}@media (min-width: 768px) and (max-width: 1200px){.container{padding:0rem 6rem!important}}.link-label{cursor:pointer;transition:color .3s}.link-label:hover{color:var(--first)}.icons img{transition:transform .3s ease,filter .3s ease;cursor:pointer}.icons img:hover{transform:scale(1.1);filter:brightness(1.2)}.logo-image{max-width:160px;width:160px;height:35px;object-fit:contain;aspect-ratio:160/35}\n"], dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i8.FieldErrorDisplayComponent, selector: "pw-field-error-display", inputs: ["errorMsg", "displayError"] }, { kind: "component", type: i9.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i10.ReCaptcha2Component, selector: "ngx-recaptcha2", inputs: ["theme", "size"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i12.EventTrackerDirective, selector: "[eventTracker]", inputs: ["eventTracker"] }, { kind: "directive", type: i12.LazyImgDirective, selector: "img" }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
518
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: Trial4ContactUsComponent, deps: [{ token: i1.UntypedFormBuilder }, { token: i2.AuthService }, { token: i3.CrmService }, { token: i4.DomSanitizer }, { token: i5.AdminService }, { token: i0.Injector }, { token: i2.AbTestService }, { token: i6.NgbModal }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
519
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: Trial4ContactUsComponent, isStandalone: false, selector: "pw-trial-4-contact-us", inputs: { subscriptionId: "subscriptionId", sourceId: "sourceId", masterSubscriptionId: "masterSubscriptionId", experimentName: "experimentName", microserviceName: "microserviceName", shardName: "shardName", user: "user", userLoggedIn: "userLoggedIn" }, viewQueries: [{ propertyName: "footerSection", first: true, predicate: ["footerSection"], descendants: true, static: true }, { propertyName: "content", first: true, predicate: ["bookMeeting"], descendants: true, static: true }, { propertyName: "editFooterLinksModal", first: true, predicate: ["editFooterLinksModal"], descendants: true }, { propertyName: "logoModal", first: true, predicate: ["logoModal"], descendants: true }, { propertyName: "logoUploader", first: true, predicate: ["logoUploader"], descendants: true }, { propertyName: "hubspotEditModal", first: true, predicate: ["hubspotEditModal"], descendants: true }, { propertyName: "socialEditModal", first: true, predicate: ["socialEditModal"], descendants: true }, { propertyName: "questionsEditModal", first: true, predicate: ["questionsEditModal"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<section #footerSection class=\"bg-black text-white py-5 footer-section\">\n <div class=\"container\">\n <div class=\"row\">\n\n <!-- LEFT COLUMN -->\n <div class=\"col-md-6 mb-4 d-flex flex-column justify-content-between\" [ngClass]=\"{ 'site-column': getFooterHubspotForm() }\">\n <div>\n <h3 class=\"mb-4 d-flex align-items-center\">\n <span class=\"me-2 text-white\">Site Map:</span>\n <i *ngIf=\"canEditResourcesValue\" class=\"fa fa-edit in-page-edit-icon cursor-pointer text-white ms-3\" (click)=\"openEditFooterLinksModal(editFooterLinksModal)\" (keydown.enter)=\"openEditFooterLinksModal(editFooterLinksModal)\" (keydown.space)=\"openEditFooterLinksModal(editFooterLinksModal)\" ngbTooltip=\"Edit Footer Links\"></i>\n </h3>\n <ul class=\"mt-4\">\n <li routerLink=\"/\"\n class=\"cursor-pointer user-info-label link-label\"> Home </li>\n <li *ngFor=\"let link of footerLinks\" [routerLink]=\"link?.path\"\n class=\"cursor-pointer user-info-label link-label mt-4\"><span *ngIf=\"link?.title\">{{link?.title}}</span> </li>\n <li routerLink=\"/login\"\n class=\"cursor-pointer user-info-label mt-4 link-label\"> Log in </li>\n <li [routerLink]=\"'/privacy-and-tos/' + tosId\"\n class=\"cursor-pointer user-info-label mt-4 link-label\"> Privacy statement </li>\n </ul>\n <p class=\"address-section email-section mb-4\">\n <span class=\"user-info-label\">Email: </span>\n <ng-container *ngIf=\"!isEditingEmail; else editEmail\">\n <span class=\"user-info\">{{ email }}</span>\n <i *ngIf=\"canEditResourcesValue\" class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3\" (click)=\"isEditingEmail = true\" (keydown.enter)=\"isEditingEmail = true\" (keydown.space)=\"isEditingEmail = true\"></i>\n </ng-container>\n\n <ng-template #editEmail>\n <input\n class=\"form-control d-inline w-auto\"\n [(ngModel)]=\"editingEmail\"\n />\n <button class=\"btn btn-sm btn-primary ms-2\" (click)=\"saveEmail()\">Save</button>\n <button class=\"btn btn-sm btn-secondary ms-2\" (click)=\"isEditingEmail = false\">Cancel</button>\n </ng-template>\n </p>\n <span class=\"email-section mt-3 address-text\">\n <span class=\"user-info-label\">\n Address:\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon cursor-pointer ms-2 text-white\"\n title=\"Edit Address\"\n (click)=\"isEditingStreet = true\"\n (keydown.enter)=\"isEditingStreet = true\"\n (keydown.space)=\"isEditingStreet = true\"></i>\n </span><br/>\n\n <ng-container *ngIf=\"!isEditingStreet; else editStreetBlock\">\n <span class=\"address-text user-info\">{{ street }}</span>\n </ng-container>\n\n <ng-template #editStreetBlock>\n <div class=\"d-flex align-items-center mt-3\">\n <input class=\"form-control form-control-sm\" [(ngModel)]=\"editingStreet\" />\n <button class=\"btn btn-sm btn-primary ms-2\" (click)=\"saveStreet()\">Save</button>\n <button class=\"btn btn-sm btn-secondary ms-2\" (click)=\"cancelStreet()\">Cancel</button>\n </div>\n </ng-template>\n\n </span>\n\n </div>\n <div class=\"d-flex\">\n <img [src]=\"logo\"\n alt=\"Company logo\"\n class=\"img-fluid mt-4 logo-image cursor-pointer\"\n width=\"160\"\n height=\"35\"\n (click)=\"scrollToTop()\"\n (keydown.enter)=\"scrollToTop()\"\n (keydown.space)=\"scrollToTop()\"\n title=\"Click to go to top of page\" />\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon fa-sm ms-3 cursor-pointer text-white align-self-center mt-3\"\n (click)=\"openLogoEditModal()\"\n (keydown.enter)=\"openLogoEditModal()\"\n (keydown.space)=\"openLogoEditModal()\"\n title=\"Edit Logo\"></i>\n </div>\n </div>\n\n <!-- RIGHT COLUMN -->\n <div class=\"col-md-6\">\n <ng-container *ngIf=\"getFooterHubspotForm() as footerItem; else defaultForm\">\n <div class=\"d-flex\">\n <div\n class=\"hubspot-container w-100 content-loaded\"\n [innerHTML]=\"hubspotHtml\"\n (load)=\"onHubspotLoad($event)\">\n </div>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer\"\n (click)=\"openHubspotEditModal(footerItem)\"\n (keydown.enter)=\"openHubspotEditModal(footerItem)\"\n (keydown.space)=\"openHubspotEditModal(footerItem)\"\n title=\"Edit Hubspot Embed\"></i>\n </div>\n </ng-container>\n\n <ng-template #defaultForm>\n <div class=\"d-flex\">\n <h3 class=\"text-white mb-4\"> <span class=\"text-white\">Get in touch:</span></h3>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3 mt-2\"\n (click)=\"openQuestionsEditModal()\"\n (keydown.enter)=\"openQuestionsEditModal()\"\n (keydown.space)=\"openQuestionsEditModal()\"\n title=\"Edit Questions\"></i>\n </div>\n <div class=\"contact-form\">\n <form [formGroup]=\"form\">\n <div class=\"mb-3\">\n <div class=\"email\">\n <div class=\"form-field\">\n <label for=\"email\">Email:</label>\n <div class=\"w-100\">\n <input type=\"text\"\n class=\"mb-1\"\n id=\"email\"\n formControlName=\"email\" />\n <pw-field-error-display [displayError]=\"\n !form.get('email').valid && (form.get('email').touched || submitted)\n \"\n errorMsg=\"Email is required\">\n </pw-field-error-display>\n </div>\n </div>\n <div class=\"form-field\">\n <label for=\"first_name\">First name:</label>\n <div class=\"w-100\">\n <input input type=\"text\"\n id=\"first_name\"\n formControlName=\"first_name\" />\n <pw-field-error-display [displayError]=\"\n !form.get('first_name').valid && (form.get('first_name').touched || submitted)\n \"\n errorMsg=\"First name is required\">\n </pw-field-error-display>\n </div>\n </div>\n <div class=\"form-field\">\n <label for=\"last_name\">Last name:</label>\n <input type=\"text\"\n id=\"last_name\"\n formControlName=\"last_name\" />\n </div>\n <div class=\"form-field\">\n <label for=\"company\">Company:</label>\n <input type=\"text\"\n id=\"company\"\n formControlName=\"company\" />\n </div>\n <div class=\"form-field\" *ngIf=\"hasValidOptions()\">\n <label for=\"psa\" class=\"select-label\">{{question}}</label>\n <p-dropdown\n formControlName=\"psa\"\n [options]=\"psaOptions\"\n [placeholder]=\"'Select PSA'\"\n styleClass=\"input-select\">\n </p-dropdown>\n </div>\n <div class=\"form-field\">\n <label for=\"enquiry\" class=\"select-label\">How can we help you?</label>\n <div class=\"enquiry-field\">\n <textarea id=\"enquiry\" formControlName=\"enquiry\" class=\"\">\n </textarea>\n <pw-field-error-display [displayError]=\"\n !form.get('enquiry').valid && (form.get('enquiry').touched || submitted)\n \"\n errorMsg=\"Enquiry is required\">\n </pw-field-error-display>\n </div>\n </div>\n </div>\n </div>\n <div class=\"text-end\">\n <div class=\"captcha-wrapper-container\"\n *ngIf=\"isCaptchaVerified\">\n <ngx-recaptcha2 [ngModelOptions]=\"{ standalone: true }\"\n [siteKey]=\"captchaKeyV2\"\n size=\"normal\"\n [(ngModel)]=\"recaptcha\"\n (success)=\"handleSuccess($event)\">\n </ngx-recaptcha2>\n </div>\n <button type=\"submit\"\n (click)=\"onSubmit()\"\n *ngIf=\"!isCaptchaVerified\"\n class=\"sign-btn sign-header-btn mt-3\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n\n <div class=\"d-flex align-items-center mt-4\">\n <div class=\"icons d-flex align-items-center\">\n <a [eventTracker]=\"{\n category: 'youtube',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n [href]=\"youtubeUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <img src=\"/assets/img/icons/youtube.png\"\n class=\"img-fluid youtube-icon\"\n width=\"54\"\n height=\"54\"\n alt=\"\" />\n </a>\n <a [eventTracker]=\"{\n category: 'linkedin',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n [href]=\"linkedInUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n class=\"ms-3\">\n <img src=\"/assets/img/icons/social/linkedin.svg\"\n class=\"img-fluid linkedin-icon\"\n width=\"48\"\n height=\"48\"\n alt=\"\" />\n </a>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3\"\n (click)=\"openSocialEditModal()\"\n (keydown.enter)=\"openSocialEditModal()\"\n (keydown.space)=\"openSocialEditModal()\"\n title=\"Edit Social Links & Company Name\"></i>\n </div>\n <div class=\"copyright text-white\">\n 2025 {{companyName}}.\n </div>\n </div>\n </form>\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n\n\n\n<ng-template #bookMeeting\n let-modal>\n <div class=\"modal-header\">\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <h3 class=\"text-center modal-basic-title\">\n Thanks for getting in touch! Our team will be in contact shortly, or we\n can compare calendars now &amp; schedule a time\n </h3>\n <button type=\"button\"\n [eventTracker]=\"{\n category: 'request-demo',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n (click)=\"navigateToBookMeeting()\"\n class=\"sign-btn sign-header-btn mx-auto d-block mb-3\">\n Let's do it\n </button>\n </div>\n</ng-template>\n\n\n<ng-template #editFooterLinksModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Footer Links</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Footer Links Section</h4>\n <div cdkDropList (cdkDropListDropped)=\"dropFooterLinks($event)\">\n <div *ngFor=\"let footer of editingFooterLinks.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-5 mb-2\">\n <label for=\"footerTitle{{i}}\" class=\"form-label\">Title</label>\n <input id=\"footerTitle{{i}}\" class=\"form-control\" [(ngModel)]=\"footer.title\" />\n </div>\n <div class=\"col-md-5 mb-2\">\n <label for=\"footerPath{{i}}\" class=\"form-label\">Path</label>\n <input id=\"footerPath{{i}}\" class=\"form-control\" [(ngModel)]=\"footer.path\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeFooterLink(i)\" (keydown.enter)=\"removeFooterLink(i)\" (keydown.space)=\"removeFooterLink(i)\"></i>\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n\n <!-- Subtitles -->\n <div cdkDropList (cdkDropListDropped)=\"dropSubtitles(i, $event)\">\n <div *ngFor=\"let sub of footer.subtitles; let j = index\" class=\"row border p-3 mb-2 align-items-center\" cdkDrag>\n <div class=\"col-md-5\">\n <label for=\"subtitleTitle{{i}}{{j}}\" class=\"form-label\">Subtitle Title</label>\n <input id=\"subtitleTitle{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"sub.title\" />\n </div>\n <div class=\"col-md-5\">\n <label for=\"subtitlePath{{i}}{{j}}\" class=\"form-label\">Subtitle Path</label>\n <input id=\"subtitlePath{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"sub.path\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeSubtitle(i, j)\" (keydown.enter)=\"removeSubtitle(i, j)\" (keydown.space)=\"removeSubtitle(i, j)\"></i>\n <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm mt-2\" (click)=\"addSubtitle(i)\">\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-3\" (click)=\"addFooterLink()\">\n + Add Footer Link\n </button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveFooterLinks(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n\n\n<ng-template #logoModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Logo</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <pw-custom-uploader\n [aspectRatio]=\"'fullLogo'\"\n [title]=\"'Main Contrast Logo'\"\n [controlName]=\"'logo_main_contrast'\"\n [previewData]=\"previewData\"\n (saveEvent)=\"onSaveFile($event)\">\n </pw-custom-uploader>\n </div>\n</ng-template>\n\n\n\n<ng-template #hubspotEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Hubspot Embed</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label for=\"hubspotId\" class=\"form-label\">Hubspot ID</label>\n <input id=\"hubspotId\" [(ngModel)]=\"editingHubspotId\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"hubspotEmbedDiv\" class=\"form-label\">Embed DIV</label>\n <textarea id=\"hubspotEmbedDiv\" [(ngModel)]=\"editingHubspotHtml\" rows=\"8\" class=\"form-control\"></textarea>\n </div>\n </div>\n <div class=\"modal-footer\">\n <button class=\"btn btn-primary\" (click)=\"saveHubspotHtml(modal)\">Save</button>\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n </div>\n</ng-template>\n\n\n<ng-template #socialEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Social Links & Company Name</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label for=\"youtubeUrl\" class=\"form-label\">YouTube URL</label>\n <input id=\"youtubeUrl\" [(ngModel)]=\"editingYoutubeUrl\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"linkedinUrl\" class=\"form-label\">LinkedIn URL</label>\n <input id=\"linkedinUrl\" [(ngModel)]=\"editingLinkedInUrl\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"companyName\" class=\"form-label\">Company Name</label>\n <input id=\"companyName\" [(ngModel)]=\"editingCompanyName\" class=\"form-control\" />\n </div>\n </div>\n <div class=\"modal-footer\">\n <button class=\"btn btn-primary\" (click)=\"saveSocialLinks(modal)\">Save</button>\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n </div>\n</ng-template>\n\n\n\n<ng-template #questionsEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Questions</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Questions Section</h4>\n <div cdkDropList (cdkDropListDropped)=\"dropQuestions($event)\">\n <div *ngFor=\"let q of editingQuestions; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-11 mb-2\">\n <label for=\"questionText{{i}}\" class=\"form-label\">Question</label>\n <input id=\"questionText{{i}}\" class=\"form-control\" [(ngModel)]=\"q.question\" placeholder=\"Enter question\" />\n </div>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-4\">\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n\n <!-- Options Section -->\n <div cdkDropList (cdkDropListDropped)=\"dropQuestionOptions(i, $event)\">\n <div *ngFor=\"let opt of q.options; let j = index\" class=\"row border p-3 mb-2 align-items-center\" cdkDrag>\n <div class=\"col-md-7 mb-2\">\n <label for=\"questionOption{{i}}{{j}}\" class=\"form-label\">Option</label>\n <input id=\"questionOption{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"opt.option\" placeholder=\"Enter option\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeQuestionOption(i, j)\" (keydown.enter)=\"removeQuestionOption(i, j)\" (keydown.enter)=\"removeQuestionOption(i, j)\"></i>\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm mt-2\" (click)=\"addQuestionOption(i)\">+ Add Option</button>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-3\" (click)=\"addNewQuestion()\">+ Add Question</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveQuestions(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n", styles: [".product-explainer-section{background-color:#000}.footer-section{min-height:500px}@media (min-width: 768px){.footer-section{min-height:600px}}.footer-section .container{transition:opacity .3s ease,visibility .3s ease}.footer-section input.form-control,.footer-section select.form-control,.footer-section textarea.form-control{background-color:#fff;border:none;color:#000;font-size:14px}.btn-primary{background-color:#007bff;border:none}.site-column{margin-top:2.9rem}.email-section{color:#fff;font-size:2rem}.address-section{margin-top:5rem}.address-text{line-height:2.2rem}.user-info{font-size:1.5rem}.user-info-label{font-size:1.7rem;font-weight:700}.contact-form form .form-field{display:flex;align-items:center;margin-bottom:1.2rem}.contact-form form .form-field label{width:130px;min-width:130px;margin:0;font-size:14px;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:1px}.contact-form form .form-field p-dropdown{width:100%}.contact-form form .form-field input,.contact-form form .form-field select,.contact-form form .form-field textarea,.contact-form form .form-field ::ng-deep p-dropdown .p-inputwrapper{flex:1;border:none;border-radius:30px;padding:12px 20px;font-size:14px;width:100%!important;max-width:100%;color:#000}.contact-form form .form-field textarea{resize:vertical}.contact-form form .submit-button{background-color:#3b82f6;border:none;border-radius:30px;font-size:16px;font-weight:500;padding:10px 24px;margin-top:1.2rem}.input-select{height:43px}.select-label{width:210px!important}.copyright{margin-top:2rem;margin-left:4rem;font-size:19px;font-weight:700}.d-flex img{margin-right:0!important}.youtube-icon{height:38px}.enquiry-field{margin-left:.5rem;width:63%}::ng-deep .text-danger{margin-top:.25rem!important;margin-left:.5rem!important}.hubspot-container{min-height:400px;transition:opacity .3s ease}.hubspot-container:not(.content-loaded){opacity:0;pointer-events:none}.hubspot-container.content-loaded{opacity:1}@media (min-width: 768px){.hubspot-container{margin-top:-3rem}}@media (min-width: 768px) and (max-width: 1200px){.container{padding:0rem 6rem!important}}.link-label{cursor:pointer;transition:color .3s}.link-label:hover{color:var(--first)}.icons img{transition:transform .3s ease,filter .3s ease;cursor:pointer}.icons img:hover{transform:scale(1.1);filter:brightness(1.2)}.logo-image{max-width:160px;width:160px;height:35px;object-fit:contain;aspect-ratio:160/35}\n"], dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i8.FieldErrorDisplayComponent, selector: "pw-field-error-display", inputs: ["errorMsg", "displayError"] }, { kind: "component", type: i9.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i10.ReCaptcha2Component, selector: "ngx-recaptcha2", inputs: ["theme", "size"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i12.EventTrackerDirective, selector: "[eventTracker]", inputs: ["eventTracker"] }, { kind: "directive", type: i12.LazyImgDirective, selector: "img" }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
520
520
  }
521
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: Trial4ContactUsComponent, decorators: [{
521
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: Trial4ContactUsComponent, decorators: [{
522
522
  type: Component,
523
- args: [{ selector: 'pw-trial-4-contact-us', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section #footerSection class=\"bg-black text-white py-5 footer-section\">\n <div class=\"container\">\n <div class=\"row\">\n\n <!-- LEFT COLUMN -->\n <div class=\"col-md-6 mb-4 d-flex flex-column justify-content-between\" [ngClass]=\"{ 'site-column': getFooterHubspotForm() }\">\n <div>\n <h3 class=\"mb-4 d-flex align-items-center\">\n <span class=\"me-2 text-white\">Site Map:</span>\n <i *ngIf=\"canEditResourcesValue\" class=\"fa fa-edit in-page-edit-icon cursor-pointer text-white ms-3\" (click)=\"openEditFooterLinksModal(editFooterLinksModal)\" (keydown.enter)=\"openEditFooterLinksModal(editFooterLinksModal)\" (keydown.space)=\"openEditFooterLinksModal(editFooterLinksModal)\" ngbTooltip=\"Edit Footer Links\"></i>\n </h3>\n <ul class=\"mt-4\">\n <li routerLink=\"/\"\n class=\"cursor-pointer user-info-label link-label\"> Home </li>\n <li *ngFor=\"let link of footerLinks\" [routerLink]=\"link?.path\"\n class=\"cursor-pointer user-info-label link-label mt-4\"><span *ngIf=\"link?.title\">{{link?.title}}</span> </li>\n <li routerLink=\"/login\"\n class=\"cursor-pointer user-info-label mt-4 link-label\"> Log in </li>\n <li [routerLink]=\"'/privacy-and-tos/' + tosId\"\n class=\"cursor-pointer user-info-label mt-4 link-label\"> Privacy statement </li>\n </ul>\n <p class=\"address-section email-section mb-4\">\n <span class=\"user-info-label\">Email: </span>\n <ng-container *ngIf=\"!isEditingEmail; else editEmail\">\n <span class=\"user-info\">{{ email }}</span>\n <i *ngIf=\"canEditResourcesValue\" class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3\" (click)=\"isEditingEmail = true\" (keydown.enter)=\"isEditingEmail = true\" (keydown.space)=\"isEditingEmail = true\"></i>\n </ng-container>\n\n <ng-template #editEmail>\n <input\n class=\"form-control d-inline w-auto\"\n [(ngModel)]=\"editingEmail\"\n />\n <button class=\"btn btn-sm btn-primary ms-2\" (click)=\"saveEmail()\">Save</button>\n <button class=\"btn btn-sm btn-secondary ms-2\" (click)=\"isEditingEmail = false\">Cancel</button>\n </ng-template>\n </p>\n <span class=\"email-section mt-3 address-text\">\n <span class=\"user-info-label\">\n Address:\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon cursor-pointer ms-2 text-white\"\n title=\"Edit Address\"\n (click)=\"isEditingStreet = true\"\n (keydown.enter)=\"isEditingStreet = true\"\n (keydown.space)=\"isEditingStreet = true\"></i>\n </span><br/>\n\n <ng-container *ngIf=\"!isEditingStreet; else editStreetBlock\">\n <span class=\"address-text user-info\">{{ street }}</span>\n </ng-container>\n\n <ng-template #editStreetBlock>\n <div class=\"d-flex align-items-center mt-3\">\n <input class=\"form-control form-control-sm\" [(ngModel)]=\"editingStreet\" />\n <button class=\"btn btn-sm btn-primary ms-2\" (click)=\"saveStreet()\">Save</button>\n <button class=\"btn btn-sm btn-secondary ms-2\" (click)=\"cancelStreet()\">Cancel</button>\n </div>\n </ng-template>\n\n </span>\n\n </div>\n <div class=\"d-flex\">\n <img [src]=\"logo\"\n alt=\"Company logo\"\n class=\"img-fluid mt-4 logo-image cursor-pointer\"\n width=\"160\"\n height=\"35\"\n (click)=\"scrollToTop()\"\n (keydown.enter)=\"scrollToTop()\"\n (keydown.space)=\"scrollToTop()\"\n title=\"Click to go to top of page\" />\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon fa-sm ms-3 cursor-pointer text-white align-self-center mt-3\"\n (click)=\"openLogoEditModal()\"\n (keydown.enter)=\"openLogoEditModal()\"\n (keydown.space)=\"openLogoEditModal()\"\n title=\"Edit Logo\"></i>\n </div>\n </div>\n\n <!-- RIGHT COLUMN -->\n <div class=\"col-md-6\">\n <ng-container *ngIf=\"getFooterHubspotForm() as footerItem; else defaultForm\">\n <div class=\"d-flex\">\n <div\n class=\"hubspot-container w-100 content-loaded\"\n [innerHTML]=\"hubspotHtml\"\n (load)=\"onHubspotLoad($event)\">\n </div>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer\"\n (click)=\"openHubspotEditModal(footerItem)\"\n (keydown.enter)=\"openHubspotEditModal(footerItem)\"\n (keydown.space)=\"openHubspotEditModal(footerItem)\"\n title=\"Edit Hubspot Embed\"></i>\n </div>\n </ng-container>\n\n <ng-template #defaultForm>\n <div class=\"d-flex\">\n <h3 class=\"text-white mb-4\"> <span class=\"text-white\">Get in touch:</span></h3>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3 mt-2\"\n (click)=\"openQuestionsEditModal()\"\n (keydown.enter)=\"openQuestionsEditModal()\"\n (keydown.space)=\"openQuestionsEditModal()\"\n title=\"Edit Questions\"></i>\n </div>\n <div class=\"contact-form\">\n <form [formGroup]=\"form\">\n <div class=\"mb-3\">\n <div class=\"email\">\n <div class=\"form-field\">\n <label for=\"email\">Email:</label>\n <div class=\"w-100\">\n <input type=\"text\"\n class=\"mb-1\"\n id=\"email\"\n formControlName=\"email\" />\n <pw-field-error-display [displayError]=\"\n !form.get('email').valid && (form.get('email').touched || submitted)\n \"\n errorMsg=\"Email is required\">\n </pw-field-error-display>\n </div>\n </div>\n <div class=\"form-field\">\n <label for=\"first_name\">First name:</label>\n <div class=\"w-100\">\n <input input type=\"text\"\n id=\"first_name\"\n formControlName=\"first_name\" />\n <pw-field-error-display [displayError]=\"\n !form.get('first_name').valid && (form.get('first_name').touched || submitted)\n \"\n errorMsg=\"First name is required\">\n </pw-field-error-display>\n </div>\n </div>\n <div class=\"form-field\">\n <label for=\"last_name\">Last name:</label>\n <input type=\"text\"\n id=\"last_name\"\n formControlName=\"last_name\" />\n </div>\n <div class=\"form-field\">\n <label for=\"company\">Company:</label>\n <input type=\"text\"\n id=\"company\"\n formControlName=\"company\" />\n </div>\n <div class=\"form-field\" *ngIf=\"hasValidOptions()\">\n <label for=\"psa\" class=\"select-label\">{{question}}</label>\n <p-dropdown\n formControlName=\"psa\"\n [options]=\"psaOptions\"\n [placeholder]=\"'Select PSA'\"\n styleClass=\"input-select\">\n </p-dropdown>\n </div>\n <div class=\"form-field\">\n <label for=\"enquiry\" class=\"select-label\">How can we help you?</label>\n <div class=\"enquiry-field\">\n <textarea id=\"enquiry\" formControlName=\"enquiry\" class=\"\">\n </textarea>\n <pw-field-error-display [displayError]=\"\n !form.get('enquiry').valid && (form.get('enquiry').touched || submitted)\n \"\n errorMsg=\"Enquiry is required\">\n </pw-field-error-display>\n </div>\n </div>\n </div>\n </div>\n <div class=\"text-end\">\n <div class=\"captcha-wrapper-container\"\n *ngIf=\"isCaptchaVerified\">\n <ngx-recaptcha2 [ngModelOptions]=\"{ standalone: true }\"\n [siteKey]=\"captchaKeyV2\"\n size=\"normal\"\n [(ngModel)]=\"recaptcha\"\n (success)=\"handleSuccess($event)\">\n </ngx-recaptcha2>\n </div>\n <button type=\"submit\"\n (click)=\"onSubmit()\"\n *ngIf=\"!isCaptchaVerified\"\n class=\"sign-btn sign-header-btn mt-3\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n\n <div class=\"d-flex align-items-center mt-4\">\n <div class=\"icons d-flex align-items-center\">\n <a [eventTracker]=\"{\n category: 'youtube',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n [href]=\"youtubeUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <img src=\"/assets/img/icons/youtube.png\"\n class=\"img-fluid youtube-icon\"\n width=\"54\"\n height=\"54\"\n alt=\"\" />\n </a>\n <a [eventTracker]=\"{\n category: 'linkedin',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n [href]=\"linkedInUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n class=\"ms-3\">\n <img src=\"/assets/img/icons/social/linkedin.svg\"\n class=\"img-fluid linkedin-icon\"\n width=\"48\"\n height=\"48\"\n alt=\"\" />\n </a>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3\"\n (click)=\"openSocialEditModal()\"\n (keydown.enter)=\"openSocialEditModal()\"\n (keydown.space)=\"openSocialEditModal()\"\n title=\"Edit Social Links & Company Name\"></i>\n </div>\n <div class=\"copyright text-white\">\n 2025 {{companyName}}.\n </div>\n </div>\n </form>\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n\n\n\n<ng-template #bookMeeting\n let-modal>\n <div class=\"modal-header\">\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <h3 class=\"text-center modal-basic-title\">\n Thanks for getting in touch! Our team will be in contact shortly, or we\n can compare calendars now &amp; schedule a time\n </h3>\n <button type=\"button\"\n [eventTracker]=\"{\n category: 'request-demo',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n (click)=\"navigateToBookMeeting()\"\n class=\"sign-btn sign-header-btn mx-auto d-block mb-3\">\n Let's do it\n </button>\n </div>\n</ng-template>\n\n\n<ng-template #editFooterLinksModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Footer Links</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Footer Links Section</h4>\n <div cdkDropList (cdkDropListDropped)=\"dropFooterLinks($event)\">\n <div *ngFor=\"let footer of editingFooterLinks.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-5 mb-2\">\n <label for=\"footerTitle{{i}}\" class=\"form-label\">Title</label>\n <input id=\"footerTitle{{i}}\" class=\"form-control\" [(ngModel)]=\"footer.title\" />\n </div>\n <div class=\"col-md-5 mb-2\">\n <label for=\"footerPath{{i}}\" class=\"form-label\">Path</label>\n <input id=\"footerPath{{i}}\" class=\"form-control\" [(ngModel)]=\"footer.path\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeFooterLink(i)\" (keydown.enter)=\"removeFooterLink(i)\" (keydown.space)=\"removeFooterLink(i)\"></i>\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n\n <!-- Subtitles -->\n <div cdkDropList (cdkDropListDropped)=\"dropSubtitles(i, $event)\">\n <div *ngFor=\"let sub of footer.subtitles; let j = index\" class=\"row border p-3 mb-2 align-items-center\" cdkDrag>\n <div class=\"col-md-5\">\n <label for=\"subtitleTitle{{i}}{{j}}\" class=\"form-label\">Subtitle Title</label>\n <input id=\"subtitleTitle{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"sub.title\" />\n </div>\n <div class=\"col-md-5\">\n <label for=\"subtitlePath{{i}}{{j}}\" class=\"form-label\">Subtitle Path</label>\n <input id=\"subtitlePath{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"sub.path\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeSubtitle(i, j)\" (keydown.enter)=\"removeSubtitle(i, j)\" (keydown.space)=\"removeSubtitle(i, j)\"></i>\n <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm mt-2\" (click)=\"addSubtitle(i)\">\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-3\" (click)=\"addFooterLink()\">\n + Add Footer Link\n </button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveFooterLinks(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n\n\n<ng-template #logoModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Logo</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <pw-custom-uploader\n [aspectRatio]=\"'fullLogo'\"\n [title]=\"'Main Contrast Logo'\"\n [controlName]=\"'logo_main_contrast'\"\n [previewData]=\"previewData\"\n (saveEvent)=\"onSaveFile($event)\">\n </pw-custom-uploader>\n </div>\n</ng-template>\n\n\n\n<ng-template #hubspotEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Hubspot Embed</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label for=\"hubspotId\" class=\"form-label\">Hubspot ID</label>\n <input id=\"hubspotId\" [(ngModel)]=\"editingHubspotId\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"hubspotEmbedDiv\" class=\"form-label\">Embed DIV</label>\n <textarea id=\"hubspotEmbedDiv\" [(ngModel)]=\"editingHubspotHtml\" rows=\"8\" class=\"form-control\"></textarea>\n </div>\n </div>\n <div class=\"modal-footer\">\n <button class=\"btn btn-primary\" (click)=\"saveHubspotHtml(modal)\">Save</button>\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n </div>\n</ng-template>\n\n\n<ng-template #socialEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Social Links & Company Name</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label for=\"youtubeUrl\" class=\"form-label\">YouTube URL</label>\n <input id=\"youtubeUrl\" [(ngModel)]=\"editingYoutubeUrl\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"linkedinUrl\" class=\"form-label\">LinkedIn URL</label>\n <input id=\"linkedinUrl\" [(ngModel)]=\"editingLinkedInUrl\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"companyName\" class=\"form-label\">Company Name</label>\n <input id=\"companyName\" [(ngModel)]=\"editingCompanyName\" class=\"form-control\" />\n </div>\n </div>\n <div class=\"modal-footer\">\n <button class=\"btn btn-primary\" (click)=\"saveSocialLinks(modal)\">Save</button>\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n </div>\n</ng-template>\n\n\n\n<ng-template #questionsEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Questions</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Questions Section</h4>\n <div cdkDropList (cdkDropListDropped)=\"dropQuestions($event)\">\n <div *ngFor=\"let q of editingQuestions; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-11 mb-2\">\n <label for=\"questionText{{i}}\" class=\"form-label\">Question</label>\n <input id=\"questionText{{i}}\" class=\"form-control\" [(ngModel)]=\"q.question\" placeholder=\"Enter question\" />\n </div>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-4\">\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n\n <!-- Options Section -->\n <div cdkDropList (cdkDropListDropped)=\"dropQuestionOptions(i, $event)\">\n <div *ngFor=\"let opt of q.options; let j = index\" class=\"row border p-3 mb-2 align-items-center\" cdkDrag>\n <div class=\"col-md-7 mb-2\">\n <label for=\"questionOption{{i}}{{j}}\" class=\"form-label\">Option</label>\n <input id=\"questionOption{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"opt.option\" placeholder=\"Enter option\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeQuestionOption(i, j)\" (keydown.enter)=\"removeQuestionOption(i, j)\" (keydown.enter)=\"removeQuestionOption(i, j)\"></i>\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm mt-2\" (click)=\"addQuestionOption(i)\">+ Add Option</button>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-3\" (click)=\"addNewQuestion()\">+ Add Question</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveQuestions(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n", styles: [".product-explainer-section{background-color:#000}.footer-section{min-height:500px}@media (min-width: 768px){.footer-section{min-height:600px}}.footer-section .container{transition:opacity .3s ease,visibility .3s ease}.footer-section input.form-control,.footer-section select.form-control,.footer-section textarea.form-control{background-color:#fff;border:none;color:#000;font-size:14px}.btn-primary{background-color:#007bff;border:none}.site-column{margin-top:2.9rem}.email-section{color:#fff;font-size:2rem}.address-section{margin-top:5rem}.address-text{line-height:2.2rem}.user-info{font-size:1.5rem}.user-info-label{font-size:1.7rem;font-weight:700}.contact-form form .form-field{display:flex;align-items:center;margin-bottom:1.2rem}.contact-form form .form-field label{width:130px;min-width:130px;margin:0;font-size:14px;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:1px}.contact-form form .form-field p-dropdown{width:100%}.contact-form form .form-field input,.contact-form form .form-field select,.contact-form form .form-field textarea,.contact-form form .form-field ::ng-deep p-dropdown .p-inputwrapper{flex:1;border:none;border-radius:30px;padding:12px 20px;font-size:14px;width:100%!important;max-width:100%;color:#000}.contact-form form .form-field textarea{resize:vertical}.contact-form form .submit-button{background-color:#3b82f6;border:none;border-radius:30px;font-size:16px;font-weight:500;padding:10px 24px;margin-top:1.2rem}.input-select{height:43px}.select-label{width:210px!important}.copyright{margin-top:2rem;margin-left:4rem;font-size:19px;font-weight:700}.d-flex img{margin-right:0!important}.youtube-icon{height:38px}.enquiry-field{margin-left:.5rem;width:63%}::ng-deep .text-danger{margin-top:.25rem!important;margin-left:.5rem!important}.hubspot-container{min-height:400px;transition:opacity .3s ease}.hubspot-container:not(.content-loaded){opacity:0;pointer-events:none}.hubspot-container.content-loaded{opacity:1}@media (min-width: 768px){.hubspot-container{margin-top:-3rem}}@media (min-width: 768px) and (max-width: 1200px){.container{padding:0rem 6rem!important}}.link-label{cursor:pointer;transition:color .3s}.link-label:hover{color:var(--first)}.icons img{transition:transform .3s ease,filter .3s ease;cursor:pointer}.icons img:hover{transform:scale(1.1);filter:brightness(1.2)}.logo-image{max-width:160px;width:160px;height:35px;object-fit:contain;aspect-ratio:160/35}\n"] }]
523
+ args: [{ selector: 'pw-trial-4-contact-us', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<section #footerSection class=\"bg-black text-white py-5 footer-section\">\n <div class=\"container\">\n <div class=\"row\">\n\n <!-- LEFT COLUMN -->\n <div class=\"col-md-6 mb-4 d-flex flex-column justify-content-between\" [ngClass]=\"{ 'site-column': getFooterHubspotForm() }\">\n <div>\n <h3 class=\"mb-4 d-flex align-items-center\">\n <span class=\"me-2 text-white\">Site Map:</span>\n <i *ngIf=\"canEditResourcesValue\" class=\"fa fa-edit in-page-edit-icon cursor-pointer text-white ms-3\" (click)=\"openEditFooterLinksModal(editFooterLinksModal)\" (keydown.enter)=\"openEditFooterLinksModal(editFooterLinksModal)\" (keydown.space)=\"openEditFooterLinksModal(editFooterLinksModal)\" ngbTooltip=\"Edit Footer Links\"></i>\n </h3>\n <ul class=\"mt-4\">\n <li routerLink=\"/\"\n class=\"cursor-pointer user-info-label link-label\"> Home </li>\n <li *ngFor=\"let link of footerLinks\" [routerLink]=\"link?.path\"\n class=\"cursor-pointer user-info-label link-label mt-4\"><span *ngIf=\"link?.title\">{{link?.title}}</span> </li>\n <li routerLink=\"/login\"\n class=\"cursor-pointer user-info-label mt-4 link-label\"> Log in </li>\n <li [routerLink]=\"'/privacy-and-tos/' + tosId\"\n class=\"cursor-pointer user-info-label mt-4 link-label\"> Privacy statement </li>\n </ul>\n <p class=\"address-section email-section mb-4\">\n <span class=\"user-info-label\">Email: </span>\n <ng-container *ngIf=\"!isEditingEmail; else editEmail\">\n <span class=\"user-info\">{{ email }}</span>\n <i *ngIf=\"canEditResourcesValue\" class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3\" (click)=\"isEditingEmail = true\" (keydown.enter)=\"isEditingEmail = true\" (keydown.space)=\"isEditingEmail = true\"></i>\n </ng-container>\n\n <ng-template #editEmail>\n <input\n class=\"form-control d-inline w-auto\"\n [(ngModel)]=\"editingEmail\"\n />\n <button class=\"btn btn-sm btn-primary ms-2\" (click)=\"saveEmail()\">Save</button>\n <button class=\"btn btn-sm btn-secondary ms-2\" (click)=\"isEditingEmail = false\">Cancel</button>\n </ng-template>\n </p>\n <span class=\"email-section mt-3 address-text\">\n <span class=\"user-info-label\">\n Address:\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon cursor-pointer ms-2 text-white\"\n title=\"Edit Address\"\n (click)=\"isEditingStreet = true\"\n (keydown.enter)=\"isEditingStreet = true\"\n (keydown.space)=\"isEditingStreet = true\"></i>\n </span><br/>\n\n <ng-container *ngIf=\"!isEditingStreet; else editStreetBlock\">\n <span class=\"address-text user-info\">{{ street }}</span>\n </ng-container>\n\n <ng-template #editStreetBlock>\n <div class=\"d-flex align-items-center mt-3\">\n <input class=\"form-control form-control-sm\" [(ngModel)]=\"editingStreet\" />\n <button class=\"btn btn-sm btn-primary ms-2\" (click)=\"saveStreet()\">Save</button>\n <button class=\"btn btn-sm btn-secondary ms-2\" (click)=\"cancelStreet()\">Cancel</button>\n </div>\n </ng-template>\n\n </span>\n\n </div>\n <div class=\"d-flex\">\n <img [src]=\"logo\"\n alt=\"Company logo\"\n class=\"img-fluid mt-4 logo-image cursor-pointer\"\n width=\"160\"\n height=\"35\"\n (click)=\"scrollToTop()\"\n (keydown.enter)=\"scrollToTop()\"\n (keydown.space)=\"scrollToTop()\"\n title=\"Click to go to top of page\" />\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon fa-sm ms-3 cursor-pointer text-white align-self-center mt-3\"\n (click)=\"openLogoEditModal()\"\n (keydown.enter)=\"openLogoEditModal()\"\n (keydown.space)=\"openLogoEditModal()\"\n title=\"Edit Logo\"></i>\n </div>\n </div>\n\n <!-- RIGHT COLUMN -->\n <div class=\"col-md-6\">\n <ng-container *ngIf=\"getFooterHubspotForm() as footerItem; else defaultForm\">\n <div class=\"d-flex\">\n <div\n class=\"hubspot-container w-100 content-loaded\"\n [innerHTML]=\"hubspotHtml\"\n (load)=\"onHubspotLoad($event)\">\n </div>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer\"\n (click)=\"openHubspotEditModal(footerItem)\"\n (keydown.enter)=\"openHubspotEditModal(footerItem)\"\n (keydown.space)=\"openHubspotEditModal(footerItem)\"\n title=\"Edit Hubspot Embed\"></i>\n </div>\n </ng-container>\n\n <ng-template #defaultForm>\n <div class=\"d-flex\">\n <h3 class=\"text-white mb-4\"> <span class=\"text-white\">Get in touch:</span></h3>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3 mt-2\"\n (click)=\"openQuestionsEditModal()\"\n (keydown.enter)=\"openQuestionsEditModal()\"\n (keydown.space)=\"openQuestionsEditModal()\"\n title=\"Edit Questions\"></i>\n </div>\n <div class=\"contact-form\">\n <form [formGroup]=\"form\">\n <div class=\"mb-3\">\n <div class=\"email\">\n <div class=\"form-field\">\n <label for=\"email\">Email:</label>\n <div class=\"w-100\">\n <input type=\"text\"\n class=\"mb-1\"\n id=\"email\"\n formControlName=\"email\" />\n <pw-field-error-display [displayError]=\"\n !form.get('email').valid && (form.get('email').touched || submitted)\n \"\n errorMsg=\"Email is required\">\n </pw-field-error-display>\n </div>\n </div>\n <div class=\"form-field\">\n <label for=\"first_name\">First name:</label>\n <div class=\"w-100\">\n <input input type=\"text\"\n id=\"first_name\"\n formControlName=\"first_name\" />\n <pw-field-error-display [displayError]=\"\n !form.get('first_name').valid && (form.get('first_name').touched || submitted)\n \"\n errorMsg=\"First name is required\">\n </pw-field-error-display>\n </div>\n </div>\n <div class=\"form-field\">\n <label for=\"last_name\">Last name:</label>\n <input type=\"text\"\n id=\"last_name\"\n formControlName=\"last_name\" />\n </div>\n <div class=\"form-field\">\n <label for=\"company\">Company:</label>\n <input type=\"text\"\n id=\"company\"\n formControlName=\"company\" />\n </div>\n <div class=\"form-field\" *ngIf=\"hasValidOptions()\">\n <label for=\"psa\" class=\"select-label\">{{question}}</label>\n <p-dropdown\n formControlName=\"psa\"\n [options]=\"psaOptions\"\n [placeholder]=\"'Select PSA'\"\n styleClass=\"input-select\">\n </p-dropdown>\n </div>\n <div class=\"form-field\">\n <label for=\"enquiry\" class=\"select-label\">How can we help you?</label>\n <div class=\"enquiry-field\">\n <textarea id=\"enquiry\" formControlName=\"enquiry\" class=\"\">\n </textarea>\n <pw-field-error-display [displayError]=\"\n !form.get('enquiry').valid && (form.get('enquiry').touched || submitted)\n \"\n errorMsg=\"Enquiry is required\">\n </pw-field-error-display>\n </div>\n </div>\n </div>\n </div>\n <div class=\"text-end\">\n <div class=\"captcha-wrapper-container\"\n *ngIf=\"isCaptchaVerified\">\n <ngx-recaptcha2 [ngModelOptions]=\"{ standalone: true }\"\n [siteKey]=\"captchaKeyV2\"\n size=\"normal\"\n [(ngModel)]=\"recaptcha\"\n (success)=\"handleSuccess($event)\">\n </ngx-recaptcha2>\n </div>\n <button type=\"submit\"\n (click)=\"onSubmit()\"\n *ngIf=\"!isCaptchaVerified\"\n class=\"sign-btn sign-header-btn mt-3\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n\n <div class=\"d-flex align-items-center mt-4\">\n <div class=\"icons d-flex align-items-center\">\n <a [eventTracker]=\"{\n category: 'youtube',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n [href]=\"youtubeUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <img src=\"/assets/img/icons/youtube.png\"\n class=\"img-fluid youtube-icon\"\n width=\"54\"\n height=\"54\"\n alt=\"\" />\n </a>\n <a [eventTracker]=\"{\n category: 'linkedin',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n [href]=\"linkedInUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n class=\"ms-3\">\n <img src=\"/assets/img/icons/social/linkedin.svg\"\n class=\"img-fluid linkedin-icon\"\n width=\"48\"\n height=\"48\"\n alt=\"\" />\n </a>\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon text-white cursor-pointer ms-3\"\n (click)=\"openSocialEditModal()\"\n (keydown.enter)=\"openSocialEditModal()\"\n (keydown.space)=\"openSocialEditModal()\"\n title=\"Edit Social Links & Company Name\"></i>\n </div>\n <div class=\"copyright text-white\">\n 2025 {{companyName}}.\n </div>\n </div>\n </form>\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n\n\n\n<ng-template #bookMeeting\n let-modal>\n <div class=\"modal-header\">\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <h3 class=\"text-center modal-basic-title\">\n Thanks for getting in touch! Our team will be in contact shortly, or we\n can compare calendars now &amp; schedule a time\n </h3>\n <button type=\"button\"\n [eventTracker]=\"{\n category: 'request-demo',\n action: 'click',\n label: 'cloudolive-landing-page-b',\n value: 1\n }\"\n (click)=\"navigateToBookMeeting()\"\n class=\"sign-btn sign-header-btn mx-auto d-block mb-3\">\n Let's do it\n </button>\n </div>\n</ng-template>\n\n\n<ng-template #editFooterLinksModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Footer Links</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Footer Links Section</h4>\n <div cdkDropList (cdkDropListDropped)=\"dropFooterLinks($event)\">\n <div *ngFor=\"let footer of editingFooterLinks.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-5 mb-2\">\n <label for=\"footerTitle{{i}}\" class=\"form-label\">Title</label>\n <input id=\"footerTitle{{i}}\" class=\"form-control\" [(ngModel)]=\"footer.title\" />\n </div>\n <div class=\"col-md-5 mb-2\">\n <label for=\"footerPath{{i}}\" class=\"form-label\">Path</label>\n <input id=\"footerPath{{i}}\" class=\"form-control\" [(ngModel)]=\"footer.path\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeFooterLink(i)\" (keydown.enter)=\"removeFooterLink(i)\" (keydown.space)=\"removeFooterLink(i)\"></i>\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n\n <!-- Subtitles -->\n <div cdkDropList (cdkDropListDropped)=\"dropSubtitles(i, $event)\">\n <div *ngFor=\"let sub of footer.subtitles; let j = index\" class=\"row border p-3 mb-2 align-items-center\" cdkDrag>\n <div class=\"col-md-5\">\n <label for=\"subtitleTitle{{i}}{{j}}\" class=\"form-label\">Subtitle Title</label>\n <input id=\"subtitleTitle{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"sub.title\" />\n </div>\n <div class=\"col-md-5\">\n <label for=\"subtitlePath{{i}}{{j}}\" class=\"form-label\">Subtitle Path</label>\n <input id=\"subtitlePath{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"sub.path\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeSubtitle(i, j)\" (keydown.enter)=\"removeSubtitle(i, j)\" (keydown.space)=\"removeSubtitle(i, j)\"></i>\n <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm mt-2\" (click)=\"addSubtitle(i)\">\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-3\" (click)=\"addFooterLink()\">\n + Add Footer Link\n </button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveFooterLinks(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n\n\n<ng-template #logoModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Logo</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <pw-custom-uploader\n [aspectRatio]=\"'fullLogo'\"\n [title]=\"'Main Contrast Logo'\"\n [controlName]=\"'logo_main_contrast'\"\n [previewData]=\"previewData\"\n (saveEvent)=\"onSaveFile($event)\">\n </pw-custom-uploader>\n </div>\n</ng-template>\n\n\n\n<ng-template #hubspotEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Hubspot Embed</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label for=\"hubspotId\" class=\"form-label\">Hubspot ID</label>\n <input id=\"hubspotId\" [(ngModel)]=\"editingHubspotId\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"hubspotEmbedDiv\" class=\"form-label\">Embed DIV</label>\n <textarea id=\"hubspotEmbedDiv\" [(ngModel)]=\"editingHubspotHtml\" rows=\"8\" class=\"form-control\"></textarea>\n </div>\n </div>\n <div class=\"modal-footer\">\n <button class=\"btn btn-primary\" (click)=\"saveHubspotHtml(modal)\">Save</button>\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n </div>\n</ng-template>\n\n\n<ng-template #socialEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Social Links & Company Name</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label for=\"youtubeUrl\" class=\"form-label\">YouTube URL</label>\n <input id=\"youtubeUrl\" [(ngModel)]=\"editingYoutubeUrl\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"linkedinUrl\" class=\"form-label\">LinkedIn URL</label>\n <input id=\"linkedinUrl\" [(ngModel)]=\"editingLinkedInUrl\" class=\"form-control\" />\n </div>\n <div class=\"mb-3\">\n <label for=\"companyName\" class=\"form-label\">Company Name</label>\n <input id=\"companyName\" [(ngModel)]=\"editingCompanyName\" class=\"form-control\" />\n </div>\n </div>\n <div class=\"modal-footer\">\n <button class=\"btn btn-primary\" (click)=\"saveSocialLinks(modal)\">Save</button>\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n </div>\n</ng-template>\n\n\n\n<ng-template #questionsEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Questions</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Questions Section</h4>\n <div cdkDropList (cdkDropListDropped)=\"dropQuestions($event)\">\n <div *ngFor=\"let q of editingQuestions; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-11 mb-2\">\n <label for=\"questionText{{i}}\" class=\"form-label\">Question</label>\n <input id=\"questionText{{i}}\" class=\"form-control\" [(ngModel)]=\"q.question\" placeholder=\"Enter question\" />\n </div>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-4\">\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n\n <!-- Options Section -->\n <div cdkDropList (cdkDropListDropped)=\"dropQuestionOptions(i, $event)\">\n <div *ngFor=\"let opt of q.options; let j = index\" class=\"row border p-3 mb-2 align-items-center\" cdkDrag>\n <div class=\"col-md-7 mb-2\">\n <label for=\"questionOption{{i}}{{j}}\" class=\"form-label\">Option</label>\n <input id=\"questionOption{{i}}{{j}}\" class=\"form-control\" [(ngModel)]=\"opt.option\" placeholder=\"Enter option\" />\n </div>\n <div class=\"col-md-2 d-flex justify-content-between align-items-center mt-4\">\n <i class=\"fa fa-trash in-page-trash-icon text-danger cursor-pointer\" (click)=\"removeQuestionOption(i, j)\" (keydown.enter)=\"removeQuestionOption(i, j)\" (keydown.enter)=\"removeQuestionOption(i, j)\"></i>\n <i class=\"fa fa-bars in-page-bars-icon cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm mt-2\" (click)=\"addQuestionOption(i)\">+ Add Option</button>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-3\" (click)=\"addNewQuestion()\">+ Add Question</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveQuestions(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n", styles: [".product-explainer-section{background-color:#000}.footer-section{min-height:500px}@media (min-width: 768px){.footer-section{min-height:600px}}.footer-section .container{transition:opacity .3s ease,visibility .3s ease}.footer-section input.form-control,.footer-section select.form-control,.footer-section textarea.form-control{background-color:#fff;border:none;color:#000;font-size:14px}.btn-primary{background-color:#007bff;border:none}.site-column{margin-top:2.9rem}.email-section{color:#fff;font-size:2rem}.address-section{margin-top:5rem}.address-text{line-height:2.2rem}.user-info{font-size:1.5rem}.user-info-label{font-size:1.7rem;font-weight:700}.contact-form form .form-field{display:flex;align-items:center;margin-bottom:1.2rem}.contact-form form .form-field label{width:130px;min-width:130px;margin:0;font-size:14px;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:1px}.contact-form form .form-field p-dropdown{width:100%}.contact-form form .form-field input,.contact-form form .form-field select,.contact-form form .form-field textarea,.contact-form form .form-field ::ng-deep p-dropdown .p-inputwrapper{flex:1;border:none;border-radius:30px;padding:12px 20px;font-size:14px;width:100%!important;max-width:100%;color:#000}.contact-form form .form-field textarea{resize:vertical}.contact-form form .submit-button{background-color:#3b82f6;border:none;border-radius:30px;font-size:16px;font-weight:500;padding:10px 24px;margin-top:1.2rem}.input-select{height:43px}.select-label{width:210px!important}.copyright{margin-top:2rem;margin-left:4rem;font-size:19px;font-weight:700}.d-flex img{margin-right:0!important}.youtube-icon{height:38px}.enquiry-field{margin-left:.5rem;width:63%}::ng-deep .text-danger{margin-top:.25rem!important;margin-left:.5rem!important}.hubspot-container{min-height:400px;transition:opacity .3s ease}.hubspot-container:not(.content-loaded){opacity:0;pointer-events:none}.hubspot-container.content-loaded{opacity:1}@media (min-width: 768px){.hubspot-container{margin-top:-3rem}}@media (min-width: 768px) and (max-width: 1200px){.container{padding:0rem 6rem!important}}.link-label{cursor:pointer;transition:color .3s}.link-label:hover{color:var(--first)}.icons img{transition:transform .3s ease,filter .3s ease;cursor:pointer}.icons img:hover{transform:scale(1.1);filter:brightness(1.2)}.logo-image{max-width:160px;width:160px;height:35px;object-fit:contain;aspect-ratio:160/35}\n"] }]
524
524
  }], ctorParameters: () => [{ type: i1.UntypedFormBuilder }, { type: i2.AuthService }, { type: i3.CrmService }, { type: i4.DomSanitizer }, { type: i5.AdminService }, { type: i0.Injector }, { type: i2.AbTestService }, { type: i6.NgbModal }, { type: i0.ChangeDetectorRef }, { type: Document, decorators: [{
525
525
  type: Inject,
526
526
  args: [DOCUMENT]
@@ -567,8 +567,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
567
567
  }] } });
568
568
 
569
569
  class Trial4SharedContactUsModule {
570
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: Trial4SharedContactUsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
571
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.11", ngImport: i0, type: Trial4SharedContactUsModule, declarations: [Trial4ContactUsComponent], imports: [CommonModule,
570
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: Trial4SharedContactUsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
571
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: Trial4SharedContactUsModule, declarations: [Trial4ContactUsComponent], imports: [CommonModule,
572
572
  FieldErrorDisplayModule,
573
573
  DropdownModule,
574
574
  ReactiveFormsModule,
@@ -590,7 +590,7 @@ class Trial4SharedContactUsModule {
590
590
  CoreTranslocoModule,
591
591
  AdminModuleUtilsModule,
592
592
  DirectivesModule] }); }
593
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: Trial4SharedContactUsModule, imports: [CommonModule,
593
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: Trial4SharedContactUsModule, imports: [CommonModule,
594
594
  FieldErrorDisplayModule,
595
595
  DropdownModule,
596
596
  ReactiveFormsModule,
@@ -612,7 +612,7 @@ class Trial4SharedContactUsModule {
612
612
  AdminModuleUtilsModule,
613
613
  DirectivesModule] }); }
614
614
  }
615
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: Trial4SharedContactUsModule, decorators: [{
615
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: Trial4SharedContactUsModule, decorators: [{
616
616
  type: NgModule,
617
617
  args: [{
618
618
  declarations: [Trial4ContactUsComponent],
@@ -719,12 +719,12 @@ class DemoCardsComponent extends AppBaseComponent {
719
719
  canEditResources() {
720
720
  return this.canEditResourcesValue;
721
721
  }
722
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DemoCardsComponent, deps: [{ token: i4.DomSanitizer }, { token: i6.NgbModal }, { token: i5.AdminService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
723
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: DemoCardsComponent, selector: "pw-demo-card", inputs: { user: "user", userLoggedIn: "userLoggedIn" }, viewQueries: [{ propertyName: "editBookLinksModal", first: true, predicate: ["editBookLinksModal"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- EDIT ICON -->\n\n<!-- DEMO LINKS -->\n<div class=\"row text-center\">\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon mb-3 cursor-pointer\"\n title=\"Edit Booking Links\"\n (click)=\"openEditBookLinks(editBookLinksModal)\"\n (keydown.enter)=\"openEditBookLinks(editBookLinksModal)\"\n (keydown.space)=\"openEditBookLinks(editBookLinksModal)\">\n </i>\n <div class=\"col-md-6 col-lg-4\" *ngFor=\"let link of bookingLinks\">\n <h5 class=\"mb-3\" *ngIf=\"link?.url && link?.title\">{{ link?.title }}</h5>\n <iframe *ngIf=\"link?.url\"\n [src]=\"link?.url\"\n width=\"100%\"\n title=\"Booking frame\"\n height=\"600\"\n class=\"iframe-no-border\">\n </iframe>\n </div>\n</div>\n\n<!-- MODAL TEMPLATE -->\n<ng-template #editBookLinksModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Book Demo Links</h5>\n <button type=\"button\" class=\"btn-close\" (click)=\"modal.dismiss()\" aria-label=\"Close\"></button>\n </div>\n\n <div class=\"modal-body\">\n <div cdkDropList (cdkDropListDropped)=\"dropBookingLink($event)\">\n <div *ngFor=\"let item of editingBookingLinks; let i = index\" class=\"card p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-5\">\n <label for=\"demoLinkTitle{{i}}\" class=\"form-label\">Link Title</label>\n <input id=\"demoLinkTitle{{i}}\" class=\"form-control\" [(ngModel)]=\"item.title\" />\n </div>\n <div class=\"col-md-5\">\n <label for=\"demoLinkUrl{{i}}\" class=\"form-label\">Link URL</label>\n <input id=\"demoLinkUrl{{i}}\" class=\"form-control\" [(ngModel)]=\"item.url\" />\n </div>\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removeBookDemoLink(i)\"\n (keydown.enter)=\"removeBookDemoLink(i)\"\n (keydown.space)=\"removeBookDemoLink(i)\"\n class=\"fa fa-trash in-page-trash-icon delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars in-page-bars-icon cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary mt-3\" (click)=\"addBookingLink()\">\n <i class=\"fa fa-plus me-1\"></i> Add Book Demo Link\n </button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveBookingLinks(modal)\">Save</button>\n </div>\n</ng-template>\n", styles: [".iframe-no-border{border:0}\n"], dependencies: [{ kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i6$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i6$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }] }); }
722
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DemoCardsComponent, deps: [{ token: i4.DomSanitizer }, { token: i6.NgbModal }, { token: i5.AdminService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
723
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: DemoCardsComponent, isStandalone: false, selector: "pw-demo-card", inputs: { user: "user", userLoggedIn: "userLoggedIn" }, viewQueries: [{ propertyName: "editBookLinksModal", first: true, predicate: ["editBookLinksModal"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- EDIT ICON -->\n\n<!-- DEMO LINKS -->\n<div class=\"row text-center\">\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon mb-3 cursor-pointer\"\n title=\"Edit Booking Links\"\n (click)=\"openEditBookLinks(editBookLinksModal)\"\n (keydown.enter)=\"openEditBookLinks(editBookLinksModal)\"\n (keydown.space)=\"openEditBookLinks(editBookLinksModal)\">\n </i>\n <div class=\"col-md-6 col-lg-4\" *ngFor=\"let link of bookingLinks\">\n <h5 class=\"mb-3\" *ngIf=\"link?.url && link?.title\">{{ link?.title }}</h5>\n <iframe *ngIf=\"link?.url\"\n [src]=\"link?.url\"\n width=\"100%\"\n title=\"Booking frame\"\n height=\"600\"\n class=\"iframe-no-border\">\n </iframe>\n </div>\n</div>\n\n<!-- MODAL TEMPLATE -->\n<ng-template #editBookLinksModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Book Demo Links</h5>\n <button type=\"button\" class=\"btn-close\" (click)=\"modal.dismiss()\" aria-label=\"Close\"></button>\n </div>\n\n <div class=\"modal-body\">\n <div cdkDropList (cdkDropListDropped)=\"dropBookingLink($event)\">\n <div *ngFor=\"let item of editingBookingLinks; let i = index\" class=\"card p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-5\">\n <label for=\"demoLinkTitle{{i}}\" class=\"form-label\">Link Title</label>\n <input id=\"demoLinkTitle{{i}}\" class=\"form-control\" [(ngModel)]=\"item.title\" />\n </div>\n <div class=\"col-md-5\">\n <label for=\"demoLinkUrl{{i}}\" class=\"form-label\">Link URL</label>\n <input id=\"demoLinkUrl{{i}}\" class=\"form-control\" [(ngModel)]=\"item.url\" />\n </div>\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removeBookDemoLink(i)\"\n (keydown.enter)=\"removeBookDemoLink(i)\"\n (keydown.space)=\"removeBookDemoLink(i)\"\n class=\"fa fa-trash in-page-trash-icon delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars in-page-bars-icon cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary mt-3\" (click)=\"addBookingLink()\">\n <i class=\"fa fa-plus me-1\"></i> Add Book Demo Link\n </button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveBookingLinks(modal)\">Save</button>\n </div>\n</ng-template>\n", styles: [".iframe-no-border{border:0}\n"], dependencies: [{ kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i6$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i6$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }] }); }
724
724
  }
725
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DemoCardsComponent, decorators: [{
725
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DemoCardsComponent, decorators: [{
726
726
  type: Component,
727
- args: [{ selector: 'pw-demo-card', template: "<!-- EDIT ICON -->\n\n<!-- DEMO LINKS -->\n<div class=\"row text-center\">\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon mb-3 cursor-pointer\"\n title=\"Edit Booking Links\"\n (click)=\"openEditBookLinks(editBookLinksModal)\"\n (keydown.enter)=\"openEditBookLinks(editBookLinksModal)\"\n (keydown.space)=\"openEditBookLinks(editBookLinksModal)\">\n </i>\n <div class=\"col-md-6 col-lg-4\" *ngFor=\"let link of bookingLinks\">\n <h5 class=\"mb-3\" *ngIf=\"link?.url && link?.title\">{{ link?.title }}</h5>\n <iframe *ngIf=\"link?.url\"\n [src]=\"link?.url\"\n width=\"100%\"\n title=\"Booking frame\"\n height=\"600\"\n class=\"iframe-no-border\">\n </iframe>\n </div>\n</div>\n\n<!-- MODAL TEMPLATE -->\n<ng-template #editBookLinksModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Book Demo Links</h5>\n <button type=\"button\" class=\"btn-close\" (click)=\"modal.dismiss()\" aria-label=\"Close\"></button>\n </div>\n\n <div class=\"modal-body\">\n <div cdkDropList (cdkDropListDropped)=\"dropBookingLink($event)\">\n <div *ngFor=\"let item of editingBookingLinks; let i = index\" class=\"card p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-5\">\n <label for=\"demoLinkTitle{{i}}\" class=\"form-label\">Link Title</label>\n <input id=\"demoLinkTitle{{i}}\" class=\"form-control\" [(ngModel)]=\"item.title\" />\n </div>\n <div class=\"col-md-5\">\n <label for=\"demoLinkUrl{{i}}\" class=\"form-label\">Link URL</label>\n <input id=\"demoLinkUrl{{i}}\" class=\"form-control\" [(ngModel)]=\"item.url\" />\n </div>\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removeBookDemoLink(i)\"\n (keydown.enter)=\"removeBookDemoLink(i)\"\n (keydown.space)=\"removeBookDemoLink(i)\"\n class=\"fa fa-trash in-page-trash-icon delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars in-page-bars-icon cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary mt-3\" (click)=\"addBookingLink()\">\n <i class=\"fa fa-plus me-1\"></i> Add Book Demo Link\n </button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveBookingLinks(modal)\">Save</button>\n </div>\n</ng-template>\n", styles: [".iframe-no-border{border:0}\n"] }]
727
+ args: [{ selector: 'pw-demo-card', standalone: false, template: "<!-- EDIT ICON -->\n\n<!-- DEMO LINKS -->\n<div class=\"row text-center\">\n <i *ngIf=\"canEditResourcesValue\"\n class=\"fa fa-edit in-page-edit-icon mb-3 cursor-pointer\"\n title=\"Edit Booking Links\"\n (click)=\"openEditBookLinks(editBookLinksModal)\"\n (keydown.enter)=\"openEditBookLinks(editBookLinksModal)\"\n (keydown.space)=\"openEditBookLinks(editBookLinksModal)\">\n </i>\n <div class=\"col-md-6 col-lg-4\" *ngFor=\"let link of bookingLinks\">\n <h5 class=\"mb-3\" *ngIf=\"link?.url && link?.title\">{{ link?.title }}</h5>\n <iframe *ngIf=\"link?.url\"\n [src]=\"link?.url\"\n width=\"100%\"\n title=\"Booking frame\"\n height=\"600\"\n class=\"iframe-no-border\">\n </iframe>\n </div>\n</div>\n\n<!-- MODAL TEMPLATE -->\n<ng-template #editBookLinksModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Book Demo Links</h5>\n <button type=\"button\" class=\"btn-close\" (click)=\"modal.dismiss()\" aria-label=\"Close\"></button>\n </div>\n\n <div class=\"modal-body\">\n <div cdkDropList (cdkDropListDropped)=\"dropBookingLink($event)\">\n <div *ngFor=\"let item of editingBookingLinks; let i = index\" class=\"card p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-5\">\n <label for=\"demoLinkTitle{{i}}\" class=\"form-label\">Link Title</label>\n <input id=\"demoLinkTitle{{i}}\" class=\"form-control\" [(ngModel)]=\"item.title\" />\n </div>\n <div class=\"col-md-5\">\n <label for=\"demoLinkUrl{{i}}\" class=\"form-label\">Link URL</label>\n <input id=\"demoLinkUrl{{i}}\" class=\"form-control\" [(ngModel)]=\"item.url\" />\n </div>\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removeBookDemoLink(i)\"\n (keydown.enter)=\"removeBookDemoLink(i)\"\n (keydown.space)=\"removeBookDemoLink(i)\"\n class=\"fa fa-trash in-page-trash-icon delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars in-page-bars-icon cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary mt-3\" (click)=\"addBookingLink()\">\n <i class=\"fa fa-plus me-1\"></i> Add Book Demo Link\n </button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveBookingLinks(modal)\">Save</button>\n </div>\n</ng-template>\n", styles: [".iframe-no-border{border:0}\n"] }]
728
728
  }], ctorParameters: () => [{ type: i4.DomSanitizer }, { type: i6.NgbModal }, { type: i5.AdminService }, { type: i0.Injector }], propDecorators: { user: [{
729
729
  type: Input
730
730
  }], userLoggedIn: [{
@@ -735,15 +735,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
735
735
  }] } });
736
736
 
737
737
  class DemoCardsModule {
738
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DemoCardsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
739
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.11", ngImport: i0, type: DemoCardsModule, declarations: [DemoCardsComponent], imports: [CommonModule,
738
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DemoCardsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
739
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: DemoCardsModule, declarations: [DemoCardsComponent], imports: [CommonModule,
740
740
  FormsModule,
741
741
  DragDropModule,
742
742
  NgbModalModule,
743
743
  DirectivesModule,
744
744
  PipesModule,
745
745
  AdminModuleUtilsModule], exports: [DemoCardsComponent] }); }
746
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DemoCardsModule, imports: [CommonModule,
746
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DemoCardsModule, imports: [CommonModule,
747
747
  FormsModule,
748
748
  DragDropModule,
749
749
  NgbModalModule,
@@ -751,7 +751,7 @@ class DemoCardsModule {
751
751
  PipesModule,
752
752
  AdminModuleUtilsModule] }); }
753
753
  }
754
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DemoCardsModule, decorators: [{
754
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DemoCardsModule, decorators: [{
755
755
  type: NgModule,
756
756
  args: [{
757
757
  declarations: [DemoCardsComponent],