tickera-angular-components 0.0.1-dev.166 → 0.0.1-dev.168

package/fesm2022/tickera-angular-components.mjs

@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
 import { InjectionToken, makeEnvironmentProviders, PLATFORM_ID, Inject, Injectable, signal, LOCALE_ID, computed, inject, EventEmitter, Input, Output, Component, ViewEncapsulation, HostListener, Self, Optional, Injector, forwardRef, effect, untracked, ViewChild } from '@angular/core';
 import * as i2 from '@jsverse/transloco';
 import { provideTransloco, TranslocoModule, TranslocoService } from '@jsverse/transloco';
-import { from, throwError, BehaviorSubject, Subject, of, takeUntil as takeUntil$1 } from 'rxjs';
+import { from, throwError, BehaviorSubject, Subject, of, Observable, takeUntil as takeUntil$1 } from 'rxjs';
 import * as i1$1 from '@angular/common';
 import { DATE_PIPE_DEFAULT_OPTIONS, isPlatformBrowser, formatDate, CommonModule, DatePipe } from '@angular/common';
 import { provideTippyLoader, provideTippyConfig, popperVariation, tooltipVariation } from '@ngneat/helipopper/config';
@@ -10,7 +10,7 @@ export * from '@ngneat/helipopper/config';
 import { TippyDirective } from '@ngneat/helipopper';
 export { TippyDirective } from '@ngneat/helipopper';
 import * as i1 from '@angular/common/http';
-import { HttpHeaders } from '@angular/common/http';
+import { HttpHeaders, HttpErrorResponse } from '@angular/common/http';
 import { catchError, map, tap, distinctUntilChanged, debounceTime, switchMap, takeUntil } from 'rxjs/operators';
 import { toast } from 'ngx-sonner';
 import { toObservable } from '@angular/core/rxjs-interop';
@@ -490,6 +490,13 @@ const ADMIN_API_ROUTES = {
     deleteOne: (id) => `/admins/${id}`,
 };
 
+const ADMISSION_API_ROUTES = {
+    join: (performanceId) => `/admission/${performanceId}/join`,
+    leave: (performanceId) => `/admission/${performanceId}/leave`,
+    status: (performanceId) => `/admission/${performanceId}/status`,
+    events: (performanceId) => `/admission/${performanceId}/events`,
+};
+
 const CITY_API_ENDPOINTS = {
     findAll: '/cities',
     create: '/cities',
@@ -530,6 +537,9 @@ const PERFORMANCES_API_ROUTES = {
     ticketQrToken: (uuid) => `/performances/tickets/${uuid}/qr-token`,
     getAvailableDays: '/performances/available-days',
     publicAvailablePerformances: '/public/performances/daily',
+    seatEventsTicket: (id) => `/performances/${id}/seat-events/ticket`,
+    seatEventsTicketAdmin: (id) => `/performances/${id}/seat-events/ticket/admin`,
+    seatEvents: (id) => `/performances/${id}/seat-events`,
 };
 
 const PRICE_ZONES_API_ROUTES = {
@@ -3515,6 +3525,11 @@ class PerformanceBookingDataService {
     _allRenderData = signal([], ...(ngDevMode ? [{ debugName: "_allRenderData" }] : []));
     _visibleFloorIds = signal(new Set(), ...(ngDevMode ? [{ debugName: "_visibleFloorIds" }] : []));
     _stageConfig = signal(DEFAULT_STAGE_CONFIG, ...(ngDevMode ? [{ debugName: "_stageConfig" }] : []));
+    // Snapshot de tickets tal como llegó del último `setPerformanceBookingData`,
+    // más los parches aplicados por `applySeatStatusUpdates` (SSE). Se guarda
+    // aparte de `_allRenderData` porque hace falta la lista completa de
+    // tickets para poder recalcular el render data con `processElementsToRenderData`.
+    _lastTickets = [];
     show = computed(() => this._show(), ...(ngDevMode ? [{ debugName: "show" }] : []));
     hallFloors = computed(() => this._hallFloors(), ...(ngDevMode ? [{ debugName: "hallFloors" }] : []));
     selectedHallFloor = computed(() => this._selectedHallFloor(), ...(ngDevMode ? [{ debugName: "selectedHallFloor" }] : []));
@@ -3539,6 +3554,7 @@ class PerformanceBookingDataService {
         this._show.set(data.show);
         const roomMap = data.room_map;
         this._roomMap.set(roomMap);
+        this._lastTickets = data.tickets ?? [];
         const hallFloors = data.room_map?.hall?.hall_floors ?? [];
         const selectedHallFloor = hallFloors.length > 0 ? hallFloors[0] : null;
         this._hallFloors.set(hallFloors);
@@ -3554,6 +3570,33 @@ class PerformanceBookingDataService {
             height: canvasSettings.height || 600,
         });
     }
+    /** Aplica actualizaciones de estado de tickets recibidas por SSE (ver
+     * SeatAvailabilitySseService) sin volver a pedir todo el booking-data:
+     * parcha `_lastTickets` y vuelve a calcular el render data del mapa con
+     * los mismos `elements`/`price_zones` (que no cambian en vivo). */
+    applySeatStatusUpdates(updates) {
+        if (!updates.length || !this._lastTickets.length)
+            return;
+        const roomMap = this._roomMap();
+        if (!roomMap)
+            return;
+        const updatesById = new Map(updates.map((u) => [u.id, u]));
+        let changed = false;
+        for (const ticket of this._lastTickets) {
+            const update = updatesById.get(ticket.id);
+            if (!update)
+                continue;
+            if (ticket.status !== update.status || ticket.reserved_until !== update.reserved_until) {
+                ticket.status = update.status;
+                ticket.reserved_until = update.reserved_until;
+                changed = true;
+            }
+        }
+        if (!changed)
+            return;
+        const renderData = processElementsToRenderData(roomMap.elements, this._lastTickets, roomMap.price_zones);
+        this._allRenderData.set(renderData);
+    }
     setRoomMap(roomMap) {
         this._roomMap.set(roomMap);
     }
@@ -3786,6 +3829,34 @@ class TicketSelectionService {
     setTickets(tickets) {
         this._allTickets.set(tickets);
     }
+    /** Aplica actualizaciones de estado recibidas por SSE (ver
+     * SeatAvailabilitySseService). Muta los tickets existentes EN VEZ de
+     * reemplazarlos por objetos nuevos: `_selectedTickets`/
+     * `_selectedBlockedTickets` son Sets de referencias de objeto, no de ids,
+     * así que reemplazar el array rompería la selección activa del usuario. */
+    applySeatStatusUpdates(updates) {
+        if (!updates.length)
+            return;
+        const updatesById = new Map(updates.map((u) => [u.id, u]));
+        const current = this._allTickets();
+        let changed = false;
+        for (const ticket of current) {
+            const update = updatesById.get(ticket.id);
+            if (!update)
+                continue;
+            if (ticket.status !== update.status || ticket.reserved_until !== update.reserved_until) {
+                ticket.status = update.status;
+                ticket.reserved_until = update.reserved_until;
+                changed = true;
+            }
+        }
+        if (changed) {
+            // Misma referencia de cada ticket, solo un array nuevo para disparar
+            // la señal (Angular signals compara por referencia del array, no
+            // hace deep-diff de su contenido).
+            this._allTickets.set([...current]);
+        }
+    }
     setProducts(products) {
         this._products.set(products);
     }
@@ -4325,6 +4396,304 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
             args: [{ providedIn: 'root' }]
         }] });
 
