valtech-components 4.0.150 → 4.0.152

package/fesm2022/valtech-components.mjs

@@ -56,7 +56,7 @@ import { BrowserMultiFormatReader } from '@zxing/browser';
  * Current version of valtech-components.
  * This is automatically updated during the publish process.
  */
-const VERSION = '4.0.150';
+const VERSION = '4.0.152';
 
 // Control de estado de refresco (singleton a nivel de módulo)
 let isRefreshing = false;
@@ -1789,6 +1789,7 @@ class ToastService {
             duration: request.duration,
             position: request.position ?? 'top',
             color: request.color ?? 'dark',
+            buttons: request.buttons,
         });
         await toast.present();
     }
@@ -1883,7 +1884,7 @@ class ValtechErrorService {
      */
     handle(err, opts = {}) {
         const interpreted = interpretError(err);
-        const { context, i18nMap, fallbackKey, i18nNamespace, toast } = opts;
+        const { context, i18nMap, fallbackKey, i18nNamespace, toast, showOperationId } = opts;
         // 1. Observabilidad — log estructurado a consola.
         console.error('[ValtechError] handled', {
             context: context ?? 'n/a',
@@ -1917,11 +1918,23 @@ class ValtechErrorService {
         });
         // 4. Toast (estándar Valtech: color 'dark', position 'top').
         if (toast !== false) {
+            const opId = showOperationId ? interpreted.operationId : undefined;
             this.toast.show({
                 message,
                 color: 'dark',
                 position: 'top',
-                duration: 3000,
+                // Más tiempo cuando hay botón de copia — el usuario necesita leerlo y tapear.
+                duration: opId ? 6000 : 3000,
+                buttons: opId
+                    ? [
+                        {
+                            text: 'Copiar ID',
+                            handler: () => {
+                                void navigator.clipboard.writeText(opId);
+                            },
+                        },
+                    ]
+                    : undefined,
             });
         }
         // 5. Devolver el error normalizado para lógica extra del caller.
@@ -60059,18 +60072,18 @@ class PageContentComponent {
           '--background': getBackground(),
         }"
       >
-        <!-- Pull-to-refresh: visible solo si la página activa registró un handler
-             vía PageRefreshService (connectPageRefresh). ion-refresher slot="fixed"
-             DEBE ser hijo directo de ion-content. Mismo patrón que val-page-wrapper,
-             para que las vistas públicas (seller, buy, live) también lo tengan. -->
-        @if (pageRefresh.hasHandler()) {
-          <ion-refresher slot="fixed" (ionRefresh)="onPageRefresh($event)">
-            <ion-refresher-content
-              pullingIcon="chevron-down-circle-outline"
-              refreshingSpinner="circular"
-            ></ion-refresher-content>
-          </ion-refresher>
-        }
+        <!-- Pull-to-refresh para las vistas públicas (seller, buy, live) que usan
+             val-page-content y llaman connectPageRefresh. El ion-refresher SIEMPRE
+             está en el DOM (hijo directo de ion-content) para que Ionic lo enganche
+             en la init del scroll; se HABILITA solo cuando hay handler registrado.
+             Con @if el refresher aparecía tarde (contenido proyectado vía ng-content,
+             no router-outlet) y Ionic no lo reconocía → el gesto no disparaba. -->
+        <ion-refresher slot="fixed" [disabled]="!pageRefresh.hasHandler()" (ionRefresh)="onPageRefresh($event)">
+          <ion-refresher-content
+            pullingIcon="chevron-down-circle-outline"
+            refreshingSpinner="circular"
+          ></ion-refresher-content>
+        </ion-refresher>
         @if (showUpdateBanner) {
           <val-update-banner />
         }
@@ -60096,18 +60109,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
           '--background': getBackground(),
         }"
       >
-        <!-- Pull-to-refresh: visible solo si la página activa registró un handler
-             vía PageRefreshService (connectPageRefresh). ion-refresher slot="fixed"
-             DEBE ser hijo directo de ion-content. Mismo patrón que val-page-wrapper,
-             para que las vistas públicas (seller, buy, live) también lo tengan. -->
-        @if (pageRefresh.hasHandler()) {
-          <ion-refresher slot="fixed" (ionRefresh)="onPageRefresh($event)">
-            <ion-refresher-content
-              pullingIcon="chevron-down-circle-outline"
-              refreshingSpinner="circular"
-            ></ion-refresher-content>
-          </ion-refresher>
-        }
+        <!-- Pull-to-refresh para las vistas públicas (seller, buy, live) que usan
+             val-page-content y llaman connectPageRefresh. El ion-refresher SIEMPRE
+             está en el DOM (hijo directo de ion-content) para que Ionic lo enganche
+             en la init del scroll; se HABILITA solo cuando hay handler registrado.
+             Con @if el refresher aparecía tarde (contenido proyectado vía ng-content,
+             no router-outlet) y Ionic no lo reconocía → el gesto no disparaba. -->
+        <ion-refresher slot="fixed" [disabled]="!pageRefresh.hasHandler()" (ionRefresh)="onPageRefresh($event)">
+          <ion-refresher-content
+            pullingIcon="chevron-down-circle-outline"
+            refreshingSpinner="circular"
+          ></ion-refresher-content>
+        </ion-refresher>
         @if (showUpdateBanner) {
           <val-update-banner />
         }
@@ -69934,20 +69947,24 @@ class TicketCardComponent {
         }
       </div>
 
-      @if (props().showDownload && qr()) {
-        <ion-button fill="clear" size="small" [disabled]="downloading()" (click)="downloadCard()">
-          <ion-icon name="download-outline" slot="start" />
-          {{ props().downloadLabel || t('download') }}
-        </ion-button>
-      }
-      @if (props().showShare && qr()) {
-        <ion-button fill="clear" size="small" [disabled]="sharing()" (click)="shareCard()">
-          <ion-icon name="share-outline" slot="start" />
-          {{ props().shareLabel || t('share') }}
-        </ion-button>
+      @if ((props().showDownload || props().showShare) && qr()) {
+        <div class="ticket-card__actions">
+          @if (props().showDownload) {
+            <ion-button fill="outline" expand="block" [disabled]="downloading()" (click)="downloadCard()">
+              <ion-icon name="download-outline" slot="start" />
+              {{ props().downloadLabel || t('download') }}
+            </ion-button>
+          }
+          @if (props().showShare) {
+            <ion-button fill="outline" expand="block" [disabled]="sharing()" (click)="shareCard()">
+              <ion-icon name="share-outline" slot="start" />
+              {{ props().shareLabel || t('share') }}
+            </ion-button>
+          }
+        </div>
       }
     </div>
-  `, isInline: true, styles: ["@charset \"UTF-8\";:host{display:block}.ticket-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;border:1px solid var(--ion-color-light-shade, #e0e0e0);border-radius:16px;background:var(--ion-card-background, #ffffff);max-width:320px;margin:0 auto}.ticket-card__title{font-size:1rem;font-weight:700;color:var(--ion-color-dark);text-align:center}.ticket-card__qr{display:flex;align-items:center;justify-content:center;min-height:200px}.ticket-card__qr-loading{display:flex;align-items:center;justify-content:center;width:200px;height:200px}.ticket-card__qr-fallback{font-family:monospace;font-size:.75rem;color:var(--ion-color-medium);word-break:break-all;text-align:center;padding:16px}.ticket-card__meta{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.ticket-card__folio{font-size:1rem;font-weight:700;color:var(--ion-color-dark)}.ticket-card__buyer{font-size:.875rem;color:var(--ion-color-medium)}.ticket-card__badge{margin-top:4px;font-size:.75rem;font-weight:600;padding:3px 12px;border-radius:999px;background:var(--ion-color-medium);color:var(--ion-color-medium-contrast, #fff);white-space:nowrap}.ticket-card__badge[data-status=sold]{background:var(--ion-color-success, #2dd36f);color:var(--ion-color-success-contrast, #fff)}.ticket-card__badge[data-status=checkedIn]{background:var(--ion-color-medium);color:var(--ion-color-medium-contrast, #fff)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: QrCodeComponent, selector: "val-qr-code", inputs: ["props"], outputs: ["actionComplete", "imageLoad", "imageError"] }] }); }
+  `, isInline: true, styles: ["@charset \"UTF-8\";:host{display:block}.ticket-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;border:1px solid var(--ion-color-light-shade, #e0e0e0);border-radius:16px;background:var(--ion-card-background, #ffffff);max-width:320px;margin:0 auto}.ticket-card__title{font-size:1rem;font-weight:700;color:var(--ion-color-dark);text-align:center}.ticket-card__qr{display:flex;align-items:center;justify-content:center;min-height:200px}.ticket-card__qr-loading{display:flex;align-items:center;justify-content:center;width:200px;height:200px}.ticket-card__qr-fallback{font-family:monospace;font-size:.75rem;color:var(--ion-color-medium);word-break:break-all;text-align:center;padding:16px}.ticket-card__meta{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.ticket-card__folio{font-size:1rem;font-weight:700;color:var(--ion-color-dark)}.ticket-card__buyer{font-size:.875rem;color:var(--ion-color-medium)}.ticket-card__badge{margin-top:4px;font-size:.75rem;font-weight:600;padding:3px 12px;border-radius:999px;background:var(--ion-color-medium);color:var(--ion-color-medium-contrast, #fff);white-space:nowrap}.ticket-card__badge[data-status=sold]{background:var(--ion-color-success, #2dd36f);color:var(--ion-color-success-contrast, #fff)}.ticket-card__badge[data-status=checkedIn]{background:var(--ion-color-medium);color:var(--ion-color-medium-contrast, #fff)}.ticket-card__actions{width:100%;display:flex;flex-direction:column;gap:8px}.ticket-card__actions ion-button{--border-radius: 10px;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: QrCodeComponent, selector: "val-qr-code", inputs: ["props"], outputs: ["actionComplete", "imageLoad", "imageError"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TicketCardComponent, decorators: [{
             type: Component,
@@ -69981,20 +69998,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
         }
       </div>
 
-      @if (props().showDownload && qr()) {
-        <ion-button fill="clear" size="small" [disabled]="downloading()" (click)="downloadCard()">
-          <ion-icon name="download-outline" slot="start" />
-          {{ props().downloadLabel || t('download') }}
-        </ion-button>
-      }
-      @if (props().showShare && qr()) {
-        <ion-button fill="clear" size="small" [disabled]="sharing()" (click)="shareCard()">
-          <ion-icon name="share-outline" slot="start" />
-          {{ props().shareLabel || t('share') }}
-        </ion-button>
+      @if ((props().showDownload || props().showShare) && qr()) {
+        <div class="ticket-card__actions">
+          @if (props().showDownload) {
+            <ion-button fill="outline" expand="block" [disabled]="downloading()" (click)="downloadCard()">
+              <ion-icon name="download-outline" slot="start" />
+              {{ props().downloadLabel || t('download') }}
+            </ion-button>
+          }
+          @if (props().showShare) {
+            <ion-button fill="outline" expand="block" [disabled]="sharing()" (click)="shareCard()">
+              <ion-icon name="share-outline" slot="start" />
+              {{ props().shareLabel || t('share') }}
+            </ion-button>
+          }
+        </div>
       }
     </div>
-  `, styles: ["@charset \"UTF-8\";:host{display:block}.ticket-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;border:1px solid var(--ion-color-light-shade, #e0e0e0);border-radius:16px;background:var(--ion-card-background, #ffffff);max-width:320px;margin:0 auto}.ticket-card__title{font-size:1rem;font-weight:700;color:var(--ion-color-dark);text-align:center}.ticket-card__qr{display:flex;align-items:center;justify-content:center;min-height:200px}.ticket-card__qr-loading{display:flex;align-items:center;justify-content:center;width:200px;height:200px}.ticket-card__qr-fallback{font-family:monospace;font-size:.75rem;color:var(--ion-color-medium);word-break:break-all;text-align:center;padding:16px}.ticket-card__meta{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.ticket-card__folio{font-size:1rem;font-weight:700;color:var(--ion-color-dark)}.ticket-card__buyer{font-size:.875rem;color:var(--ion-color-medium)}.ticket-card__badge{margin-top:4px;font-size:.75rem;font-weight:600;padding:3px 12px;border-radius:999px;background:var(--ion-color-medium);color:var(--ion-color-medium-contrast, #fff);white-space:nowrap}.ticket-card__badge[data-status=sold]{background:var(--ion-color-success, #2dd36f);color:var(--ion-color-success-contrast, #fff)}.ticket-card__badge[data-status=checkedIn]{background:var(--ion-color-medium);color:var(--ion-color-medium-contrast, #fff)}\n"] }]
+  `, styles: ["@charset \"UTF-8\";:host{display:block}.ticket-card{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;border:1px solid var(--ion-color-light-shade, #e0e0e0);border-radius:16px;background:var(--ion-card-background, #ffffff);max-width:320px;margin:0 auto}.ticket-card__title{font-size:1rem;font-weight:700;color:var(--ion-color-dark);text-align:center}.ticket-card__qr{display:flex;align-items:center;justify-content:center;min-height:200px}.ticket-card__qr-loading{display:flex;align-items:center;justify-content:center;width:200px;height:200px}.ticket-card__qr-fallback{font-family:monospace;font-size:.75rem;color:var(--ion-color-medium);word-break:break-all;text-align:center;padding:16px}.ticket-card__meta{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.ticket-card__folio{font-size:1rem;font-weight:700;color:var(--ion-color-dark)}.ticket-card__buyer{font-size:.875rem;color:var(--ion-color-medium)}.ticket-card__badge{margin-top:4px;font-size:.75rem;font-weight:600;padding:3px 12px;border-radius:999px;background:var(--ion-color-medium);color:var(--ion-color-medium-contrast, #fff);white-space:nowrap}.ticket-card__badge[data-status=sold]{background:var(--ion-color-success, #2dd36f);color:var(--ion-color-success-contrast, #fff)}.ticket-card__badge[data-status=checkedIn]{background:var(--ion-color-medium);color:var(--ion-color-medium-contrast, #fff)}.ticket-card__actions{width:100%;display:flex;flex-direction:column;gap:8px}.ticket-card__actions ion-button{--border-radius: 10px;margin:0}\n"] }]
         }], ctorParameters: () => [] });
 
 /**