ctt-puro 0.49.4 → 0.50.0
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-grid4items/puro-grid4items.component.mjs +3 -3
- package/esm2022/lib/components/puro-grid5items/puro-grid5items.component.mjs +3 -3
- package/esm2022/lib/components/puro-header/puro-header.component.mjs +5 -3
- package/esm2022/lib/components/puro-header/puro-header.interface.mjs +1 -1
- package/esm2022/lib/components/puro-submenu/puro-submenu.component.mjs +3 -3
- package/esm2022/lib/components/puro-top-slider/puro-top-slider.component.mjs +5 -3
- package/esm2022/lib/components/puro-top-slider/puro-top-slider.interface.mjs +1 -1
- package/fesm2022/ctt-puro.mjs +14 -10
- package/fesm2022/ctt-puro.mjs.map +1 -1
- package/lib/components/puro-header/puro-header.component.d.ts +2 -1
- package/lib/components/puro-header/puro-header.interface.d.ts +1 -0
- package/lib/components/puro-top-slider/puro-top-slider.component.d.ts +2 -1
- package/lib/components/puro-top-slider/puro-top-slider.interface.d.ts +1 -0
- package/package.json +1 -1
package/fesm2022/ctt-puro.mjs
CHANGED
|
@@ -6886,7 +6886,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
6886
6886
|
|
|
6887
6887
|
class PuroGrid4itemsComponent {
|
|
6888
6888
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroGrid4itemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6889
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroGrid4itemsComponent, isStandalone: true, selector: "lib-puro-grid4items", inputs: { title: "title", items: "items", button: "button", tags: "tags", textColors: "textColors" }, ngImport: i0, template: "<section\n class=\"imageGrid js-active-slider generalMargin\"\n [puroSlider]=\"items\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-imageGrid-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>\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"imageGrid__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n <!-- desktop view S -->\n <div class=\"imageGrid__desktop imageGrid__for-4\">\n @for (item of items || []; track $index) {\n <div class=\"imageGrid__item\">\n @if (item?.link?.url) {\n <a\n [href]=\"item.link ? item.link.url : ''\"\n class=\"imageGrid__box\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <span>{{ item?.link?.label }}</span>\n </button>\n }\n </div>\n </div>\n </a>\n }\n
|
|
6889
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroGrid4itemsComponent, isStandalone: true, selector: "lib-puro-grid4items", inputs: { title: "title", items: "items", button: "button", tags: "tags", textColors: "textColors" }, ngImport: i0, template: "<section\n class=\"imageGrid js-active-slider generalMargin\"\n [puroSlider]=\"items\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-imageGrid-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>\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"imageGrid__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n <!-- desktop view S -->\n <div class=\"imageGrid__desktop imageGrid__for-4\">\n @for (item of items || []; track $index) {\n <div class=\"imageGrid__item\">\n @if (item?.link?.url) {\n <a\n [href]=\"item.link ? item.link.url : ''\"\n class=\"imageGrid__box\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <span>{{ item?.link?.label }}</span>\n </button>\n }\n </div>\n </div>\n </a>\n } @else {\n <div class=\"imageGrid__box\">\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <span>{{ item?.link?.label }}</span>\n </button>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n <div class=\"btn__group\">\n @if (button) {\n <a\n [linkType]=\"button.linkType\"\n [href]=\"button.url\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"button.label\"\n ><span>{{ button.label }}</span></a\n >\n }\n </div>\n </div>\n <!-- desktop view E -->\n <!-- mobile view S -->\n <div class=\"imageGrid__mobile relative\">\n <div class=\"js-imageGrid-slider js-slider_fix-arrows\">\n @for (item of items || []; track $index) {\n <div>\n <div class=\"imageGrid__box\">\n <div\n class=\"imageGrid__graphic js-slider_fix-arrows-zone\"\n >\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n width=\"499\"\n height=\"472\"\n [alt]=\"item.img.alt\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <span class=\"imageGrid__subHeading\">{{\n item.subtitle\n }}</span>\n }\n </div>\n <div class=\"btn__group\">\n @if (item.link) {\n <a\n [linkType]=\"item.link.linkType\"\n [href]=\"item.link.url\"\n class=\"btn__link\"\n [attr.aria-label]=\"item.link.label\"\n ><span>{{ item.link.label }}</span></a\n >\n }\n </div>\n </div>\n </div>\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n <!-- mobile view E -->\n</section>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: PuroSliderDirective, selector: "[puroSlider]", inputs: ["puroSlider"] }, { kind: "directive", type: PuroLinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href", "modalClick"], outputs: ["bookClick", "anchorClicked"] }, { 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]" }, { kind: "component", type: PuroDynamicHeadingComponent, selector: "lib-puro-dynamic-heading", inputs: ["tag", "wrapper", "cssClass", "content", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6890
6890
|
}
|
|
6891
6891
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroGrid4itemsComponent, decorators: [{
|
|
6892
6892
|
type: Component,
|
|
@@ -6897,7 +6897,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
6897
6897
|
NgOptimizedImage,
|
|
6898
6898
|
AutoImageZoomWrapperDirective,
|
|
6899
6899
|
PuroDynamicHeadingComponent,
|
|
6900
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n class=\"imageGrid js-active-slider generalMargin\"\n [puroSlider]=\"items\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-imageGrid-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>\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"imageGrid__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n <!-- desktop view S -->\n <div class=\"imageGrid__desktop imageGrid__for-4\">\n @for (item of items || []; track $index) {\n <div class=\"imageGrid__item\">\n @if (item?.link?.url) {\n <a\n [href]=\"item.link ? item.link.url : ''\"\n class=\"imageGrid__box\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <span>{{ item?.link?.label }}</span>\n </button>\n }\n </div>\n </div>\n </a>\n }\n
|
|
6900
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n class=\"imageGrid js-active-slider generalMargin\"\n [puroSlider]=\"items\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-imageGrid-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>\n @if (title) {\n <lib-puro-dynamic-heading\n [tag]=\"tags?.title || 'span'\"\n cssClass=\"imageGrid__title\"\n [color]=\"textColors?.title\"\n [content]=\"title\"\n ></lib-puro-dynamic-heading>\n }\n <!-- desktop view S -->\n <div class=\"imageGrid__desktop imageGrid__for-4\">\n @for (item of items || []; track $index) {\n <div class=\"imageGrid__item\">\n @if (item?.link?.url) {\n <a\n [href]=\"item.link ? item.link.url : ''\"\n class=\"imageGrid__box\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <span>{{ item?.link?.label }}</span>\n </button>\n }\n </div>\n </div>\n </a>\n } @else {\n <div class=\"imageGrid__box\">\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item?.link?.label\"\n >\n <span>{{ item?.link?.label }}</span>\n </button>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n <div class=\"btn__group\">\n @if (button) {\n <a\n [linkType]=\"button.linkType\"\n [href]=\"button.url\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"button.label\"\n ><span>{{ button.label }}</span></a\n >\n }\n </div>\n </div>\n <!-- desktop view E -->\n <!-- mobile view S -->\n <div class=\"imageGrid__mobile relative\">\n <div class=\"js-imageGrid-slider js-slider_fix-arrows\">\n @for (item of items || []; track $index) {\n <div>\n <div class=\"imageGrid__box\">\n <div\n class=\"imageGrid__graphic js-slider_fix-arrows-zone\"\n >\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n width=\"499\"\n height=\"472\"\n [alt]=\"item.img.alt\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <span class=\"imageGrid__subHeading\">{{\n item.subtitle\n }}</span>\n }\n </div>\n <div class=\"btn__group\">\n @if (item.link) {\n <a\n [linkType]=\"item.link.linkType\"\n [href]=\"item.link.url\"\n class=\"btn__link\"\n [attr.aria-label]=\"item.link.label\"\n ><span>{{ item.link.label }}</span></a\n >\n }\n </div>\n </div>\n </div>\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n <!-- mobile view E -->\n</section>\n" }]
|
|
6901
6901
|
}], propDecorators: { title: [{
|
|
6902
6902
|
type: Input
|
|
6903
6903
|
}], items: [{
|
|
@@ -6915,7 +6915,7 @@ class PuroGrid5itemsComponent {
|
|
|
6915
6915
|
this.items = input();
|
|
6916
6916
|
}
|
|
6917
6917
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroGrid5itemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6918
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroGrid5itemsComponent, isStandalone: true, selector: "lib-puro-grid5items", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, button: { classPropertyName: "button", publicName: "button", isSignal: false, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<section\n class=\"imageGrid js-active-slider generalMargin\"\n [puroSlider]=\"items()\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-imageGrid-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>\n @if (title) {\n <span class=\"imageGrid__title\">{{ title }}</span>\n }\n <!-- desktop view S -->\n <div class=\"imageGrid__desktop imageGrid__for-5\">\n @for (item of items(); track $index) {\n @if (item) {\n <div class=\"imageGrid__item\">\n @if (item.link?.url) {\n <a\n [href]=\"item.link?.url\"\n [linkType]=\"item.link?.linkType\"\n class=\"imageGrid__box\"\n [ngClass]=\"{ 'imageGrid__box--right': $last }\"\n [attr.aria-label]=\"item.link?.label ?? 'Item link'\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n priority\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\"
|
|
6918
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroGrid5itemsComponent, isStandalone: true, selector: "lib-puro-grid5items", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, button: { classPropertyName: "button", publicName: "button", isSignal: false, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<section\n class=\"imageGrid js-active-slider generalMargin\"\n [puroSlider]=\"items()\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-imageGrid-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>\n @if (title) {\n <span class=\"imageGrid__title\">{{ title }}</span>\n }\n <!-- desktop view S -->\n <div class=\"imageGrid__desktop imageGrid__for-5\">\n @for (item of items(); track $index) {\n @if (item) {\n <div class=\"imageGrid__item\">\n @if (item.link?.url) {\n <a\n [href]=\"item.link?.url\"\n [linkType]=\"item.link?.linkType\"\n class=\"imageGrid__box\"\n [ngClass]=\"{ 'imageGrid__box--right': $last }\"\n [attr.aria-label]=\"item.link?.label ?? 'Item link'\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n priority\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item.link.label\"\n >\n <span>{{ item.link.label }}</span>\n </button>\n }\n </div>\n </div>\n </a>\n } @else {\n <div\n class=\"imageGrid__box\"\n [ngClass]=\"{ 'imageGrid__box--right': $last }\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n priority\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item.link.label\"\n >\n <span>{{ item.link.label }}</span>\n </button>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n }\n\n <div class=\"btn__group\">\n @if (button) {\n <a\n [linkType]=\"button.linkType\"\n [href]=\"button.url\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"button.label\"\n ><span>{{ button.label }}</span></a\n >\n }\n </div>\n </div>\n <!-- desktop view E -->\n <!-- mobile view S -->\n <div class=\"imageGrid__mobile relative\">\n <div class=\"js-imageGrid-slider js-slider_fix-arrows\">\n @for (item of items(); track $index) {\n @if (item) {\n <div>\n <div class=\"imageGrid__box\">\n <div\n class=\"imageGrid__graphic js-slider_fix-arrows-zone\"\n >\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n width=\"499\"\n height=\"472\"\n [alt]=\"item.img.alt\"\n priority\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <span class=\"imageGrid__subHeading\">{{\n item.subtitle\n }}</span>\n }\n </div>\n <div class=\"btn__group\">\n @if (item.link) {\n <a\n [linkType]=\"item.link.linkType\"\n [href]=\"item.link.url\"\n class=\"btn__link\"\n [attr.aria-label]=\"item.link.label\"\n ><span>{{ item.link.label }}</span></a\n >\n }\n </div>\n </div>\n </div>\n }\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n <!-- mobile view E -->\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: AutoImageZoomWrapperDirective, selector: "img[ngSrc], img[src]" }] }); }
|
|
6919
6919
|
}
|
|
6920
6920
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroGrid5itemsComponent, decorators: [{
|
|
6921
6921
|
type: Component,
|
|
@@ -6925,7 +6925,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
6925
6925
|
PuroSliderDirective,
|
|
6926
6926
|
NgOptimizedImage,
|
|
6927
6927
|
AutoImageZoomWrapperDirective,
|
|
6928
|
-
], template: "<section\n class=\"imageGrid js-active-slider generalMargin\"\n [puroSlider]=\"items()\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-imageGrid-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>\n @if (title) {\n <span class=\"imageGrid__title\">{{ title }}</span>\n }\n <!-- desktop view S -->\n <div class=\"imageGrid__desktop imageGrid__for-5\">\n @for (item of items(); track $index) {\n @if (item) {\n <div class=\"imageGrid__item\">\n @if (item.link?.url) {\n <a\n [href]=\"item.link?.url\"\n [linkType]=\"item.link?.linkType\"\n class=\"imageGrid__box\"\n [ngClass]=\"{ 'imageGrid__box--right': $last }\"\n [attr.aria-label]=\"item.link?.label ?? 'Item link'\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n priority\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\"
|
|
6928
|
+
], template: "<section\n class=\"imageGrid js-active-slider generalMargin\"\n [puroSlider]=\"items()\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-imageGrid-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>\n @if (title) {\n <span class=\"imageGrid__title\">{{ title }}</span>\n }\n <!-- desktop view S -->\n <div class=\"imageGrid__desktop imageGrid__for-5\">\n @for (item of items(); track $index) {\n @if (item) {\n <div class=\"imageGrid__item\">\n @if (item.link?.url) {\n <a\n [href]=\"item.link?.url\"\n [linkType]=\"item.link?.linkType\"\n class=\"imageGrid__box\"\n [ngClass]=\"{ 'imageGrid__box--right': $last }\"\n [attr.aria-label]=\"item.link?.label ?? 'Item link'\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n priority\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item.link.label\"\n >\n <span>{{ item.link.label }}</span>\n </button>\n }\n </div>\n </div>\n </a>\n } @else {\n <div\n class=\"imageGrid__box\"\n [ngClass]=\"{ 'imageGrid__box--right': $last }\"\n >\n <div class=\"imageGrid__graphic\">\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n [alt]=\"item.img.alt\"\n priority\n width=\"360\"\n height=\"340\"\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading photo\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <p class=\"imageGrid__subHeading photo\">\n {{ item.subtitle }}\n </p>\n }\n <div class=\"btn__group\">\n @if (item.link) {\n <button\n class=\"btn__link\"\n [attr.aria-label]=\"item.link.label\"\n >\n <span>{{ item.link.label }}</span>\n </button>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n }\n\n <div class=\"btn__group\">\n @if (button) {\n <a\n [linkType]=\"button.linkType\"\n [href]=\"button.url\"\n class=\"btn btn__primary--outline\"\n [attr.aria-label]=\"button.label\"\n ><span>{{ button.label }}</span></a\n >\n }\n </div>\n </div>\n <!-- desktop view E -->\n <!-- mobile view S -->\n <div class=\"imageGrid__mobile relative\">\n <div class=\"js-imageGrid-slider js-slider_fix-arrows\">\n @for (item of items(); track $index) {\n @if (item) {\n <div>\n <div class=\"imageGrid__box\">\n <div\n class=\"imageGrid__graphic js-slider_fix-arrows-zone\"\n >\n @if (item.img) {\n <img\n [ngSrc]=\"item.img.src\"\n class=\"imageGrid__graphic--img\"\n width=\"499\"\n height=\"472\"\n [alt]=\"item.img.alt\"\n priority\n decoding=\"async\"\n />\n }\n </div>\n <div class=\"imageGrid__content\">\n @if (item.title) {\n <h2 class=\"imageGrid__heading\">\n {{ item.title }}\n </h2>\n }\n @if (item.subtitle) {\n <span class=\"imageGrid__subHeading\">{{\n item.subtitle\n }}</span>\n }\n </div>\n <div class=\"btn__group\">\n @if (item.link) {\n <a\n [linkType]=\"item.link.linkType\"\n [href]=\"item.link.url\"\n class=\"btn__link\"\n [attr.aria-label]=\"item.link.label\"\n ><span>{{ item.link.label }}</span></a\n >\n }\n </div>\n </div>\n </div>\n }\n }\n </div>\n <div class=\"js-slider-arrows\"></div>\n </div>\n <!-- mobile view E -->\n</section>\n" }]
|
|
6929
6929
|
}], propDecorators: { title: [{
|
|
6930
6930
|
type: Input
|
|
6931
6931
|
}], button: [{
|
|
@@ -6986,7 +6986,7 @@ class PuroHeaderComponent {
|
|
|
6986
6986
|
}
|
|
6987
6987
|
}
|
|
6988
6988
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6989
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroHeaderComponent, isStandalone: true, selector: "lib-puro-header", inputs: { titleMenu: "titleMenu", titleLang: "titleLang", navLinks: "navLinks", bottomLinks: "bottomLinks", siteId: "siteId", isHotelsPage: "isHotelsPage", btnBook: "btnBook", btnCheckinOnline: "btnCheckinOnline", btnCheckin: "btnCheckin", isDynamic: "isDynamic", logoHotel: "logoHotel", linkHotel: "linkHotel", hotelBrand: "hotelBrand" }, outputs: { btnClick: "btnClick", btnClickCheckin: "btnClickCheckin", btnClickCheckinOnline: "btnClickCheckinOnline" }, providers: [PuroActiveModalDirective], ngImport: i0, template: "<header class=\"header\" navSticky [isDynamic]=\"isDynamic\">\n <div class=\"header__logo\">\n @if (logoHotel) {\n <a [href]=\"linkHotel\" linkType=\"internal\">\n <img\n [ngSrc]=\"logoHotel\"\n alt=\"Logo\"\n width=\"301\"\n height=\"32\"\n class=\"header__logo--img\"\n priority\n />\n </a>\n } @else {\n <a [href]=\"navLinks?.[0]?.url\" [linkType]=\"navLinks?.[0]?.linkType\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"301\"\n height=\"32\"\n class=\"header__logo--img\"\n >\n @if (siteId === SITE_HOTELS) {\n <use href=\"#puro-logo\"></use>\n }\n @if (siteId === SITE_BEACH) {\n <use href=\"#purobeach-logo\"></use>\n }\n @if (siteId === SITE_GROUP) {\n <use href=\"#purogroup-logo\"></use>\n }\n </svg>\n </a>\n }\n </div>\n <div class=\"header__leftNav\">\n <div\n class=\"header__menu js-active-modal\"\n activeModal\n data-modal_name=\"navigation\"\n role=\"button\"\n [attr.aria-label]=\"titleMenu ?? 'Menu'\"\n >\n <i class=\"icon-83\"></i>\n @if (titleMenu) {\n <span>{{ titleMenu }}</span>\n }\n </div>\n <div\n class=\"header__language js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"titleLang ?? 'Language Menu'\"\n >\n @if (titleLang) {\n {{ titleLang }}\n }\n </div>\n </div>\n @if (isHotelsPage) {\n <div class=\"header__reserver\">\n @if (btnCheckinOnline) {\n <a\n (click)=\"btnClickCheckinOnline.emit()\"\n class=\"btn btn__primary btn--lg checkIn\"\n role=\"button\"\n [attr.aria-label]=\"btnCheckinOnline\"\n >\n <span>{{ btnCheckinOnline }}</span>\n </a>\n }\n\n @if (btnCheckin) {\n <a\n (click)=\"btnClickCheckin.emit()\"\n class=\"header__checkIn\"\n role=\"button\"\n [attr.aria-label]=\"btnCheckin\"\n >\n {{ btnCheckin }}\n </a>\n }\n\n @if (btnBook) {\n <a\n (click)=\"btnClick.emit()\"\n class=\"btn btn__primary btn--lg reservar\"\n role=\"button\"\n [attr.aria-label]=\"btnBook\"\n >\n <span>{{ btnBook }}</span>\n </a>\n }\n </div>\n } @else {\n @if (btnBook) {\n <a\n (click)=\"btnClick.emit()\"\n class=\"header__reserver\"\n role=\"button\"\n [attr.aria-label]=\"btnBook\"\n >\n <div class=\"btn btn__primary btn--lg\">\n <span>{{ btnBook }}</span>\n </div>\n </a>\n }\n }\n</header>\n\n<div class=\"modal modal--solidCream modal--navigation\">\n <div class=\"modal__inner\">\n <div class=\"modal__body\" [style.--bg-url]=\"cssBgUrl\">\n <div\n class=\"modal__close js-close\"\n activeModal\n data-modal_name=\"navigation\"\n role=\"button\"\n aria-label=\"Close Button\"\n >\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n class=\"modal__close--icon\"\n >\n <use href=\"#modal-close\"></use>\n </svg>\n </div>\n <div class=\"modal__nav\">\n <ul class=\"modal__nav--items\">\n @if (navLinks) {\n @for (link of navLinks; track $index) {\n <li class=\"modal__nav--link\">\n <a\n class=\"js-close\"\n activeModal\n data-modal_name=\"navigation\"\n [href]=\"link.url\"\n [linkType]=\"link.linkType\"\n [attr.aria-label]=\"link.label\"\n >\n {{ link.label }}\n </a>\n </li>\n }\n }\n </ul>\n <ul class=\"modal__nav--itemsSmall\">\n @if (bottomLinks) {\n @for (link of bottomLinks; track $index) {\n @if (link.url === 'lang') {\n <li\n class=\"modal__nav--link js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"\n link.label ?? 'Language Menu'\n \"\n >\n <a>\n {{ link.label }}\n </a>\n </li>\n } @else {\n <li class=\"modal__nav--link\">\n <a\n class=\"js-close\"\n activeModal\n data-modal_name=\"navigation\"\n [href]=\"link.url\"\n [linkType]=\"link.linkType\"\n [attr.aria-label]=\"link.label\"\n >\n {{ link.label }}\n </a>\n </li>\n }\n }\n }\n </ul>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal.modal--navigation .modal__body:after{background-image:var(--bg-url)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: PuroLinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href", "modalClick"], outputs: ["bookClick", "anchorClicked"] }, { kind: "directive", type: PuroActiveModalDirective, selector: "[activeModal]" }, { kind: "directive", type: PuroNavStickyDirective, selector: "[navSticky]", inputs: ["isDynamic"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6989
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroHeaderComponent, isStandalone: true, selector: "lib-puro-header", inputs: { titleMenu: "titleMenu", titleLang: "titleLang", navLinks: "navLinks", bottomLinks: "bottomLinks", siteId: "siteId", isHotelsPage: "isHotelsPage", btnBook: "btnBook", btnCheckinOnline: "btnCheckinOnline", btnCheckin: "btnCheckin", isDynamic: "isDynamic", logoHotel: "logoHotel", linkHotel: "linkHotel", hotelBrand: "hotelBrand", currentHotelId: "currentHotelId" }, outputs: { btnClick: "btnClick", btnClickCheckin: "btnClickCheckin", btnClickCheckinOnline: "btnClickCheckinOnline" }, providers: [PuroActiveModalDirective], ngImport: i0, template: "<header class=\"header\" navSticky [isDynamic]=\"isDynamic\">\n <div class=\"header__logo\">\n @if (logoHotel) {\n <a [href]=\"linkHotel\" linkType=\"internal\">\n <img\n [ngSrc]=\"logoHotel\"\n alt=\"Logo\"\n width=\"301\"\n height=\"32\"\n class=\"header__logo--img\"\n priority\n />\n </a>\n } @else {\n <a [href]=\"navLinks?.[0]?.url\" [linkType]=\"navLinks?.[0]?.linkType\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"301\"\n height=\"32\"\n class=\"header__logo--img\"\n >\n @if (siteId === SITE_HOTELS) {\n <use href=\"#puro-logo\"></use>\n }\n @if (siteId === SITE_BEACH) {\n <use href=\"#purobeach-logo\"></use>\n }\n @if (siteId === SITE_GROUP) {\n <use href=\"#purogroup-logo\"></use>\n }\n </svg>\n </a>\n }\n </div>\n <div class=\"header__leftNav\">\n <div\n class=\"header__menu js-active-modal\"\n activeModal\n data-modal_name=\"navigation\"\n role=\"button\"\n [attr.aria-label]=\"titleMenu ?? 'Menu'\"\n >\n <i class=\"icon-83\"></i>\n @if (titleMenu) {\n <span>{{ titleMenu }}</span>\n }\n </div>\n <div\n class=\"header__language js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"titleLang ?? 'Language Menu'\"\n >\n @if (titleLang) {\n {{ titleLang }}\n }\n </div>\n </div>\n <!-- hide buttons when Puro Oasis Urbano -->\n @if (isHotelsPage && currentHotelId !== 5) {\n <div class=\"header__reserver\">\n @if (btnCheckinOnline) {\n <a\n (click)=\"btnClickCheckinOnline.emit()\"\n class=\"btn btn__primary btn--lg checkIn\"\n role=\"button\"\n [attr.aria-label]=\"btnCheckinOnline\"\n >\n <span>{{ btnCheckinOnline }}</span>\n </a>\n }\n\n @if (btnCheckin) {\n <a\n (click)=\"btnClickCheckin.emit()\"\n class=\"header__checkIn\"\n role=\"button\"\n [attr.aria-label]=\"btnCheckin\"\n >\n {{ btnCheckin }}\n </a>\n }\n\n @if (btnBook) {\n <a\n (click)=\"btnClick.emit()\"\n class=\"btn btn__primary btn--lg reservar\"\n role=\"button\"\n [attr.aria-label]=\"btnBook\"\n >\n <span>{{ btnBook }}</span>\n </a>\n }\n </div>\n } @else {\n @if (btnBook && currentHotelId !== 5) {\n <a\n (click)=\"btnClick.emit()\"\n class=\"header__reserver\"\n role=\"button\"\n [attr.aria-label]=\"btnBook\"\n >\n <div class=\"btn btn__primary btn--lg\">\n <span>{{ btnBook }}</span>\n </div>\n </a>\n }\n }\n</header>\n\n<div class=\"modal modal--solidCream modal--navigation\">\n <div class=\"modal__inner\">\n <div class=\"modal__body\" [style.--bg-url]=\"cssBgUrl\">\n <div\n class=\"modal__close js-close\"\n activeModal\n data-modal_name=\"navigation\"\n role=\"button\"\n aria-label=\"Close Button\"\n >\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n class=\"modal__close--icon\"\n >\n <use href=\"#modal-close\"></use>\n </svg>\n </div>\n <div class=\"modal__nav\">\n <ul class=\"modal__nav--items\">\n @if (navLinks) {\n @for (link of navLinks; track $index) {\n <li class=\"modal__nav--link\">\n <a\n class=\"js-close\"\n activeModal\n data-modal_name=\"navigation\"\n [href]=\"link.url\"\n [linkType]=\"link.linkType\"\n [attr.aria-label]=\"link.label\"\n >\n {{ link.label }}\n </a>\n </li>\n }\n }\n </ul>\n <ul class=\"modal__nav--itemsSmall\">\n @if (bottomLinks) {\n @for (link of bottomLinks; track $index) {\n @if (link.url === 'lang') {\n <li\n class=\"modal__nav--link js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"\n link.label ?? 'Language Menu'\n \"\n >\n <a>\n {{ link.label }}\n </a>\n </li>\n } @else {\n <li class=\"modal__nav--link\">\n <a\n class=\"js-close\"\n activeModal\n data-modal_name=\"navigation\"\n [href]=\"link.url\"\n [linkType]=\"link.linkType\"\n [attr.aria-label]=\"link.label\"\n >\n {{ link.label }}\n </a>\n </li>\n }\n }\n }\n </ul>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal.modal--navigation .modal__body:after{background-image:var(--bg-url)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: PuroLinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href", "modalClick"], outputs: ["bookClick", "anchorClicked"] }, { kind: "directive", type: PuroActiveModalDirective, selector: "[activeModal]" }, { kind: "directive", type: PuroNavStickyDirective, selector: "[navSticky]", inputs: ["isDynamic"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6990
6990
|
}
|
|
6991
6991
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroHeaderComponent, decorators: [{
|
|
6992
6992
|
type: Component,
|
|
@@ -6996,7 +6996,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
6996
6996
|
PuroActiveModalDirective,
|
|
6997
6997
|
PuroNavStickyDirective,
|
|
6998
6998
|
NgOptimizedImage
|
|
6999
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, providers: [PuroActiveModalDirective], template: "<header class=\"header\" navSticky [isDynamic]=\"isDynamic\">\n <div class=\"header__logo\">\n @if (logoHotel) {\n <a [href]=\"linkHotel\" linkType=\"internal\">\n <img\n [ngSrc]=\"logoHotel\"\n alt=\"Logo\"\n width=\"301\"\n height=\"32\"\n class=\"header__logo--img\"\n priority\n />\n </a>\n } @else {\n <a [href]=\"navLinks?.[0]?.url\" [linkType]=\"navLinks?.[0]?.linkType\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"301\"\n height=\"32\"\n class=\"header__logo--img\"\n >\n @if (siteId === SITE_HOTELS) {\n <use href=\"#puro-logo\"></use>\n }\n @if (siteId === SITE_BEACH) {\n <use href=\"#purobeach-logo\"></use>\n }\n @if (siteId === SITE_GROUP) {\n <use href=\"#purogroup-logo\"></use>\n }\n </svg>\n </a>\n }\n </div>\n <div class=\"header__leftNav\">\n <div\n class=\"header__menu js-active-modal\"\n activeModal\n data-modal_name=\"navigation\"\n role=\"button\"\n [attr.aria-label]=\"titleMenu ?? 'Menu'\"\n >\n <i class=\"icon-83\"></i>\n @if (titleMenu) {\n <span>{{ titleMenu }}</span>\n }\n </div>\n <div\n class=\"header__language js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"titleLang ?? 'Language Menu'\"\n >\n @if (titleLang) {\n {{ titleLang }}\n }\n </div>\n </div>\n @if (isHotelsPage) {\n <div class=\"header__reserver\">\n @if (btnCheckinOnline) {\n <a\n (click)=\"btnClickCheckinOnline.emit()\"\n class=\"btn btn__primary btn--lg checkIn\"\n role=\"button\"\n [attr.aria-label]=\"btnCheckinOnline\"\n >\n <span>{{ btnCheckinOnline }}</span>\n </a>\n }\n\n @if (btnCheckin) {\n <a\n (click)=\"btnClickCheckin.emit()\"\n class=\"header__checkIn\"\n role=\"button\"\n [attr.aria-label]=\"btnCheckin\"\n >\n {{ btnCheckin }}\n </a>\n }\n\n @if (btnBook) {\n <a\n (click)=\"btnClick.emit()\"\n class=\"btn btn__primary btn--lg reservar\"\n role=\"button\"\n [attr.aria-label]=\"btnBook\"\n >\n <span>{{ btnBook }}</span>\n </a>\n }\n </div>\n } @else {\n @if (btnBook) {\n <a\n (click)=\"btnClick.emit()\"\n class=\"header__reserver\"\n role=\"button\"\n [attr.aria-label]=\"btnBook\"\n >\n <div class=\"btn btn__primary btn--lg\">\n <span>{{ btnBook }}</span>\n </div>\n </a>\n }\n }\n</header>\n\n<div class=\"modal modal--solidCream modal--navigation\">\n <div class=\"modal__inner\">\n <div class=\"modal__body\" [style.--bg-url]=\"cssBgUrl\">\n <div\n class=\"modal__close js-close\"\n activeModal\n data-modal_name=\"navigation\"\n role=\"button\"\n aria-label=\"Close Button\"\n >\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n class=\"modal__close--icon\"\n >\n <use href=\"#modal-close\"></use>\n </svg>\n </div>\n <div class=\"modal__nav\">\n <ul class=\"modal__nav--items\">\n @if (navLinks) {\n @for (link of navLinks; track $index) {\n <li class=\"modal__nav--link\">\n <a\n class=\"js-close\"\n activeModal\n data-modal_name=\"navigation\"\n [href]=\"link.url\"\n [linkType]=\"link.linkType\"\n [attr.aria-label]=\"link.label\"\n >\n {{ link.label }}\n </a>\n </li>\n }\n }\n </ul>\n <ul class=\"modal__nav--itemsSmall\">\n @if (bottomLinks) {\n @for (link of bottomLinks; track $index) {\n @if (link.url === 'lang') {\n <li\n class=\"modal__nav--link js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"\n link.label ?? 'Language Menu'\n \"\n >\n <a>\n {{ link.label }}\n </a>\n </li>\n } @else {\n <li class=\"modal__nav--link\">\n <a\n class=\"js-close\"\n activeModal\n data-modal_name=\"navigation\"\n [href]=\"link.url\"\n [linkType]=\"link.linkType\"\n [attr.aria-label]=\"link.label\"\n >\n {{ link.label }}\n </a>\n </li>\n }\n }\n }\n </ul>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal.modal--navigation .modal__body:after{background-image:var(--bg-url)}\n"] }]
|
|
6999
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, providers: [PuroActiveModalDirective], template: "<header class=\"header\" navSticky [isDynamic]=\"isDynamic\">\n <div class=\"header__logo\">\n @if (logoHotel) {\n <a [href]=\"linkHotel\" linkType=\"internal\">\n <img\n [ngSrc]=\"logoHotel\"\n alt=\"Logo\"\n width=\"301\"\n height=\"32\"\n class=\"header__logo--img\"\n priority\n />\n </a>\n } @else {\n <a [href]=\"navLinks?.[0]?.url\" [linkType]=\"navLinks?.[0]?.linkType\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"301\"\n height=\"32\"\n class=\"header__logo--img\"\n >\n @if (siteId === SITE_HOTELS) {\n <use href=\"#puro-logo\"></use>\n }\n @if (siteId === SITE_BEACH) {\n <use href=\"#purobeach-logo\"></use>\n }\n @if (siteId === SITE_GROUP) {\n <use href=\"#purogroup-logo\"></use>\n }\n </svg>\n </a>\n }\n </div>\n <div class=\"header__leftNav\">\n <div\n class=\"header__menu js-active-modal\"\n activeModal\n data-modal_name=\"navigation\"\n role=\"button\"\n [attr.aria-label]=\"titleMenu ?? 'Menu'\"\n >\n <i class=\"icon-83\"></i>\n @if (titleMenu) {\n <span>{{ titleMenu }}</span>\n }\n </div>\n <div\n class=\"header__language js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"titleLang ?? 'Language Menu'\"\n >\n @if (titleLang) {\n {{ titleLang }}\n }\n </div>\n </div>\n <!-- hide buttons when Puro Oasis Urbano -->\n @if (isHotelsPage && currentHotelId !== 5) {\n <div class=\"header__reserver\">\n @if (btnCheckinOnline) {\n <a\n (click)=\"btnClickCheckinOnline.emit()\"\n class=\"btn btn__primary btn--lg checkIn\"\n role=\"button\"\n [attr.aria-label]=\"btnCheckinOnline\"\n >\n <span>{{ btnCheckinOnline }}</span>\n </a>\n }\n\n @if (btnCheckin) {\n <a\n (click)=\"btnClickCheckin.emit()\"\n class=\"header__checkIn\"\n role=\"button\"\n [attr.aria-label]=\"btnCheckin\"\n >\n {{ btnCheckin }}\n </a>\n }\n\n @if (btnBook) {\n <a\n (click)=\"btnClick.emit()\"\n class=\"btn btn__primary btn--lg reservar\"\n role=\"button\"\n [attr.aria-label]=\"btnBook\"\n >\n <span>{{ btnBook }}</span>\n </a>\n }\n </div>\n } @else {\n @if (btnBook && currentHotelId !== 5) {\n <a\n (click)=\"btnClick.emit()\"\n class=\"header__reserver\"\n role=\"button\"\n [attr.aria-label]=\"btnBook\"\n >\n <div class=\"btn btn__primary btn--lg\">\n <span>{{ btnBook }}</span>\n </div>\n </a>\n }\n }\n</header>\n\n<div class=\"modal modal--solidCream modal--navigation\">\n <div class=\"modal__inner\">\n <div class=\"modal__body\" [style.--bg-url]=\"cssBgUrl\">\n <div\n class=\"modal__close js-close\"\n activeModal\n data-modal_name=\"navigation\"\n role=\"button\"\n aria-label=\"Close Button\"\n >\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n class=\"modal__close--icon\"\n >\n <use href=\"#modal-close\"></use>\n </svg>\n </div>\n <div class=\"modal__nav\">\n <ul class=\"modal__nav--items\">\n @if (navLinks) {\n @for (link of navLinks; track $index) {\n <li class=\"modal__nav--link\">\n <a\n class=\"js-close\"\n activeModal\n data-modal_name=\"navigation\"\n [href]=\"link.url\"\n [linkType]=\"link.linkType\"\n [attr.aria-label]=\"link.label\"\n >\n {{ link.label }}\n </a>\n </li>\n }\n }\n </ul>\n <ul class=\"modal__nav--itemsSmall\">\n @if (bottomLinks) {\n @for (link of bottomLinks; track $index) {\n @if (link.url === 'lang') {\n <li\n class=\"modal__nav--link js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"\n link.label ?? 'Language Menu'\n \"\n >\n <a>\n {{ link.label }}\n </a>\n </li>\n } @else {\n <li class=\"modal__nav--link\">\n <a\n class=\"js-close\"\n activeModal\n data-modal_name=\"navigation\"\n [href]=\"link.url\"\n [linkType]=\"link.linkType\"\n [attr.aria-label]=\"link.label\"\n >\n {{ link.label }}\n </a>\n </li>\n }\n }\n }\n </ul>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal.modal--navigation .modal__body:after{background-image:var(--bg-url)}\n"] }]
|
|
7000
7000
|
}], propDecorators: { titleMenu: [{
|
|
7001
7001
|
type: Input
|
|
7002
7002
|
}], titleLang: [{
|
|
@@ -7023,6 +7023,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7023
7023
|
type: Input
|
|
7024
7024
|
}], hotelBrand: [{
|
|
7025
7025
|
type: Input
|
|
7026
|
+
}], currentHotelId: [{
|
|
7027
|
+
type: Input
|
|
7026
7028
|
}], btnClick: [{
|
|
7027
7029
|
type: Output
|
|
7028
7030
|
}], btnClickCheckin: [{
|
|
@@ -8653,11 +8655,11 @@ class PuroSubmenuComponent {
|
|
|
8653
8655
|
document.body.classList.add('hotels');
|
|
8654
8656
|
}
|
|
8655
8657
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroSubmenuComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8656
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroSubmenuComponent, isStandalone: true, selector: "lib-puro-submenu", inputs: { items: "items", selected: "selected", isDynamic: "isDynamic" }, host: { listeners: { "window:scroll": "checkSticky()" } }, ngImport: i0, template: "@if (items) {\n <div class=\"header__subNav\" navSticky [isDynamic]=\"isDynamic\">\n <ul class=\"header__linksList\">\n @for (item of items; track $index) {\n <li class=\"header__linksItem\">\n <a\n [attr.aria-label]=\"item?.label\"\n [href]=\"item?.url\"\n [linkType]=\"item?.linkType\"\n [ngClass]=\"{\n active:\n selected?.label?.toLowerCase() ===\n item?.label?.toLowerCase(),\n }\"\n >\n {{ item?.label }}\n </a>\n </li>\n }\n </ul>\n </div>\n}\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: PuroNavStickyDirective, selector: "[navSticky]", inputs: ["isDynamic"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
8658
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroSubmenuComponent, isStandalone: true, selector: "lib-puro-submenu", inputs: { items: "items", selected: "selected", isDynamic: "isDynamic" }, host: { listeners: { "window:scroll": "checkSticky()" } }, ngImport: i0, template: "@if (items && items.length > 1) {\n <div class=\"header__subNav\" navSticky [isDynamic]=\"isDynamic\">\n <ul class=\"header__linksList\">\n @for (item of items; track $index) {\n <li class=\"header__linksItem\">\n <a\n [attr.aria-label]=\"item?.label\"\n [href]=\"item?.url\"\n [linkType]=\"item?.linkType\"\n [ngClass]=\"{\n active:\n selected?.label?.toLowerCase() ===\n item?.label?.toLowerCase(),\n }\"\n >\n {{ item?.label }}\n </a>\n </li>\n }\n </ul>\n </div>\n}\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: PuroNavStickyDirective, selector: "[navSticky]", inputs: ["isDynamic"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
8657
8659
|
}
|
|
8658
8660
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroSubmenuComponent, decorators: [{
|
|
8659
8661
|
type: Component,
|
|
8660
|
-
args: [{ selector: 'lib-puro-submenu', standalone: true, imports: [CommonModule, PuroLinkTypeDirective, PuroNavStickyDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (items) {\n <div class=\"header__subNav\" navSticky [isDynamic]=\"isDynamic\">\n <ul class=\"header__linksList\">\n @for (item of items; track $index) {\n <li class=\"header__linksItem\">\n <a\n [attr.aria-label]=\"item?.label\"\n [href]=\"item?.url\"\n [linkType]=\"item?.linkType\"\n [ngClass]=\"{\n active:\n selected?.label?.toLowerCase() ===\n item?.label?.toLowerCase(),\n }\"\n >\n {{ item?.label }}\n </a>\n </li>\n }\n </ul>\n </div>\n}\n" }]
|
|
8662
|
+
args: [{ selector: 'lib-puro-submenu', standalone: true, imports: [CommonModule, PuroLinkTypeDirective, PuroNavStickyDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (items && items.length > 1) {\n <div class=\"header__subNav\" navSticky [isDynamic]=\"isDynamic\">\n <ul class=\"header__linksList\">\n @for (item of items; track $index) {\n <li class=\"header__linksItem\">\n <a\n [attr.aria-label]=\"item?.label\"\n [href]=\"item?.url\"\n [linkType]=\"item?.linkType\"\n [ngClass]=\"{\n active:\n selected?.label?.toLowerCase() ===\n item?.label?.toLowerCase(),\n }\"\n >\n {{ item?.label }}\n </a>\n </li>\n }\n </ul>\n </div>\n}\n" }]
|
|
8661
8663
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { items: [{
|
|
8662
8664
|
type: Input
|
|
8663
8665
|
}], selected: [{
|
|
@@ -8781,7 +8783,7 @@ class PuroTopSliderComponent {
|
|
|
8781
8783
|
}
|
|
8782
8784
|
}
|
|
8783
8785
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroTopSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8784
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroTopSliderComponent, isStandalone: true, selector: "lib-puro-top-slider", inputs: { engine: "engine", title: "title", mainTitle: "mainTitle", pretitle: "pretitle", subtitle: "subtitle", spotify: "spotify", newsletter: "newsletter", languages: "languages", fidelity: "fidelity", offers: "offers", selectedLanguage: "selectedLanguage", images: "images", imagesMobile: "imagesMobile", video: "video" }, ngImport: i0, template: "<section\n class=\"banner js-active-slider\"\n style=\"background:#F9F5ED;\"\n [puroSlider]=\"images\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-banner-slider\"\n data-slider_showbtns=\"false\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"true\"\n data-slider_autoplay=\"true\"\n data-slides_pc=\"1\"\n>\n <!-- if banner image-->\n <div class=\"js-banner-slider\">\n @for (image of images; track $index) {\n <div class=\"banner__item\">\n <img\n [ngSrc]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"banner__image\"\n width=\"1920\"\n height=\"980\"\n fetchpriority=\"high\"\n priority\n />\n </div>\n }\n </div>\n <!-- if banner image-->\n <!-- if banner video -->\n @if (video) {\n <div class=\"banner__video\">\n <div class=\"banner__video--inner\">\n <iframe\n id=\"YouTubeVideoPlayer\"\n width=\"1920\"\n height=\"1080\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n src=\"{{\n video\n }}?enablejsapi=1&controls=0&showinfo=0&autoplay=1&modestbranding=1&loop=1&autohide=1&playsinline=1&widgetid=1\"\n frameborder=\"0\"\n allowfullscreen\n ></iframe>\n </div>\n </div>\n }\n @if (mainTitle) {\n <h1 class=\"banner__title\">\n <span>{{ mainTitle }}</span>\n </h1>\n }\n <div class=\"banner__content\">\n @if (pretitle) {\n <p class=\"banner__text\">{{ pretitle }}</p>\n }\n @if (title) {\n <h2 class=\"banner__heading\">{{ title }}</h2>\n }\n @if (subtitle) {\n <p class=\"banner__text\">{{ subtitle }}</p>\n }\n </div>\n <div class=\"banner__actions\">\n <div class=\"banner__group banner__group--left\">\n @if (newsletter && newsletter.label) {\n <div class=\"banner__newsletter\">\n <a\n [href]=\"newsletter.url\"\n [linkType]=\"newsletter.linkType\"\n class=\"banner__newsletter--inner\"\n [attr.aria-label]=\"newsletter.label\"\n >\n <span class=\"icon-63\"></span>\n <strong>{{ newsletter.label }}</strong>\n </a>\n </div>\n }\n @if (spotify && spotify.label) {\n <div class=\"banner__spotify\">\n <a\n [href]=\"spotify.url\"\n [linkType]=\"spotify.linkType\"\n [attr.aria-label]=\"spotify.label\"\n class=\"banner__spotify--inner\"\n role=\"button\"\n [attr.aria-label]=\"spotify ?? 'spotify icon'\"\n >\n <span class=\"icon-82\"></span>\n <strong>{{ spotify.label }}</strong>\n </a>\n </div>\n }\n </div>\n\n <div class=\"banner__group banner__group--right\">\n @if (languages && selectedLanguage) {\n <div class=\"banner__language\">\n <div\n class=\"banner__language--inner js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"selectedLanguage\"\n >\n <span class=\"banner__language--icon\">{{\n selectedLanguage\n }}</span>\n <strong>{{ languages }}</strong>\n </div>\n </div>\n }\n @if (fidelity && fidelity.label) {\n <div class=\"banner__fidelityClub\">\n <a\n [href]=\"fidelity?.url\"\n [linkType]=\"fidelity?.linkType\"\n class=\"banner__fidelityClub--inner\"\n [attr.aria-label]=\"fidelity?.label\"\n >\n <span class=\"icon-60\"></span>\n <strong>{{ fidelity?.label }}</strong>\n </a>\n </div>\n }\n </div>\n </div>\n\n @if (engine) {\n <ng-container [ngTemplateOutlet]=\"engine\"></ng-container>\n }\n @if (offers) {\n <span\n activeModal\n class=\"banner__offers--tigger js-active-modal\"\n data-modal_name=\"t-offers\"\n role=\"button\"\n [attr.aria-label]=\"offers ?? 'Offers'\"\n >\n {{ offers }}\n </span>\n }\n</section>\n", styles: ["@media (min-width: 1024px){.banner__actions{padding-bottom:5.5rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PuroSliderDirective, selector: "[puroSlider]", inputs: ["puroSlider"] }, { kind: "directive", type: PuroLinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href", "modalClick"], outputs: ["bookClick", "anchorClicked"] }, { kind: "directive", type: PuroActiveModalDirective, selector: "[activeModal]" }, { 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 }); }
|
|
8786
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: PuroTopSliderComponent, isStandalone: true, selector: "lib-puro-top-slider", inputs: { engine: "engine", title: "title", mainTitle: "mainTitle", pretitle: "pretitle", subtitle: "subtitle", spotify: "spotify", newsletter: "newsletter", languages: "languages", fidelity: "fidelity", offers: "offers", selectedLanguage: "selectedLanguage", images: "images", imagesMobile: "imagesMobile", video: "video", currentHotelId: "currentHotelId" }, ngImport: i0, template: "<section\n class=\"banner js-active-slider\"\n style=\"background:#F9F5ED;\"\n [puroSlider]=\"images\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-banner-slider\"\n data-slider_showbtns=\"false\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"true\"\n data-slider_autoplay=\"true\"\n data-slides_pc=\"1\"\n>\n <!-- if banner image-->\n <div class=\"js-banner-slider\">\n @for (image of images; track $index) {\n <div class=\"banner__item\">\n <img\n [ngSrc]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"banner__image\"\n width=\"1920\"\n height=\"980\"\n fetchpriority=\"high\"\n priority\n />\n </div>\n }\n </div>\n <!-- if banner image-->\n <!-- if banner video -->\n @if (video) {\n <div class=\"banner__video\">\n <div class=\"banner__video--inner\">\n <iframe\n id=\"YouTubeVideoPlayer\"\n width=\"1920\"\n height=\"1080\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n src=\"{{\n video\n }}?enablejsapi=1&controls=0&showinfo=0&autoplay=1&modestbranding=1&loop=1&autohide=1&playsinline=1&widgetid=1\"\n frameborder=\"0\"\n allowfullscreen\n ></iframe>\n </div>\n </div>\n }\n @if (mainTitle) {\n <h1 class=\"banner__title\">\n <span>{{ mainTitle }}</span>\n </h1>\n }\n <div class=\"banner__content\">\n @if (pretitle) {\n <p class=\"banner__text\">{{ pretitle }}</p>\n }\n @if (title) {\n <h2 class=\"banner__heading\">{{ title }}</h2>\n }\n @if (subtitle) {\n <p class=\"banner__text\">{{ subtitle }}</p>\n }\n </div>\n <div class=\"banner__actions\">\n <div class=\"banner__group banner__group--left\">\n @if (newsletter && newsletter.label) {\n <div class=\"banner__newsletter\">\n <a\n [href]=\"newsletter.url\"\n [linkType]=\"newsletter.linkType\"\n class=\"banner__newsletter--inner\"\n [attr.aria-label]=\"newsletter.label\"\n >\n <span class=\"icon-63\"></span>\n <strong>{{ newsletter.label }}</strong>\n </a>\n </div>\n }\n <!-- hide buttons when Puro Oasis Urbano -->\n @if (spotify && spotify.label && currentHotelId !== 5) {\n <div class=\"banner__spotify\">\n <a\n [href]=\"spotify.url\"\n [linkType]=\"spotify.linkType\"\n [attr.aria-label]=\"spotify.label\"\n class=\"banner__spotify--inner\"\n role=\"button\"\n [attr.aria-label]=\"spotify ?? 'spotify icon'\"\n >\n <span class=\"icon-82\"></span>\n <strong>{{ spotify.label }}</strong>\n </a>\n </div>\n }\n </div>\n\n <div class=\"banner__group banner__group--right\">\n @if (languages && selectedLanguage) {\n <div class=\"banner__language\">\n <div\n class=\"banner__language--inner js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"selectedLanguage\"\n >\n <span class=\"banner__language--icon\">{{\n selectedLanguage\n }}</span>\n <strong>{{ languages }}</strong>\n </div>\n </div>\n }\n <!-- hide buttons when Puro Oasis Urbano -->\n @if (fidelity && fidelity.label && currentHotelId !== 5) {\n <div class=\"banner__fidelityClub\">\n <a\n [href]=\"fidelity?.url\"\n [linkType]=\"fidelity?.linkType\"\n class=\"banner__fidelityClub--inner\"\n [attr.aria-label]=\"fidelity?.label\"\n >\n <span class=\"icon-60\"></span>\n <strong>{{ fidelity?.label }}</strong>\n </a>\n </div>\n }\n </div>\n </div>\n\n <!-- hide buttons when Puro Oasis Urbano -->\n @if (engine && currentHotelId !== 5) {\n <ng-container [ngTemplateOutlet]=\"engine\"></ng-container>\n }\n @if (offers) {\n <span\n activeModal\n class=\"banner__offers--tigger js-active-modal\"\n data-modal_name=\"t-offers\"\n role=\"button\"\n [attr.aria-label]=\"offers ?? 'Offers'\"\n >\n {{ offers }}\n </span>\n }\n</section>\n", styles: ["@media (min-width: 1024px){.banner__actions{padding-bottom:5.5rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PuroSliderDirective, selector: "[puroSlider]", inputs: ["puroSlider"] }, { kind: "directive", type: PuroLinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href", "modalClick"], outputs: ["bookClick", "anchorClicked"] }, { kind: "directive", type: PuroActiveModalDirective, selector: "[activeModal]" }, { 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 }); }
|
|
8785
8787
|
}
|
|
8786
8788
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PuroTopSliderComponent, decorators: [{
|
|
8787
8789
|
type: Component,
|
|
@@ -8792,7 +8794,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
8792
8794
|
PuroActiveModalDirective,
|
|
8793
8795
|
NgOptimizedImage,
|
|
8794
8796
|
AutoImageZoomWrapperDirective
|
|
8795
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n class=\"banner js-active-slider\"\n style=\"background:#F9F5ED;\"\n [puroSlider]=\"images\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-banner-slider\"\n data-slider_showbtns=\"false\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"true\"\n data-slider_autoplay=\"true\"\n data-slides_pc=\"1\"\n>\n <!-- if banner image-->\n <div class=\"js-banner-slider\">\n @for (image of images; track $index) {\n <div class=\"banner__item\">\n <img\n [ngSrc]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"banner__image\"\n width=\"1920\"\n height=\"980\"\n fetchpriority=\"high\"\n priority\n />\n </div>\n }\n </div>\n <!-- if banner image-->\n <!-- if banner video -->\n @if (video) {\n <div class=\"banner__video\">\n <div class=\"banner__video--inner\">\n <iframe\n id=\"YouTubeVideoPlayer\"\n width=\"1920\"\n height=\"1080\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n src=\"{{\n video\n }}?enablejsapi=1&controls=0&showinfo=0&autoplay=1&modestbranding=1&loop=1&autohide=1&playsinline=1&widgetid=1\"\n frameborder=\"0\"\n allowfullscreen\n ></iframe>\n </div>\n </div>\n }\n @if (mainTitle) {\n <h1 class=\"banner__title\">\n <span>{{ mainTitle }}</span>\n </h1>\n }\n <div class=\"banner__content\">\n @if (pretitle) {\n <p class=\"banner__text\">{{ pretitle }}</p>\n }\n @if (title) {\n <h2 class=\"banner__heading\">{{ title }}</h2>\n }\n @if (subtitle) {\n <p class=\"banner__text\">{{ subtitle }}</p>\n }\n </div>\n <div class=\"banner__actions\">\n <div class=\"banner__group banner__group--left\">\n @if (newsletter && newsletter.label) {\n <div class=\"banner__newsletter\">\n <a\n [href]=\"newsletter.url\"\n [linkType]=\"newsletter.linkType\"\n class=\"banner__newsletter--inner\"\n [attr.aria-label]=\"newsletter.label\"\n >\n <span class=\"icon-63\"></span>\n <strong>{{ newsletter.label }}</strong>\n </a>\n </div>\n }\n @if (spotify && spotify.label) {\n <div class=\"banner__spotify\">\n <a\n [href]=\"spotify.url\"\n [linkType]=\"spotify.linkType\"\n [attr.aria-label]=\"spotify.label\"\n class=\"banner__spotify--inner\"\n role=\"button\"\n [attr.aria-label]=\"spotify ?? 'spotify icon'\"\n >\n <span class=\"icon-82\"></span>\n <strong>{{ spotify.label }}</strong>\n </a>\n </div>\n }\n </div>\n\n <div class=\"banner__group banner__group--right\">\n @if (languages && selectedLanguage) {\n <div class=\"banner__language\">\n <div\n class=\"banner__language--inner js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"selectedLanguage\"\n >\n <span class=\"banner__language--icon\">{{\n selectedLanguage\n }}</span>\n <strong>{{ languages }}</strong>\n </div>\n </div>\n }\n @if (fidelity && fidelity.label) {\n <div class=\"banner__fidelityClub\">\n <a\n [href]=\"fidelity?.url\"\n [linkType]=\"fidelity?.linkType\"\n class=\"banner__fidelityClub--inner\"\n [attr.aria-label]=\"fidelity?.label\"\n >\n <span class=\"icon-60\"></span>\n <strong>{{ fidelity?.label }}</strong>\n </a>\n </div>\n }\n </div>\n </div>\n\n @if (engine) {\n <ng-container [ngTemplateOutlet]=\"engine\"></ng-container>\n }\n @if (offers) {\n <span\n activeModal\n class=\"banner__offers--tigger js-active-modal\"\n data-modal_name=\"t-offers\"\n role=\"button\"\n [attr.aria-label]=\"offers ?? 'Offers'\"\n >\n {{ offers }}\n </span>\n }\n</section>\n", styles: ["@media (min-width: 1024px){.banner__actions{padding-bottom:5.5rem}}\n"] }]
|
|
8797
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n class=\"banner js-active-slider\"\n style=\"background:#F9F5ED;\"\n [puroSlider]=\"images\"\n data-slides_infinite=\"true\"\n data-slider_name=\"js-banner-slider\"\n data-slider_showbtns=\"false\"\n data-slider_showdots=\"false\"\n data-slider_fade=\"true\"\n data-slider_autoplay=\"true\"\n data-slides_pc=\"1\"\n>\n <!-- if banner image-->\n <div class=\"js-banner-slider\">\n @for (image of images; track $index) {\n <div class=\"banner__item\">\n <img\n [ngSrc]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"banner__image\"\n width=\"1920\"\n height=\"980\"\n fetchpriority=\"high\"\n priority\n />\n </div>\n }\n </div>\n <!-- if banner image-->\n <!-- if banner video -->\n @if (video) {\n <div class=\"banner__video\">\n <div class=\"banner__video--inner\">\n <iframe\n id=\"YouTubeVideoPlayer\"\n width=\"1920\"\n height=\"1080\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n src=\"{{\n video\n }}?enablejsapi=1&controls=0&showinfo=0&autoplay=1&modestbranding=1&loop=1&autohide=1&playsinline=1&widgetid=1\"\n frameborder=\"0\"\n allowfullscreen\n ></iframe>\n </div>\n </div>\n }\n @if (mainTitle) {\n <h1 class=\"banner__title\">\n <span>{{ mainTitle }}</span>\n </h1>\n }\n <div class=\"banner__content\">\n @if (pretitle) {\n <p class=\"banner__text\">{{ pretitle }}</p>\n }\n @if (title) {\n <h2 class=\"banner__heading\">{{ title }}</h2>\n }\n @if (subtitle) {\n <p class=\"banner__text\">{{ subtitle }}</p>\n }\n </div>\n <div class=\"banner__actions\">\n <div class=\"banner__group banner__group--left\">\n @if (newsletter && newsletter.label) {\n <div class=\"banner__newsletter\">\n <a\n [href]=\"newsletter.url\"\n [linkType]=\"newsletter.linkType\"\n class=\"banner__newsletter--inner\"\n [attr.aria-label]=\"newsletter.label\"\n >\n <span class=\"icon-63\"></span>\n <strong>{{ newsletter.label }}</strong>\n </a>\n </div>\n }\n <!-- hide buttons when Puro Oasis Urbano -->\n @if (spotify && spotify.label && currentHotelId !== 5) {\n <div class=\"banner__spotify\">\n <a\n [href]=\"spotify.url\"\n [linkType]=\"spotify.linkType\"\n [attr.aria-label]=\"spotify.label\"\n class=\"banner__spotify--inner\"\n role=\"button\"\n [attr.aria-label]=\"spotify ?? 'spotify icon'\"\n >\n <span class=\"icon-82\"></span>\n <strong>{{ spotify.label }}</strong>\n </a>\n </div>\n }\n </div>\n\n <div class=\"banner__group banner__group--right\">\n @if (languages && selectedLanguage) {\n <div class=\"banner__language\">\n <div\n class=\"banner__language--inner js-active-modal\"\n activeModal\n data-modal_name=\"language\"\n role=\"button\"\n [attr.aria-label]=\"selectedLanguage\"\n >\n <span class=\"banner__language--icon\">{{\n selectedLanguage\n }}</span>\n <strong>{{ languages }}</strong>\n </div>\n </div>\n }\n <!-- hide buttons when Puro Oasis Urbano -->\n @if (fidelity && fidelity.label && currentHotelId !== 5) {\n <div class=\"banner__fidelityClub\">\n <a\n [href]=\"fidelity?.url\"\n [linkType]=\"fidelity?.linkType\"\n class=\"banner__fidelityClub--inner\"\n [attr.aria-label]=\"fidelity?.label\"\n >\n <span class=\"icon-60\"></span>\n <strong>{{ fidelity?.label }}</strong>\n </a>\n </div>\n }\n </div>\n </div>\n\n <!-- hide buttons when Puro Oasis Urbano -->\n @if (engine && currentHotelId !== 5) {\n <ng-container [ngTemplateOutlet]=\"engine\"></ng-container>\n }\n @if (offers) {\n <span\n activeModal\n class=\"banner__offers--tigger js-active-modal\"\n data-modal_name=\"t-offers\"\n role=\"button\"\n [attr.aria-label]=\"offers ?? 'Offers'\"\n >\n {{ offers }}\n </span>\n }\n</section>\n", styles: ["@media (min-width: 1024px){.banner__actions{padding-bottom:5.5rem}}\n"] }]
|
|
8796
8798
|
}], propDecorators: { engine: [{
|
|
8797
8799
|
type: Input
|
|
8798
8800
|
}], title: [{
|
|
@@ -8821,6 +8823,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
8821
8823
|
type: Input
|
|
8822
8824
|
}], video: [{
|
|
8823
8825
|
type: Input
|
|
8826
|
+
}], currentHotelId: [{
|
|
8827
|
+
type: Input
|
|
8824
8828
|
}] } });
|
|
8825
8829
|
|
|
8826
8830
|
class PuroVerticalInfoComponent {
|