lib-common-angular 0.0.15 → 0.0.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/fesm2022/lib-common-angular.mjs +193 -76
  2. package/fesm2022/lib-common-angular.mjs.map +1 -1
  3. package/index.d.ts +32 -10
  4. package/package.json +1 -1
package/fesm2022/lib-common-angular.mjs CHANGED
@@ -18,9 +18,9 @@ import { EditorModule } from 'primeng/editor';
18
18
  import { MenuModule } from 'primeng/menu';
19
19
  import * as i2$3 from 'primeng/paginator';
20
20
  import { PaginatorModule } from 'primeng/paginator';
21
- import * as i3$5 from 'primeng/password';
21
+ import * as i3$4 from 'primeng/password';
22
22
  import { PasswordModule } from 'primeng/password';
23
- import * as i3$2 from 'primeng/ripple';
23
+ import * as i4$1 from 'primeng/ripple';
24
24
  import { RippleModule } from 'primeng/ripple';
25
25
  import { ToastModule } from 'primeng/toast';
26
26
  import * as i2$2 from 'primeng/toolbar';
@@ -28,7 +28,7 @@ import { ToolbarModule } from 'primeng/toolbar';
28
28
  import { RatingModule } from 'primeng/rating';
29
29
  import * as i2$5 from 'primeng/inputtext';
30
30
  import { InputTextModule } from 'primeng/inputtext';
31
- import * as i3$4 from 'primeng/textarea';
31
+ import * as i3$3 from 'primeng/textarea';
32
32
  import { TextareaModule } from 'primeng/textarea';
33
33
  import * as i6 from 'primeng/select';
34
34
  import { SelectModule } from 'primeng/select';
@@ -74,14 +74,14 @@ import { MatGridListModule } from '@angular/material/grid-list';
74
74
  import { MatTableModule } from '@angular/material/table';
75
75
  import { MatSelectModule } from '@angular/material/select';
76
76
  import { MatPaginatorModule } from '@angular/material/paginator';
77
- import * as i3$3 from '@angular/material/sidenav';
77
+ import * as i3$2 from '@angular/material/sidenav';
78
78
  import { MatSidenavModule } from '@angular/material/sidenav';
79
- import * as i4$1 from '@angular/material/toolbar';
79
+ import * as i4$2 from '@angular/material/toolbar';
80
80
  import { MatToolbarModule } from '@angular/material/toolbar';
81
81
  import * as i5$1 from '@angular/material/list';
82
82
  import { MatListModule } from '@angular/material/list';
83
83
  import { MatCardModule } from '@angular/material/card';
84
- import * as i4$3 from '@ngxs/store';
84
+ import * as i4$4 from '@ngxs/store';
85
85
  import { NgxsModule, createSelector, Action, Selector, State } from '@ngxs/store';
86
86
  import * as i1$5 from '@ngx-translate/core';
87
87
  import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
@@ -90,7 +90,7 @@ import { NgxsReduxDevtoolsPluginModule } from '@ngxs/devtools-plugin';
90
90
  import { NgxsLoggerPluginModule } from '@ngxs/logger-plugin';
91
91
  import * as i1$8 from '@angular/router';
92
92
  import { RouterOutlet, RouterModule, Router, NavigationEnd } from '@angular/router';
93
- import * as i4$2 from 'primeng/styleclass';
93
+ import * as i4$3 from 'primeng/styleclass';
94
94
  import { StyleClassModule } from 'primeng/styleclass';
95
95
  import { updatePreset, updateSurfacePalette, $t } from '@primeng/themes';
96
96
  import Aura from '@primeng/themes/aura';
@@ -108,6 +108,37 @@ import { trigger, state, transition, style, animate } from '@angular/animations'
108
108
  import { filter as filter$1 } from 'rxjs/operators';
109
109
  import { __decorate } from 'tslib';
110
110
 
111
+ class GoogleService {
112
+ reportConversion(sendTo, url) {
113
+ const callback = () => {
114
+ if (typeof url !== 'undefined') {
115
+ window.location.href = url;
116
+ }
117
+ };
118
+ if (typeof window.gtag === 'function') {
119
+ window.gtag('event', 'conversion', {
120
+ send_to: sendTo,
121
+ event_callback: callback
122
+ });
123
+ }
124
+ else {
125
+ // Si gtag no está disponible, solo redirige
126
+ callback();
127
+ }
128
+ }
129
+ reportAnalyticsEvent(eventName, params) {
130
+ if (typeof window.gtag === 'function') {
131
+ window.gtag('event', eventName, params || {});
132
+ }
133
+ }
134
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: GoogleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
135
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: GoogleService, providedIn: 'root' });
136
+ }
137
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: GoogleService, decorators: [{
138
+ type: Injectable,
139
+ args: [{ providedIn: 'root' }]
140
+ }] });
141
+
111
142
  class CommonLibService {
112
143
  constructor() { }
113
144
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CommonLibService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
@@ -1630,6 +1661,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
1630
1661
  }] } });
1631
1662
 
1632
1663
  class Carruselt1 {
1664
+ googleService;
1665
+ DatosNegocio = null;
1666
+ constructor(googleService) {
1667
+ this.googleService = googleService;
1668
+ }
1633
1669
  slides = [{
1634
1670
  id: 1,
1635
1671
  tag: 'Fabricación de Inflables Publicitarios',
@@ -1734,16 +1770,29 @@ class Carruselt1 {
1734
1770
  navigateToWhatsapp(slide) {
1735
1771
  const currentUrl = window.location.href;
1736
1772
  const message = `Hola, estoy en tu página ${currentUrl} y me interesa ${slide.title}`;
1737
- const whatsappUrl = `https://api.whatsapp.com/send/?phone=%2B573118025433&text=${encodeURIComponent(message)}&type=phone_number&app_absent=0`;
1738
- window.open(whatsappUrl, '_blank');
1773
+ const whatsappNumber = this.DatosNegocio?.telefono || '+573118025433';
1774
+ const whatsappUrl = `https://wa.me/${whatsappNumber}?text=${encodeURIComponent(message)}`;
1775
+ // Google Ads Conversion
1776
+ if (this.DatosNegocio?.googleAdsConversionId) {
1777
+ this.googleService.reportConversion(this.DatosNegocio.googleAdsConversionId, whatsappUrl);
1778
+ }
1779
+ else {
1780
+ window.open(whatsappUrl, '_blank');
1781
+ }
1782
+ // Google Analytics Event
1783
+ if (this.DatosNegocio?.googleAnalyticsEvent) {
1784
+ this.googleService.reportAnalyticsEvent(this.DatosNegocio.googleAnalyticsEvent, { slide: slide.title });
1785
+ }
1739
1786
  }
1740
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: Carruselt1, deps: [], target: i0.ɵɵFactoryTarget.Component });
1741
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: Carruselt1, isStandalone: true, selector: "lib-carruselt-1", ngImport: i0, template: "\n\n<section aria-label=\"Carrusel de productos inflables recreativos y publicitarios\" class=\"carrusel-bg p-3 flex flex-column align-items-center justify-content-center w-full\" aria-label=\"Carrusel de productos inflables y recreativos\" itemscope itemtype=\"https://schema.org/ItemList\">\n <div class=\"relative w-full max-w-6xl h-30rem bg-white-alpha-10 border-1 border-white-alpha-30 border-round-3xl shadow-4 overflow-hidden flex flex-column justify-content-center\">\n <div class=\"w-full h-full relative\">\n @for (slide of slides; track $index) {\n <div class=\"slide flex flex-column md:flex-row h-full absolute w-full transition-all duration-800\"\n [class.active]=\"$index === currentSlide\"\n itemprop=\"itemListElement\" itemscope itemtype=\"https://schema.org/Product\">\n <meta itemprop=\"position\" [content]=\"$index + 1\">\n <!-- Texto -->\n <div class=\"flex-1 flex align-items-center justify-content-center p-4 md:pl-8 order-2 md:order-1\">\n <div class=\"content-box text-white md:ml-4\">\n <span class=\"p-tag mb-3\" [ngClass]=\"slide.tagClass\">{{slide.tag}}</span>\n <h2 class=\"text-3xl md:text-5xl font-bold mb-3\" itemprop=\"name\">{{slide.title}}</h2>\n <p class=\"mb-4 text-secondary\" itemprop=\"description\">{{slide.description}}</p>\n @if (slide.button) {\n <a pButton pRipple (click)=\"navigateToWhatsapp(slide)\" class=\"cursor-pointer\" [ngClass]=\"slide.button.class\" [title]=\"'M\u00E1s informaci\u00F3n sobre ' + slide.title\">{{slide.button.text}}</a>\n }\n </div>\n </div>\n <!-- Imagen -->\n <div class=\"flex-1 flex align-items-center justify-content-center order-1 md:order-2 image-box p-0 overflow-hidden\">\n <img [ngSrc]=\"slide.image\" \n [alt]=\"slide.alt\"\n [priority]=\"$index === 0\"\n width=\"600\" height=\"400\"\n class=\"w-full h-full object-cover md:w-auto md:h-auto md:border-round-xl shadow-2\" \n itemprop=\"image\">\n </div>\n </div>\n }\n </div>\n <!-- Controles de Navegaci\u00F3n (Flechas laterales) -->\n <button class=\"absolute nav-btn-pos left-0 ml-2 md:ml-3 border-circle border-none bg-white-alpha-20 text-white w-3rem h-3rem flex align-items-center justify-content-center hover:bg-white-alpha-40 transition-colors cursor-pointer p-0\" style=\"transform: translateY(-50%); z-index: 20;\" aria-label=\"Anterior\" (click)=\"prevSlide()\">\n <i class=\"fas fa-chevron-left text-xl\"></i>\n </button>\n <button class=\"absolute nav-btn-pos right-0 mr-2 md:mr-3 border-circle border-none bg-white-alpha-20 text-white w-3rem h-3rem flex align-items-center justify-content-center hover:bg-white-alpha-40 transition-colors cursor-pointer p-0\" style=\"transform: translateY(-50%); z-index: 20;\" aria-label=\"Siguiente\" (click)=\"nextSlide()\">\n <i class=\"fas fa-chevron-right text-xl\"></i>\n </button>\n\n <!-- Indicadores (Puntos abajo al centro) -->\n <div class=\"absolute bottom-0 left-0 w-full flex justify-content-center gap-2 pb-3\" style=\"z-index: 20;\">\n @for (slide of slides; track $index) {\n <button class=\"nav-dot border-circle p-0\" [class.active]=\"$index === currentSlide\" (click)=\"goToSlide($index)\" [attr.aria-label]=\"'Ir a diapositiva ' + ($index + 1)\"></button>\n }\n </div>\n </div>\n</section>\n", styles: [".carrusel-bg{min-height:10vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(-45deg,#6a1b9a,#fbc02d,#0288d1,#6a1b9a);background-size:400% 400%;animation:gradient 15s ease infinite}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.slide{opacity:0;pointer-events:none;z-index:1;transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1);transform:translate(100px) scale(.95);position:absolute;top:0;left:0;width:100%;height:100%}.slide.active{opacity:1;pointer-events:all;z-index:10;transform:translate(0) scale(1)}.slide .content-box{transform:translateY(30px);opacity:0;transition:all .6s ease .3s}.slide.active .content-box{transform:translateY(0);opacity:1}.slide .image-box{transform:scale(1.1);opacity:0;transition:all .8s ease .1s}.slide.active .image-box{transform:scale(1);opacity:1}.nav-dot{transition:all .3s ease;width:.75rem;height:.75rem;background:#ffffff80;border:none;outline:none;cursor:pointer}.nav-dot.active{width:2rem;background:#fff}.nav-btn-pos{top:55%!important}@media (min-width: 768px){.nav-btn-pos{top:50%!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PrimegModule }, { kind: "directive", type: i1.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }] });
1787
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: Carruselt1, deps: [{ token: GoogleService }], target: i0.ɵɵFactoryTarget.Component });
1788
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: Carruselt1, isStandalone: true, selector: "lib-carruselt-1", inputs: { DatosNegocio: "DatosNegocio" }, ngImport: i0, template: "\n\n<section aria-label=\"Carrusel de productos inflables recreativos y publicitarios\" class=\"carrusel-bg p-3 flex flex-column align-items-center justify-content-center w-full\" aria-label=\"Carrusel de productos inflables y recreativos\" itemscope itemtype=\"https://schema.org/ItemList\">\n <div class=\"relative w-full max-w-6xl h-30rem bg-white-alpha-10 border-1 border-white-alpha-30 border-round-3xl shadow-4 overflow-hidden flex flex-column justify-content-center\">\n <div class=\"w-full h-full relative\">\n @for (slide of slides; track $index) {\n <div class=\"slide flex flex-column md:flex-row h-full absolute w-full transition-all duration-800\"\n [class.active]=\"$index === currentSlide\"\n itemprop=\"itemListElement\" itemscope itemtype=\"https://schema.org/Product\">\n <meta itemprop=\"position\" [content]=\"$index + 1\">\n <!-- Texto -->\n <div class=\"flex-1 flex align-items-center justify-content-center p-4 md:pl-8 order-2 md:order-1\">\n <div class=\"content-box text-white md:ml-4\">\n <span class=\"p-tag mb-3\" [ngClass]=\"slide.tagClass\">{{slide.tag}}</span>\n <h2 class=\"text-3xl md:text-5xl font-bold mb-3\" itemprop=\"name\">{{slide.title}}</h2>\n <p class=\"mb-4 text-secondary\" itemprop=\"description\">{{slide.description}}</p>\n @if (slide.button) {\n <a pButton pRipple (click)=\"navigateToWhatsapp(slide)\" class=\"cursor-pointer\" [ngClass]=\"slide.button.class\" [title]=\"'M\u00E1s informaci\u00F3n sobre ' + slide.title\">{{slide.button.text}}</a>\n }\n </div>\n </div>\n <!-- Imagen -->\n <div class=\"flex-1 flex align-items-center justify-content-center order-1 md:order-2 image-box p-0 overflow-hidden\">\n <img [ngSrc]=\"slide.image\" \n [alt]=\"slide.alt\"\n [priority]=\"$index === 0\"\n width=\"600\" height=\"400\"\n class=\"w-full h-full object-cover md:w-auto md:h-auto md:border-round-xl shadow-2\" \n itemprop=\"image\">\n </div>\n </div>\n }\n </div>\n <!-- Controles de Navegaci\u00F3n (Flechas laterales) -->\n <button class=\"absolute nav-btn-pos left-0 ml-2 md:ml-3 border-circle border-none bg-white-alpha-20 text-white w-3rem h-3rem flex align-items-center justify-content-center hover:bg-white-alpha-40 transition-colors cursor-pointer p-0\" style=\"transform: translateY(-50%); z-index: 20;\" aria-label=\"Anterior\" (click)=\"prevSlide()\">\n <i class=\"fas fa-chevron-left text-xl\"></i>\n </button>\n <button class=\"absolute nav-btn-pos right-0 mr-2 md:mr-3 border-circle border-none bg-white-alpha-20 text-white w-3rem h-3rem flex align-items-center justify-content-center hover:bg-white-alpha-40 transition-colors cursor-pointer p-0\" style=\"transform: translateY(-50%); z-index: 20;\" aria-label=\"Siguiente\" (click)=\"nextSlide()\">\n <i class=\"fas fa-chevron-right text-xl\"></i>\n </button>\n\n <!-- Indicadores (Puntos abajo al centro) -->\n <div class=\"absolute bottom-0 left-0 w-full flex justify-content-center gap-2 pb-3\" style=\"z-index: 20;\">\n @for (slide of slides; track $index) {\n <button class=\"nav-dot border-circle p-0\" [class.active]=\"$index === currentSlide\" (click)=\"goToSlide($index)\" [attr.aria-label]=\"'Ir a diapositiva ' + ($index + 1)\"></button>\n }\n </div>\n </div>\n</section>\n", styles: [".carrusel-bg{min-height:10vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(-45deg,#6a1b9a,#fbc02d,#0288d1,#6a1b9a);background-size:400% 400%;animation:gradient 15s ease infinite}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.slide{opacity:0;pointer-events:none;z-index:1;transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1);transform:translate(100px) scale(.95);position:absolute;top:0;left:0;width:100%;height:100%}.slide.active{opacity:1;pointer-events:all;z-index:10;transform:translate(0) scale(1)}.slide .content-box{transform:translateY(30px);opacity:0;transition:all .6s ease .3s}.slide.active .content-box{transform:translateY(0);opacity:1}.slide .image-box{transform:scale(1.1);opacity:0;transition:all .8s ease .1s}.slide.active .image-box{transform:scale(1);opacity:1}.nav-dot{transition:all .3s ease;width:.75rem;height:.75rem;background:#ffffff80;border:none;outline:none;cursor:pointer}.nav-dot.active{width:2rem;background:#fff}.nav-btn-pos{top:55%!important}@media (min-width: 768px){.nav-btn-pos{top:50%!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PrimegModule }, { kind: "directive", type: i1.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "directive", type: i4$1.Ripple, selector: "[pRipple]" }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }] });
1742
1789
  }
1743
1790
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: Carruselt1, decorators: [{
1744
1791
  type: Component,
1745
1792
  args: [{ selector: 'lib-carruselt-1', imports: [CommonModule, PrimegModule, NgOptimizedImage], template: "\n\n<section aria-label=\"Carrusel de productos inflables recreativos y publicitarios\" class=\"carrusel-bg p-3 flex flex-column align-items-center justify-content-center w-full\" aria-label=\"Carrusel de productos inflables y recreativos\" itemscope itemtype=\"https://schema.org/ItemList\">\n <div class=\"relative w-full max-w-6xl h-30rem bg-white-alpha-10 border-1 border-white-alpha-30 border-round-3xl shadow-4 overflow-hidden flex flex-column justify-content-center\">\n <div class=\"w-full h-full relative\">\n @for (slide of slides; track $index) {\n <div class=\"slide flex flex-column md:flex-row h-full absolute w-full transition-all duration-800\"\n [class.active]=\"$index === currentSlide\"\n itemprop=\"itemListElement\" itemscope itemtype=\"https://schema.org/Product\">\n <meta itemprop=\"position\" [content]=\"$index + 1\">\n <!-- Texto -->\n <div class=\"flex-1 flex align-items-center justify-content-center p-4 md:pl-8 order-2 md:order-1\">\n <div class=\"content-box text-white md:ml-4\">\n <span class=\"p-tag mb-3\" [ngClass]=\"slide.tagClass\">{{slide.tag}}</span>\n <h2 class=\"text-3xl md:text-5xl font-bold mb-3\" itemprop=\"name\">{{slide.title}}</h2>\n <p class=\"mb-4 text-secondary\" itemprop=\"description\">{{slide.description}}</p>\n @if (slide.button) {\n <a pButton pRipple (click)=\"navigateToWhatsapp(slide)\" class=\"cursor-pointer\" [ngClass]=\"slide.button.class\" [title]=\"'M\u00E1s informaci\u00F3n sobre ' + slide.title\">{{slide.button.text}}</a>\n }\n </div>\n </div>\n <!-- Imagen -->\n <div class=\"flex-1 flex align-items-center justify-content-center order-1 md:order-2 image-box p-0 overflow-hidden\">\n <img [ngSrc]=\"slide.image\" \n [alt]=\"slide.alt\"\n [priority]=\"$index === 0\"\n width=\"600\" height=\"400\"\n class=\"w-full h-full object-cover md:w-auto md:h-auto md:border-round-xl shadow-2\" \n itemprop=\"image\">\n </div>\n </div>\n }\n </div>\n <!-- Controles de Navegaci\u00F3n (Flechas laterales) -->\n <button class=\"absolute nav-btn-pos left-0 ml-2 md:ml-3 border-circle border-none bg-white-alpha-20 text-white w-3rem h-3rem flex align-items-center justify-content-center hover:bg-white-alpha-40 transition-colors cursor-pointer p-0\" style=\"transform: translateY(-50%); z-index: 20;\" aria-label=\"Anterior\" (click)=\"prevSlide()\">\n <i class=\"fas fa-chevron-left text-xl\"></i>\n </button>\n <button class=\"absolute nav-btn-pos right-0 mr-2 md:mr-3 border-circle border-none bg-white-alpha-20 text-white w-3rem h-3rem flex align-items-center justify-content-center hover:bg-white-alpha-40 transition-colors cursor-pointer p-0\" style=\"transform: translateY(-50%); z-index: 20;\" aria-label=\"Siguiente\" (click)=\"nextSlide()\">\n <i class=\"fas fa-chevron-right text-xl\"></i>\n </button>\n\n <!-- Indicadores (Puntos abajo al centro) -->\n <div class=\"absolute bottom-0 left-0 w-full flex justify-content-center gap-2 pb-3\" style=\"z-index: 20;\">\n @for (slide of slides; track $index) {\n <button class=\"nav-dot border-circle p-0\" [class.active]=\"$index === currentSlide\" (click)=\"goToSlide($index)\" [attr.aria-label]=\"'Ir a diapositiva ' + ($index + 1)\"></button>\n }\n </div>\n </div>\n</section>\n", styles: [".carrusel-bg{min-height:10vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(-45deg,#6a1b9a,#fbc02d,#0288d1,#6a1b9a);background-size:400% 400%;animation:gradient 15s ease infinite}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.slide{opacity:0;pointer-events:none;z-index:1;transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1);transform:translate(100px) scale(.95);position:absolute;top:0;left:0;width:100%;height:100%}.slide.active{opacity:1;pointer-events:all;z-index:10;transform:translate(0) scale(1)}.slide .content-box{transform:translateY(30px);opacity:0;transition:all .6s ease .3s}.slide.active .content-box{transform:translateY(0);opacity:1}.slide .image-box{transform:scale(1.1);opacity:0;transition:all .8s ease .1s}.slide.active .image-box{transform:scale(1);opacity:1}.nav-dot{transition:all .3s ease;width:.75rem;height:.75rem;background:#ffffff80;border:none;outline:none;cursor:pointer}.nav-dot.active{width:2rem;background:#fff}.nav-btn-pos{top:55%!important}@media (min-width: 768px){.nav-btn-pos{top:50%!important}}\n"] }]
1746
- }] });
1793
+ }], ctorParameters: () => [{ type: GoogleService }], propDecorators: { DatosNegocio: [{
1794
+ type: Input
1795
+ }] } });
1747
1796
 
1748
1797
  class PaginatorPgComponent {
1749
1798
  componente = {
@@ -3940,26 +3989,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
3940
3989
 
3941
3990
  class ShWatsButtonCard {
3942
3991
  productSvc;
3992
+ googleService;
3943
3993
  // producto a compartir
3944
3994
  product = {};
3995
+ DatosNegocio = null;
3945
3996
  // indica si el usuario está logueado
3946
3997
  isLogin = false;
3947
3998
  // descuento del producto
3948
3999
  discount = 0;
3949
- constructor(productSvc) {
4000
+ constructor(productSvc, googleService) {
3950
4001
  this.productSvc = productSvc;
4002
+ this.googleService = googleService;
3951
4003
  }
3952
4004
  shareProductOnWhatsapp() {
3953
- const url = window.location.href;
3954
- this.productSvc.contactWhatsapp('+573118025433', url, this.isLogin, this.product);
4005
+ const whatsappNumber = this.DatosNegocio?.telefono || '+573118025433';
4006
+ const text = `Mira este producto: ${this.product?.name ?? ''} - ${window.location.href}`;
4007
+ const whatsappUrl = `https://wa.me/${whatsappNumber}?text=${encodeURIComponent(text)}`;
4008
+ if (this.DatosNegocio?.googleAdsConversionId) {
4009
+ this.googleService.reportConversion(this.DatosNegocio.googleAdsConversionId, whatsappUrl);
4010
+ }
4011
+ else {
4012
+ window.open(whatsappUrl, '_blank');
4013
+ }
4014
+ if (this.DatosNegocio?.googleAnalyticsEvent) {
4015
+ this.googleService.reportAnalyticsEvent(this.DatosNegocio.googleAnalyticsEvent, { producto: this.product?.name });
4016
+ }
3955
4017
  }
3956
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ShWatsButtonCard, deps: [{ token: ProductService }], target: i0.ɵɵFactoryTarget.Component });
3957
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: ShWatsButtonCard, isStandalone: true, selector: "lib-sh-wats-button-card", inputs: { product: "product", isLogin: "isLogin", discount: "discount" }, ngImport: i0, template: " <p-button\n (click)=\"shareProductOnWhatsapp()\"\n pTooltip=\"Cotizar\"\n tooltipPosition=\"top\"\n icon=\"pi pi-whatsapp\"\n label=\"Cotizar\"\n styleClass=\"w-full font-bold border-round-lg shadow-3 hover-zoom\"\n class=\"w-full\"\n >\n </p-button>", styles: [""], dependencies: [{ kind: "ngmodule", type: PrimegModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }] });
4018
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ShWatsButtonCard, deps: [{ token: ProductService }, { token: GoogleService }], target: i0.ɵɵFactoryTarget.Component });
4019
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: ShWatsButtonCard, isStandalone: true, selector: "lib-sh-wats-button-card", inputs: { product: "product", DatosNegocio: "DatosNegocio", isLogin: "isLogin", discount: "discount" }, ngImport: i0, template: " <p-button\n (click)=\"shareProductOnWhatsapp()\"\n pTooltip=\"Cotizar\"\n tooltipPosition=\"top\"\n icon=\"pi pi-whatsapp\"\n label=\"Cotizar\"\n styleClass=\"w-full font-bold border-round-lg shadow-3 hover-zoom\"\n class=\"w-full\"\n >\n </p-button>", styles: [""], dependencies: [{ kind: "ngmodule", type: PrimegModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }] });
3958
4020
  }