+const RECONNECT_BASE_DELAY_MS$1 = 1000;
+const RECONNECT_MAX_DELAY_MS$1 = 15000;
+/**
+ * Transporte SSE del estado de asientos en vivo. Es el único punto de la
+ * librería que sabe de EventSource/HTTP para esto — aplica cada snapshot
+ * recibido sobre PerformanceBookingDataService (repinta el mapa) y
+ * TicketSelectionService (mantiene la disponibilidad al día para
+ * validaciones de zona/límite de compra).
+ *
+ * Cada intento de reconexión pide un ticket NUEVO (el anterior es de un
+ * solo uso y expira a los ~30s), con backoff exponencial acotado.
+ */
+class SeatAvailabilitySseService {
+    apiService;
+    bookingDataService;
+    ticketSelectionService;
+    platformId;
+    config;
+    eventSource = null;
+    reconnectTimer = null;
+    reconnectAttempts = 0;
+    currentPerformanceId = null;
+    currentIsAdmin = false;
+    stopped = true;
+    constructor(apiService, bookingDataService, ticketSelectionService, platformId, config) {
+        this.apiService = apiService;
+        this.bookingDataService = bookingDataService;
+        this.ticketSelectionService = ticketSelectionService;
+        this.platformId = platformId;
+        this.config = config;
+    }
+    connect(performanceId, opts = {}) {
+        if (!isPlatformBrowser(this.platformId) || !performanceId)
+            return;
+        this.disconnect();
+        this.stopped = false;
+        this.currentPerformanceId = performanceId;
+        this.currentIsAdmin = !!opts.isAdmin;
+        this.reconnectAttempts = 0;
+        this.openConnection();
+    }
+    disconnect() {
+        this.stopped = true;
+        this.currentPerformanceId = null;
+        if (this.reconnectTimer) {
+            clearTimeout(this.reconnectTimer);
+            this.reconnectTimer = null;
+        }
+        this.eventSource?.close();
+        this.eventSource = null;
+    }
+    openConnection() {
+        const performanceId = this.currentPerformanceId;
+        if (!performanceId || this.stopped)
+            return;
+        const ticketRoute = this.currentIsAdmin
+            ? PERFORMANCES_API_ROUTES.seatEventsTicketAdmin(performanceId)
+            : PERFORMANCES_API_ROUTES.seatEventsTicket(performanceId);
+        this.apiService
+            .post(ticketRoute, {})
+            .subscribe({
+            next: (res) => this.startStream(performanceId, res?.data?.ticket),
+            error: () => this.scheduleReconnect(),
+        });
+    }
+    startStream(performanceId, ticket) {
+        if (!ticket || this.stopped || this.currentPerformanceId !== performanceId)
+            return;
+        const route = PERFORMANCES_API_ROUTES.seatEvents(performanceId);
+        const url = `${this.config.apiUrl}${route}?ticket=${encodeURIComponent(ticket)}`;
+        const eventSource = new EventSource(url);
+        this.eventSource = eventSource;
+        eventSource.onmessage = (event) => {
+            this.reconnectAttempts = 0;
+            try {
+                const message = JSON.parse(event.data);
+                if (message.type === 'snapshot') {
+                    this.bookingDataService.applySeatStatusUpdates(message.tickets);
+                    this.ticketSelectionService.applySeatStatusUpdates(message.tickets);
+                }
+                // 'heartbeat' solo mantiene viva la conexión a través de proxies, se ignora.
+            }
+            catch {
+                // Mensaje inválido: se ignora, el próximo snapshot vuelve a sincronizar todo.
+            }
+        };
+        eventSource.onerror = () => {
+            eventSource.close();
+            if (this.eventSource === eventSource)
+                this.eventSource = null;
+            this.scheduleReconnect();
+        };
+    }
+    scheduleReconnect() {
+        if (this.stopped || !this.currentPerformanceId)
+            return;
+        const delay = Math.min(RECONNECT_BASE_DELAY_MS$1 * Math.pow(2, this.reconnectAttempts), RECONNECT_MAX_DELAY_MS$1);
+        this.reconnectAttempts++;
+        this.reconnectTimer = setTimeout(() => {
+            this.reconnectTimer = null;
+            this.openConnection();
+        }, delay);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SeatAvailabilitySseService, deps: [{ token: ApiService }, { token: PerformanceBookingDataService }, { token: TicketSelectionService }, { token: PLATFORM_ID }, { token: TICKERA_COMPONENTS_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SeatAvailabilitySseService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SeatAvailabilitySseService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: ApiService }, { type: PerformanceBookingDataService }, { type: TicketSelectionService }, { type: Object, decorators: [{
+                    type: Inject,
+                    args: [PLATFORM_ID]
+                }] }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [TICKERA_COMPONENTS_CONFIG]
+                }] }] });
+
+const ADMISSION_MODAL_ID = 'admission-queue';
+const RECONNECT_BASE_DELAY_MS = 1000;
+const RECONNECT_MAX_DELAY_MS = 15000;
+/**
+ * Cliente de la cola adaptativa (fase 4). No decide CUÁNDO se activa la
+ * cola — eso es enteramente responsabilidad del backend (AdmissionGuard +
+ * LoadBasedAdmissionPolicy) — este servicio solo sabe reaccionar al 429
+ * `ADMISSION_QUEUE_REQUIRED` que ese guard puede devolver en
+ * /carts/reserve y /orders/checkout.
+ *
+ * Uso típico en el punto de llamada (ver reservation-confirmation y
+ * checkout-form): reintentar la request original dentro de un catchError:
+ *
+ *   this.cartService.reserve(dto).pipe(
+ *     catchError((err) => {
+ *       if (!this.admissionQueueService.isAdmissionRequired(err)) return throwError(() => err);
+ *       const performanceId = this.admissionQueueService.getPerformanceId(err)!;
+ *       return this.admissionQueueService.waitForAdmission(performanceId).pipe(
+ *         switchMap(() => this.cartService.reserve(dto)),
+ *       );
+ *     }),
+ *   )
+ *
+ * Reutiliza el mismo transporte SSE con ticket de un solo uso de la fase 3
+ * (ver SeatAvailabilitySseService) — acá el ticket llega directo en la
+ * respuesta de /join, así que no hace falta un endpoint de ticket aparte;
+ * cada reintento de conexión vuelve a hacer /join (el ticket anterior es
+ * de un solo uso y expira a los ~30s).
+ */
+class AdmissionQueueService {
+    apiService;
+    feedbackModalService;
+    platformId;
+    config;
+    constructor(apiService, feedbackModalService, platformId, config) {
+        this.apiService = apiService;
+        this.feedbackModalService = feedbackModalService;
+        this.platformId = platformId;
+        this.config = config;
+    }
+    /** True si el error es el 429 específico de "alta demanda, únete a la fila". */
+    isAdmissionRequired(error) {
+        return (error instanceof HttpErrorResponse &&
+            error.status === 429 &&
+            error.error?.error?.code === 'ADMISSION_QUEUE_REQUIRED');
+    }
+    getPerformanceId(error) {
+        const id = error.error?.error?.performance_id;
+        return typeof id === 'number' ? id : null;
+    }
+    /**
+     * Se une a la fila de `performanceId` y completa (emite una vez y cierra)
+     * en cuanto el usuario queda admitido. Mientras espera, muestra un modal
+     * ligero con la posición vigente, actualizado por SSE. Si quien se
+     * suscribió se desuscribe antes de ser admitido (el usuario navega a
+     * otro lado, cierra el modal, o el componente se destruye), libera el
+     * lugar en la fila con /leave.
+     */
+    waitForAdmission(performanceId) {
+        return new Observable((subscriber) => {
+            if (!isPlatformBrowser(this.platformId)) {
+                subscriber.complete();
+                return;
+            }
+            let eventSource = null;
+            let reconnectTimer = null;
+            let reconnectAttempts = 0;
+            let settled = false;
+            let joined = false;
+            const closeStream = () => {
+                if (reconnectTimer) {
+                    clearTimeout(reconnectTimer);
+                    reconnectTimer = null;
+                }
+                eventSource?.close();
+                eventSource = null;
+            };
+            const showWaitingModal = (position) => {
+                this.feedbackModalService.addModal({
+                    id: ADMISSION_MODAL_ID,
+                    type: 'loading',
+                    title: 'Hay mucha demanda en este momento',
+                    message: position && position > 0
+                        ? `Estás en la fila, posición ${position}. Te avisamos apenas te toque.`
+                        : 'Estamos verificando tu turno, espera un momento…',
+                    isOpen: signal(true),
+                    showCloseButton: false,
+                    showHeader: false,
+                });
+            };
+            const finish = () => {
+                if (settled)
+                    return;
+                settled = true;
+                closeStream();
+                this.feedbackModalService.removeModal(ADMISSION_MODAL_ID);
+                subscriber.next();
+                subscriber.complete();
+            };
+            const scheduleReconnect = () => {
+                if (settled)
+                    return;
+                const delay = Math.min(RECONNECT_BASE_DELAY_MS * Math.pow(2, reconnectAttempts), RECONNECT_MAX_DELAY_MS);
+                reconnectAttempts++;
+                reconnectTimer = setTimeout(() => {
+                    reconnectTimer = null;
+                    doJoin();
+                }, delay);
+            };
+            const startStream = (ticket) => {
+                if (settled)
+                    return;
+                const route = ADMISSION_API_ROUTES.events(performanceId);
+                const url = `${this.config.apiUrl}${route}?ticket=${encodeURIComponent(ticket)}`;
+                const es = new EventSource(url);
+                eventSource = es;
+                es.onmessage = (event) => {
+                    reconnectAttempts = 0;
+                    try {
+                        const message = JSON.parse(event.data);
+                        if (message.type !== 'status')
+                            return;
+                        if (message.active) {
+                            finish();
+                            return;
+                        }
+                        showWaitingModal(message.position);
+                    }
+                    catch {
+                        // Mensaje inválido: se ignora, el próximo evento vuelve a sincronizar.
+                    }
+                };
+                es.onerror = () => {
+                    es.close();
+                    if (eventSource === es)
+                        eventSource = null;
+                    scheduleReconnect();
+                };
+            };
+            const doJoin = () => {
+                this.apiService
+                    .post(ADMISSION_API_ROUTES.join(performanceId), {})
+                    .subscribe({
+                    next: (res) => {
+                        joined = true;
+                        if (res.active) {
+                            finish();
+                            return;
+                        }
+                        showWaitingModal(res.position);
+                        startStream(res.ticket);
+                    },
+                    error: () => scheduleReconnect(),
+                });
+            };
+            doJoin();
+            return () => {
+                if (settled)
+                    return;
+                closeStream();
+                this.feedbackModalService.removeModal(ADMISSION_MODAL_ID);
+                if (joined) {
+                    this.apiService.post(ADMISSION_API_ROUTES.leave(performanceId), {}).subscribe({ error: () => { } });
+                }
+            };
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdmissionQueueService, deps: [{ token: ApiService }, { token: FeedbackModalService }, { token: PLATFORM_ID }, { token: TICKERA_COMPONENTS_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdmissionQueueService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdmissionQueueService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: ApiService }, { type: FeedbackModalService }, { type: Object, decorators: [{
+                    type: Inject,
+                    args: [PLATFORM_ID]
+                }] }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [TICKERA_COMPONENTS_CONFIG]
+                }] }] });
+
 class TicketQrService {
     apiService;
     constructor(apiService) {
@@ -9221,11 +9590,11 @@ class SeatSelectionSummaryItemComponent {
         this.selectionService.deselect(ticket);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SeatSelectionSummaryItemComponent, deps: [{ token: TicketSelectionService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SeatSelectionSummaryItemComponent, isStandalone: true, selector: "seat-selection-summary-item", inputs: { item: "item" }, ngImport: i0, template: "<div class=\"seat-selection-summary-item\">\n  <div class=\"seat-selection-summary-item__icon\">\n    {{ getItemTypeIcon(item) }}\n  </div>\n\n  <div class=\"seat-selection-summary-item__content\">\n    <div class=\"seat-selection-summary-item__content-label\">{{ item.seat_label }}</div>\n\n    <div class=\"seat-selection-summary-item__content-price\">\n      ${{ item.normal_price | number: '1.0' }}\n    </div>\n  </div>\n\n  <div class=\"seat-selection-summary-item__actions\">\n    @if (isZone) {\n      <number-input\n        name=\"zone-quantity\"\n        [ngModel]=\"item.element_qty ?? 1\"\n        (ngModelChange)=\"onZoneQuantityChange($event)\"\n        [min]=\"0\"\n        [max]=\"zoneMax\"\n        [step]=\"1\"\n        fieldGroupClass=\"seat-selection-summary-item__qty-input\"\n      />\n    }\n\n    <app-button\n      variant=\"transparent\"\n      size=\"xs\"\n      text=\"\"\n      icon=\"ri-close-line\"\n      (clicked)=\"removeItem(item)\"\n    />\n  </div>\n</div>\n", styles: [".seat-selection-summary-item{align-items:center;display:flex;flex-flow:row nowrap;gap:.75rem;justify-content:flex-start;border-bottom:1px solid #e5e7eb;padding:.75rem 0;transition:background-color .2s ease}.seat-selection-summary-item:last-child{border-bottom:none}.seat-selection-summary-item:hover{background-color:#f9fafb}.seat-selection-summary-item__icon{align-items:center;border:1px solid #e5e7eb;border-radius:.25rem;display:flex;font-size:1.5rem;height:44px;justify-content:center;padding:.25rem;width:44px}.seat-selection-summary-item__content{display:flex;flex-direction:column;gap:.25rem}.seat-selection-summary-item__content-label{font-size:.75rem;font-weight:500;color:#6b7280}.seat-selection-summary-item__content-price{font-size:.875rem;font-weight:600;color:#111827}.seat-selection-summary-item__content-quantity{font-size:.75rem;color:#6b7280}.seat-selection-summary-item__actions{display:flex;align-items:center;gap:.5rem;margin-left:auto}.seat-selection-summary-item__qty-input{margin-right:.25rem;width:6.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: NumberInputComponent, selector: "number-input", inputs: ["label", "name", "id", "placeholder", "required", "readonly", "min", "max", "step", "fieldGroupClass"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SeatSelectionSummaryItemComponent, isStandalone: true, selector: "seat-selection-summary-item", inputs: { item: "item" }, ngImport: i0, template: "<div class=\"seat-selection-summary-item\">\n  <div class=\"seat-selection-summary-item__icon\">\n    {{ getItemTypeIcon(item) }}\n  </div>\n\n  <div class=\"seat-selection-summary-item__content\">\n    <div class=\"seat-selection-summary-item__content-label\">{{ item.seat_label }}</div>\n\n    <div class=\"seat-selection-summary-item__content-price\">\n      ${{ item.normal_price | number: '1.0' }}\n    </div>\n  </div>\n\n  <div class=\"seat-selection-summary-item__actions\">\n    @if (isZone) {\n      <number-input\n        name=\"zone-quantity\"\n        [ngModel]=\"item.element_qty ?? 1\"\n        (ngModelChange)=\"onZoneQuantityChange($event)\"\n        [min]=\"0\"\n        [max]=\"zoneMax\"\n        [step]=\"1\"\n        fieldGroupClass=\"seat-selection-summary-item__qty-input\"\n      />\n    } @else {\n      <app-button\n        variant=\"transparent\"\n        size=\"xs\"\n        text=\"\"\n        icon=\"ri-close-line\"\n        (clicked)=\"removeItem(item)\"\n      />\n    }\n  </div>\n</div>\n", styles: [".seat-selection-summary-item{align-items:center;display:flex;flex-flow:row nowrap;gap:.75rem;justify-content:flex-start;border-bottom:1px solid #e5e7eb;padding:.75rem 0;transition:background-color .2s ease}.seat-selection-summary-item:last-child{border-bottom:none}.seat-selection-summary-item:hover{background-color:#f9fafb}.seat-selection-summary-item__icon{align-items:center;border:1px solid #e5e7eb;border-radius:.25rem;display:flex;font-size:1.5rem;height:44px;justify-content:center;padding:.25rem;width:44px}.seat-selection-summary-item__content{display:flex;flex-direction:column;gap:.25rem}.seat-selection-summary-item__content-label{font-size:.75rem;font-weight:500;color:#6b7280}.seat-selection-summary-item__content-price{font-size:.875rem;font-weight:600;color:#111827}.seat-selection-summary-item__content-quantity{font-size:.75rem;color:#6b7280}.seat-selection-summary-item__actions{display:flex;align-items:center;gap:.5rem;margin-left:auto}.seat-selection-summary-item__qty-input{margin-right:.25rem;width:6.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: NumberInputComponent, selector: "number-input", inputs: ["label", "name", "id", "placeholder", "required", "readonly", "min", "max", "step", "fieldGroupClass"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SeatSelectionSummaryItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'seat-selection-summary-item', standalone: true, imports: [CommonModule, FormsModule, AppButtonComponent, NumberInputComponent], template: "<div class=\"seat-selection-summary-item\">\n  <div class=\"seat-selection-summary-item__icon\">\n    {{ getItemTypeIcon(item) }}\n  </div>\n\n  <div class=\"seat-selection-summary-item__content\">\n    <div class=\"seat-selection-summary-item__content-label\">{{ item.seat_label }}</div>\n\n    <div class=\"seat-selection-summary-item__content-price\">\n      ${{ item.normal_price | number: '1.0' }}\n    </div>\n  </div>\n\n  <div class=\"seat-selection-summary-item__actions\">\n    @if (isZone) {\n      <number-input\n        name=\"zone-quantity\"\n        [ngModel]=\"item.element_qty ?? 1\"\n        (ngModelChange)=\"onZoneQuantityChange($event)\"\n        [min]=\"0\"\n        [max]=\"zoneMax\"\n        [step]=\"1\"\n        fieldGroupClass=\"seat-selection-summary-item__qty-input\"\n      />\n    }\n\n    <app-button\n      variant=\"transparent\"\n      size=\"xs\"\n      text=\"\"\n      icon=\"ri-close-line\"\n      (clicked)=\"removeItem(item)\"\n    />\n  </div>\n</div>\n", styles: [".seat-selection-summary-item{align-items:center;display:flex;flex-flow:row nowrap;gap:.75rem;justify-content:flex-start;border-bottom:1px solid #e5e7eb;padding:.75rem 0;transition:background-color .2s ease}.seat-selection-summary-item:last-child{border-bottom:none}.seat-selection-summary-item:hover{background-color:#f9fafb}.seat-selection-summary-item__icon{align-items:center;border:1px solid #e5e7eb;border-radius:.25rem;display:flex;font-size:1.5rem;height:44px;justify-content:center;padding:.25rem;width:44px}.seat-selection-summary-item__content{display:flex;flex-direction:column;gap:.25rem}.seat-selection-summary-item__content-label{font-size:.75rem;font-weight:500;color:#6b7280}.seat-selection-summary-item__content-price{font-size:.875rem;font-weight:600;color:#111827}.seat-selection-summary-item__content-quantity{font-size:.75rem;color:#6b7280}.seat-selection-summary-item__actions{display:flex;align-items:center;gap:.5rem;margin-left:auto}.seat-selection-summary-item__qty-input{margin-right:.25rem;width:6.5rem}\n"] }]
+            args: [{ selector: 'seat-selection-summary-item', standalone: true, imports: [CommonModule, FormsModule, AppButtonComponent, NumberInputComponent], template: "<div class=\"seat-selection-summary-item\">\n  <div class=\"seat-selection-summary-item__icon\">\n    {{ getItemTypeIcon(item) }}\n  </div>\n\n  <div class=\"seat-selection-summary-item__content\">\n    <div class=\"seat-selection-summary-item__content-label\">{{ item.seat_label }}</div>\n\n    <div class=\"seat-selection-summary-item__content-price\">\n      ${{ item.normal_price | number: '1.0' }}\n    </div>\n  </div>\n\n  <div class=\"seat-selection-summary-item__actions\">\n    @if (isZone) {\n      <number-input\n        name=\"zone-quantity\"\n        [ngModel]=\"item.element_qty ?? 1\"\n        (ngModelChange)=\"onZoneQuantityChange($event)\"\n        [min]=\"0\"\n        [max]=\"zoneMax\"\n        [step]=\"1\"\n        fieldGroupClass=\"seat-selection-summary-item__qty-input\"\n      />\n    } @else {\n      <app-button\n        variant=\"transparent\"\n        size=\"xs\"\n        text=\"\"\n        icon=\"ri-close-line\"\n        (clicked)=\"removeItem(item)\"\n      />\n    }\n  </div>\n</div>\n", styles: [".seat-selection-summary-item{align-items:center;display:flex;flex-flow:row nowrap;gap:.75rem;justify-content:flex-start;border-bottom:1px solid #e5e7eb;padding:.75rem 0;transition:background-color .2s ease}.seat-selection-summary-item:last-child{border-bottom:none}.seat-selection-summary-item:hover{background-color:#f9fafb}.seat-selection-summary-item__icon{align-items:center;border:1px solid #e5e7eb;border-radius:.25rem;display:flex;font-size:1.5rem;height:44px;justify-content:center;padding:.25rem;width:44px}.seat-selection-summary-item__content{display:flex;flex-direction:column;gap:.25rem}.seat-selection-summary-item__content-label{font-size:.75rem;font-weight:500;color:#6b7280}.seat-selection-summary-item__content-price{font-size:.875rem;font-weight:600;color:#111827}.seat-selection-summary-item__content-quantity{font-size:.75rem;color:#6b7280}.seat-selection-summary-item__actions{display:flex;align-items:center;gap:.5rem;margin-left:auto}.seat-selection-summary-item__qty-input{margin-right:.25rem;width:6.5rem}\n"] }]
         }], ctorParameters: () => [{ type: TicketSelectionService }], propDecorators: { item: [{
                 type: Input,
                 args: [{ required: true }]
@@ -10016,5 +10385,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ADMIN_API_ROUTES, ALERT_ICONS, AdminSelectComponent, AdminService, ApiService, AppAlertComponent, AppBadgeComponent, AppBreadcumbComponent, AppButtonComponent, AppLinkButtonComponent, AppModalComponent, AsyncSelectComponent, AuditInformationComponent, BASE_BUTTON_CLASSES, BASE_INPUT_CLASSES, BUTTON_SIZES_CLASSES, BUTTON_VARIANT_CLASSES, BaseModalService, CITY_API_ENDPOINTS, COUNTRY_API_ENDPOINTS, CUSTOMERS_API_ROUTES, ChangePasswordFormComponent, ChangePasswordFormService, CitiesService, CitySelectComponent, ColorPickerComponent, ConfirmationOrderModalComponent, ConfirmationOrderModalService, CorporateBondStatus, CountrySelectComponent, CountryService, CouponApplicability, CouponDiscountType, CouponStatus, CreatorType, CustomerSelectComponent, CustomerService, DEFAULT_STAGE_CONFIG, DOCUMENT_TYPES_OPTIONS, DateInputComponent, DateService, DaySelectorGridComponent, DeleteConfirmationComponent, DeleteConfirmationService, DynamicTableComponent, ERROR_INPUT_CLASSES, EndDateGreaterThanStartValidator, FORM_ERROR_MESSAGES, FeedbackModalComponent, FeedbackModalService, FileType, FileUploadComponent, FileUploadPreviewComponent, FormEditorComponent, FormInputComponent, FormSelectComponent, FormTextareaComponent, GiftBondPurchaseStatus, GiftBondStatus, KONVA_SHAPE_MAPPINGS, LanguageSwitcherComponent, MembershipStatus, MinTodayValidator, MustMatchValidator, NumberInputComponent, ORDER_DISCOUNT_COLORS, ORDER_ITEM_TYPES_COLORS, ORDER_STATUS_COLORS, OrderBillingInfoComponent, OrderDiscountAppliedComponent, OrderInformationComponent, OrderItemType, OrderItemTypeBadgeComponent, OrderItemsComponent, OrderStatus, OrderStatusBadgeComponent, OrderTransactionDetailsModalComponent, OrderTransactionDetailsModalService, OrderTransactionsComponent, PAYMENT_METHODS_OPTIONS, PERFORMANCES_API_ROUTES, PERFORMANCE_STATUS_COLORS, PERFORMANCE_TICKET_STATUS_COLORS, PHONE_COUNTRIES, PRICE_ZONES_API_ROUTES, PRODUCTS_API_ROUTES, PRODUCT_CATEGORIES_API_ROUTES, PRODUCT_TAGS_API_ROUTES, PRODUCT_TYPES_API_ROUTES, PaymentMethod, PerformanceBookingDataService, PerformanceCardComponent, PerformanceCardListComponent, PerformanceMultiSelectComponent, PerformanceSelectComponent, PerformanceService, PerformanceStatus, PerformanceStatusBadgeComponent, PerformanceStepperComponent, PerformanceTicketMapComponent, PerformanceTicketStatus, PerformanceTicketStatusBadgeComponent, PerformancesListEventsService, PhoneInputComponent, PriceZoneEventService, PriceZoneFormModalService, PriceZoneSelectComponent, PriceZoneService, ProductCategoryService, ProductMultiSelectComponent, ProductSelectComponent, ProductService, ProductTagService, ProductTypeService, PurchaseLimitService, RoomMapElementOrientation, RoomMapElementType, SHOWS_API_ROUTES, SHOW_TYPE_COLORS, STATE_API_ENDPOINTS, SeatSelectionEmptySummaryComponent, SeatSelectionSummaryComponent, SeatSelectionSummaryItemComponent, SelectedDiscountCardType, ShowCardComponent, ShowCardSkeletonComponent, ShowMultiSelectComponent, ShowSelectComponent, ShowService, ShowType, ShowTypeBadgeComponent, ShowsFilterComponent, StateSelectComponent, StatesService, TICKERA_COMPONENTS_CONFIG, TICKET_ELEMENT_TYPES, TICKET_MAP_GRID_SIZE, TICKET_MAP_LAST_TICKETS_LIMIT, TICKET_MAP_TITLE_HEIGHT, TICKET_STATUS_COLORS, TICKET_STATUS_FILLS, TICKET_STATUS_LABELS, TIcketMapProductSelectionComponent, TRANSACTION_STATUS_COLORS, TextExpandableComponent, TickeraTranslocoLoader, TicketMapFloorSelectorComponent, TicketMapPriceZonesComponent, TicketMapProductSelectionItemComponent, TicketMapTotalsComponent, TicketMapWidgetComponent, TicketMapWidgetHeaderComponent, TicketMapWrapperComponent, TicketMapZoomControlsComponent, TicketMapZoomService, TicketQrComponent, TicketQrModalComponent, TicketQrModalService, TicketQrService, TicketSelectionDetailsService, TicketSelectionDiscountService, TicketSelectionService, TicketSelectionTotalsService, ToastService, ToggleSwitchComponent, TransactionStatus, VENUES_API_ROUTES, VIP_CARDS_API_ROUTES, VipBalanceCardComponent, VipCardService, VipCardStatus, VipCardStatusBadgeComponent, VipRechargeModalComponent, VipTransactionType, VipTransactionsTableComponent, ZonePriceItemComponent, ZonePriceListComponent, authInterceptor, drawChairIcon$1 as drawChairIcon, drawHappyFace, drawRoundedRect, drawWheelchairIcon, emailValidator, findElementAtPosition, findTicketAtPosition, formatCitiesResponseToSelect, generateExitScene, generateHallwayScene, generateProductionAreaScene, generateSeatBlockScene, generateSeatBlockTicketScene, generateStageScene, generateStairScene, generateTableScene, generateTableTicketScene, generateUnavailableSpaceScene, generateZoneScene, getBrowserLanguage, getCustomerFullname, getItemTypeIcon, getOrderDiscount, getStoredLanguage, numberToLetter$1 as numberToLetter, parseJsonToFormDataAdvanced, phoneCountryFlag, processElementsToRenderData, provideTickeraComponents, resolveLanguage, setStoredLanguage, ticketCanOpenQr, tintColor, transformImageToFile, transformUrlParams };
+export { ADMIN_API_ROUTES, ADMISSION_API_ROUTES, ALERT_ICONS, AdminSelectComponent, AdminService, AdmissionQueueService, ApiService, AppAlertComponent, AppBadgeComponent, AppBreadcumbComponent, AppButtonComponent, AppLinkButtonComponent, AppModalComponent, AsyncSelectComponent, AuditInformationComponent, BASE_BUTTON_CLASSES, BASE_INPUT_CLASSES, BUTTON_SIZES_CLASSES, BUTTON_VARIANT_CLASSES, BaseModalService, CITY_API_ENDPOINTS, COUNTRY_API_ENDPOINTS, CUSTOMERS_API_ROUTES, ChangePasswordFormComponent, ChangePasswordFormService, CitiesService, CitySelectComponent, ColorPickerComponent, ConfirmationOrderModalComponent, ConfirmationOrderModalService, CorporateBondStatus, CountrySelectComponent, CountryService, CouponApplicability, CouponDiscountType, CouponStatus, CreatorType, CustomerSelectComponent, CustomerService, DEFAULT_STAGE_CONFIG, DOCUMENT_TYPES_OPTIONS, DateInputComponent, DateService, DaySelectorGridComponent, DeleteConfirmationComponent, DeleteConfirmationService, DynamicTableComponent, ERROR_INPUT_CLASSES, EndDateGreaterThanStartValidator, FORM_ERROR_MESSAGES, FeedbackModalComponent, FeedbackModalService, FileType, FileUploadComponent, FileUploadPreviewComponent, FormEditorComponent, FormInputComponent, FormSelectComponent, FormTextareaComponent, GiftBondPurchaseStatus, GiftBondStatus, KONVA_SHAPE_MAPPINGS, LanguageSwitcherComponent, MembershipStatus, MinTodayValidator, MustMatchValidator, NumberInputComponent, ORDER_DISCOUNT_COLORS, ORDER_ITEM_TYPES_COLORS, ORDER_STATUS_COLORS, OrderBillingInfoComponent, OrderDiscountAppliedComponent, OrderInformationComponent, OrderItemType, OrderItemTypeBadgeComponent, OrderItemsComponent, OrderStatus, OrderStatusBadgeComponent, OrderTransactionDetailsModalComponent, OrderTransactionDetailsModalService, OrderTransactionsComponent, PAYMENT_METHODS_OPTIONS, PERFORMANCES_API_ROUTES, PERFORMANCE_STATUS_COLORS, PERFORMANCE_TICKET_STATUS_COLORS, PHONE_COUNTRIES, PRICE_ZONES_API_ROUTES, PRODUCTS_API_ROUTES, PRODUCT_CATEGORIES_API_ROUTES, PRODUCT_TAGS_API_ROUTES, PRODUCT_TYPES_API_ROUTES, PaymentMethod, PerformanceBookingDataService, PerformanceCardComponent, PerformanceCardListComponent, PerformanceMultiSelectComponent, PerformanceSelectComponent, PerformanceService, PerformanceStatus, PerformanceStatusBadgeComponent, PerformanceStepperComponent, PerformanceTicketMapComponent, PerformanceTicketStatus, PerformanceTicketStatusBadgeComponent, PerformancesListEventsService, PhoneInputComponent, PriceZoneEventService, PriceZoneFormModalService, PriceZoneSelectComponent, PriceZoneService, ProductCategoryService, ProductMultiSelectComponent, ProductSelectComponent, ProductService, ProductTagService, ProductTypeService, PurchaseLimitService, RoomMapElementOrientation, RoomMapElementType, SHOWS_API_ROUTES, SHOW_TYPE_COLORS, STATE_API_ENDPOINTS, SeatAvailabilitySseService, SeatSelectionEmptySummaryComponent, SeatSelectionSummaryComponent, SeatSelectionSummaryItemComponent, SelectedDiscountCardType, ShowCardComponent, ShowCardSkeletonComponent, ShowMultiSelectComponent, ShowSelectComponent, ShowService, ShowType, ShowTypeBadgeComponent, ShowsFilterComponent, StateSelectComponent, StatesService, TICKERA_COMPONENTS_CONFIG, TICKET_ELEMENT_TYPES, TICKET_MAP_GRID_SIZE, TICKET_MAP_LAST_TICKETS_LIMIT, TICKET_MAP_TITLE_HEIGHT, TICKET_STATUS_COLORS, TICKET_STATUS_FILLS, TICKET_STATUS_LABELS, TIcketMapProductSelectionComponent, TRANSACTION_STATUS_COLORS, TextExpandableComponent, TickeraTranslocoLoader, TicketMapFloorSelectorComponent, TicketMapPriceZonesComponent, TicketMapProductSelectionItemComponent, TicketMapTotalsComponent, TicketMapWidgetComponent, TicketMapWidgetHeaderComponent, TicketMapWrapperComponent, TicketMapZoomControlsComponent, TicketMapZoomService, TicketQrComponent, TicketQrModalComponent, TicketQrModalService, TicketQrService, TicketSelectionDetailsService, TicketSelectionDiscountService, TicketSelectionService, TicketSelectionTotalsService, ToastService, ToggleSwitchComponent, TransactionStatus, VENUES_API_ROUTES, VIP_CARDS_API_ROUTES, VipBalanceCardComponent, VipCardService, VipCardStatus, VipCardStatusBadgeComponent, VipRechargeModalComponent, VipTransactionType, VipTransactionsTableComponent, ZonePriceItemComponent, ZonePriceListComponent, authInterceptor, drawChairIcon$1 as drawChairIcon, drawHappyFace, drawRoundedRect, drawWheelchairIcon, emailValidator, findElementAtPosition, findTicketAtPosition, formatCitiesResponseToSelect, generateExitScene, generateHallwayScene, generateProductionAreaScene, generateSeatBlockScene, generateSeatBlockTicketScene, generateStageScene, generateStairScene, generateTableScene, generateTableTicketScene, generateUnavailableSpaceScene, generateZoneScene, getBrowserLanguage, getCustomerFullname, getItemTypeIcon, getOrderDiscount, getStoredLanguage, numberToLetter$1 as numberToLetter, parseJsonToFormDataAdvanced, phoneCountryFlag, processElementsToRenderData, provideTickeraComponents, resolveLanguage, setStoredLanguage, ticketCanOpenQr, tintColor, transformImageToFile, transformUrlParams };
 //# sourceMappingURL=tickera-angular-components.mjs.map