lib-common-angular 0.0.11 → 0.0.14

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/home-ecommerce1/home-ecommerce1.html

@@ -1,77 +0,0 @@
-<!--  Hero Section con animaciones-->
-
-<lib-hero-section-ecommerce1></lib-hero-section-ecommerce1>
-
-<!-- Product Grid Section -->
-
-<lib-section-filters-categories-productos id="categorias"
-    [categorias]="categorias"
-    (categorySelected)="onCategoryFilter($event)">
-</lib-section-filters-categories-productos>
-<ng-template #cards let-items>
-    <div class="grid align-items-center justify-content-center">
-        @for (product of items; track $index) {
-        <div class="col-12 md:col-6 p-5 lg:p-3 lg:col-4 product-card-animation"
-            [style.transition-delay]="($index * 30) + 'ms'">
-            <lib-card-productos1 [product]="product" [detailRouteBase]="detailRouteBase" (addToCart)="onAddToCart($event)">
-            </lib-card-productos1>
-        </div>
-        }
-    </div>
-</ng-template>
-
-<lib-paginator-pg
-  [data]="filteredProducts"
-  [rows]="9"
-  [rowsPerPageOptions]="[9,18,27,54,81]"
-  [showCurrentPageReport]="true"
-  [currentPageReportTemplate]="'Mostrando {first} a {last} de {totalRecords} ítems'"
-  [itemTemplate]="cards">
-</lib-paginator-pg>
-
-<!-- Seccion "Nuestra Historia"-->
-<section id="nosotros" class="history-section" style="
-    background-image: url(&quot;https://placehold.co/1400x600/b0b0b0/ffffff?text=Our+Story+Background+Image&quot;);
-  ">
-    <div class="history-overlay"></div>
-    <div class="history-content">
-        <p class="history-pretitle">Sobre Nosotros</p>
-        <h2 class="history-title">Conoce Nuestra Historia</h2>
-        <p class="history-text">
-            No hay una fórmula mágica para escribir un texto publicitario perfecto; se
-            basa en varios factores, incluyendo la ubicación del anuncio, la
-            demografía e incluso el estado de ánimo del consumidor.
-        </p>
-        <button pButton type="button" class="p-button-rounded p-button-lg p-button-warning" icon="pi pi-play"
-            aria-label="Ver video"></button>
-    </div>
-</section>
-
-<!-- Nueva seccion de Instagram -->
-<lib-section-images-instagram-ecommerce1></lib-section-images-instagram-ecommerce1>
-
-<!-- Newsletter (PrimeFlex + animación on scroll) -->
-<section class="surface-section py-5 animate-newsletter-section">
-    <div class="mx-auto px-3 md:px-4" style="max-width: 1100px;">
-        <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">
-            <div class="newsletter-left flex align-items-center gap-3 md:gap-4">
-                <div class="newsletter-icon flex align-items-center justify-content-center border-round-3xl" style="background:#fbc30d; width: 52px; height:52px;">
-                    <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;">
-                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8"></path>
-                    </svg>
-                </div>
-                <div class="newsletter-text">
-                    <h3 class="newsletter-title m-0 text-900 text-xl md:text-2xl">Suscríbete a nuestro boletín</h3>
-                    <p class="newsletter-subtitle m-0 text-600">¡y obtén un 10% de descuento!</p>
-                </div>
-            </div>
-            <div class="newsletter-right flex justify-content-center md:justify-content-end w-full md:w-auto">
-                <form id="newsletter-form" class="newsletter-form flex gap-2 w-full md:w-auto" style="max-width:520px;">
-                    <input pInputText type="email" id="email-input" name="email" class="flex-1 p-inputtext-sm md:p-inputtext" placeholder="Ingresa tu correo electrónico" required />
-                    <button pButton type="submit" label="Suscribirme" class="p-button-warning"></button>
-                </form>
-            </div>
-        </div>
-    </div>
-</section>
-

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/home-ecommerce1/home-ecommerce1.scss

@@ -1,63 +0,0 @@
- @use "../../../../../../../../../theme/funtions" as func;
-
-/* History section styles (replaces Tailwind utilities) */
-.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:rgba(0,0,0,0.5); }
-.history-content{ position:relative; z-index:2; max-width:800px; text-align:center; color:#ffffff; padding:2rem; }
-.history-pretitle{ font-size:1rem; font-weight:300; margin-bottom:.5rem; }
-.history-title{ font-size:2.25rem; margin:0 0 1rem 0; font-weight:700; }
-.history-text{ font-size:1rem; margin-bottom:1rem; font-weight:300; }
-
-/* Newsletter styles (replaces Tailwind utilities) */
-.animate-newsletter-section { opacity: 0; }
-.animate-newsletter-section .newsletter-card { opacity: 0; transform: translateY(24px); transition: opacity 600ms ease-out, transform 600ms ease-out; }
-.animate-newsletter-section.is-visible { opacity: 1; }
-.animate-newsletter-section.is-visible .newsletter-card { opacity: 1; transform: translateY(0); }
-
-@include func.responsive-up(md){
-    .newsletter-card{ flex-direction:row; justify-content:space-between; align-items:center; }
-    .newsletter-text{ text-align:left; }
-    .newsletter-right{ width:auto; }
-}
-
-
-/* --- 1. MÓVIL (Por defecto) --- */
-/* Pantallas pequeñas: Animación vertical suave para no salir de la pantalla */
-.product-card-animation {
-    opacity: 0;
-    transform: translateY(50px); /* Sube desde abajo */
-    transition: opacity 1.0s ease-out, transform 1.0s ease-out;
-    will-change: opacity, transform;
-
-    &.is-visible {
-        opacity: 1;
-        transform: translate(0, 0);
-    }
-}
-
-/* --- 2. TABLET (Entre 768px y 1024px) --- */
-@include func.responsive-up(md) {
-    .product-card-animation {
-        /* Hacemos un movimiento lateral PERO CORTO (-50px) */
-        /* Así se ve el efecto de lado, pero garantizamos que el usuario lo vea */
-        transform: translateX(-50px); 
-    }
-}
-
-/* --- 3. ESCRITORIO (Pantallas Grandes) --- */
-@include func.responsive-up(lg) {
-    .product-card-animation {
-        /* Aquí sí recuperamos tu efecto dramático largo */
-        transform: translateX(-400px); 
-        transition: opacity 1.0s ease-out, transform 1.0s ease-out;
-    }
-}

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/home-ecommerce1/home-ecommerce1.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { HomeEcommerce1 } from './home-ecommerce1';
-
-describe('HomeEcommerce1', () => {
-  let component: HomeEcommerce1;
-  let fixture: ComponentFixture<HomeEcommerce1>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [HomeEcommerce1]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(HomeEcommerce1);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/home-ecommerce1/home-ecommerce1.ts

@@ -1,160 +0,0 @@
-import { Component, Input, OnInit, Output, EventEmitter, AfterViewInit, ElementRef, OnChanges, SimpleChanges } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ButtonModule } from 'primeng/button';
-import { InputTextModule } from 'primeng/inputtext';
-import { HeroSectionEcommerce1 } from "../../../molecules/ecommerce1/hero-section-ecommerce1/hero-section-ecommerce1";
-import { SectionFiltersCategoriesProductos } from "../../../../shared/molecules/section-filters-categories-productos/section-filters-categories-productos";
-import { CardProductos1Component } from "../../../../shared/molecules/productos/card-productos1/card-productos1.component";
-import { SectionImagesInstagramEcommerce1 } from '../../../molecules/ecommerce1/section-images-instagram-ecommerce1/section-images-instagram-ecommerce1';
-import { PaginatorPgComponent } from '../../../../shared/atoms/paginator-pg/paginator-pg.component';
-import { BusinessDTO, CategoriaDTO, ComponentesDTO, ProductoDTO } from '@juliaosistem/core-dtos';
-
-@Component({
-  selector: 'lib-home-ecommerce1',
-  imports: [
-    CommonModule,
-    ButtonModule,
-    InputTextModule,
-    HeroSectionEcommerce1,
-    SectionFiltersCategoriesProductos,
-    CardProductos1Component,
-    SectionImagesInstagramEcommerce1,
-    PaginatorPgComponent
-  ],
-  templateUrl: './home-ecommerce1.html',
-  styleUrls: ['./home-ecommerce1.scss']
-})
-export class HomeEcommerce1 implements OnInit, AfterViewInit, OnChanges {
-
-  // Metadata del componente    
-  componente: ComponentesDTO = {
-    id: 28,
-    nombreComponente: 'lib-home-ecommerce1',
-    version: '1.0',
-    descripcion: 'Componente para mostrar home de ecommerce1'
-  }
-
-  // ===== Inputs desde la app =====
-  @Input() isLogin: boolean = false;
-  @Input() bussinesDTO!: BusinessDTO ;
-  @Input() categorias: CategoriaDTO[] = [];
-  // Base de ruta para navegar al detalle desde las cards (controlado por el front)
-  @Input() detailRouteBase: string[] = ['detalle'];
-
-  filteredProducts: ProductoDTO[] = [];
-
-  // ===== Outputs para eventos hacia la app =====
-  @Output() productClicked = new EventEmitter<ProductoDTO>();
-  @Output() categorySelected = new EventEmitter<string>();
-
-  constructor(private el: ElementRef) {}
-
-  ngOnInit(): void {
-    this.filteredProducts = this.getAllProducts();
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if ((changes['bussinesDTO'] && !changes['bussinesDTO'].firstChange) ||
-        (changes['categorias'] && !changes['categorias'].firstChange)) {
-      this.applyCategoryFilter('all');
-    }
-  }
-  ngAfterViewInit() {
-    this.iniciarAnimacionScroll();
-  }
-
-  /**
-   * Inicializa la animación de scroll configurando los observadores necesarios.
-   */
-  iniciarAnimacionScroll(): void {
-    const observer = this.createIntersectionObserver();
-    this.initialObservation(observer);
-    this.setupMutationObserver(observer);
-  }
-
-  /**
-   * Crea el IntersectionObserver para manejar la visibilidad de los elementos.
-   * @returns Instancia de IntersectionObserver configurada.
-   */
-  private createIntersectionObserver(): IntersectionObserver {
-    const observerOptions = { root: null, rootMargin: '0px', threshold: 0.1 };
-    return new IntersectionObserver((entries, obs) => {
-      entries.forEach((entry) => {
-        if (entry.isIntersecting) {
-          entry.target.classList.add('is-visible');
-          obs.unobserve(entry.target);
-        }
-      });
-    }, observerOptions);
-  }
-
-  /**
-   * Selecciona los elementos a animar y los añade al observador.
-   * @param observer El IntersectionObserver activo.
-   */
-  private observeElements(observer: IntersectionObserver): void {
-    const tarjetas = this.el.nativeElement.querySelectorAll('.product-card-animation');
-    tarjetas.forEach((tarjeta: Element) => observer.observe(tarjeta));
-    const newsletter = this.el.nativeElement.querySelectorAll('.animate-newsletter-section');
-    newsletter.forEach((sec: Element) => observer.observe(sec));
-    const genericos = this.el.nativeElement.querySelectorAll('.animate-scroll');
-    genericos.forEach((el: Element) => observer.observe(el));
-  }
-
-  /**
-   * Realiza la observación inicial después de un breve retraso para asegurar el renderizado.
-   * @param observer El IntersectionObserver activo.
-   */
-  private initialObservation(observer: IntersectionObserver): void {
-    setTimeout(() => {
-      this.observeElements(observer);
-    }, 50);
-  }
-
-  /**
-   * Configura un MutationObserver para detectar cambios en la paginación y re-observar elementos.
-   * @param observer El IntersectionObserver activo.
-   */
-  private setupMutationObserver(observer: IntersectionObserver): void {
-    const mutationObserver = new MutationObserver((mutations) => {
-      const shouldUpdate = mutations.some(mutation => mutation.addedNodes.length > 0);
-      if (shouldUpdate) {
-        this.observeElements(observer);
-      }
-    });
-
-    const paginatorElement = this.el.nativeElement.querySelector('lib-paginator-pg');
-    if (paginatorElement) {
-      mutationObserver.observe(paginatorElement, { childList: true, subtree: true });
-    }
-  }
-
-  // ===== Métodos para interactuar con la app =====
-  onProductClick(product: ProductoDTO): void {
-    this.productClicked.emit(product);
-  }
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-onAddToCart(event: any) {
-  console.log("Evento recibido:", event);
-}
-  onCategoryFilter(category: string): void {
-    this.applyCategoryFilter(category);
-    this.categorySelected.emit(category);
-  }
-
-  private applyCategoryFilter(category: string): void {
-    const base = this.getAllProducts();
-    if (!category || category === 'all') {
-      this.filteredProducts = base;
-      return;
-    }
-    this.filteredProducts = base.filter(p => p.nombreCategoria === category);
-  }
-
-  private getAllProducts(): ProductoDTO[] {
-    return (this.bussinesDTO && this.bussinesDTO.productos && this.bussinesDTO.productos.length > 0)
-      ? this.bussinesDTO.productos
-      : [];
-  }
-}

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/login-ecommerce1/login-ecommerce1.html

@@ -1,11 +0,0 @@
-<div class="auth-page">
-    <section class="auth-section">
-        <lib-section-header-forms-login-ecomerce1 [titulo]="'Iniciar Sesión'" [subtitulo]="'Bienvenido de nuevo'"></lib-section-header-forms-login-ecomerce1>
-        <lib-form-auth-eccomerce1 [isRegistering]="false" [isLogout]="false"></lib-form-auth-eccomerce1>
-        <div class="auth-footer">
-            <p>¿No tienes una cuenta?
-                <button pButton type="button" label="Regístrate" class="p-button-text" [routerLink]="['register']"></button>
-            </p>
-        </div>
-    </section>
-</div>

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/login-ecommerce1/login-ecommerce1.scss

@@ -1,20 +0,0 @@
-  .auth-page {
-            min-height: 100vh;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            flex-direction: column;
-            padding: 2rem 0;
-        }
-
-        .auth-section {
-            background-color: #ffffff;
-            padding: 4rem 2rem;
-            border-radius: 1rem;
-            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
-            max-width: 90%;
-            width: 500px;
-            margin: 4rem auto;
-            animation: fadeIn 0.5s ease-out;
-        }
-        

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/login-ecommerce1/login-ecommerce1.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { LoginEcommerce1 } from './login-ecommerce1';
-
-describe('LoginEcommerce1', () => {
-  let component: LoginEcommerce1;
-  let fixture: ComponentFixture<LoginEcommerce1>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [LoginEcommerce1]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(LoginEcommerce1);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/login-ecommerce1/login-ecommerce1.ts

@@ -1,18 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ButtonModule } from 'primeng/button';
-import { SectionHeaderFormsLoginEcomerce1 } from "../../../atoms/ecommerce1/section-header-forms-login-ecomerce1/section-header-forms-login-ecomerce1";
-import { FormAuthEccomerce1 } from "../../../molecules/ecommerce1/form-auth-eccomerce1/form-auth-eccomerce1";
-import { RouterModule } from '@angular/router';
-
-@Component({
-  selector: 'lib-login-ecommerce1',
-  imports: [CommonModule, ButtonModule, SectionHeaderFormsLoginEcomerce1, FormAuthEccomerce1, RouterModule],
-  templateUrl: './login-ecommerce1.html',
-  styleUrls: ['./login-ecommerce1.scss'],
-  encapsulation: ViewEncapsulation.None
-
-})
-export class LoginEcommerce1 {
-
-}

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/product-detail-lib/product-detail-lib.html

@@ -1,20 +0,0 @@
-<div class="py-4 background-page mx-auto px-3">
-        <lib-detalle-carrito-1 [product]="product!" [isLogin]="isLogin"></lib-detalle-carrito-1>
-
-        @if (products && products.length > 0) {
-                <section class="mt-4 related-products">
-                        <h3 class="text-white font-semibold mb-2">Productos que te pueden gustar</h3>
-                        <swiper-container direction="horizontal" navigation="true" pagination="true" pagination-clickable="true" loop="true" autoplay="true"
-                                                autoplay-delay="6000" autoplay-disable-on-interaction="false" speed="600"
-                                                [slidesPerView]="slidesPerViewBase" [spaceBetween]="spaceBetweenBase"
-                                                [breakpoints]="breakpoints"
-                                                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;">
-                                @for (p of products; track p.id) {
-                                        <swiper-slide>
-                                                <lib-card-productos1 [product]="p" [isLogin]="isLogin"></lib-card-productos1>
-                                        </swiper-slide>
-                                }
-                        </swiper-container>
-                </section>
-        }
-</div>

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/product-detail-lib/product-detail-lib.scss

@@ -1,20 +0,0 @@
-@use '../../../../../../../../../theme/variables.scss' as vars;
-
-.background-page {
-  background-color: vars.$brand-blue-zigma !important;
-}
-
-/* Centra el texto de los cards dentro del slider de relacionados */
-.related-products {
-  :host ::ng-deep lib-card-productos1 h3 {
-    text-align: center !important;
-  }
-  :host ::ng-deep lib-card-productos1 .surface-ground,
-  :host ::ng-deep lib-card-productos1 .info-badges {
-    text-align: center !important;
-    justify-content: center !important;
-  }
-  :host ::ng-deep lib-card-productos1 .mt-auto .flex {
-    justify-content: center !important;
-  }
-}

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/product-detail-lib/product-detail-lib.ts

@@ -1,190 +0,0 @@
-import { Component, OnInit, Input, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { DetalleCarrito1Component } from '../../../../shared/molecules/productos/detalle-carrito-1/detalle-carrito-1.component';
-import { MetaDataService } from '../../../../shared/services/meta-data.service.ts/meta-data.service';
-import { ProductoDTO,CategoriaDTO } from '@juliaosistem/core-dtos';
-import { ActivatedRoute } from '@angular/router';
-import { ProductService } from '../../../../shared/services/product.service';
-import { Store } from '@ngxs/store';
-import { ProductosState } from '../../../../../assets/state/productos.state';
-import { CardProductos1Component } from '../../../../shared/molecules/productos/card-productos1/card-productos1.component';
-import { register } from 'swiper/element/bundle';
-
-@Component({
-  selector: 'lib-product-detail-lib',
-  standalone: true,
-  imports: [CommonModule, DetalleCarrito1Component, CardProductos1Component],
-  templateUrl: './product-detail-lib.html',
-  styleUrls: ['./product-detail-lib.scss'],
-  schemas: [CUSTOM_ELEMENTS_SCHEMA]
-})
-export class DetalleProductoPageLib implements OnInit {
-  /**
-   * Producto actual a mostrar en el detalle.
-   * Puede llegar vía `@Input` o a través del `history.state`/ruta.
-   */
-  @Input() product: ProductoDTO | undefined;
-
-  /**
-   * Indica si el usuario está autenticado para habilitar acciones/visualizaciones para agregar al carrito.
-   */
-  @Input() isLogin = false;
-
-  /**
-   * Lista de categorías disponibles. Se usa para enriquecer los productos
-   * relacionados con el nombre de la categoría cuando el store no lo provee.
-   */
-  @Input() categorias: CategoriaDTO[] = [];
-
-  /**
-   * Productos relacionados (misma categoría) que se mostrarán en el slider.
-   */
-  products : ProductoDTO[] = [];
-
-  /**
-   * Configuración de breakpoints para el slider de productos relacionados.
-   * - 768px: 2 productos por vista
-   * - 1024px: 3 productos por vista
-   */
-  readonly breakpoints = {
-    768: { slidesPerView: 2, spaceBetween: 16 },
-    1024: { slidesPerView: 3, spaceBetween: 16 },
-  };
-
-  /** Número base de productos por vista (móvil). */
-  readonly slidesPerViewBase = 1;
-  /** Espacio base entre slides (px). */
-  readonly spaceBetweenBase = 12;
-
-  constructor(
-    private route: ActivatedRoute,
-    private productSvc: ProductService,
-    private meta: MetaDataService,
-    private store: Store,
-  ) {}
-
-  /**
-   * - Registra los web components de Swiper (una sola vez).
-   * - Resuelve el producto a mostrar y carga los relacionados.
-   */
-  ngOnInit(): void {
-    try { register(); } catch { /* ya registrado */ }
-    this.getData();
-  }
-
-  /**
-   * Obtiene el producto a mostrar:
-   * 1. Prioriza `history.state` (navegación con estado).
-   * 2. Si no está, intenta resolver por `id` en la URL:
-   *    - Busca en el store NGXS
-   *    - Si no existe, usa un mock de productos.
-   * Finalmente, carga los productos relacionados.
-   */
-  getData(): void{
-    if (!this.product) {
-      const nav = history.state as { product?: ProductoDTO; isLogin?: boolean };
-      if (nav?.product) {
-        this.product = nav.product;
-        this.isLogin = !!nav.isLogin;
-        this.loadRelatedProducts();
-        return;
-      }
-    }
-
-    const id = this.getProductIdFromRoute();
-    if (id) {
-      const productoFromStore = this.getFromStoreById(id);
-      if (productoFromStore) {
-        this.product = productoFromStore;
-        this.loadRelatedProducts();
-        return;
-      }
-
-      const mock = this.productSvc.mockProductosInflablesDTO();
-      this.product = mock.find(p => String(p.id) === String(id));
-      this.loadRelatedProducts();
-    }
-  }
-
-  /**
-   * Resuelve el `id` del producto desde diferentes ubicaciones en la ruta:
-   * - `paramMap`: `id` o `productId`
-   * - `queryParamMap`: `id`
-   * - Último segmento de la URL
-   */
-  private getProductIdFromRoute(): string | null {
-    let id = this.route.snapshot.paramMap.get('id');
-    if (id) return id;
-    id = this.route.snapshot.paramMap.get('productId');
-    if (id) return id;
-    id = this.route.snapshot.queryParamMap.get('id');
-    if (id) return id;
-    const urlSegs = this.route.snapshot.url;
-    if (urlSegs && urlSegs.length > 0) {
-      return urlSegs[urlSegs.length - 1].path || null;
-    }
-    return null;
-  }
-
-  /**
-   * Busca un producto por `id` en el store NGXS.
-   * @param id Identificador del producto
-   * @returns Producto si existe, `undefined` en caso contrario
-   */
-  private getFromStoreById(id: string): ProductoDTO | undefined {
-    try {
-      return this.store.selectSnapshot(ProductosState.selectById<ProductoDTO>(id));
-    } catch {
-      return undefined;
-    }
-  }
-
-  /**
-   * Construye la lista de productos relacionados por categoría.
-   * - Obtiene todos los productos desde el store o mock si está vacío.
-   * - Filtra por `idCategoria` y excluye el producto actual.
-   * - Enriquece los productos con `nombreCategoria` si es necesario.
-   */
-  private loadRelatedProducts(): void {
-    if (!this.product?.idCategoria) {
-      this.products = [];
-      return;
-    }
-    let allProducts = this.store.selectSnapshot(
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      (state: any) => (state?.producto?.dataList as ProductoDTO[]) || []
-    );
-    if (!allProducts || allProducts.length === 0) {
-      allProducts = this.productSvc.mockProductosInflablesDTO();
-    }
-    const idCat = String(this.product.idCategoria);
-    this.products = allProducts
-      .filter(p => String(p.idCategoria) === idCat)
-      .filter(p => String(p.id) !== String(this.product?.id));
-
-    const cats = this.getCategoriasFromStoreOrInputOrMock();
-    if (cats && cats.length) {
-      this.products = this.productSvc.addNameCategoriaToProducts(this.products, cats);
-    }
-  }
-
-  /**
-   * Obtiene categorías desde distintas fuentes (prioridad):
-   * 1. `@Input categorias`
-   * 2. Store NGXS (`categoriaproducto.dataList`)
-   * 3. Mock proporcionado por `ProductService`
-   */
-  private getCategoriasFromStoreOrInputOrMock(): CategoriaDTO[] {
-    if (this.categorias && this.categorias.length) return this.categorias;
-    try {
-      const fromStore = this.store.selectSnapshot(
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        (state: any) => (state?.categoriaproducto?.dataList as CategoriaDTO[]) || []
-      );
-      if (fromStore && fromStore.length) return fromStore;
-    } catch {
-      // ignorar y usar mock
-    }
-    return this.productSvc.mockCategoriaInflablesDTO();
-  }
-}

package/projects/lib-common-angular/src/lib/componentes/landingPages/pages/ecommerce1/register-ecommerce1/register-ecommerce1.html

@@ -1,11 +0,0 @@
-<div class="auth-page">
-    <section class="auth-section">
-        <lib-section-header-forms-login-ecomerce1 [titulo]="'Registro'" [subtitulo]="'Crea tu cuenta en segundos'"></lib-section-header-forms-login-ecomerce1>
-        <lib-form-auth-eccomerce1 [isRegistering]="true" [isLogout]="true"></lib-form-auth-eccomerce1>
-        <div class="auth-footer">
-            <p>¿Ya tienes una cuenta?
-                <button pButton type="button" label="Inicia sesión" class="p-button-text" [routerLink]="['login']"></button>
-            </p>
-        </div>
-    </section>
-</div>