3959
4021
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ShWatsButtonCard, decorators: [{
3960
4022
  type: Component,
3961
4023
  args: [{ selector: 'lib-sh-wats-button-card', imports: [PrimegModule], template: " <p-button\n (click)=\"shareProductOnWhatsapp()\"\n pTooltip=\"Cotizar\"\n tooltipPosition=\"top\"\n icon=\"pi pi-whatsapp\"\n label=\"Cotizar\"\n styleClass=\"w-full font-bold border-round-lg shadow-3 hover-zoom\"\n class=\"w-full\"\n >\n </p-button>" }]
3962
- }], ctorParameters: () => [{ type: ProductService }], propDecorators: { product: [{
4024
+ }], ctorParameters: () => [{ type: ProductService }, { type: GoogleService }], propDecorators: { product: [{
4025
+ type: Input
4026
+ }], DatosNegocio: [{
3963
4027
  type: Input
3964
4028
  }], isLogin: [{
3965
4029
  type: Input
@@ -4159,7 +4223,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
4159
4223
 
4160
4224
  class Header2Component {
4161
4225
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: Header2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
4162
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: Header2Component, isStandalone: true, selector: "lib-header2", ngImport: i0, template: "<header class=\"header_section\">\n <div class=\"container-fluid\">\n <mat-toolbar color=\"primary\">\n <a mat-button routerLink=\"/index\">\n <img src=\"assets/images/logo.png\" alt=\"\" style=\"height: 40px;\">\n <span style=\"color: #F25D27; margin-left: 10px;\">\n Dog Paradice\n </span>\n </a>\n <span class=\"spacer\"></span>\n <button mat-icon-button class=\"example-icon\" aria-label=\"Toggle sidenav\" (click)=\"sidenav.toggle()\">\n <mat-icon>menu</mat-icon>\n </button>\n </mat-toolbar>\n \n <mat-sidenav-container class=\"example-container\">\n <mat-sidenav #sidenav mode=\"side\" opened>\n <mat-nav-list>\n <a mat-list-item routerLink=\"/index\">Lare</a>\n <a mat-list-item routerLink=\"/service\">Servi\u00E7os</a>\n <a mat-list-item href=\"https://w.app/DOGPARADICE\" target=\"_blank\">Contato</a>\n </mat-nav-list>\n </mat-sidenav>\n <mat-sidenav-content>\n <!-- This is where your main content goes -->\n </mat-sidenav-content>\n </mat-sidenav-container>\n </div>\n </header>\n \n", styles: [".header_section{background:#fff}.container-fluid{padding:0}.spacer{flex:1 1 auto}.example-container{height:100%;width:100%}.example-icon{display:none}@media (max-width: 600px){.example-icon{display:block}mat-toolbar{flex-direction:row}.spacer{display:none}mat-sidenav{width:250px}}\n"], dependencies: [{ kind: "ngmodule", type: CoreModuleLib }, { kind: "component", type: i1$7.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$3.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i3$3.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i3$3.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "component", type: i4$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i5$1.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i5$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }] });
4226
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: Header2Component, isStandalone: true, selector: "lib-header2", ngImport: i0, template: "<header class=\"header_section\">\n <div class=\"container-fluid\">\n <mat-toolbar color=\"primary\">\n <a mat-button routerLink=\"/index\">\n <img src=\"assets/images/logo.png\" alt=\"\" style=\"height: 40px;\">\n <span style=\"color: #F25D27; margin-left: 10px;\">\n Dog Paradice\n </span>\n </a>\n <span class=\"spacer\"></span>\n <button mat-icon-button class=\"example-icon\" aria-label=\"Toggle sidenav\" (click)=\"sidenav.toggle()\">\n <mat-icon>menu</mat-icon>\n </button>\n </mat-toolbar>\n \n <mat-sidenav-container class=\"example-container\">\n <mat-sidenav #sidenav mode=\"side\" opened>\n <mat-nav-list>\n <a mat-list-item routerLink=\"/index\">Lare</a>\n <a mat-list-item routerLink=\"/service\">Servi\u00E7os</a>\n <a mat-list-item href=\"https://w.app/DOGPARADICE\" target=\"_blank\">Contato</a>\n </mat-nav-list>\n </mat-sidenav>\n <mat-sidenav-content>\n <!-- This is where your main content goes -->\n </mat-sidenav-content>\n </mat-sidenav-container>\n </div>\n </header>\n \n", styles: [".header_section{background:#fff}.container-fluid{padding:0}.spacer{flex:1 1 auto}.example-container{height:100%;width:100%}.example-icon{display:none}@media (max-width: 600px){.example-icon{display:block}mat-toolbar{flex-direction:row}.spacer{display:none}mat-sidenav{width:250px}}\n"], dependencies: [{ kind: "ngmodule", type: CoreModuleLib }, { kind: "component", type: i1$7.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$2.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i3$2.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i3$2.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "component", type: i4$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i5$1.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i5$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }] });
4163
4227
  }
4164
4228
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: Header2Component, decorators: [{
4165
4229
  type: Component,
@@ -4482,7 +4546,7 @@ class ProductDialog1Component {
4482
4546
  }
4483
4547
  }
4484
4548
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ProductDialog1Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
4485
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ProductDialog1Component, isStandalone: true, selector: "lib-product-dialog1", inputs: { productDialog: "productDialog", product: "product", statuses: "statuses", triggerSave: "triggerSave" }, outputs: { productDialogChange: "productDialogChange", onSave: "onSave", onCancel: "onCancel" }, usesOnChanges: true, ngImport: i0, template: "\n <div class=\"flex flex-col gap-6\">\n @if (product['image']) {\n <img\n [src]=\"product['image']\"\n [alt]=\"product['image']\"\n class=\"block m-auto pb-4\"\n />\n }\n <div>\n <label for=\"name\" class=\"block font-bold mb-3\">Name</label>\n <input\n type=\"text\"\n pInputText\n id=\"name\"\n [(ngModel)]=\"product['name']\"\n required\n autofocus\n fluid\n />\n @if (submitted && !product['name']) {\n <small class=\"text-red-500\">Name is required.</small>\n }\n </div>\n <div>\n <label for=\"description\" class=\"block font-bold mb-3\"\n >Description</label\n >\n <textarea\n id=\"description\"\n pTextarea\n [(ngModel)]=\"product['description']\"\n required\n rows=\"3\"\n cols=\"20\"\n fluid\n ></textarea>\n </div>\n\n <div>\n <label for=\"inventoryStatus\" class=\"block font-bold mb-3\"\n >Inventory Status</label\n >\n <p-select\n [(ngModel)]=\"product['inventoryStatus']\"\n inputId=\"inventoryStatus\"\n [options]=\"statuses\"\n placeholder=\"Select a Status\"\n fluid\n />\n </div>\n\n <div>\n <span class=\"block font-bold mb-4\">Category</span>\n <div class=\"grid grid-cols-12 gap-4\">\n <div class=\"flex items-center gap-2 col-span-6\">\n <p-radiobutton\n id=\"category1\"\n name=\"category\"\n value=\"Accessories\"\n [(ngModel)]=\"product['category']\"\n />\n <label for=\"category1\">Accessories</label>\n </div>\n <div class=\"flex items-center gap-2 col-span-6\">\n <p-radiobutton\n id=\"category2\"\n name=\"category\"\n value=\"Clothing\"\n [(ngModel)]=\"product['category']\"\n />\n <label for=\"category2\">Clothing</label>\n </div>\n <div class=\"flex items-center gap-2 col-span-6\">\n <p-radiobutton\n id=\"category3\"\n name=\"category\"\n value=\"Electronics\"\n [(ngModel)]=\"product['category']\"\n />\n <label for=\"category3\">Electronics</label>\n </div>\n <div class=\"flex items-center gap-2 col-span-6\">\n <p-radiobutton\n id=\"category4\"\n name=\"category\"\n value=\"Fitness\"\n [(ngModel)]=\"product['category']\"\n />\n <label for=\"category4\">Fitness</label>\n </div>\n </div>\n </div>\n\n <div class=\"grid grid-cols-12 gap-4\">\n <div class=\"col-span-6\">\n <label for=\"price\" class=\"block font-bold mb-3\">Price</label>\n <p-inputnumber\n id=\"price\"\n [(ngModel)]=\"product['price']\"\n mode=\"currency\"\n currency=\"USD\"\n locale=\"en-US\"\n fluid\n />\n </div>\n <div class=\"col-span-6\">\n <label for=\"quantity\" class=\"block font-bold mb-3\">Quantity</label>\n <p-inputnumber id=\"quantity\" [(ngModel)]=\"product['quantity']\" fluid />\n </div>\n </div>\n </div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: PrimegModule }, { kind: "directive", type: i2$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "directive", type: i3$4.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i5$2.RadioButton, selector: "p-radioButton, p-radiobutton, p-radio-button", inputs: ["value", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "styleClass", "autofocus", "binary", "variant", "size"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i7.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }] });
4549
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ProductDialog1Component, isStandalone: true, selector: "lib-product-dialog1", inputs: { productDialog: "productDialog", product: "product", statuses: "statuses", triggerSave: "triggerSave" }, outputs: { productDialogChange: "productDialogChange", onSave: "onSave", onCancel: "onCancel" }, usesOnChanges: true, ngImport: i0, template: "\n <div class=\"flex flex-col gap-6\">\n @if (product['image']) {\n <img\n [src]=\"product['image']\"\n [alt]=\"product['image']\"\n class=\"block m-auto pb-4\"\n />\n }\n <div>\n <label for=\"name\" class=\"block font-bold mb-3\">Name</label>\n <input\n type=\"text\"\n pInputText\n id=\"name\"\n [(ngModel)]=\"product['name']\"\n required\n autofocus\n fluid\n />\n @if (submitted && !product['name']) {\n <small class=\"text-red-500\">Name is required.</small>\n }\n </div>\n <div>\n <label for=\"description\" class=\"block font-bold mb-3\"\n >Description</label\n >\n <textarea\n id=\"description\"\n pTextarea\n [(ngModel)]=\"product['description']\"\n required\n rows=\"3\"\n cols=\"20\"\n fluid\n ></textarea>\n </div>\n\n <div>\n <label for=\"inventoryStatus\" class=\"block font-bold mb-3\"\n >Inventory Status</label\n >\n <p-select\n [(ngModel)]=\"product['inventoryStatus']\"\n inputId=\"inventoryStatus\"\n [options]=\"statuses\"\n placeholder=\"Select a Status\"\n fluid\n />\n </div>\n\n <div>\n <span class=\"block font-bold mb-4\">Category</span>\n <div class=\"grid grid-cols-12 gap-4\">\n <div class=\"flex items-center gap-2 col-span-6\">\n <p-radiobutton\n id=\"category1\"\n name=\"category\"\n value=\"Accessories\"\n [(ngModel)]=\"product['category']\"\n />\n <label for=\"category1\">Accessories</label>\n </div>\n <div class=\"flex items-center gap-2 col-span-6\">\n <p-radiobutton\n id=\"category2\"\n name=\"category\"\n value=\"Clothing\"\n [(ngModel)]=\"product['category']\"\n />\n <label for=\"category2\">Clothing</label>\n </div>\n <div class=\"flex items-center gap-2 col-span-6\">\n <p-radiobutton\n id=\"category3\"\n name=\"category\"\n value=\"Electronics\"\n [(ngModel)]=\"product['category']\"\n />\n <label for=\"category3\">Electronics</label>\n </div>\n <div class=\"flex items-center gap-2 col-span-6\">\n <p-radiobutton\n id=\"category4\"\n name=\"category\"\n value=\"Fitness\"\n [(ngModel)]=\"product['category']\"\n />\n <label for=\"category4\">Fitness</label>\n </div>\n </div>\n </div>\n\n <div class=\"grid grid-cols-12 gap-4\">\n <div class=\"col-span-6\">\n <label for=\"price\" class=\"block font-bold mb-3\">Price</label>\n <p-inputnumber\n id=\"price\"\n [(ngModel)]=\"product['price']\"\n mode=\"currency\"\n currency=\"USD\"\n locale=\"en-US\"\n fluid\n />\n </div>\n <div class=\"col-span-6\">\n <label for=\"quantity\" class=\"block font-bold mb-3\">Quantity</label>\n <p-inputnumber id=\"quantity\" [(ngModel)]=\"product['quantity']\" fluid />\n </div>\n </div>\n </div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: PrimegModule }, { kind: "directive", type: i2$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "directive", type: i3$3.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i5$2.RadioButton, selector: "p-radioButton, p-radiobutton, p-radio-button", inputs: ["value", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "styleClass", "autofocus", "binary", "variant", "size"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i7.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }] });
4486
4550
  }
4487
4551
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ProductDialog1Component, decorators: [{
4488
4552
  type: Component,
@@ -6358,7 +6422,7 @@ class AppTopbar {
6358
6422
  </div>
6359
6423
  </div>
6360
6424
  </div>
6361
- </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i4$2.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfigurator, selector: "app-configurator" }] });
6425
+ </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i4$3.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfigurator, selector: "app-configurator" }] });
6362
6426
  }
6363
6427
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AppTopbar, decorators: [{
6364
6428
  type: Component,
@@ -7339,7 +7403,7 @@ class SectionAddCardsButtons {
7339
7403
  console.log('Producto agregado al carrito:', event);
7340
7404
  }
7341
7405
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SectionAddCardsButtons, deps: [], target: i0.ɵɵFactoryTarget.Component });
7342
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: SectionAddCardsButtons, isStandalone: true, selector: "lib-section-add-cards-buttons", inputs: { product: "product", isLogin: "isLogin" }, ngImport: i0, template: "@if (isLogin) {\n <lib-button-add-to-card1 [product]=\"product\" (addToCart)=\"onAddToCart($event)\">\n </lib-button-add-to-card1>\n} @else {\n <lib-sh-wats-button-card [product]=\"product\" [isLogin]=\"isLogin\">\n </lib-sh-wats-button-card>\n}\n", styles: [""], dependencies: [{ kind: "component", type: ShWatsButtonCard, selector: "lib-sh-wats-button-card", inputs: ["product", "isLogin", "discount"] }, { kind: "component", type: ButtonAddToCard1, selector: "lib-button-add-to-card1", inputs: ["product"], outputs: ["addToCart"] }] });
7406
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: SectionAddCardsButtons, isStandalone: true, selector: "lib-section-add-cards-buttons", inputs: { product: "product", isLogin: "isLogin" }, ngImport: i0, template: "@if (isLogin) {\n <lib-button-add-to-card1 [product]=\"product\" (addToCart)=\"onAddToCart($event)\">\n </lib-button-add-to-card1>\n} @else {\n <lib-sh-wats-button-card [product]=\"product\" [isLogin]=\"isLogin\">\n </lib-sh-wats-button-card>\n}\n", styles: [""], dependencies: [{ kind: "component", type: ShWatsButtonCard, selector: "lib-sh-wats-button-card", inputs: ["product", "DatosNegocio", "isLogin", "discount"] }, { kind: "component", type: ButtonAddToCard1, selector: "lib-button-add-to-card1", inputs: ["product"], outputs: ["addToCart"] }] });
7343
7407
  }
