ngx-wapp-components 2.1.26 → 2.1.27-alpha.2

package/fesm2020/ngx-wapp-components.mjs

@@ -10336,6 +10336,56 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 args: ['cardClicked']
             }] } });
 
+class WStampBooklet {
+    constructor() {
+        // Variables internas para el renderizado
+        this.stampsArray = [];
+        this.safeStamps = 0;
+        this.percent = 0;
+        this.remaining = 0;
+        this.footerText = '';
+        this.isCompleted = false;
+        // Valores por defecto en caso de que la API mande nulos algunos campos opcionales
+        this.defaultColors = {
+            bg: '#FFFFFF',
+            fg: '#111111',
+            accent: '#000000',
+            stampBg: '#F2F2F2',
+            stampFg: '#FFFFFF'
+        };
+    }
+    ngOnChanges(changes) {
+        if (changes['config'] && this.config) {
+            this.calculateProgress();
+        }
+    }
+    calculateProgress() {
+        const total = this.config.totalStamps || 10;
+        const current = this.config.currentStamps || 0;
+        this.stampsArray = Array.from({ length: total }, (_, i) => i + 1);
+        this.safeStamps = Math.min(current, total);
+        this.percent = Math.min(current / total, 1) * 100;
+        this.remaining = Math.max(total - current, 0);
+        this.isCompleted = current >= total;
+        // Procesar textos del footer
+        if (this.isCompleted) {
+            this.footerText = this.config.stampCardMsgCompleted || '¡Enhorabuena! Recompensa completada 🎉';
+        }
+        else {
+            const msgTemplate = this.config.stampCardMsgInProgress || 'Te faltan {remaining} sellos...';
+            this.footerText = msgTemplate.replace('{remaining}', this.remaining.toString());
+        }
+    }
+}
+WStampBooklet.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WStampBooklet, deps: [], target: i0.ɵɵFactoryTarget.Component });
+WStampBooklet.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WStampBooklet, selector: "w-stamp-booklet", inputs: { config: "config" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"config?.enableStampCard\" \r\n     class=\"card\" \r\n     [ngClass]=\"{'completed': isCompleted}\"\r\n     [style.background]=\"config.stampCardbgcolor || defaultColors.bg\">\r\n\r\n  <div class=\"title\" [style.color]=\"config.stampCardfgcolor || defaultColors.fg\">\r\n    {{ config.stampCardTitle || 'Tu Tarjeta de Puntos' }}\r\n  </div>\r\n\r\n  <div class=\"progress-container\">\r\n    <div class=\"progress-bar\">\r\n      <div class=\"progress-fill\" \r\n           [style.width.%]=\"percent\"\r\n           [style.background]=\"config.stampCardaccentcolor || defaultColors.accent\">\r\n      </div>\r\n    </div>\r\n    <div class=\"progress-counter\" [style.color]=\"config.stampCardaccentcolor || defaultColors.accent\">\r\n      {{ config.currentStamps }}/{{ config.totalStamps }}\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"stamps-wrapper\">\r\n    <div class=\"stamps\">\r\n      <div *ngFor=\"let stampNum of stampsArray\" \r\n          class=\"stamp\"\r\n          [ngClass]=\"{'completed': stampNum <= safeStamps}\"\r\n          [style.background]=\"stampNum <= safeStamps ? (config.stampCardbgcolorstamp || defaultColors.stampBg) : (config.stampCardaccentcolor || defaultColors.accent)\"\r\n          [style.color]=\"config.stampCardfgcolorstamp || defaultColors.stampFg\"\r\n          [style.animation-delay]=\"(stampNum * 0.05) + 's'\">\r\n        \r\n        <span *ngIf=\"stampNum <= safeStamps\">\u2714</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"footer\" \r\n       [ngClass]=\"{'completed': isCompleted}\"\r\n       [style.background]=\"config.stampCardaccentcolor || defaultColors.accent\">\r\n    {{ footerText }}\r\n  </div>\r\n\r\n</div>", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}.card{max-width:100%;width:320px;min-width:280px;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden}@media (max-width: 599px){.card{width:100%}.card .title{justify-content:center;display:flex}}.title{font-size:14px;font-weight:700}.progress-container{position:relative}.progress-bar{height:4px;background:#ddd;border-radius:999px;overflow:hidden}.progress-fill{height:100%;width:0%;border-radius:999px;transition:width .8s ease}.progress-counter{position:absolute;right:0;top:-18px;font-size:11px;font-weight:700;background:transparent}.stamps-wrapper{flex:1;display:flex;align-items:center;justify-content:center;margin:10px 0}.stamps{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(42px,1fr));gap:12px;justify-items:center}.stamp{width:clamp(36px,9vw,44px);height:clamp(36px,9vw,44px);border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:18px;font-weight:700;transition:background .3s ease}.footer{margin-top:auto;padding:12px;border-radius:10px;text-align:center;font-size:12px;font-weight:700;color:#fff;display:flex;width:100%!important;justify-content:center}.card.completed{animation:cardBounce .6s ease}.stamp.completed{animation:pop .4s ease both}.footer.completed{animation:pulse 1.2s infinite}.card.completed:before,.card.completed:after{content:\"\\1f389  \\2728  \\1f381\";position:absolute;top:-30px;left:50%;transform:translate(-50%);font-size:16px;opacity:0;animation:confetti 1.6s ease forwards}.card.completed:after{animation-delay:.3s}@keyframes pop{0%{transform:scale(.5);opacity:.2}70%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes cardBounce{0%{transform:scale(.95)}60%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes confetti{0%{top:-30px;opacity:0}20%{opacity:1}to{top:100px;opacity:0}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WStampBooklet, decorators: [{
+            type: Component,
+            args: [{ selector: 'w-stamp-booklet', template: "<div *ngIf=\"config?.enableStampCard\" \r\n     class=\"card\" \r\n     [ngClass]=\"{'completed': isCompleted}\"\r\n     [style.background]=\"config.stampCardbgcolor || defaultColors.bg\">\r\n\r\n  <div class=\"title\" [style.color]=\"config.stampCardfgcolor || defaultColors.fg\">\r\n    {{ config.stampCardTitle || 'Tu Tarjeta de Puntos' }}\r\n  </div>\r\n\r\n  <div class=\"progress-container\">\r\n    <div class=\"progress-bar\">\r\n      <div class=\"progress-fill\" \r\n           [style.width.%]=\"percent\"\r\n           [style.background]=\"config.stampCardaccentcolor || defaultColors.accent\">\r\n      </div>\r\n    </div>\r\n    <div class=\"progress-counter\" [style.color]=\"config.stampCardaccentcolor || defaultColors.accent\">\r\n      {{ config.currentStamps }}/{{ config.totalStamps }}\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"stamps-wrapper\">\r\n    <div class=\"stamps\">\r\n      <div *ngFor=\"let stampNum of stampsArray\" \r\n          class=\"stamp\"\r\n          [ngClass]=\"{'completed': stampNum <= safeStamps}\"\r\n          [style.background]=\"stampNum <= safeStamps ? (config.stampCardbgcolorstamp || defaultColors.stampBg) : (config.stampCardaccentcolor || defaultColors.accent)\"\r\n          [style.color]=\"config.stampCardfgcolorstamp || defaultColors.stampFg\"\r\n          [style.animation-delay]=\"(stampNum * 0.05) + 's'\">\r\n        \r\n        <span *ngIf=\"stampNum <= safeStamps\">\u2714</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"footer\" \r\n       [ngClass]=\"{'completed': isCompleted}\"\r\n       [style.background]=\"config.stampCardaccentcolor || defaultColors.accent\">\r\n    {{ footerText }}\r\n  </div>\r\n\r\n</div>", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}.card{max-width:100%;width:320px;min-width:280px;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden}@media (max-width: 599px){.card{width:100%}.card .title{justify-content:center;display:flex}}.title{font-size:14px;font-weight:700}.progress-container{position:relative}.progress-bar{height:4px;background:#ddd;border-radius:999px;overflow:hidden}.progress-fill{height:100%;width:0%;border-radius:999px;transition:width .8s ease}.progress-counter{position:absolute;right:0;top:-18px;font-size:11px;font-weight:700;background:transparent}.stamps-wrapper{flex:1;display:flex;align-items:center;justify-content:center;margin:10px 0}.stamps{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(42px,1fr));gap:12px;justify-items:center}.stamp{width:clamp(36px,9vw,44px);height:clamp(36px,9vw,44px);border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:18px;font-weight:700;transition:background .3s ease}.footer{margin-top:auto;padding:12px;border-radius:10px;text-align:center;font-size:12px;font-weight:700;color:#fff;display:flex;width:100%!important;justify-content:center}.card.completed{animation:cardBounce .6s ease}.stamp.completed{animation:pop .4s ease both}.footer.completed{animation:pulse 1.2s infinite}.card.completed:before,.card.completed:after{content:\"\\1f389  \\2728  \\1f381\";position:absolute;top:-30px;left:50%;transform:translate(-50%);font-size:16px;opacity:0;animation:confetti 1.6s ease forwards}.card.completed:after{animation-delay:.3s}@keyframes pop{0%{transform:scale(.5);opacity:.2}70%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes cardBounce{0%{transform:scale(.95)}60%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes confetti{0%{top:-30px;opacity:0}20%{opacity:1}to{top:100px;opacity:0}}\n"] }]
+        }], propDecorators: { config: [{
+                type: Input
+            }] } });
+
 class WMaterialServiceViewComponent {
     set lotteryEvent(value) {
         this._lotteryEvent = value;
@@ -10395,6 +10445,7 @@ class WMaterialServiceViewComponent {
         this.firstParticipation = true;
         this.isDraw = false;
         this.isMemberGetMember = false;
+        this.isStampBookletService = false;
         this.matIconRegistry.addSvgIconLiteral("calendar", this.domSanitizer.bypassSecurityTrustHtml(CALENDAR));
         this.matIconRegistry.addSvgIconLiteral("number", this.domSanitizer.bypassSecurityTrustHtml(ICON_NUMBER));
         this.matIconRegistry.addSvgIconLiteral("participate", this.domSanitizer.bypassSecurityTrustHtml(PARTICIPATE));
@@ -10435,6 +10486,9 @@ class WMaterialServiceViewComponent {
         if (this.wappingService.type == WappingServiceType.MemberGetMember) {
             this.isMemberGetMember = true;
         }
+        if (wappService.stampBookletConfig && wappService.stampBookletConfig.enableStampCard) {
+            this.isStampBookletService = true;
+        }
         this.getWappingServiceTiles(this.wappingService);
         if (this.isDevModeActive == false) {
             this.getWappingServiceImages();
@@ -10558,10 +10612,10 @@ class WMaterialServiceViewComponent {
     }
 }
 WMaterialServiceViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WMaterialServiceViewComponent, deps: [{ token: i1$7.MatIconRegistry }, { token: i2$8.DomSanitizer }, { token: i1$6.DialogService }], target: i0.ɵɵFactoryTarget.Component });
-WMaterialServiceViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WMaterialServiceViewComponent, selector: "w-material-service-view", inputs: { forceMobile: "forceMobile", wappingServicesTranslations: "wappingServicesTranslations", disabledButtonService: "disabledButtonService", showButtonService: "showButtonService", showToggle: "showToggle", lotteryEvent: "lotteryEvent", wappingService: "wappingService", isDevModeActive: "isDevModeActive", defaultImage: "defaultImage", croppedImageConfiguration: "croppedImageConfiguration", croppedDialogTranslations: "croppedDialogTranslations", isNoImage: "isNoImage", onHoverImageTooltip: "onHoverImageTooltip" }, outputs: { wappingServiceSelected: "wappingServiceSelected", triggerButtonService: "triggerButtonService", onDefaultImageEvent: "onDefaultImageEvent" }, usesOnChanges: true, ngImport: i0, template: "<wapp-main-title [title]=\"wappingService.tile3\" *ngIf=\"wappingService && (!forceMobile)\" fxHide.xs></wapp-main-title>\r\n<div class=\"service-detail-center\" *ngIf=\"wappingService\"\r\n        [ngClass]=\"{'force-mobile': forceMobile}\"\r\n        [fxLayout]=\"forceMobile ? 'column' : 'row'\"\r\n        [fxLayout.xs]=\"'column'\"\r\n        [fxLayout.sm]=\"'column'\">\r\n    <!--service image-->\r\n    <div [ngClass]=\"{'service-view-no-margin': forceMobile, 'service-view': !forceMobile}\" fxLayout=\"column\">\r\n        <!--tile 1-->\r\n        <div *ngIf=\"!hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''\" class=\"service-image-title\">\r\n            <div class=\"service-view-tile1-no-html\" [innerHTML]=\"wappingService.tile1\"></div>\r\n        </div>\r\n        <div *ngIf=\"hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''\" class=\"template-service-image-tile service-card-image-title\">\r\n            <div class=\"service-view-tile1\" [innerHTML]=\"wappingService.tile1\"></div>\r\n        </div>\r\n        <!--slideshow-->\r\n        <wapp-carousel [isDevModeActive]=\"isDevModeActive\" [forceMobile]=\"forceMobile\" [images]=\"wappingServiceImages\" [isNoImage]=\"isNoImage\" (onSetImageEvent)=\"setImage()\" [onHoverImageTooltip]=\"onHoverImageTooltip\"></wapp-carousel>\r\n        <!--tile 2-->\r\n        <div fxFlex fxLayout=\"row\"\r\n            fxLayoutAlign=\"center center\"\r\n            fxLayoutGap=\"5px\"\r\n            [ngClass]=\"{'template-service-tile': hasHtml(wappingService.tile2),\r\n                'service-tile' : !hasHtml(wappingService.tile2)}\"\r\n            *ngIf=\"wappingService.tile2\">\r\n            <div class=\"service-view-tile2\" [innerHtml]=\"wappingService.tile2\"></div>\r\n        </div>\r\n        <!--activate toggle-->\r\n        <mat-slide-toggle class=\"service-select-toggle\" color=\"accent\"\r\n                        *ngIf=\"wappingService.allowSelect && allowSelectSendGiftCard && !showButtonService && showToggle\"\r\n                        [disabled]=\"disabledToggle\"\r\n                        [(ngModel)]=\"wappingService.active\"\r\n                        (change)=\"selectWappingService()\">{{ serviceStatus }}</mat-slide-toggle>\r\n        <button mat-flat-button *ngIf=\"showButtonService\"\r\n                color=\"accent\"\r\n                class=\"service-view-button\"\r\n                fxFlex=\"100\" fxHide fxShow.xs\r\n                [disabled]=\"disabledButtonService\"\r\n                (click)=\"pressButtonService()\">\r\n            <div class=\"service-view-icon\" *ngIf=\"isMemberGetMember\">\r\n                <mat-icon class=\"member-get-member-share-button-icon\">share</mat-icon>\r\n            </div>\r\n            <div class=\"service-view-icon\" *ngIf=\"isDraw\">\r\n                <mat-icon class=\"service-view-participation-icon\" *ngIf=\"firstParticipation\" svgIcon=\"participate\"></mat-icon>\r\n                <mat-icon class=\"service-view-participation-icon\" *ngIf=\"!firstParticipation\" svgIcon=\"participate-again\"></mat-icon>\r\n            </div>\r\n            <span class=\"service-view-button-label\">{{ wappingServicesTranslations?.buttonService }}</span>\r\n        </button>\r\n        \r\n    </div>\r\n    <!--service info-->\r\n    <div class=\"service-info-container\" [ngClass]=\"{'service-info-container-padding': forceMobile}\" fxLayout=\"column\">\r\n        <div class=\"service-tile-detail-container\" fxLayout=\"column\">\r\n        <!--tile 3-->\r\n            <div *ngIf=\"!forceMobile\"\r\n                [innerHtml]=\"wappingService.tile3\" fxHide fxShow.xs\r\n                class=\"service-name mat-title\">\r\n            </div>\r\n            <div *ngIf=\"forceMobile\"\r\n                [innerHtml]=\"wappingService.tile3\"\r\n                class=\"service-name mat-title\">\r\n            </div>\r\n            <!--tileDetail 1-->\r\n            <div class=\"service-tile-detail\" fxLayout=\"row\">\r\n                <span [innerHtml]=\"wappingService.tileDetail1\"></span>\r\n            </div>\r\n            <div class=\"service-view-container-button\" fxHide.xs *ngIf=\"showButtonService\">\r\n                <button mat-flat-button\r\n                        class=\"service-view-button\"\r\n                        color=\"accent\"\r\n                        [disabled]=\"disabledButtonService\"\r\n                        (click)=\"pressButtonService()\">\r\n                    \r\n                    <div class=\"service-view-icon\" *ngIf=\"isMemberGetMember\">\r\n                        <mat-icon class=\"member-get-member-share-button-icon\">share</mat-icon>\r\n                    </div>\r\n                    <div class=\"service-view-icon\" *ngIf=\"isDraw\">\r\n                        <mat-icon class=\"service-view-participation-icon\" *ngIf=\"firstParticipation\" svgIcon=\"participate\"></mat-icon>\r\n                        <mat-icon class=\"service-view-participation-icon\" *ngIf=\"!firstParticipation\" svgIcon=\"participate-again\"></mat-icon>\r\n                    </div>\r\n                    <span class=\"service-view-button-label\">{{ wappingServicesTranslations?.buttonService }}</span>\r\n                </button>\r\n            </div>\r\n        </div>\r\n        <!--link-->\r\n        <div class=\"service-link-container\" *ngIf=\"wappingService.titleLinkUrl && wappingService.linkUrl\">\r\n            <a class=\"service-link\" href=\"{{wappingService.linkUrl}}\" target=\"_blank\">\r\n                <mat-icon class=\"service-link-icon\" svgIcon=\"share_square\"></mat-icon><span>{{wappingService.titleLinkUrl}}</span>\r\n            </a>\r\n        </div>\r\n    </div>\r\n    \r\n</div>", styles: [".back-button{width:20px!important;height:20px!important;background-color:#a5000000;padding:0;border:none;cursor:pointer}.back-button-over-image{width:37px!important;height:37px!important;background-color:#ffffffb0;position:absolute;top:13px;left:11px;z-index:10;border-radius:50%;border:none;display:flex;justify-content:center;align-items:center;cursor:pointer}::ng-deep .back-button .mat-button-wrapper,::ng-deep .back-button-over-image .mat-button-wrapper{padding:4px 0!important}.back-button .mat-button-wrapper,.back-button-over-image .mat-button-wrapper{line-height:14px!important}.back-button .mat-icon{width:20px;height:20px}.back-button-over-image .mat-icon{width:16px;height:16px}.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__track:before{background:var(--mdc-switch-unselected-track-color, #a50000)!important}.mat-mdc-slide-toggle .mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle:after{background:var(--mdc-switch-selected-handle-color, var(--mdc-theme-primary, #fff))!important}.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__track:after{background:var(--mdc-switch-selected-track-color, #10c638)!important}.mat-mdc-slide-toggle .mdc-switch.mdc-switch--unselected:enabled .mdc-switch__handle:after{background:var(--mdc-switch-unselected-handle-color, #fff)!important}.mdc-form-field>label{font:400 14px/25px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.mat-mdc-slide-toggle .mdc-switch{margin-right:8px!important}@media (max-width: 959px){.service-detail-center{align-items:center}}.service-view{position:relative;margin-right:30px}.service-view-no-margin{position:relative;margin-right:0!important}@media (min-width: 600px) and (max-width: 959px){.service-view{margin-right:0;width:100%}}@media (max-width: 599px){.service-view{margin-right:0;width:100%}}.service-image-tile,.template-service-image-tile{position:absolute!important;width:100%!important;min-height:32px!important;top:0!important;z-index:9!important}.service-image-title{position:absolute;top:0!important;right:0!important;left:0!important;z-index:2;margin:0 60px!important;min-height:22px!important;border-radius:0 0 4.3118px 4.3118px!important;background-color:#0e0c0c;color:#fff;display:flex;justify-content:center;align-items:center;padding:4px}.service-view-tile1-no-html{justify-content:center!important;align-items:center!important;display:flex!important;text-align:center!important}.service-view-tile1{width:100%;min-height:32px}.service-tile{background-color:#0e0c0c;color:#fff;padding:14px;max-height:48px;display:flex;align-items:center;text-align:center;font:400 15px/17px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.template-service-tile{max-height:48px;display:flex;align-items:center;text-align:center;font:400 15px/17px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.service-tile-border-bottom-radius{border-bottom-left-radius:5px;border-bottom-right-radius:5px}.service-view-tile2{width:100%}::ng-deep .service-view-tile2 *{box-sizing:border-box!important}.service-select-toggle{margin-top:25px;margin-right:auto;margin-left:auto;display:flex;align-items:center;text-align:left;max-width:none!important}.service-select-toggle *{max-width:none!important}.service-view-button{padding:10px 20px!important;align-items:center;justify-content:center}.service-view-button .mat-button-wrapper{display:flex!important;align-items:center;justify-content:center;gap:8px}.service-view-button .service-view-icon{display:flex}@media (max-width: 599px){.service-view-button{margin:8px 12px!important}}@media (min-width: 600px){.service-view-button{padding:10px 34px!important;height:auto!important;line-height:normal!important;min-width:150px}}.service-view-container-button{display:flex;justify-content:flex-start;align-items:start;margin:12px 0}.service-info-container{width:100%}.service-info-container-padding{padding-right:15px;padding-left:15px}@media (max-width: 599px){.service-info-container{padding-right:15px;padding-left:15px}}.service-name{margin-top:0;text-align:justify;white-space:pre-line;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}@media (min-width: 600px) and (max-width: 959px){.service-name{margin-top:30px;margin-right:0}}@media (max-width: 599px){.service-name{margin-top:30px;margin-right:0}}.service-description{margin-top:0;text-align:left;white-space:pre-line;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:10;-webkit-box-orient:vertical}@media (min-width: 600px) and (max-width: 959px){.service-description{margin-top:20px;margin-right:0}}@media (max-width: 599px){.service-description{margin-top:15px;margin-right:0}}.service-show-more-container{margin-top:5px;width:-moz-fit-content;width:fit-content;align-items:center;cursor:pointer;display:flex;text-align:left}.service-show-more-vector{width:5px!important;margin-left:10px}.service-tile-detail-container{margin-top:5px;display:flex;text-align:justify}@media (max-width: 599px){.service-tile-detail-container{margin-top:20px}}.service-tile-detail{margin-top:20px;font:400 14px/25px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}@media (max-width: 599px){.service-tile-detail{margin-top:20px}}.service-tile-detail-icon{margin-right:10px}.service-link-container{height:100%;justify-content:flex-end;align-items:flex-end;display:flex;text-align:justify}@media (max-width: 599px){.service-link-container{margin-top:20px;justify-content:flex-start}}.service-link{display:flex;align-items:center;cursor:pointer;text-decoration:none;color:inherit}.service-link-icon{margin-right:10px}.service-options-container{border-top:1px solid #eee;margin-top:80px}@media (max-width: 599px){.service-options-container{margin-top:40px;padding-right:15px;padding-left:15px}}.service-option{height:48px;border-bottom:1px solid #eee;cursor:pointer;display:flex;align-items:center;text-align:left}.service-option-vector{width:10px!important}.actions-container{margin-top:40px}.actions-button{display:flex;align-items:center;text-align:justify}.actions-button-text{margin-left:10px}.sendLabel{margin:10px auto;display:flex;justify-content:center;align-items:center;text-align:center}.sendCard-container{flex-wrap:wrap}.sendCard-container mat-icon{width:24px}@media (min-width: 600px){.sendCard-container{display:flex;justify-content:flex-end}.sentCard-container{display:flex;justify-content:end}.send-button{width:auto;display:flex;justify-content:center;align-items:center;margin-left:8px}}@media (max-width: 599px){.sendCard-container{display:flex;justify-content:center}.send-button{width:auto;display:flex;justify-content:center;align-items:center;margin-left:0}.sentCard-container{display:flex;justify-content:space-evenly}}.participation-detail-container{margin:16px 0;width:100%}.participation-detail-desktop-bar{border-radius:8px;padding:12px 24px;box-shadow:0 2px 4px #0000000d;gap:8px;display:flex;justify-content:flex-start;align-items:center}.participation-detail-value{margin-right:auto}.participation-detail-date{margin-left:4px}.participation-detail-container-mobile{padding:4px 12px!important}.participation-detail-mobile-card{border-radius:15px;padding:16px;display:flex;flex-direction:column;gap:4px}.participation-date-row{width:100%;text-align:center;padding-bottom:8px}.card-bottom-content{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.numbers-section{display:flex;flex-direction:column;flex:1}.numbers-list-vertical{display:flex;flex-direction:column;margin-top:4px;max-height:120px;overflow-y:auto}.number-item{padding:2px 0}.numbers-title{margin:0;text-transform:none}.card-icon-right{display:flex;justify-content:center;align-items:center;margin-left:10px}.card-icon-right mat-icon{width:50px!important;height:50px!important}\n"], dependencies: [{ kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i1$7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$4.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7$4.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7$4.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i7$4.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i4.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i4.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i9$2.MatLegacyButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: MainTitleComponent, selector: "wapp-main-title", inputs: ["title", "extraClassToApply"] }, { kind: "component", type: CarouselComponent, selector: "wapp-carousel", inputs: ["images", "allowThumbnail", "infiniteCarousel", "forceMobile", "height", "isDevModeActive", "isNoImage", "onHoverImageTooltip"], outputs: ["onSetImageEvent"] }], encapsulation: i0.ViewEncapsulation.None });
+WMaterialServiceViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WMaterialServiceViewComponent, selector: "w-material-service-view", inputs: { forceMobile: "forceMobile", wappingServicesTranslations: "wappingServicesTranslations", disabledButtonService: "disabledButtonService", showButtonService: "showButtonService", showToggle: "showToggle", lotteryEvent: "lotteryEvent", wappingService: "wappingService", isDevModeActive: "isDevModeActive", defaultImage: "defaultImage", croppedImageConfiguration: "croppedImageConfiguration", croppedDialogTranslations: "croppedDialogTranslations", isNoImage: "isNoImage", onHoverImageTooltip: "onHoverImageTooltip" }, outputs: { wappingServiceSelected: "wappingServiceSelected", triggerButtonService: "triggerButtonService", onDefaultImageEvent: "onDefaultImageEvent" }, usesOnChanges: true, ngImport: i0, template: "<wapp-main-title [title]=\"wappingService.tile3\" *ngIf=\"wappingService && (!forceMobile)\" fxHide.xs></wapp-main-title>\r\n<div class=\"service-detail-center\" *ngIf=\"wappingService\"\r\n        [ngClass]=\"{'force-mobile': forceMobile}\"\r\n        [fxLayout]=\"forceMobile ? 'column' : 'row'\"\r\n        [fxLayout.xs]=\"'column'\"\r\n        [fxLayout.sm]=\"'column'\">\r\n    <!--service image-->\r\n    <div [ngClass]=\"{'service-view-no-margin': forceMobile, 'service-view': !forceMobile}\" fxLayout=\"column\">\r\n        <!--tile 1-->\r\n        <div *ngIf=\"!hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != '' && !isStampBookletService\" class=\"service-image-title\">\r\n            <div class=\"service-view-tile1-no-html\" [innerHTML]=\"wappingService.tile1\"></div>\r\n        </div>\r\n        <div *ngIf=\"hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != '' && !isStampBookletService\" class=\"template-service-image-tile service-card-image-title\">\r\n            <div class=\"service-view-tile1\" [innerHTML]=\"wappingService.tile1\"></div>\r\n        </div>\r\n        <!--slideshow-->\r\n        <wapp-carousel *ngIf=\"!isStampBookletService\"\r\n            [isDevModeActive]=\"isDevModeActive\" \r\n            [forceMobile]=\"forceMobile\" \r\n            [images]=\"wappingServiceImages\" \r\n            [isNoImage]=\"isNoImage\" \r\n            (onSetImageEvent)=\"setImage()\" \r\n            [onHoverImageTooltip]=\"onHoverImageTooltip\"></wapp-carousel>\r\n\r\n        <!--stamp booklet-->\r\n        <w-stamp-booklet *ngIf=\"isStampBookletService\"\r\n          [config]=\"wappingService.stampBookletConfig!\"></w-stamp-booklet>\r\n          \r\n        <!--tile 2-->\r\n        <div fxFlex fxLayout=\"row\"\r\n            fxLayoutAlign=\"center center\"\r\n            fxLayoutGap=\"5px\"\r\n            [ngClass]=\"{'template-service-tile': hasHtml(wappingService.tile2),\r\n                'service-tile' : !hasHtml(wappingService.tile2)}\"\r\n            *ngIf=\"wappingService.tile2 && !isStampBookletService\">\r\n            <div class=\"service-view-tile2\" [innerHtml]=\"wappingService.tile2\"></div>\r\n        </div>\r\n        <!--activate toggle-->\r\n        <mat-slide-toggle class=\"service-select-toggle\" color=\"accent\"\r\n                        *ngIf=\"wappingService.allowSelect && allowSelectSendGiftCard && !showButtonService && showToggle\"\r\n                        [disabled]=\"disabledToggle\"\r\n                        [(ngModel)]=\"wappingService.active\"\r\n                        (change)=\"selectWappingService()\">{{ serviceStatus }}</mat-slide-toggle>\r\n        <button mat-flat-button *ngIf=\"showButtonService\"\r\n                color=\"accent\"\r\n                class=\"service-view-button\"\r\n                fxFlex=\"100\" fxHide fxShow.xs\r\n                [disabled]=\"disabledButtonService\"\r\n                (click)=\"pressButtonService()\">\r\n            <div class=\"service-view-icon\" *ngIf=\"isMemberGetMember\">\r\n                <mat-icon class=\"member-get-member-share-button-icon\">share</mat-icon>\r\n            </div>\r\n            <div class=\"service-view-icon\" *ngIf=\"isDraw\">\r\n                <mat-icon class=\"service-view-participation-icon\" *ngIf=\"firstParticipation\" svgIcon=\"participate\"></mat-icon>\r\n                <mat-icon class=\"service-view-participation-icon\" *ngIf=\"!firstParticipation\" svgIcon=\"participate-again\"></mat-icon>\r\n            </div>\r\n            <span class=\"service-view-button-label\">{{ wappingServicesTranslations?.buttonService }}</span>\r\n        </button>\r\n        \r\n    </div>\r\n    <!--service info-->\r\n    <div class=\"service-info-container\" [ngClass]=\"{'service-info-container-padding': forceMobile}\" fxLayout=\"column\">\r\n        <div class=\"service-tile-detail-container\" fxLayout=\"column\">\r\n        <!--tile 3-->\r\n            <div *ngIf=\"!forceMobile\"\r\n                [innerHtml]=\"wappingService.tile3\" fxHide fxShow.xs\r\n                class=\"service-name mat-title\">\r\n            </div>\r\n            <div *ngIf=\"forceMobile\"\r\n                [innerHtml]=\"wappingService.tile3\"\r\n                class=\"service-name mat-title\">\r\n            </div>\r\n            <!--tileDetail 1-->\r\n            <div class=\"service-tile-detail\" fxLayout=\"row\">\r\n                <span [innerHtml]=\"wappingService.tileDetail1\"></span>\r\n            </div>\r\n            <div class=\"service-view-container-button\" fxHide.xs *ngIf=\"showButtonService\">\r\n                <button mat-flat-button\r\n                        class=\"service-view-button\"\r\n                        color=\"accent\"\r\n                        [disabled]=\"disabledButtonService\"\r\n                        (click)=\"pressButtonService()\">\r\n                    \r\n                    <div class=\"service-view-icon\" *ngIf=\"isMemberGetMember\">\r\n                        <mat-icon class=\"member-get-member-share-button-icon\">share</mat-icon>\r\n                    </div>\r\n                    <div class=\"service-view-icon\" *ngIf=\"isDraw\">\r\n                        <mat-icon class=\"service-view-participation-icon\" *ngIf=\"firstParticipation\" svgIcon=\"participate\"></mat-icon>\r\n                        <mat-icon class=\"service-view-participation-icon\" *ngIf=\"!firstParticipation\" svgIcon=\"participate-again\"></mat-icon>\r\n                    </div>\r\n                    <span class=\"service-view-button-label\">{{ wappingServicesTranslations?.buttonService }}</span>\r\n                </button>\r\n            </div>\r\n        </div>\r\n        <!--link-->\r\n        <div class=\"service-link-container\" *ngIf=\"wappingService.titleLinkUrl && wappingService.linkUrl\">\r\n            <a class=\"service-link\" href=\"{{wappingService.linkUrl}}\" target=\"_blank\">\r\n                <mat-icon class=\"service-link-icon\" svgIcon=\"share_square\"></mat-icon><span>{{wappingService.titleLinkUrl}}</span>\r\n            </a>\r\n        </div>\r\n    </div>\r\n    \r\n</div>", styles: [".back-button{width:20px!important;height:20px!important;background-color:#a5000000;padding:0;border:none;cursor:pointer}.back-button-over-image{width:37px!important;height:37px!important;background-color:#ffffffb0;position:absolute;top:13px;left:11px;z-index:10;border-radius:50%;border:none;display:flex;justify-content:center;align-items:center;cursor:pointer}::ng-deep .back-button .mat-button-wrapper,::ng-deep .back-button-over-image .mat-button-wrapper{padding:4px 0!important}.back-button .mat-button-wrapper,.back-button-over-image .mat-button-wrapper{line-height:14px!important}.back-button .mat-icon{width:20px;height:20px}.back-button-over-image .mat-icon{width:16px;height:16px}.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__track:before{background:var(--mdc-switch-unselected-track-color, #a50000)!important}.mat-mdc-slide-toggle .mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle:after{background:var(--mdc-switch-selected-handle-color, var(--mdc-theme-primary, #fff))!important}.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__track:after{background:var(--mdc-switch-selected-track-color, #10c638)!important}.mat-mdc-slide-toggle .mdc-switch.mdc-switch--unselected:enabled .mdc-switch__handle:after{background:var(--mdc-switch-unselected-handle-color, #fff)!important}.mdc-form-field>label{font:400 14px/25px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.mat-mdc-slide-toggle .mdc-switch{margin-right:8px!important}@media (max-width: 959px){.service-detail-center{align-items:center}}.service-view{position:relative;margin-right:30px}.service-view-no-margin{position:relative;margin-right:0!important}@media (min-width: 600px) and (max-width: 959px){.service-view{margin-right:0;width:100%}}@media (max-width: 599px){.service-view{margin-right:0;width:100%}}.service-image-tile,.template-service-image-tile{position:absolute!important;width:100%!important;min-height:32px!important;top:0!important;z-index:9!important}.service-image-title{position:absolute;top:0!important;right:0!important;left:0!important;z-index:2;margin:0 60px!important;min-height:22px!important;border-radius:0 0 4.3118px 4.3118px!important;background-color:#0e0c0c;color:#fff;display:flex;justify-content:center;align-items:center;padding:4px}.service-view-tile1-no-html{justify-content:center!important;align-items:center!important;display:flex!important;text-align:center!important}.service-view-tile1{width:100%;min-height:32px}.service-tile{background-color:#0e0c0c;color:#fff;padding:14px;max-height:48px;display:flex;align-items:center;text-align:center;font:400 15px/17px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.template-service-tile{max-height:48px;display:flex;align-items:center;text-align:center;font:400 15px/17px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.service-tile-border-bottom-radius{border-bottom-left-radius:5px;border-bottom-right-radius:5px}.service-view-tile2{width:100%}::ng-deep .service-view-tile2 *{box-sizing:border-box!important}.service-select-toggle{margin-top:25px;margin-right:auto;margin-left:auto;display:flex;align-items:center;text-align:left;max-width:none!important}.service-select-toggle *{max-width:none!important}.service-view-button{padding:10px 20px!important;align-items:center;justify-content:center}.service-view-button .mat-button-wrapper{display:flex!important;align-items:center;justify-content:center;gap:8px}.service-view-button .service-view-icon{display:flex}@media (max-width: 599px){.service-view-button{margin:8px 12px!important}}@media (min-width: 600px){.service-view-button{padding:10px 34px!important;height:auto!important;line-height:normal!important;min-width:150px}}.service-view-container-button{display:flex;justify-content:flex-start;align-items:start;margin:12px 0}.service-info-container{width:100%}.service-info-container-padding{padding-right:15px;padding-left:15px}@media (max-width: 599px){.service-info-container{padding-right:15px;padding-left:15px}}.service-name{margin-top:0;text-align:justify;white-space:pre-line;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}@media (min-width: 600px) and (max-width: 959px){.service-name{margin-top:30px;margin-right:0}}@media (max-width: 599px){.service-name{margin-top:30px;margin-right:0}}.service-description{margin-top:0;text-align:left;white-space:pre-line;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:10;-webkit-box-orient:vertical}@media (min-width: 600px) and (max-width: 959px){.service-description{margin-top:20px;margin-right:0}}@media (max-width: 599px){.service-description{margin-top:15px;margin-right:0}}.service-show-more-container{margin-top:5px;width:-moz-fit-content;width:fit-content;align-items:center;cursor:pointer;display:flex;text-align:left}.service-show-more-vector{width:5px!important;margin-left:10px}.service-tile-detail-container{margin-top:5px;display:flex;text-align:justify}@media (max-width: 599px){.service-tile-detail-container{margin-top:20px}}.service-tile-detail{margin-top:20px;font:400 14px/25px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}@media (max-width: 599px){.service-tile-detail{margin-top:20px}}.service-tile-detail-icon{margin-right:10px}.service-link-container{height:100%;justify-content:flex-end;align-items:flex-end;display:flex;text-align:justify}@media (max-width: 599px){.service-link-container{margin-top:20px;justify-content:flex-start}}.service-link{display:flex;align-items:center;cursor:pointer;text-decoration:none;color:inherit}.service-link-icon{margin-right:10px}.service-options-container{border-top:1px solid #eee;margin-top:80px}@media (max-width: 599px){.service-options-container{margin-top:40px;padding-right:15px;padding-left:15px}}.service-option{height:48px;border-bottom:1px solid #eee;cursor:pointer;display:flex;align-items:center;text-align:left}.service-option-vector{width:10px!important}.actions-container{margin-top:40px}.actions-button{display:flex;align-items:center;text-align:justify}.actions-button-text{margin-left:10px}.sendLabel{margin:10px auto;display:flex;justify-content:center;align-items:center;text-align:center}.sendCard-container{flex-wrap:wrap}.sendCard-container mat-icon{width:24px}@media (min-width: 600px){.sendCard-container{display:flex;justify-content:flex-end}.sentCard-container{display:flex;justify-content:end}.send-button{width:auto;display:flex;justify-content:center;align-items:center;margin-left:8px}}@media (max-width: 599px){.sendCard-container{display:flex;justify-content:center}.send-button{width:auto;display:flex;justify-content:center;align-items:center;margin-left:0}.sentCard-container{display:flex;justify-content:space-evenly}}.participation-detail-container{margin:16px 0;width:100%}.participation-detail-desktop-bar{border-radius:8px;padding:12px 24px;box-shadow:0 2px 4px #0000000d;gap:8px;display:flex;justify-content:flex-start;align-items:center}.participation-detail-value{margin-right:auto}.participation-detail-date{margin-left:4px}.participation-detail-container-mobile{padding:4px 12px!important}.participation-detail-mobile-card{border-radius:15px;padding:16px;display:flex;flex-direction:column;gap:4px}.participation-date-row{width:100%;text-align:center;padding-bottom:8px}.card-bottom-content{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.numbers-section{display:flex;flex-direction:column;flex:1}.numbers-list-vertical{display:flex;flex-direction:column;margin-top:4px;max-height:120px;overflow-y:auto}.number-item{padding:2px 0}.numbers-title{margin:0;text-transform:none}.card-icon-right{display:flex;justify-content:center;align-items:center;margin-left:10px}.card-icon-right mat-icon{width:50px!important;height:50px!important}\n"], dependencies: [{ kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i1$7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$4.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7$4.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7$4.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i7$4.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i4.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i4.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i9$2.MatLegacyButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: MainTitleComponent, selector: "wapp-main-title", inputs: ["title", "extraClassToApply"] }, { kind: "component", type: CarouselComponent, selector: "wapp-carousel", inputs: ["images", "allowThumbnail", "infiniteCarousel", "forceMobile", "height", "isDevModeActive", "isNoImage", "onHoverImageTooltip"], outputs: ["onSetImageEvent"] }, { kind: "component", type: WStampBooklet, selector: "w-stamp-booklet", inputs: ["config"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WMaterialServiceViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'w-material-service-view', encapsulation: ViewEncapsulation.None, template: "<wapp-main-title [title]=\"wappingService.tile3\" *ngIf=\"wappingService && (!forceMobile)\" fxHide.xs></wapp-main-title>\r\n<div class=\"service-detail-center\" *ngIf=\"wappingService\"\r\n        [ngClass]=\"{'force-mobile': forceMobile}\"\r\n        [fxLayout]=\"forceMobile ? 'column' : 'row'\"\r\n        [fxLayout.xs]=\"'column'\"\r\n        [fxLayout.sm]=\"'column'\">\r\n    <!--service image-->\r\n    <div [ngClass]=\"{'service-view-no-margin': forceMobile, 'service-view': !forceMobile}\" fxLayout=\"column\">\r\n        <!--tile 1-->\r\n        <div *ngIf=\"!hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''\" class=\"service-image-title\">\r\n            <div class=\"service-view-tile1-no-html\" [innerHTML]=\"wappingService.tile1\"></div>\r\n        </div>\r\n        <div *ngIf=\"hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''\" class=\"template-service-image-tile service-card-image-title\">\r\n            <div class=\"service-view-tile1\" [innerHTML]=\"wappingService.tile1\"></div>\r\n        </div>\r\n        <!--slideshow-->\r\n        <wapp-carousel [isDevModeActive]=\"isDevModeActive\" [forceMobile]=\"forceMobile\" [images]=\"wappingServiceImages\" [isNoImage]=\"isNoImage\" (onSetImageEvent)=\"setImage()\" [onHoverImageTooltip]=\"onHoverImageTooltip\"></wapp-carousel>\r\n        <!--tile 2-->\r\n        <div fxFlex fxLayout=\"row\"\r\n            fxLayoutAlign=\"center center\"\r\n            fxLayoutGap=\"5px\"\r\n            [ngClass]=\"{'template-service-tile': hasHtml(wappingService.tile2),\r\n                'service-tile' : !hasHtml(wappingService.tile2)}\"\r\n            *ngIf=\"wappingService.tile2\">\r\n            <div class=\"service-view-tile2\" [innerHtml]=\"wappingService.tile2\"></div>\r\n        </div>\r\n        <!--activate toggle-->\r\n        <mat-slide-toggle class=\"service-select-toggle\" color=\"accent\"\r\n                        *ngIf=\"wappingService.allowSelect && allowSelectSendGiftCard && !showButtonService && showToggle\"\r\n                        [disabled]=\"disabledToggle\"\r\n                        [(ngModel)]=\"wappingService.active\"\r\n                        (change)=\"selectWappingService()\">{{ serviceStatus }}</mat-slide-toggle>\r\n        <button mat-flat-button *ngIf=\"showButtonService\"\r\n                color=\"accent\"\r\n                class=\"service-view-button\"\r\n                fxFlex=\"100\" fxHide fxShow.xs\r\n                [disabled]=\"disabledButtonService\"\r\n                (click)=\"pressButtonService()\">\r\n            <div class=\"service-view-icon\" *ngIf=\"isMemberGetMember\">\r\n                <mat-icon class=\"member-get-member-share-button-icon\">share</mat-icon>\r\n            </div>\r\n            <div class=\"service-view-icon\" *ngIf=\"isDraw\">\r\n                <mat-icon class=\"service-view-participation-icon\" *ngIf=\"firstParticipation\" svgIcon=\"participate\"></mat-icon>\r\n                <mat-icon class=\"service-view-participation-icon\" *ngIf=\"!firstParticipation\" svgIcon=\"participate-again\"></mat-icon>\r\n            </div>\r\n            <span class=\"service-view-button-label\">{{ wappingServicesTranslations?.buttonService }}</span>\r\n        </button>\r\n        \r\n    </div>\r\n    <!--service info-->\r\n    <div class=\"service-info-container\" [ngClass]=\"{'service-info-container-padding': forceMobile}\" fxLayout=\"column\">\r\n        <div class=\"service-tile-detail-container\" fxLayout=\"column\">\r\n        <!--tile 3-->\r\n            <div *ngIf=\"!forceMobile\"\r\n                [innerHtml]=\"wappingService.tile3\" fxHide fxShow.xs\r\n                class=\"service-name mat-title\">\r\n            </div>\r\n            <div *ngIf=\"forceMobile\"\r\n                [innerHtml]=\"wappingService.tile3\"\r\n                class=\"service-name mat-title\">\r\n            </div>\r\n            <!--tileDetail 1-->\r\n            <div class=\"service-tile-detail\" fxLayout=\"row\">\r\n                <span [innerHtml]=\"wappingService.tileDetail1\"></span>\r\n            </div>\r\n            <div class=\"service-view-container-button\" fxHide.xs *ngIf=\"showButtonService\">\r\n                <button mat-flat-button\r\n                        class=\"service-view-button\"\r\n                        color=\"accent\"\r\n                        [disabled]=\"disabledButtonService\"\r\n                        (click)=\"pressButtonService()\">\r\n                    \r\n                    <div class=\"service-view-icon\" *ngIf=\"isMemberGetMember\">\r\n                        <mat-icon class=\"member-get-member-share-button-icon\">share</mat-icon>\r\n                    </div>\r\n                    <div class=\"service-view-icon\" *ngIf=\"isDraw\">\r\n                        <mat-icon class=\"service-view-participation-icon\" *ngIf=\"firstParticipation\" svgIcon=\"participate\"></mat-icon>\r\n                        <mat-icon class=\"service-view-participation-icon\" *ngIf=\"!firstParticipation\" svgIcon=\"participate-again\"></mat-icon>\r\n                    </div>\r\n                    <span class=\"service-view-button-label\">{{ wappingServicesTranslations?.buttonService }}</span>\r\n                </button>\r\n            </div>\r\n        </div>\r\n        <!--link-->\r\n        <div class=\"service-link-container\" *ngIf=\"wappingService.titleLinkUrl && wappingService.linkUrl\">\r\n            <a class=\"service-link\" href=\"{{wappingService.linkUrl}}\" target=\"_blank\">\r\n                <mat-icon class=\"service-link-icon\" svgIcon=\"share_square\"></mat-icon><span>{{wappingService.titleLinkUrl}}</span>\r\n            </a>\r\n        </div>\r\n    </div>\r\n    \r\n</div>", styles: [".back-button{width:20px!important;height:20px!important;background-color:#a5000000;padding:0;border:none;cursor:pointer}.back-button-over-image{width:37px!important;height:37px!important;background-color:#ffffffb0;position:absolute;top:13px;left:11px;z-index:10;border-radius:50%;border:none;display:flex;justify-content:center;align-items:center;cursor:pointer}::ng-deep .back-button .mat-button-wrapper,::ng-deep .back-button-over-image .mat-button-wrapper{padding:4px 0!important}.back-button .mat-button-wrapper,.back-button-over-image .mat-button-wrapper{line-height:14px!important}.back-button .mat-icon{width:20px;height:20px}.back-button-over-image .mat-icon{width:16px;height:16px}.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__track:before{background:var(--mdc-switch-unselected-track-color, #a50000)!important}.mat-mdc-slide-toggle .mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle:after{background:var(--mdc-switch-selected-handle-color, var(--mdc-theme-primary, #fff))!important}.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__track:after{background:var(--mdc-switch-selected-track-color, #10c638)!important}.mat-mdc-slide-toggle .mdc-switch.mdc-switch--unselected:enabled .mdc-switch__handle:after{background:var(--mdc-switch-unselected-handle-color, #fff)!important}.mdc-form-field>label{font:400 14px/25px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.mat-mdc-slide-toggle .mdc-switch{margin-right:8px!important}@media (max-width: 959px){.service-detail-center{align-items:center}}.service-view{position:relative;margin-right:30px}.service-view-no-margin{position:relative;margin-right:0!important}@media (min-width: 600px) and (max-width: 959px){.service-view{margin-right:0;width:100%}}@media (max-width: 599px){.service-view{margin-right:0;width:100%}}.service-image-tile,.template-service-image-tile{position:absolute!important;width:100%!important;min-height:32px!important;top:0!important;z-index:9!important}.service-image-title{position:absolute;top:0!important;right:0!important;left:0!important;z-index:2;margin:0 60px!important;min-height:22px!important;border-radius:0 0 4.3118px 4.3118px!important;background-color:#0e0c0c;color:#fff;display:flex;justify-content:center;align-items:center;padding:4px}.service-view-tile1-no-html{justify-content:center!important;align-items:center!important;display:flex!important;text-align:center!important}.service-view-tile1{width:100%;min-height:32px}.service-tile{background-color:#0e0c0c;color:#fff;padding:14px;max-height:48px;display:flex;align-items:center;text-align:center;font:400 15px/17px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.template-service-tile{max-height:48px;display:flex;align-items:center;text-align:center;font:400 15px/17px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.service-tile-border-bottom-radius{border-bottom-left-radius:5px;border-bottom-right-radius:5px}.service-view-tile2{width:100%}::ng-deep .service-view-tile2 *{box-sizing:border-box!important}.service-select-toggle{margin-top:25px;margin-right:auto;margin-left:auto;display:flex;align-items:center;text-align:left;max-width:none!important}.service-select-toggle *{max-width:none!important}.service-view-button{padding:10px 20px!important;align-items:center;justify-content:center}.service-view-button .mat-button-wrapper{display:flex!important;align-items:center;justify-content:center;gap:8px}.service-view-button .service-view-icon{display:flex}@media (max-width: 599px){.service-view-button{margin:8px 12px!important}}@media (min-width: 600px){.service-view-button{padding:10px 34px!important;height:auto!important;line-height:normal!important;min-width:150px}}.service-view-container-button{display:flex;justify-content:flex-start;align-items:start;margin:12px 0}.service-info-container{width:100%}.service-info-container-padding{padding-right:15px;padding-left:15px}@media (max-width: 599px){.service-info-container{padding-right:15px;padding-left:15px}}.service-name{margin-top:0;text-align:justify;white-space:pre-line;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}@media (min-width: 600px) and (max-width: 959px){.service-name{margin-top:30px;margin-right:0}}@media (max-width: 599px){.service-name{margin-top:30px;margin-right:0}}.service-description{margin-top:0;text-align:left;white-space:pre-line;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:10;-webkit-box-orient:vertical}@media (min-width: 600px) and (max-width: 959px){.service-description{margin-top:20px;margin-right:0}}@media (max-width: 599px){.service-description{margin-top:15px;margin-right:0}}.service-show-more-container{margin-top:5px;width:-moz-fit-content;width:fit-content;align-items:center;cursor:pointer;display:flex;text-align:left}.service-show-more-vector{width:5px!important;margin-left:10px}.service-tile-detail-container{margin-top:5px;display:flex;text-align:justify}@media (max-width: 599px){.service-tile-detail-container{margin-top:20px}}.service-tile-detail{margin-top:20px;font:400 14px/25px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}@media (max-width: 599px){.service-tile-detail{margin-top:20px}}.service-tile-detail-icon{margin-right:10px}.service-link-container{height:100%;justify-content:flex-end;align-items:flex-end;display:flex;text-align:justify}@media (max-width: 599px){.service-link-container{margin-top:20px;justify-content:flex-start}}.service-link{display:flex;align-items:center;cursor:pointer;text-decoration:none;color:inherit}.service-link-icon{margin-right:10px}.service-options-container{border-top:1px solid #eee;margin-top:80px}@media (max-width: 599px){.service-options-container{margin-top:40px;padding-right:15px;padding-left:15px}}.service-option{height:48px;border-bottom:1px solid #eee;cursor:pointer;display:flex;align-items:center;text-align:left}.service-option-vector{width:10px!important}.actions-container{margin-top:40px}.actions-button{display:flex;align-items:center;text-align:justify}.actions-button-text{margin-left:10px}.sendLabel{margin:10px auto;display:flex;justify-content:center;align-items:center;text-align:center}.sendCard-container{flex-wrap:wrap}.sendCard-container mat-icon{width:24px}@media (min-width: 600px){.sendCard-container{display:flex;justify-content:flex-end}.sentCard-container{display:flex;justify-content:end}.send-button{width:auto;display:flex;justify-content:center;align-items:center;margin-left:8px}}@media (max-width: 599px){.sendCard-container{display:flex;justify-content:center}.send-button{width:auto;display:flex;justify-content:center;align-items:center;margin-left:0}.sentCard-container{display:flex;justify-content:space-evenly}}.participation-detail-container{margin:16px 0;width:100%}.participation-detail-desktop-bar{border-radius:8px;padding:12px 24px;box-shadow:0 2px 4px #0000000d;gap:8px;display:flex;justify-content:flex-start;align-items:center}.participation-detail-value{margin-right:auto}.participation-detail-date{margin-left:4px}.participation-detail-container-mobile{padding:4px 12px!important}.participation-detail-mobile-card{border-radius:15px;padding:16px;display:flex;flex-direction:column;gap:4px}.participation-date-row{width:100%;text-align:center;padding-bottom:8px}.card-bottom-content{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.numbers-section{display:flex;flex-direction:column;flex:1}.numbers-list-vertical{display:flex;flex-direction:column;margin-top:4px;max-height:120px;overflow-y:auto}.number-item{padding:2px 0}.numbers-title{margin:0;text-transform:none}.card-icon-right{display:flex;justify-content:center;align-items:center;margin-left:10px}.card-icon-right mat-icon{width:50px!important;height:50px!important}\n"] }]
+            args: [{ selector: 'w-material-service-view', encapsulation: ViewEncapsulation.None, template: "<wapp-main-title [title]=\"wappingService.tile3\" *ngIf=\"wappingService && (!forceMobile)\" fxHide.xs></wapp-main-title>\r\n<div class=\"service-detail-center\" *ngIf=\"wappingService\"\r\n        [ngClass]=\"{'force-mobile': forceMobile}\"\r\n        [fxLayout]=\"forceMobile ? 'column' : 'row'\"\r\n        [fxLayout.xs]=\"'column'\"\r\n        [fxLayout.sm]=\"'column'\">\r\n    <!--service image-->\r\n    <div [ngClass]=\"{'service-view-no-margin': forceMobile, 'service-view': !forceMobile}\" fxLayout=\"column\">\r\n        <!--tile 1-->\r\n        <div *ngIf=\"!hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != '' && !isStampBookletService\" class=\"service-image-title\">\r\n            <div class=\"service-view-tile1-no-html\" [innerHTML]=\"wappingService.tile1\"></div>\r\n        </div>\r\n        <div *ngIf=\"hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != '' && !isStampBookletService\" class=\"template-service-image-tile service-card-image-title\">\r\n            <div class=\"service-view-tile1\" [innerHTML]=\"wappingService.tile1\"></div>\r\n        </div>\r\n        <!--slideshow-->\r\n        <wapp-carousel *ngIf=\"!isStampBookletService\"\r\n            [isDevModeActive]=\"isDevModeActive\" \r\n            [forceMobile]=\"forceMobile\" \r\n            [images]=\"wappingServiceImages\" \r\n            [isNoImage]=\"isNoImage\" \r\n            (onSetImageEvent)=\"setImage()\" \r\n            [onHoverImageTooltip]=\"onHoverImageTooltip\"></wapp-carousel>\r\n\r\n        <!--stamp booklet-->\r\n        <w-stamp-booklet *ngIf=\"isStampBookletService\"\r\n          [config]=\"wappingService.stampBookletConfig!\"></w-stamp-booklet>\r\n          \r\n        <!--tile 2-->\r\n        <div fxFlex fxLayout=\"row\"\r\n            fxLayoutAlign=\"center center\"\r\n            fxLayoutGap=\"5px\"\r\n            [ngClass]=\"{'template-service-tile': hasHtml(wappingService.tile2),\r\n                'service-tile' : !hasHtml(wappingService.tile2)}\"\r\n            *ngIf=\"wappingService.tile2 && !isStampBookletService\">\r\n            <div class=\"service-view-tile2\" [innerHtml]=\"wappingService.tile2\"></div>\r\n        </div>\r\n        <!--activate toggle-->\r\n        <mat-slide-toggle class=\"service-select-toggle\" color=\"accent\"\r\n                        *ngIf=\"wappingService.allowSelect && allowSelectSendGiftCard && !showButtonService && showToggle\"\r\n                        [disabled]=\"disabledToggle\"\r\n                        [(ngModel)]=\"wappingService.active\"\r\n                        (change)=\"selectWappingService()\">{{ serviceStatus }}</mat-slide-toggle>\r\n        <button mat-flat-button *ngIf=\"showButtonService\"\r\n                color=\"accent\"\r\n                class=\"service-view-button\"\r\n                fxFlex=\"100\" fxHide fxShow.xs\r\n                [disabled]=\"disabledButtonService\"\r\n                (click)=\"pressButtonService()\">\r\n            <div class=\"service-view-icon\" *ngIf=\"isMemberGetMember\">\r\n                <mat-icon class=\"member-get-member-share-button-icon\">share</mat-icon>\r\n            </div>\r\n            <div class=\"service-view-icon\" *ngIf=\"isDraw\">\r\n                <mat-icon class=\"service-view-participation-icon\" *ngIf=\"firstParticipation\" svgIcon=\"participate\"></mat-icon>\r\n                <mat-icon class=\"service-view-participation-icon\" *ngIf=\"!firstParticipation\" svgIcon=\"participate-again\"></mat-icon>\r\n            </div>\r\n            <span class=\"service-view-button-label\">{{ wappingServicesTranslations?.buttonService }}</span>\r\n        </button>\r\n        \r\n    </div>\r\n    <!--service info-->\r\n    <div class=\"service-info-container\" [ngClass]=\"{'service-info-container-padding': forceMobile}\" fxLayout=\"column\">\r\n        <div class=\"service-tile-detail-container\" fxLayout=\"column\">\r\n        <!--tile 3-->\r\n            <div *ngIf=\"!forceMobile\"\r\n                [innerHtml]=\"wappingService.tile3\" fxHide fxShow.xs\r\n                class=\"service-name mat-title\">\r\n            </div>\r\n            <div *ngIf=\"forceMobile\"\r\n                [innerHtml]=\"wappingService.tile3\"\r\n                class=\"service-name mat-title\">\r\n            </div>\r\n            <!--tileDetail 1-->\r\n            <div class=\"service-tile-detail\" fxLayout=\"row\">\r\n                <span [innerHtml]=\"wappingService.tileDetail1\"></span>\r\n            </div>\r\n            <div class=\"service-view-container-button\" fxHide.xs *ngIf=\"showButtonService\">\r\n                <button mat-flat-button\r\n                        class=\"service-view-button\"\r\n                        color=\"accent\"\r\n                        [disabled]=\"disabledButtonService\"\r\n                        (click)=\"pressButtonService()\">\r\n                    \r\n                    <div class=\"service-view-icon\" *ngIf=\"isMemberGetMember\">\r\n                        <mat-icon class=\"member-get-member-share-button-icon\">share</mat-icon>\r\n                    </div>\r\n                    <div class=\"service-view-icon\" *ngIf=\"isDraw\">\r\n                        <mat-icon class=\"service-view-participation-icon\" *ngIf=\"firstParticipation\" svgIcon=\"participate\"></mat-icon>\r\n                        <mat-icon class=\"service-view-participation-icon\" *ngIf=\"!firstParticipation\" svgIcon=\"participate-again\"></mat-icon>\r\n                    </div>\r\n                    <span class=\"service-view-button-label\">{{ wappingServicesTranslations?.buttonService }}</span>\r\n                </button>\r\n            </div>\r\n        </div>\r\n        <!--link-->\r\n        <div class=\"service-link-container\" *ngIf=\"wappingService.titleLinkUrl && wappingService.linkUrl\">\r\n            <a class=\"service-link\" href=\"{{wappingService.linkUrl}}\" target=\"_blank\">\r\n                <mat-icon class=\"service-link-icon\" svgIcon=\"share_square\"></mat-icon><span>{{wappingService.titleLinkUrl}}</span>\r\n            </a>\r\n        </div>\r\n    </div>\r\n    \r\n</div>", styles: [".back-button{width:20px!important;height:20px!important;background-color:#a5000000;padding:0;border:none;cursor:pointer}.back-button-over-image{width:37px!important;height:37px!important;background-color:#ffffffb0;position:absolute;top:13px;left:11px;z-index:10;border-radius:50%;border:none;display:flex;justify-content:center;align-items:center;cursor:pointer}::ng-deep .back-button .mat-button-wrapper,::ng-deep .back-button-over-image .mat-button-wrapper{padding:4px 0!important}.back-button .mat-button-wrapper,.back-button-over-image .mat-button-wrapper{line-height:14px!important}.back-button .mat-icon{width:20px;height:20px}.back-button-over-image .mat-icon{width:16px;height:16px}.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__track:before{background:var(--mdc-switch-unselected-track-color, #a50000)!important}.mat-mdc-slide-toggle .mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle:after{background:var(--mdc-switch-selected-handle-color, var(--mdc-theme-primary, #fff))!important}.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__track:after{background:var(--mdc-switch-selected-track-color, #10c638)!important}.mat-mdc-slide-toggle .mdc-switch.mdc-switch--unselected:enabled .mdc-switch__handle:after{background:var(--mdc-switch-unselected-handle-color, #fff)!important}.mdc-form-field>label{font:400 14px/25px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.mat-mdc-slide-toggle .mdc-switch{margin-right:8px!important}@media (max-width: 959px){.service-detail-center{align-items:center}}.service-view{position:relative;margin-right:30px}.service-view-no-margin{position:relative;margin-right:0!important}@media (min-width: 600px) and (max-width: 959px){.service-view{margin-right:0;width:100%}}@media (max-width: 599px){.service-view{margin-right:0;width:100%}}.service-image-tile,.template-service-image-tile{position:absolute!important;width:100%!important;min-height:32px!important;top:0!important;z-index:9!important}.service-image-title{position:absolute;top:0!important;right:0!important;left:0!important;z-index:2;margin:0 60px!important;min-height:22px!important;border-radius:0 0 4.3118px 4.3118px!important;background-color:#0e0c0c;color:#fff;display:flex;justify-content:center;align-items:center;padding:4px}.service-view-tile1-no-html{justify-content:center!important;align-items:center!important;display:flex!important;text-align:center!important}.service-view-tile1{width:100%;min-height:32px}.service-tile{background-color:#0e0c0c;color:#fff;padding:14px;max-height:48px;display:flex;align-items:center;text-align:center;font:400 15px/17px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.template-service-tile{max-height:48px;display:flex;align-items:center;text-align:center;font:400 15px/17px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;text-transform:uppercase}.service-tile-border-bottom-radius{border-bottom-left-radius:5px;border-bottom-right-radius:5px}.service-view-tile2{width:100%}::ng-deep .service-view-tile2 *{box-sizing:border-box!important}.service-select-toggle{margin-top:25px;margin-right:auto;margin-left:auto;display:flex;align-items:center;text-align:left;max-width:none!important}.service-select-toggle *{max-width:none!important}.service-view-button{padding:10px 20px!important;align-items:center;justify-content:center}.service-view-button .mat-button-wrapper{display:flex!important;align-items:center;justify-content:center;gap:8px}.service-view-button .service-view-icon{display:flex}@media (max-width: 599px){.service-view-button{margin:8px 12px!important}}@media (min-width: 600px){.service-view-button{padding:10px 34px!important;height:auto!important;line-height:normal!important;min-width:150px}}.service-view-container-button{display:flex;justify-content:flex-start;align-items:start;margin:12px 0}.service-info-container{width:100%}.service-info-container-padding{padding-right:15px;padding-left:15px}@media (max-width: 599px){.service-info-container{padding-right:15px;padding-left:15px}}.service-name{margin-top:0;text-align:justify;white-space:pre-line;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}@media (min-width: 600px) and (max-width: 959px){.service-name{margin-top:30px;margin-right:0}}@media (max-width: 599px){.service-name{margin-top:30px;margin-right:0}}.service-description{margin-top:0;text-align:left;white-space:pre-line;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:10;-webkit-box-orient:vertical}@media (min-width: 600px) and (max-width: 959px){.service-description{margin-top:20px;margin-right:0}}@media (max-width: 599px){.service-description{margin-top:15px;margin-right:0}}.service-show-more-container{margin-top:5px;width:-moz-fit-content;width:fit-content;align-items:center;cursor:pointer;display:flex;text-align:left}.service-show-more-vector{width:5px!important;margin-left:10px}.service-tile-detail-container{margin-top:5px;display:flex;text-align:justify}@media (max-width: 599px){.service-tile-detail-container{margin-top:20px}}.service-tile-detail{margin-top:20px;font:400 14px/25px Inter,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal}@media (max-width: 599px){.service-tile-detail{margin-top:20px}}.service-tile-detail-icon{margin-right:10px}.service-link-container{height:100%;justify-content:flex-end;align-items:flex-end;display:flex;text-align:justify}@media (max-width: 599px){.service-link-container{margin-top:20px;justify-content:flex-start}}.service-link{display:flex;align-items:center;cursor:pointer;text-decoration:none;color:inherit}.service-link-icon{margin-right:10px}.service-options-container{border-top:1px solid #eee;margin-top:80px}@media (max-width: 599px){.service-options-container{margin-top:40px;padding-right:15px;padding-left:15px}}.service-option{height:48px;border-bottom:1px solid #eee;cursor:pointer;display:flex;align-items:center;text-align:left}.service-option-vector{width:10px!important}.actions-container{margin-top:40px}.actions-button{display:flex;align-items:center;text-align:justify}.actions-button-text{margin-left:10px}.sendLabel{margin:10px auto;display:flex;justify-content:center;align-items:center;text-align:center}.sendCard-container{flex-wrap:wrap}.sendCard-container mat-icon{width:24px}@media (min-width: 600px){.sendCard-container{display:flex;justify-content:flex-end}.sentCard-container{display:flex;justify-content:end}.send-button{width:auto;display:flex;justify-content:center;align-items:center;margin-left:8px}}@media (max-width: 599px){.sendCard-container{display:flex;justify-content:center}.send-button{width:auto;display:flex;justify-content:center;align-items:center;margin-left:0}.sentCard-container{display:flex;justify-content:space-evenly}}.participation-detail-container{margin:16px 0;width:100%}.participation-detail-desktop-bar{border-radius:8px;padding:12px 24px;box-shadow:0 2px 4px #0000000d;gap:8px;display:flex;justify-content:flex-start;align-items:center}.participation-detail-value{margin-right:auto}.participation-detail-date{margin-left:4px}.participation-detail-container-mobile{padding:4px 12px!important}.participation-detail-mobile-card{border-radius:15px;padding:16px;display:flex;flex-direction:column;gap:4px}.participation-date-row{width:100%;text-align:center;padding-bottom:8px}.card-bottom-content{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.numbers-section{display:flex;flex-direction:column;flex:1}.numbers-list-vertical{display:flex;flex-direction:column;margin-top:4px;max-height:120px;overflow-y:auto}.number-item{padding:2px 0}.numbers-title{margin:0;text-transform:none}.card-icon-right{display:flex;justify-content:center;align-items:center;margin-left:10px}.card-icon-right mat-icon{width:50px!important;height:50px!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$7.MatIconRegistry }, { type: i2$8.DomSanitizer }, { type: i1$6.DialogService }]; }, propDecorators: { forceMobile: [{
                 type: Input
             }], wappingServicesTranslations: [{
@@ -10780,7 +10834,8 @@ WappComponentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ve
         WappModalCloseButtonComponent,
         WappModalTitleComponent,
         WCodeBlockComponent,
-        WCardComponent], imports: [InputTextModule,
+        WCardComponent,
+        WStampBooklet], imports: [InputTextModule,
         FormsModule,
         ReactiveFormsModule,
         CommonModule,
@@ -10952,7 +11007,8 @@ WappComponentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ve
         MonacoEditorModule,
         WCodeBlockComponent,
         MatLegacyButtonModule,
-        WCardComponent] });
+        WCardComponent,
+        WStampBooklet] });
 WappComponentsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WappComponentsModule, providers: [
         {
             provide: HIGHLIGHT_OPTIONS,
@@ -11145,7 +11201,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         WappModalCloseButtonComponent,
                         WappModalTitleComponent,
                         WCodeBlockComponent,
-                        WCardComponent
+                        WCardComponent,
+                        WStampBooklet
                     ],
                     imports: [
                         InputTextModule,
@@ -11324,7 +11381,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         MonacoEditorModule,
                         WCodeBlockComponent,
                         MatLegacyButtonModule,
-                        WCardComponent
+                        WCardComponent,
+                        WStampBooklet
                     ],
                     providers: [
                         {
@@ -11434,5 +11492,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AddressEnum, CardStatus, CarouselComponent, ClipboardService, ColorTextPipe, CronCharactersType, CronFieldType, CronPeriodicityType, CustomColor, DataTypeEnum, DateConversionService, FileService, FormControlService, MainTitleComponent, ModalService, NotificationsEventEnum, NumberConversionService, OperatorEnum, PeriodSelectEnum, QBDataTypeEnum, QueryResultType, SendingStatus, SessionStorageService, TableColumnFilterTypes, TableColumnTypes, TreeService, WAddressFieldComponent, WAutocompleteSearchComponent, WBadgeComponent, WBodyComponent, WBodyContainerComponent, WBodyGridComponent, WButtonComponent, WButtonTabviewComponent, WButtonWeekComponent, WButtonsFooterComponent, WCardComponent, WChartBarComponent, WChipComponent, WClipboardComponent, WCodeBlockComponent, WContainerComponent, WCronExpressionsComponent, WCurrencyPipe, WDatePipe, WDatePipeFormatType, WDatePipeReturnType, WEditCalendarComponent, WEditCalendarMonthComponent, WEditCheckboxComponent, WEditInputColorpickerComponent, WEditInputNumberComponent, WEditInputTextComponent, WEditInputTextareaComponent, WEditMultiselectComponent, WEditSelectComponent, WEditToggleComponent, WEditTreeselectComponent, WFileGeneratorComponent, WFileUploaderComponent, WFilterPanelComponent, WFooterComponent, WHeaderPanelComponent, WIconsComponent, WImageCropperComponent, WImageFileUploaderComponent, WInputLabelComponent, WInputSearchComponent, WInputVerticalGapDividerComponent, WLogosComponent, WMapsComponent, WMaterialServiceCardComponent, WMaterialServiceViewComponent, WNavbarComponent, WNotificationsEventFieldComponent, WPanelComponent, WPanelGridComponent, WPanelSectionGapDividerComponent, WPanelSubtitleComponent, WPanelTitleComponent, WParameterSelectorComponent, WPercentagePipe, WPowerbiReportComponent, WPreviewImageComponent, WRadioButtonComponent, WSelectButtonComponent, WSidebarComponent, WSkeletonEditComponent, WSkeletonEditProductComponent, WSkeletonFormComponent, WSkeletonGenericComponent, WSkeletonIframeComponent, WSkeletonInputGenericComponent, WSkeletonListComponent, WSkeletonPowerbiReportComponent, WSkeletonProfileSidebarComponent, WSkeletonQueryBuilderComponent, WSkeletonSidebarComponent, WSkeletonTimelineComponent, WSkeletonTreeComponent, WSkeletonUserProfileInfoSidebarComponent, WSummaryPipe, WTableComponent, WTableLazyComponent, WTabviewComponent, WTimelineComponent, WToggleButtonComponent, WTreeComponent, WTreeFieldComponent, WTreeTableComponent, WViewBadgeComponent, WViewBooleanComponent, WViewTextComponent, WWizardComponent, WappComponentsComponent, WappComponentsModule, WappComponentsService, WappMaterialServiceCardComponent, WappMaterialServiceViewComponent, WappModalCloseButtonComponent, WappModalTitleComponent, WappServiceDescriptionComponent, WappTableColumnAlignTypes, WappingServiceAppViewType, WappingServiceSubtype, WappingServiceType };
+export { AddressEnum, CardStatus, CarouselComponent, ClipboardService, ColorTextPipe, CronCharactersType, CronFieldType, CronPeriodicityType, CustomColor, DataTypeEnum, DateConversionService, FileService, FormControlService, MainTitleComponent, ModalService, NotificationsEventEnum, NumberConversionService, OperatorEnum, PeriodSelectEnum, QBDataTypeEnum, QueryResultType, SendingStatus, SessionStorageService, TableColumnFilterTypes, TableColumnTypes, TreeService, WAddressFieldComponent, WAutocompleteSearchComponent, WBadgeComponent, WBodyComponent, WBodyContainerComponent, WBodyGridComponent, WButtonComponent, WButtonTabviewComponent, WButtonWeekComponent, WButtonsFooterComponent, WCardComponent, WChartBarComponent, WChipComponent, WClipboardComponent, WCodeBlockComponent, WContainerComponent, WCronExpressionsComponent, WCurrencyPipe, WDatePipe, WDatePipeFormatType, WDatePipeReturnType, WEditCalendarComponent, WEditCalendarMonthComponent, WEditCheckboxComponent, WEditInputColorpickerComponent, WEditInputNumberComponent, WEditInputTextComponent, WEditInputTextareaComponent, WEditMultiselectComponent, WEditSelectComponent, WEditToggleComponent, WEditTreeselectComponent, WFileGeneratorComponent, WFileUploaderComponent, WFilterPanelComponent, WFooterComponent, WHeaderPanelComponent, WIconsComponent, WImageCropperComponent, WImageFileUploaderComponent, WInputLabelComponent, WInputSearchComponent, WInputVerticalGapDividerComponent, WLogosComponent, WMapsComponent, WMaterialServiceCardComponent, WMaterialServiceViewComponent, WNavbarComponent, WNotificationsEventFieldComponent, WPanelComponent, WPanelGridComponent, WPanelSectionGapDividerComponent, WPanelSubtitleComponent, WPanelTitleComponent, WParameterSelectorComponent, WPercentagePipe, WPowerbiReportComponent, WPreviewImageComponent, WRadioButtonComponent, WSelectButtonComponent, WSidebarComponent, WSkeletonEditComponent, WSkeletonEditProductComponent, WSkeletonFormComponent, WSkeletonGenericComponent, WSkeletonIframeComponent, WSkeletonInputGenericComponent, WSkeletonListComponent, WSkeletonPowerbiReportComponent, WSkeletonProfileSidebarComponent, WSkeletonQueryBuilderComponent, WSkeletonSidebarComponent, WSkeletonTimelineComponent, WSkeletonTreeComponent, WSkeletonUserProfileInfoSidebarComponent, WStampBooklet, WSummaryPipe, WTableComponent, WTableLazyComponent, WTabviewComponent, WTimelineComponent, WToggleButtonComponent, WTreeComponent, WTreeFieldComponent, WTreeTableComponent, WViewBadgeComponent, WViewBooleanComponent, WViewTextComponent, WWizardComponent, WappComponentsComponent, WappComponentsModule, WappComponentsService, WappMaterialServiceCardComponent, WappMaterialServiceViewComponent, WappModalCloseButtonComponent, WappModalTitleComponent, WappServiceDescriptionComponent, WappTableColumnAlignTypes, WappingServiceAppViewType, WappingServiceSubtype, WappingServiceType };
 //# sourceMappingURL=ngx-wapp-components.mjs.map