ctt-puro 0.46.15 → 0.46.17

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 (9) hide show
  1. package/esm2022/lib/components/puro-careers-form/puro-careers-form.component.mjs +3 -3
  2. package/esm2022/lib/components/puro-dual-list/puro-dual-list.component.mjs +3 -3
  3. package/esm2022/lib/components/puro-projects-form/puro-projects-form.component.mjs +3 -3
  4. package/esm2022/lib/components/puro-slider-4items/puro-slider-4items.component.mjs +18 -5
  5. package/esm2022/lib/services/mapper/mapper.service.mjs +2 -2
  6. package/fesm2022/ctt-puro.mjs +24 -11
  7. package/fesm2022/ctt-puro.mjs.map +1 -1
  8. package/lib/components/puro-slider-4items/puro-slider-4items.component.d.ts +7 -2
  9. package/package.json +1 -1
package/fesm2022/ctt-puro.mjs CHANGED
@@ -1949,7 +1949,7 @@ class PuroCareersFormComponent {
1949
1949
  }
1950
1950
  }
1951
1951
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroCareersFormComponent, deps: [{ token: i1$3.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1952
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroCareersFormComponent, isStandalone: true, selector: "lib-puro-careers-form", inputs: { title: "title", description: "description", ydTitle: "ydTitle", wlDropdown: "wlDropdown", wpDropdown: "wpDropdown", aoDropdown: "aoDropdown", wlangDropdown: "wlangDropdown", hdDropdown: "hdDropdown", wwTextarea: "wwTextarea", odTitle: "odTitle", nameInput: "nameInput", surnameInput: "surnameInput", prefix: "prefix", phoneInput: "phoneInput", emailInput: "emailInput", confirmEmailInput: "confirmEmailInput", filesInput: "filesInput", cvInput: "cvInput", others: "others", requiredLabel: "requiredLabel", img: "img", conditionsLink: "conditionsLink", applyButton: "applyButton", seeAllButton: "seeAllButton", tags: "tags", textColors: "textColors" }, outputs: { submitFormValue: "submitFormValue" }, ngImport: i0, template: "<section class=\"careersForm generalMargin\">\n <div class=\"careersForm__inner\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"careersForm__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n <div class=\"careersForm__graphic\">\n <div class=\"careersForm__graphicInner\">\n @if (img) {\n <img\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"467\"\n height=\"551\"\n class=\"careersForm__graphicInner--img\"\n priority\n />\n }\n </div>\n </div>\n <div class=\"careersForm__content\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"careersForm__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (description) {\n <div class=\"careersForm__paragraph\">\n {{ description }}\n </div>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"careersForm__section\">\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wlDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wlDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wlDropdown.placeholder }}\n </option>\n @for (\n option of wlDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wpDropdown.placeholder }}\n </option>\n @for (\n option of wpDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (aoDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"aoDropdown\"\n >\n @if (aoDropdown.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ aoDropdown.placeholder }}\n </option>\n }\n @for (\n option of aoDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"careersForm__section\">\n <div class=\"form__group\">\n @if (ydTitle) {\n <span\n class=\"careersForm__section--title form__group\"\n >\n {{ ydTitle }}\n </span>\n }\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (nameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"name\"\n id=\"Name\"\n [placeholder]=\"\n nameInput.placeholder\n \"\n [formControlName]=\"nameInput.name!\"\n (blur)=\"validateInput(nameInput)\"\n (input)=\"\n inputChange($event, nameInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!nameInput.valid()) {\n <span class=\"form-error\">{{\n nameInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"careersForm__col\">\n @if (surnameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"surname\"\n id=\"surname\"\n [placeholder]=\"\n surnameInput.placeholder\n \"\n [formControlName]=\"\n surnameInput.name!\n \"\n (blur)=\"validateInput(surnameInput)\"\n (input)=\"\n inputChange(\n $event,\n surnameInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!surnameInput.valid()) {\n <span class=\"form-error\">{{\n surnameInput.error\n }}</span>\n }\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (prefix) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n name=\"prefix\"\n formControlName=\"prefix\"\n >\n @if (prefix.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ prefix.placeholder }}\n </option>\n }\n @for (\n item of prefix.options || [];\n track $index\n ) {\n <option [value]=\"item.code\">\n {{ item.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n <div class=\"careersForm__col\">\n @if (phoneInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"phone\"\n id=\"phone\"\n [placeholder]=\"\n phoneInput.placeholder\n \"\n (blur)=\"validateInput(phoneInput)\"\n (input)=\"\n inputChange($event, phoneInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#phone\"></use>\n </svg>\n </span>\n </div>\n @if (!phoneInput.valid()) {\n <span class=\"form-error\">{{\n phoneInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (emailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"email\"\n [placeholder]=\"\n emailInput.placeholder\n \"\n (blur)=\"validateInput(emailInput)\"\n (input)=\"\n inputChange($event, emailInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (!emailInput.valid()) {\n <span class=\"form-error\">{{\n emailInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"careersForm__col\">\n @if (confirmEmailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"confirmEmail\"\n [placeholder]=\"\n confirmEmailInput.placeholder\n \"\n (blur)=\"\n validateInput(confirmEmailInput)\n \"\n (input)=\"\n inputChange(\n $event,\n confirmEmailInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (\n confirmEmailInput &&\n !confirmEmailInput.valid()\n ) {\n <span class=\"form-error\">{{\n confirmEmailInput.error\n }}</span>\n }\n }\n </div>\n </div>\n @if (\n confirmEmailInput &&\n form.hasError('emailsDontMatch') &&\n form.get(confirmEmailInput.name!)?.touched\n ) {\n <span class=\"form-error\"\n >Los emails no coinciden.</span\n >\n }\n </div>\n\n <div class=\"careersForm__section\">\n <div class=\"form__group\">\n @if (odTitle) {\n <span\n class=\"careersForm__section--title form__group\"\n >\n {{ odTitle }}\n </span>\n }\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wlangDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wlangDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wlangDropdown.placeholder }}\n </option>\n @for (\n option of wlangDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (hdDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"hdDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ hdDropdown.placeholder }}\n </option>\n @for (\n option of hdDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n <div class=\"careersForm__file-group\">\n @if (cvInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"cvinput\"\n id=\"cvinput\"\n [placeholder]=\"cvInput.label\"\n (input)=\"\n inputChange($event, cvInput)\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!cvInput.valid()) {\n <span class=\"form-error\">{{\n cvInput.error\n }}</span>\n }\n }\n @if (\n cvInputNames && cvInputNames.length > 0\n ) {\n <div>\n @for (\n name of cvInputNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__col\">\n <div class=\"careersForm__file-group\">\n @if (filesInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"filesinput\"\n id=\"filesinput\"\n multiple\n [placeholder]=\"filesInput.label\"\n (input)=\"\n inputChange(\n $event,\n filesInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!filesInput.valid()) {\n <span class=\"form-error\">{{\n filesInput.error\n }}</span>\n }\n }\n @if (filesInputNames) {\n <div>\n @for (\n name of filesInputNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"eventsForm__row\">\n <div class=\"eventsForm__col\">\n @if (wwTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n wwTextarea.placeholder\n \"\n [formControlName]=\"wwTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n <div class=\"block-checkbox\">\n @if (requiredLabel) {\n <span class=\"required-label\">{{\n requiredLabel\n }}</span>\n }\n @if (conditionsLink) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n checked\n class=\"checkbox\"\n formControlName=\"conditions\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span [innerHTML]=\"conditionsLink\">\n </span>\n </label>\n }\n @if (others) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n class=\"checkbox\"\n formControlName=\"others\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span>{{ others }}</span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (applyButton) {\n <button\n type=\"submit\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"applyButton.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm()\"\n >\n <span>{{ applyButton.label }}</span>\n </button>\n }\n <!-- @if (seeAllButton) {\n <a\n class=\"btn btn__primary--outline js-active-modal\"\n [attr.aria-label]=\"seeAllButton.label\"\n [attr.href]=\"seeAllButton.url\"\n >\n <span>{{ seeAllButton.label }}</span>\n </a>\n } -->\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [".careersForm__inner{display:flex;flex-direction:column;row-gap:3.125rem;margin-inline:auto}@media (min-width: 1024px){.careersForm__inner{column-gap:4rem;flex-direction:row}}@media (min-width: 1280px){.careersForm__inner{column-gap:8.269rem}}@media (min-width: 1680px){.careersForm__inner{column-gap:16.689rem;max-width:189.933rem}}.careersForm__graphic{width:46.72rem;max-width:85%;position:relative}@media (min-width: 1024px){.careersForm__graphic{order:2;max-width:45%}}@media (min-width: 1680px){.careersForm__graphic{width:90.5rem}}@media (max-width: 1023.98px){.careersForm__graphic{margin-inline:auto}}.careersForm__graphicInner{width:100%;aspect-ratio:467.2/550.83}@media (min-width: 1024px){.careersForm__graphicInner{position:sticky;top:17rem;max-height:calc(100svh - 17rem)}}@media (min-width: 1680px){.careersForm__graphicInner{aspect-ratio:905/1067}}.careersForm__graphicInner--img{width:100%;height:100%;object-fit:cover}.careersForm__section--title{text-transform:uppercase;padding-inline:2rem;color:var(--reservar-filter-bg);display:block;font-size:1.6rem;line-height:1.364625;letter-spacing:.16rem}@media (min-width: 768px){.careersForm__section--title{font-size:1.8rem;line-height:1.3477777778;letter-spacing:.18rem}}@media (min-width: 1024px){.careersForm__content{order:1;flex:1 1 0%}}.careersForm__content .btn__group{margin-top:4rem;justify-content:center}.careersForm__content .careersForm__title{display:none;font-size:1.4rem;line-height:1.7;letter-spacing:.06rem}@media (min-width: 768px){.careersForm__content .careersForm__title{font-size:1.6rem;line-height:1.7;letter-spacing:.072rem}}@media (min-width: 1280px){.careersForm__content .careersForm__title{font-size:3rem;line-height:1.02;letter-spacing:.09rem}}@media (min-width: 1024px){.careersForm__content .careersForm__title{display:block;text-align:start}}.careersForm__content .careersForm__paragraph{color:var(--cl-text-dark);min-height:7.6rem;text-align:start;margin-bottom:3rem;padding-inline:2rem;font-size:1.6rem;line-height:1.4875;letter-spacing:.048rem}@media (min-width: 768px){.careersForm__content .careersForm__paragraph{font-size:1.8rem;line-height:1.5111111111;letter-spacing:.054rem}}@media (min-width: 1280px){.careersForm__content .careersForm__paragraph{text-align:start;font-size:2rem;line-height:1.53;letter-spacing:.06rem}}.careersForm__content .careersForm__row{display:flex;flex-wrap:wrap;margin:0 -.75rem}@media (min-width: 768px){.careersForm__content .careersForm__row{margin:0 -1.5rem}}@media (min-width: 1280px){.careersForm__content .careersForm__row{margin:0 -2.1rem}}.careersForm__content .careersForm__row .btn__link:not(:hover):after{background:var(--bg-primary)}.careersForm__content .careersForm__col{flex:1 0 100%;width:100%;max-width:100%;padding-inline:.75rem}@media (min-width: 768px){.careersForm__content .careersForm__col{flex:1 0 0%;padding-inline:1.5rem}}@media (min-width: 1280px){.careersForm__content .careersForm__col{padding-inline:2.1rem}}.careersForm__content .careersForm__col .block-checkbox{display:flex;flex-direction:column;row-gap:1rem}.careersForm__content .careersForm__file-group{display:flex;flex-direction:column}.careersForm__content .careersForm__file-group .form__group~div{display:flex;flex-direction:column;row-gap:.5rem;margin-bottom:1rem}.careersForm__placeholder span{color:#1e1e1e;opacity:.6}.careersForm .form-error{color:var(--grey);z-index:1}.careersForm .icon-right i{font-size:2rem}.careersForm .file-name{text-overflow:ellipsis;color:var(--grey);font-size:1.4rem;line-height:1.9428571429;letter-spacing:.042rem}@media (min-width: 768px){.careersForm .file-name{font-size:1.6rem;line-height:1.51625;letter-spacing:.16rem}}input[type=file]{background-color:#fff;line-height:3.2}input[type=file]::-webkit-file-upload-button{visibility:hidden}input[type=file]:before{content:attr(placeholder);background:#fff;color:#1e1e1e;opacity:.6;display:inline-block;cursor:pointer;width:100%;overflow-x:hidden}:host ::ng-deep .careersForm__title{margin-bottom:2rem;display:block;text-align:center;text-transform:uppercase;color:#1e1e1e;opacity:.8;padding-inline:2rem;font-size:1.8rem;line-height:1.213;letter-spacing:.18rem}@media (min-width: 768px){:host ::ng-deep .careersForm__title{font-size:2rem;line-height:1.213;letter-spacing:.2rem}}@media (min-width: 1024px){:host ::ng-deep .careersForm__title{margin-bottom:3rem;display:none;text-align:start}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: PuroDynamicHeadingComponent, selector: "lib-puro-dynamic-heading", inputs: ["tag", "wrapper", "cssClass", "content", "color"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: AutoImageZoomWrapperDirective, selector: "img[ngSrc], img[src]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1952
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroCareersFormComponent, isStandalone: true, selector: "lib-puro-careers-form", inputs: { title: "title", description: "description", ydTitle: "ydTitle", wlDropdown: "wlDropdown", wpDropdown: "wpDropdown", aoDropdown: "aoDropdown", wlangDropdown: "wlangDropdown", hdDropdown: "hdDropdown", wwTextarea: "wwTextarea", odTitle: "odTitle", nameInput: "nameInput", surnameInput: "surnameInput", prefix: "prefix", phoneInput: "phoneInput", emailInput: "emailInput", confirmEmailInput: "confirmEmailInput", filesInput: "filesInput", cvInput: "cvInput", others: "others", requiredLabel: "requiredLabel", img: "img", conditionsLink: "conditionsLink", applyButton: "applyButton", seeAllButton: "seeAllButton", tags: "tags", textColors: "textColors" }, outputs: { submitFormValue: "submitFormValue" }, ngImport: i0, template: "<section class=\"careersForm generalMargin\">\n <div class=\"careersForm__inner\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"careersForm__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n <div class=\"careersForm__graphic\">\n <div class=\"careersForm__graphicInner\">\n @if (img) {\n <img\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"467\"\n height=\"551\"\n class=\"careersForm__graphicInner--img\"\n priority\n />\n }\n </div>\n </div>\n <div class=\"careersForm__content\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"careersForm__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (description) {\n <div class=\"careersForm__paragraph\">\n {{ description }}\n </div>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"careersForm__section\">\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wlDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wlDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wlDropdown.placeholder }}\n </option>\n @for (\n option of wlDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wpDropdown.placeholder }}\n </option>\n @for (\n option of wpDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (aoDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"aoDropdown\"\n >\n @if (aoDropdown.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ aoDropdown.placeholder }}\n </option>\n }\n @for (\n option of aoDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"careersForm__section\">\n <div class=\"form__group\">\n @if (ydTitle) {\n <span\n class=\"careersForm__section--title form__group __subHeading\"\n >\n {{ ydTitle }}\n </span>\n }\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (nameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"name\"\n id=\"Name\"\n [placeholder]=\"\n nameInput.placeholder\n \"\n [formControlName]=\"nameInput.name!\"\n (blur)=\"validateInput(nameInput)\"\n (input)=\"\n inputChange($event, nameInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!nameInput.valid()) {\n <span class=\"form-error\">{{\n nameInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"careersForm__col\">\n @if (surnameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"surname\"\n id=\"surname\"\n [placeholder]=\"\n surnameInput.placeholder\n \"\n [formControlName]=\"\n surnameInput.name!\n \"\n (blur)=\"validateInput(surnameInput)\"\n (input)=\"\n inputChange(\n $event,\n surnameInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!surnameInput.valid()) {\n <span class=\"form-error\">{{\n surnameInput.error\n }}</span>\n }\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (prefix) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n name=\"prefix\"\n formControlName=\"prefix\"\n >\n @if (prefix.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ prefix.placeholder }}\n </option>\n }\n @for (\n item of prefix.options || [];\n track $index\n ) {\n <option [value]=\"item.code\">\n {{ item.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n <div class=\"careersForm__col\">\n @if (phoneInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"phone\"\n id=\"phone\"\n [placeholder]=\"\n phoneInput.placeholder\n \"\n (blur)=\"validateInput(phoneInput)\"\n (input)=\"\n inputChange($event, phoneInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#phone\"></use>\n </svg>\n </span>\n </div>\n @if (!phoneInput.valid()) {\n <span class=\"form-error\">{{\n phoneInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (emailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"email\"\n [placeholder]=\"\n emailInput.placeholder\n \"\n (blur)=\"validateInput(emailInput)\"\n (input)=\"\n inputChange($event, emailInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (!emailInput.valid()) {\n <span class=\"form-error\">{{\n emailInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"careersForm__col\">\n @if (confirmEmailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"confirmEmail\"\n [placeholder]=\"\n confirmEmailInput.placeholder\n \"\n (blur)=\"\n validateInput(confirmEmailInput)\n \"\n (input)=\"\n inputChange(\n $event,\n confirmEmailInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (\n confirmEmailInput &&\n !confirmEmailInput.valid()\n ) {\n <span class=\"form-error\">{{\n confirmEmailInput.error\n }}</span>\n }\n }\n </div>\n </div>\n @if (\n confirmEmailInput &&\n form.hasError('emailsDontMatch') &&\n form.get(confirmEmailInput.name!)?.touched\n ) {\n <span class=\"form-error\"\n >Los emails no coinciden.</span\n >\n }\n </div>\n\n <div class=\"careersForm__section\">\n <div class=\"form__group\">\n @if (odTitle) {\n <span\n class=\"careersForm__section--title form__group __subHeading\"\n >\n {{ odTitle }}\n </span>\n }\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wlangDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wlangDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wlangDropdown.placeholder }}\n </option>\n @for (\n option of wlangDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (hdDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"hdDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ hdDropdown.placeholder }}\n </option>\n @for (\n option of hdDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n <div class=\"careersForm__file-group\">\n @if (cvInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"cvinput\"\n id=\"cvinput\"\n [placeholder]=\"cvInput.label\"\n (input)=\"\n inputChange($event, cvInput)\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!cvInput.valid()) {\n <span class=\"form-error\">{{\n cvInput.error\n }}</span>\n }\n }\n @if (\n cvInputNames && cvInputNames.length > 0\n ) {\n <div>\n @for (\n name of cvInputNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__col\">\n <div class=\"careersForm__file-group\">\n @if (filesInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"filesinput\"\n id=\"filesinput\"\n multiple\n [placeholder]=\"filesInput.label\"\n (input)=\"\n inputChange(\n $event,\n filesInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!filesInput.valid()) {\n <span class=\"form-error\">{{\n filesInput.error\n }}</span>\n }\n }\n @if (filesInputNames) {\n <div>\n @for (\n name of filesInputNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"eventsForm__row\">\n <div class=\"eventsForm__col\">\n @if (wwTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n wwTextarea.placeholder\n \"\n [formControlName]=\"wwTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n <div class=\"block-checkbox\">\n @if (requiredLabel) {\n <span class=\"required-label\">{{\n requiredLabel\n }}</span>\n }\n @if (conditionsLink) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n checked\n class=\"checkbox\"\n formControlName=\"conditions\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span [innerHTML]=\"conditionsLink\">\n </span>\n </label>\n }\n @if (others) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n class=\"checkbox\"\n formControlName=\"others\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span>{{ others }}</span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (applyButton) {\n <button\n type=\"submit\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"applyButton.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm()\"\n >\n <span>{{ applyButton.label }}</span>\n </button>\n }\n <!-- @if (seeAllButton) {\n <a\n class=\"btn btn__primary--outline js-active-modal\"\n [attr.aria-label]=\"seeAllButton.label\"\n [attr.href]=\"seeAllButton.url\"\n >\n <span>{{ seeAllButton.label }}</span>\n </a>\n } -->\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: PuroDynamicHeadingComponent, selector: "lib-puro-dynamic-heading", inputs: ["tag", "wrapper", "cssClass", "content", "color"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: AutoImageZoomWrapperDirective, selector: "img[ngSrc], img[src]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1953
1953
  }
1954
1954
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroCareersFormComponent, decorators: [{
1955
1955
  type: Component,
@@ -1960,7 +1960,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
1960
1960
  PuroDynamicHeadingComponent,
1961
1961
  NgOptimizedImage,
1962
1962
  AutoImageZoomWrapperDirective,
1963
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"careersForm generalMargin\">\n <div class=\"careersForm__inner\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"careersForm__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n <div class=\"careersForm__graphic\">\n <div class=\"careersForm__graphicInner\">\n @if (img) {\n <img\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"467\"\n height=\"551\"\n class=\"careersForm__graphicInner--img\"\n priority\n />\n }\n </div>\n </div>\n <div class=\"careersForm__content\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"careersForm__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (description) {\n <div class=\"careersForm__paragraph\">\n {{ description }}\n </div>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"careersForm__section\">\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wlDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wlDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wlDropdown.placeholder }}\n </option>\n @for (\n option of wlDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wpDropdown.placeholder }}\n </option>\n @for (\n option of wpDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (aoDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"aoDropdown\"\n >\n @if (aoDropdown.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ aoDropdown.placeholder }}\n </option>\n }\n @for (\n option of aoDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"careersForm__section\">\n <div class=\"form__group\">\n @if (ydTitle) {\n <span\n class=\"careersForm__section--title form__group\"\n >\n {{ ydTitle }}\n </span>\n }\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (nameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"name\"\n id=\"Name\"\n [placeholder]=\"\n nameInput.placeholder\n \"\n [formControlName]=\"nameInput.name!\"\n (blur)=\"validateInput(nameInput)\"\n (input)=\"\n inputChange($event, nameInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!nameInput.valid()) {\n <span class=\"form-error\">{{\n nameInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"careersForm__col\">\n @if (surnameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"surname\"\n id=\"surname\"\n [placeholder]=\"\n surnameInput.placeholder\n \"\n [formControlName]=\"\n surnameInput.name!\n \"\n (blur)=\"validateInput(surnameInput)\"\n (input)=\"\n inputChange(\n $event,\n surnameInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!surnameInput.valid()) {\n <span class=\"form-error\">{{\n surnameInput.error\n }}</span>\n }\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (prefix) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n name=\"prefix\"\n formControlName=\"prefix\"\n >\n @if (prefix.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ prefix.placeholder }}\n </option>\n }\n @for (\n item of prefix.options || [];\n track $index\n ) {\n <option [value]=\"item.code\">\n {{ item.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n <div class=\"careersForm__col\">\n @if (phoneInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"phone\"\n id=\"phone\"\n [placeholder]=\"\n phoneInput.placeholder\n \"\n (blur)=\"validateInput(phoneInput)\"\n (input)=\"\n inputChange($event, phoneInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#phone\"></use>\n </svg>\n </span>\n </div>\n @if (!phoneInput.valid()) {\n <span class=\"form-error\">{{\n phoneInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (emailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"email\"\n [placeholder]=\"\n emailInput.placeholder\n \"\n (blur)=\"validateInput(emailInput)\"\n (input)=\"\n inputChange($event, emailInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (!emailInput.valid()) {\n <span class=\"form-error\">{{\n emailInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"careersForm__col\">\n @if (confirmEmailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"confirmEmail\"\n [placeholder]=\"\n confirmEmailInput.placeholder\n \"\n (blur)=\"\n validateInput(confirmEmailInput)\n \"\n (input)=\"\n inputChange(\n $event,\n confirmEmailInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (\n confirmEmailInput &&\n !confirmEmailInput.valid()\n ) {\n <span class=\"form-error\">{{\n confirmEmailInput.error\n }}</span>\n }\n }\n </div>\n </div>\n @if (\n confirmEmailInput &&\n form.hasError('emailsDontMatch') &&\n form.get(confirmEmailInput.name!)?.touched\n ) {\n <span class=\"form-error\"\n >Los emails no coinciden.</span\n >\n }\n </div>\n\n <div class=\"careersForm__section\">\n <div class=\"form__group\">\n @if (odTitle) {\n <span\n class=\"careersForm__section--title form__group\"\n >\n {{ odTitle }}\n </span>\n }\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wlangDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wlangDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wlangDropdown.placeholder }}\n </option>\n @for (\n option of wlangDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (hdDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"hdDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ hdDropdown.placeholder }}\n </option>\n @for (\n option of hdDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n <div class=\"careersForm__file-group\">\n @if (cvInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"cvinput\"\n id=\"cvinput\"\n [placeholder]=\"cvInput.label\"\n (input)=\"\n inputChange($event, cvInput)\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!cvInput.valid()) {\n <span class=\"form-error\">{{\n cvInput.error\n }}</span>\n }\n }\n @if (\n cvInputNames && cvInputNames.length > 0\n ) {\n <div>\n @for (\n name of cvInputNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__col\">\n <div class=\"careersForm__file-group\">\n @if (filesInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"filesinput\"\n id=\"filesinput\"\n multiple\n [placeholder]=\"filesInput.label\"\n (input)=\"\n inputChange(\n $event,\n filesInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!filesInput.valid()) {\n <span class=\"form-error\">{{\n filesInput.error\n }}</span>\n }\n }\n @if (filesInputNames) {\n <div>\n @for (\n name of filesInputNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"eventsForm__row\">\n <div class=\"eventsForm__col\">\n @if (wwTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n wwTextarea.placeholder\n \"\n [formControlName]=\"wwTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n <div class=\"block-checkbox\">\n @if (requiredLabel) {\n <span class=\"required-label\">{{\n requiredLabel\n }}</span>\n }\n @if (conditionsLink) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n checked\n class=\"checkbox\"\n formControlName=\"conditions\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span [innerHTML]=\"conditionsLink\">\n </span>\n </label>\n }\n @if (others) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n class=\"checkbox\"\n formControlName=\"others\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span>{{ others }}</span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (applyButton) {\n <button\n type=\"submit\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"applyButton.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm()\"\n >\n <span>{{ applyButton.label }}</span>\n </button>\n }\n <!-- @if (seeAllButton) {\n <a\n class=\"btn btn__primary--outline js-active-modal\"\n [attr.aria-label]=\"seeAllButton.label\"\n [attr.href]=\"seeAllButton.url\"\n >\n <span>{{ seeAllButton.label }}</span>\n </a>\n } -->\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [".careersForm__inner{display:flex;flex-direction:column;row-gap:3.125rem;margin-inline:auto}@media (min-width: 1024px){.careersForm__inner{column-gap:4rem;flex-direction:row}}@media (min-width: 1280px){.careersForm__inner{column-gap:8.269rem}}@media (min-width: 1680px){.careersForm__inner{column-gap:16.689rem;max-width:189.933rem}}.careersForm__graphic{width:46.72rem;max-width:85%;position:relative}@media (min-width: 1024px){.careersForm__graphic{order:2;max-width:45%}}@media (min-width: 1680px){.careersForm__graphic{width:90.5rem}}@media (max-width: 1023.98px){.careersForm__graphic{margin-inline:auto}}.careersForm__graphicInner{width:100%;aspect-ratio:467.2/550.83}@media (min-width: 1024px){.careersForm__graphicInner{position:sticky;top:17rem;max-height:calc(100svh - 17rem)}}@media (min-width: 1680px){.careersForm__graphicInner{aspect-ratio:905/1067}}.careersForm__graphicInner--img{width:100%;height:100%;object-fit:cover}.careersForm__section--title{text-transform:uppercase;padding-inline:2rem;color:var(--reservar-filter-bg);display:block;font-size:1.6rem;line-height:1.364625;letter-spacing:.16rem}@media (min-width: 768px){.careersForm__section--title{font-size:1.8rem;line-height:1.3477777778;letter-spacing:.18rem}}@media (min-width: 1024px){.careersForm__content{order:1;flex:1 1 0%}}.careersForm__content .btn__group{margin-top:4rem;justify-content:center}.careersForm__content .careersForm__title{display:none;font-size:1.4rem;line-height:1.7;letter-spacing:.06rem}@media (min-width: 768px){.careersForm__content .careersForm__title{font-size:1.6rem;line-height:1.7;letter-spacing:.072rem}}@media (min-width: 1280px){.careersForm__content .careersForm__title{font-size:3rem;line-height:1.02;letter-spacing:.09rem}}@media (min-width: 1024px){.careersForm__content .careersForm__title{display:block;text-align:start}}.careersForm__content .careersForm__paragraph{color:var(--cl-text-dark);min-height:7.6rem;text-align:start;margin-bottom:3rem;padding-inline:2rem;font-size:1.6rem;line-height:1.4875;letter-spacing:.048rem}@media (min-width: 768px){.careersForm__content .careersForm__paragraph{font-size:1.8rem;line-height:1.5111111111;letter-spacing:.054rem}}@media (min-width: 1280px){.careersForm__content .careersForm__paragraph{text-align:start;font-size:2rem;line-height:1.53;letter-spacing:.06rem}}.careersForm__content .careersForm__row{display:flex;flex-wrap:wrap;margin:0 -.75rem}@media (min-width: 768px){.careersForm__content .careersForm__row{margin:0 -1.5rem}}@media (min-width: 1280px){.careersForm__content .careersForm__row{margin:0 -2.1rem}}.careersForm__content .careersForm__row .btn__link:not(:hover):after{background:var(--bg-primary)}.careersForm__content .careersForm__col{flex:1 0 100%;width:100%;max-width:100%;padding-inline:.75rem}@media (min-width: 768px){.careersForm__content .careersForm__col{flex:1 0 0%;padding-inline:1.5rem}}@media (min-width: 1280px){.careersForm__content .careersForm__col{padding-inline:2.1rem}}.careersForm__content .careersForm__col .block-checkbox{display:flex;flex-direction:column;row-gap:1rem}.careersForm__content .careersForm__file-group{display:flex;flex-direction:column}.careersForm__content .careersForm__file-group .form__group~div{display:flex;flex-direction:column;row-gap:.5rem;margin-bottom:1rem}.careersForm__placeholder span{color:#1e1e1e;opacity:.6}.careersForm .form-error{color:var(--grey);z-index:1}.careersForm .icon-right i{font-size:2rem}.careersForm .file-name{text-overflow:ellipsis;color:var(--grey);font-size:1.4rem;line-height:1.9428571429;letter-spacing:.042rem}@media (min-width: 768px){.careersForm .file-name{font-size:1.6rem;line-height:1.51625;letter-spacing:.16rem}}input[type=file]{background-color:#fff;line-height:3.2}input[type=file]::-webkit-file-upload-button{visibility:hidden}input[type=file]:before{content:attr(placeholder);background:#fff;color:#1e1e1e;opacity:.6;display:inline-block;cursor:pointer;width:100%;overflow-x:hidden}:host ::ng-deep .careersForm__title{margin-bottom:2rem;display:block;text-align:center;text-transform:uppercase;color:#1e1e1e;opacity:.8;padding-inline:2rem;font-size:1.8rem;line-height:1.213;letter-spacing:.18rem}@media (min-width: 768px){:host ::ng-deep .careersForm__title{font-size:2rem;line-height:1.213;letter-spacing:.2rem}}@media (min-width: 1024px){:host ::ng-deep .careersForm__title{margin-bottom:3rem;display:none;text-align:start}}\n"] }]
1963
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"careersForm generalMargin\">\n <div class=\"careersForm__inner\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"careersForm__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n <div class=\"careersForm__graphic\">\n <div class=\"careersForm__graphicInner\">\n @if (img) {\n <img\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"467\"\n height=\"551\"\n class=\"careersForm__graphicInner--img\"\n priority\n />\n }\n </div>\n </div>\n <div class=\"careersForm__content\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"careersForm__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (description) {\n <div class=\"careersForm__paragraph\">\n {{ description }}\n </div>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"careersForm__section\">\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wlDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wlDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wlDropdown.placeholder }}\n </option>\n @for (\n option of wlDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wpDropdown.placeholder }}\n </option>\n @for (\n option of wpDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (aoDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"aoDropdown\"\n >\n @if (aoDropdown.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ aoDropdown.placeholder }}\n </option>\n }\n @for (\n option of aoDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"careersForm__section\">\n <div class=\"form__group\">\n @if (ydTitle) {\n <span\n class=\"careersForm__section--title form__group __subHeading\"\n >\n {{ ydTitle }}\n </span>\n }\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (nameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"name\"\n id=\"Name\"\n [placeholder]=\"\n nameInput.placeholder\n \"\n [formControlName]=\"nameInput.name!\"\n (blur)=\"validateInput(nameInput)\"\n (input)=\"\n inputChange($event, nameInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!nameInput.valid()) {\n <span class=\"form-error\">{{\n nameInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"careersForm__col\">\n @if (surnameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"surname\"\n id=\"surname\"\n [placeholder]=\"\n surnameInput.placeholder\n \"\n [formControlName]=\"\n surnameInput.name!\n \"\n (blur)=\"validateInput(surnameInput)\"\n (input)=\"\n inputChange(\n $event,\n surnameInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!surnameInput.valid()) {\n <span class=\"form-error\">{{\n surnameInput.error\n }}</span>\n }\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (prefix) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n name=\"prefix\"\n formControlName=\"prefix\"\n >\n @if (prefix.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ prefix.placeholder }}\n </option>\n }\n @for (\n item of prefix.options || [];\n track $index\n ) {\n <option [value]=\"item.code\">\n {{ item.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n <div class=\"careersForm__col\">\n @if (phoneInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"phone\"\n id=\"phone\"\n [placeholder]=\"\n phoneInput.placeholder\n \"\n (blur)=\"validateInput(phoneInput)\"\n (input)=\"\n inputChange($event, phoneInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#phone\"></use>\n </svg>\n </span>\n </div>\n @if (!phoneInput.valid()) {\n <span class=\"form-error\">{{\n phoneInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (emailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"email\"\n [placeholder]=\"\n emailInput.placeholder\n \"\n (blur)=\"validateInput(emailInput)\"\n (input)=\"\n inputChange($event, emailInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (!emailInput.valid()) {\n <span class=\"form-error\">{{\n emailInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"careersForm__col\">\n @if (confirmEmailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"confirmEmail\"\n [placeholder]=\"\n confirmEmailInput.placeholder\n \"\n (blur)=\"\n validateInput(confirmEmailInput)\n \"\n (input)=\"\n inputChange(\n $event,\n confirmEmailInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (\n confirmEmailInput &&\n !confirmEmailInput.valid()\n ) {\n <span class=\"form-error\">{{\n confirmEmailInput.error\n }}</span>\n }\n }\n </div>\n </div>\n @if (\n confirmEmailInput &&\n form.hasError('emailsDontMatch') &&\n form.get(confirmEmailInput.name!)?.touched\n ) {\n <span class=\"form-error\"\n >Los emails no coinciden.</span\n >\n }\n </div>\n\n <div class=\"careersForm__section\">\n <div class=\"form__group\">\n @if (odTitle) {\n <span\n class=\"careersForm__section--title form__group __subHeading\"\n >\n {{ odTitle }}\n </span>\n }\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (wlangDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"wlangDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ wlangDropdown.placeholder }}\n </option>\n @for (\n option of wlangDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n @if (hdDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"hdDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ hdDropdown.placeholder }}\n </option>\n @for (\n option of hdDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n <div class=\"careersForm__file-group\">\n @if (cvInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"cvinput\"\n id=\"cvinput\"\n [placeholder]=\"cvInput.label\"\n (input)=\"\n inputChange($event, cvInput)\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!cvInput.valid()) {\n <span class=\"form-error\">{{\n cvInput.error\n }}</span>\n }\n }\n @if (\n cvInputNames && cvInputNames.length > 0\n ) {\n <div>\n @for (\n name of cvInputNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__col\">\n <div class=\"careersForm__file-group\">\n @if (filesInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"filesinput\"\n id=\"filesinput\"\n multiple\n [placeholder]=\"filesInput.label\"\n (input)=\"\n inputChange(\n $event,\n filesInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!filesInput.valid()) {\n <span class=\"form-error\">{{\n filesInput.error\n }}</span>\n }\n }\n @if (filesInputNames) {\n <div>\n @for (\n name of filesInputNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n </div>\n }\n </div>\n </div>\n </div>\n <div class=\"eventsForm__row\">\n <div class=\"eventsForm__col\">\n @if (wwTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n wwTextarea.placeholder\n \"\n [formControlName]=\"wwTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n <div class=\"careersForm__row\">\n <div class=\"careersForm__col\">\n <div class=\"block-checkbox\">\n @if (requiredLabel) {\n <span class=\"required-label\">{{\n requiredLabel\n }}</span>\n }\n @if (conditionsLink) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n checked\n class=\"checkbox\"\n formControlName=\"conditions\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span [innerHTML]=\"conditionsLink\">\n </span>\n </label>\n }\n @if (others) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n class=\"checkbox\"\n formControlName=\"others\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span>{{ others }}</span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (applyButton) {\n <button\n type=\"submit\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"applyButton.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm()\"\n >\n <span>{{ applyButton.label }}</span>\n </button>\n }\n <!-- @if (seeAllButton) {\n <a\n class=\"btn btn__primary--outline js-active-modal\"\n [attr.aria-label]=\"seeAllButton.label\"\n [attr.href]=\"seeAllButton.url\"\n >\n <span>{{ seeAllButton.label }}</span>\n </a>\n } -->\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n" }]
1964
1964
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: i0.ChangeDetectorRef }], propDecorators: { title: [{
1965
1965
  type: Input
1966
1966
  }], description: [{
@@ -2324,11 +2324,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
2324
2324
 
2325
2325
  class PuroDualListComponent {
2326
2326
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroDualListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2327
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroDualListComponent, isStandalone: true, selector: "lib-puro-dual-list", inputs: { title: "title", pretitle: "pretitle", description: "description", lists: "lists", tags: "tags", textColors: "textColors" }, ngImport: i0, template: "<section\n class=\"dualList textContent textContent__ODM--spacing3 textContent--textStart textContent--2ColumnLayout\"\n>\n <div class=\"textContent__titleSection\">\n <div class=\"textContent__title\">\n @if (pretitle) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.pretitle || 'span'\"\n cssClass=\"textContent__title--preHeading\"\n [color]=\"textColors?.pretitle\"\n [content]=\"pretitle\"\n ></lib-puro-dynamic-heading>\n }\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"textContent__title--heading\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n </div>\n @if (description) {\n <div class=\"textContent__paragraph\">\n <lib-puro-dynamic-heading\n [tag]=\"tags?.description || 'p'\"\n [color]=\"textColors?.description\"\n [content]=\"description\"\n ></lib-puro-dynamic-heading>\n </div>\n }\n </div>\n @if (lists?.length) {\n <div class=\"textContent__list\">\n @for (list of lists; track $index) {\n <div class=\"textContent__item\">\n <h2 class=\"textContent__title--heading\">\n {{ list.title }}\n </h2>\n @if (list.items?.length) {\n <ul class=\"textContent__item--text\">\n @for (item of list.items; track $index) {\n <li>\n @if (item.title) {\n <span>{{ item.title }}</span>\n }\n @if (item.description) {\n <p>{{ item.description }}</p>\n }\n </li>\n }\n </ul>\n }\n </div>\n }\n </div>\n }\n</section>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PuroDynamicHeadingComponent, selector: "lib-puro-dynamic-heading", inputs: ["tag", "wrapper", "cssClass", "content", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2327
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroDualListComponent, isStandalone: true, selector: "lib-puro-dual-list", inputs: { title: "title", pretitle: "pretitle", description: "description", lists: "lists", tags: "tags", textColors: "textColors" }, ngImport: i0, template: "<section\n class=\"dualList textContent textContent__ODM--spacing3 textContent--textStart textContent--2ColumnLayout generalMargin\"\n>\n <div class=\"textContent__titleSection\">\n <div class=\"textContent__title\">\n @if (pretitle) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.pretitle || 'span'\"\n cssClass=\"textContent__title--preHeading\"\n [color]=\"textColors?.pretitle\"\n [content]=\"pretitle\"\n ></lib-puro-dynamic-heading>\n }\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"textContent__title--heading\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n </div>\n @if (description) {\n <div class=\"textContent__paragraph\">\n <lib-puro-dynamic-heading\n [tag]=\"tags?.description || 'p'\"\n [color]=\"textColors?.description\"\n [content]=\"description\"\n ></lib-puro-dynamic-heading>\n </div>\n }\n </div>\n @if (lists?.length) {\n <div class=\"textContent__list\">\n @for (list of lists; track $index) {\n <div class=\"textContent__item\">\n <h2 class=\"textContent__title--heading\">\n {{ list.title }}\n </h2>\n @if (list.items?.length) {\n <ul class=\"textContent__item--text\">\n @for (item of list.items; track $index) {\n <li>\n @if (item.title) {\n <span>{{ item.title }}</span>\n }\n @if (item.description) {\n <p>{{ item.description }}</p>\n }\n </li>\n }\n </ul>\n }\n </div>\n }\n </div>\n }\n</section>\n", styles: [".dualList.textContent{display:flex;flex-direction:column;align-items:center}.dualList.textContent .textContent__titleSection{max-width:146.1rem;display:flex;flex-direction:column;align-items:center;border:none}.dualList.textContent .textContent__titleSection .textContent__title{display:flex;flex-direction:column;align-items:center}.dualList.textContent .textContent__titleSection .textContent__title--preHeading{font-size:16px;margin-bottom:2.6rem;text-transform:uppercase;font-weight:700;opacity:.8;text-align:center}@media (min-width: 1280px){.dualList.textContent .textContent__titleSection .textContent__title--preHeading{font-size:22px}}.dualList.textContent .textContent__paragraph{width:100%;max-width:inherit;text-align:center;font-weight:700;margin-right:inherit}.dualList.textContent .textContent__paragraph p{font-size:18px;width:100%}@media (min-width: 1280px){.dualList.textContent .textContent__paragraph p{font-size:30px}}.dualList.textContent .textContent__list{width:100%;max-width:146.1rem;column-gap:0px;justify-content:center;flex-wrap:wrap}@media (min-width: 768px){.dualList.textContent .textContent__list{flex-wrap:nowrap}}@media (min-width: 1280px){.dualList.textContent .textContent__list{font-size:30px}}.dualList.textContent .textContent__item{text-align:center}.dualList.textContent .textContent__item .textContent__title--heading{text-align:center;margin-bottom:3.5rem}.dualList.textContent .textContent__item .textContent__item--text span{text-transform:uppercase}.dualList.textContent .textContent__item .textContent__item--text p{margin-top:2.5rem;margin-bottom:2.5rem}:host ::ng-deep .textContent__title--preHeading{font-size:16px;margin-bottom:2.6rem;text-transform:uppercase;font-weight:700;opacity:.8;text-align:center}@media (min-width: 1280px){:host ::ng-deep .textContent__title--preHeading{font-size:22px}}:host ::ng-deep .textContent__title--heading{text-align:center;margin-bottom:3.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PuroDynamicHeadingComponent, selector: "lib-puro-dynamic-heading", inputs: ["tag", "wrapper", "cssClass", "content", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2328
2328
  }
2329
2329
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroDualListComponent, decorators: [{
2330
2330
  type: Component,
2331
- args: [{ selector: 'lib-puro-dual-list', standalone: true, imports: [CommonModule, PuroDynamicHeadingComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n class=\"dualList textContent textContent__ODM--spacing3 textContent--textStart textContent--2ColumnLayout\"\n>\n <div class=\"textContent__titleSection\">\n <div class=\"textContent__title\">\n @if (pretitle) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.pretitle || 'span'\"\n cssClass=\"textContent__title--preHeading\"\n [color]=\"textColors?.pretitle\"\n [content]=\"pretitle\"\n ></lib-puro-dynamic-heading>\n }\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"textContent__title--heading\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n </div>\n @if (description) {\n <div class=\"textContent__paragraph\">\n <lib-puro-dynamic-heading\n [tag]=\"tags?.description || 'p'\"\n [color]=\"textColors?.description\"\n [content]=\"description\"\n ></lib-puro-dynamic-heading>\n </div>\n }\n </div>\n @if (lists?.length) {\n <div class=\"textContent__list\">\n @for (list of lists; track $index) {\n <div class=\"textContent__item\">\n <h2 class=\"textContent__title--heading\">\n {{ list.title }}\n </h2>\n @if (list.items?.length) {\n <ul class=\"textContent__item--text\">\n @for (item of list.items; track $index) {\n <li>\n @if (item.title) {\n <span>{{ item.title }}</span>\n }\n @if (item.description) {\n <p>{{ item.description }}</p>\n }\n </li>\n }\n </ul>\n }\n </div>\n }\n </div>\n }\n</section>\n" }]
2331
+ args: [{ selector: 'lib-puro-dual-list', standalone: true, imports: [CommonModule, PuroDynamicHeadingComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n class=\"dualList textContent textContent__ODM--spacing3 textContent--textStart textContent--2ColumnLayout generalMargin\"\n>\n <div class=\"textContent__titleSection\">\n <div class=\"textContent__title\">\n @if (pretitle) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.pretitle || 'span'\"\n cssClass=\"textContent__title--preHeading\"\n [color]=\"textColors?.pretitle\"\n [content]=\"pretitle\"\n ></lib-puro-dynamic-heading>\n }\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"textContent__title--heading\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n </div>\n @if (description) {\n <div class=\"textContent__paragraph\">\n <lib-puro-dynamic-heading\n [tag]=\"tags?.description || 'p'\"\n [color]=\"textColors?.description\"\n [content]=\"description\"\n ></lib-puro-dynamic-heading>\n </div>\n }\n </div>\n @if (lists?.length) {\n <div class=\"textContent__list\">\n @for (list of lists; track $index) {\n <div class=\"textContent__item\">\n <h2 class=\"textContent__title--heading\">\n {{ list.title }}\n </h2>\n @if (list.items?.length) {\n <ul class=\"textContent__item--text\">\n @for (item of list.items; track $index) {\n <li>\n @if (item.title) {\n <span>{{ item.title }}</span>\n }\n @if (item.description) {\n <p>{{ item.description }}</p>\n }\n </li>\n }\n </ul>\n }\n </div>\n }\n </div>\n }\n</section>\n", styles: [".dualList.textContent{display:flex;flex-direction:column;align-items:center}.dualList.textContent .textContent__titleSection{max-width:146.1rem;display:flex;flex-direction:column;align-items:center;border:none}.dualList.textContent .textContent__titleSection .textContent__title{display:flex;flex-direction:column;align-items:center}.dualList.textContent .textContent__titleSection .textContent__title--preHeading{font-size:16px;margin-bottom:2.6rem;text-transform:uppercase;font-weight:700;opacity:.8;text-align:center}@media (min-width: 1280px){.dualList.textContent .textContent__titleSection .textContent__title--preHeading{font-size:22px}}.dualList.textContent .textContent__paragraph{width:100%;max-width:inherit;text-align:center;font-weight:700;margin-right:inherit}.dualList.textContent .textContent__paragraph p{font-size:18px;width:100%}@media (min-width: 1280px){.dualList.textContent .textContent__paragraph p{font-size:30px}}.dualList.textContent .textContent__list{width:100%;max-width:146.1rem;column-gap:0px;justify-content:center;flex-wrap:wrap}@media (min-width: 768px){.dualList.textContent .textContent__list{flex-wrap:nowrap}}@media (min-width: 1280px){.dualList.textContent .textContent__list{font-size:30px}}.dualList.textContent .textContent__item{text-align:center}.dualList.textContent .textContent__item .textContent__title--heading{text-align:center;margin-bottom:3.5rem}.dualList.textContent .textContent__item .textContent__item--text span{text-transform:uppercase}.dualList.textContent .textContent__item .textContent__item--text p{margin-top:2.5rem;margin-bottom:2.5rem}:host ::ng-deep .textContent__title--preHeading{font-size:16px;margin-bottom:2.6rem;text-transform:uppercase;font-weight:700;opacity:.8;text-align:center}@media (min-width: 1280px){:host ::ng-deep .textContent__title--preHeading{font-size:22px}}:host ::ng-deep .textContent__title--heading{text-align:center;margin-bottom:3.5rem}\n"] }]
2332
2332
  }], propDecorators: { title: [{
2333
2333
  type: Input
2334
2334
  }], pretitle: [{
@@ -5571,7 +5571,7 @@ class MapperService {
5571
5571
  items: props?.multimedia?.imagenes?.map((img) => ({
5572
5572
  img: this.getImageResponsive(img),
5573
5573
  title: img?.title,
5574
- subtitle: img?.description,
5574
+ description: img?.description,
5575
5575
  })),
5576
5576
  };
5577
5577
  }
@@ -8180,7 +8180,7 @@ class PuroProjectsFormComponent {
8180
8180
  }
8181
8181
  }
8182
8182
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroProjectsFormComponent, deps: [{ token: i1$3.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
8183
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroProjectsFormComponent, isStandalone: true, selector: "lib-puro-projects-form", inputs: { title: "title", description: "description", ydTitle: "ydTitle", npDropdown: "npDropdown", tbDropdown: "tbDropdown", poDropdown: "poDropdown", emDropdown: "emDropdown", bpDropdown: "bpDropdown", addressInput: "addressInput", sizeInput: "sizeInput", whyTextarea: "whyTextarea", aiTitle: "aiTitle", nameInput: "nameInput", surnameInput: "surnameInput", prefix: "prefix", phoneInput: "phoneInput", emailInput: "emailInput", confirmEmailInput: "confirmEmailInput", icTitle: "icTitle", ppTextarea: "ppTextarea", waTextarea: "waTextarea", dTitle: "dTitle", hbpDropdown: "hbpDropdown", materialsInput: "materialsInput", others: "others", requiredLabel: "requiredLabel", img: "img", conditionsLink: "conditionsLink", applyButton: "applyButton", seeAllButton: "seeAllButton" }, outputs: { submitFormValue: "submitFormValue" }, ngImport: i0, template: "<section class=\"projectsForm generalMargin\">\n <div class=\"projectsForm__inner\">\n @if (title) {\n <span class=\"projectsForm__title\">{{ title }}</span>\n }\n <div class=\"projectsForm__graphic\">\n <div class=\"projectsForm__graphicInner\">\n @if (img) {\n <img\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"467\"\n height=\"551\"\n class=\"projectsForm__graphicInner--img\"\n priority\n />\n }\n </div>\n </div>\n <div class=\"projectsForm__content\">\n @if (title) {\n <span class=\"projectsForm__title\">{{ title }}</span>\n }\n @if (description) {\n <div class=\"projectsForm__paragraph\">\n {{ description }}\n </div>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (ydTitle) {\n <span\n class=\"projectsForm__section--title form__group\"\n >\n {{ ydTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (npDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"npDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ npDropdown.placeholder }}\n </option>\n @for (\n option of npDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (tbDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"tbDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ tbDropdown.placeholder }}\n </option>\n @for (\n option of tbDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (poDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"poDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ poDropdown.placeholder }}\n </option>\n @for (\n option of poDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (emDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"emDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ emDropdown.placeholder }}\n </option>\n @for (\n option of emDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (bpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"bpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ bpDropdown.placeholder }}\n </option>\n @for (\n option of bpDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (addressInput && addressInput.name) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Address\"\n id=\"Address\"\n [placeholder]=\"\n addressInput.placeholder\n \"\n [formControlName]=\"\n addressInput.name!\n \"\n (blur)=\"validateInput(addressInput)\"\n (input)=\"\n inputChange(\n $event,\n addressInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-62\"></i>\n </div>\n </span>\n </div>\n @if (!addressInput.valid()) {\n <span class=\"form-error\">{{\n addressInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (sizeInput && sizeInput.name) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Size\"\n id=\"Size\"\n [placeholder]=\"\n sizeInput.placeholder\n \"\n [formControlName]=\"sizeInput.name!\"\n (blur)=\"validateInput(sizeInput)\"\n (input)=\"\n inputChange($event, sizeInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"19\"\n >\n <use href=\"#size\"></use>\n </svg>\n </span>\n </div>\n @if (!sizeInput.valid()) {\n <span class=\"form-error\">{{\n sizeInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (whyTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n whyTextarea.placeholder\n \"\n [formControlName]=\"\n whyTextarea.name!\n \"\n ></textarea>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (aiTitle) {\n <span\n class=\"projectsForm__section--title form__group\"\n >\n {{ aiTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (nameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Name\"\n id=\"Name\"\n [placeholder]=\"\n nameInput.placeholder\n \"\n [formControlName]=\"nameInput.name!\"\n (blur)=\"validateInput(nameInput)\"\n (input)=\"\n inputChange($event, nameInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!nameInput.valid()) {\n <span class=\"form-error\">{{\n nameInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (surnameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Apellidos\"\n id=\"apellidos\"\n [placeholder]=\"\n surnameInput.placeholder\n \"\n [formControlName]=\"\n surnameInput.name!\n \"\n (blur)=\"validateInput(surnameInput)\"\n (input)=\"\n inputChange(\n $event,\n surnameInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!surnameInput.valid()) {\n <span class=\"form-error\">{{\n surnameInput.error\n }}</span>\n }\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (prefix) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n name=\"Prefijo\"\n formControlName=\"prefix\"\n >\n @if (prefix.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ prefix.placeholder }}\n </option>\n }\n @for (\n item of prefix.options || [];\n track $index\n ) {\n <option [value]=\"item.code\">\n {{ item.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (phoneInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"phone\"\n id=\"phone\"\n [placeholder]=\"\n phoneInput.placeholder\n \"\n (blur)=\"validateInput(phoneInput)\"\n (input)=\"\n inputChange($event, phoneInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#phone\"></use>\n </svg>\n </span>\n </div>\n @if (!phoneInput.valid()) {\n <span class=\"form-error\">{{\n phoneInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (emailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"email\"\n [placeholder]=\"\n emailInput.placeholder\n \"\n (blur)=\"validateInput(emailInput)\"\n (input)=\"\n inputChange($event, emailInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (!emailInput.valid()) {\n <span class=\"form-error\">{{\n emailInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (confirmEmailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"confirmEmail\"\n [placeholder]=\"\n confirmEmailInput.placeholder\n \"\n (blur)=\"\n validateInput(confirmEmailInput)\n \"\n (input)=\"\n inputChange(\n $event,\n confirmEmailInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (\n confirmEmailInput &&\n !confirmEmailInput.valid()\n ) {\n <span class=\"form-error\">{{\n confirmEmailInput.error\n }}</span>\n }\n }\n </div>\n </div>\n @if (\n confirmEmailInput &&\n form.hasError('emailsDontMatch') &&\n form.get(confirmEmailInput.name!)?.touched\n ) {\n <span class=\"form-error\"\n >Los emails no coinciden.</span\n >\n }\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (icTitle) {\n <span\n class=\"projectsForm__section--title form__group\"\n >\n {{ icTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (ppTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n ppTextarea.placeholder\n \"\n [formControlName]=\"ppTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (waTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n waTextarea.placeholder\n \"\n [formControlName]=\"waTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (dTitle) {\n <span\n class=\"projectsForm__section--title form__group\"\n >\n {{ dTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (hbpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"hbpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ hbpDropdown.placeholder }}\n </option>\n @for (\n option of hbpDropdown.options;\n track $index\n ) {\n @if (option) {\n <option\n [value]=\"option.code\"\n >\n {{ option.name }}\n </option>\n }\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (materialsInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"Materials\"\n id=\"Materials\"\n [placeholder]=\"materialsInput.label\"\n (input)=\"\n inputChange(\n $event,\n materialsInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!materialsInput.valid()) {\n <span class=\"form-error\">{{\n materialsInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (\n materialsNames && materialsNames.length > 0\n ) {\n @for (\n name of materialsNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n <div class=\"block-checkbox\">\n @if (requiredLabel) {\n <span class=\"required-label\">{{\n requiredLabel\n }}</span>\n }\n @if (conditionsLink) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n checked\n class=\"checkbox\"\n formControlName=\"conditions\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span [innerHTML]=\"conditionsLink\">\n </span>\n </label>\n }\n @if (others) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n class=\"checkbox\"\n formControlName=\"others\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span>{{ others }}</span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (applyButton) {\n <button\n class=\"btn btn__primary--outline\"\n type=\"submit\"\n [attr.aria-label]=\"applyButton.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm()\"\n >\n <span>{{ applyButton.label }}</span>\n </button>\n }\n <!-- @if (seeAllButton) {\n <button\n class=\"btn btn__primary--outline js-active-modal\"\n data-modal_name=\"thankyou\"\n [attr.aria-label]=\"seeAllButton.label\"\n >\n <span>{{ seeAllButton.label }}</span>\n </button>\n } -->\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [".projectsForm__title{margin-bottom:2rem;display:block;text-align:center;text-transform:uppercase;color:#1e1e1e;opacity:.8;padding-inline:2rem;font-size:1.8rem;line-height:1.213;letter-spacing:.18rem}@media (min-width: 768px){.projectsForm__title{font-size:2rem;line-height:1.213;letter-spacing:.2rem}}@media (min-width: 1024px){.projectsForm__title{margin-bottom:3rem;display:none;text-align:start}}.projectsForm__inner{display:flex;flex-direction:column;row-gap:3.125rem;margin-inline:auto}@media (min-width: 1024px){.projectsForm__inner{column-gap:4rem;flex-direction:row}}@media (min-width: 1280px){.projectsForm__inner{column-gap:8.269rem}}@media (min-width: 1680px){.projectsForm__inner{column-gap:16.689rem;max-width:189.933rem}}.projectsForm__graphic{width:46.72rem;max-width:85%;position:relative}@media (min-width: 1024px){.projectsForm__graphic{order:2;max-width:45%}}@media (min-width: 1680px){.projectsForm__graphic{width:90.5rem}}@media (max-width: 1023.98px){.projectsForm__graphic{margin-inline:auto}}.projectsForm__graphicInner{width:100%;aspect-ratio:467.2/550.83}@media (min-width: 1024px){.projectsForm__graphicInner{position:sticky;top:17rem;max-height:calc(100svh - 17rem)}}@media (min-width: 1680px){.projectsForm__graphicInner{aspect-ratio:905/1067}}.projectsForm__graphicInner--img{width:100%;height:100%;object-fit:cover}.projectsForm__section--title{text-transform:uppercase;padding-inline:2rem;color:var(--reservar-filter-bg);display:block;font-size:1.6rem;line-height:1.364625;letter-spacing:.16rem}@media (min-width: 768px){.projectsForm__section--title{font-size:1.8rem;line-height:1.3477777778;letter-spacing:.18rem}}@media (min-width: 1024px){.projectsForm__content{order:1;flex:1 1 0%}}.projectsForm__content .btn__group{margin-top:4rem;justify-content:center}.projectsForm__content .projectsForm__title{display:none;font-size:1.4rem;line-height:1.7;letter-spacing:.06rem}@media (min-width: 768px){.projectsForm__content .projectsForm__title{font-size:1.6rem;line-height:1.7;letter-spacing:.072rem}}@media (min-width: 1280px){.projectsForm__content .projectsForm__title{font-size:3rem;line-height:1.02;letter-spacing:.09rem}}@media (min-width: 1024px){.projectsForm__content .projectsForm__title{display:block;text-align:start}}.projectsForm__content .projectsForm__paragraph{color:var(--cl-text-dark);min-height:7.6rem;text-align:start;margin-bottom:3rem;padding-inline:2rem;font-size:1.6rem;line-height:1.4875;letter-spacing:.048rem}@media (min-width: 768px){.projectsForm__content .projectsForm__paragraph{font-size:1.8rem;line-height:1.5111111111;letter-spacing:.054rem}}@media (min-width: 1280px){.projectsForm__content .projectsForm__paragraph{text-align:start;font-size:2rem;line-height:1.53;letter-spacing:.06rem}}.projectsForm__content .projectsForm__row{display:flex;flex-wrap:wrap;margin:0 -.75rem}@media (min-width: 768px){.projectsForm__content .projectsForm__row{margin:0 -1.5rem}}@media (min-width: 1280px){.projectsForm__content .projectsForm__row{margin:0 -2.1rem}}.projectsForm__content .projectsForm__row .btn__link:not(:hover):after{background:var(--bg-primary)}.projectsForm__content .projectsForm__col{flex:1 0 100%;width:100%;max-width:100%;padding-inline:.75rem}@media (min-width: 768px){.projectsForm__content .projectsForm__col{flex:1 0 0%;padding-inline:1.5rem}}@media (min-width: 1280px){.projectsForm__content .projectsForm__col{padding-inline:2.1rem}}.projectsForm__content .projectsForm__col .block-checkbox{display:flex;flex-direction:column;row-gap:1rem}.projectsForm__placeholder span{color:#1e1e1e;opacity:.6}.projectsForm .form-error{color:var(--grey);z-index:1}.projectsForm .icon-right i{font-size:2rem}.projectsForm .file-name{text-overflow:ellipsis;color:var(--grey);font-size:1.4rem;line-height:1.9428571429;letter-spacing:.042rem}@media (min-width: 768px){.projectsForm .file-name{font-size:1.6rem;line-height:1.51625;letter-spacing:.16rem}}input[type=file]{background-color:#fff;line-height:3.2}input[type=file]::-webkit-file-upload-button{visibility:hidden}input[type=file]:before{content:attr(placeholder);background:#fff;color:#1e1e1e;opacity:.6;display:inline-block;cursor:pointer;width:100%;overflow-x:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: AutoImageZoomWrapperDirective, selector: "img[ngSrc], img[src]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
8183
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroProjectsFormComponent, isStandalone: true, selector: "lib-puro-projects-form", inputs: { title: "title", description: "description", ydTitle: "ydTitle", npDropdown: "npDropdown", tbDropdown: "tbDropdown", poDropdown: "poDropdown", emDropdown: "emDropdown", bpDropdown: "bpDropdown", addressInput: "addressInput", sizeInput: "sizeInput", whyTextarea: "whyTextarea", aiTitle: "aiTitle", nameInput: "nameInput", surnameInput: "surnameInput", prefix: "prefix", phoneInput: "phoneInput", emailInput: "emailInput", confirmEmailInput: "confirmEmailInput", icTitle: "icTitle", ppTextarea: "ppTextarea", waTextarea: "waTextarea", dTitle: "dTitle", hbpDropdown: "hbpDropdown", materialsInput: "materialsInput", others: "others", requiredLabel: "requiredLabel", img: "img", conditionsLink: "conditionsLink", applyButton: "applyButton", seeAllButton: "seeAllButton" }, outputs: { submitFormValue: "submitFormValue" }, ngImport: i0, template: "<section class=\"projectsForm generalMargin\">\n <div class=\"projectsForm__inner\">\n @if (title) {\n <span class=\"projectsForm__title\">{{ title }}</span>\n }\n <div class=\"projectsForm__graphic\">\n <div class=\"projectsForm__graphicInner\">\n @if (img) {\n <img\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"467\"\n height=\"551\"\n class=\"projectsForm__graphicInner--img\"\n priority\n />\n }\n </div>\n </div>\n <div class=\"projectsForm__content\">\n @if (title) {\n <span class=\"projectsForm__title\">{{ title }}</span>\n }\n @if (description) {\n <div class=\"projectsForm__paragraph\">\n {{ description }}\n </div>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (ydTitle) {\n <span\n class=\"projectsForm__section--title form__group __subHeading\"\n >\n {{ ydTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (npDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"npDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ npDropdown.placeholder }}\n </option>\n @for (\n option of npDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (tbDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"tbDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ tbDropdown.placeholder }}\n </option>\n @for (\n option of tbDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (poDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"poDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ poDropdown.placeholder }}\n </option>\n @for (\n option of poDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (emDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"emDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ emDropdown.placeholder }}\n </option>\n @for (\n option of emDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (bpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"bpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ bpDropdown.placeholder }}\n </option>\n @for (\n option of bpDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (addressInput && addressInput.name) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Address\"\n id=\"Address\"\n [placeholder]=\"\n addressInput.placeholder\n \"\n [formControlName]=\"\n addressInput.name!\n \"\n (blur)=\"validateInput(addressInput)\"\n (input)=\"\n inputChange(\n $event,\n addressInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-62\"></i>\n </div>\n </span>\n </div>\n @if (!addressInput.valid()) {\n <span class=\"form-error\">{{\n addressInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (sizeInput && sizeInput.name) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Size\"\n id=\"Size\"\n [placeholder]=\"\n sizeInput.placeholder\n \"\n [formControlName]=\"sizeInput.name!\"\n (blur)=\"validateInput(sizeInput)\"\n (input)=\"\n inputChange($event, sizeInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"19\"\n >\n <use href=\"#size\"></use>\n </svg>\n </span>\n </div>\n @if (!sizeInput.valid()) {\n <span class=\"form-error\">{{\n sizeInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (whyTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n whyTextarea.placeholder\n \"\n [formControlName]=\"\n whyTextarea.name!\n \"\n ></textarea>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (aiTitle) {\n <span\n class=\"projectsForm__section--title form__group __subHeading\"\n >\n {{ aiTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (nameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Name\"\n id=\"Name\"\n [placeholder]=\"\n nameInput.placeholder\n \"\n [formControlName]=\"nameInput.name!\"\n (blur)=\"validateInput(nameInput)\"\n (input)=\"\n inputChange($event, nameInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!nameInput.valid()) {\n <span class=\"form-error\">{{\n nameInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (surnameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Apellidos\"\n id=\"apellidos\"\n [placeholder]=\"\n surnameInput.placeholder\n \"\n [formControlName]=\"\n surnameInput.name!\n \"\n (blur)=\"validateInput(surnameInput)\"\n (input)=\"\n inputChange(\n $event,\n surnameInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!surnameInput.valid()) {\n <span class=\"form-error\">{{\n surnameInput.error\n }}</span>\n }\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (prefix) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n name=\"Prefijo\"\n formControlName=\"prefix\"\n >\n @if (prefix.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ prefix.placeholder }}\n </option>\n }\n @for (\n item of prefix.options || [];\n track $index\n ) {\n <option [value]=\"item.code\">\n {{ item.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (phoneInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"phone\"\n id=\"phone\"\n [placeholder]=\"\n phoneInput.placeholder\n \"\n (blur)=\"validateInput(phoneInput)\"\n (input)=\"\n inputChange($event, phoneInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#phone\"></use>\n </svg>\n </span>\n </div>\n @if (!phoneInput.valid()) {\n <span class=\"form-error\">{{\n phoneInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (emailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"email\"\n [placeholder]=\"\n emailInput.placeholder\n \"\n (blur)=\"validateInput(emailInput)\"\n (input)=\"\n inputChange($event, emailInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (!emailInput.valid()) {\n <span class=\"form-error\">{{\n emailInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (confirmEmailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"confirmEmail\"\n [placeholder]=\"\n confirmEmailInput.placeholder\n \"\n (blur)=\"\n validateInput(confirmEmailInput)\n \"\n (input)=\"\n inputChange(\n $event,\n confirmEmailInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (\n confirmEmailInput &&\n !confirmEmailInput.valid()\n ) {\n <span class=\"form-error\">{{\n confirmEmailInput.error\n }}</span>\n }\n }\n </div>\n </div>\n @if (\n confirmEmailInput &&\n form.hasError('emailsDontMatch') &&\n form.get(confirmEmailInput.name!)?.touched\n ) {\n <span class=\"form-error\"\n >Los emails no coinciden.</span\n >\n }\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (icTitle) {\n <span\n class=\"projectsForm__section--title form__group __subHeading\"\n >\n {{ icTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (ppTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n ppTextarea.placeholder\n \"\n [formControlName]=\"ppTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (waTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n waTextarea.placeholder\n \"\n [formControlName]=\"waTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (dTitle) {\n <span\n class=\"projectsForm__section--title form__group __subHeading\"\n >\n {{ dTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (hbpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"hbpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ hbpDropdown.placeholder }}\n </option>\n @for (\n option of hbpDropdown.options;\n track $index\n ) {\n @if (option) {\n <option\n [value]=\"option.code\"\n >\n {{ option.name }}\n </option>\n }\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (materialsInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"Materials\"\n id=\"Materials\"\n [placeholder]=\"materialsInput.label\"\n (input)=\"\n inputChange(\n $event,\n materialsInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!materialsInput.valid()) {\n <span class=\"form-error\">{{\n materialsInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (\n materialsNames && materialsNames.length > 0\n ) {\n @for (\n name of materialsNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n <div class=\"block-checkbox\">\n @if (requiredLabel) {\n <span class=\"required-label\">{{\n requiredLabel\n }}</span>\n }\n @if (conditionsLink) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n checked\n class=\"checkbox\"\n formControlName=\"conditions\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span [innerHTML]=\"conditionsLink\">\n </span>\n </label>\n }\n @if (others) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n class=\"checkbox\"\n formControlName=\"others\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span>{{ others }}</span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (applyButton) {\n <button\n class=\"btn btn__primary--outline\"\n type=\"submit\"\n [attr.aria-label]=\"applyButton.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm()\"\n >\n <span>{{ applyButton.label }}</span>\n </button>\n }\n <!-- @if (seeAllButton) {\n <button\n class=\"btn btn__primary--outline js-active-modal\"\n data-modal_name=\"thankyou\"\n [attr.aria-label]=\"seeAllButton.label\"\n >\n <span>{{ seeAllButton.label }}</span>\n </button>\n } -->\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: AutoImageZoomWrapperDirective, selector: "img[ngSrc], img[src]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
8184
8184
  }
8185
8185
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroProjectsFormComponent, decorators: [{
8186
8186
  type: Component,
@@ -8190,7 +8190,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
8190
8190
  ReactiveFormsModule,
8191
8191
  NgOptimizedImage,
8192
8192
  AutoImageZoomWrapperDirective,
8193
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"projectsForm generalMargin\">\n <div class=\"projectsForm__inner\">\n @if (title) {\n <span class=\"projectsForm__title\">{{ title }}</span>\n }\n <div class=\"projectsForm__graphic\">\n <div class=\"projectsForm__graphicInner\">\n @if (img) {\n <img\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"467\"\n height=\"551\"\n class=\"projectsForm__graphicInner--img\"\n priority\n />\n }\n </div>\n </div>\n <div class=\"projectsForm__content\">\n @if (title) {\n <span class=\"projectsForm__title\">{{ title }}</span>\n }\n @if (description) {\n <div class=\"projectsForm__paragraph\">\n {{ description }}\n </div>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (ydTitle) {\n <span\n class=\"projectsForm__section--title form__group\"\n >\n {{ ydTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (npDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"npDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ npDropdown.placeholder }}\n </option>\n @for (\n option of npDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (tbDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"tbDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ tbDropdown.placeholder }}\n </option>\n @for (\n option of tbDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (poDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"poDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ poDropdown.placeholder }}\n </option>\n @for (\n option of poDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (emDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"emDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ emDropdown.placeholder }}\n </option>\n @for (\n option of emDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (bpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"bpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ bpDropdown.placeholder }}\n </option>\n @for (\n option of bpDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (addressInput && addressInput.name) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Address\"\n id=\"Address\"\n [placeholder]=\"\n addressInput.placeholder\n \"\n [formControlName]=\"\n addressInput.name!\n \"\n (blur)=\"validateInput(addressInput)\"\n (input)=\"\n inputChange(\n $event,\n addressInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-62\"></i>\n </div>\n </span>\n </div>\n @if (!addressInput.valid()) {\n <span class=\"form-error\">{{\n addressInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (sizeInput && sizeInput.name) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Size\"\n id=\"Size\"\n [placeholder]=\"\n sizeInput.placeholder\n \"\n [formControlName]=\"sizeInput.name!\"\n (blur)=\"validateInput(sizeInput)\"\n (input)=\"\n inputChange($event, sizeInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"19\"\n >\n <use href=\"#size\"></use>\n </svg>\n </span>\n </div>\n @if (!sizeInput.valid()) {\n <span class=\"form-error\">{{\n sizeInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (whyTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n whyTextarea.placeholder\n \"\n [formControlName]=\"\n whyTextarea.name!\n \"\n ></textarea>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (aiTitle) {\n <span\n class=\"projectsForm__section--title form__group\"\n >\n {{ aiTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (nameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Name\"\n id=\"Name\"\n [placeholder]=\"\n nameInput.placeholder\n \"\n [formControlName]=\"nameInput.name!\"\n (blur)=\"validateInput(nameInput)\"\n (input)=\"\n inputChange($event, nameInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!nameInput.valid()) {\n <span class=\"form-error\">{{\n nameInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (surnameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Apellidos\"\n id=\"apellidos\"\n [placeholder]=\"\n surnameInput.placeholder\n \"\n [formControlName]=\"\n surnameInput.name!\n \"\n (blur)=\"validateInput(surnameInput)\"\n (input)=\"\n inputChange(\n $event,\n surnameInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!surnameInput.valid()) {\n <span class=\"form-error\">{{\n surnameInput.error\n }}</span>\n }\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (prefix) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n name=\"Prefijo\"\n formControlName=\"prefix\"\n >\n @if (prefix.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ prefix.placeholder }}\n </option>\n }\n @for (\n item of prefix.options || [];\n track $index\n ) {\n <option [value]=\"item.code\">\n {{ item.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (phoneInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"phone\"\n id=\"phone\"\n [placeholder]=\"\n phoneInput.placeholder\n \"\n (blur)=\"validateInput(phoneInput)\"\n (input)=\"\n inputChange($event, phoneInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#phone\"></use>\n </svg>\n </span>\n </div>\n @if (!phoneInput.valid()) {\n <span class=\"form-error\">{{\n phoneInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (emailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"email\"\n [placeholder]=\"\n emailInput.placeholder\n \"\n (blur)=\"validateInput(emailInput)\"\n (input)=\"\n inputChange($event, emailInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (!emailInput.valid()) {\n <span class=\"form-error\">{{\n emailInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (confirmEmailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"confirmEmail\"\n [placeholder]=\"\n confirmEmailInput.placeholder\n \"\n (blur)=\"\n validateInput(confirmEmailInput)\n \"\n (input)=\"\n inputChange(\n $event,\n confirmEmailInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (\n confirmEmailInput &&\n !confirmEmailInput.valid()\n ) {\n <span class=\"form-error\">{{\n confirmEmailInput.error\n }}</span>\n }\n }\n </div>\n </div>\n @if (\n confirmEmailInput &&\n form.hasError('emailsDontMatch') &&\n form.get(confirmEmailInput.name!)?.touched\n ) {\n <span class=\"form-error\"\n >Los emails no coinciden.</span\n >\n }\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (icTitle) {\n <span\n class=\"projectsForm__section--title form__group\"\n >\n {{ icTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (ppTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n ppTextarea.placeholder\n \"\n [formControlName]=\"ppTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (waTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n waTextarea.placeholder\n \"\n [formControlName]=\"waTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (dTitle) {\n <span\n class=\"projectsForm__section--title form__group\"\n >\n {{ dTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (hbpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"hbpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ hbpDropdown.placeholder }}\n </option>\n @for (\n option of hbpDropdown.options;\n track $index\n ) {\n @if (option) {\n <option\n [value]=\"option.code\"\n >\n {{ option.name }}\n </option>\n }\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (materialsInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"Materials\"\n id=\"Materials\"\n [placeholder]=\"materialsInput.label\"\n (input)=\"\n inputChange(\n $event,\n materialsInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!materialsInput.valid()) {\n <span class=\"form-error\">{{\n materialsInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (\n materialsNames && materialsNames.length > 0\n ) {\n @for (\n name of materialsNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n <div class=\"block-checkbox\">\n @if (requiredLabel) {\n <span class=\"required-label\">{{\n requiredLabel\n }}</span>\n }\n @if (conditionsLink) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n checked\n class=\"checkbox\"\n formControlName=\"conditions\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span [innerHTML]=\"conditionsLink\">\n </span>\n </label>\n }\n @if (others) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n class=\"checkbox\"\n formControlName=\"others\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span>{{ others }}</span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (applyButton) {\n <button\n class=\"btn btn__primary--outline\"\n type=\"submit\"\n [attr.aria-label]=\"applyButton.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm()\"\n >\n <span>{{ applyButton.label }}</span>\n </button>\n }\n <!-- @if (seeAllButton) {\n <button\n class=\"btn btn__primary--outline js-active-modal\"\n data-modal_name=\"thankyou\"\n [attr.aria-label]=\"seeAllButton.label\"\n >\n <span>{{ seeAllButton.label }}</span>\n </button>\n } -->\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [".projectsForm__title{margin-bottom:2rem;display:block;text-align:center;text-transform:uppercase;color:#1e1e1e;opacity:.8;padding-inline:2rem;font-size:1.8rem;line-height:1.213;letter-spacing:.18rem}@media (min-width: 768px){.projectsForm__title{font-size:2rem;line-height:1.213;letter-spacing:.2rem}}@media (min-width: 1024px){.projectsForm__title{margin-bottom:3rem;display:none;text-align:start}}.projectsForm__inner{display:flex;flex-direction:column;row-gap:3.125rem;margin-inline:auto}@media (min-width: 1024px){.projectsForm__inner{column-gap:4rem;flex-direction:row}}@media (min-width: 1280px){.projectsForm__inner{column-gap:8.269rem}}@media (min-width: 1680px){.projectsForm__inner{column-gap:16.689rem;max-width:189.933rem}}.projectsForm__graphic{width:46.72rem;max-width:85%;position:relative}@media (min-width: 1024px){.projectsForm__graphic{order:2;max-width:45%}}@media (min-width: 1680px){.projectsForm__graphic{width:90.5rem}}@media (max-width: 1023.98px){.projectsForm__graphic{margin-inline:auto}}.projectsForm__graphicInner{width:100%;aspect-ratio:467.2/550.83}@media (min-width: 1024px){.projectsForm__graphicInner{position:sticky;top:17rem;max-height:calc(100svh - 17rem)}}@media (min-width: 1680px){.projectsForm__graphicInner{aspect-ratio:905/1067}}.projectsForm__graphicInner--img{width:100%;height:100%;object-fit:cover}.projectsForm__section--title{text-transform:uppercase;padding-inline:2rem;color:var(--reservar-filter-bg);display:block;font-size:1.6rem;line-height:1.364625;letter-spacing:.16rem}@media (min-width: 768px){.projectsForm__section--title{font-size:1.8rem;line-height:1.3477777778;letter-spacing:.18rem}}@media (min-width: 1024px){.projectsForm__content{order:1;flex:1 1 0%}}.projectsForm__content .btn__group{margin-top:4rem;justify-content:center}.projectsForm__content .projectsForm__title{display:none;font-size:1.4rem;line-height:1.7;letter-spacing:.06rem}@media (min-width: 768px){.projectsForm__content .projectsForm__title{font-size:1.6rem;line-height:1.7;letter-spacing:.072rem}}@media (min-width: 1280px){.projectsForm__content .projectsForm__title{font-size:3rem;line-height:1.02;letter-spacing:.09rem}}@media (min-width: 1024px){.projectsForm__content .projectsForm__title{display:block;text-align:start}}.projectsForm__content .projectsForm__paragraph{color:var(--cl-text-dark);min-height:7.6rem;text-align:start;margin-bottom:3rem;padding-inline:2rem;font-size:1.6rem;line-height:1.4875;letter-spacing:.048rem}@media (min-width: 768px){.projectsForm__content .projectsForm__paragraph{font-size:1.8rem;line-height:1.5111111111;letter-spacing:.054rem}}@media (min-width: 1280px){.projectsForm__content .projectsForm__paragraph{text-align:start;font-size:2rem;line-height:1.53;letter-spacing:.06rem}}.projectsForm__content .projectsForm__row{display:flex;flex-wrap:wrap;margin:0 -.75rem}@media (min-width: 768px){.projectsForm__content .projectsForm__row{margin:0 -1.5rem}}@media (min-width: 1280px){.projectsForm__content .projectsForm__row{margin:0 -2.1rem}}.projectsForm__content .projectsForm__row .btn__link:not(:hover):after{background:var(--bg-primary)}.projectsForm__content .projectsForm__col{flex:1 0 100%;width:100%;max-width:100%;padding-inline:.75rem}@media (min-width: 768px){.projectsForm__content .projectsForm__col{flex:1 0 0%;padding-inline:1.5rem}}@media (min-width: 1280px){.projectsForm__content .projectsForm__col{padding-inline:2.1rem}}.projectsForm__content .projectsForm__col .block-checkbox{display:flex;flex-direction:column;row-gap:1rem}.projectsForm__placeholder span{color:#1e1e1e;opacity:.6}.projectsForm .form-error{color:var(--grey);z-index:1}.projectsForm .icon-right i{font-size:2rem}.projectsForm .file-name{text-overflow:ellipsis;color:var(--grey);font-size:1.4rem;line-height:1.9428571429;letter-spacing:.042rem}@media (min-width: 768px){.projectsForm .file-name{font-size:1.6rem;line-height:1.51625;letter-spacing:.16rem}}input[type=file]{background-color:#fff;line-height:3.2}input[type=file]::-webkit-file-upload-button{visibility:hidden}input[type=file]:before{content:attr(placeholder);background:#fff;color:#1e1e1e;opacity:.6;display:inline-block;cursor:pointer;width:100%;overflow-x:hidden}\n"] }]
8193
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"projectsForm generalMargin\">\n <div class=\"projectsForm__inner\">\n @if (title) {\n <span class=\"projectsForm__title\">{{ title }}</span>\n }\n <div class=\"projectsForm__graphic\">\n <div class=\"projectsForm__graphicInner\">\n @if (img) {\n <img\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"467\"\n height=\"551\"\n class=\"projectsForm__graphicInner--img\"\n priority\n />\n }\n </div>\n </div>\n <div class=\"projectsForm__content\">\n @if (title) {\n <span class=\"projectsForm__title\">{{ title }}</span>\n }\n @if (description) {\n <div class=\"projectsForm__paragraph\">\n {{ description }}\n </div>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (ydTitle) {\n <span\n class=\"projectsForm__section--title form__group __subHeading\"\n >\n {{ ydTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (npDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"npDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ npDropdown.placeholder }}\n </option>\n @for (\n option of npDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (tbDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"tbDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ tbDropdown.placeholder }}\n </option>\n @for (\n option of tbDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (poDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"poDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ poDropdown.placeholder }}\n </option>\n @for (\n option of poDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (emDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"emDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ emDropdown.placeholder }}\n </option>\n @for (\n option of emDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (bpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"bpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ bpDropdown.placeholder }}\n </option>\n @for (\n option of bpDropdown.options;\n track $index\n ) {\n <option [value]=\"option.code\">\n {{ option.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (addressInput && addressInput.name) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Address\"\n id=\"Address\"\n [placeholder]=\"\n addressInput.placeholder\n \"\n [formControlName]=\"\n addressInput.name!\n \"\n (blur)=\"validateInput(addressInput)\"\n (input)=\"\n inputChange(\n $event,\n addressInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-62\"></i>\n </div>\n </span>\n </div>\n @if (!addressInput.valid()) {\n <span class=\"form-error\">{{\n addressInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (sizeInput && sizeInput.name) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Size\"\n id=\"Size\"\n [placeholder]=\"\n sizeInput.placeholder\n \"\n [formControlName]=\"sizeInput.name!\"\n (blur)=\"validateInput(sizeInput)\"\n (input)=\"\n inputChange($event, sizeInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"19\"\n >\n <use href=\"#size\"></use>\n </svg>\n </span>\n </div>\n @if (!sizeInput.valid()) {\n <span class=\"form-error\">{{\n sizeInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (whyTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n whyTextarea.placeholder\n \"\n [formControlName]=\"\n whyTextarea.name!\n \"\n ></textarea>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (aiTitle) {\n <span\n class=\"projectsForm__section--title form__group __subHeading\"\n >\n {{ aiTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (nameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Name\"\n id=\"Name\"\n [placeholder]=\"\n nameInput.placeholder\n \"\n [formControlName]=\"nameInput.name!\"\n (blur)=\"validateInput(nameInput)\"\n (input)=\"\n inputChange($event, nameInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!nameInput.valid()) {\n <span class=\"form-error\">{{\n nameInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (surnameInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"Apellidos\"\n id=\"apellidos\"\n [placeholder]=\"\n surnameInput.placeholder\n \"\n [formControlName]=\"\n surnameInput.name!\n \"\n (blur)=\"validateInput(surnameInput)\"\n (input)=\"\n inputChange(\n $event,\n surnameInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"18\"\n height=\"20\"\n >\n <use href=\"#user\"></use>\n </svg>\n </span>\n </div>\n @if (!surnameInput.valid()) {\n <span class=\"form-error\">{{\n surnameInput.error\n }}</span>\n }\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (prefix) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n name=\"Prefijo\"\n formControlName=\"prefix\"\n >\n @if (prefix.placeholder) {\n <option\n value=\"\"\n disabled\n selected\n >\n {{ prefix.placeholder }}\n </option>\n }\n @for (\n item of prefix.options || [];\n track $index\n ) {\n <option [value]=\"item.code\">\n {{ item.name }}\n </option>\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (phoneInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"text\"\n class=\"form__control\"\n name=\"phone\"\n id=\"phone\"\n [placeholder]=\"\n phoneInput.placeholder\n \"\n (blur)=\"validateInput(phoneInput)\"\n (input)=\"\n inputChange($event, phoneInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#phone\"></use>\n </svg>\n </span>\n </div>\n @if (!phoneInput.valid()) {\n <span class=\"form-error\">{{\n phoneInput.error\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (emailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"email\"\n [placeholder]=\"\n emailInput.placeholder\n \"\n (blur)=\"validateInput(emailInput)\"\n (input)=\"\n inputChange($event, emailInput)\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (!emailInput.valid()) {\n <span class=\"form-error\">{{\n emailInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (confirmEmailInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n name=\"confirmEmail\"\n [placeholder]=\"\n confirmEmailInput.placeholder\n \"\n (blur)=\"\n validateInput(confirmEmailInput)\n \"\n (input)=\"\n inputChange(\n $event,\n confirmEmailInput\n )\n \"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"17\"\n height=\"17\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n @if (\n confirmEmailInput &&\n !confirmEmailInput.valid()\n ) {\n <span class=\"form-error\">{{\n confirmEmailInput.error\n }}</span>\n }\n }\n </div>\n </div>\n @if (\n confirmEmailInput &&\n form.hasError('emailsDontMatch') &&\n form.get(confirmEmailInput.name!)?.touched\n ) {\n <span class=\"form-error\"\n >Los emails no coinciden.</span\n >\n }\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (icTitle) {\n <span\n class=\"projectsForm__section--title form__group __subHeading\"\n >\n {{ icTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (ppTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n ppTextarea.placeholder\n \"\n [formControlName]=\"ppTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (waTextarea) {\n <div class=\"form__group no-dot\">\n <textarea\n class=\"form__control\"\n [placeholder]=\"\n waTextarea.placeholder\n \"\n [formControlName]=\"waTextarea.name!\"\n ></textarea>\n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"projectsForm__section\">\n <div class=\"form__group\">\n @if (dTitle) {\n <span\n class=\"projectsForm__section--title form__group __subHeading\"\n >\n {{ dTitle }}\n </span>\n }\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (hbpDropdown) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"hbpDropdown\"\n >\n <option value=\"\" disabled selected>\n {{ hbpDropdown.placeholder }}\n </option>\n @for (\n option of hbpDropdown.options;\n track $index\n ) {\n @if (option) {\n <option\n [value]=\"option.code\"\n >\n {{ option.name }}\n </option>\n }\n }\n </select>\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"15\"\n height=\"8\"\n >\n <use href=\"#select-arrow\"></use>\n </svg>\n </span>\n </div>\n }\n </div>\n </div>\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n @if (materialsInput) {\n <div class=\"form__group withIcon\">\n <input\n type=\"file\"\n class=\"form__control\"\n name=\"Materials\"\n id=\"Materials\"\n [placeholder]=\"materialsInput.label\"\n (input)=\"\n inputChange(\n $event,\n materialsInput\n )\n \"\n />\n <span class=\"icon-right\">\n <div>\n <i class=\"icon-98\"></i>\n </div>\n </span>\n </div>\n @if (!materialsInput.valid()) {\n <span class=\"form-error\">{{\n materialsInput.error\n }}</span>\n }\n }\n </div>\n <div class=\"projectsForm__col\">\n @if (\n materialsNames && materialsNames.length > 0\n ) {\n @for (\n name of materialsNames;\n track $index\n ) {\n <span class=\"file-name\">{{\n name\n }}</span>\n }\n }\n </div>\n </div>\n\n <div class=\"projectsForm__row\">\n <div class=\"projectsForm__col\">\n <div class=\"block-checkbox\">\n @if (requiredLabel) {\n <span class=\"required-label\">{{\n requiredLabel\n }}</span>\n }\n @if (conditionsLink) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n checked\n class=\"checkbox\"\n formControlName=\"conditions\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span [innerHTML]=\"conditionsLink\">\n </span>\n </label>\n }\n @if (others) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\n class=\"checkbox\"\n formControlName=\"others\"\n />\n <span class=\"box\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"9\"\n height=\"7\"\n >\n <use\n href=\"#checkbox-tick\"\n ></use>\n </svg>\n </span>\n <span>{{ others }}</span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (applyButton) {\n <button\n class=\"btn btn__primary--outline\"\n type=\"submit\"\n [attr.aria-label]=\"applyButton.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm()\"\n >\n <span>{{ applyButton.label }}</span>\n </button>\n }\n <!-- @if (seeAllButton) {\n <button\n class=\"btn btn__primary--outline js-active-modal\"\n data-modal_name=\"thankyou\"\n [attr.aria-label]=\"seeAllButton.label\"\n >\n <span>{{ seeAllButton.label }}</span>\n </button>\n } -->\n </div>\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n" }]
8194
8194
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: i0.ChangeDetectorRef }], propDecorators: { title: [{
8195
8195
  type: Input
8196
8196
  }], description: [{
@@ -8269,8 +8269,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
8269
8269
  }] } });
8270
8270
 
8271
8271
  class PuroSlider4ItemsComponent {
8272
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroSlider4ItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8273
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroSlider4ItemsComponent, isStandalone: true, selector: "lib-puro-slider-4items", inputs: { title: "title", subtitle: "subtitle", items: "items" }, ngImport: i0, template: "<section\n [puroSlider]=\"items\"\n class=\"slider4items js-active-slider\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-slider4items-slider\"\n data-slider_showbtns=\"true\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"false\"\n data-slider_autoplay=\"true\"\n data-slides_pc=\"4\"\n data-slides_laptop=\"4\"\n data-slides_tablet=\"3\"\n data-slides_mobile=\"1 \"\n data-slides_mobile_small=\"1\"\n data-slides_mobile_xsmall=\"1\"\n>\n <div class=\"slider4items__title-section\">\n @if (title) {\n <h2 class=\"slider4items__title text__heading\">\n {{ title }}\n </h2>\n }\n @if (subtitle) {\n <p class=\"slider4items__subtitle\">\n {{ subtitle }}\n </p>\n }\n </div>\n @if (items && items.length > 0) {\n <div class=\"slider4items__inner relative\">\n <div class=\"slider4items__container\">\n <div class=\"js-slider4items-slider slider4items__slider\">\n @for (item of items; track $index) {\n <div>\n <div class=\"slider4items__item\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n [alt]=\"item.img.alt\"\n class=\"slider4items__img\"\n width=\"290\"\n height=\"400\"\n decoding=\"async\"\n />\n }\n @if (item.title) {\n <span\n class=\"slider4items__title text__heading\"\n >{{ item.title }}</span\n >\n }\n @if (item.description) {\n <p class=\"slider4items__description\">\n {{ item.description }}\n </p>\n }\n </div>\n </div>\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n </div>\n }\n</section>\n", styles: [".slider4items{padding-block:3.5rem;transition:all .5s;position:relative;isolation:isolate;max-width:1700px;margin-inline:auto;overflow:hidden}@media (min-width: 768px){.slider4items{padding-block:6.8rem 7.091rem}}@media (min-width: 1024px){.slider4items{padding-block:2.8rem 3.9rem}}@media (min-width: 1680px){.slider4items{padding-block:7rem 5.3rem;padding-bottom:8.358rem}}.slider4items__title-section{text-align:center;margin-bottom:4rem}.slider4items__title-section .slider4items__title{font-size:2.4rem;line-height:1.52875;letter-spacing:.052rem;margin-bottom:2rem}@media (min-width: 540px){.slider4items__title-section .slider4items__title{font-size:2.4rem;line-height:1.6666666667;letter-spacing:.064rem}}@media (min-width: 768px){.slider4items__title-section .slider4items__title{font-size:2.4rem;line-height:2.0833333333;letter-spacing:.08rem}}@media (min-width: 1366px){.slider4items__title-section .slider4items__title{font-size:5rem;line-height:1.392;letter-spacing:.108rem;margin-bottom:3rem}}@media (min-width: 1680px){.slider4items__title-section .slider4items__title{font-size:5rem;line-height:1.23904;letter-spacing:.108rem;margin-bottom:3rem}}.slider4items__title-section .slider4items__subtitle{font-size:1.6rem;line-height:1.2;letter-spacing:.16rem}@media (min-width: 768px){.slider4items__title-section .slider4items__subtitle{font-size:2.2rem;line-height:1.2131818182;letter-spacing:.22rem}}.slider4items__title-section .slider4items__subtitle{font-weight:500;text-transform:uppercase;text-align:center}.slider4items__inner{position:relative;padding-inline:4.5rem}@media (min-width: 768px){.slider4items__inner{padding-inline:0}}.slider4items__container{padding-inline:2rem}@media (min-width: 768px){.slider4items__container{padding-inline:12.4rem 12.304rem}}@media (min-width: 1024px){.slider4items__container{padding-inline:10.3rem 9.5rem}}@media (min-width: 1680px){.slider4items__container{padding-inline:28.5rem}}.slider4items__slider ::ng-deep .slick-list{position:relative;left:50%;transform:translate(-50%);width:100%}.slider4items__slider ::ng-deep .slick-slide{transition:all .5s;padding-bottom:8px;padding-inline:1rem}.slider4items__item{width:100%;display:flex;flex-direction:column;justify-content:space-between;text-align:center}@media (max-width: 768px){.slider4items__item{position:relative;left:50%;transform:translate(-50%)}}.slider4items__item .slider4items__title{text-transform:uppercase;font-size:1.4rem;line-height:1.8571428571;letter-spacing:.036rem;margin-bottom:2rem}@media (min-width: 540px){.slider4items__item .slider4items__title{font-size:1.4rem;line-height:1.8571428571;letter-spacing:.028rem}}@media (min-width: 768px){.slider4items__item .slider4items__title{font-size:1.4rem;line-height:2.1428571429;letter-spacing:.028rem}}@media (min-width: 1366px){.slider4items__item .slider4items__title{font-size:1.8rem;line-height:2.0383333333;letter-spacing:.036rem}}@media (min-width: 1680px){.slider4items__item .slider4items__title{font-size:1.8rem;line-height:2.2222222222;letter-spacing:.036rem}}.slider4items__img{aspect-ratio:391/550;object-fit:cover;width:100%;margin-bottom:1.5rem}.slider4items__description{font-weight:400;font-size:1.4rem;line-height:3.4rem;letter-spacing:.03em;color:#616160;padding-inline:1rem;opacity:.6;font-size:1.6rem;line-height:1.625;letter-spacing:.032rem}@media (min-width: 1280px){.slider4items__description{font-size:2.2rem;line-height:1.8181818182;letter-spacing:.064rem}}.slider4items .js-slider-arrows::ng-deep i{color:#616160}\n"], dependencies: [{ kind: "directive", type: PuroSliderDirective, selector: "[puroSlider]", inputs: ["puroSlider"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: AutoImageZoomWrapperDirective, selector: "img[ngSrc], img[src]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
8272
+ constructor(el) {
8273
+ this.el = el;
8274
+ this.slides = 4;
8275
+ }
8276
+ ngAfterViewInit() {
8277
+ const section = this.el.nativeElement.querySelector('section');
8278
+ if (section) {
8279
+ section.setAttribute('data-slides_pc', String(this.slides));
8280
+ section.setAttribute('data-slides_laptop', String(this.slides));
8281
+ }
8282
+ }
8283
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroSlider4ItemsComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
8284
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroSlider4ItemsComponent, isStandalone: true, selector: "lib-puro-slider-4items", inputs: { title: "title", subtitle: "subtitle", items: "items", slides: "slides" }, ngImport: i0, template: "<section\n [puroSlider]=\"items\"\n class=\"slider4items js-active-slider\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-slider4items-slider\"\n data-slider_showbtns=\"true\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"false\"\n data-slider_autoplay=\"true\"\n data-slides_tablet=\"3\"\n data-slides_mobile=\"1 \"\n data-slides_mobile_small=\"1\"\n data-slides_mobile_xsmall=\"1\"\n>\n <div class=\"slider4items__title-section\">\n @if (title) {\n <h2 class=\"slider4items__title text__heading\">\n {{ title }}\n </h2>\n }\n @if (subtitle) {\n <p class=\"slider4items__subtitle\">\n {{ subtitle }}\n </p>\n }\n </div>\n @if (items && items.length > 0) {\n <div class=\"slider4items__inner relative\">\n <div class=\"slider4items__container\">\n <div class=\"js-slider4items-slider slider4items__slider\">\n @for (item of items; track $index) {\n <div>\n <div class=\"slider4items__item\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n [alt]=\"item.img.alt\"\n class=\"slider4items__img\"\n width=\"290\"\n height=\"400\"\n decoding=\"async\"\n />\n }\n @if (item.title) {\n <span\n class=\"slider4items__title text__heading\"\n >{{ item.title }}</span\n >\n }\n @if (item.description) {\n <p class=\"slider4items__description\" [innerHTML]=\"item.description\"></p>\n }\n </div>\n </div>\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n </div>\n }\n</section>\n", styles: [""], dependencies: [{ kind: "directive", type: PuroSliderDirective, selector: "[puroSlider]", inputs: ["puroSlider"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: AutoImageZoomWrapperDirective, selector: "img[ngSrc], img[src]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
8274
8285
  }
8275
8286
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroSlider4ItemsComponent, decorators: [{
8276
8287
  type: Component,
@@ -8278,13 +8289,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
8278
8289
  PuroSliderDirective,
8279
8290
  NgOptimizedImage,
8280
8291
  AutoImageZoomWrapperDirective,
8281
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n [puroSlider]=\"items\"\n class=\"slider4items js-active-slider\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-slider4items-slider\"\n data-slider_showbtns=\"true\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"false\"\n data-slider_autoplay=\"true\"\n data-slides_pc=\"4\"\n data-slides_laptop=\"4\"\n data-slides_tablet=\"3\"\n data-slides_mobile=\"1 \"\n data-slides_mobile_small=\"1\"\n data-slides_mobile_xsmall=\"1\"\n>\n <div class=\"slider4items__title-section\">\n @if (title) {\n <h2 class=\"slider4items__title text__heading\">\n {{ title }}\n </h2>\n }\n @if (subtitle) {\n <p class=\"slider4items__subtitle\">\n {{ subtitle }}\n </p>\n }\n </div>\n @if (items && items.length > 0) {\n <div class=\"slider4items__inner relative\">\n <div class=\"slider4items__container\">\n <div class=\"js-slider4items-slider slider4items__slider\">\n @for (item of items; track $index) {\n <div>\n <div class=\"slider4items__item\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n [alt]=\"item.img.alt\"\n class=\"slider4items__img\"\n width=\"290\"\n height=\"400\"\n decoding=\"async\"\n />\n }\n @if (item.title) {\n <span\n class=\"slider4items__title text__heading\"\n >{{ item.title }}</span\n >\n }\n @if (item.description) {\n <p class=\"slider4items__description\">\n {{ item.description }}\n </p>\n }\n </div>\n </div>\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n </div>\n }\n</section>\n", styles: [".slider4items{padding-block:3.5rem;transition:all .5s;position:relative;isolation:isolate;max-width:1700px;margin-inline:auto;overflow:hidden}@media (min-width: 768px){.slider4items{padding-block:6.8rem 7.091rem}}@media (min-width: 1024px){.slider4items{padding-block:2.8rem 3.9rem}}@media (min-width: 1680px){.slider4items{padding-block:7rem 5.3rem;padding-bottom:8.358rem}}.slider4items__title-section{text-align:center;margin-bottom:4rem}.slider4items__title-section .slider4items__title{font-size:2.4rem;line-height:1.52875;letter-spacing:.052rem;margin-bottom:2rem}@media (min-width: 540px){.slider4items__title-section .slider4items__title{font-size:2.4rem;line-height:1.6666666667;letter-spacing:.064rem}}@media (min-width: 768px){.slider4items__title-section .slider4items__title{font-size:2.4rem;line-height:2.0833333333;letter-spacing:.08rem}}@media (min-width: 1366px){.slider4items__title-section .slider4items__title{font-size:5rem;line-height:1.392;letter-spacing:.108rem;margin-bottom:3rem}}@media (min-width: 1680px){.slider4items__title-section .slider4items__title{font-size:5rem;line-height:1.23904;letter-spacing:.108rem;margin-bottom:3rem}}.slider4items__title-section .slider4items__subtitle{font-size:1.6rem;line-height:1.2;letter-spacing:.16rem}@media (min-width: 768px){.slider4items__title-section .slider4items__subtitle{font-size:2.2rem;line-height:1.2131818182;letter-spacing:.22rem}}.slider4items__title-section .slider4items__subtitle{font-weight:500;text-transform:uppercase;text-align:center}.slider4items__inner{position:relative;padding-inline:4.5rem}@media (min-width: 768px){.slider4items__inner{padding-inline:0}}.slider4items__container{padding-inline:2rem}@media (min-width: 768px){.slider4items__container{padding-inline:12.4rem 12.304rem}}@media (min-width: 1024px){.slider4items__container{padding-inline:10.3rem 9.5rem}}@media (min-width: 1680px){.slider4items__container{padding-inline:28.5rem}}.slider4items__slider ::ng-deep .slick-list{position:relative;left:50%;transform:translate(-50%);width:100%}.slider4items__slider ::ng-deep .slick-slide{transition:all .5s;padding-bottom:8px;padding-inline:1rem}.slider4items__item{width:100%;display:flex;flex-direction:column;justify-content:space-between;text-align:center}@media (max-width: 768px){.slider4items__item{position:relative;left:50%;transform:translate(-50%)}}.slider4items__item .slider4items__title{text-transform:uppercase;font-size:1.4rem;line-height:1.8571428571;letter-spacing:.036rem;margin-bottom:2rem}@media (min-width: 540px){.slider4items__item .slider4items__title{font-size:1.4rem;line-height:1.8571428571;letter-spacing:.028rem}}@media (min-width: 768px){.slider4items__item .slider4items__title{font-size:1.4rem;line-height:2.1428571429;letter-spacing:.028rem}}@media (min-width: 1366px){.slider4items__item .slider4items__title{font-size:1.8rem;line-height:2.0383333333;letter-spacing:.036rem}}@media (min-width: 1680px){.slider4items__item .slider4items__title{font-size:1.8rem;line-height:2.2222222222;letter-spacing:.036rem}}.slider4items__img{aspect-ratio:391/550;object-fit:cover;width:100%;margin-bottom:1.5rem}.slider4items__description{font-weight:400;font-size:1.4rem;line-height:3.4rem;letter-spacing:.03em;color:#616160;padding-inline:1rem;opacity:.6;font-size:1.6rem;line-height:1.625;letter-spacing:.032rem}@media (min-width: 1280px){.slider4items__description{font-size:2.2rem;line-height:1.8181818182;letter-spacing:.064rem}}.slider4items .js-slider-arrows::ng-deep i{color:#616160}\n"] }]
8282
- }], propDecorators: { title: [{
8292
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n [puroSlider]=\"items\"\n class=\"slider4items js-active-slider\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-slider4items-slider\"\n data-slider_showbtns=\"true\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"false\"\n data-slider_autoplay=\"true\"\n data-slides_tablet=\"3\"\n data-slides_mobile=\"1 \"\n data-slides_mobile_small=\"1\"\n data-slides_mobile_xsmall=\"1\"\n>\n <div class=\"slider4items__title-section\">\n @if (title) {\n <h2 class=\"slider4items__title text__heading\">\n {{ title }}\n </h2>\n }\n @if (subtitle) {\n <p class=\"slider4items__subtitle\">\n {{ subtitle }}\n </p>\n }\n </div>\n @if (items && items.length > 0) {\n <div class=\"slider4items__inner relative\">\n <div class=\"slider4items__container\">\n <div class=\"js-slider4items-slider slider4items__slider\">\n @for (item of items; track $index) {\n <div>\n <div class=\"slider4items__item\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n [alt]=\"item.img.alt\"\n class=\"slider4items__img\"\n width=\"290\"\n height=\"400\"\n decoding=\"async\"\n />\n }\n @if (item.title) {\n <span\n class=\"slider4items__title text__heading\"\n >{{ item.title }}</span\n >\n }\n @if (item.description) {\n <p class=\"slider4items__description\" [innerHTML]=\"item.description\"></p>\n }\n </div>\n </div>\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n </div>\n }\n</section>\n" }]
8293
+ }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { title: [{
8283
8294
  type: Input
8284
8295
  }], subtitle: [{
8285
8296
  type: Input
8286
8297
  }], items: [{
8287
8298
  type: Input
8299
+ }], slides: [{
8300
+ type: Input
8288
8301
  }] } });
8289
8302
 
8290
8303
  class PuroSlider1colComponent {