7344
7408
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SectionAddCardsButtons, decorators: [{
7345
7409
  type: Component,
@@ -7352,6 +7416,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
7352
7416
 
7353
7417
  class DetalleCarrito1Component {
7354
7418
  productService;
7419
+ googleService;
7355
7420
  addToCart = new EventEmitter();
7356
7421
  // Metadata del componente
7357
7422
  componente = {
@@ -7378,8 +7443,19 @@ class DetalleCarrito1Component {
7378
7443
  isPersonalizable = false;
7379
7444
  // Variable para controlar la visibilidad del menú de compartir
7380
7445
  shareMenuOpen = false;
7381
- constructor(productService) {
7446
+ DatosNegocio = {
7447
+ nombreNegocio: 'Zigma Inflables',
7448
+ logo: '../../../assets/imagenes/logoZigmaInflables.svg',
7449
+ urlWhatssapp: 'https://tinyurl.com/zigmainflables',
7450
+ email: 'zigmainflables.com',
7451
+ googleAnalyticsEvent: "cotizar",
7452
+ googleAdsConversionId: "AW-17894779083",
7453
+ businessModule: [],
7454
+ telefono: '+573118025433'
7455
+ };
7456
+ constructor(productService, googleService) {
7382
7457
  this.productService = productService;
7458
+ this.googleService = googleService;
7383
7459
  }
7384
7460
  ngOnInit() {
7385
7461
  this.checkIsProductExists();
@@ -7408,9 +7484,18 @@ class DetalleCarrito1Component {
7408
7484
  this.isFavorite = !this.isFavorite;
7409
7485
  }
7410
7486
  shareProductOnWhatsapp() {
7411
- const url = window.location.href;
7412
- console.log(this.isLogin);
7413
- this.productService.contactWhatsapp('+573118025433', url, this.isLogin, this.product);
7487
+ const whatsappNumber = this.DatosNegocio?.telefono || '+573118025433';
7488
+ const text = `Mira este producto: ${this.product?.name ?? ''} - ${window.location.href}`;
7489
+ const whatsappUrl = `https://wa.me/${whatsappNumber}?text=${encodeURIComponent(text)}`;
7490
+ if (this.DatosNegocio?.googleAdsConversionId) {
7491
+ this.googleService.reportConversion(this.DatosNegocio.googleAdsConversionId, whatsappUrl);
7492
+ }
7493
+ else {
7494
+ window.open(whatsappUrl, '_blank');
7495
+ }
7496
+ if (this.DatosNegocio?.googleAnalyticsEvent) {
7497
+ this.googleService.reportAnalyticsEvent(this.DatosNegocio.googleAnalyticsEvent, { producto: this.product?.name });
7498
+ }
7414
7499
  }
7415
7500
  toggleShareMenu() {
7416
7501
  this.shareMenuOpen = !this.shareMenuOpen;
@@ -7445,13 +7530,13 @@ class DetalleCarrito1Component {
7445
7530
  navigateToProductDetail() {
7446
7531
  console.log('Navegando a la página de detalle del producto...');
7447
7532
  }
7448
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DetalleCarrito1Component, deps: [{ token: ProductService }], target: i0.ɵɵFactoryTarget.Component });
7449
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DetalleCarrito1Component, isStandalone: true, selector: "lib-detalle-carrito-1", inputs: { product: "product", isLogin: "isLogin", isPersonalizable: "isPersonalizable" }, outputs: { addToCart: "addToCart" }, ngImport: i0, template: "@if (product) {\n<div id=\"product-container\" class=\"shadow-2 border-round-2xl p-3 md:p-5 lg:p-6\">\n <!-- Contenedor principal de la p\u00E1gina de detalle -->\n <div class=\"grid\">\n <!-- Bloque de imagen principal -->\n <div class=\"flex flex-column col-12 lg:col-6\">\n <div class=\"main-image-frame bg-gray-100 border-round-xl flex justify-content-center align-items-center\">\n <img\n [src]=\"selectedImageUrl\"\n [alt]=\"product.imagen[0].alt || product.name\"\n loading=\"lazy\" width=\"1024\" height=\"520\"\n class=\"main-image border-round-xl\" />\n </div>\n\n <!-- Miniaturas debajo en m\u00F3vil y tablet -->\n @if (product.imagen && product.imagen.length > 0) {\n <div class=\"flex flex-row gap-2 overflow-x-auto pt-2\">\n @for (imagen of product.imagen; track $index) {\n <button type=\"button\" class=\"thumbnail-container border-round-lg cursor-pointer\" (click)=\"updateMainImage(imagen.url)\">\n <div class=\"thumbnail\" [class.thumbnail-active]=\"isActiveThumbnail(imagen.url)\">\n <img [src]=\"imagen.url\" alt=\"Miniatura {{ imagen.alt }}\" loading=\"lazy\" width=\"88\" height=\"88\" />\n </div>\n </button>\n }\n </div>\n }\n </div>\n\n <!-- Columna de informaci\u00F3n del producto -->\n <div class=\"flex flex-column justify-content-between col-12 lg:col-6\">\n <div class=\"flex flex-column gap-3\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <h1 class=\"text-3xl font-bold text-900\">{{ product.name }}</h1>\n <p-button \n [text]=\"true\" \n [rounded]=\"true\"\n (onClick)=\"toggleFavorite()\"\n [icon]=\"isFavorite ? 'pi pi-heart-fill' : 'pi pi-heart'\"\n [class]=\"isFavorite ? 'text-red-500' : 'text-500'\"\n class=\"hover:text-red-500\">\n </p-button>\n </div>\n\n \n\n <!-- Bloque descripci\u00F3n con fondo gris como card -->\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border\">\n <p class=\"text-700 line-height-3 m-0 font-bold\">Descripci\u00F3n</p>\n <p class=\"text-700 line-height-3 m-0\">{{ product.descripcion }}</p>\n </div>\n\n <div class=\"flex align-items-center gap-3\">\n @if(isLogin){\n @if(product.descuento != undefined && product.descuento > 0) {\n <span class=\"old-price\">{{ product.precios[0].precio | currency:product.precios[0].codigo_iso :'code' }}</span>\n <span class=\"discount-label\">{{ product.descuento}}% OFF</span>\n }\n <span class=\"current-price\">{{ discount | currency:product.precios[0].codigo_iso :'code'}}</span>\n } @else {\n <a\n class=\"contact-btn\"\n (click)=\"shareProductOnWhatsapp()\"\n aria-label=\"Contactar por WhatsApp\">\n <i class=\"pi pi-whatsapp\"></i>\n <span>Contactar</span>\n </a>\n }\n </div>\n\n <!-- Info b\u00E1sica: categor\u00EDa y disponibles -->\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border text-sm\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <strong class=\"font-bold text-700\">Categor\u00EDa:</strong>\n <span class=\"text-600 text-right overflow-hidden text-overflow-ellipsis\" style=\"max-width: 60%;\">\n {{ product.nombreCategoria || 'Sin categor\u00EDa' }}\n </span>\n </div>\n <div class=\"flex justify-content-between align-items-center\">\n <strong class=\"font-bold text-700\">Disponibles:</strong>\n <span class=\"text-600 font-medium\">{{ product.cantidad }}</span>\n </div>\n </div>\n\n <!-- Badges informativos -->\n <div class=\"info-badges mb-4\">\n <div class=\"badge\"><i class=\"pi pi-shield\"></i><span>Compra protegida</span></div>\n <div class=\"badge\"><i class=\"pi pi-truck\"></i><span>Entrega r\u00E1pida</span></div>\n </div>\n </div>\n\n <div class=\"cta-card\">\n <!-- Botones de acci\u00F3n: Personalizar y Compartir -->\n <div class=\"flex gap-2 mb-3\">\n @if (isPersonalizable) {\n <p-button \n (click)=\"navigateToProductDetail()\" \n pTooltip=\"Personalizar\"\n icon=\"pi pi-pencil\"\n tooltipPosition=\"top\"\n styleClass=\"bg-900 text-white w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-700 transition-colors shadow-1\">\n </p-button>\n }\n \n <!-- Men\u00FA flotante de redes estilo PrimeNG -->\n <div class=\"relative inline-block ml-2 align-middle\">\n <button (click)=\"toggleShareMenu()\"\n pTooltip=\"Compartir\" tooltipPosition=\"top\"\n aria-label=\"Compartir en redes sociales\"\n class=\"surface-100 text-900 w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-200 transition-colors shadow-1\">\n <i class=\"pi\" [ngClass]=\"{'pi-times': shareMenuOpen, 'pi-share-alt': !shareMenuOpen}\"></i>\n </button>\n\n @if (shareMenuOpen) {\n <div class=\"flex gap-2 absolute z-5 mt-2 shadow-2 p-2 border-round surface-0\" style=\"left: 0; min-width: 120px;\">\n <button (click)=\"touchRedes('whatsapp')\" \n class=\"p-button-rounded p-button-success p-button-text flex align-items-center gap-2 w-full border-none bg-transparent hover:surface-100 cursor-pointer p-2 mb-1\">\n <i class=\"pi pi-whatsapp text-xl text-green-500\"></i>\n <span class=\"text-700 font-medium\">WhatsApp</span>\n </button>\n <button (click)=\"touchRedes('facebook')\" \n class=\"p-button-rounded p-button-info p-button-text flex align-items-center gap-2 w-full border-none bg-transparent hover:surface-100 cursor-pointer p-2\">\n <i class=\"pi pi-facebook text-xl text-blue-500\"></i>\n <span class=\"text-700 font-medium\">Facebook</span>\n </button>\n </div>\n }\n </div>\n </div>\n \n\n <lib-section-add-cards-buttons \n [product]=\"product\" \n [isLogin]=\"isLogin\">\n </lib-section-add-cards-buttons>\n\n @if (showCartMessage) {\n <div class=\"mt-3 text-center text-sm font-semibold text-green-600\">\n Producto a\u00F1adido al carrito.\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n} @else {\n <div class=\"surface-card shadow-2 border-round-2xl p-3 md:p-5 lg:p-6 w-full\">\n <div class=\"flex justify-content-center align-items-center\" style=\"height: 16rem;\">\n <p class=\"text-500 text-lg\">Cargando producto...</p>\n </div>\n </div>\n}", styles: ["#product-container{background:#fff;box-shadow:0 12px 32px #00000014,0 2px 12px #0000000a;border-radius:1rem}.main-image-frame{min-height:420px;height:520px;display:flex;align-items:center;justify-content:center;background:#fff;box-shadow:0 8px 24px #00000014}.main-image{width:100%;max-width:640px;height:100%;object-fit:contain}@media (min-width: 1024px){.main-image-frame{height:600px;box-shadow:0 14px 40px #0000001a}.main-image{max-width:860px}}.thumbnail-container{transition:transform .2s ease-in-out}.thumbnail-container:hover{transform:scale(1.05)}.thumbnail{border:2px solid transparent;border-radius:8px;overflow:hidden;transition:border-color .2s ease-in-out}.thumbnail img{width:100%;height:88px;object-fit:cover;display:block}.thumbnail.thumbnail-active{border-color:#3b82f6}.thumbnails-rail{max-height:520px;overflow:auto;padding-right:4px;border-right:1px solid rgba(0,0,0,.06)}.old-price{text-decoration:line-through;color:#9ca3af;font-size:1.125rem}.current-price{color:#1f2937;font-size:2rem;font-weight:700}.discount-label{background-color:#dc2626;color:#fff;padding:.25rem .5rem;border-radius:.375rem;font-size:.875rem;font-weight:600}.info-badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.info-badges .badge{display:inline-flex;align-items:center;gap:.5rem;background:#f8fafc;border:1px solid #e2e8f0;color:#334155;padding:.5rem .75rem;border-radius:.5rem;font-weight:600}.info-badges .badge i{font-size:1rem}.quantity-btn{width:2.5rem;height:2.5rem;border:1px solid #d1d5db;border-radius:.375rem;background-color:#f9fafb;transition:all .2s ease-in-out}.quantity-btn:hover{background-color:#f3f4f6;border-color:#9ca3af}.quantity-btn:active{transform:scale(.95)}:host ::ng-deep .p-rating .p-rating-icon{color:#fbbf24;font-size:1.25rem}:host ::ng-deep .p-button.w-full{width:100%!important;justify-content:center;padding:1rem 1.5rem;font-size:1.125rem;font-weight:700}:host ::ng-deep .p-image .p-image-preview-indicator{background-color:#00000080;border-radius:50%}:host ::ng-deep .contact-btn{display:inline-flex;align-items:center;gap:.5rem;background-color:#25d366;color:#fff;padding:.75rem 1.25rem;border-radius:.5rem;font-weight:700;box-shadow:0 2px 6px #0000001a;transition:transform .15s ease,box-shadow .15s ease}:host ::ng-deep .contact-btn:hover{transform:translateY(-1px);box-shadow:0 4px 10px #00000026;text-decoration:none}:host ::ng-deep .contact-btn i.pi.pi-whatsapp{font-size:1.25rem}:host ::ng-deep .cta-card{margin-top:1rem;padding:1rem;border:1px solid #e5e7eb;border-radius:.75rem;background:#fff;box-shadow:0 10px 25px #0000000d}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PrimegModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: SectionAddCardsButtons, selector: "lib-section-add-cards-buttons", inputs: ["product", "isLogin"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
7533
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DetalleCarrito1Component, deps: [{ token: ProductService }, { token: GoogleService }], target: i0.ɵɵFactoryTarget.Component });
7534
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DetalleCarrito1Component, isStandalone: true, selector: "lib-detalle-carrito-1", inputs: { product: "product", isLogin: "isLogin", isPersonalizable: "isPersonalizable", DatosNegocio: "DatosNegocio" }, outputs: { addToCart: "addToCart" }, ngImport: i0, template: "@if (product) {\n<div id=\"product-container\" class=\"shadow-2 border-round-2xl p-3 md:p-5 lg:p-6\">\n <!-- Contenedor principal de la p\u00E1gina de detalle -->\n <div class=\"grid\">\n <!-- Bloque de imagen principal -->\n <div class=\"flex flex-column col-12 lg:col-6\">\n <div class=\"main-image-frame bg-gray-100 border-round-xl flex justify-content-center align-items-center\">\n <img\n [src]=\"selectedImageUrl\"\n [alt]=\"product.imagen[0].alt || product.name\"\n loading=\"lazy\" width=\"1024\" height=\"520\"\n class=\"main-image border-round-xl\" />\n </div>\n\n <!-- Miniaturas debajo en m\u00F3vil y tablet -->\n @if (product.imagen && product.imagen.length > 0) {\n <div class=\"flex flex-row gap-2 overflow-x-auto pt-2\">\n @for (imagen of product.imagen; track $index) {\n <button type=\"button\" class=\"thumbnail-container border-round-lg cursor-pointer\" (click)=\"updateMainImage(imagen.url)\">\n <div class=\"thumbnail\" [class.thumbnail-active]=\"isActiveThumbnail(imagen.url)\">\n <img [src]=\"imagen.url\" alt=\"Miniatura {{ imagen.alt }}\" loading=\"lazy\" width=\"88\" height=\"88\" />\n </div>\n </button>\n }\n </div>\n }\n </div>\n\n <!-- Columna de informaci\u00F3n del producto -->\n <div class=\"flex flex-column justify-content-between col-12 lg:col-6\">\n <div class=\"flex flex-column gap-3\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <h1 class=\"text-3xl font-bold text-900\">{{ product.name }}</h1>\n <p-button \n [text]=\"true\" \n [rounded]=\"true\"\n (onClick)=\"toggleFavorite()\"\n [icon]=\"isFavorite ? 'pi pi-heart-fill' : 'pi pi-heart'\"\n [class]=\"isFavorite ? 'text-red-500' : 'text-500'\"\n class=\"hover:text-red-500\">\n </p-button>\n </div>\n\n \n\n <!-- Bloque descripci\u00F3n con fondo gris como card -->\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border\">\n <p class=\"text-700 line-height-3 m-0 font-bold\">Descripci\u00F3n</p>\n <p class=\"text-700 line-height-3 m-0\">{{ product.descripcion }}</p>\n </div>\n\n <div class=\"flex align-items-center gap-3\">\n @if(isLogin){\n @if(product.descuento != undefined && product.descuento > 0) {\n <span class=\"old-price\">{{ product.precios[0].precio | currency:product.precios[0].codigo_iso :'code' }}</span>\n <span class=\"discount-label\">{{ product.descuento}}% OFF</span>\n }\n <span class=\"current-price\">{{ discount | currency:product.precios[0].codigo_iso :'code'}}</span>\n } @else {\n <a\n class=\"contact-btn\"\n (click)=\"shareProductOnWhatsapp()\"\n aria-label=\"Contactar por WhatsApp\">\n <i class=\"pi pi-whatsapp\"></i>\n <span>Contactar</span>\n </a>\n }\n </div>\n\n <!-- Info b\u00E1sica: categor\u00EDa y disponibles -->\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border text-sm\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <strong class=\"font-bold text-700\">Categor\u00EDa:</strong>\n <span class=\"text-600 text-right overflow-hidden text-overflow-ellipsis\" style=\"max-width: 60%;\">\n {{ product.nombreCategoria || 'Sin categor\u00EDa' }}\n </span>\n </div>\n <div class=\"flex justify-content-between align-items-center\">\n <strong class=\"font-bold text-700\">Disponibles:</strong>\n <span class=\"text-600 font-medium\">{{ product.cantidad }}</span>\n </div>\n </div>\n\n <!-- Badges informativos -->\n <div class=\"info-badges mb-4\">\n <div class=\"badge\"><i class=\"pi pi-shield\"></i><span>Compra protegida</span></div>\n <div class=\"badge\"><i class=\"pi pi-truck\"></i><span>Entrega r\u00E1pida</span></div>\n </div>\n </div>\n\n <div class=\"cta-card\">\n <!-- Botones de acci\u00F3n: Personalizar y Compartir -->\n <div class=\"flex gap-2 mb-3\">\n @if (isPersonalizable) {\n <p-button \n (click)=\"navigateToProductDetail()\" \n pTooltip=\"Personalizar\"\n icon=\"pi pi-pencil\"\n tooltipPosition=\"top\"\n styleClass=\"bg-900 text-white w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-700 transition-colors shadow-1\">\n </p-button>\n }\n \n <!-- Men\u00FA flotante de redes estilo PrimeNG -->\n <div class=\"relative inline-block ml-2 align-middle\">\n <button (click)=\"toggleShareMenu()\"\n pTooltip=\"Compartir\" tooltipPosition=\"top\"\n aria-label=\"Compartir en redes sociales\"\n class=\"surface-100 text-900 w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-200 transition-colors shadow-1\">\n <i class=\"pi\" [ngClass]=\"{'pi-times': shareMenuOpen, 'pi-share-alt': !shareMenuOpen}\"></i>\n </button>\n\n @if (shareMenuOpen) {\n <div class=\"flex gap-2 absolute z-5 mt-2 shadow-2 p-2 border-round surface-0\" style=\"left: 0; min-width: 120px;\">\n <button (click)=\"touchRedes('whatsapp')\" \n class=\"p-button-rounded p-button-success p-button-text flex align-items-center gap-2 w-full border-none bg-transparent hover:surface-100 cursor-pointer p-2 mb-1\">\n <i class=\"pi pi-whatsapp text-xl text-green-500\"></i>\n <span class=\"text-700 font-medium\">WhatsApp</span>\n </button>\n <button (click)=\"touchRedes('facebook')\" \n class=\"p-button-rounded p-button-info p-button-text flex align-items-center gap-2 w-full border-none bg-transparent hover:surface-100 cursor-pointer p-2\">\n <i class=\"pi pi-facebook text-xl text-blue-500\"></i>\n <span class=\"text-700 font-medium\">Facebook</span>\n </button>\n </div>\n }\n </div>\n </div>\n \n\n <lib-section-add-cards-buttons \n [product]=\"product\" \n [isLogin]=\"isLogin\">\n </lib-section-add-cards-buttons>\n\n @if (showCartMessage) {\n <div class=\"mt-3 text-center text-sm font-semibold text-green-600\">\n Producto a\u00F1adido al carrito.\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n} @else {\n <div class=\"surface-card shadow-2 border-round-2xl p-3 md:p-5 lg:p-6 w-full\">\n <div class=\"flex justify-content-center align-items-center\" style=\"height: 16rem;\">\n <p class=\"text-500 text-lg\">Cargando producto...</p>\n </div>\n </div>\n}", styles: ["#product-container{background:#fff;box-shadow:0 12px 32px #00000014,0 2px 12px #0000000a;border-radius:1rem}.main-image-frame{min-height:420px;height:520px;display:flex;align-items:center;justify-content:center;background:#fff;box-shadow:0 8px 24px #00000014}.main-image{width:100%;max-width:640px;height:100%;object-fit:contain}@media (min-width: 1024px){.main-image-frame{height:600px;box-shadow:0 14px 40px #0000001a}.main-image{max-width:860px}}.thumbnail-container{transition:transform .2s ease-in-out}.thumbnail-container:hover{transform:scale(1.05)}.thumbnail{border:2px solid transparent;border-radius:8px;overflow:hidden;transition:border-color .2s ease-in-out}.thumbnail img{width:100%;height:88px;object-fit:cover;display:block}.thumbnail.thumbnail-active{border-color:#3b82f6}.thumbnails-rail{max-height:520px;overflow:auto;padding-right:4px;border-right:1px solid rgba(0,0,0,.06)}.old-price{text-decoration:line-through;color:#9ca3af;font-size:1.125rem}.current-price{color:#1f2937;font-size:2rem;font-weight:700}.discount-label{background-color:#dc2626;color:#fff;padding:.25rem .5rem;border-radius:.375rem;font-size:.875rem;font-weight:600}.info-badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.info-badges .badge{display:inline-flex;align-items:center;gap:.5rem;background:#f8fafc;border:1px solid #e2e8f0;color:#334155;padding:.5rem .75rem;border-radius:.5rem;font-weight:600}.info-badges .badge i{font-size:1rem}.quantity-btn{width:2.5rem;height:2.5rem;border:1px solid #d1d5db;border-radius:.375rem;background-color:#f9fafb;transition:all .2s ease-in-out}.quantity-btn:hover{background-color:#f3f4f6;border-color:#9ca3af}.quantity-btn:active{transform:scale(.95)}:host ::ng-deep .p-rating .p-rating-icon{color:#fbbf24;font-size:1.25rem}:host ::ng-deep .p-button.w-full{width:100%!important;justify-content:center;padding:1rem 1.5rem;font-size:1.125rem;font-weight:700}:host ::ng-deep .p-image .p-image-preview-indicator{background-color:#00000080;border-radius:50%}:host ::ng-deep .contact-btn{display:inline-flex;align-items:center;gap:.5rem;background-color:#25d366;color:#fff;padding:.75rem 1.25rem;border-radius:.5rem;font-weight:700;box-shadow:0 2px 6px #0000001a;transition:transform .15s ease,box-shadow .15s ease}:host ::ng-deep .contact-btn:hover{transform:translateY(-1px);box-shadow:0 4px 10px #00000026;text-decoration:none}:host ::ng-deep .contact-btn i.pi.pi-whatsapp{font-size:1.25rem}:host ::ng-deep .cta-card{margin-top:1rem;padding:1rem;border:1px solid #e5e7eb;border-radius:.75rem;background:#fff;box-shadow:0 10px 25px #0000000d}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PrimegModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: SectionAddCardsButtons, selector: "lib-section-add-cards-buttons", inputs: ["product", "isLogin"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
7450
7535
  }
7451
7536
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DetalleCarrito1Component, decorators: [{
7452
7537
  type: Component,
7453
7538
  args: [{ selector: 'lib-detalle-carrito-1', imports: [CommonModule, PrimegModule, FormsModule, SectionAddCardsButtons], standalone: true, template: "@if (product) {\n<div id=\"product-container\" class=\"shadow-2 border-round-2xl p-3 md:p-5 lg:p-6\">\n <!-- Contenedor principal de la p\u00E1gina de detalle -->\n <div class=\"grid\">\n <!-- Bloque de imagen principal -->\n <div class=\"flex flex-column col-12 lg:col-6\">\n <div class=\"main-image-frame bg-gray-100 border-round-xl flex justify-content-center align-items-center\">\n <img\n [src]=\"selectedImageUrl\"\n [alt]=\"product.imagen[0].alt || product.name\"\n loading=\"lazy\" width=\"1024\" height=\"520\"\n class=\"main-image border-round-xl\" />\n </div>\n\n <!-- Miniaturas debajo en m\u00F3vil y tablet -->\n @if (product.imagen && product.imagen.length > 0) {\n <div class=\"flex flex-row gap-2 overflow-x-auto pt-2\">\n @for (imagen of product.imagen; track $index) {\n <button type=\"button\" class=\"thumbnail-container border-round-lg cursor-pointer\" (click)=\"updateMainImage(imagen.url)\">\n <div class=\"thumbnail\" [class.thumbnail-active]=\"isActiveThumbnail(imagen.url)\">\n <img [src]=\"imagen.url\" alt=\"Miniatura {{ imagen.alt }}\" loading=\"lazy\" width=\"88\" height=\"88\" />\n </div>\n </button>\n }\n </div>\n }\n </div>\n\n <!-- Columna de informaci\u00F3n del producto -->\n <div class=\"flex flex-column justify-content-between col-12 lg:col-6\">\n <div class=\"flex flex-column gap-3\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <h1 class=\"text-3xl font-bold text-900\">{{ product.name }}</h1>\n <p-button \n [text]=\"true\" \n [rounded]=\"true\"\n (onClick)=\"toggleFavorite()\"\n [icon]=\"isFavorite ? 'pi pi-heart-fill' : 'pi pi-heart'\"\n [class]=\"isFavorite ? 'text-red-500' : 'text-500'\"\n class=\"hover:text-red-500\">\n </p-button>\n </div>\n\n \n\n <!-- Bloque descripci\u00F3n con fondo gris como card -->\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border\">\n <p class=\"text-700 line-height-3 m-0 font-bold\">Descripci\u00F3n</p>\n <p class=\"text-700 line-height-3 m-0\">{{ product.descripcion }}</p>\n </div>\n\n <div class=\"flex align-items-center gap-3\">\n @if(isLogin){\n @if(product.descuento != undefined && product.descuento > 0) {\n <span class=\"old-price\">{{ product.precios[0].precio | currency:product.precios[0].codigo_iso :'code' }}</span>\n <span class=\"discount-label\">{{ product.descuento}}% OFF</span>\n }\n <span class=\"current-price\">{{ discount | currency:product.precios[0].codigo_iso :'code'}}</span>\n } @else {\n <a\n class=\"contact-btn\"\n (click)=\"shareProductOnWhatsapp()\"\n aria-label=\"Contactar por WhatsApp\">\n <i class=\"pi pi-whatsapp\"></i>\n <span>Contactar</span>\n </a>\n }\n </div>\n\n <!-- Info b\u00E1sica: categor\u00EDa y disponibles -->\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border text-sm\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <strong class=\"font-bold text-700\">Categor\u00EDa:</strong>\n <span class=\"text-600 text-right overflow-hidden text-overflow-ellipsis\" style=\"max-width: 60%;\">\n {{ product.nombreCategoria || 'Sin categor\u00EDa' }}\n </span>\n </div>\n <div class=\"flex justify-content-between align-items-center\">\n <strong class=\"font-bold text-700\">Disponibles:</strong>\n <span class=\"text-600 font-medium\">{{ product.cantidad }}</span>\n </div>\n </div>\n\n <!-- Badges informativos -->\n <div class=\"info-badges mb-4\">\n <div class=\"badge\"><i class=\"pi pi-shield\"></i><span>Compra protegida</span></div>\n <div class=\"badge\"><i class=\"pi pi-truck\"></i><span>Entrega r\u00E1pida</span></div>\n </div>\n </div>\n\n <div class=\"cta-card\">\n <!-- Botones de acci\u00F3n: Personalizar y Compartir -->\n <div class=\"flex gap-2 mb-3\">\n @if (isPersonalizable) {\n <p-button \n (click)=\"navigateToProductDetail()\" \n pTooltip=\"Personalizar\"\n icon=\"pi pi-pencil\"\n tooltipPosition=\"top\"\n styleClass=\"bg-900 text-white w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-700 transition-colors shadow-1\">\n </p-button>\n }\n \n <!-- Men\u00FA flotante de redes estilo PrimeNG -->\n <div class=\"relative inline-block ml-2 align-middle\">\n <button (click)=\"toggleShareMenu()\"\n pTooltip=\"Compartir\" tooltipPosition=\"top\"\n aria-label=\"Compartir en redes sociales\"\n class=\"surface-100 text-900 w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-200 transition-colors shadow-1\">\n <i class=\"pi\" [ngClass]=\"{'pi-times': shareMenuOpen, 'pi-share-alt': !shareMenuOpen}\"></i>\n </button>\n\n @if (shareMenuOpen) {\n <div class=\"flex gap-2 absolute z-5 mt-2 shadow-2 p-2 border-round surface-0\" style=\"left: 0; min-width: 120px;\">\n <button (click)=\"touchRedes('whatsapp')\" \n class=\"p-button-rounded p-button-success p-button-text flex align-items-center gap-2 w-full border-none bg-transparent hover:surface-100 cursor-pointer p-2 mb-1\">\n <i class=\"pi pi-whatsapp text-xl text-green-500\"></i>\n <span class=\"text-700 font-medium\">WhatsApp</span>\n </button>\n <button (click)=\"touchRedes('facebook')\" \n class=\"p-button-rounded p-button-info p-button-text flex align-items-center gap-2 w-full border-none bg-transparent hover:surface-100 cursor-pointer p-2\">\n <i class=\"pi pi-facebook text-xl text-blue-500\"></i>\n <span class=\"text-700 font-medium\">Facebook</span>\n </button>\n </div>\n }\n </div>\n </div>\n \n\n <lib-section-add-cards-buttons \n [product]=\"product\" \n [isLogin]=\"isLogin\">\n </lib-section-add-cards-buttons>\n\n @if (showCartMessage) {\n <div class=\"mt-3 text-center text-sm font-semibold text-green-600\">\n Producto a\u00F1adido al carrito.\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n} @else {\n <div class=\"surface-card shadow-2 border-round-2xl p-3 md:p-5 lg:p-6 w-full\">\n <div class=\"flex justify-content-center align-items-center\" style=\"height: 16rem;\">\n <p class=\"text-500 text-lg\">Cargando producto...</p>\n </div>\n </div>\n}", styles: ["#product-container{background:#fff;box-shadow:0 12px 32px #00000014,0 2px 12px #0000000a;border-radius:1rem}.main-image-frame{min-height:420px;height:520px;display:flex;align-items:center;justify-content:center;background:#fff;box-shadow:0 8px 24px #00000014}.main-image{width:100%;max-width:640px;height:100%;object-fit:contain}@media (min-width: 1024px){.main-image-frame{height:600px;box-shadow:0 14px 40px #0000001a}.main-image{max-width:860px}}.thumbnail-container{transition:transform .2s ease-in-out}.thumbnail-container:hover{transform:scale(1.05)}.thumbnail{border:2px solid transparent;border-radius:8px;overflow:hidden;transition:border-color .2s ease-in-out}.thumbnail img{width:100%;height:88px;object-fit:cover;display:block}.thumbnail.thumbnail-active{border-color:#3b82f6}.thumbnails-rail{max-height:520px;overflow:auto;padding-right:4px;border-right:1px solid rgba(0,0,0,.06)}.old-price{text-decoration:line-through;color:#9ca3af;font-size:1.125rem}.current-price{color:#1f2937;font-size:2rem;font-weight:700}.discount-label{background-color:#dc2626;color:#fff;padding:.25rem .5rem;border-radius:.375rem;font-size:.875rem;font-weight:600}.info-badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.info-badges .badge{display:inline-flex;align-items:center;gap:.5rem;background:#f8fafc;border:1px solid #e2e8f0;color:#334155;padding:.5rem .75rem;border-radius:.5rem;font-weight:600}.info-badges .badge i{font-size:1rem}.quantity-btn{width:2.5rem;height:2.5rem;border:1px solid #d1d5db;border-radius:.375rem;background-color:#f9fafb;transition:all .2s ease-in-out}.quantity-btn:hover{background-color:#f3f4f6;border-color:#9ca3af}.quantity-btn:active{transform:scale(.95)}:host ::ng-deep .p-rating .p-rating-icon{color:#fbbf24;font-size:1.25rem}:host ::ng-deep .p-button.w-full{width:100%!important;justify-content:center;padding:1rem 1.5rem;font-size:1.125rem;font-weight:700}:host ::ng-deep .p-image .p-image-preview-indicator{background-color:#00000080;border-radius:50%}:host ::ng-deep .contact-btn{display:inline-flex;align-items:center;gap:.5rem;background-color:#25d366;color:#fff;padding:.75rem 1.25rem;border-radius:.5rem;font-weight:700;box-shadow:0 2px 6px #0000001a;transition:transform .15s ease,box-shadow .15s ease}:host ::ng-deep .contact-btn:hover{transform:translateY(-1px);box-shadow:0 4px 10px #00000026;text-decoration:none}:host ::ng-deep .contact-btn i.pi.pi-whatsapp{font-size:1.25rem}:host ::ng-deep .cta-card{margin-top:1rem;padding:1rem;border:1px solid #e5e7eb;border-radius:.75rem;background:#fff;box-shadow:0 10px 25px #0000000d}\n"] }]
7454
- }], ctorParameters: () => [{ type: ProductService }], propDecorators: { addToCart: [{
7539
+ }], ctorParameters: () => [{ type: ProductService }, { type: GoogleService }], propDecorators: { addToCart: [{
7455
7540
  type: Output
7456
7541
  }], product: [{
7457
7542
  type: Input
@@ -7459,14 +7544,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
7459
7544
  type: Input
7460
7545
  }], isPersonalizable: [{
7461
7546
  type: Input
7547
+ }], DatosNegocio: [{
7548
+ type: Input
7462
7549
  }] } });
7463
7550
 
7464
7551
  class CardProductos1Component {
7465
7552
  productService;
7466
7553
  router;
7554
+ googleService;
7467
7555
  product;
7468
7556
  addToCart = new EventEmitter();
7469
7557
  isLogin = false;
7558
+ DatosNegocio = null;
7470
7559
  // Ruta base configurable desde el frontal para navegar al detalle
7471
7560
  detailRouteBase = ['productos'];
7472
7561
  discount = 0;
@@ -7477,9 +7566,10 @@ class CardProductos1Component {
7477
7566
  autoSlideInterval;
7478
7567
  constructor(
7479
7568
  // private currencyPipe: CurrencyPipe,
7480
- productService, router) {
7569
+ productService, router, googleService) {
7481
7570
  this.productService = productService;
7482
7571
  this.router = router;
7572
+ this.googleService = googleService;
7483
7573
  }
7484
7574
  /**
7485
7575
  * Inicializa el componente calculando el descuento y
@@ -7586,15 +7676,36 @@ class CardProductos1Component {
7586
7676
  * basado en si el usuario tiene sesión iniciada.
7587
7677
  */
7588
7678
  shareProductOnWhatsapp() {
7589
- this.productService.shareProductOnWhatsapp(this.shareBaseUrl, this.isLogin, this.product);
7679
+ const whatsappNumber = this.DatosNegocio?.telefono || '+573118025433';
7680
+ const text = `Mira este producto: ${this.product?.name ?? ''} - ${this.shareBaseUrl}`;
7681
+ const whatsappUrl = `https://wa.me/${whatsappNumber}?text=${encodeURIComponent(text)}`;
7682
+ if (this.DatosNegocio?.googleAdsConversionId) {
7683
+ this.googleService.reportConversion(this.DatosNegocio.googleAdsConversionId, whatsappUrl);
7684
+ }
7685
+ else {
7686
+ window.open(whatsappUrl, '_blank');
7687
+ }
7688
+ if (this.DatosNegocio?.googleAnalyticsEvent) {
7689
+ this.googleService.reportAnalyticsEvent(this.DatosNegocio.googleAnalyticsEvent, { producto: this.product?.name });
7690
+ }
7590
7691
  }
7591
7692
  /**
7592
7693
  * Abre WhatsApp para contactar directamente a un número predefinido
7593
7694
  * con un mensaje basado en si el usuario tiene sesión iniciada.
7594
7695
  */
7595
7696
  contactWhatsapp() {
7596
- const whatsappNumber = '+573118025433';
7597
- this.productService.contactWhatsapp(whatsappNumber, this.shareBaseUrl, this.isLogin, this.product);
7697
+ const whatsappNumber = this.DatosNegocio?.telefono || '+573118025433';
7698
+ const text = `Mira este producto: ${this.product?.name ?? ''} - ${this.shareBaseUrl}`;
7699
+ const whatsappUrl = `https://wa.me/${whatsappNumber}?text=${encodeURIComponent(text)}`;
7700
+ if (this.DatosNegocio?.googleAdsConversionId) {
7701
+ this.googleService.reportConversion(this.DatosNegocio.googleAdsConversionId, whatsappUrl);
7702
+ }
7703
+ else {
7704
+ window.open(whatsappUrl, '_blank');
7705
+ }
7706
+ if (this.DatosNegocio?.googleAnalyticsEvent) {
7707
+ this.googleService.reportAnalyticsEvent(this.DatosNegocio.googleAnalyticsEvent, { producto: this.product?.name });
7708
+ }
7598
7709
  }
7599
7710
  /**
7600
7711
  * Alterna la visibilidad del menú flotante de compartir en redes.
@@ -7608,28 +7719,28 @@ class CardProductos1Component {
7608
7719
  */
7609
7720
  touchRedes(red) {
7610
7721
  const url = this.shareBaseUrl;
7611
- const name = this.product?.name ?? '';
7612
7722
  if (red === 'whatsapp') {
7613
- const text = `Mira este producto: ${name} - ${url}`;
7614
- window.open(`https://api.whatsapp.com/send?text=${encodeURIComponent(text)}`, '_blank');
7723
+ this.shareProductOnWhatsapp();
7615
7724
  }
7616
7725
  if (red === 'facebook') {
7617
7726
  const fbUrl = `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(url)}`;
7618
7727
  window.open(fbUrl, '_blank', 'noopener');
7619
7728
  }
7620
7729
  }
7621
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CardProductos1Component, deps: [{ token: ProductService }, { token: i1$8.Router }], target: i0.ɵɵFactoryTarget.Component });
7622
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CardProductos1Component, isStandalone: true, selector: "lib-card-productos1", inputs: { product: "product", isLogin: "isLogin", detailRouteBase: "detailRouteBase" }, outputs: { addToCart: "addToCart" }, ngImport: i0, template: "<div aria-label=\"tarjetas de productos inflables\" class=\"surface-card shadow-3 border-round-xl overflow-visible relative transition-all transition-duration-300 hover:shadow-6 flex flex-column h-full hover-effect\"\n style=\"min-height: 520px; max-width: 400px; margin: 0 auto\">\n @if (product) {\n <div class=\"relative surface-ground flex align-items-center justify-content-center overflow-hidden p-3 image-hover-container\"\n style=\"height: 280px\">\n <img [src]=\"currentImageUrl || product.imagen[0]?.url\" [alt]=\"product.imagen[0]?.alt\" itemprop=\"image\"\n loading=\"lazy\" width=\"400\" height=\"280\"\n class=\"max-w-full max-h-full object-contain cursor-pointer transition-transform transition-duration-300 hover-zoom\"\n (click)=\"navigateToProductDetail()\" />\n\n <!-- Overlay con icono de ojo al hover -->\n <div class=\"image-overlay\">\n <button pButton type=\"button\" class=\"p-button-rounded p-button-info p-button-lg shadow-4\"\n (click)=\"navigateToProductDetail()\" [attr.aria-label]=\"'Ver detalle de ' + product.name\" pTooltip=\"Ver detalles\" tooltipPosition=\"top\">\n <i class=\"pi pi-eye text-xl\"></i>\n </button>\n </div>\n\n <button (click)=\"contactWhatsapp()\"\n aria-label=\"Contactar por WhatsApp\"\n class=\"absolute bottom-0 right-0 m-3 bg-green-500 border-none text-white w-3rem h-3rem border-circle shadow-4 flex align-items-center justify-content-center cursor-pointer transition-colors transition-duration-200 hover:bg-green-600 z-2\">\n <i class=\"pi pi-whatsapp text-2xl\"></i>\n </button>\n </div>\n\n <div class=\"p-3 flex flex-column flex-grow-1\">\n <div class=\"flex gap-2 overflow-x-auto pb-2 mb-3 z-1\">\n @for (image of product.imagen; track $index) {\n <img [src]=\"image.url\" [alt]=\"image.alt\" (click)=\"selectImage($index)\"\n loading=\"lazy\" width=\"48\" height=\"48\"\n class=\"w-3rem h-3rem border-round border-2 cursor-pointer flex-shrink-0 transition-all transition-duration-200 object-cover\"\n [class.border-900]=\"isActiveThumbnail($index)\" [class.border-transparent]=\"!isActiveThumbnail($index)\"\n [class.opacity-60]=\"!isActiveThumbnail($index)\" />\n }\n </div>\n\n <div class=\"surface-border border-top-1 w-full mb-3\"></div>\n\n <div class=\"flex justify-content-between align-items-start gap-2 mb-3\">\n <h3 class=\"text-xl font-semibold text-900 m-0 line-height-3 flex-grow-1 cursor-pointer hover:text-700 transition-colors\"\n (click)=\"navigateToProductDetail()\" style=\"word-break: break-word\">\n {{ product.name }}\n </h3>\n\n <div class=\"flex gap-2 flex-shrink-0 mt-1\" style=\"position: relative;\">\n @if (isLogin) {\n <p-button (click)=\"navigateToProductDetail()\" pTooltip=\"Personalizar\" icon=\"pi pi-pencil\"\n tooltipPosition=\"top\"\n styleClass=\"bg-900 text-white w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-700 transition-colors shadow-1\">\n </p-button>\n }\n <!-- Men\u00FA flotante de redes estilo PrimeNG -->\n <div class=\"relative\" style=\"position: absolute; right: -0.75rem; top: -0.75rem; z-index: 10;\">\n <button (click)=\"toggleShareMenu()\"\n aria-label=\"Compartir en redes sociales\"\n class=\"bg-green-500 border-none text-white w-2rem h-2rem border-circle shadow-2 flex align-items-center justify-content-center cursor-pointer transition-colors transition-duration-200 hover:bg-green-600\">\n <i class=\"pi\" [ngClass]=\"{'pi-times': shareMenuOpen, 'pi-share-alt': !shareMenuOpen}\"></i>\n </button>\n @if (shareMenuOpen) {\n <div class=\"flex gap-2 absolute\" style=\"right: 0; top: 2.6rem;\">\n <button (click)=\"touchRedes('whatsapp')\" aria-label=\"Compartir en WhatsApp\" class=\"border-none w-2rem h-2rem border-circle flex align-items-center justify-content-center cursor-pointer shadow-1\" style=\"background:#25D366;color:#fff\">\n <i class=\"pi pi-whatsapp\"></i>\n </button>\n <button (click)=\"touchRedes('facebook')\" aria-label=\"Compartir en Facebook\" class=\"border-none w-2rem h-2rem border-circle flex align-items-center justify-content-center cursor-pointer shadow-1\" style=\"background:#1877F2;color:#fff\">\n <i class=\"pi pi-facebook\"></i>\n </button>\n \n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border text-sm mb-4\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <strong class=\"font-bold text-700\">Categor\u00EDa:</strong>\n <span class=\"text-600 text-right overflow-hidden text-overflow-ellipsis\" style=\"max-width: 60%\">\n {{ product.nombreCategoria || 'Sin categor\u00EDa' }}\n </span>\n </div>\n <div class=\"flex justify-content-between align-items-center\">\n <strong class=\"font-bold text-700\">Disponibles:</strong>\n <span class=\"text-600 font-medium\">{{ product.cantidad }}</span>\n </div>\n </div>\n\n <div class=\"mt-auto\">\n\n\n <div class=\"flex align-items-end gap-2 mb-3 flex-wrap\">\n @if(isLogin){\n @if (product.descuento && product.descuento > 0) {\n <span class=\"text-500 line-through text-sm mb-1\">\n {{ product.precios[0].precio | currency: product.precios[0].codigo_iso : \"code\" }}\n </span>\n }\n\n <span class=\"text-2xl font-bold text-900\">\n {{ discount | currency: product.precios[0].codigo_iso : \"code\" }}\n </span>\n\n @if (product.descuento && product.descuento > 0) {\n <div class=\"bg-green-100 text-green-700 px-2 py-1 text-xs font-bold border-round mb-1 ml-auto\">\n {{ product.descuento }}% OFF\n </div>\n }\n } \n </div>\n\n <lib-section-add-cards-buttons [product]=\"product\" [isLogin]=\"isLogin\">\n </lib-section-add-cards-buttons>\n\n </div>\n </div>\n } @else {\n <div class=\"flex align-items-center justify-content-center h-full text-500\">\n Producto no disponible\n </div>\n }\n</div>", styles: [".hover-effect{transition:transform .3s ease,box-shadow .3s ease}.hover-effect:hover{transform:translateY(-4px)}.hover-zoom{transition:transform .35s ease}.hover-zoom:hover{transform:scale(1.05)}.overflow-x-auto{scrollbar-width:none}.overflow-x-auto::-webkit-scrollbar{display:none}.image-hover-container{position:relative}.image-hover-container .image-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0000002e;opacity:0;pointer-events:none;transition:opacity .25s ease}.image-hover-container:hover .image-overlay{opacity:1;pointer-events:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PrimegModule }, { kind: "directive", type: i1.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: SectionAddCardsButtons, selector: "lib-section-add-cards-buttons", inputs: ["product", "isLogin"] }, { kind: "ngmodule", type: IonicModule }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
7730
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CardProductos1Component, deps: [{ token: ProductService }, { token: i1$8.Router }, { token: GoogleService }], target: i0.ɵɵFactoryTarget.Component });
7731
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CardProductos1Component, isStandalone: true, selector: "lib-card-productos1", inputs: { product: "product", isLogin: "isLogin", DatosNegocio: "DatosNegocio", detailRouteBase: "detailRouteBase" }, outputs: { addToCart: "addToCart" }, ngImport: i0, template: "<div aria-label=\"tarjetas de productos inflables\" class=\"surface-card shadow-3 border-round-xl overflow-visible relative transition-all transition-duration-300 hover:shadow-6 flex flex-column h-full hover-effect\"\n style=\"min-height: 520px; max-width: 400px; margin: 0 auto\">\n @if (product) {\n <div class=\"relative surface-ground flex align-items-center justify-content-center overflow-hidden p-3 image-hover-container\"\n style=\"height: 280px\">\n <img [src]=\"currentImageUrl || product.imagen[0]?.url\" [alt]=\"product.imagen[0]?.alt\" itemprop=\"image\"\n loading=\"lazy\" width=\"400\" height=\"280\"\n class=\"max-w-full max-h-full object-contain cursor-pointer transition-transform transition-duration-300 hover-zoom\"\n (click)=\"navigateToProductDetail()\" />\n\n <!-- Overlay con icono de ojo al hover -->\n <div class=\"image-overlay\">\n <button pButton type=\"button\" class=\"p-button-rounded p-button-info p-button-lg shadow-4\"\n (click)=\"navigateToProductDetail()\" [attr.aria-label]=\"'Ver detalle de ' + product.name\" pTooltip=\"Ver detalles\" tooltipPosition=\"top\">\n <i class=\"pi pi-eye text-xl\"></i>\n </button>\n </div>\n\n <button (click)=\"contactWhatsapp()\"\n aria-label=\"Contactar por WhatsApp\"\n class=\"absolute bottom-0 right-0 m-3 bg-green-500 border-none text-white w-3rem h-3rem border-circle shadow-4 flex align-items-center justify-content-center cursor-pointer transition-colors transition-duration-200 hover:bg-green-600 z-2\">\n <i class=\"pi pi-whatsapp text-2xl\"></i>\n </button>\n </div>\n\n <div class=\"p-3 flex flex-column flex-grow-1\">\n <div class=\"flex gap-2 overflow-x-auto pb-2 mb-3 z-1\">\n @for (image of product.imagen; track $index) {\n <img [src]=\"image.url\" [alt]=\"image.alt\" (click)=\"selectImage($index)\"\n loading=\"lazy\" width=\"48\" height=\"48\"\n class=\"w-3rem h-3rem border-round border-2 cursor-pointer flex-shrink-0 transition-all transition-duration-200 object-cover\"\n [class.border-900]=\"isActiveThumbnail($index)\" [class.border-transparent]=\"!isActiveThumbnail($index)\"\n [class.opacity-60]=\"!isActiveThumbnail($index)\" />\n }\n </div>\n\n <div class=\"surface-border border-top-1 w-full mb-3\"></div>\n\n <div class=\"flex justify-content-between align-items-start gap-2 mb-3\">\n <h3 class=\"text-xl font-semibold text-900 m-0 line-height-3 flex-grow-1 cursor-pointer hover:text-700 transition-colors\"\n (click)=\"navigateToProductDetail()\" style=\"word-break: break-word\">\n {{ product.name }}\n </h3>\n\n <div class=\"flex gap-2 flex-shrink-0 mt-1\" style=\"position: relative;\">\n @if (isLogin) {\n <p-button (click)=\"navigateToProductDetail()\" pTooltip=\"Personalizar\" icon=\"pi pi-pencil\"\n tooltipPosition=\"top\"\n styleClass=\"bg-900 text-white w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-700 transition-colors shadow-1\">\n </p-button>\n }\n <!-- Men\u00FA flotante de redes estilo PrimeNG -->\n <div class=\"relative\" style=\"position: absolute; right: -0.75rem; top: -0.75rem; z-index: 10;\">\n <button (click)=\"toggleShareMenu()\"\n aria-label=\"Compartir en redes sociales\"\n class=\"bg-green-500 border-none text-white w-2rem h-2rem border-circle shadow-2 flex align-items-center justify-content-center cursor-pointer transition-colors transition-duration-200 hover:bg-green-600\">\n <i class=\"pi\" [ngClass]=\"{'pi-times': shareMenuOpen, 'pi-share-alt': !shareMenuOpen}\"></i>\n </button>\n @if (shareMenuOpen) {\n <div class=\"flex gap-2 absolute\" style=\"right: 0; top: 2.6rem;\">\n <button (click)=\"touchRedes('whatsapp')\" aria-label=\"Compartir en WhatsApp\" class=\"border-none w-2rem h-2rem border-circle flex align-items-center justify-content-center cursor-pointer shadow-1\" style=\"background:#25D366;color:#fff\">\n <i class=\"pi pi-whatsapp\"></i>\n </button>\n <button (click)=\"touchRedes('facebook')\" aria-label=\"Compartir en Facebook\" class=\"border-none w-2rem h-2rem border-circle flex align-items-center justify-content-center cursor-pointer shadow-1\" style=\"background:#1877F2;color:#fff\">\n <i class=\"pi pi-facebook\"></i>\n </button>\n \n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border text-sm mb-4\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <strong class=\"font-bold text-700\">Categor\u00EDa:</strong>\n <span class=\"text-600 text-right overflow-hidden text-overflow-ellipsis\" style=\"max-width: 60%\">\n {{ product.nombreCategoria || 'Sin categor\u00EDa' }}\n </span>\n </div>\n <div class=\"flex justify-content-between align-items-center\">\n <strong class=\"font-bold text-700\">Disponibles:</strong>\n <span class=\"text-600 font-medium\">{{ product.cantidad }}</span>\n </div>\n </div>\n\n <div class=\"mt-auto\">\n\n\n <div class=\"flex align-items-end gap-2 mb-3 flex-wrap\">\n @if(isLogin){\n @if (product.descuento && product.descuento > 0) {\n <span class=\"text-500 line-through text-sm mb-1\">\n {{ product.precios[0].precio | currency: product.precios[0].codigo_iso : \"code\" }}\n </span>\n }\n\n <span class=\"text-2xl font-bold text-900\">\n {{ discount | currency: product.precios[0].codigo_iso : \"code\" }}\n </span>\n\n @if (product.descuento && product.descuento > 0) {\n <div class=\"bg-green-100 text-green-700 px-2 py-1 text-xs font-bold border-round mb-1 ml-auto\">\n {{ product.descuento }}% OFF\n </div>\n }\n } \n </div>\n\n <lib-section-add-cards-buttons [product]=\"product\" [isLogin]=\"isLogin\">\n </lib-section-add-cards-buttons>\n\n </div>\n </div>\n } @else {\n <div class=\"flex align-items-center justify-content-center h-full text-500\">\n Producto no disponible\n </div>\n }\n</div>", styles: [".hover-effect{transition:transform .3s ease,box-shadow .3s ease}.hover-effect:hover{transform:translateY(-4px)}.hover-zoom{transition:transform .35s ease}.hover-zoom:hover{transform:scale(1.05)}.overflow-x-auto{scrollbar-width:none}.overflow-x-auto::-webkit-scrollbar{display:none}.image-hover-container{position:relative}.image-hover-container .image-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0000002e;opacity:0;pointer-events:none;transition:opacity .25s ease}.image-hover-container:hover .image-overlay{opacity:1;pointer-events:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PrimegModule }, { kind: "directive", type: i1.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: SectionAddCardsButtons, selector: "lib-section-add-cards-buttons", inputs: ["product", "isLogin"] }, { kind: "ngmodule", type: IonicModule }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
7623
7732
  }
7624
7733
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CardProductos1Component, decorators: [{
7625
7734
  type: Component,
7626
- args: [{ selector: 'lib-card-productos1', standalone: true, imports: [CommonModule, PrimegModule, SectionAddCardsButtons, IonicModule], template: "<div aria-label=\"tarjetas de productos inflables\" class=\"surface-card shadow-3 border-round-xl overflow-visible relative transition-all transition-duration-300 hover:shadow-6 flex flex-column h-full hover-effect\"\n style=\"min-height: 520px; max-width: 400px; margin: 0 auto\">\n @if (product) {\n <div class=\"relative surface-ground flex align-items-center justify-content-center overflow-hidden p-3 image-hover-container\"\n style=\"height: 280px\">\n <img [src]=\"currentImageUrl || product.imagen[0]?.url\" [alt]=\"product.imagen[0]?.alt\" itemprop=\"image\"\n loading=\"lazy\" width=\"400\" height=\"280\"\n class=\"max-w-full max-h-full object-contain cursor-pointer transition-transform transition-duration-300 hover-zoom\"\n (click)=\"navigateToProductDetail()\" />\n\n <!-- Overlay con icono de ojo al hover -->\n <div class=\"image-overlay\">\n <button pButton type=\"button\" class=\"p-button-rounded p-button-info p-button-lg shadow-4\"\n (click)=\"navigateToProductDetail()\" [attr.aria-label]=\"'Ver detalle de ' + product.name\" pTooltip=\"Ver detalles\" tooltipPosition=\"top\">\n <i class=\"pi pi-eye text-xl\"></i>\n </button>\n </div>\n\n <button (click)=\"contactWhatsapp()\"\n aria-label=\"Contactar por WhatsApp\"\n class=\"absolute bottom-0 right-0 m-3 bg-green-500 border-none text-white w-3rem h-3rem border-circle shadow-4 flex align-items-center justify-content-center cursor-pointer transition-colors transition-duration-200 hover:bg-green-600 z-2\">\n <i class=\"pi pi-whatsapp text-2xl\"></i>\n </button>\n </div>\n\n <div class=\"p-3 flex flex-column flex-grow-1\">\n <div class=\"flex gap-2 overflow-x-auto pb-2 mb-3 z-1\">\n @for (image of product.imagen; track $index) {\n <img [src]=\"image.url\" [alt]=\"image.alt\" (click)=\"selectImage($index)\"\n loading=\"lazy\" width=\"48\" height=\"48\"\n class=\"w-3rem h-3rem border-round border-2 cursor-pointer flex-shrink-0 transition-all transition-duration-200 object-cover\"\n [class.border-900]=\"isActiveThumbnail($index)\" [class.border-transparent]=\"!isActiveThumbnail($index)\"\n [class.opacity-60]=\"!isActiveThumbnail($index)\" />\n }\n </div>\n\n <div class=\"surface-border border-top-1 w-full mb-3\"></div>\n\n <div class=\"flex justify-content-between align-items-start gap-2 mb-3\">\n <h3 class=\"text-xl font-semibold text-900 m-0 line-height-3 flex-grow-1 cursor-pointer hover:text-700 transition-colors\"\n (click)=\"navigateToProductDetail()\" style=\"word-break: break-word\">\n {{ product.name }}\n </h3>\n\n <div class=\"flex gap-2 flex-shrink-0 mt-1\" style=\"position: relative;\">\n @if (isLogin) {\n <p-button (click)=\"navigateToProductDetail()\" pTooltip=\"Personalizar\" icon=\"pi pi-pencil\"\n tooltipPosition=\"top\"\n styleClass=\"bg-900 text-white w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-700 transition-colors shadow-1\">\n </p-button>\n }\n <!-- Men\u00FA flotante de redes estilo PrimeNG -->\n <div class=\"relative\" style=\"position: absolute; right: -0.75rem; top: -0.75rem; z-index: 10;\">\n <button (click)=\"toggleShareMenu()\"\n aria-label=\"Compartir en redes sociales\"\n class=\"bg-green-500 border-none text-white w-2rem h-2rem border-circle shadow-2 flex align-items-center justify-content-center cursor-pointer transition-colors transition-duration-200 hover:bg-green-600\">\n <i class=\"pi\" [ngClass]=\"{'pi-times': shareMenuOpen, 'pi-share-alt': !shareMenuOpen}\"></i>\n </button>\n @if (shareMenuOpen) {\n <div class=\"flex gap-2 absolute\" style=\"right: 0; top: 2.6rem;\">\n <button (click)=\"touchRedes('whatsapp')\" aria-label=\"Compartir en WhatsApp\" class=\"border-none w-2rem h-2rem border-circle flex align-items-center justify-content-center cursor-pointer shadow-1\" style=\"background:#25D366;color:#fff\">\n <i class=\"pi pi-whatsapp\"></i>\n </button>\n <button (click)=\"touchRedes('facebook')\" aria-label=\"Compartir en Facebook\" class=\"border-none w-2rem h-2rem border-circle flex align-items-center justify-content-center cursor-pointer shadow-1\" style=\"background:#1877F2;color:#fff\">\n <i class=\"pi pi-facebook\"></i>\n </button>\n \n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border text-sm mb-4\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <strong class=\"font-bold text-700\">Categor\u00EDa:</strong>\n <span class=\"text-600 text-right overflow-hidden text-overflow-ellipsis\" style=\"max-width: 60%\">\n {{ product.nombreCategoria || 'Sin categor\u00EDa' }}\n </span>\n </div>\n <div class=\"flex justify-content-between align-items-center\">\n <strong class=\"font-bold text-700\">Disponibles:</strong>\n <span class=\"text-600 font-medium\">{{ product.cantidad }}</span>\n </div>\n </div>\n\n <div class=\"mt-auto\">\n\n\n <div class=\"flex align-items-end gap-2 mb-3 flex-wrap\">\n @if(isLogin){\n @if (product.descuento && product.descuento > 0) {\n <span class=\"text-500 line-through text-sm mb-1\">\n {{ product.precios[0].precio | currency: product.precios[0].codigo_iso : \"code\" }}\n </span>\n }\n\n <span class=\"text-2xl font-bold text-900\">\n {{ discount | currency: product.precios[0].codigo_iso : \"code\" }}\n </span>\n\n @if (product.descuento && product.descuento > 0) {\n <div class=\"bg-green-100 text-green-700 px-2 py-1 text-xs font-bold border-round mb-1 ml-auto\">\n {{ product.descuento }}% OFF\n </div>\n }\n } \n </div>\n\n <lib-section-add-cards-buttons [product]=\"product\" [isLogin]=\"isLogin\">\n </lib-section-add-cards-buttons>\n\n </div>\n </div>\n } @else {\n <div class=\"flex align-items-center justify-content-center h-full text-500\">\n Producto no disponible\n </div>\n }\n</div>", styles: [".hover-effect{transition:transform .3s ease,box-shadow .3s ease}.hover-effect:hover{transform:translateY(-4px)}.hover-zoom{transition:transform .35s ease}.hover-zoom:hover{transform:scale(1.05)}.overflow-x-auto{scrollbar-width:none}.overflow-x-auto::-webkit-scrollbar{display:none}.image-hover-container{position:relative}.image-hover-container .image-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0000002e;opacity:0;pointer-events:none;transition:opacity .25s ease}.image-hover-container:hover .image-overlay{opacity:1;pointer-events:auto}\n"] }]
7627
- }], ctorParameters: () => [{ type: ProductService }, { type: i1$8.Router }], propDecorators: { product: [{
7735
+ args: [{ selector: 'lib-card-productos1', standalone: true, imports: [CommonModule, PrimegModule, SectionAddCardsButtons, IonicModule], template: "<div aria-label=\"tarjetas de productos inflables\" class=\"surface-card shadow-3 border-round-xl overflow-visible relative transition-all transition-duration-300 hover:shadow-6 flex flex-column h-full hover-effect\"\n style=\"min-height: 520px; max-width: 400px; margin: 0 auto\">\n @if (product) {\n <div class=\"relative surface-ground flex align-items-center justify-content-center overflow-hidden p-3 image-hover-container\"\n style=\"height: 280px\">\n <img [src]=\"currentImageUrl || product.imagen[0]?.url\" [alt]=\"product.imagen[0]?.alt\" itemprop=\"image\"\n loading=\"lazy\" width=\"400\" height=\"280\"\n class=\"max-w-full max-h-full object-contain cursor-pointer transition-transform transition-duration-300 hover-zoom\"\n (click)=\"navigateToProductDetail()\" />\n\n <!-- Overlay con icono de ojo al hover -->\n <div class=\"image-overlay\">\n <button pButton type=\"button\" class=\"p-button-rounded p-button-info p-button-lg shadow-4\"\n (click)=\"navigateToProductDetail()\" [attr.aria-label]=\"'Ver detalle de ' + product.name\" pTooltip=\"Ver detalles\" tooltipPosition=\"top\">\n <i class=\"pi pi-eye text-xl\"></i>\n </button>\n </div>\n\n <button (click)=\"contactWhatsapp()\"\n aria-label=\"Contactar por WhatsApp\"\n class=\"absolute bottom-0 right-0 m-3 bg-green-500 border-none text-white w-3rem h-3rem border-circle shadow-4 flex align-items-center justify-content-center cursor-pointer transition-colors transition-duration-200 hover:bg-green-600 z-2\">\n <i class=\"pi pi-whatsapp text-2xl\"></i>\n </button>\n </div>\n\n <div class=\"p-3 flex flex-column flex-grow-1\">\n <div class=\"flex gap-2 overflow-x-auto pb-2 mb-3 z-1\">\n @for (image of product.imagen; track $index) {\n <img [src]=\"image.url\" [alt]=\"image.alt\" (click)=\"selectImage($index)\"\n loading=\"lazy\" width=\"48\" height=\"48\"\n class=\"w-3rem h-3rem border-round border-2 cursor-pointer flex-shrink-0 transition-all transition-duration-200 object-cover\"\n [class.border-900]=\"isActiveThumbnail($index)\" [class.border-transparent]=\"!isActiveThumbnail($index)\"\n [class.opacity-60]=\"!isActiveThumbnail($index)\" />\n }\n </div>\n\n <div class=\"surface-border border-top-1 w-full mb-3\"></div>\n\n <div class=\"flex justify-content-between align-items-start gap-2 mb-3\">\n <h3 class=\"text-xl font-semibold text-900 m-0 line-height-3 flex-grow-1 cursor-pointer hover:text-700 transition-colors\"\n (click)=\"navigateToProductDetail()\" style=\"word-break: break-word\">\n {{ product.name }}\n </h3>\n\n <div class=\"flex gap-2 flex-shrink-0 mt-1\" style=\"position: relative;\">\n @if (isLogin) {\n <p-button (click)=\"navigateToProductDetail()\" pTooltip=\"Personalizar\" icon=\"pi pi-pencil\"\n tooltipPosition=\"top\"\n styleClass=\"bg-900 text-white w-2rem h-2rem border-circle border-none flex align-items-center justify-content-center cursor-pointer hover:bg-700 transition-colors shadow-1\">\n </p-button>\n }\n <!-- Men\u00FA flotante de redes estilo PrimeNG -->\n <div class=\"relative\" style=\"position: absolute; right: -0.75rem; top: -0.75rem; z-index: 10;\">\n <button (click)=\"toggleShareMenu()\"\n aria-label=\"Compartir en redes sociales\"\n class=\"bg-green-500 border-none text-white w-2rem h-2rem border-circle shadow-2 flex align-items-center justify-content-center cursor-pointer transition-colors transition-duration-200 hover:bg-green-600\">\n <i class=\"pi\" [ngClass]=\"{'pi-times': shareMenuOpen, 'pi-share-alt': !shareMenuOpen}\"></i>\n </button>\n @if (shareMenuOpen) {\n <div class=\"flex gap-2 absolute\" style=\"right: 0; top: 2.6rem;\">\n <button (click)=\"touchRedes('whatsapp')\" aria-label=\"Compartir en WhatsApp\" class=\"border-none w-2rem h-2rem border-circle flex align-items-center justify-content-center cursor-pointer shadow-1\" style=\"background:#25D366;color:#fff\">\n <i class=\"pi pi-whatsapp\"></i>\n </button>\n <button (click)=\"touchRedes('facebook')\" aria-label=\"Compartir en Facebook\" class=\"border-none w-2rem h-2rem border-circle flex align-items-center justify-content-center cursor-pointer shadow-1\" style=\"background:#1877F2;color:#fff\">\n <i class=\"pi pi-facebook\"></i>\n </button>\n \n </div>\n }\n </div>\n </div>\n </div>\n\n <div class=\"surface-ground p-3 border-round-xl border-1 surface-border text-sm mb-4\">\n <div class=\"flex justify-content-between align-items-center mb-2\">\n <strong class=\"font-bold text-700\">Categor\u00EDa:</strong>\n <span class=\"text-600 text-right overflow-hidden text-overflow-ellipsis\" style=\"max-width: 60%\">\n {{ product.nombreCategoria || 'Sin categor\u00EDa' }}\n </span>\n </div>\n <div class=\"flex justify-content-between align-items-center\">\n <strong class=\"font-bold text-700\">Disponibles:</strong>\n <span class=\"text-600 font-medium\">{{ product.cantidad }}</span>\n </div>\n </div>\n\n <div class=\"mt-auto\">\n\n\n <div class=\"flex align-items-end gap-2 mb-3 flex-wrap\">\n @if(isLogin){\n @if (product.descuento && product.descuento > 0) {\n <span class=\"text-500 line-through text-sm mb-1\">\n {{ product.precios[0].precio | currency: product.precios[0].codigo_iso : \"code\" }}\n </span>\n }\n\n <span class=\"text-2xl font-bold text-900\">\n {{ discount | currency: product.precios[0].codigo_iso : \"code\" }}\n </span>\n\n @if (product.descuento && product.descuento > 0) {\n <div class=\"bg-green-100 text-green-700 px-2 py-1 text-xs font-bold border-round mb-1 ml-auto\">\n {{ product.descuento }}% OFF\n </div>\n }\n } \n </div>\n\n <lib-section-add-cards-buttons [product]=\"product\" [isLogin]=\"isLogin\">\n </lib-section-add-cards-buttons>\n\n </div>\n </div>\n } @else {\n <div class=\"flex align-items-center justify-content-center h-full text-500\">\n Producto no disponible\n </div>\n }\n</div>", styles: [".hover-effect{transition:transform .3s ease,box-shadow .3s ease}.hover-effect:hover{transform:translateY(-4px)}.hover-zoom{transition:transform .35s ease}.hover-zoom:hover{transform:scale(1.05)}.overflow-x-auto{scrollbar-width:none}.overflow-x-auto::-webkit-scrollbar{display:none}.image-hover-container{position:relative}.image-hover-container .image-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0000002e;opacity:0;pointer-events:none;transition:opacity .25s ease}.image-hover-container:hover .image-overlay{opacity:1;pointer-events:auto}\n"] }]
7736
+ }], ctorParameters: () => [{ type: ProductService }, { type: i1$8.Router }, { type: GoogleService }], propDecorators: { product: [{
7628
7737
  type: Input
7629
7738
  }], addToCart: [{
7630
7739
  type: Output
7631
7740
  }], isLogin: [{
7632
7741
  type: Input
7742
+ }], DatosNegocio: [{
7743
+ type: Input
7633
7744
  }], detailRouteBase: [{
7634
7745
  type: Input
7635
7746
  }] } });
@@ -8122,21 +8233,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
8122
8233
  args: ['document:touchmove', ['$event']]
8123
8234
  }] } });
