ctt-puro 0.44.1 → 0.44.3
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.
- package/esm2022/lib/components/puro-info-list/puro-info-list.component.mjs +3 -3
- package/esm2022/lib/components/puro-info-slider/puro-info-slider.component.mjs +3 -3
- package/esm2022/lib/components/puro-newsletter/puro-newsletter.component.mjs +3 -3
- package/fesm2022/ctt-puro.mjs +6 -6
- package/fesm2022/ctt-puro.mjs.map +1 -1
- package/package.json +1 -1
package/fesm2022/ctt-puro.mjs
CHANGED
|
@@ -7114,11 +7114,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7114
7114
|
|
|
7115
7115
|
class PuroInfoListComponent {
|
|
7116
7116
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroInfoListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7117
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroInfoListComponent, isStandalone: true, selector: "lib-puro-info-list", inputs: { img: "img", backgroundImg: "backgroundImg", smallImg: "smallImg", title: "title", description: "description", items: "items", tags: "tags", textColors: "textColors" }, ngImport: i0, template: "<section class=\"webmap generalMargin\">\n <div class=\"webmap__inner info-list\">\n <div class=\"info-list__wrapper\">\n @if (backgroundImg) {\n <img\n class=\"info-list__image--bg\"\n [ngSrc]=\"backgroundImg.src\"\n [alt]=\"backgroundImg.alt\"\n width=\"685\"\n height=\"685\"\n decoding=\"async\"\n />\n }\n @if (img) {\n <img\n class=\"info-list__image\"\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"575\"\n height=\"690\"\n decoding=\"async\"\n />\n }\n </div>\n\n <div class=\"info-list__content--wrapper\">\n <div class=\"info-list__content\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"info-list__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (description) {\n <p class=\"info-list__description\">\n {{ description }}\n </p>\n }\n <ul class=\"info-list__list\">\n @for (item of items || []; track $index) {\n <li class=\"info-list__item\">\n @if (smallImg) {\n <img\n [ngSrc]=\"smallImg.src\"\n [alt]=\"smallImg.alt\"\n class=\"info-list__item__img\"\n width=\"60\"\n height=\"60\"\n decoding=\"async\"\n />\n }\n <span class=\"info-list__description\">\n {{ item }}\n </span>\n </li>\n }\n </ul>\n </div>\n </div>\n </div>\n</section>\n", styles: [".info-list{display:flex;justify-content:space-between;flex-direction:column;transition:all .5s}@media (min-width: 1024px){.info-list{flex-direction:row}}.info-list>*{flex:1 1 50%}.info-list__content{width:100%}.info-list__content--wrapper{display:flex;align-items:center}.info-list__content{padding-top:
|
|
7117
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroInfoListComponent, isStandalone: true, selector: "lib-puro-info-list", inputs: { img: "img", backgroundImg: "backgroundImg", smallImg: "smallImg", title: "title", description: "description", items: "items", tags: "tags", textColors: "textColors" }, ngImport: i0, template: "<section class=\"webmap generalMargin\">\n <div class=\"webmap__inner info-list\">\n <div class=\"info-list__wrapper\">\n @if (backgroundImg) {\n <img\n class=\"info-list__image--bg\"\n [ngSrc]=\"backgroundImg.src\"\n [alt]=\"backgroundImg.alt\"\n width=\"685\"\n height=\"685\"\n decoding=\"async\"\n />\n }\n @if (img) {\n <img\n class=\"info-list__image\"\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"575\"\n height=\"690\"\n decoding=\"async\"\n />\n }\n </div>\n\n <div class=\"info-list__content--wrapper\">\n <div class=\"info-list__content\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"info-list__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (description) {\n <p class=\"info-list__description\">\n {{ description }}\n </p>\n }\n <ul class=\"info-list__list\">\n @for (item of items || []; track $index) {\n <li class=\"info-list__item\">\n @if (smallImg) {\n <img\n [ngSrc]=\"smallImg.src\"\n [alt]=\"smallImg.alt\"\n class=\"info-list__item__img\"\n width=\"60\"\n height=\"60\"\n decoding=\"async\"\n />\n }\n <span class=\"info-list__description\">\n {{ item }}\n </span>\n </li>\n }\n </ul>\n </div>\n </div>\n </div>\n</section>\n", styles: [".info-list{display:flex;justify-content:space-between;flex-direction:column;transition:all .5s}@media (min-width: 1024px){.info-list{flex-direction:row}}.info-list>*{flex:1 1 50%}.info-list__content{width:100%}.info-list__content--wrapper{display:flex;align-items:center}.info-list__content{padding-top:2rem;transition:all .5s;text-align:center}@media (min-width: 768px){.info-list__content{padding-top:3rem}}@media (min-width: 1024px){.info-list__content{padding-block:4.8rem;text-align:start}}.info-list__title{width:100%;transition:all .5s}@media (max-width: 1024px){.info-list__title{font-size:2.4rem;line-height:1.6666666667;letter-spacing:.048rem;margin-bottom:2rem}}@media (min-width: 1024px){.info-list__title{font-size:5rem;line-height:1.392;letter-spacing:.1rem;margin-bottom:3rem}}.info-list__description{display:inline-block;color:#616160;transition:all .5s}@media (max-width: 1024px){.info-list__description{font-size:1.4rem;line-height:2.1428571429;letter-spacing:.042rem}}@media (min-width: 1024px){.info-list__description{font-size:1.8rem;line-height:1.7;letter-spacing:.054rem}}.info-list__wrapper{position:relative;display:flex;justify-content:flex-start}@media (max-width: 1020px){.info-list__wrapper{justify-content:center}}.info-list__image{aspect-ratio:677/813;-o-object-fit:cover;object-fit:cover;border-top-left-radius:500px;border-top-right-radius:500px}.info-list__image--bg{position:absolute;z-index:-1}@media (max-width: 1024px){.info-list__image--bg{display:none}}@media (min-width: 1024px){.info-list__image--bg{top:-200px;right:-200px}}@media (min-width: 1280px){.info-list__image--bg{top:-175px;right:-190px}}.info-list__list{padding-top:10px}@media (min-width: 1024px){.info-list__list{padding-top:30px;padding-left:24px}}.info-list__item{display:flex;align-items:center;position:relative;padding-bottom:15px;text-transform:uppercase}@media (min-width: 1024px){.info-list__item{padding-bottom:40px;justify-content:flex-start}}.info-list__item__img{position:absolute;left:-30px}@media (max-width: 1024px){.info-list__item__img{position:relative;left:30px}}:host ::ng-deep .info-list__title{width:100%;transition:all .5s}@media (max-width: 1024px){:host ::ng-deep .info-list__title{font-size:2.4rem;line-height:1.6666666667;letter-spacing:.048rem;margin-bottom:2rem}}@media (min-width: 1024px){:host ::ng-deep .info-list__title{font-size:5rem;line-height:1.392;letter-spacing:.1rem;margin-bottom:3rem}}:host ::ng-deep .info-list__image--bg{animation:fan-rotate 14s ease-in-out infinite;transform-origin:center bottom;display:block}@keyframes fan-rotate{0%,to{transform:rotate(0) translateY(0)}25%{transform:rotate(6deg) translateY(-4px)}50%{transform:rotate(-6deg) translateY(4px)}75%{transform:rotate(3deg) translateY(-2px)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "component", type: PuroDynamicHeadingComponent, selector: "lib-puro-dynamic-heading", inputs: ["tag", "wrapper", "cssClass", "content", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7118
7118
|
}
|
|
7119
7119
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroInfoListComponent, decorators: [{
|
|
7120
7120
|
type: Component,
|
|
7121
|
-
args: [{ selector: 'lib-puro-info-list', standalone: true, imports: [CommonModule, NgOptimizedImage, PuroDynamicHeadingComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"webmap generalMargin\">\n <div class=\"webmap__inner info-list\">\n <div class=\"info-list__wrapper\">\n @if (backgroundImg) {\n <img\n class=\"info-list__image--bg\"\n [ngSrc]=\"backgroundImg.src\"\n [alt]=\"backgroundImg.alt\"\n width=\"685\"\n height=\"685\"\n decoding=\"async\"\n />\n }\n @if (img) {\n <img\n class=\"info-list__image\"\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"575\"\n height=\"690\"\n decoding=\"async\"\n />\n }\n </div>\n\n <div class=\"info-list__content--wrapper\">\n <div class=\"info-list__content\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"info-list__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (description) {\n <p class=\"info-list__description\">\n {{ description }}\n </p>\n }\n <ul class=\"info-list__list\">\n @for (item of items || []; track $index) {\n <li class=\"info-list__item\">\n @if (smallImg) {\n <img\n [ngSrc]=\"smallImg.src\"\n [alt]=\"smallImg.alt\"\n class=\"info-list__item__img\"\n width=\"60\"\n height=\"60\"\n decoding=\"async\"\n />\n }\n <span class=\"info-list__description\">\n {{ item }}\n </span>\n </li>\n }\n </ul>\n </div>\n </div>\n </div>\n</section>\n", styles: [".info-list{display:flex;justify-content:space-between;flex-direction:column;transition:all .5s}@media (min-width: 1024px){.info-list{flex-direction:row}}.info-list>*{flex:1 1 50%}.info-list__content{width:100%}.info-list__content--wrapper{display:flex;align-items:center}.info-list__content{padding-top:
|
|
7121
|
+
args: [{ selector: 'lib-puro-info-list', standalone: true, imports: [CommonModule, NgOptimizedImage, PuroDynamicHeadingComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"webmap generalMargin\">\n <div class=\"webmap__inner info-list\">\n <div class=\"info-list__wrapper\">\n @if (backgroundImg) {\n <img\n class=\"info-list__image--bg\"\n [ngSrc]=\"backgroundImg.src\"\n [alt]=\"backgroundImg.alt\"\n width=\"685\"\n height=\"685\"\n decoding=\"async\"\n />\n }\n @if (img) {\n <img\n class=\"info-list__image\"\n [ngSrc]=\"img.src\"\n [alt]=\"img.alt\"\n width=\"575\"\n height=\"690\"\n decoding=\"async\"\n />\n }\n </div>\n\n <div class=\"info-list__content--wrapper\">\n <div class=\"info-list__content\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"info-list__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (description) {\n <p class=\"info-list__description\">\n {{ description }}\n </p>\n }\n <ul class=\"info-list__list\">\n @for (item of items || []; track $index) {\n <li class=\"info-list__item\">\n @if (smallImg) {\n <img\n [ngSrc]=\"smallImg.src\"\n [alt]=\"smallImg.alt\"\n class=\"info-list__item__img\"\n width=\"60\"\n height=\"60\"\n decoding=\"async\"\n />\n }\n <span class=\"info-list__description\">\n {{ item }}\n </span>\n </li>\n }\n </ul>\n </div>\n </div>\n </div>\n</section>\n", styles: [".info-list{display:flex;justify-content:space-between;flex-direction:column;transition:all .5s}@media (min-width: 1024px){.info-list{flex-direction:row}}.info-list>*{flex:1 1 50%}.info-list__content{width:100%}.info-list__content--wrapper{display:flex;align-items:center}.info-list__content{padding-top:2rem;transition:all .5s;text-align:center}@media (min-width: 768px){.info-list__content{padding-top:3rem}}@media (min-width: 1024px){.info-list__content{padding-block:4.8rem;text-align:start}}.info-list__title{width:100%;transition:all .5s}@media (max-width: 1024px){.info-list__title{font-size:2.4rem;line-height:1.6666666667;letter-spacing:.048rem;margin-bottom:2rem}}@media (min-width: 1024px){.info-list__title{font-size:5rem;line-height:1.392;letter-spacing:.1rem;margin-bottom:3rem}}.info-list__description{display:inline-block;color:#616160;transition:all .5s}@media (max-width: 1024px){.info-list__description{font-size:1.4rem;line-height:2.1428571429;letter-spacing:.042rem}}@media (min-width: 1024px){.info-list__description{font-size:1.8rem;line-height:1.7;letter-spacing:.054rem}}.info-list__wrapper{position:relative;display:flex;justify-content:flex-start}@media (max-width: 1020px){.info-list__wrapper{justify-content:center}}.info-list__image{aspect-ratio:677/813;-o-object-fit:cover;object-fit:cover;border-top-left-radius:500px;border-top-right-radius:500px}.info-list__image--bg{position:absolute;z-index:-1}@media (max-width: 1024px){.info-list__image--bg{display:none}}@media (min-width: 1024px){.info-list__image--bg{top:-200px;right:-200px}}@media (min-width: 1280px){.info-list__image--bg{top:-175px;right:-190px}}.info-list__list{padding-top:10px}@media (min-width: 1024px){.info-list__list{padding-top:30px;padding-left:24px}}.info-list__item{display:flex;align-items:center;position:relative;padding-bottom:15px;text-transform:uppercase}@media (min-width: 1024px){.info-list__item{padding-bottom:40px;justify-content:flex-start}}.info-list__item__img{position:absolute;left:-30px}@media (max-width: 1024px){.info-list__item__img{position:relative;left:30px}}:host ::ng-deep .info-list__title{width:100%;transition:all .5s}@media (max-width: 1024px){:host ::ng-deep .info-list__title{font-size:2.4rem;line-height:1.6666666667;letter-spacing:.048rem;margin-bottom:2rem}}@media (min-width: 1024px){:host ::ng-deep .info-list__title{font-size:5rem;line-height:1.392;letter-spacing:.1rem;margin-bottom:3rem}}:host ::ng-deep .info-list__image--bg{animation:fan-rotate 14s ease-in-out infinite;transform-origin:center bottom;display:block}@keyframes fan-rotate{0%,to{transform:rotate(0) translateY(0)}25%{transform:rotate(6deg) translateY(-4px)}50%{transform:rotate(-6deg) translateY(4px)}75%{transform:rotate(3deg) translateY(-2px)}}\n"] }]
|
|
7122
7122
|
}], propDecorators: { img: [{
|
|
7123
7123
|
type: Input
|
|
7124
7124
|
}], backgroundImg: [{
|
|
@@ -7158,11 +7158,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7158
7158
|
|
|
7159
7159
|
class PuroInfoSliderComponent {
|
|
7160
7160
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroInfoSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7161
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroInfoSliderComponent, isStandalone: true, selector: "lib-puro-info-slider", inputs: { items: "items", reverse: "reverse" }, ngImport: i0, template: "<section\n class=\"textPhotoCarousel js-active-slider
|
|
7161
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroInfoSliderComponent, isStandalone: true, selector: "lib-puro-info-slider", inputs: { items: "items", reverse: "reverse" }, ngImport: i0, template: "<section\n class=\"textPhotoCarousel js-active-slider\"\n [puroSlider]=\"items\"\n [ngClass]=\"{\n 'textPhotoCarousel--right': !reverse\n }\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-slider\"\n data-slider_showbtns=\"true\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"true\"\n data-slider_autoplay=\"true\"\n data-slides_pc=\"1\"\n resizeZoom\n>\n <div class=\"relative\">\n <div class=\"js-slider js-slider_fix-arrows\">\n @for (item of items; track $index) {\n <div class=\"textPhotoCarousel__item\">\n <div class=\"textPhotoCarousel__image--outer\">\n <div\n class=\"textPhotoCarousel__image js-slider_fix-arrows-zone\"\n >\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n [alt]=\"item.img.alt\"\n width=\"960\"\n height=\"807\"\n class=\"textPhotoCarousel__img\"\n decoding=\"async\"\n />\n }\n </div>\n </div>\n <div\n class=\"textPhotoCarousel__content textPhotoCarousel__content--alignCenter\"\n >\n <div>\n @if (item.pretitle) {\n <span class=\"textPhotoCarousel__title\">{{\n item.pretitle\n }}</span>\n }\n @if (item.title) {\n <h2\n class=\"textPhotoCarousel__heading\"\n [innerHTML]=\"item.title\"\n ></h2>\n }\n @if (item.subtitle) {\n <p class=\"textPhotoCarousel__subHeading\">\n {{ item.subtitle }}\n </p>\n }\n @if (item.description) {\n <div>\n <p\n class=\"textPhotoCarousel__paragraph\"\n [innerHTML]=\"item.description\"\n ></p>\n </div>\n }\n <div class=\"btn__group\">\n @if (item.buttons?.length) {\n @for (\n button of item.buttons;\n track $index\n ) {\n <a\n [href]=\"button.url\"\n [linkType]=\"button.linkType\"\n class=\"btn\"\n [ngClass]=\"{\n 'btn__primary--outline': $even,\n btn__primary: $odd,\n }\"\n [attr.aria-label]=\"button.label\"\n >\n <span>{{ button.label }}</span>\n </a>\n }\n }\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n</section>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: PuroLinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href", "modalClick"], outputs: ["bookClick", "anchorClicked"] }, { 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: PuroResizeZoomDirective, selector: "[resizeZoom]" }] }); }
|
|
7162
7162
|
}
|
|
7163
7163
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroInfoSliderComponent, decorators: [{
|
|
7164
7164
|
type: Component,
|
|
7165
|
-
args: [{ selector: 'lib-puro-info-slider', standalone: true, imports: [CommonModule, PuroLinkTypeDirective, PuroSliderDirective, NgOptimizedImage, PuroResizeZoomDirective, PuroResizeZoomDirective], template: "<section\n class=\"textPhotoCarousel js-active-slider
|
|
7165
|
+
args: [{ selector: 'lib-puro-info-slider', standalone: true, imports: [CommonModule, PuroLinkTypeDirective, PuroSliderDirective, NgOptimizedImage, PuroResizeZoomDirective, PuroResizeZoomDirective], template: "<section\n class=\"textPhotoCarousel js-active-slider\"\n [puroSlider]=\"items\"\n [ngClass]=\"{\n 'textPhotoCarousel--right': !reverse\n }\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-slider\"\n data-slider_showbtns=\"true\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"true\"\n data-slider_autoplay=\"true\"\n data-slides_pc=\"1\"\n resizeZoom\n>\n <div class=\"relative\">\n <div class=\"js-slider js-slider_fix-arrows\">\n @for (item of items; track $index) {\n <div class=\"textPhotoCarousel__item\">\n <div class=\"textPhotoCarousel__image--outer\">\n <div\n class=\"textPhotoCarousel__image js-slider_fix-arrows-zone\"\n >\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n [alt]=\"item.img.alt\"\n width=\"960\"\n height=\"807\"\n class=\"textPhotoCarousel__img\"\n decoding=\"async\"\n />\n }\n </div>\n </div>\n <div\n class=\"textPhotoCarousel__content textPhotoCarousel__content--alignCenter\"\n >\n <div>\n @if (item.pretitle) {\n <span class=\"textPhotoCarousel__title\">{{\n item.pretitle\n }}</span>\n }\n @if (item.title) {\n <h2\n class=\"textPhotoCarousel__heading\"\n [innerHTML]=\"item.title\"\n ></h2>\n }\n @if (item.subtitle) {\n <p class=\"textPhotoCarousel__subHeading\">\n {{ item.subtitle }}\n </p>\n }\n @if (item.description) {\n <div>\n <p\n class=\"textPhotoCarousel__paragraph\"\n [innerHTML]=\"item.description\"\n ></p>\n </div>\n }\n <div class=\"btn__group\">\n @if (item.buttons?.length) {\n @for (\n button of item.buttons;\n track $index\n ) {\n <a\n [href]=\"button.url\"\n [linkType]=\"button.linkType\"\n class=\"btn\"\n [ngClass]=\"{\n 'btn__primary--outline': $even,\n btn__primary: $odd,\n }\"\n [attr.aria-label]=\"button.label\"\n >\n <span>{{ button.label }}</span>\n </a>\n }\n }\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n</section>\n" }]
|
|
7166
7166
|
}], propDecorators: { items: [{
|
|
7167
7167
|
type: Input
|
|
7168
7168
|
}], reverse: [{
|
|
@@ -7548,7 +7548,7 @@ class PuroNewsletterComponent {
|
|
|
7548
7548
|
this.cdr.markForCheck();
|
|
7549
7549
|
}
|
|
7550
7550
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroNewsletterComponent, deps: [{ token: i1$3.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7551
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroNewsletterComponent, isStandalone: true, selector: "lib-puro-newsletter", inputs: { title: "title", subtitle: "subtitle", description: "description", image: "image", email: "email", lang: "lang", country: "country", center: "center", resident: "resident", conditions: "conditions", button: "button", tags: "tags", textColors: "textColors" }, outputs: { submitFormValue: "submitFormValue" }, ngImport: i0, template: "<section class=\"newsletter\">\n @if (image) {\n <div class=\"newsletter__graphic\">\n <img\n [ngSrc]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"newsletter__graphic--img\"\n width=\"960\"\n height=\"985\"\n decoding=\"async\"\n />\n </div>\n }\n <div class=\"newsletter__content\">\n <div class=\"newsletter__contentInner\">\n <div class=\"newsletter__headingSection\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"newsletter__heading\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (subtitle) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.subtitle || 'p'\"\n cssClass=\"newsletter__subHeading\"\n [color]=\"textColors?.subtitle\"\n [content]=\"subtitle\"\n ></lib-puro-dynamic-heading>\n }\n </div>\n @if (description) {\n <p class=\"newsletter__paragraph\">{{ description }}</p>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (email) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n [placeholder]=\"email.placeholder\"\n [formControlName]=\"email.name!\"\n (blur)=\"validateInput(email)\"\n (input)=\"inputChange($event, email)\"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"19\"\n height=\"15\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n\n @if (!email.valid()) {\n <span class=\"form-error\">{{\n email.error\n }}</span>\n }\n }\n </div>\n <div class=\"newsletterForm__col\">\n @if (lang) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"lang\"\n >\n <option value=\"\" disabled selected>\n {{ lang.placeholder }}\n </option>\n @for (\n option of lang.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (country) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"country\"\n >\n <option value=\"\">\n {{ country.placeholder }}\n </option>\n @for (\n option of country.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 class=\"newsletterForm__col\">\n @if (center) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"center\"\n >\n <option value=\"\">\n {{ center.placeholder }}\n </option>\n @for (\n option of center.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (resident) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"resident\"\n >\n <option value=\"\">\n {{ resident.placeholder }}\n </option>\n @for (\n option of resident.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n <div class=\"block-checkbox\">\n @if (conditions) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\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]=\"conditions\"></span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (button) {\n <button\n type=\"submit\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"button.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm($event)\"\n >\n <span>{{ button.label }}</span>\n </button>\n }\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [".newsletter__content,.newsletterForm__col .form__group .form__control{background-color:#f9f5ed}\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: "component", type: PuroDynamicHeadingComponent, selector: "lib-puro-dynamic-heading", inputs: ["tag", "wrapper", "cssClass", "content", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7551
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroNewsletterComponent, isStandalone: true, selector: "lib-puro-newsletter", inputs: { title: "title", subtitle: "subtitle", description: "description", image: "image", email: "email", lang: "lang", country: "country", center: "center", resident: "resident", conditions: "conditions", button: "button", tags: "tags", textColors: "textColors" }, outputs: { submitFormValue: "submitFormValue" }, ngImport: i0, template: "<section class=\"newsletter\">\n @if (image) {\n <div class=\"newsletter__graphic\">\n <img\n [ngSrc]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"newsletter__graphic--img\"\n width=\"960\"\n height=\"985\"\n fetchpriority=\"high\"\n priority\n />\n </div>\n }\n <div class=\"newsletter__content\">\n <div class=\"newsletter__contentInner\">\n <div class=\"newsletter__headingSection\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"newsletter__heading\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (subtitle) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.subtitle || 'p'\"\n cssClass=\"newsletter__subHeading\"\n [color]=\"textColors?.subtitle\"\n [content]=\"subtitle\"\n ></lib-puro-dynamic-heading>\n }\n </div>\n @if (description) {\n <p class=\"newsletter__paragraph\">{{ description }}</p>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (email) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n [placeholder]=\"email.placeholder\"\n [formControlName]=\"email.name!\"\n (blur)=\"validateInput(email)\"\n (input)=\"inputChange($event, email)\"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"19\"\n height=\"15\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n\n @if (!email.valid()) {\n <span class=\"form-error\">{{\n email.error\n }}</span>\n }\n }\n </div>\n <div class=\"newsletterForm__col\">\n @if (lang) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"lang\"\n >\n <option value=\"\" disabled selected>\n {{ lang.placeholder }}\n </option>\n @for (\n option of lang.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (country) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"country\"\n >\n <option value=\"\">\n {{ country.placeholder }}\n </option>\n @for (\n option of country.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 class=\"newsletterForm__col\">\n @if (center) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"center\"\n >\n <option value=\"\">\n {{ center.placeholder }}\n </option>\n @for (\n option of center.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (resident) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"resident\"\n >\n <option value=\"\">\n {{ resident.placeholder }}\n </option>\n @for (\n option of resident.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n <div class=\"block-checkbox\">\n @if (conditions) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\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]=\"conditions\"></span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (button) {\n <button\n type=\"submit\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"button.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm($event)\"\n >\n <span>{{ button.label }}</span>\n </button>\n }\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [".newsletter__content,.newsletterForm__col .form__group .form__control{background-color:#f9f5ed}\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: "component", type: PuroDynamicHeadingComponent, selector: "lib-puro-dynamic-heading", inputs: ["tag", "wrapper", "cssClass", "content", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7552
7552
|
}
|
|
7553
7553
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroNewsletterComponent, decorators: [{
|
|
7554
7554
|
type: Component,
|
|
@@ -7558,7 +7558,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7558
7558
|
ReactiveFormsModule,
|
|
7559
7559
|
NgOptimizedImage,
|
|
7560
7560
|
PuroDynamicHeadingComponent,
|
|
7561
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"newsletter\">\n @if (image) {\n <div class=\"newsletter__graphic\">\n <img\n [ngSrc]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"newsletter__graphic--img\"\n width=\"960\"\n height=\"985\"\n decoding=\"async\"\n />\n </div>\n }\n <div class=\"newsletter__content\">\n <div class=\"newsletter__contentInner\">\n <div class=\"newsletter__headingSection\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"newsletter__heading\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (subtitle) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.subtitle || 'p'\"\n cssClass=\"newsletter__subHeading\"\n [color]=\"textColors?.subtitle\"\n [content]=\"subtitle\"\n ></lib-puro-dynamic-heading>\n }\n </div>\n @if (description) {\n <p class=\"newsletter__paragraph\">{{ description }}</p>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (email) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n [placeholder]=\"email.placeholder\"\n [formControlName]=\"email.name!\"\n (blur)=\"validateInput(email)\"\n (input)=\"inputChange($event, email)\"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"19\"\n height=\"15\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n\n @if (!email.valid()) {\n <span class=\"form-error\">{{\n email.error\n }}</span>\n }\n }\n </div>\n <div class=\"newsletterForm__col\">\n @if (lang) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"lang\"\n >\n <option value=\"\" disabled selected>\n {{ lang.placeholder }}\n </option>\n @for (\n option of lang.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (country) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"country\"\n >\n <option value=\"\">\n {{ country.placeholder }}\n </option>\n @for (\n option of country.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 class=\"newsletterForm__col\">\n @if (center) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"center\"\n >\n <option value=\"\">\n {{ center.placeholder }}\n </option>\n @for (\n option of center.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (resident) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"resident\"\n >\n <option value=\"\">\n {{ resident.placeholder }}\n </option>\n @for (\n option of resident.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n <div class=\"block-checkbox\">\n @if (conditions) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\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]=\"conditions\"></span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (button) {\n <button\n type=\"submit\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"button.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm($event)\"\n >\n <span>{{ button.label }}</span>\n </button>\n }\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [".newsletter__content,.newsletterForm__col .form__group .form__control{background-color:#f9f5ed}\n"] }]
|
|
7561
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"newsletter\">\n @if (image) {\n <div class=\"newsletter__graphic\">\n <img\n [ngSrc]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"newsletter__graphic--img\"\n width=\"960\"\n height=\"985\"\n fetchpriority=\"high\"\n priority\n />\n </div>\n }\n <div class=\"newsletter__content\">\n <div class=\"newsletter__contentInner\">\n <div class=\"newsletter__headingSection\">\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'h2'\"\n cssClass=\"newsletter__heading\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n @if (subtitle) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.subtitle || 'p'\"\n cssClass=\"newsletter__subHeading\"\n [color]=\"textColors?.subtitle\"\n [content]=\"subtitle\"\n ></lib-puro-dynamic-heading>\n }\n </div>\n @if (description) {\n <p class=\"newsletter__paragraph\">{{ description }}</p>\n }\n @if (formReady$()) {\n <form [formGroup]=\"form\" class=\"form\" (ngSubmit)=\"submitForm()\">\n <div class=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (email) {\n <div class=\"form__group withIcon\">\n <input\n type=\"email\"\n class=\"form__control\"\n [placeholder]=\"email.placeholder\"\n [formControlName]=\"email.name!\"\n (blur)=\"validateInput(email)\"\n (input)=\"inputChange($event, email)\"\n />\n <span class=\"icon-right\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"19\"\n height=\"15\"\n >\n <use href=\"#email\"></use>\n </svg>\n </span>\n </div>\n\n @if (!email.valid()) {\n <span class=\"form-error\">{{\n email.error\n }}</span>\n }\n }\n </div>\n <div class=\"newsletterForm__col\">\n @if (lang) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"lang\"\n >\n <option value=\"\" disabled selected>\n {{ lang.placeholder }}\n </option>\n @for (\n option of lang.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (country) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"country\"\n >\n <option value=\"\">\n {{ country.placeholder }}\n </option>\n @for (\n option of country.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 class=\"newsletterForm__col\">\n @if (center) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"center\"\n >\n <option value=\"\">\n {{ center.placeholder }}\n </option>\n @for (\n option of center.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n @if (resident) {\n <div class=\"form__group withIcon\">\n <select\n class=\"form__control\"\n formControlName=\"resident\"\n >\n <option value=\"\">\n {{ resident.placeholder }}\n </option>\n @for (\n option of resident.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=\"newsletterForm__row\">\n <div class=\"newsletterForm__col\">\n <div class=\"block-checkbox\">\n @if (conditions) {\n <label class=\"form__checkbox\">\n <input\n type=\"checkbox\"\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]=\"conditions\"></span>\n </label>\n }\n </div>\n </div>\n </div>\n\n <div class=\"btn__group\">\n @if (button) {\n <button\n type=\"submit\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"button.label\"\n [disabled]=\"!form.valid\"\n (click)=\"submitForm($event)\"\n >\n <span>{{ button.label }}</span>\n </button>\n }\n </div>\n </form>\n }\n </div>\n </div>\n</section>\n", styles: [".newsletter__content,.newsletterForm__col .form__group .form__control{background-color:#f9f5ed}\n"] }]
|
|
7562
7562
|
}], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: i0.ChangeDetectorRef }], propDecorators: { title: [{
|
|
7563
7563
|
type: Input
|
|
7564
7564
|
}], subtitle: [{
|