8124
8235
 
8125
- class BarFloatEcommerce1 {
8126
- componente = {
8127
- id: 33,
8128
- nombreComponente: 'lib-bar-float-ecommerce1',
8129
- version: '1.0',
8130
- descripcion: 'Componente para mostrar una barra flotante en la página de ecommerce1'
8131
- };
8132
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: BarFloatEcommerce1, deps: [], target: i0.ɵɵFactoryTarget.Component });
8133
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: BarFloatEcommerce1, isStandalone: true, selector: "lib-bar-float-ecommerce1", ngImport: i0, template: "<section aria-label=\"Secci\u00F3n principal de la f\u00E1brica de inflables\" class=\"bar-hero animate-hero-section\" style=\"background-image: url('../../../../../assets/imagenes/bannerInflables.png');\">\n <div class=\"bar-hero-inner\">\n <div class=\"bar-hero-card\">\n <p class=\"hero-subtitle\">\u00A1Bienvenido a Zigma Inflables!</p>\n <h1 aria-label=\"T\u00EDtulo principal: F\u00E1brica de inflables\" class=\"hero-title\">F\u00E1brica de inflables</h1>\n <p-button label=\"Ver cat\u00E1logo\" class=\"p-button-warning hero-cta\"></p-button>\n </div>\n </div>\n</section>", styles: [".bar-hero{background-size:cover;background-position:center;min-height:500px;position:relative}.bar-hero-inner{display:flex;align-items:center;justify-content:center;height:100%;padding:4rem 1rem}.bar-hero-card{background:#ffffffe6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:2rem;border-radius:1rem;max-width:900px;text-align:center;box-shadow:0 10px 30px #00000014}.hero-subtitle{margin:0 0 .5rem;color:#6b7280;font-size:1rem}.hero-title{margin:0 0 1rem;font-size:2rem;font-weight:800;color:#111827}.hero-cta{border-radius:999px;padding:.75rem 1.25rem}@media (min-width: 768px){.hero-title{font-size:2.5rem}.bar-hero-inner{padding-top:6rem}}.animate-hero-section{opacity:0;transform:translateY(50px);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-hero-section.is-visible{opacity:1;transform:translateY(0)}\n"], dependencies: [{ kind: "ngmodule", type: PrimegModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }], encapsulation: i0.ViewEncapsulation.None });
8134
- }
8135
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: BarFloatEcommerce1, decorators: [{
8136
- type: Component,
8137
- args: [{ selector: 'lib-bar-float-ecommerce1', imports: [PrimegModule], encapsulation: ViewEncapsulation.None, template: "<section aria-label=\"Secci\u00F3n principal de la f\u00E1brica de inflables\" class=\"bar-hero animate-hero-section\" style=\"background-image: url('../../../../../assets/imagenes/bannerInflables.png');\">\n <div class=\"bar-hero-inner\">\n <div class=\"bar-hero-card\">\n <p class=\"hero-subtitle\">\u00A1Bienvenido a Zigma Inflables!</p>\n <h1 aria-label=\"T\u00EDtulo principal: F\u00E1brica de inflables\" class=\"hero-title\">F\u00E1brica de inflables</h1>\n <p-button label=\"Ver cat\u00E1logo\" class=\"p-button-warning hero-cta\"></p-button>\n </div>\n </div>\n</section>", styles: [".bar-hero{background-size:cover;background-position:center;min-height:500px;position:relative}.bar-hero-inner{display:flex;align-items:center;justify-content:center;height:100%;padding:4rem 1rem}.bar-hero-card{background:#ffffffe6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:2rem;border-radius:1rem;max-width:900px;text-align:center;box-shadow:0 10px 30px #00000014}.hero-subtitle{margin:0 0 .5rem;color:#6b7280;font-size:1rem}.hero-title{margin:0 0 1rem;font-size:2rem;font-weight:800;color:#111827}.hero-cta{border-radius:999px;padding:.75rem 1.25rem}@media (min-width: 768px){.hero-title{font-size:2.5rem}.bar-hero-inner{padding-top:6rem}}.animate-hero-section{opacity:0;transform:translateY(50px);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-hero-section.is-visible{opacity:1;transform:translateY(0)}\n"] }]
8138
- }] });
8139
-
8140
8236
  class FooterEcommerce1 {
8141
8237
  componente = {
8142
8238
  id: 32,
@@ -8159,6 +8255,7 @@ class Ecommerce1 {
8159
8255
  router;
8160
8256
  route;
8161
8257
  renderer;
8258
+ googleService;
8162
8259
  platformId;
8163
8260
  // El usuario inicio sesion o no
8164
8261
  isLogin = false;
@@ -8189,12 +8286,14 @@ class Ecommerce1 {
8189
8286
  mouseOutListener;
8190
8287
  beforeUnloadListener;
8191
8288
  intersectionObserver;
8192
- constructor(router, route, renderer,
8289
+ // eslint-disable-next-line max-params
8290
+ constructor(router, route, renderer, googleService,
8193
8291
  // eslint-disable-next-line @typescript-eslint/no-wrapper-object-types
8194
8292
  platformId) {
8195
8293
  this.router = router;
8196
8294
  this.route = route;
8197
8295
  this.renderer = renderer;
8296
+ this.googleService = googleService;
8198
8297
  this.platformId = platformId;
8199
8298
  }
8200
8299
  ngOnInit() {
@@ -8300,10 +8399,18 @@ class Ecommerce1 {
8300
8399
  }
8301
8400
  openWhatsappChat(message) {
8302
8401
  const defaultMessage = 'Hola, estoy interesado en los productos de Zigma Inflables.';
8303
- const whatsappNumber = this.DatosNegocio?.telefono || '+573118025433'; // Reemplazar con número real
8402
+ const whatsappNumber = this.DatosNegocio?.telefono || '+573118025433';
8304
8403
  const finalMessage = message || defaultMessage;
8305
8404
  const whatsappUrl = `https://wa.me/${whatsappNumber}?text=${encodeURIComponent(finalMessage)}`;
8306
- window.open(whatsappUrl, '_blank');
8405
+ if (this.DatosNegocio?.googleAdsConversionId) {
8406
+ this.googleService.reportConversion(this.DatosNegocio.googleAdsConversionId, whatsappUrl);
8407
+ }
8408
+ else {
8409
+ window.open(whatsappUrl, '_blank');
8410
+ }
8411
+ if (this.DatosNegocio?.googleAnalyticsEvent) {
8412
+ this.googleService.reportAnalyticsEvent(this.DatosNegocio.googleAnalyticsEvent, { page: 'ecommerce1' });
8413
+ }
8307
8414
  }
8308
8415
  // ===== NEWSLETTER =====
8309
8416
  onNewsletterSubmit(email) {
@@ -8443,13 +8550,13 @@ class Ecommerce1 {
8443
8550
  console.log('Social login with:', provider);
8444
8551
  // Implementar login social
8445
8552
  }
8446
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: Ecommerce1, deps: [{ token: i1$8.Router }, { token: i1$8.ActivatedRoute }, { token: i0.Renderer2 }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
8447
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: Ecommerce1, isStandalone: true, selector: "lib-ecommerce1", inputs: { isLogin: "isLogin", DatosNegocio: "DatosNegocio", Categorias: "Categorias", routePaths: "routePaths" }, viewQueries: [{ propertyName: "whatsappButton", first: true, predicate: ["whatsappButton"], descendants: true }, { propertyName: "productGrid", first: true, predicate: ["productGrid"], descendants: true }, { propertyName: "mobileMenu", first: true, predicate: ["mobileMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: " <button id=\"whatsapp-button\"\n pButton\n type=\"button\"\n class=\"whatsapp-float p-button-rounded p-button-lg\"\n [ngClass]=\"{ 'p-button-success': showWhatsappButton, 'p-button-secondary': !showWhatsappButton }\"\n (click)=\"showWhatsappModalDialog()\"\n aria-label=\"Cont\u00E1ctanos por WhatsApp\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"vertical-align:middle\">\n <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488\"/>\n </svg>\n </button>\n\n <!-- WhatsApp Modal reemplazado por PrimeNG Dialog -->\n <p-dialog [(visible)]=\"showWhatsappModal\"\n modal=\"true\"\n [blockScroll]=\"true\"\n [closable]=\"true\"\n [draggable]=\"false\"\n [focusOnShow]=\"false\"\n [keepInViewport]=\"true\"\n [position]=\"'top'\"\n [style]=\"{ width: '360px', height: '400px' }\"\n [dismissableMask]=\"false\"\n [closeOnEscape]=\"false\"\n appendTo=\"body\">\n <div class=\"p-text-center\" style=\"display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.75rem;\">\n <div style=\"background:#25d366;color:white;width:72px;height:72px;border-radius:36px;display:inline-flex;align-items:center;justify-content:center;margin-bottom:1rem;\">\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488\"/>\n </svg>\n </div>\n <h3 class=\"p-text-center\">\u00A1No te vayas a\u00FAn!</h3>\n <p class=\"text-center\">Si tienes alguna pregunta, puedes chatear con nosotros directamente por WhatsApp.</p>\n <div style=\"margin-top:1rem\">\n <button pButton type=\"button\" label=\"Chatear en WhatsApp\" class=\"p-button-success\" (click)=\"openWhatsappChat()\"></button>\n </div>\n </div>\n </p-dialog>\n\n <lib-header-ecommerce1 [menuConfig]=\"headerMenuConfig\" [DatosNegocio]=\"DatosNegocio\"></lib-header-ecommerce1>\n <lib-carruselt-1></lib-carruselt-1>\n \n <router-outlet></router-outlet>\n\n <!-- Footer Section -->\n <lib-footer-ecommerce1 [DatosNegocio]=\"DatosNegocio\"></lib-footer-ecommerce1>\n \n ", styles: ["@charset \"UTF-8\";.whatsapp-float{position:fixed;bottom:1.5rem;right:1.5rem;z-index:999;opacity:0;visibility:hidden;transition:opacity .5s ease-in-out,visibility .5s ease-in-out}.whatsapp-float.show{opacity:1;visibility:visible}.whatsapp-float a{display:block;background-color:#25d366;color:#fff;padding:1rem;border-radius:9999px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1-px #0000000f;transition:transform .2s ease-in-out}.whatsapp-float a:hover{transform:scale(1.1)}.whatsapp-float .fa-whatsapp{font-size:2.5rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:none;justify-content:center;align-items:center;z-index:1000}.modal-overlay.show{display:flex}.modal-content{background-color:#fff;padding:2rem;border-radius:1rem;text-align:center;box-shadow:0 10px 25px #0003;max-width:90%;width:400px;animation:fadeIn .5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.modal-close-button{position:absolute;top:10px;right:10px;font-size:1.5rem;color:#aaa;cursor:pointer}.modal-close-button:hover{color:#666}.auth-page{min-height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:2rem 0}.auth-section{background-color:#fff;padding:4rem 2rem;border-radius:1rem;box-shadow:0 10px 25px #0003;max-width:90%;width:500px;margin:4rem auto;animation:fadeIn .5s ease-out}.animate-scroll{opacity:0;transform:translateY(50px);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-scroll.is-visible{opacity:1;transform:translateY(0)}.animate-title-initial{opacity:0;transform:translate(-100px)}.animate-title-final{transition:opacity 1s ease-out,transform 1s ease-out}.animate-title-initial.is-visible{opacity:1;transform:translate(0);animation:rotate360 1s ease-out forwards;animation-iteration-count:2}@keyframes rotate360{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.category-card-animation{opacity:0;transform:scale(.8);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.category-card-animation.is-visible{opacity:1;transform:scale(1)}.animate-history-section{opacity:0;transform:translateY(100px);transition:opacity 2s ease-out,transform 2s ease-out}.animate-history-section.is-visible{opacity:1;transform:translateY(0)}.animate-newsletter-section{opacity:0;transform:scale(.95);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-newsletter-section.is-visible{opacity:1;transform:scale(1)}.header-top{background-color:#fbc30d;color:#000}.header-top a{color:#000;transition:color .3s}.header-top a:hover{color:#4a4a4a}.main-nav{background-color:#0093e9;padding:1.5rem;border-radius:2rem;box-shadow:0 10px 25px #0000001a;position:relative;margin-top:2rem;margin-left:auto;margin-right:auto;max-width:90%;width:1000px}.main-nav-ul{list-style:none;display:flex;justify-content:center;align-items:center;flex-grow:1;gap:2rem}.main-nav-link{font-size:1.125rem;font-weight:600;color:#fff;transition:color .3s}.main-nav-link:hover{color:#fbc30d}.logo-center{font-size:2.5rem;font-weight:700;color:#000;text-shadow:1px 1px 2px #fbc30d}.logo-rotate{animation:rotate360 2s ease-out}.hamburger-menu{display:none;cursor:pointer;z-index:50}@media (max-width: 767px){.hamburger-menu{display:block}}.mobile-header{background-color:#0093e9;padding:1rem;border-radius:1rem;box-shadow:0 5px 15px #0000001a}.mobile-header .logo-center{font-size:2rem}.footer-top{color:#000}.whatsapp-float svg{display:block;width:2.5rem;height:2.5rem}.modal-content svg{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i8.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i1.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "component", type: FooterEcommerce1, selector: "lib-footer-ecommerce1", inputs: ["DatosNegocio"] }, { kind: "component", type: HeaderEcommerce1Component, selector: "lib-header-ecommerce1", inputs: ["DatosNegocio", "logoText", "logoUrl", "logoAlt", "menuConfig", "islogin"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: Carruselt1, selector: "lib-carruselt-1" }] });
8553
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: Ecommerce1, deps: [{ token: i1$8.Router }, { token: i1$8.ActivatedRoute }, { token: i0.Renderer2 }, { token: GoogleService }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
8554
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: Ecommerce1, isStandalone: true, selector: "lib-ecommerce1", inputs: { isLogin: "isLogin", DatosNegocio: "DatosNegocio", Categorias: "Categorias", routePaths: "routePaths" }, viewQueries: [{ propertyName: "whatsappButton", first: true, predicate: ["whatsappButton"], descendants: true }, { propertyName: "productGrid", first: true, predicate: ["productGrid"], descendants: true }, { propertyName: "mobileMenu", first: true, predicate: ["mobileMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: " <button id=\"whatsapp-button\"\n pButton\n type=\"button\"\n class=\"whatsapp-float p-button-rounded p-button-lg\"\n [ngClass]=\"{ 'p-button-success': showWhatsappButton, 'p-button-secondary': !showWhatsappButton }\"\n (click)=\"showWhatsappModalDialog()\"\n aria-label=\"Cont\u00E1ctanos por WhatsApp\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"vertical-align:middle\">\n <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488\"/>\n </svg>\n </button>\n\n <!-- WhatsApp Modal reemplazado por PrimeNG Dialog -->\n <p-dialog [(visible)]=\"showWhatsappModal\"\n modal=\"true\"\n [blockScroll]=\"true\"\n [closable]=\"true\"\n [draggable]=\"false\"\n [focusOnShow]=\"false\"\n [keepInViewport]=\"true\"\n [position]=\"'top'\"\n [style]=\"{ width: '360px', height: '400px' }\"\n [dismissableMask]=\"false\"\n [closeOnEscape]=\"false\"\n appendTo=\"body\">\n <div class=\"p-text-center\" style=\"display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.75rem;\">\n <div style=\"background:#25d366;color:white;width:72px;height:72px;border-radius:36px;display:inline-flex;align-items:center;justify-content:center;margin-bottom:1rem;\">\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488\"/>\n </svg>\n </div>\n <h3 class=\"p-text-center\">\u00A1No te vayas a\u00FAn!</h3>\n <p class=\"text-center\">Si tienes alguna pregunta, puedes chatear con nosotros directamente por WhatsApp.</p>\n <div style=\"margin-top:1rem\">\n <button pButton type=\"button\" label=\"Chatear en WhatsApp\" class=\"p-button-success\" (click)=\"openWhatsappChat()\"></button>\n </div>\n </div>\n </p-dialog>\n\n <lib-header-ecommerce1 [menuConfig]=\"headerMenuConfig\" [DatosNegocio]=\"DatosNegocio\"></lib-header-ecommerce1>\n <lib-carruselt-1></lib-carruselt-1>\n \n <router-outlet></router-outlet>\n\n <!-- Footer Section -->\n <lib-footer-ecommerce1 [DatosNegocio]=\"DatosNegocio\"></lib-footer-ecommerce1>\n \n ", styles: ["@charset \"UTF-8\";.whatsapp-float{position:fixed;bottom:1.5rem;right:1.5rem;z-index:999;opacity:0;visibility:hidden;transition:opacity .5s ease-in-out,visibility .5s ease-in-out}.whatsapp-float.show{opacity:1;visibility:visible}.whatsapp-float a{display:block;background-color:#25d366;color:#fff;padding:1rem;border-radius:9999px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1-px #0000000f;transition:transform .2s ease-in-out}.whatsapp-float a:hover{transform:scale(1.1)}.whatsapp-float .fa-whatsapp{font-size:2.5rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:none;justify-content:center;align-items:center;z-index:1000}.modal-overlay.show{display:flex}.modal-content{background-color:#fff;padding:2rem;border-radius:1rem;text-align:center;box-shadow:0 10px 25px #0003;max-width:90%;width:400px;animation:fadeIn .5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.modal-close-button{position:absolute;top:10px;right:10px;font-size:1.5rem;color:#aaa;cursor:pointer}.modal-close-button:hover{color:#666}.auth-page{min-height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:2rem 0}.auth-section{background-color:#fff;padding:4rem 2rem;border-radius:1rem;box-shadow:0 10px 25px #0003;max-width:90%;width:500px;margin:4rem auto;animation:fadeIn .5s ease-out}.animate-scroll{opacity:0;transform:translateY(50px);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-scroll.is-visible{opacity:1;transform:translateY(0)}.animate-title-initial{opacity:0;transform:translate(-100px)}.animate-title-final{transition:opacity 1s ease-out,transform 1s ease-out}.animate-title-initial.is-visible{opacity:1;transform:translate(0);animation:rotate360 1s ease-out forwards;animation-iteration-count:2}@keyframes rotate360{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.category-card-animation{opacity:0;transform:scale(.8);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.category-card-animation.is-visible{opacity:1;transform:scale(1)}.animate-history-section{opacity:0;transform:translateY(100px);transition:opacity 2s ease-out,transform 2s ease-out}.animate-history-section.is-visible{opacity:1;transform:translateY(0)}.animate-newsletter-section{opacity:0;transform:scale(.95);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-newsletter-section.is-visible{opacity:1;transform:scale(1)}.header-top{background-color:#fbc30d;color:#000}.header-top a{color:#000;transition:color .3s}.header-top a:hover{color:#4a4a4a}.main-nav{background-color:#0093e9;padding:1.5rem;border-radius:2rem;box-shadow:0 10px 25px #0000001a;position:relative;margin-top:2rem;margin-left:auto;margin-right:auto;max-width:90%;width:1000px}.main-nav-ul{list-style:none;display:flex;justify-content:center;align-items:center;flex-grow:1;gap:2rem}.main-nav-link{font-size:1.125rem;font-weight:600;color:#fff;transition:color .3s}.main-nav-link:hover{color:#fbc30d}.logo-center{font-size:2.5rem;font-weight:700;color:#000;text-shadow:1px 1px 2px #fbc30d}.logo-rotate{animation:rotate360 2s ease-out}.hamburger-menu{display:none;cursor:pointer;z-index:50}@media (max-width: 767px){.hamburger-menu{display:block}}.mobile-header{background-color:#0093e9;padding:1rem;border-radius:1rem;box-shadow:0 5px 15px #0000001a}.mobile-header .logo-center{font-size:2rem}.footer-top{color:#000}.whatsapp-float svg{display:block;width:2.5rem;height:2.5rem}.modal-content svg{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i8.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i1.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "component", type: FooterEcommerce1, selector: "lib-footer-ecommerce1", inputs: ["DatosNegocio"] }, { kind: "component", type: HeaderEcommerce1Component, selector: "lib-header-ecommerce1", inputs: ["DatosNegocio", "logoText", "logoUrl", "logoAlt", "menuConfig", "islogin"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: Carruselt1, selector: "lib-carruselt-1", inputs: ["DatosNegocio"] }] });
8448
8555
  }
8449
8556
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: Ecommerce1, decorators: [{
8450
8557
  type: Component,
8451
- args: [{ selector: 'lib-ecommerce1', imports: [CommonModule, DialogModule, ButtonModule, BarFloatEcommerce1, FooterEcommerce1, HeaderEcommerce1Component, RouterOutlet, Carruselt1], template: " <button id=\"whatsapp-button\"\n pButton\n type=\"button\"\n class=\"whatsapp-float p-button-rounded p-button-lg\"\n [ngClass]=\"{ 'p-button-success': showWhatsappButton, 'p-button-secondary': !showWhatsappButton }\"\n (click)=\"showWhatsappModalDialog()\"\n aria-label=\"Cont\u00E1ctanos por WhatsApp\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"vertical-align:middle\">\n <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488\"/>\n </svg>\n </button>\n\n <!-- WhatsApp Modal reemplazado por PrimeNG Dialog -->\n <p-dialog [(visible)]=\"showWhatsappModal\"\n modal=\"true\"\n [blockScroll]=\"true\"\n [closable]=\"true\"\n [draggable]=\"false\"\n [focusOnShow]=\"false\"\n [keepInViewport]=\"true\"\n [position]=\"'top'\"\n [style]=\"{ width: '360px', height: '400px' }\"\n [dismissableMask]=\"false\"\n [closeOnEscape]=\"false\"\n appendTo=\"body\">\n <div class=\"p-text-center\" style=\"display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.75rem;\">\n <div style=\"background:#25d366;color:white;width:72px;height:72px;border-radius:36px;display:inline-flex;align-items:center;justify-content:center;margin-bottom:1rem;\">\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488\"/>\n </svg>\n </div>\n <h3 class=\"p-text-center\">\u00A1No te vayas a\u00FAn!</h3>\n <p class=\"text-center\">Si tienes alguna pregunta, puedes chatear con nosotros directamente por WhatsApp.</p>\n <div style=\"margin-top:1rem\">\n <button pButton type=\"button\" label=\"Chatear en WhatsApp\" class=\"p-button-success\" (click)=\"openWhatsappChat()\"></button>\n </div>\n </div>\n </p-dialog>\n\n <lib-header-ecommerce1 [menuConfig]=\"headerMenuConfig\" [DatosNegocio]=\"DatosNegocio\"></lib-header-ecommerce1>\n <lib-carruselt-1></lib-carruselt-1>\n \n <router-outlet></router-outlet>\n\n <!-- Footer Section -->\n <lib-footer-ecommerce1 [DatosNegocio]=\"DatosNegocio\"></lib-footer-ecommerce1>\n \n ", styles: ["@charset \"UTF-8\";.whatsapp-float{position:fixed;bottom:1.5rem;right:1.5rem;z-index:999;opacity:0;visibility:hidden;transition:opacity .5s ease-in-out,visibility .5s ease-in-out}.whatsapp-float.show{opacity:1;visibility:visible}.whatsapp-float a{display:block;background-color:#25d366;color:#fff;padding:1rem;border-radius:9999px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1-px #0000000f;transition:transform .2s ease-in-out}.whatsapp-float a:hover{transform:scale(1.1)}.whatsapp-float .fa-whatsapp{font-size:2.5rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:none;justify-content:center;align-items:center;z-index:1000}.modal-overlay.show{display:flex}.modal-content{background-color:#fff;padding:2rem;border-radius:1rem;text-align:center;box-shadow:0 10px 25px #0003;max-width:90%;width:400px;animation:fadeIn .5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.modal-close-button{position:absolute;top:10px;right:10px;font-size:1.5rem;color:#aaa;cursor:pointer}.modal-close-button:hover{color:#666}.auth-page{min-height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:2rem 0}.auth-section{background-color:#fff;padding:4rem 2rem;border-radius:1rem;box-shadow:0 10px 25px #0003;max-width:90%;width:500px;margin:4rem auto;animation:fadeIn .5s ease-out}.animate-scroll{opacity:0;transform:translateY(50px);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-scroll.is-visible{opacity:1;transform:translateY(0)}.animate-title-initial{opacity:0;transform:translate(-100px)}.animate-title-final{transition:opacity 1s ease-out,transform 1s ease-out}.animate-title-initial.is-visible{opacity:1;transform:translate(0);animation:rotate360 1s ease-out forwards;animation-iteration-count:2}@keyframes rotate360{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.category-card-animation{opacity:0;transform:scale(.8);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.category-card-animation.is-visible{opacity:1;transform:scale(1)}.animate-history-section{opacity:0;transform:translateY(100px);transition:opacity 2s ease-out,transform 2s ease-out}.animate-history-section.is-visible{opacity:1;transform:translateY(0)}.animate-newsletter-section{opacity:0;transform:scale(.95);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-newsletter-section.is-visible{opacity:1;transform:scale(1)}.header-top{background-color:#fbc30d;color:#000}.header-top a{color:#000;transition:color .3s}.header-top a:hover{color:#4a4a4a}.main-nav{background-color:#0093e9;padding:1.5rem;border-radius:2rem;box-shadow:0 10px 25px #0000001a;position:relative;margin-top:2rem;margin-left:auto;margin-right:auto;max-width:90%;width:1000px}.main-nav-ul{list-style:none;display:flex;justify-content:center;align-items:center;flex-grow:1;gap:2rem}.main-nav-link{font-size:1.125rem;font-weight:600;color:#fff;transition:color .3s}.main-nav-link:hover{color:#fbc30d}.logo-center{font-size:2.5rem;font-weight:700;color:#000;text-shadow:1px 1px 2px #fbc30d}.logo-rotate{animation:rotate360 2s ease-out}.hamburger-menu{display:none;cursor:pointer;z-index:50}@media (max-width: 767px){.hamburger-menu{display:block}}.mobile-header{background-color:#0093e9;padding:1rem;border-radius:1rem;box-shadow:0 5px 15px #0000001a}.mobile-header .logo-center{font-size:2rem}.footer-top{color:#000}.whatsapp-float svg{display:block;width:2.5rem;height:2.5rem}.modal-content svg{display:block}\n"] }]
8452
- }], ctorParameters: () => [{ type: i1$8.Router }, { type: i1$8.ActivatedRoute }, { type: i0.Renderer2 }, { type: Object, decorators: [{
8558
+ args: [{ selector: 'lib-ecommerce1', imports: [CommonModule, DialogModule, ButtonModule, FooterEcommerce1, HeaderEcommerce1Component, RouterOutlet, Carruselt1], template: " <button id=\"whatsapp-button\"\n pButton\n type=\"button\"\n class=\"whatsapp-float p-button-rounded p-button-lg\"\n [ngClass]=\"{ 'p-button-success': showWhatsappButton, 'p-button-secondary': !showWhatsappButton }\"\n (click)=\"showWhatsappModalDialog()\"\n aria-label=\"Cont\u00E1ctanos por WhatsApp\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"vertical-align:middle\">\n <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488\"/>\n </svg>\n </button>\n\n <!-- WhatsApp Modal reemplazado por PrimeNG Dialog -->\n <p-dialog [(visible)]=\"showWhatsappModal\"\n modal=\"true\"\n [blockScroll]=\"true\"\n [closable]=\"true\"\n [draggable]=\"false\"\n [focusOnShow]=\"false\"\n [keepInViewport]=\"true\"\n [position]=\"'top'\"\n [style]=\"{ width: '360px', height: '400px' }\"\n [dismissableMask]=\"false\"\n [closeOnEscape]=\"false\"\n appendTo=\"body\">\n <div class=\"p-text-center\" style=\"display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.75rem;\">\n <div style=\"background:#25d366;color:white;width:72px;height:72px;border-radius:36px;display:inline-flex;align-items:center;justify-content:center;margin-bottom:1rem;\">\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0020.885 3.488\"/>\n </svg>\n </div>\n <h3 class=\"p-text-center\">\u00A1No te vayas a\u00FAn!</h3>\n <p class=\"text-center\">Si tienes alguna pregunta, puedes chatear con nosotros directamente por WhatsApp.</p>\n <div style=\"margin-top:1rem\">\n <button pButton type=\"button\" label=\"Chatear en WhatsApp\" class=\"p-button-success\" (click)=\"openWhatsappChat()\"></button>\n </div>\n </div>\n </p-dialog>\n\n <lib-header-ecommerce1 [menuConfig]=\"headerMenuConfig\" [DatosNegocio]=\"DatosNegocio\"></lib-header-ecommerce1>\n <lib-carruselt-1></lib-carruselt-1>\n \n <router-outlet></router-outlet>\n\n <!-- Footer Section -->\n <lib-footer-ecommerce1 [DatosNegocio]=\"DatosNegocio\"></lib-footer-ecommerce1>\n \n ", styles: ["@charset \"UTF-8\";.whatsapp-float{position:fixed;bottom:1.5rem;right:1.5rem;z-index:999;opacity:0;visibility:hidden;transition:opacity .5s ease-in-out,visibility .5s ease-in-out}.whatsapp-float.show{opacity:1;visibility:visible}.whatsapp-float a{display:block;background-color:#25d366;color:#fff;padding:1rem;border-radius:9999px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1-px #0000000f;transition:transform .2s ease-in-out}.whatsapp-float a:hover{transform:scale(1.1)}.whatsapp-float .fa-whatsapp{font-size:2.5rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:none;justify-content:center;align-items:center;z-index:1000}.modal-overlay.show{display:flex}.modal-content{background-color:#fff;padding:2rem;border-radius:1rem;text-align:center;box-shadow:0 10px 25px #0003;max-width:90%;width:400px;animation:fadeIn .5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.modal-close-button{position:absolute;top:10px;right:10px;font-size:1.5rem;color:#aaa;cursor:pointer}.modal-close-button:hover{color:#666}.auth-page{min-height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:2rem 0}.auth-section{background-color:#fff;padding:4rem 2rem;border-radius:1rem;box-shadow:0 10px 25px #0003;max-width:90%;width:500px;margin:4rem auto;animation:fadeIn .5s ease-out}.animate-scroll{opacity:0;transform:translateY(50px);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-scroll.is-visible{opacity:1;transform:translateY(0)}.animate-title-initial{opacity:0;transform:translate(-100px)}.animate-title-final{transition:opacity 1s ease-out,transform 1s ease-out}.animate-title-initial.is-visible{opacity:1;transform:translate(0);animation:rotate360 1s ease-out forwards;animation-iteration-count:2}@keyframes rotate360{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.category-card-animation{opacity:0;transform:scale(.8);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.category-card-animation.is-visible{opacity:1;transform:scale(1)}.animate-history-section{opacity:0;transform:translateY(100px);transition:opacity 2s ease-out,transform 2s ease-out}.animate-history-section.is-visible{opacity:1;transform:translateY(0)}.animate-newsletter-section{opacity:0;transform:scale(.95);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-newsletter-section.is-visible{opacity:1;transform:scale(1)}.header-top{background-color:#fbc30d;color:#000}.header-top a{color:#000;transition:color .3s}.header-top a:hover{color:#4a4a4a}.main-nav{background-color:#0093e9;padding:1.5rem;border-radius:2rem;box-shadow:0 10px 25px #0000001a;position:relative;margin-top:2rem;margin-left:auto;margin-right:auto;max-width:90%;width:1000px}.main-nav-ul{list-style:none;display:flex;justify-content:center;align-items:center;flex-grow:1;gap:2rem}.main-nav-link{font-size:1.125rem;font-weight:600;color:#fff;transition:color .3s}.main-nav-link:hover{color:#fbc30d}.logo-center{font-size:2.5rem;font-weight:700;color:#000;text-shadow:1px 1px 2px #fbc30d}.logo-rotate{animation:rotate360 2s ease-out}.hamburger-menu{display:none;cursor:pointer;z-index:50}@media (max-width: 767px){.hamburger-menu{display:block}}.mobile-header{background-color:#0093e9;padding:1rem;border-radius:1rem;box-shadow:0 5px 15px #0000001a}.mobile-header .logo-center{font-size:2rem}.footer-top{color:#000}.whatsapp-float svg{display:block;width:2.5rem;height:2.5rem}.modal-content svg{display:block}\n"] }]
8559
+ }], ctorParameters: () => [{ type: i1$8.Router }, { type: i1$8.ActivatedRoute }, { type: i0.Renderer2 }, { type: GoogleService }, { type: Object, decorators: [{
8453
8560
  type: Inject,
8454
8561
  args: [PLATFORM_ID]
8455
8562
  }] }], propDecorators: { isLogin: [{
@@ -8604,7 +8711,7 @@ class AppMenuitem {
8604
8711
  </ng-template>
8605
8712
  </ul>
8606
8713
  </ng-container>
8607
- `, isInline: true, dependencies: [{ kind: "component", type: AppMenuitem, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$8.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }], animations: [
8714
+ `, isInline: true, dependencies: [{ kind: "component", type: AppMenuitem, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$8.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i4$1.Ripple, selector: "[pRipple]" }], animations: [
8608
8715
  trigger('children', [
8609
8716
  state('collapsed', style({
8610
8717
  height: '0'
@@ -8893,7 +9000,7 @@ class HomeEcommerce1 {
8893
9000
  : [];
8894
9001
  }
8895
9002
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: HomeEcommerce1, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
8896
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: HomeEcommerce1, isStandalone: true, selector: "lib-home-ecommerce1", inputs: { isLogin: "isLogin", bussinesDTO: "bussinesDTO", categorias: "categorias", detailRouteBase: "detailRouteBase" }, outputs: { productClicked: "productClicked", categorySelected: "categorySelected" }, usesOnChanges: true, ngImport: i0, template: "\n<!-- Hero principal -->\n<section role=\"region\" aria-label=\"Banner principal Zigma Inflables\">\n <lib-hero-section-ecommerce1></lib-hero-section-ecommerce1>\n</section>\n\n<!-- Encabezado SEO principal -->\n<h1 class=\"text-center text-3xl md:text-4xl font-bold my-6\" style=\"color:#222\">Cat\u00E1logo de Inflables y Productos inflables</h1>\n\n<!-- Filtros de categor\u00EDas -->\n <section aria-label=\"Secci\u00F3n de filtros de categor\u00EDas inflables\">\n <lib-section-filters-categories-productos id=\"categorias\"\n [categorias]=\"categorias\"\n (categorySelected)=\"onCategoryFilter($event)\">\n </lib-section-filters-categories-productos>\n</section>\n\n<!-- Listado de productos -->\n<section aria-label=\"Listado de productos inflables\" role=\"main\">\n <ng-template #cards let-items>\n <div class=\"grid align-items-center justify-content-center\">\n @for (product of items; track $index) {\n <div class=\"col-12 md:col-6 p-5 lg:p-3 lg:col-4 product-card-animation\"\n [style.transition-delay]=\"($index * 30) + 'ms'\">\n <lib-card-productos1 [product]=\"product\" [detailRouteBase]=\"detailRouteBase\" (addToCart)=\"onAddToCart($event)\">\n </lib-card-productos1>\n </div>\n }\n </div>\n </ng-template>\n\n <lib-paginator-pg\n [data]=\"filteredProducts\"\n [rows]=\"9\"\n [rowsPerPageOptions]=\"[9,18,27,54,81]\"\n [showCurrentPageReport]=\"true\"\n [currentPageReportTemplate]=\"'Mostrando {first} a {last} de {totalRecords} \u00EDtems'\"\n [itemTemplate]=\"cards\">\n </lib-paginator-pg>\n</section>\n\n\n<section aria-label=\"Informacion Sobre la historia Zigma Inflables\" id=\"nosotros\" class=\"history-section\" style=\"background-image: url('https://placehold.co/1400x600/b0b0b0/ffffff?text=Our+Story+Background+Image');\">\n <div class=\"history-overlay\"></div>\n <div class=\"history-content\">\n <h2 class=\"history-title\">Conoce Nuestra Historia</h2>\n <p class=\"history-text\">\n No hay una f\u00F3rmula m\u00E1gica para escribir un texto publicitario perfecto; se basa en varios factores, incluyendo la ubicaci\u00F3n del anuncio, la demograf\u00EDa e incluso el estado de \u00E1nimo del consumidor.\n </p>\n <button pButton type=\"button\" class=\"p-button-rounded p-button-lg p-button-warning\" icon=\"pi pi-play\"\n aria-label=\"Ver video de la historia de Zigma Inflables\"></button>\n </div>\n</section>\n\n<!-- Nueva seccion de Instagram -->\n <section aria-label=\"Secci\u00F3n de redes sociales\">\n\n <lib-section-images-instagram-ecommerce1></lib-section-images-instagram-ecommerce1>\n </section>\n\n<!-- Newsletter (PrimeFlex + animaci\u00F3n on scroll) -->\n<section class=\"surface-section py-5 animate-newsletter-section\">\n <div class=\"mx-auto px-3 md:px-4\" style=\"max-width: 1100px;\">\n <div class=\"newsletter-card surface-card border-round-2xl shadow-2 p-4 md:p-5 flex flex-column md:flex-row align-items-center gap-3 md:gap-4\">\n <div class=\"newsletter-left flex align-items-center gap-3 md:gap-4\">\n <div class=\"newsletter-icon flex align-items-center justify-content-center border-round-3xl\" style=\"background:#fbc30d; width: 52px; height:52px;\">\n <svg class=\"newsletter-svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width:28px;height:28px;color:#fff;\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 19l9 2-9-18-9 18 9-2zm0 0v-8\"></path>\n </svg>\n </div>\n <div class=\"newsletter-text\">\n <h3 class=\"newsletter-title m-0 text-900 text-xl md:text-2xl\">Suscr\u00EDbete a nuestro bolet\u00EDn</h3>\n <p class=\"newsletter-subtitle m-0 text-600\">\u00A1y obt\u00E9n un 10% de descuento!</p>\n </div>\n </div>\n <div class=\"newsletter-right flex justify-content-center md:justify-content-end w-full md:w-auto\">\n <form id=\"newsletter-form\" class=\"newsletter-form flex gap-2 w-full md:w-auto\" style=\"max-width:520px;\">\n <input pInputText type=\"email\" id=\"email-input\" name=\"email\" class=\"flex-1 p-inputtext-sm md:p-inputtext\" placeholder=\"Ingresa tu correo electr\u00F3nico\" required />\n <button pButton type=\"submit\" label=\"Suscribirme\" class=\"p-button-warning\"></button>\n </form>\n </div>\n </div>\n </div>\n</section>\n\n", styles: ["@charset \"UTF-8\";.history-section{position:relative;background-size:cover;background-position:center;min-height:500px;display:flex;align-items:center;justify-content:center;margin:1.5rem 0}.history-overlay{position:absolute;inset:0;background:#00000080}.history-content{position:relative;z-index:2;max-width:800px;text-align:center;color:#fff;padding:2rem}.history-pretitle{font-size:1rem;font-weight:300;margin-bottom:.5rem}.history-title{font-size:2.25rem;margin:0 0 1rem;font-weight:700}.history-text{font-size:1rem;margin-bottom:1rem;font-weight:300}.animate-newsletter-section{opacity:0;background-color:var(--ion-background-color)!important}.animate-newsletter-section .newsletter-card{opacity:0;transform:translateY(24px);transition:opacity .6s ease-out,transform .6s ease-out}.animate-newsletter-section.is-visible{opacity:1}.animate-newsletter-section.is-visible .newsletter-card{opacity:1;transform:translateY(0)}@media screen and (min-width: 768px){.newsletter-card{flex-direction:row;justify-content:space-between;align-items:center}.newsletter-text{text-align:left}.newsletter-right{width:auto}}.product-card-animation{opacity:0;transform:translateY(50px);transition:opacity 1s ease-out,transform 1s ease-out;will-change:opacity,transform}.product-card-animation.is-visible{opacity:1;transform:translate(0)}@media screen and (min-width: 768px){.product-card-animation{transform:translate(-50px)}}@media screen and (min-width: 992px){.product-card-animation{transform:translate(-400px);transition:opacity 1s ease-out,transform 1s ease-out}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i1.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: HeroSectionEcommerce1, selector: "lib-hero-section-ecommerce1" }, { kind: "component", type: SectionFiltersCategoriesProductos, selector: "lib-section-filters-categories-productos", inputs: ["categorias", "titleComponent"], outputs: ["categorySelected"] }, { kind: "component", type: CardProductos1Component, selector: "lib-card-productos1", inputs: ["product", "isLogin", "detailRouteBase"], outputs: ["addToCart"] }, { kind: "component", type: SectionImagesInstagramEcommerce1, selector: "lib-section-images-instagram-ecommerce1" }, { kind: "component", type: PaginatorPgComponent, selector: "lib-paginator-pg", inputs: ["data", "rows", "rowsPerPageOptions", "showCurrentPageReport", "currentPageReportTemplate", "itemTemplate"] }] });
9003
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: HomeEcommerce1, isStandalone: true, selector: "lib-home-ecommerce1", inputs: { isLogin: "isLogin", bussinesDTO: "bussinesDTO", categorias: "categorias", detailRouteBase: "detailRouteBase" }, outputs: { productClicked: "productClicked", categorySelected: "categorySelected" }, usesOnChanges: true, ngImport: i0, template: "\n<!-- Hero principal -->\n<section role=\"region\" aria-label=\"Banner principal Zigma Inflables\">\n <lib-hero-section-ecommerce1></lib-hero-section-ecommerce1>\n</section>\n\n<!-- Encabezado SEO principal -->\n<h1 class=\"text-center text-3xl md:text-4xl font-bold my-6\" style=\"color:#222\">Cat\u00E1logo de Inflables y Productos inflables</h1>\n\n<!-- Filtros de categor\u00EDas -->\n <section aria-label=\"Secci\u00F3n de filtros de categor\u00EDas inflables\">\n <lib-section-filters-categories-productos id=\"categorias\"\n [categorias]=\"categorias\"\n (categorySelected)=\"onCategoryFilter($event)\">\n </lib-section-filters-categories-productos>\n</section>\n\n<!-- Listado de productos -->\n<section aria-label=\"Listado de productos inflables\" role=\"main\">\n <ng-template #cards let-items>\n <div class=\"grid align-items-center justify-content-center\">\n @for (product of items; track $index) {\n <div class=\"col-12 md:col-6 p-5 lg:p-3 lg:col-4 product-card-animation\"\n [style.transition-delay]=\"($index * 30) + 'ms'\">\n <lib-card-productos1 [DatosNegocio]=\"bussinesDTO\" [product]=\"product\" [detailRouteBase]=\"detailRouteBase\" (addToCart)=\"onAddToCart($event)\">\n </lib-card-productos1>\n </div>\n }\n </div>\n </ng-template>\n\n <lib-paginator-pg\n [data]=\"filteredProducts\"\n [rows]=\"9\"\n [rowsPerPageOptions]=\"[9,18,27,54,81]\"\n [showCurrentPageReport]=\"true\"\n [currentPageReportTemplate]=\"'Mostrando {first} a {last} de {totalRecords} \u00EDtems'\"\n [itemTemplate]=\"cards\">\n </lib-paginator-pg>\n</section>\n\n\n<section aria-label=\"Informacion Sobre la historia Zigma Inflables\" id=\"nosotros\" class=\"history-section\" style=\"background-image: url('https://placehold.co/1400x600/b0b0b0/ffffff?text=Our+Story+Background+Image');\">\n <div class=\"history-overlay\"></div>\n <div class=\"history-content\">\n <h2 class=\"history-title\">Conoce Nuestra Historia</h2>\n <p class=\"history-text\">\n No hay una f\u00F3rmula m\u00E1gica para escribir un texto publicitario perfecto; se basa en varios factores, incluyendo la ubicaci\u00F3n del anuncio, la demograf\u00EDa e incluso el estado de \u00E1nimo del consumidor.\n </p>\n <button pButton type=\"button\" class=\"p-button-rounded p-button-lg p-button-warning\" icon=\"pi pi-play\"\n aria-label=\"Ver video de la historia de Zigma Inflables\"></button>\n </div>\n</section>\n\n<!-- Nueva seccion de Instagram -->\n <section aria-label=\"Secci\u00F3n de redes sociales\">\n\n <lib-section-images-instagram-ecommerce1></lib-section-images-instagram-ecommerce1>\n </section>\n\n<!-- Newsletter (PrimeFlex + animaci\u00F3n on scroll) -->\n<section class=\"surface-section py-5 animate-newsletter-section\">\n <div class=\"mx-auto px-3 md:px-4\" style=\"max-width: 1100px;\">\n <div class=\"newsletter-card surface-card border-round-2xl shadow-2 p-4 md:p-5 flex flex-column md:flex-row align-items-center gap-3 md:gap-4\">\n <div class=\"newsletter-left flex align-items-center gap-3 md:gap-4\">\n <div class=\"newsletter-icon flex align-items-center justify-content-center border-round-3xl\" style=\"background:#fbc30d; width: 52px; height:52px;\">\n <svg class=\"newsletter-svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width:28px;height:28px;color:#fff;\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 19l9 2-9-18-9 18 9-2zm0 0v-8\"></path>\n </svg>\n </div>\n <div class=\"newsletter-text\">\n <h3 class=\"newsletter-title m-0 text-900 text-xl md:text-2xl\">Suscr\u00EDbete a nuestro bolet\u00EDn</h3>\n <p class=\"newsletter-subtitle m-0 text-600\">\u00A1y obt\u00E9n un 10% de descuento!</p>\n </div>\n </div>\n <div class=\"newsletter-right flex justify-content-center md:justify-content-end w-full md:w-auto\">\n <form id=\"newsletter-form\" class=\"newsletter-form flex gap-2 w-full md:w-auto\" style=\"max-width:520px;\">\n <input pInputText type=\"email\" id=\"email-input\" name=\"email\" class=\"flex-1 p-inputtext-sm md:p-inputtext\" placeholder=\"Ingresa tu correo electr\u00F3nico\" required />\n <button pButton type=\"submit\" label=\"Suscribirme\" class=\"p-button-warning\"></button>\n </form>\n </div>\n </div>\n </div>\n</section>\n\n", styles: ["@charset \"UTF-8\";.history-section{position:relative;background-size:cover;background-position:center;min-height:500px;display:flex;align-items:center;justify-content:center;margin:1.5rem 0}.history-overlay{position:absolute;inset:0;background:#00000080}.history-content{position:relative;z-index:2;max-width:800px;text-align:center;color:#fff;padding:2rem}.history-pretitle{font-size:1rem;font-weight:300;margin-bottom:.5rem}.history-title{font-size:2.25rem;margin:0 0 1rem;font-weight:700}.history-text{font-size:1rem;margin-bottom:1rem;font-weight:300}.animate-newsletter-section{opacity:0;background-color:var(--ion-background-color)!important}.animate-newsletter-section .newsletter-card{opacity:0;transform:translateY(24px);transition:opacity .6s ease-out,transform .6s ease-out}.animate-newsletter-section.is-visible{opacity:1}.animate-newsletter-section.is-visible .newsletter-card{opacity:1;transform:translateY(0)}@media screen and (min-width: 768px){.newsletter-card{flex-direction:row;justify-content:space-between;align-items:center}.newsletter-text{text-align:left}.newsletter-right{width:auto}}.product-card-animation{opacity:0;transform:translateY(50px);transition:opacity 1s ease-out,transform 1s ease-out;will-change:opacity,transform}.product-card-animation.is-visible{opacity:1;transform:translate(0)}@media screen and (min-width: 768px){.product-card-animation{transform:translate(-50px)}}@media screen and (min-width: 992px){.product-card-animation{transform:translate(-400px);transition:opacity 1s ease-out,transform 1s ease-out}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i1.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: HeroSectionEcommerce1, selector: "lib-hero-section-ecommerce1" }, { kind: "component", type: SectionFiltersCategoriesProductos, selector: "lib-section-filters-categories-productos", inputs: ["categorias", "titleComponent"], outputs: ["categorySelected"] }, { kind: "component", type: CardProductos1Component, selector: "lib-card-productos1", inputs: ["product", "isLogin", "DatosNegocio", "detailRouteBase"], outputs: ["addToCart"] }, { kind: "component", type: SectionImagesInstagramEcommerce1, selector: "lib-section-images-instagram-ecommerce1" }, { kind: "component", type: PaginatorPgComponent, selector: "lib-paginator-pg", inputs: ["data", "rows", "rowsPerPageOptions", "showCurrentPageReport", "currentPageReportTemplate", "itemTemplate"] }] });
8897
9004
  }
8898
9005
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: HomeEcommerce1, decorators: [{
8899
9006
  type: Component,
@@ -8906,8 +9013,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
8906
9013
  CardProductos1Component,
8907
9014
  SectionImagesInstagramEcommerce1,
8908
9015
  PaginatorPgComponent,
8909
- Carruselt1
8910
- ], template: "\n<!-- Hero principal -->\n<section role=\"region\" aria-label=\"Banner principal Zigma Inflables\">\n <lib-hero-section-ecommerce1></lib-hero-section-ecommerce1>\n</section>\n\n<!-- Encabezado SEO principal -->\n<h1 class=\"text-center text-3xl md:text-4xl font-bold my-6\" style=\"color:#222\">Cat\u00E1logo de Inflables y Productos inflables</h1>\n\n<!-- Filtros de categor\u00EDas -->\n <section aria-label=\"Secci\u00F3n de filtros de categor\u00EDas inflables\">\n <lib-section-filters-categories-productos id=\"categorias\"\n [categorias]=\"categorias\"\n (categorySelected)=\"onCategoryFilter($event)\">\n </lib-section-filters-categories-productos>\n</section>\n\n<!-- Listado de productos -->\n<section aria-label=\"Listado de productos inflables\" role=\"main\">\n <ng-template #cards let-items>\n <div class=\"grid align-items-center justify-content-center\">\n @for (product of items; track $index) {\n <div class=\"col-12 md:col-6 p-5 lg:p-3 lg:col-4 product-card-animation\"\n [style.transition-delay]=\"($index * 30) + 'ms'\">\n <lib-card-productos1 [product]=\"product\" [detailRouteBase]=\"detailRouteBase\" (addToCart)=\"onAddToCart($event)\">\n </lib-card-productos1>\n </div>\n }\n </div>\n </ng-template>\n\n <lib-paginator-pg\n [data]=\"filteredProducts\"\n [rows]=\"9\"\n [rowsPerPageOptions]=\"[9,18,27,54,81]\"\n [showCurrentPageReport]=\"true\"\n [currentPageReportTemplate]=\"'Mostrando {first} a {last} de {totalRecords} \u00EDtems'\"\n [itemTemplate]=\"cards\">\n </lib-paginator-pg>\n</section>\n\n\n<section aria-label=\"Informacion Sobre la historia Zigma Inflables\" id=\"nosotros\" class=\"history-section\" style=\"background-image: url('https://placehold.co/1400x600/b0b0b0/ffffff?text=Our+Story+Background+Image');\">\n <div class=\"history-overlay\"></div>\n <div class=\"history-content\">\n <h2 class=\"history-title\">Conoce Nuestra Historia</h2>\n <p class=\"history-text\">\n No hay una f\u00F3rmula m\u00E1gica para escribir un texto publicitario perfecto; se basa en varios factores, incluyendo la ubicaci\u00F3n del anuncio, la demograf\u00EDa e incluso el estado de \u00E1nimo del consumidor.\n </p>\n <button pButton type=\"button\" class=\"p-button-rounded p-button-lg p-button-warning\" icon=\"pi pi-play\"\n aria-label=\"Ver video de la historia de Zigma Inflables\"></button>\n </div>\n</section>\n\n<!-- Nueva seccion de Instagram -->\n <section aria-label=\"Secci\u00F3n de redes sociales\">\n\n <lib-section-images-instagram-ecommerce1></lib-section-images-instagram-ecommerce1>\n </section>\n\n<!-- Newsletter (PrimeFlex + animaci\u00F3n on scroll) -->\n<section class=\"surface-section py-5 animate-newsletter-section\">\n <div class=\"mx-auto px-3 md:px-4\" style=\"max-width: 1100px;\">\n <div class=\"newsletter-card surface-card border-round-2xl shadow-2 p-4 md:p-5 flex flex-column md:flex-row align-items-center gap-3 md:gap-4\">\n <div class=\"newsletter-left flex align-items-center gap-3 md:gap-4\">\n <div class=\"newsletter-icon flex align-items-center justify-content-center border-round-3xl\" style=\"background:#fbc30d; width: 52px; height:52px;\">\n <svg class=\"newsletter-svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width:28px;height:28px;color:#fff;\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 19l9 2-9-18-9 18 9-2zm0 0v-8\"></path>\n </svg>\n </div>\n <div class=\"newsletter-text\">\n <h3 class=\"newsletter-title m-0 text-900 text-xl md:text-2xl\">Suscr\u00EDbete a nuestro bolet\u00EDn</h3>\n <p class=\"newsletter-subtitle m-0 text-600\">\u00A1y obt\u00E9n un 10% de descuento!</p>\n </div>\n </div>\n <div class=\"newsletter-right flex justify-content-center md:justify-content-end w-full md:w-auto\">\n <form id=\"newsletter-form\" class=\"newsletter-form flex gap-2 w-full md:w-auto\" style=\"max-width:520px;\">\n <input pInputText type=\"email\" id=\"email-input\" name=\"email\" class=\"flex-1 p-inputtext-sm md:p-inputtext\" placeholder=\"Ingresa tu correo electr\u00F3nico\" required />\n <button pButton type=\"submit\" label=\"Suscribirme\" class=\"p-button-warning\"></button>\n </form>\n </div>\n </div>\n </div>\n</section>\n\n", styles: ["@charset \"UTF-8\";.history-section{position:relative;background-size:cover;background-position:center;min-height:500px;display:flex;align-items:center;justify-content:center;margin:1.5rem 0}.history-overlay{position:absolute;inset:0;background:#00000080}.history-content{position:relative;z-index:2;max-width:800px;text-align:center;color:#fff;padding:2rem}.history-pretitle{font-size:1rem;font-weight:300;margin-bottom:.5rem}.history-title{font-size:2.25rem;margin:0 0 1rem;font-weight:700}.history-text{font-size:1rem;margin-bottom:1rem;font-weight:300}.animate-newsletter-section{opacity:0;background-color:var(--ion-background-color)!important}.animate-newsletter-section .newsletter-card{opacity:0;transform:translateY(24px);transition:opacity .6s ease-out,transform .6s ease-out}.animate-newsletter-section.is-visible{opacity:1}.animate-newsletter-section.is-visible .newsletter-card{opacity:1;transform:translateY(0)}@media screen and (min-width: 768px){.newsletter-card{flex-direction:row;justify-content:space-between;align-items:center}.newsletter-text{text-align:left}.newsletter-right{width:auto}}.product-card-animation{opacity:0;transform:translateY(50px);transition:opacity 1s ease-out,transform 1s ease-out;will-change:opacity,transform}.product-card-animation.is-visible{opacity:1;transform:translate(0)}@media screen and (min-width: 768px){.product-card-animation{transform:translate(-50px)}}@media screen and (min-width: 992px){.product-card-animation{transform:translate(-400px);transition:opacity 1s ease-out,transform 1s ease-out}}\n"] }]
9016
+ ], template: "\n<!-- Hero principal -->\n<section role=\"region\" aria-label=\"Banner principal Zigma Inflables\">\n <lib-hero-section-ecommerce1></lib-hero-section-ecommerce1>\n</section>\n\n<!-- Encabezado SEO principal -->\n<h1 class=\"text-center text-3xl md:text-4xl font-bold my-6\" style=\"color:#222\">Cat\u00E1logo de Inflables y Productos inflables</h1>\n\n<!-- Filtros de categor\u00EDas -->\n <section aria-label=\"Secci\u00F3n de filtros de categor\u00EDas inflables\">\n <lib-section-filters-categories-productos id=\"categorias\"\n [categorias]=\"categorias\"\n (categorySelected)=\"onCategoryFilter($event)\">\n </lib-section-filters-categories-productos>\n</section>\n\n<!-- Listado de productos -->\n<section aria-label=\"Listado de productos inflables\" role=\"main\">\n <ng-template #cards let-items>\n <div class=\"grid align-items-center justify-content-center\">\n @for (product of items; track $index) {\n <div class=\"col-12 md:col-6 p-5 lg:p-3 lg:col-4 product-card-animation\"\n [style.transition-delay]=\"($index * 30) + 'ms'\">\n <lib-card-productos1 [DatosNegocio]=\"bussinesDTO\" [product]=\"product\" [detailRouteBase]=\"detailRouteBase\" (addToCart)=\"onAddToCart($event)\">\n </lib-card-productos1>\n </div>\n }\n </div>\n </ng-template>\n\n <lib-paginator-pg\n [data]=\"filteredProducts\"\n [rows]=\"9\"\n [rowsPerPageOptions]=\"[9,18,27,54,81]\"\n [showCurrentPageReport]=\"true\"\n [currentPageReportTemplate]=\"'Mostrando {first} a {last} de {totalRecords} \u00EDtems'\"\n [itemTemplate]=\"cards\">\n </lib-paginator-pg>\n</section>\n\n\n<section aria-label=\"Informacion Sobre la historia Zigma Inflables\" id=\"nosotros\" class=\"history-section\" style=\"background-image: url('https://placehold.co/1400x600/b0b0b0/ffffff?text=Our+Story+Background+Image');\">\n <div class=\"history-overlay\"></div>\n <div class=\"history-content\">\n <h2 class=\"history-title\">Conoce Nuestra Historia</h2>\n <p class=\"history-text\">\n No hay una f\u00F3rmula m\u00E1gica para escribir un texto publicitario perfecto; se basa en varios factores, incluyendo la ubicaci\u00F3n del anuncio, la demograf\u00EDa e incluso el estado de \u00E1nimo del consumidor.\n </p>\n <button pButton type=\"button\" class=\"p-button-rounded p-button-lg p-button-warning\" icon=\"pi pi-play\"\n aria-label=\"Ver video de la historia de Zigma Inflables\"></button>\n </div>\n</section>\n\n<!-- Nueva seccion de Instagram -->\n <section aria-label=\"Secci\u00F3n de redes sociales\">\n\n <lib-section-images-instagram-ecommerce1></lib-section-images-instagram-ecommerce1>\n </section>\n\n<!-- Newsletter (PrimeFlex + animaci\u00F3n on scroll) -->\n<section class=\"surface-section py-5 animate-newsletter-section\">\n <div class=\"mx-auto px-3 md:px-4\" style=\"max-width: 1100px;\">\n <div class=\"newsletter-card surface-card border-round-2xl shadow-2 p-4 md:p-5 flex flex-column md:flex-row align-items-center gap-3 md:gap-4\">\n <div class=\"newsletter-left flex align-items-center gap-3 md:gap-4\">\n <div class=\"newsletter-icon flex align-items-center justify-content-center border-round-3xl\" style=\"background:#fbc30d; width: 52px; height:52px;\">\n <svg class=\"newsletter-svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width:28px;height:28px;color:#fff;\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 19l9 2-9-18-9 18 9-2zm0 0v-8\"></path>\n </svg>\n </div>\n <div class=\"newsletter-text\">\n <h3 class=\"newsletter-title m-0 text-900 text-xl md:text-2xl\">Suscr\u00EDbete a nuestro bolet\u00EDn</h3>\n <p class=\"newsletter-subtitle m-0 text-600\">\u00A1y obt\u00E9n un 10% de descuento!</p>\n </div>\n </div>\n <div class=\"newsletter-right flex justify-content-center md:justify-content-end w-full md:w-auto\">\n <form id=\"newsletter-form\" class=\"newsletter-form flex gap-2 w-full md:w-auto\" style=\"max-width:520px;\">\n <input pInputText type=\"email\" id=\"email-input\" name=\"email\" class=\"flex-1 p-inputtext-sm md:p-inputtext\" placeholder=\"Ingresa tu correo electr\u00F3nico\" required />\n <button pButton type=\"submit\" label=\"Suscribirme\" class=\"p-button-warning\"></button>\n </form>\n </div>\n </div>\n </div>\n</section>\n\n", styles: ["@charset \"UTF-8\";.history-section{position:relative;background-size:cover;background-position:center;min-height:500px;display:flex;align-items:center;justify-content:center;margin:1.5rem 0}.history-overlay{position:absolute;inset:0;background:#00000080}.history-content{position:relative;z-index:2;max-width:800px;text-align:center;color:#fff;padding:2rem}.history-pretitle{font-size:1rem;font-weight:300;margin-bottom:.5rem}.history-title{font-size:2.25rem;margin:0 0 1rem;font-weight:700}.history-text{font-size:1rem;margin-bottom:1rem;font-weight:300}.animate-newsletter-section{opacity:0;background-color:var(--ion-background-color)!important}.animate-newsletter-section .newsletter-card{opacity:0;transform:translateY(24px);transition:opacity .6s ease-out,transform .6s ease-out}.animate-newsletter-section.is-visible{opacity:1}.animate-newsletter-section.is-visible .newsletter-card{opacity:1;transform:translateY(0)}@media screen and (min-width: 768px){.newsletter-card{flex-direction:row;justify-content:space-between;align-items:center}.newsletter-text{text-align:left}.newsletter-right{width:auto}}.product-card-animation{opacity:0;transform:translateY(50px);transition:opacity 1s ease-out,transform 1s ease-out;will-change:opacity,transform}.product-card-animation.is-visible{opacity:1;transform:translate(0)}@media screen and (min-width: 768px){.product-card-animation{transform:translate(-50px)}}@media screen and (min-width: 992px){.product-card-animation{transform:translate(-400px);transition:opacity 1s ease-out,transform 1s ease-out}}\n"] }]
8911
9017
  }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { isLogin: [{
8912
9018
  type: Input
8913
9019
  }], bussinesDTO: [{
@@ -8953,7 +9059,7 @@ class InputsLoginEcommerce1 {
8953
9059
  this.remember = !!event?.checked;
8954
9060
  }
8955
9061
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: InputsLoginEcommerce1, deps: [], target: i0.ɵɵFactoryTarget.Component });
8956
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: InputsLoginEcommerce1, isStandalone: true, selector: "lib-inputs-login-ecommerce1", ngImport: i0, template: "<div class=\"input-group\">\n <label for=\"login-email\" class=\"input-label\">Email</label>\n <input pInputText id=\"login-email\" type=\"email\" class=\"input-field\" placeholder=\"ejemplo@correo.com\" required />\n</div>\n\n<div class=\"input-group\">\n <label for=\"login-password\" class=\"input-label\">Contrase\u00F1a</label>\n <p-password inputId=\"login-password\" placeholder=\"********\" [toggleMask]=\"true\" appendTo=\"body\" class=\"input-field\"></p-password>\n</div>\n\n<div class=\"form-row\">\n <div class=\"remember\">\n <p-checkbox inputId=\"remember-me\" binary=\"true\" (onChange)=\"onRememberChange($event)\"></p-checkbox>\n <label for=\"remember-me\" class=\"remember-label\">Recordarme</label>\n </div>\n <a href=\"#\" class=\"forgot-link\">\u00BFOlvidaste tu contrase\u00F1a?</a>\n</div>", styles: [".input-group{margin-bottom:1.5rem}.input-label{display:block;font-weight:700;margin-bottom:.5rem;color:#374151}.input-field{width:100%;padding:.75rem 1rem;border-radius:12px;border:1px solid #d1d5db}.form-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.remember{display:flex;align-items:center;gap:.5rem}.remember-label{margin:0;font-size:.9rem;color:#111827}.forgot-link{color:#111827;font-weight:600;text-decoration:none}.forgot-link:hover{opacity:.85}:host ::ng-deep .p-password{width:100%}:host ::ng-deep .p-inputtext{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: PrimegModule }, { kind: "component", type: i3$1.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "directive", type: i2$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i3$5.Password, selector: "p-password", inputs: ["ariaLabel", "ariaLabelledBy", "label", "promptLabel", "mediumRegex", "strongRegex", "weakLabel", "mediumLabel", "maxLength", "strongLabel", "inputId", "feedback", "toggleMask", "inputStyleClass", "styleClass", "inputStyle", "showTransitionOptions", "hideTransitionOptions", "autocomplete", "placeholder", "showClear", "autofocus", "tabindex", "appendTo"], outputs: ["onFocus", "onBlur", "onClear"] }] });
9062
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: InputsLoginEcommerce1, isStandalone: true, selector: "lib-inputs-login-ecommerce1", ngImport: i0, template: "<div class=\"input-group\">\n <label for=\"login-email\" class=\"input-label\">Email</label>\n <input pInputText id=\"login-email\" type=\"email\" class=\"input-field\" placeholder=\"ejemplo@correo.com\" required />\n</div>\n\n<div class=\"input-group\">\n <label for=\"login-password\" class=\"input-label\">Contrase\u00F1a</label>\n <p-password inputId=\"login-password\" placeholder=\"********\" [toggleMask]=\"true\" appendTo=\"body\" class=\"input-field\"></p-password>\n</div>\n\n<div class=\"form-row\">\n <div class=\"remember\">\n <p-checkbox inputId=\"remember-me\" binary=\"true\" (onChange)=\"onRememberChange($event)\"></p-checkbox>\n <label for=\"remember-me\" class=\"remember-label\">Recordarme</label>\n </div>\n <a href=\"#\" class=\"forgot-link\">\u00BFOlvidaste tu contrase\u00F1a?</a>\n</div>", styles: [".input-group{margin-bottom:1.5rem}.input-label{display:block;font-weight:700;margin-bottom:.5rem;color:#374151}.input-field{width:100%;padding:.75rem 1rem;border-radius:12px;border:1px solid #d1d5db}.form-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.remember{display:flex;align-items:center;gap:.5rem}.remember-label{margin:0;font-size:.9rem;color:#111827}.forgot-link{color:#111827;font-weight:600;text-decoration:none}.forgot-link:hover{opacity:.85}:host ::ng-deep .p-password{width:100%}:host ::ng-deep .p-inputtext{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: PrimegModule }, { kind: "component", type: i3$1.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "directive", type: i2$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i3$4.Password, selector: "p-password", inputs: ["ariaLabel", "ariaLabelledBy", "label", "promptLabel", "mediumRegex", "strongRegex", "weakLabel", "mediumLabel", "maxLength", "strongLabel", "inputId", "feedback", "toggleMask", "inputStyleClass", "styleClass", "inputStyle", "showTransitionOptions", "hideTransitionOptions", "autocomplete", "placeholder", "showClear", "autofocus", "tabindex", "appendTo"], outputs: ["onFocus", "onBlur", "onClear"] }] });
8957
9063
  }
8958
9064
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: InputsLoginEcommerce1, decorators: [{
8959
9065
  type: Component,
@@ -8977,7 +9083,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
8977
9083
 
8978
9084
  class InputsRegisterEcommerce1 {
8979
9085
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: InputsRegisterEcommerce1, deps: [], target: i0.ɵɵFactoryTarget.Component });
8980
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: InputsRegisterEcommerce1, isStandalone: true, selector: "lib-inputs-register-ecommerce1", ngImport: i0, template: "<div class=\"grid formgrid p-fluid\">\n <div class=\"col-12 field\">\n <label for=\"register-name\" class=\"input-label\">Nombre completo</label>\n <input id=\"register-name\" type=\"text\" pInputText placeholder=\"John Doe\" required />\n </div>\n\n <div class=\"col-12 field\">\n <label for=\"register-email\" class=\"input-label\">Email</label>\n <input id=\"register-email\" type=\"email\" pInputText placeholder=\"ejemplo@correo.com\" required />\n </div>\n\n <div class=\"col-12 field\">\n <label for=\"register-password\" class=\"input-label\">Contrase\u00F1a</label>\n <p-password inputId=\"register-password\" placeholder=\"********\" [toggleMask]=\"true\" appendTo=\"body\"></p-password>\n </div>\n\n <div class=\"col-12 field\">\n <label for=\"register-confirm-password\" class=\"input-label\">Confirmar Contrase\u00F1a</label>\n <p-password inputId=\"register-confirm-password\" [feedback]=\"false\" [toggleMask]=\"true\"></p-password>\n </div>\n</div>", styles: ["@charset \"UTF-8\";.input-label{display:block;font-weight:600;margin-bottom:.5rem;color:#374151}:host ::ng-deep .p-inputtext,:host ::ng-deep .p-password .p-inputtext{width:100%!important;border-radius:12px;padding:.75rem 1rem}:host ::ng-deep .p-password{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: PrimegModule }, { kind: "directive", type: i2$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i3$5.Password, selector: "p-password", inputs: ["ariaLabel", "ariaLabelledBy", "label", "promptLabel", "mediumRegex", "strongRegex", "weakLabel", "mediumLabel", "maxLength", "strongLabel", "inputId", "feedback", "toggleMask", "inputStyleClass", "styleClass", "inputStyle", "showTransitionOptions", "hideTransitionOptions", "autocomplete", "placeholder", "showClear", "autofocus", "tabindex", "appendTo"], outputs: ["onFocus", "onBlur", "onClear"] }] });
9086
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: InputsRegisterEcommerce1, isStandalone: true, selector: "lib-inputs-register-ecommerce1", ngImport: i0, template: "<div class=\"grid formgrid p-fluid\">\n <div class=\"col-12 field\">\n <label for=\"register-name\" class=\"input-label\">Nombre completo</label>\n <input id=\"register-name\" type=\"text\" pInputText placeholder=\"John Doe\" required />\n </div>\n\n <div class=\"col-12 field\">\n <label for=\"register-email\" class=\"input-label\">Email</label>\n <input id=\"register-email\" type=\"email\" pInputText placeholder=\"ejemplo@correo.com\" required />\n </div>\n\n <div class=\"col-12 field\">\n <label for=\"register-password\" class=\"input-label\">Contrase\u00F1a</label>\n <p-password inputId=\"register-password\" placeholder=\"********\" [toggleMask]=\"true\" appendTo=\"body\"></p-password>\n </div>\n\n <div class=\"col-12 field\">\n <label for=\"register-confirm-password\" class=\"input-label\">Confirmar Contrase\u00F1a</label>\n <p-password inputId=\"register-confirm-password\" [feedback]=\"false\" [toggleMask]=\"true\"></p-password>\n </div>\n</div>", styles: ["@charset \"UTF-8\";.input-label{display:block;font-weight:600;margin-bottom:.5rem;color:#374151}:host ::ng-deep .p-inputtext,:host ::ng-deep .p-password .p-inputtext{width:100%!important;border-radius:12px;padding:.75rem 1rem}:host ::ng-deep .p-password{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: PrimegModule }, { kind: "directive", type: i2$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i3$4.Password, selector: "p-password", inputs: ["ariaLabel", "ariaLabelledBy", "label", "promptLabel", "mediumRegex", "strongRegex", "weakLabel", "mediumLabel", "maxLength", "strongLabel", "inputId", "feedback", "toggleMask", "inputStyleClass", "styleClass", "inputStyle", "showTransitionOptions", "hideTransitionOptions", "autocomplete", "placeholder", "showClear", "autofocus", "tabindex", "appendTo"], outputs: ["onFocus", "onBlur", "onClear"] }] });
8981
9087
  }
8982
9088
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: InputsRegisterEcommerce1, decorators: [{
8983
9089
  type: Component,
@@ -9558,13 +9664,13 @@ class DetalleProductoPageLib {
9558
9664
  }
9559
9665
  return this.productSvc.mockCategoriaInflablesDTO();
9560
9666
  }
9561
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DetalleProductoPageLib, deps: [{ token: i1$8.ActivatedRoute }, { token: ProductService }, { token: MetaDataService }, { token: i4$3.Store }], target: i0.ɵɵFactoryTarget.Component });
9562
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DetalleProductoPageLib, isStandalone: true, selector: "lib-product-detail-lib", inputs: { product: "product", isLogin: "isLogin", categorias: "categorias" }, ngImport: i0, template: "<div class=\"py-4 background-page mx-auto px-3\">\n <lib-detalle-carrito-1 [product]=\"product!\" [isLogin]=\"isLogin\"></lib-detalle-carrito-1>\n\n @if (products && products.length > 0) {\n <section class=\"mt-4 related-products\">\n <h3 class=\"text-white font-semibold mb-2\">Productos que te pueden gustar</h3>\n <swiper-container direction=\"horizontal\" navigation=\"true\" pagination=\"true\" pagination-clickable=\"true\" loop=\"true\" autoplay=\"true\"\n autoplay-delay=\"6000\" autoplay-disable-on-interaction=\"false\" speed=\"600\"\n [slidesPerView]=\"slidesPerViewBase\" [spaceBetween]=\"spaceBetweenBase\"\n [breakpoints]=\"breakpoints\"\n style=\"--swiper-navigation-color:#FFD600; --swiper-theme-color:#FFD600; --swiper-pagination-color:#FFD600; --swiper-pagination-bullet-inactive-color:#FFFFFF; --swiper-pagination-bullet-inactive-opacity:0.6; --swiper-pagination-bullet-size:8px; --swiper-pagination-bullet-horizontal-gap:6px;\">\n @for (p of products; track p.id) {\n <swiper-slide>\n <lib-card-productos1 [product]=\"p\" [isLogin]=\"isLogin\"></lib-card-productos1>\n </swiper-slide>\n }\n </swiper-container>\n </section>\n }\n</div>\n", styles: [":root{--button-colors: linear-gradient(50deg, rgba(2,0,36,1) 0%, rgba(6,68,160,1) 29%, rgba(0,212,255,1) 83%, rgba(7,44,144,1) 100%, rgba(9,9,121,1) 100%);--ion-color-primary: #3880ff;--ion-color-primary-rgb: 56, 128, 255;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #3171e0;--ion-color-primary-tint: #4c8dff;--ion-color-secondary: #3dc2ff;--ion-color-secondary-rgb: 61, 194, 255;--ion-color-secondary-contrast: #ffffff;--ion-color-secondary-contrast-rgb: 255, 255, 255;--ion-color-secondary-shade: #36abe0;--ion-color-secondary-tint: #50c8ff;--ion-color-tertiary: #5260ff;--ion-color-tertiary-rgb: 82, 96, 255;--ion-color-tertiary-contrast: #ffffff;--ion-color-tertiary-contrast-rgb: 255, 255, 255;--ion-color-tertiary-shade: #4854e0;--ion-color-tertiary-tint: #6370ff;--ion-color-success: #2dd36f;--ion-color-success-rgb: 45, 211, 111;--ion-color-success-contrast: #ffffff;--ion-color-success-contrast-rgb: 255, 255, 255;--ion-color-success-shade: #28ba62;--ion-color-success-tint: #42d77d;--ion-color-warning: #ffc409;--ion-color-warning-rgb: 255, 196, 9;--ion-color-warning-contrast: #000000;--ion-color-warning-contrast-rgb: 0, 0, 0;--ion-color-warning-shade: #e0ac08;--ion-color-warning-tint: #ffca22;--ion-color-danger: #eb445a;--ion-color-danger-rgb: 235, 68, 90;--ion-color-danger-contrast: #ffffff;--ion-color-danger-contrast-rgb: 255, 255, 255;--ion-color-danger-shade: #cf3c4f;--ion-color-danger-tint: #ed576b;--ion-color-dark: #222428;--ion-color-dark-rgb: 34, 36, 40;--ion-color-dark-contrast: #ffffff;--ion-color-dark-contrast-rgb: 255, 255, 255;--ion-color-dark-shade: #1e2023;--ion-color-dark-tint: #383a3e;--ion-color-medium: #92949c;--ion-color-medium-rgb: 146, 148, 156;--ion-color-medium-contrast: #ffffff;--ion-color-medium-contrast-rgb: 255, 255, 255;--ion-color-medium-shade: #808289;--ion-color-medium-tint: #9d9fa6;--ion-color-light: #f4f5f8;--ion-color-light-rgb: 244, 245, 248;--ion-color-light-contrast: #000000;--ion-color-light-contrast-rgb: 0, 0, 0;--ion-color-light-shade: #d7d8da;--ion-color-light-tint: #f5f6f9}@media (prefers-color-scheme: dark){body{--ion-color-primary: #428cff;--ion-color-primary-rgb: 66,140,255;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #3a7be0;--ion-color-primary-tint: #5598ff;--ion-color-secondary: #50c8ff;--ion-color-secondary-rgb: 80,200,255;--ion-color-secondary-contrast: #ffffff;--ion-color-secondary-contrast-rgb: 255,255,255;--ion-color-secondary-shade: #46b0e0;--ion-color-secondary-tint: #62ceff;--ion-color-tertiary: #6a64ff;--ion-color-tertiary-rgb: 106,100,255;--ion-color-tertiary-contrast: #ffffff;--ion-color-tertiary-contrast-rgb: 255,255,255;--ion-color-tertiary-shade: #5d58e0;--ion-color-tertiary-tint: #7974ff;--ion-color-success: #2fdf75;--ion-color-success-rgb: 47,223,117;--ion-color-success-contrast: #000000;--ion-color-success-contrast-rgb: 0,0,0;--ion-color-success-shade: #29c467;--ion-color-success-tint: #44e283;--ion-color-warning: #ffd534;--ion-color-warning-rgb: 255,213,52;--ion-color-warning-contrast: #000000;--ion-color-warning-contrast-rgb: 0,0,0;--ion-color-warning-shade: #e0bb2e;--ion-color-warning-tint: #ffd948;--ion-color-danger: #ff4961;--ion-color-danger-rgb: 255,73,97;--ion-color-danger-contrast: #ffffff;--ion-color-danger-contrast-rgb: 255,255,255;--ion-color-danger-shade: #e04055;--ion-color-danger-tint: #ff5b71;--ion-color-dark: #f4f5f8;--ion-color-dark-rgb: 244,245,248;--ion-color-dark-contrast: #000000;--ion-color-dark-contrast-rgb: 0,0,0;--ion-color-dark-shade: #d7d8da;--ion-color-dark-tint: #f5f6f9;--ion-color-medium: #989aa2;--ion-color-medium-rgb: 152,154,162;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0,0,0;--ion-color-medium-shade: #86888f;--ion-color-medium-tint: #a2a4ab;--ion-color-light: #222428;--ion-color-light-rgb: 34,36,40;--ion-color-light-contrast: #ffffff;--ion-color-light-contrast-rgb: 255,255,255;--ion-color-light-shade: #1e2023;--ion-color-light-tint: #383a3e}.ios body{--ion-background-color: #0b2f89;--ion-background-color-rgb: 11, 47, 137;--ion-text-color: #ffffff;--ion-text-color-rgb: 255,255,255;--ion-color-step-50: #2d2f34;--ion-color-step-100: #383a3e;--ion-color-step-150: #434549;--ion-color-step-200: #4e5055;--ion-color-step-250: #595b5f;--ion-color-step-300: #64666a;--ion-color-step-350: #6f7175;--ion-color-step-400: #7a7c80;--ion-color-step-450: #85878b;--ion-color-step-500: #909296;--ion-color-step-550: #9b9da1;--ion-color-step-600: #a6a8ac;--ion-color-step-650: #b1b3b7;--ion-color-step-700: #bcbec2;--ion-color-step-750: #c7c9cc;--ion-color-step-800: #d2d4d7;--ion-color-step-850: #dddfe2;--ion-color-step-900: #e8eaed;--ion-color-step-950: #f3f5f8;--ion-item-background: #2c2e33;--ion-card-background: #383a3e}.ios ion-modal{--ion-background-color: var(--ion-color-step-100);--ion-toolbar-background: var(--ion-color-step-150);--ion-toolbar-border-color: var(--ion-color-step-250)}.md body{--ion-background-color: #0b2f89;--ion-background-color-rgb: 11, 47, 137;--ion-text-color: #ffffff;--ion-text-color-rgb: 255,255,255;--ion-border-color: #3e4045;--ion-color-step-50: #2d2f34;--ion-color-step-100: #383a3e;--ion-color-step-150: #434549;--ion-color-step-200: #4e5055;--ion-color-step-250: #595b5f;--ion-color-step-300: #64666a;--ion-color-step-350: #6f7175;--ion-color-step-400: #7a7c80;--ion-color-step-450: #85878b;--ion-color-step-500: #909296;--ion-color-step-550: #9b9da1;--ion-color-step-600: #a6a8ac;--ion-color-step-650: #b1b3b7;--ion-color-step-700: #bcbec2;--ion-color-step-750: #c7c9cc;--ion-color-step-800: #d2d4d7;--ion-color-step-850: #dddfe2;--ion-color-step-900: #e8eaed;--ion-color-step-950: #f3f5f8;--ion-item-background: #2c2e33;--ion-toolbar-background: #2d2f34;--ion-tab-bar-background: #2d2f34;--ion-card-background: #383a3e}}.background-page{background-color:#0093e9!important}.related-products :host ::ng-deep lib-card-productos1 h3{text-align:center!important}.related-products :host ::ng-deep lib-card-productos1 .surface-ground,.related-products :host ::ng-deep lib-card-productos1 .info-badges{text-align:center!important;justify-content:center!important}.related-products :host ::ng-deep lib-card-productos1 .mt-auto .flex{justify-content:center!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DetalleCarrito1Component, selector: "lib-detalle-carrito-1", inputs: ["product", "isLogin", "isPersonalizable"], outputs: ["addToCart"] }, { kind: "component", type: CardProductos1Component, selector: "lib-card-productos1", inputs: ["product", "isLogin", "detailRouteBase"], outputs: ["addToCart"] }] });
9667
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DetalleProductoPageLib, deps: [{ token: i1$8.ActivatedRoute }, { token: ProductService }, { token: MetaDataService }, { token: i4$4.Store }], target: i0.ɵɵFactoryTarget.Component });
9668
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DetalleProductoPageLib, isStandalone: true, selector: "lib-product-detail-lib", inputs: { product: "product", isLogin: "isLogin", categorias: "categorias" }, ngImport: i0, template: "<div class=\"py-4 background-page mx-auto px-3\">\n <lib-detalle-carrito-1 [product]=\"product!\" [isLogin]=\"isLogin\"></lib-detalle-carrito-1>\n\n @if (products && products.length > 0) {\n <section class=\"mt-4 related-products\">\n <h3 class=\"text-white font-semibold mb-2\">Productos que te pueden gustar</h3>\n <swiper-container direction=\"horizontal\" navigation=\"true\" pagination=\"true\" pagination-clickable=\"true\" loop=\"true\" autoplay=\"true\"\n autoplay-delay=\"6000\" autoplay-disable-on-interaction=\"false\" speed=\"600\"\n [slidesPerView]=\"slidesPerViewBase\" [spaceBetween]=\"spaceBetweenBase\"\n [breakpoints]=\"breakpoints\"\n style=\"--swiper-navigation-color:#FFD600; --swiper-theme-color:#FFD600; --swiper-pagination-color:#FFD600; --swiper-pagination-bullet-inactive-color:#FFFFFF; --swiper-pagination-bullet-inactive-opacity:0.6; --swiper-pagination-bullet-size:8px; --swiper-pagination-bullet-horizontal-gap:6px;\">\n @for (p of products; track p.id) {\n <swiper-slide>\n <lib-card-productos1 [product]=\"p\" [isLogin]=\"isLogin\"></lib-card-productos1>\n </swiper-slide>\n }\n </swiper-container>\n </section>\n }\n</div>\n", styles: [":root{--button-colors: linear-gradient(50deg, rgba(2,0,36,1) 0%, rgba(6,68,160,1) 29%, rgba(0,212,255,1) 83%, rgba(7,44,144,1) 100%, rgba(9,9,121,1) 100%);--ion-color-primary: #3880ff;--ion-color-primary-rgb: 56, 128, 255;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #3171e0;--ion-color-primary-tint: #4c8dff;--ion-color-secondary: #3dc2ff;--ion-color-secondary-rgb: 61, 194, 255;--ion-color-secondary-contrast: #ffffff;--ion-color-secondary-contrast-rgb: 255, 255, 255;--ion-color-secondary-shade: #36abe0;--ion-color-secondary-tint: #50c8ff;--ion-color-tertiary: #5260ff;--ion-color-tertiary-rgb: 82, 96, 255;--ion-color-tertiary-contrast: #ffffff;--ion-color-tertiary-contrast-rgb: 255, 255, 255;--ion-color-tertiary-shade: #4854e0;--ion-color-tertiary-tint: #6370ff;--ion-color-success: #2dd36f;--ion-color-success-rgb: 45, 211, 111;--ion-color-success-contrast: #ffffff;--ion-color-success-contrast-rgb: 255, 255, 255;--ion-color-success-shade: #28ba62;--ion-color-success-tint: #42d77d;--ion-color-warning: #ffc409;--ion-color-warning-rgb: 255, 196, 9;--ion-color-warning-contrast: #000000;--ion-color-warning-contrast-rgb: 0, 0, 0;--ion-color-warning-shade: #e0ac08;--ion-color-warning-tint: #ffca22;--ion-color-danger: #eb445a;--ion-color-danger-rgb: 235, 68, 90;--ion-color-danger-contrast: #ffffff;--ion-color-danger-contrast-rgb: 255, 255, 255;--ion-color-danger-shade: #cf3c4f;--ion-color-danger-tint: #ed576b;--ion-color-dark: #222428;--ion-color-dark-rgb: 34, 36, 40;--ion-color-dark-contrast: #ffffff;--ion-color-dark-contrast-rgb: 255, 255, 255;--ion-color-dark-shade: #1e2023;--ion-color-dark-tint: #383a3e;--ion-color-medium: #92949c;--ion-color-medium-rgb: 146, 148, 156;--ion-color-medium-contrast: #ffffff;--ion-color-medium-contrast-rgb: 255, 255, 255;--ion-color-medium-shade: #808289;--ion-color-medium-tint: #9d9fa6;--ion-color-light: #f4f5f8;--ion-color-light-rgb: 244, 245, 248;--ion-color-light-contrast: #000000;--ion-color-light-contrast-rgb: 0, 0, 0;--ion-color-light-shade: #d7d8da;--ion-color-light-tint: #f5f6f9}@media (prefers-color-scheme: dark){body{--ion-color-primary: #428cff;--ion-color-primary-rgb: 66,140,255;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #3a7be0;--ion-color-primary-tint: #5598ff;--ion-color-secondary: #50c8ff;--ion-color-secondary-rgb: 80,200,255;--ion-color-secondary-contrast: #ffffff;--ion-color-secondary-contrast-rgb: 255,255,255;--ion-color-secondary-shade: #46b0e0;--ion-color-secondary-tint: #62ceff;--ion-color-tertiary: #6a64ff;--ion-color-tertiary-rgb: 106,100,255;--ion-color-tertiary-contrast: #ffffff;--ion-color-tertiary-contrast-rgb: 255,255,255;--ion-color-tertiary-shade: #5d58e0;--ion-color-tertiary-tint: #7974ff;--ion-color-success: #2fdf75;--ion-color-success-rgb: 47,223,117;--ion-color-success-contrast: #000000;--ion-color-success-contrast-rgb: 0,0,0;--ion-color-success-shade: #29c467;--ion-color-success-tint: #44e283;--ion-color-warning: #ffd534;--ion-color-warning-rgb: 255,213,52;--ion-color-warning-contrast: #000000;--ion-color-warning-contrast-rgb: 0,0,0;--ion-color-warning-shade: #e0bb2e;--ion-color-warning-tint: #ffd948;--ion-color-danger: #ff4961;--ion-color-danger-rgb: 255,73,97;--ion-color-danger-contrast: #ffffff;--ion-color-danger-contrast-rgb: 255,255,255;--ion-color-danger-shade: #e04055;--ion-color-danger-tint: #ff5b71;--ion-color-dark: #f4f5f8;--ion-color-dark-rgb: 244,245,248;--ion-color-dark-contrast: #000000;--ion-color-dark-contrast-rgb: 0,0,0;--ion-color-dark-shade: #d7d8da;--ion-color-dark-tint: #f5f6f9;--ion-color-medium: #989aa2;--ion-color-medium-rgb: 152,154,162;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0,0,0;--ion-color-medium-shade: #86888f;--ion-color-medium-tint: #a2a4ab;--ion-color-light: #222428;--ion-color-light-rgb: 34,36,40;--ion-color-light-contrast: #ffffff;--ion-color-light-contrast-rgb: 255,255,255;--ion-color-light-shade: #1e2023;--ion-color-light-tint: #383a3e}.ios body{--ion-background-color: #0b2f89;--ion-background-color-rgb: 11, 47, 137;--ion-text-color: #ffffff;--ion-text-color-rgb: 255,255,255;--ion-color-step-50: #2d2f34;--ion-color-step-100: #383a3e;--ion-color-step-150: #434549;--ion-color-step-200: #4e5055;--ion-color-step-250: #595b5f;--ion-color-step-300: #64666a;--ion-color-step-350: #6f7175;--ion-color-step-400: #7a7c80;--ion-color-step-450: #85878b;--ion-color-step-500: #909296;--ion-color-step-550: #9b9da1;--ion-color-step-600: #a6a8ac;--ion-color-step-650: #b1b3b7;--ion-color-step-700: #bcbec2;--ion-color-step-750: #c7c9cc;--ion-color-step-800: #d2d4d7;--ion-color-step-850: #dddfe2;--ion-color-step-900: #e8eaed;--ion-color-step-950: #f3f5f8;--ion-item-background: #2c2e33;--ion-card-background: #383a3e}.ios ion-modal{--ion-background-color: var(--ion-color-step-100);--ion-toolbar-background: var(--ion-color-step-150);--ion-toolbar-border-color: var(--ion-color-step-250)}.md body{--ion-background-color: #0b2f89;--ion-background-color-rgb: 11, 47, 137;--ion-text-color: #ffffff;--ion-text-color-rgb: 255,255,255;--ion-border-color: #3e4045;--ion-color-step-50: #2d2f34;--ion-color-step-100: #383a3e;--ion-color-step-150: #434549;--ion-color-step-200: #4e5055;--ion-color-step-250: #595b5f;--ion-color-step-300: #64666a;--ion-color-step-350: #6f7175;--ion-color-step-400: #7a7c80;--ion-color-step-450: #85878b;--ion-color-step-500: #909296;--ion-color-step-550: #9b9da1;--ion-color-step-600: #a6a8ac;--ion-color-step-650: #b1b3b7;--ion-color-step-700: #bcbec2;--ion-color-step-750: #c7c9cc;--ion-color-step-800: #d2d4d7;--ion-color-step-850: #dddfe2;--ion-color-step-900: #e8eaed;--ion-color-step-950: #f3f5f8;--ion-item-background: #2c2e33;--ion-toolbar-background: #2d2f34;--ion-tab-bar-background: #2d2f34;--ion-card-background: #383a3e}}.background-page{background-color:#0093e9!important}.related-products :host ::ng-deep lib-card-productos1 h3{text-align:center!important}.related-products :host ::ng-deep lib-card-productos1 .surface-ground,.related-products :host ::ng-deep lib-card-productos1 .info-badges{text-align:center!important;justify-content:center!important}.related-products :host ::ng-deep lib-card-productos1 .mt-auto .flex{justify-content:center!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DetalleCarrito1Component, selector: "lib-detalle-carrito-1", inputs: ["product", "isLogin", "isPersonalizable", "DatosNegocio"], outputs: ["addToCart"] }, { kind: "component", type: CardProductos1Component, selector: "lib-card-productos1", inputs: ["product", "isLogin", "DatosNegocio", "detailRouteBase"], outputs: ["addToCart"] }] });
9563
9669
  }
9564
9670
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DetalleProductoPageLib, decorators: [{
9565
9671
  type: Component,
9566
9672
  args: [{ selector: 'lib-product-detail-lib', standalone: true, imports: [CommonModule, DetalleCarrito1Component, CardProductos1Component], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<div class=\"py-4 background-page mx-auto px-3\">\n <lib-detalle-carrito-1 [product]=\"product!\" [isLogin]=\"isLogin\"></lib-detalle-carrito-1>\n\n @if (products && products.length > 0) {\n <section class=\"mt-4 related-products\">\n <h3 class=\"text-white font-semibold mb-2\">Productos que te pueden gustar</h3>\n <swiper-container direction=\"horizontal\" navigation=\"true\" pagination=\"true\" pagination-clickable=\"true\" loop=\"true\" autoplay=\"true\"\n autoplay-delay=\"6000\" autoplay-disable-on-interaction=\"false\" speed=\"600\"\n [slidesPerView]=\"slidesPerViewBase\" [spaceBetween]=\"spaceBetweenBase\"\n [breakpoints]=\"breakpoints\"\n style=\"--swiper-navigation-color:#FFD600; --swiper-theme-color:#FFD600; --swiper-pagination-color:#FFD600; --swiper-pagination-bullet-inactive-color:#FFFFFF; --swiper-pagination-bullet-inactive-opacity:0.6; --swiper-pagination-bullet-size:8px; --swiper-pagination-bullet-horizontal-gap:6px;\">\n @for (p of products; track p.id) {\n <swiper-slide>\n <lib-card-productos1 [product]=\"p\" [isLogin]=\"isLogin\"></lib-card-productos1>\n </swiper-slide>\n }\n </swiper-container>\n </section>\n }\n</div>\n", styles: [":root{--button-colors: linear-gradient(50deg, rgba(2,0,36,1) 0%, rgba(6,68,160,1) 29%, rgba(0,212,255,1) 83%, rgba(7,44,144,1) 100%, rgba(9,9,121,1) 100%);--ion-color-primary: #3880ff;--ion-color-primary-rgb: 56, 128, 255;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #3171e0;--ion-color-primary-tint: #4c8dff;--ion-color-secondary: #3dc2ff;--ion-color-secondary-rgb: 61, 194, 255;--ion-color-secondary-contrast: #ffffff;--ion-color-secondary-contrast-rgb: 255, 255, 255;--ion-color-secondary-shade: #36abe0;--ion-color-secondary-tint: #50c8ff;--ion-color-tertiary: #5260ff;--ion-color-tertiary-rgb: 82, 96, 255;--ion-color-tertiary-contrast: #ffffff;--ion-color-tertiary-contrast-rgb: 255, 255, 255;--ion-color-tertiary-shade: #4854e0;--ion-color-tertiary-tint: #6370ff;--ion-color-success: #2dd36f;--ion-color-success-rgb: 45, 211, 111;--ion-color-success-contrast: #ffffff;--ion-color-success-contrast-rgb: 255, 255, 255;--ion-color-success-shade: #28ba62;--ion-color-success-tint: #42d77d;--ion-color-warning: #ffc409;--ion-color-warning-rgb: 255, 196, 9;--ion-color-warning-contrast: #000000;--ion-color-warning-contrast-rgb: 0, 0, 0;--ion-color-warning-shade: #e0ac08;--ion-color-warning-tint: #ffca22;--ion-color-danger: #eb445a;--ion-color-danger-rgb: 235, 68, 90;--ion-color-danger-contrast: #ffffff;--ion-color-danger-contrast-rgb: 255, 255, 255;--ion-color-danger-shade: #cf3c4f;--ion-color-danger-tint: #ed576b;--ion-color-dark: #222428;--ion-color-dark-rgb: 34, 36, 40;--ion-color-dark-contrast: #ffffff;--ion-color-dark-contrast-rgb: 255, 255, 255;--ion-color-dark-shade: #1e2023;--ion-color-dark-tint: #383a3e;--ion-color-medium: #92949c;--ion-color-medium-rgb: 146, 148, 156;--ion-color-medium-contrast: #ffffff;--ion-color-medium-contrast-rgb: 255, 255, 255;--ion-color-medium-shade: #808289;--ion-color-medium-tint: #9d9fa6;--ion-color-light: #f4f5f8;--ion-color-light-rgb: 244, 245, 248;--ion-color-light-contrast: #000000;--ion-color-light-contrast-rgb: 0, 0, 0;--ion-color-light-shade: #d7d8da;--ion-color-light-tint: #f5f6f9}@media (prefers-color-scheme: dark){body{--ion-color-primary: #428cff;--ion-color-primary-rgb: 66,140,255;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255,255,255;--ion-color-primary-shade: #3a7be0;--ion-color-primary-tint: #5598ff;--ion-color-secondary: #50c8ff;--ion-color-secondary-rgb: 80,200,255;--ion-color-secondary-contrast: #ffffff;--ion-color-secondary-contrast-rgb: 255,255,255;--ion-color-secondary-shade: #46b0e0;--ion-color-secondary-tint: #62ceff;--ion-color-tertiary: #6a64ff;--ion-color-tertiary-rgb: 106,100,255;--ion-color-tertiary-contrast: #ffffff;--ion-color-tertiary-contrast-rgb: 255,255,255;--ion-color-tertiary-shade: #5d58e0;--ion-color-tertiary-tint: #7974ff;--ion-color-success: #2fdf75;--ion-color-success-rgb: 47,223,117;--ion-color-success-contrast: #000000;--ion-color-success-contrast-rgb: 0,0,0;--ion-color-success-shade: #29c467;--ion-color-success-tint: #44e283;--ion-color-warning: #ffd534;--ion-color-warning-rgb: 255,213,52;--ion-color-warning-contrast: #000000;--ion-color-warning-contrast-rgb: 0,0,0;--ion-color-warning-shade: #e0bb2e;--ion-color-warning-tint: #ffd948;--ion-color-danger: #ff4961;--ion-color-danger-rgb: 255,73,97;--ion-color-danger-contrast: #ffffff;--ion-color-danger-contrast-rgb: 255,255,255;--ion-color-danger-shade: #e04055;--ion-color-danger-tint: #ff5b71;--ion-color-dark: #f4f5f8;--ion-color-dark-rgb: 244,245,248;--ion-color-dark-contrast: #000000;--ion-color-dark-contrast-rgb: 0,0,0;--ion-color-dark-shade: #d7d8da;--ion-color-dark-tint: #f5f6f9;--ion-color-medium: #989aa2;--ion-color-medium-rgb: 152,154,162;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0,0,0;--ion-color-medium-shade: #86888f;--ion-color-medium-tint: #a2a4ab;--ion-color-light: #222428;--ion-color-light-rgb: 34,36,40;--ion-color-light-contrast: #ffffff;--ion-color-light-contrast-rgb: 255,255,255;--ion-color-light-shade: #1e2023;--ion-color-light-tint: #383a3e}.ios body{--ion-background-color: #0b2f89;--ion-background-color-rgb: 11, 47, 137;--ion-text-color: #ffffff;--ion-text-color-rgb: 255,255,255;--ion-color-step-50: #2d2f34;--ion-color-step-100: #383a3e;--ion-color-step-150: #434549;--ion-color-step-200: #4e5055;--ion-color-step-250: #595b5f;--ion-color-step-300: #64666a;--ion-color-step-350: #6f7175;--ion-color-step-400: #7a7c80;--ion-color-step-450: #85878b;--ion-color-step-500: #909296;--ion-color-step-550: #9b9da1;--ion-color-step-600: #a6a8ac;--ion-color-step-650: #b1b3b7;--ion-color-step-700: #bcbec2;--ion-color-step-750: #c7c9cc;--ion-color-step-800: #d2d4d7;--ion-color-step-850: #dddfe2;--ion-color-step-900: #e8eaed;--ion-color-step-950: #f3f5f8;--ion-item-background: #2c2e33;--ion-card-background: #383a3e}.ios ion-modal{--ion-background-color: var(--ion-color-step-100);--ion-toolbar-background: var(--ion-color-step-150);--ion-toolbar-border-color: var(--ion-color-step-250)}.md body{--ion-background-color: #0b2f89;--ion-background-color-rgb: 11, 47, 137;--ion-text-color: #ffffff;--ion-text-color-rgb: 255,255,255;--ion-border-color: #3e4045;--ion-color-step-50: #2d2f34;--ion-color-step-100: #383a3e;--ion-color-step-150: #434549;--ion-color-step-200: #4e5055;--ion-color-step-250: #595b5f;--ion-color-step-300: #64666a;--ion-color-step-350: #6f7175;--ion-color-step-400: #7a7c80;--ion-color-step-450: #85878b;--ion-color-step-500: #909296;--ion-color-step-550: #9b9da1;--ion-color-step-600: #a6a8ac;--ion-color-step-650: #b1b3b7;--ion-color-step-700: #bcbec2;--ion-color-step-750: #c7c9cc;--ion-color-step-800: #d2d4d7;--ion-color-step-850: #dddfe2;--ion-color-step-900: #e8eaed;--ion-color-step-950: #f3f5f8;--ion-item-background: #2c2e33;--ion-toolbar-background: #2d2f34;--ion-tab-bar-background: #2d2f34;--ion-card-background: #383a3e}}.background-page{background-color:#0093e9!important}.related-products :host ::ng-deep lib-card-productos1 h3{text-align:center!important}.related-products :host ::ng-deep lib-card-productos1 .surface-ground,.related-products :host ::ng-deep lib-card-productos1 .info-badges{text-align:center!important;justify-content:center!important}.related-products :host ::ng-deep lib-card-productos1 .mt-auto .flex{justify-content:center!important}\n"] }]
9567
- }], ctorParameters: () => [{ type: i1$8.ActivatedRoute }, { type: ProductService }, { type: MetaDataService }, { type: i4$3.Store }], propDecorators: { product: [{
9673
+ }], ctorParameters: () => [{ type: i1$8.ActivatedRoute }, { type: ProductService }, { type: MetaDataService }, { type: i4$4.Store }], propDecorators: { product: [{
9568
9674
  type: Input
9569
9675
  }], isLogin: [{
9570
9676
  type: Input
@@ -9572,6 +9678,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
9572
9678
  type: Input
9573
9679
  }] } });
9574
9680
 
9681
+ class BarFloatEcommerce1 {
9682
+ componente = {
9683
+ id: 33,
9684
+ nombreComponente: 'lib-bar-float-ecommerce1',
9685
+ version: '1.0',
9686
+ descripcion: 'Componente para mostrar una barra flotante en la página de ecommerce1'
9687
+ };
9688
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: BarFloatEcommerce1, deps: [], target: i0.ɵɵFactoryTarget.Component });
9689
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: BarFloatEcommerce1, isStandalone: true, selector: "lib-bar-float-ecommerce1", ngImport: i0, template: "<section aria-label=\"Secci\u00F3n principal de la f\u00E1brica de inflables\" class=\"bar-hero animate-hero-section\" style=\"background-image: url('../../../../../assets/imagenes/bannerInflables.png');\">\n <div class=\"bar-hero-inner\">\n <div class=\"bar-hero-card\">\n <p class=\"hero-subtitle\">\u00A1Bienvenido a Zigma Inflables!</p>\n <h1 aria-label=\"T\u00EDtulo principal: F\u00E1brica de inflables\" class=\"hero-title\">F\u00E1brica de inflables</h1>\n <p-button label=\"Ver cat\u00E1logo\" class=\"p-button-warning hero-cta\"></p-button>\n </div>\n </div>\n</section>", styles: [".bar-hero{background-size:cover;background-position:center;min-height:500px;position:relative}.bar-hero-inner{display:flex;align-items:center;justify-content:center;height:100%;padding:4rem 1rem}.bar-hero-card{background:#ffffffe6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:2rem;border-radius:1rem;max-width:900px;text-align:center;box-shadow:0 10px 30px #00000014}.hero-subtitle{margin:0 0 .5rem;color:#6b7280;font-size:1rem}.hero-title{margin:0 0 1rem;font-size:2rem;font-weight:800;color:#111827}.hero-cta{border-radius:999px;padding:.75rem 1.25rem}@media (min-width: 768px){.hero-title{font-size:2.5rem}.bar-hero-inner{padding-top:6rem}}.animate-hero-section{opacity:0;transform:translateY(50px);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-hero-section.is-visible{opacity:1;transform:translateY(0)}\n"], dependencies: [{ kind: "ngmodule", type: PrimegModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }], encapsulation: i0.ViewEncapsulation.None });
9690
+ }
9691
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: BarFloatEcommerce1, decorators: [{
9692
+ type: Component,
9693
+ args: [{ selector: 'lib-bar-float-ecommerce1', imports: [PrimegModule], encapsulation: ViewEncapsulation.None, template: "<section aria-label=\"Secci\u00F3n principal de la f\u00E1brica de inflables\" class=\"bar-hero animate-hero-section\" style=\"background-image: url('../../../../../assets/imagenes/bannerInflables.png');\">\n <div class=\"bar-hero-inner\">\n <div class=\"bar-hero-card\">\n <p class=\"hero-subtitle\">\u00A1Bienvenido a Zigma Inflables!</p>\n <h1 aria-label=\"T\u00EDtulo principal: F\u00E1brica de inflables\" class=\"hero-title\">F\u00E1brica de inflables</h1>\n <p-button label=\"Ver cat\u00E1logo\" class=\"p-button-warning hero-cta\"></p-button>\n </div>\n </div>\n</section>", styles: [".bar-hero{background-size:cover;background-position:center;min-height:500px;position:relative}.bar-hero-inner{display:flex;align-items:center;justify-content:center;height:100%;padding:4rem 1rem}.bar-hero-card{background:#ffffffe6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:2rem;border-radius:1rem;max-width:900px;text-align:center;box-shadow:0 10px 30px #00000014}.hero-subtitle{margin:0 0 .5rem;color:#6b7280;font-size:1rem}.hero-title{margin:0 0 1rem;font-size:2rem;font-weight:800;color:#111827}.hero-cta{border-radius:999px;padding:.75rem 1.25rem}@media (min-width: 768px){.hero-title{font-size:2.5rem}.bar-hero-inner{padding-top:6rem}}.animate-hero-section{opacity:0;transform:translateY(50px);transition:opacity 1.5s ease-out,transform 1.5s ease-out}.animate-hero-section.is-visible{opacity:1;transform:translateY(0)}\n"] }]
9694
+ }] });
9695
+
9575
9696
  class LibConfigModule {
9576
9697
  static forRoot(config) {
9577
9698
  return {
@@ -9839,13 +9960,9 @@ const ecomerce1Routes = [
9839
9960
  }
9840
9961
  ];
9841
9962
 
9842
- /*
9843
- * Public API Surface of common-lib
9844
- */
9845
-
9846
9963
  /**
9847
9964
  * Generated bundle index. Do not edit.
9848
9965
  */
9849
9966
 
9850
- export { AddUser, AppFooter, AppTopbar, BarFloatEcommerce1, BusinessActions, BusinessState, ButtonActionDelete1Component, ButtonActionEdit1Component, ButtonAdd1Component, ButtonAddToCard1, ButtonsSocialmediaLogin, CardProductos1Component, Carruselt1, CategoriaProductoState, CategoriaproductoActions, CategoriasProductosService, CommonLibComponent, CommonLibService, CoreModuleLib, Crud, CrudDialog1Component, CrudDocComponent, CustomizerComponent, DASHBOARD3_MENU_CONFIG, DaskBoard3, DeleteUser, DetalleCarrito1Component, DetalleProductoPageLib, DynamicEntity, DynamicFieldService, DynamicMenu1Component, DynamicMenuService, Ecommerce1, FooterEcommerce1, FormAuthEccomerce1, GenericCrudState, HeaderEcommerce1Component, HeaderTopEcommerce1, HeroSectionEcommerce1, HomeEcommerce1, Index1Component, Index2Component, InputsLoginEcommerce1, InputsRegisterEcommerce1, LIB_COMMON_CONFIG, LibConfigModule, LibConfigService, LoadingZigma, LoginEcommerce1, MenuComponent, MenuItem1Component, MenuManager, MetaDataService, MonedaActions, MonedaState, Notfound, PaginatorPgComponent, PrimegModule, ProductDialog1Component, ProductService, ProductosActions, ProductosState, RegisterEcommerce1, SectionAddCardsButtons, SectionFiltersCategoriesProductos, SectionImagesInstagramEcommerce1, SelectInput1Component, ShWatsButtonCard, Tabla1Component, Terminal, UpdateUser, createTranslateLoader, ecomerce1Routes, getUsers };
9967
+ export { AddUser, AppFooter, AppTopbar, BarFloatEcommerce1, BusinessActions, BusinessState, ButtonActionDelete1Component, ButtonActionEdit1Component, ButtonAdd1Component, ButtonAddToCard1, ButtonsSocialmediaLogin, CardProductos1Component, Carruselt1, CategoriaProductoState, CategoriaproductoActions, CategoriasProductosService, CommonLibComponent, CommonLibService, CoreModuleLib, Crud, CrudDialog1Component, CrudDocComponent, CustomizerComponent, DASHBOARD3_MENU_CONFIG, DaskBoard3, DeleteUser, DetalleCarrito1Component, DetalleProductoPageLib, DynamicEntity, DynamicFieldService, DynamicMenu1Component, DynamicMenuService, Ecommerce1, FooterEcommerce1, FormAuthEccomerce1, GenericCrudState, GoogleService, HeaderEcommerce1Component, HeaderTopEcommerce1, HeroSectionEcommerce1, HomeEcommerce1, Index1Component, Index2Component, InputsLoginEcommerce1, InputsRegisterEcommerce1, LIB_COMMON_CONFIG, LibConfigModule, LibConfigService, LoadingZigma, LoginEcommerce1, MenuComponent, MenuItem1Component, MenuManager, MetaDataService, MonedaActions, MonedaState, Notfound, PaginatorPgComponent, PrimegModule, ProductDialog1Component, ProductService, ProductosActions, ProductosState, RegisterEcommerce1, SectionAddCardsButtons, SectionFiltersCategoriesProductos, SectionImagesInstagramEcommerce1, SelectInput1Component, ShWatsButtonCard, Tabla1Component, Terminal, UpdateUser, createTranslateLoader, ecomerce1Routes, getUsers };
9851
9968
  //# sourceMappingURL=lib-common-angular.mjs.map