@ajuarezso/sui-design-system 0.23.1 → 0.24.0

package/fesm2022/ajuarezso-sui-design-system.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, input, computed, ChangeDetectionStrategy, Component, inject, TemplateRef, Directive, model, signal, contentChild, viewChild, effect, untracked, output, ElementRef, forwardRef, ViewContainerRef, DestroyRef, ContentChild, ViewChild, ViewEncapsulation, Renderer2, DOCUMENT, HostListener, RendererStyleFlags2, ViewChildren, viewChildren, afterNextRender, ContentChildren, Injector, Injectable } from '@angular/core';
+import { InjectionToken, input, computed, ChangeDetectionStrategy, Component, inject, TemplateRef, Directive, model, signal, contentChild, viewChild, effect, untracked, output, ElementRef, forwardRef, ViewContainerRef, DestroyRef, ContentChild, ViewChild, ViewEncapsulation, Renderer2, DOCUMENT, HostListener, RendererStyleFlags2, ViewChildren, viewChildren, booleanAttribute, afterNextRender, afterRenderEffect, ContentChildren, Injector, Injectable } from '@angular/core';
 import { NgTemplateOutlet, DOCUMENT as DOCUMENT$1, NgOptimizedImage } from '@angular/common';
 import { Router, RouterLink, RouterLinkActive } from '@angular/router';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
@@ -17632,6 +17632,185 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                     }, template: "<sui-switch\n  class=\"sui-switch-label__switch\"\n  [size]=\"controlSize()\"\n  [checked]=\"effectiveActive()\"\n  [disabled]=\"isDisabled()\"\n  [attr.aria-labelledby]=\"labelId\"\n  [attr.aria-describedby]=\"description() ? descriptionId : null\"\n  (checkedChange)=\"onSwitchChange($event)\"\n/>\n\n<div class=\"sui-switch-label__content\">\n  <div class=\"sui-switch-label__title\">\n    <span class=\"sui-switch-label__label\" [id]=\"labelId\">{{ label() }}</span>\n    @if (sublabel(); as sl) {\n      <span class=\"sui-switch-label__sublabel\">{{ sl }}</span>\n    }\n    @if (badgeCfg(); as bcfg) {\n      <sui-badge\n        class=\"sui-switch-label__badge\"\n        [color]=\"bcfg.color ?? 'orange'\"\n        [variant]=\"bcfg.variant ?? 'light'\"\n        [size]=\"bcfg.size ?? 'small'\"\n      >{{ bcfg.label }}</sui-badge>\n    }\n  </div>\n\n  @if (description(); as desc) {\n    <p class=\"sui-switch-label__description\" [id]=\"descriptionId\">{{ desc }}</p>\n\n    @if (linkCfg(); as link) {\n      <!-- Homologado con checkbox-label: sui-link-button (antes <button> crudo\n           con estilos propios) + soporte href/target/rel. -->\n      <sui-link-button\n        variant=\"primary\"\n        size=\"small\"\n        [disabled]=\"isDisabled()\"\n        [href]=\"link.href ?? null\"\n        [target]=\"link.target ?? null\"\n        [rel]=\"link.rel ?? null\"\n        (clicked)=\"onLinkClick($event)\"\n      >{{ link.label }}</sui-link-button>\n    }\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:inline-flex;align-items:flex-start;gap:8px;cursor:pointer;font-family:var(--sui-font-sans, \"Inter\", system-ui, sans-serif);font-feature-settings:\"ss11\" 1,\"calt\" 0,\"liga\" 0;-webkit-tap-highlight-color:transparent}:host([data-sui-flip]) .sui-switch-label__switch{order:2}:host([data-sui-flip]) .sui-switch-label__content{order:1}:host([data-sui-disabled]){cursor:not-allowed}:host([data-sui-disabled]) .sui-switch-label__content{opacity:.5}:host([data-sui-disabled]) .sui-switch-label__switch{opacity:.5}.sui-switch-label__switch{flex-shrink:0}.sui-switch-label__content{display:flex;flex:1 0 0;min-width:0;flex-direction:column;align-items:flex-start;gap:4px}:host([data-sui-with-description]) .sui-switch-label__content{gap:10px}.sui-switch-label__title{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.sui-switch-label__label{font-size:14px;font-weight:400;line-height:20px;letter-spacing:-.006em;color:var(--sui-text-strong-950)}:host([data-sui-with-description]) .sui-switch-label__label{font-weight:500}.sui-switch-label__sublabel{font-size:12px;font-weight:400;line-height:16px;letter-spacing:0;color:var(--sui-text-sub-600)}.sui-switch-label__badge{flex-shrink:0}.sui-switch-label__description{margin:0;font-size:12px;font-weight:400;line-height:16px;letter-spacing:0;color:var(--sui-text-sub-600);word-break:break-word}:host([data-sui-size=large]) .sui-switch-label__label,:host([data-sui-size=xlarge]) .sui-switch-label__label{font-size:var(--sui-type-paragraph-md-size, 16px);line-height:var(--sui-type-paragraph-md-line, 24px);letter-spacing:var(--sui-type-paragraph-md-spacing, -.011em)}:host([data-sui-size=xlarge]) .sui-switch-label__content{padding-top:2px}:host([data-sui-size=\"2xlarge\"]){min-height:44px;align-items:center}:host([data-sui-size=\"2xlarge\"]) .sui-switch-label__label{font-size:var(--sui-type-paragraph-md-size, 16px);line-height:var(--sui-type-paragraph-md-line, 24px);letter-spacing:var(--sui-type-paragraph-md-spacing, -.011em)}:host([data-sui-size=\"2xlarge\"][data-sui-with-description]){align-items:flex-start}:host([data-sui-size=\"2xlarge\"][data-sui-with-description]) .sui-switch-label__content{padding-top:2px}\n"] }]
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], sublabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "sublabel", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], badge: [{ type: i0.Input, args: [{ isSignal: true, alias: "badge", required: false }] }], link: [{ type: i0.Input, args: [{ isSignal: true, alias: "link", required: false }] }], flip: [{ type: i0.Input, args: [{ isSignal: true, alias: "flip", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], activeChange: [{ type: i0.Output, args: ["activeChange"] }], linkClick: [{ type: i0.Output, args: ["linkClick"] }] } });
 
+/**
+ * Pista de scroll horizontal — canon (aprobado por el dueño, 05-10-2026).
+ *
+ * Un contenedor con `overflow-x: auto` y la barra oculta no avisa que hay más:
+ * en el teléfono una tabla muestra 1 de 5 columnas y parece completa; en
+ * escritorio con mouse (Windows) solo se llega a lo oculto con Shift+rueda.
+ * La pista tiene dos partes:
+ *
+ *   1. Degradado en el borde que tiene contenido oculto (izquierdo y/o derecho),
+ *      del color de fondo del contenedor (`--sui-pista-de-scroll-fondo`, default
+ *      `--sui-bg-white-0`; funciona en oscuro porque el token se invierte).
+ *   2. Flechas (botón redondo) SOLO con puntero fino (`hover: hover` +
+ *      `pointer: fine`): desplazan ~80 % del ancho visible. En táctil no hay
+ *      flechas: se desliza con el dedo y el degradado basta.
+ *
+ * Una sola implementación para todo el DS, en dos piezas:
+ *   - `[suiPistaDeScroll]` va en el elemento que scrollea: mide el estado
+ *     (`hayAntes` / `hayDespues`) con su propio `scroll` (nativo y pasivo) +
+ *     `ResizeObserver`, sin listeners globales, y expone `desplazar()`.
+ *   - `<sui-pista-de-scroll>` envuelve a ese elemento (es el contenedor
+ *     `position: relative`) y dibuja degradados y flechas encima.
+ *
+ * Uso interno (sui-tab-chips, sui-table):
+ *   <sui-pista-de-scroll>
+ *     <nav class="…" [suiPistaDeScroll]="pistaDeScroll()">…</nav>
+ *   </sui-pista-de-scroll>
+ *
+ * Si el contenido cambia sin que cambie el ancho del scroller (chips, filas,
+ * columnas nuevas), el componente llama `medir()` desde un `afterRenderEffect`.
+ */
+class SuiPistaDeScroll {
+    /** Prende la pista (default). `false` la apaga: sin degradado ni flechas. */
+    activa = input(true, { ...(ngDevMode ? { debugName: "activa" } : /* istanbul ignore next */ {}), alias: 'suiPistaDeScroll', transform: booleanAttribute });
+    el = inject(ElementRef).nativeElement;
+    _antes = signal(false, ...(ngDevMode ? [{ debugName: "_antes" }] : /* istanbul ignore next */ []));
+    _despues = signal(false, ...(ngDevMode ? [{ debugName: "_despues" }] : /* istanbul ignore next */ []));
+    /** Hay contenido oculto a la izquierda (el scroll no está al inicio). */
+    hayAntes = computed(() => this.activa() && this._antes(), ...(ngDevMode ? [{ debugName: "hayAntes" }] : /* istanbul ignore next */ []));
+    /** Hay contenido oculto a la derecha (el scroll no llegó al final). */
+    hayDespues = computed(() => this.activa() && this._despues(), ...(ngDevMode ? [{ debugName: "hayDespues" }] : /* istanbul ignore next */ []));
+    _ro;
+    /** El scroller se desliza (overflow-x no es hidden/clip). Se cachea fuera del scroll. */
+    _desliza = true;
+    _onScroll = () => this.actualizar();
+    constructor() {
+        afterNextRender(() => {
+            this.medir();
+            /* Listener nativo y pasivo, NO un host listener: el de Angular marcaría
+               la vista del componente dueño (la tabla entera) en cada evento de
+               scroll, a 60-120 Hz durante un fling. Así solo cambian dos signals y
+               se refresca únicamente la vista de <sui-pista-de-scroll>. */
+            this.el.addEventListener('scroll', this._onScroll, { passive: true });
+            /* El ancho del scroller cambia con la ventana o el layout: se re-mide.
+               jsdom (tests) no trae ResizeObserver. */
+            if (typeof ResizeObserver === 'undefined')
+                return;
+            this._ro = new ResizeObserver(() => this.medir());
+            this._ro.observe(this.el);
+        });
+        inject(DestroyRef).onDestroy(() => {
+            this._ro?.disconnect();
+            this.el.removeEventListener('scroll', this._onScroll);
+        });
+    }
+    /**
+     * Re-mide todo: si el scroller se desliza (estilo computado) y si hay
+     * contenido oculto a cada lado. Para cambios de layout o de contenido; el
+     * scroll usa `actualizar()`, que no lee estilos.
+     */
+    medir() {
+        /* Un scroller con overflow hidden/clip (la tabla en escritorio) no se
+           desliza: no se muestra pista aunque el contenido desborde. */
+        const ox = typeof getComputedStyle === 'function' ? getComputedStyle(this.el).overflowX : '';
+        this._desliza = ox !== 'hidden' && ox !== 'clip';
+        this.actualizar();
+    }
+    /** Recalcula los dos lados con 3 lecturas de layout (camino del scroll). */
+    actualizar() {
+        const el = this.el;
+        if (!this.activa() || !this._desliza) {
+            this._antes.set(false);
+            this._despues.set(false);
+            return;
+        }
+        const max = el.scrollWidth - el.clientWidth;
+        const left = Math.abs(el.scrollLeft);
+        this._antes.set(max > 1 && left > 1);
+        this._despues.set(max > 1 && left < max - 1);
+    }
+    /** Desplaza ~80 % del ancho visible hacia un lado (−1 izquierda, 1 derecha). */
+    desplazar(sentido) {
+        const el = this.el;
+        const reducido = typeof matchMedia === 'function'
+            && matchMedia('(prefers-reduced-motion: reduce)').matches;
+        el.scrollBy?.({
+            left: sentido * el.clientWidth * 0.8,
+            behavior: reducido ? 'auto' : 'smooth',
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SuiPistaDeScroll, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.17", type: SuiPistaDeScroll, isStandalone: true, selector: "[suiPistaDeScroll]", inputs: { activa: { classPropertyName: "activa", publicName: "suiPistaDeScroll", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["suiPistaDeScroll"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SuiPistaDeScroll, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[suiPistaDeScroll]',
+                    exportAs: 'suiPistaDeScroll',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [], propDecorators: { activa: [{ type: i0.Input, args: [{ isSignal: true, alias: "suiPistaDeScroll", required: false }] }] } });
+/**
+ * Contenedor de la pista: envuelve al elemento con `[suiPistaDeScroll]` y
+ * dibuja degradados y flechas encima. Ver `SuiPistaDeScroll`.
+ *
+ * Variables CSS (las fija el componente que lo usa):
+ *   --sui-pista-de-scroll-fondo       color del degradado (default bg-white-0)
+ *   --sui-pista-de-scroll-flecha-top  centro vertical de las flechas (default 50%)
+ *   --sui-pista-de-scroll-flecha-size diámetro de las flechas (default 32px)
+ */
+class SuiPistaDeScrollMarco {
+    /** Oculta la pista del lado izquierdo (p. ej. la tabla con columna fija). */
+    ocultarInicio = input(false, ...(ngDevMode ? [{ debugName: "ocultarInicio" }] : /* istanbul ignore next */ []));
+    pista = contentChild(SuiPistaDeScroll, ...(ngDevMode ? [{ debugName: "pista" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SuiPistaDeScrollMarco, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SuiPistaDeScrollMarco, isStandalone: true, selector: "sui-pista-de-scroll", inputs: { ocultarInicio: { classPropertyName: "ocultarInicio", publicName: "ocultarInicio", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "pista", first: true, predicate: SuiPistaDeScroll, descendants: true, isSignal: true }], ngImport: i0, template: `
+    <ng-content />
+    @if (pista(); as p) {
+      @if (p.hayAntes() && !ocultarInicio()) {
+        <span class="sui-pista__borde sui-pista__borde--inicio" aria-hidden="true"></span>
+        <button
+          type="button"
+          class="sui-pista__flecha sui-pista__flecha--inicio"
+          tabindex="-1"
+          aria-label="Ver más a la izquierda"
+          (click)="p.desplazar(-1)"
+        ><sui-icon name="arrow-left-s-line" [size]="18" /></button>
+      }
+      @if (p.hayDespues()) {
+        <span class="sui-pista__borde sui-pista__borde--fin" aria-hidden="true"></span>
+        <button
+          type="button"
+          class="sui-pista__flecha sui-pista__flecha--fin"
+          tabindex="-1"
+          aria-label="Ver más a la derecha"
+          (click)="p.desplazar(1)"
+        ><sui-icon name="arrow-right-s-line" [size]="18" /></button>
+      }
+    }
+  `, isInline: true, styles: ["@charset \"UTF-8\";:host{position:relative;display:block;min-width:0}.sui-pista__borde{position:absolute;top:0;bottom:0;width:40px;pointer-events:none;z-index:2}.sui-pista__borde--inicio{left:0;background:linear-gradient(to right,var(--sui-pista-de-scroll-fondo, var(--sui-bg-white-0, #fff)) 0%,transparent 100%)}.sui-pista__borde--fin{right:0;background:linear-gradient(to left,var(--sui-pista-de-scroll-fondo, var(--sui-bg-white-0, #fff)) 0%,transparent 100%)}.sui-pista__flecha{display:none}@media(hover:hover)and (pointer:fine){.sui-pista__flecha{position:absolute;top:var(--sui-pista-de-scroll-flecha-top, 50%);z-index:3;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--sui-pista-de-scroll-flecha-size, 32px);height:var(--sui-pista-de-scroll-flecha-size, 32px);padding:0;border-radius:999px;border:1px solid var(--sui-stroke-soft-200, #ebebeb);background:var(--sui-bg-white-0, #fff);color:var(--sui-text-sub-600, #5c5c5c);box-shadow:var(--sui-shadow-x-small, 0 1px 2px rgba(10, 13, 20, .03));transform:translateY(-50%);cursor:pointer;pointer-events:auto;transition:background var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease)}.sui-pista__flecha:hover{background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-strong-950, #171717)}.sui-pista__flecha--inicio{left:4px}.sui-pista__flecha--fin{right:4px}}\n"], dependencies: [{ kind: "component", type: SuiIcon, selector: "sui-icon", inputs: ["name", "size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SuiPistaDeScrollMarco, decorators: [{
+            type: Component,
+            args: [{ selector: 'sui-pista-de-scroll', standalone: true, imports: [SuiIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <ng-content />
+    @if (pista(); as p) {
+      @if (p.hayAntes() && !ocultarInicio()) {
+        <span class="sui-pista__borde sui-pista__borde--inicio" aria-hidden="true"></span>
+        <button
+          type="button"
+          class="sui-pista__flecha sui-pista__flecha--inicio"
+          tabindex="-1"
+          aria-label="Ver más a la izquierda"
+          (click)="p.desplazar(-1)"
+        ><sui-icon name="arrow-left-s-line" [size]="18" /></button>
+      }
+      @if (p.hayDespues()) {
+        <span class="sui-pista__borde sui-pista__borde--fin" aria-hidden="true"></span>
+        <button
+          type="button"
+          class="sui-pista__flecha sui-pista__flecha--fin"
+          tabindex="-1"
+          aria-label="Ver más a la derecha"
+          (click)="p.desplazar(1)"
+        ><sui-icon name="arrow-right-s-line" [size]="18" /></button>
+      }
+    }
+  `, styles: ["@charset \"UTF-8\";:host{position:relative;display:block;min-width:0}.sui-pista__borde{position:absolute;top:0;bottom:0;width:40px;pointer-events:none;z-index:2}.sui-pista__borde--inicio{left:0;background:linear-gradient(to right,var(--sui-pista-de-scroll-fondo, var(--sui-bg-white-0, #fff)) 0%,transparent 100%)}.sui-pista__borde--fin{right:0;background:linear-gradient(to left,var(--sui-pista-de-scroll-fondo, var(--sui-bg-white-0, #fff)) 0%,transparent 100%)}.sui-pista__flecha{display:none}@media(hover:hover)and (pointer:fine){.sui-pista__flecha{position:absolute;top:var(--sui-pista-de-scroll-flecha-top, 50%);z-index:3;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--sui-pista-de-scroll-flecha-size, 32px);height:var(--sui-pista-de-scroll-flecha-size, 32px);padding:0;border-radius:999px;border:1px solid var(--sui-stroke-soft-200, #ebebeb);background:var(--sui-bg-white-0, #fff);color:var(--sui-text-sub-600, #5c5c5c);box-shadow:var(--sui-shadow-x-small, 0 1px 2px rgba(10, 13, 20, .03));transform:translateY(-50%);cursor:pointer;pointer-events:auto;transition:background var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease)}.sui-pista__flecha:hover{background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-strong-950, #171717)}.sui-pista__flecha--inicio{left:4px}.sui-pista__flecha--fin{right:4px}}\n"] }]
+        }], propDecorators: { ocultarInicio: [{ type: i0.Input, args: [{ isSignal: true, alias: "ocultarInicio", required: false }] }], pista: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SuiPistaDeScroll), { isSignal: true }] }] } });
+
 /**
  * SUI Tab Chips — chips horizontales scrollables (estilo "category nav" de
  * apps de food/delivery). Útil cuando hay 5+ secciones que no caben en un
@@ -17671,8 +17850,14 @@ class SuiTabChips {
     size = input('medium', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     /** Auto-scroll horizontal del chip activo al cambiar `value`. */
     autoScroll = input(true, ...(ngDevMode ? [{ debugName: "autoScroll" }] : /* istanbul ignore next */ []));
+    /**
+     * Pista de desborde (canon, dueño 05-10-2026): degradado en el borde con chips
+     * ocultos y, con mouse, flechas que desplazan. `false` la apaga.
+     */
+    pistaDeScroll = input(true, ...(ngDevMode ? [{ debugName: "pistaDeScroll" }] : /* istanbul ignore next */ []));
     sentinelRef;
     navRef;
+    pistaRef;
     /** Estado interno: chip pegado al top del viewport (solo si sticky=true). */
     stuck = signal(false, ...(ngDevMode ? [{ debugName: "stuck" }] : /* istanbul ignore next */ []));
     /** Normaliza el input a SuiTabChipItem[] para iteración uniforme. */
@@ -17719,6 +17904,13 @@ class SuiTabChips {
                 return;
             queueMicrotask(() => this.scrollToChip(v));
         });
+        /* La pista se re-mide cuando cambian los chips (el ancho del contenido
+           cambia sin que cambie el del nav, y eso el ResizeObserver no lo ve). */
+        afterRenderEffect(() => {
+            this.normalizedChips();
+            this.size();
+            this.pistaRef?.medir();
+        });
     }
     ngAfterViewInit() {
         if (this.sticky() && typeof IntersectionObserver !== 'undefined' && this.sentinelRef) {
@@ -17768,23 +17960,26 @@ class SuiTabChips {
         nav.scrollTo({ left: Math.max(0, offset), behavior: 'smooth' });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SuiTabChips, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SuiTabChips, isStandalone: true, selector: "sui-tab-chips", inputs: { chips: { classPropertyName: "chips", publicName: "chips", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, autoScroll: { classPropertyName: "autoScroll", publicName: "autoScroll", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.sui-tab-chips--host-sticky": "sticky()", "attr.data-sui-size": "size()" } }, viewQueries: [{ propertyName: "sentinelRef", first: true, predicate: ["sentinel"], descendants: true }, { propertyName: "navRef", first: true, predicate: ["nav"], descendants: true }], ngImport: i0, template: "@if (sticky()) {\n  <div #sentinel class=\"sui-tab-chips__sentinel\" aria-hidden=\"true\"></div>\n}\n<nav\n  #nav\n  class=\"sui-tab-chips\"\n  [class.sui-tab-chips--sticky]=\"sticky()\"\n  [class.sui-tab-chips--stuck]=\"sticky() && stuck()\"\n  role=\"tablist\"\n  (keydown)=\"onKeydown($event)\"\n  (focusout)=\"onFocusout($event)\"\n>\n  @for (chip of normalizedChips(); track chip.value) {\n    <button\n      type=\"button\"\n      class=\"sui-tab-chips__chip\"\n      [class.sui-tab-chips__chip--active]=\"value() === chip.value\"\n      [attr.data-sui-chip-value]=\"chip.value\"\n      [attr.aria-selected]=\"value() === chip.value\"\n      [attr.tabindex]=\"tabStopValue() === chip.value ? 0 : -1\"\n      [attr.aria-label]=\"chipAriaLabel(chip)\"\n      role=\"tab\"\n      (click)=\"select(chip.value)\"\n    >\n      <span class=\"sui-tab-chips__chip-label\">{{ chip.label }}</span>\n      @if (chip.count) {\n        <span class=\"sui-tab-chips__chip-count\" aria-hidden=\"true\">{{ chip.count }}</span>\n      }\n    </button>\n  }\n</nav>\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%}:host(.sui-tab-chips--host-sticky){display:contents}.sui-tab-chips__sentinel{height:1px;margin-top:16px;margin-bottom:-1px;pointer-events:none}.sui-tab-chips{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:12px 0;background:transparent;scrollbar-width:none}.sui-tab-chips::-webkit-scrollbar{display:none}.sui-tab-chips--sticky{position:sticky;top:0;z-index:20;transition:padding-top var(--sui-motion-duration-fast, .15s) var(--sui-motion-ease-out, ease),background var(--sui-motion-duration-fast, .15s) var(--sui-motion-ease-out, ease)}.sui-tab-chips--stuck{padding-top:calc(env(safe-area-inset-top,0px) + 12px);background:var(--sui-bg-weak-50, #f7f7f7)}.sui-tab-chips__chip{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;background:var(--sui-bg-white-0, #fff);border:1px solid var(--sui-stroke-soft-200, #ebebeb);color:var(--sui-text-sub-600, #5c5c5c);font-family:var(--sui-font-sans);font-size:var(--sui-type-label-sm-size, 13px);font-weight:600;letter-spacing:var(--sui-type-label-sm-spacing, -.006em);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),border-color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),transform var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease)}.sui-tab-chips__chip:hover{background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-strong-950, #171717)}.sui-tab-chips__chip:active{transform:scale(.96)}.sui-tab-chips__chip:active:not(:disabled),.sui-tab-chips__chip:focus-visible{outline:none;box-shadow:0 0 0 2px var(--sui-primary-alpha-10)}.sui-tab-chips__chip--active{background:var(--sui-bg-strong-950, #171717);color:var(--sui-bg-white-0, #fff);border-color:var(--sui-bg-strong-950, #171717)}.sui-tab-chips__chip--active:hover{background:var(--sui-bg-strong-950, #171717);color:var(--sui-bg-white-0, #fff)}.sui-tab-chips__chip-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;border-radius:999px;background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-sub-600, #5c5c5c);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1}:host([data-sui-size=small]) .sui-tab-chips__chip{box-sizing:border-box;height:32px;padding:0 12px;line-height:var(--sui-type-label-sm-line, 20px)}:host([data-sui-size=large]) .sui-tab-chips__chip{box-sizing:border-box;height:40px;padding:0 16px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -.011em)}:host([data-sui-size=xlarge]) .sui-tab-chips__chip{box-sizing:border-box;height:44px;padding:0 18px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -.011em)}:host([data-sui-size=small]) .sui-tab-chips__chip-count{min-width:16px;height:16px;padding:0 5px}:host([data-sui-size=large]) .sui-tab-chips__chip-count,:host([data-sui-size=xlarge]) .sui-tab-chips__chip-count{min-width:20px;height:20px;padding:0 6px;font-size:var(--sui-type-label-xs-size, 12px)}.sui-tab-chips__chip--active .sui-tab-chips__chip-count{background:color-mix(in srgb,var(--sui-bg-white-0, #fff) 22%,transparent);color:var(--sui-bg-white-0, #fff)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SuiTabChips, isStandalone: true, selector: "sui-tab-chips", inputs: { chips: { classPropertyName: "chips", publicName: "chips", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, autoScroll: { classPropertyName: "autoScroll", publicName: "autoScroll", isSignal: true, isRequired: false, transformFunction: null }, pistaDeScroll: { classPropertyName: "pistaDeScroll", publicName: "pistaDeScroll", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.sui-tab-chips--host-sticky": "sticky()", "attr.data-sui-size": "size()" } }, viewQueries: [{ propertyName: "sentinelRef", first: true, predicate: ["sentinel"], descendants: true }, { propertyName: "navRef", first: true, predicate: ["nav"], descendants: true }, { propertyName: "pistaRef", first: true, predicate: SuiPistaDeScroll, descendants: true }], ngImport: i0, template: "@if (sticky()) {\n  <div #sentinel class=\"sui-tab-chips__sentinel\" aria-hidden=\"true\"></div>\n}\n<sui-pista-de-scroll\n  class=\"sui-tab-chips__pista\"\n  [class.sui-tab-chips__pista--sticky]=\"sticky()\"\n  [class.sui-tab-chips__pista--stuck]=\"sticky() && stuck()\"\n>\n  <nav\n    #nav\n    class=\"sui-tab-chips\"\n    [suiPistaDeScroll]=\"pistaDeScroll()\"\n    [class.sui-tab-chips--sticky]=\"sticky()\"\n    [class.sui-tab-chips--stuck]=\"sticky() && stuck()\"\n    role=\"tablist\"\n    (keydown)=\"onKeydown($event)\"\n    (focusout)=\"onFocusout($event)\"\n  >\n    @for (chip of normalizedChips(); track chip.value) {\n      <button\n        type=\"button\"\n        class=\"sui-tab-chips__chip\"\n        [class.sui-tab-chips__chip--active]=\"value() === chip.value\"\n        [attr.data-sui-chip-value]=\"chip.value\"\n        [attr.aria-selected]=\"value() === chip.value\"\n        [attr.tabindex]=\"tabStopValue() === chip.value ? 0 : -1\"\n        [attr.aria-label]=\"chipAriaLabel(chip)\"\n        role=\"tab\"\n        (click)=\"select(chip.value)\"\n      >\n        <span class=\"sui-tab-chips__chip-label\">{{ chip.label }}</span>\n        @if (chip.count) {\n          <span class=\"sui-tab-chips__chip-count\" aria-hidden=\"true\">{{ chip.count }}</span>\n        }\n      </button>\n    }\n  </nav>\n</sui-pista-de-scroll>\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%}:host(.sui-tab-chips--host-sticky){display:contents}.sui-tab-chips__sentinel{height:1px;margin-top:16px;margin-bottom:-1px;pointer-events:none}.sui-tab-chips__pista{width:100%}.sui-tab-chips__pista--sticky{position:sticky;top:0;z-index:20}.sui-tab-chips__pista--stuck{--sui-pista-de-scroll-fondo: var(--sui-bg-weak-50, #f7f7f7)}.sui-tab-chips{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:12px 0;background:transparent;scrollbar-width:none}.sui-tab-chips::-webkit-scrollbar{display:none}.sui-tab-chips--sticky{transition:padding-top var(--sui-motion-duration-fast, .15s) var(--sui-motion-ease-out, ease),background var(--sui-motion-duration-fast, .15s) var(--sui-motion-ease-out, ease)}.sui-tab-chips--stuck{padding-top:calc(env(safe-area-inset-top,0px) + 12px);background:var(--sui-bg-weak-50, #f7f7f7)}.sui-tab-chips__chip{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;background:var(--sui-bg-white-0, #fff);border:1px solid var(--sui-stroke-soft-200, #ebebeb);color:var(--sui-text-sub-600, #5c5c5c);font-family:var(--sui-font-sans);font-size:var(--sui-type-label-sm-size, 13px);font-weight:600;letter-spacing:var(--sui-type-label-sm-spacing, -.006em);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),border-color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),transform var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease)}.sui-tab-chips__chip:hover{background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-strong-950, #171717)}.sui-tab-chips__chip:active{transform:scale(.96)}.sui-tab-chips__chip:active:not(:disabled),.sui-tab-chips__chip:focus-visible{outline:none;box-shadow:0 0 0 2px var(--sui-primary-alpha-10)}.sui-tab-chips__chip--active{background:var(--sui-bg-strong-950, #171717);color:var(--sui-bg-white-0, #fff);border-color:var(--sui-bg-strong-950, #171717)}.sui-tab-chips__chip--active:hover{background:var(--sui-bg-strong-950, #171717);color:var(--sui-bg-white-0, #fff)}.sui-tab-chips__chip-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;border-radius:999px;background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-sub-600, #5c5c5c);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1}:host([data-sui-size=small]) .sui-tab-chips__chip{box-sizing:border-box;height:32px;padding:0 12px;line-height:var(--sui-type-label-sm-line, 20px)}:host([data-sui-size=large]) .sui-tab-chips__chip{box-sizing:border-box;height:40px;padding:0 16px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -.011em)}:host([data-sui-size=xlarge]) .sui-tab-chips__chip{box-sizing:border-box;height:44px;padding:0 18px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -.011em)}:host([data-sui-size=small]) .sui-tab-chips__chip-count{min-width:16px;height:16px;padding:0 5px}:host([data-sui-size=large]) .sui-tab-chips__chip-count,:host([data-sui-size=xlarge]) .sui-tab-chips__chip-count{min-width:20px;height:20px;padding:0 6px;font-size:var(--sui-type-label-xs-size, 12px)}.sui-tab-chips__chip--active .sui-tab-chips__chip-count{background:color-mix(in srgb,var(--sui-bg-white-0, #fff) 22%,transparent);color:var(--sui-bg-white-0, #fff)}\n"], dependencies: [{ kind: "directive", type: SuiPistaDeScroll, selector: "[suiPistaDeScroll]", inputs: ["suiPistaDeScroll"], exportAs: ["suiPistaDeScroll"] }, { kind: "component", type: SuiPistaDeScrollMarco, selector: "sui-pista-de-scroll", inputs: ["ocultarInicio"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SuiTabChips, decorators: [{
             type: Component,
-            args: [{ selector: 'sui-tab-chips', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, host: {
+            args: [{ selector: 'sui-tab-chips', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [SuiPistaDeScroll, SuiPistaDeScrollMarco], host: {
                         /* En modo sticky, el :host pasa a `display: contents` (ver scss) para que el
                            <nav> sticky resuelva contra el scroll container real y no contra el host
                            (que mide ~50px → el sticky no se enganchaba). Gate por clase de host. */
                         '[class.sui-tab-chips--host-sticky]': 'sticky()',
                         '[attr.data-sui-size]': 'size()',
-                    }, template: "@if (sticky()) {\n  <div #sentinel class=\"sui-tab-chips__sentinel\" aria-hidden=\"true\"></div>\n}\n<nav\n  #nav\n  class=\"sui-tab-chips\"\n  [class.sui-tab-chips--sticky]=\"sticky()\"\n  [class.sui-tab-chips--stuck]=\"sticky() && stuck()\"\n  role=\"tablist\"\n  (keydown)=\"onKeydown($event)\"\n  (focusout)=\"onFocusout($event)\"\n>\n  @for (chip of normalizedChips(); track chip.value) {\n    <button\n      type=\"button\"\n      class=\"sui-tab-chips__chip\"\n      [class.sui-tab-chips__chip--active]=\"value() === chip.value\"\n      [attr.data-sui-chip-value]=\"chip.value\"\n      [attr.aria-selected]=\"value() === chip.value\"\n      [attr.tabindex]=\"tabStopValue() === chip.value ? 0 : -1\"\n      [attr.aria-label]=\"chipAriaLabel(chip)\"\n      role=\"tab\"\n      (click)=\"select(chip.value)\"\n    >\n      <span class=\"sui-tab-chips__chip-label\">{{ chip.label }}</span>\n      @if (chip.count) {\n        <span class=\"sui-tab-chips__chip-count\" aria-hidden=\"true\">{{ chip.count }}</span>\n      }\n    </button>\n  }\n</nav>\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%}:host(.sui-tab-chips--host-sticky){display:contents}.sui-tab-chips__sentinel{height:1px;margin-top:16px;margin-bottom:-1px;pointer-events:none}.sui-tab-chips{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:12px 0;background:transparent;scrollbar-width:none}.sui-tab-chips::-webkit-scrollbar{display:none}.sui-tab-chips--sticky{position:sticky;top:0;z-index:20;transition:padding-top var(--sui-motion-duration-fast, .15s) var(--sui-motion-ease-out, ease),background var(--sui-motion-duration-fast, .15s) var(--sui-motion-ease-out, ease)}.sui-tab-chips--stuck{padding-top:calc(env(safe-area-inset-top,0px) + 12px);background:var(--sui-bg-weak-50, #f7f7f7)}.sui-tab-chips__chip{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;background:var(--sui-bg-white-0, #fff);border:1px solid var(--sui-stroke-soft-200, #ebebeb);color:var(--sui-text-sub-600, #5c5c5c);font-family:var(--sui-font-sans);font-size:var(--sui-type-label-sm-size, 13px);font-weight:600;letter-spacing:var(--sui-type-label-sm-spacing, -.006em);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),border-color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),transform var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease)}.sui-tab-chips__chip:hover{background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-strong-950, #171717)}.sui-tab-chips__chip:active{transform:scale(.96)}.sui-tab-chips__chip:active:not(:disabled),.sui-tab-chips__chip:focus-visible{outline:none;box-shadow:0 0 0 2px var(--sui-primary-alpha-10)}.sui-tab-chips__chip--active{background:var(--sui-bg-strong-950, #171717);color:var(--sui-bg-white-0, #fff);border-color:var(--sui-bg-strong-950, #171717)}.sui-tab-chips__chip--active:hover{background:var(--sui-bg-strong-950, #171717);color:var(--sui-bg-white-0, #fff)}.sui-tab-chips__chip-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;border-radius:999px;background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-sub-600, #5c5c5c);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1}:host([data-sui-size=small]) .sui-tab-chips__chip{box-sizing:border-box;height:32px;padding:0 12px;line-height:var(--sui-type-label-sm-line, 20px)}:host([data-sui-size=large]) .sui-tab-chips__chip{box-sizing:border-box;height:40px;padding:0 16px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -.011em)}:host([data-sui-size=xlarge]) .sui-tab-chips__chip{box-sizing:border-box;height:44px;padding:0 18px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -.011em)}:host([data-sui-size=small]) .sui-tab-chips__chip-count{min-width:16px;height:16px;padding:0 5px}:host([data-sui-size=large]) .sui-tab-chips__chip-count,:host([data-sui-size=xlarge]) .sui-tab-chips__chip-count{min-width:20px;height:20px;padding:0 6px;font-size:var(--sui-type-label-xs-size, 12px)}.sui-tab-chips__chip--active .sui-tab-chips__chip-count{background:color-mix(in srgb,var(--sui-bg-white-0, #fff) 22%,transparent);color:var(--sui-bg-white-0, #fff)}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { chips: [{ type: i0.Input, args: [{ isSignal: true, alias: "chips", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], autoScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoScroll", required: false }] }], sentinelRef: [{
+                    }, template: "@if (sticky()) {\n  <div #sentinel class=\"sui-tab-chips__sentinel\" aria-hidden=\"true\"></div>\n}\n<sui-pista-de-scroll\n  class=\"sui-tab-chips__pista\"\n  [class.sui-tab-chips__pista--sticky]=\"sticky()\"\n  [class.sui-tab-chips__pista--stuck]=\"sticky() && stuck()\"\n>\n  <nav\n    #nav\n    class=\"sui-tab-chips\"\n    [suiPistaDeScroll]=\"pistaDeScroll()\"\n    [class.sui-tab-chips--sticky]=\"sticky()\"\n    [class.sui-tab-chips--stuck]=\"sticky() && stuck()\"\n    role=\"tablist\"\n    (keydown)=\"onKeydown($event)\"\n    (focusout)=\"onFocusout($event)\"\n  >\n    @for (chip of normalizedChips(); track chip.value) {\n      <button\n        type=\"button\"\n        class=\"sui-tab-chips__chip\"\n        [class.sui-tab-chips__chip--active]=\"value() === chip.value\"\n        [attr.data-sui-chip-value]=\"chip.value\"\n        [attr.aria-selected]=\"value() === chip.value\"\n        [attr.tabindex]=\"tabStopValue() === chip.value ? 0 : -1\"\n        [attr.aria-label]=\"chipAriaLabel(chip)\"\n        role=\"tab\"\n        (click)=\"select(chip.value)\"\n      >\n        <span class=\"sui-tab-chips__chip-label\">{{ chip.label }}</span>\n        @if (chip.count) {\n          <span class=\"sui-tab-chips__chip-count\" aria-hidden=\"true\">{{ chip.count }}</span>\n        }\n      </button>\n    }\n  </nav>\n</sui-pista-de-scroll>\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%}:host(.sui-tab-chips--host-sticky){display:contents}.sui-tab-chips__sentinel{height:1px;margin-top:16px;margin-bottom:-1px;pointer-events:none}.sui-tab-chips__pista{width:100%}.sui-tab-chips__pista--sticky{position:sticky;top:0;z-index:20}.sui-tab-chips__pista--stuck{--sui-pista-de-scroll-fondo: var(--sui-bg-weak-50, #f7f7f7)}.sui-tab-chips{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:12px 0;background:transparent;scrollbar-width:none}.sui-tab-chips::-webkit-scrollbar{display:none}.sui-tab-chips--sticky{transition:padding-top var(--sui-motion-duration-fast, .15s) var(--sui-motion-ease-out, ease),background var(--sui-motion-duration-fast, .15s) var(--sui-motion-ease-out, ease)}.sui-tab-chips--stuck{padding-top:calc(env(safe-area-inset-top,0px) + 12px);background:var(--sui-bg-weak-50, #f7f7f7)}.sui-tab-chips__chip{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;background:var(--sui-bg-white-0, #fff);border:1px solid var(--sui-stroke-soft-200, #ebebeb);color:var(--sui-text-sub-600, #5c5c5c);font-family:var(--sui-font-sans);font-size:var(--sui-type-label-sm-size, 13px);font-weight:600;letter-spacing:var(--sui-type-label-sm-spacing, -.006em);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),border-color var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease),transform var(--sui-motion-duration-x-fast, .1s) var(--sui-motion-ease-out, ease)}.sui-tab-chips__chip:hover{background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-strong-950, #171717)}.sui-tab-chips__chip:active{transform:scale(.96)}.sui-tab-chips__chip:active:not(:disabled),.sui-tab-chips__chip:focus-visible{outline:none;box-shadow:0 0 0 2px var(--sui-primary-alpha-10)}.sui-tab-chips__chip--active{background:var(--sui-bg-strong-950, #171717);color:var(--sui-bg-white-0, #fff);border-color:var(--sui-bg-strong-950, #171717)}.sui-tab-chips__chip--active:hover{background:var(--sui-bg-strong-950, #171717);color:var(--sui-bg-white-0, #fff)}.sui-tab-chips__chip-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;border-radius:999px;background:var(--sui-bg-weak-50, #f7f7f7);color:var(--sui-text-sub-600, #5c5c5c);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1}:host([data-sui-size=small]) .sui-tab-chips__chip{box-sizing:border-box;height:32px;padding:0 12px;line-height:var(--sui-type-label-sm-line, 20px)}:host([data-sui-size=large]) .sui-tab-chips__chip{box-sizing:border-box;height:40px;padding:0 16px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -.011em)}:host([data-sui-size=xlarge]) .sui-tab-chips__chip{box-sizing:border-box;height:44px;padding:0 18px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -.011em)}:host([data-sui-size=small]) .sui-tab-chips__chip-count{min-width:16px;height:16px;padding:0 5px}:host([data-sui-size=large]) .sui-tab-chips__chip-count,:host([data-sui-size=xlarge]) .sui-tab-chips__chip-count{min-width:20px;height:20px;padding:0 6px;font-size:var(--sui-type-label-xs-size, 12px)}.sui-tab-chips__chip--active .sui-tab-chips__chip-count{background:color-mix(in srgb,var(--sui-bg-white-0, #fff) 22%,transparent);color:var(--sui-bg-white-0, #fff)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { chips: [{ type: i0.Input, args: [{ isSignal: true, alias: "chips", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], autoScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoScroll", required: false }] }], pistaDeScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "pistaDeScroll", required: false }] }], sentinelRef: [{
                 type: ViewChild,
                 args: ['sentinel']
             }], navRef: [{
                 type: ViewChild,
                 args: ['nav']
+            }], pistaRef: [{
+                type: ViewChild,
+                args: [SuiPistaDeScroll]
             }] } });
 
 /**
@@ -17916,6 +18111,11 @@ class SuiTable {
     striped = input(false, ...(ngDevMode ? [{ debugName: "striped" }] : /* istanbul ignore next */ []));
     selectable = input(false, ...(ngDevMode ? [{ debugName: "selectable" }] : /* istanbul ignore next */ []));
     rowKey = input(...(ngDevMode ? [undefined, { debugName: "rowKey" }] : /* istanbul ignore next */ []));
+    /**
+     * Pista de desborde (canon, dueño 05-10-2026): degradado en el borde con
+     * columnas ocultas y, con mouse, flechas que desplazan. `false` la apaga.
+     */
+    pistaDeScroll = input(true, ...(ngDevMode ? [{ debugName: "pistaDeScroll" }] : /* istanbul ignore next */ []));
     selectedRows = model(new Set(), ...(ngDevMode ? [{ debugName: "selectedRows" }] : /* istanbul ignore next */ []));
     sortKey = model(null, ...(ngDevMode ? [{ debugName: "sortKey" }] : /* istanbul ignore next */ []));
     sortDir = model(null, ...(ngDevMode ? [{ debugName: "sortDir" }] : /* istanbul ignore next */ []));
@@ -17923,9 +18123,21 @@ class SuiTable {
     sortChanged = output();
     // ── Touch scroll passthrough (fix Android) ────────────────────────────────
     scrollEl = viewChild('scrollEl', ...(ngDevMode ? [{ debugName: "scrollEl" }] : /* istanbul ignore next */ []));
+    pista = viewChild(SuiPistaDeScroll, ...(ngDevMode ? [{ debugName: "pista" }] : /* istanbul ignore next */ []));
     destroyRef = inject(DestroyRef);
     doc = inject(DOCUMENT$1);
     constructor() {
+        /* La pista se re-mide cuando cambian columnas o filas: el ancho del
+           contenido cambia sin que cambie el del scroller (el ResizeObserver de la
+           directiva no lo ve). */
+        afterRenderEffect(() => {
+            this.columns();
+            this.rows();
+            this.size();
+            this.selectable();
+            this.loading();
+            this.pista()?.medir();
+        });
         /* En Android/Chromium un container con `overflow-x: auto` ABSORBE el touch
            vertical y NO lo delega al scroll de la página (verificado en device:
            ningún `touch-action` — pan-x/pan-y/auto — lo arregla; solo quitar el
@@ -18194,18 +18406,18 @@ class SuiTable {
         return this.columns().map((_, i) => i);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SuiTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SuiTable, isStandalone: true, selector: "sui-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, rowKey: { classPropertyName: "rowKey", publicName: "rowKey", isSignal: true, isRequired: false, transformFunction: null }, selectedRows: { classPropertyName: "selectedRows", publicName: "selectedRows", isSignal: true, isRequired: false, transformFunction: null }, sortKey: { classPropertyName: "sortKey", publicName: "sortKey", isSignal: true, isRequired: false, transformFunction: null }, sortDir: { classPropertyName: "sortDir", publicName: "sortDir", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedRows: "selectedRowsChange", sortKey: "sortKeyChange", sortDir: "sortDirChange", rowClicked: "rowClicked", sortChanged: "sortChanged" }, host: { properties: { "attr.data-sui-size": "size()", "attr.data-sui-striped": "striped() ? \"\" : null", "attr.data-sui-selectable": "selectable() ? \"\" : null", "attr.data-sui-loading": "loading() ? \"\" : null", "attr.data-sui-sticky": "hasStickyColumn() ? \"\" : null" } }, queries: [{ propertyName: "cellTemplates", predicate: SuiTableCellDirective }], viewQueries: [{ propertyName: "scrollEl", first: true, predicate: ["scrollEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- \u2550\u2550 SUI Table \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<div class=\"sui-table\" #scrollEl>\n\n  <!-- Header -->\n  <div class=\"sui-table__header\">\n    <!-- Checkbox header (selectable mode) \u2014 compone sui-checkbox (canon) -->\n    @if (selectable()) {\n      <div class=\"sui-table__header-cell sui-table__header-cell--checkbox\">\n        <sui-checkbox\n          [checked]=\"allSelected\"\n          [indeterminate]=\"partialSelected\"\n          (checkedChange)=\"toggleAll()\"\n          (click)=\"$event.stopPropagation()\"\n          aria-label=\"Seleccionar todas las filas\"\n        />\n      </div>\n    }\n\n    @for (col of columns(); track col.key) {\n      <div\n        class=\"sui-table__header-cell\"\n        [class.sui-table__header-cell--sortable]=\"col.sortable && !col.disabled\"\n        [class.sui-table__header-cell--sorted]=\"isSortActive(col.key)\"\n        [class.sui-table__header-cell--disabled]=\"col.disabled\"\n        [class.sui-table__header-cell--center]=\"col.align === 'center'\"\n        [class.sui-table__header-cell--right]=\"col.align === 'right'\"\n        [class.sui-table__header-cell--empty]=\"!col.label\"\n        [class.sui-table__header-cell--sticky]=\"col.sticky\"\n        [style.width]=\"col.width ?? null\"\n        [style.min-width]=\"colMinWidth(col)\"\n        [style.max-width]=\"col.maxWidth ?? null\"\n        [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n        (click)=\"!col.disabled && onSort(col)\"\n        [attr.tabindex]=\"col.sortable && !col.disabled ? '0' : null\"\n        [attr.role]=\"col.sortable ? 'columnheader' : null\"\n        [attr.aria-disabled]=\"col.disabled ? 'true' : null\"\n        [attr.aria-sort]=\"col.sortable ? (isSortActive(col.key) ? (sortDir() === 'asc' ? 'ascending' : 'descending') : 'none') : null\"\n        (keydown.enter)=\"!col.disabled && onSort(col)\"\n        (keydown.space)=\"$event.preventDefault(); !col.disabled && onSort(col)\"\n      >\n        @if (col.label) {\n          <span class=\"sui-table__header-label\">{{ col.label }}</span>\n        }\n        @if (col.sortable) {\n          <span class=\"sui-table__sort-icon\" [class.sui-table__sort-icon--active]=\"isSortActive(col.key)\">\n            @if (!isSortActive(col.key)) {\n              <sui-icon name=\"expand-up-down-line\" [size]=\"20\" />\n            } @else if (sortDir() === 'asc') {\n              <sui-icon name=\"arrow-up-s-fill\" [size]=\"20\" />\n            } @else {\n              <sui-icon name=\"arrow-down-s-fill\" [size]=\"20\" />\n            }\n          </span>\n        }\n      </div>\n    }\n  </div>\n\n  <!-- Body: Loading skeleton -->\n  @if (loading()) {\n    <div class=\"sui-table__body\">\n      @for (sk of skeletonRows; track sk) {\n        <div class=\"sui-table__row sui-table__row--skeleton\">\n          @if (selectable()) {\n            <div class=\"sui-table__cell sui-table__cell--checkbox\">\n              <span class=\"sui-table__skeleton-box sui-table__skeleton-box--sm\"></span>\n            </div>\n          }\n          @for (col of columns(); track col.key) {\n            <div\n              class=\"sui-table__cell\"\n              [class.sui-table__cell--sticky]=\"col.sticky\"\n              [style.width]=\"col.width ?? null\"\n              [style.min-width]=\"colMinWidth(col)\"\n              [style.max-width]=\"col.maxWidth ?? null\"\n              [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n            >\n              <span class=\"sui-table__skeleton-box\"></span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  }\n\n  <!-- Body: Empty state -->\n  @else if (rows().length === 0) {\n    <div class=\"sui-table__empty\">\n      <sui-icon name=\"inbox-line\" [size]=\"40\" class=\"sui-table__empty-icon\" />\n      <p class=\"sui-table__empty-msg\">{{ emptyMessage() }}</p>\n    </div>\n  }\n\n  <!-- Body: Data rows -->\n  @else {\n    <div class=\"sui-table__body\">\n      @for (row of rows(); track getRowKey(row, $index); let i = $index) {\n        <div\n          class=\"sui-table__row\"\n          [class.sui-table__row--selected]=\"selectedRows().has(getRowKey(row, i))\"\n          [class.sui-table__row--striped]=\"striped() && i % 2 === 1\"\n          (click)=\"rowClicked.emit(row)\"\n        >\n          <!-- Checkbox column \u2014 compone sui-checkbox (canon) -->\n          @if (selectable()) {\n            <div class=\"sui-table__cell sui-table__cell--checkbox\" (click)=\"$event.stopPropagation()\">\n              <sui-checkbox\n                [checked]=\"selectedRows().has(getRowKey(row, i))\"\n                (checkedChange)=\"toggleRow(row, i)\"\n                aria-label=\"Seleccionar fila\"\n              />\n            </div>\n          }\n\n          <!-- Data columns -->\n          @for (col of columns(); track col.key) {\n            <div\n              class=\"sui-table__cell\"\n              [class.sui-table__cell--center]=\"col.align === 'center'\"\n              [class.sui-table__cell--right]=\"col.align === 'right'\"\n              [class.sui-table__cell--sticky]=\"col.sticky\"\n              [class.sui-table__cell--leading]=\"cellPriority(col) === 'leading'\"\n              [class.sui-table__cell--passive]=\"cellPriority(col) === 'passive'\"\n              [class.sui-table__cell--none]=\"cellPriority(col) === 'none'\"\n              [style.width]=\"col.width ?? null\"\n              [style.min-width]=\"colMinWidth(col)\"\n              [style.max-width]=\"col.maxWidth ?? null\"\n              [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n            >\n              <!-- Custom template via SuiTableCellDirective -->\n              @if (getTemplate(col.key); as tmpl) {\n                <ng-container *ngTemplateOutlet=\"tmpl.templateRef; context: { $implicit: row }\"></ng-container>\n              } @else if (getCellDescription(row, col); as desc) {\n                <!-- Texto + sub-texto (Figma Priority=Leading, 2da l\u00EDnea XSmall) -->\n                <span class=\"sui-table__cell-block\">\n                  <span\n                    class=\"sui-table__cell-text\"\n                    [class.sui-table__cell-text--truncate]=\"col.truncate\"\n                    [suiTooltip]=\"getCellTooltip(row, col)\"\n                  >{{ getCellValue(row, col.key) }}</span>\n                  <span class=\"sui-table__cell-desc\">{{ desc }}</span>\n                </span>\n              } @else if (col.truncate) {\n                <!-- Texto truncado + tooltip con el valor completo -->\n                <span\n                  class=\"sui-table__cell-text sui-table__cell-text--truncate\"\n                  [suiTooltip]=\"getCellTooltip(row, col)\"\n                >{{ getCellValue(row, col.key) }}</span>\n              } @else {\n                <!-- Default text rendering -->\n                <span class=\"sui-table__cell-text\">{{ getCellValue(row, col.key) }}</span>\n              }\n            </div>\n          }\n        </div>\n\n        <!-- Row divider (not after last row) -->\n        @if (i < rows().length - 1) {\n          <div class=\"sui-table__divider\"></div>\n        }\n      }\n    </div>\n  }\n\n</div>\n", styles: ["@charset \"UTF-8\";.mp-badge{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:6px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid transparent;line-height:1}.mp-badge--green{background:var(--admin-success-bg, #dcfce7);color:var(--admin-success, #16a34a)}.mp-badge--red{background:var(--admin-error-bg, #fee2e2);color:var(--admin-error, #ef4444)}.mp-badge--orange{background:#fff7ed;color:#c2410c;border-color:#fed7aa}.mp-badge--blue{background:var(--admin-info-bg, #dbeafe);color:#2563eb}.mp-badge--gray{background:var(--admin-bg-tertiary, #f3f4f6);color:var(--admin-text-tertiary, #6b7280)}.mp-badge--sm{height:20px;padding:0 8px;font-size:11px}.mp-action-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 12px;border-radius:6px;border:1px solid transparent;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .15s ease}.mp-action-btn:disabled{opacity:.5;cursor:not-allowed}.mp-action-btn--activate{background:var(--admin-success, #16a34a);color:#fff}.mp-action-btn--activate:hover{background:#15803d}.mp-action-btn--renew{background:var(--admin-info, #3b82f6);color:#fff}.mp-action-btn--renew:hover{background:#2563eb}.mp-action-btn--suspend{background:var(--admin-bg-primary, #fff);color:var(--admin-error, #ef4444);border-color:#fca5a5}.mp-action-btn--suspend:hover{background:var(--admin-error-bg, #fee2e2)}.mp-action-btn--danger{background:#dc2626;color:#fff;border:none}.mp-action-btn--danger:hover{background:#b91c1c}.mp-action-btn--outline{background:var(--admin-bg-primary, #fff);color:var(--admin-text-secondary, #374151);border-color:var(--admin-border-primary, #e5e7eb)}.mp-action-btn--outline:hover{background:var(--admin-bg-hover, #f9fafb)}.mp-action-btn--icon{width:28px;height:28px;padding:0;background:transparent;color:var(--admin-text-muted, #9ca3af);border:none}.mp-action-btn--icon:hover{background:var(--admin-bg-hover, #f9fafb);color:var(--admin-text-primary, #171717)}.mp-action-btn--icon-danger{width:28px;height:28px;padding:0;background:transparent;color:#dc2626;border:none}.mp-action-btn--icon-danger:hover{background:var(--admin-error-bg, #fee2e2);color:#dc2626}:host{display:block;width:100%}.sui-table{display:flex;flex-direction:column;width:100%;overflow:hidden;font-family:var(--sui-font-sans);font-feature-settings:\"ss11\" 1,\"calt\" 0,\"liga\" 0;font-optical-sizing:auto}:host([data-sui-sticky]) .sui-table__header,:host([data-sui-sticky]) .sui-table__row{overflow:visible}@media(max-width:767px){.sui-table{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:var(--sui-bg-white-0);overscroll-behavior-y:none;display:grid;grid-template-columns:max-content}}@media(max-width:767px)and (max-width:767px){.sui-table{scrollbar-width:none}.sui-table::-webkit-scrollbar{display:none;width:0;height:0}}@media(max-width:767px){.sui-table .sui-table__header,.sui-table .sui-table__body{min-width:100%}.sui-table .sui-table__cell,.sui-table .sui-table__header-cell{min-width:120px}.sui-table .sui-table__cell--checkbox,.sui-table .sui-table__header-cell--checkbox{min-width:44px}.sui-table .sui-table__header-cell--empty{min-width:0}}:host([data-sui-sticky]) .sui-table{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:var(--sui-bg-white-0);overscroll-behavior-y:none}@media(max-width:767px){:host([data-sui-sticky]) .sui-table{scrollbar-width:none}:host([data-sui-sticky]) .sui-table::-webkit-scrollbar{display:none;width:0;height:0}}:host([data-sui-sticky]) .sui-table{display:grid;grid-template-columns:max-content}:host([data-sui-sticky]) .sui-table .sui-table__header,:host([data-sui-sticky]) .sui-table .sui-table__body{min-width:100%}:host([data-sui-sticky]) .sui-table .sui-table__cell,:host([data-sui-sticky]) .sui-table .sui-table__header-cell{min-width:120px}:host([data-sui-sticky]) .sui-table .sui-table__cell--checkbox,:host([data-sui-sticky]) .sui-table .sui-table__header-cell--checkbox{min-width:44px}:host([data-sui-sticky]) .sui-table .sui-table__header-cell--empty{min-width:0}.sui-table__header{display:flex;align-items:flex-start;background:var(--sui-bg-weak-50);border-radius:var(--sui-radius-8);overflow:hidden;min-height:36px;flex-shrink:0}.sui-table__header-cell{display:flex;align-items:center;gap:2px;padding:8px 12px;min-width:0;box-sizing:border-box;white-space:nowrap;overflow:hidden;font-size:var(--sui-type-paragraph-sm-size);font-weight:var(--sui-type-paragraph-sm-weight);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing);color:var(--sui-text-sub-600)}.sui-table__header-cell--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.sui-table__header-cell--sortable:hover{color:var(--sui-text-strong-950)}.sui-table__header-cell--sortable:hover .sui-table__sort-icon{opacity:1}.sui-table__header-cell--sortable:focus-visible{outline:2px solid var(--sui-primary-alpha-10);outline-offset:-2px;border-radius:var(--sui-radius-4)}.sui-table__header-cell--sorted{color:var(--sui-text-strong-950)}.sui-table__header-cell--disabled{cursor:default;pointer-events:none;color:var(--sui-text-disabled-300)}.sui-table__header-cell--disabled .sui-table__sort-icon{color:var(--sui-text-disabled-300);opacity:1}.sui-table__header-cell--empty{flex-shrink:0;padding:0}.sui-table__header-cell--center{justify-content:center}.sui-table__header-cell--right{justify-content:flex-end}.sui-table__header-cell--checkbox{flex:0 0 44px;justify-content:center}.sui-table__header-cell--sticky{position:sticky;left:0;z-index:2;background:var(--sui-bg-weak-50)}.sui-table__header-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:1;min-width:0}.sui-table__sort-icon{display:inline-flex;align-items:center;flex-shrink:0;color:var(--sui-text-soft-400);opacity:.6;transition:opacity var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out)}.sui-table__sort-icon--active{color:var(--sui-text-strong-950);opacity:1}.sui-table__body{display:flex;flex-direction:column;width:100%}.sui-table__row{display:flex;align-items:center;width:100%;border-radius:var(--sui-radius-12);overflow:hidden;cursor:pointer;transition:background-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out);box-sizing:border-box}@media(hover:hover)and (pointer:fine){.sui-table__row:hover,.sui-table__row:hover .sui-table__cell{background:var(--sui-bg-weak-50)}}.sui-table__row:active,.sui-table__row:active .sui-table__cell{background:var(--sui-bg-weak-50)}.sui-table__row--selected{background:var(--sui-primary-alpha-10)}.sui-table__row--selected:hover{background:var(--sui-primary-alpha-16)}.sui-table__row--striped{background:var(--sui-bg-weak-25)}.sui-table__row--skeleton{pointer-events:none;cursor:default}.sui-table__row--skeleton:hover{background:transparent}.sui-table__row--skeleton:hover .sui-table__cell{background:var(--sui-bg-white-0)}:host([data-sui-size=medium]) .sui-table__cell{min-height:64px;padding:12px 20px 12px 12px}:host([data-sui-size=small]) .sui-table__cell{min-height:48px;padding:8px 16px 8px 12px}:host([data-sui-size=large]) .sui-table__cell{min-height:80px;padding:16px 20px 16px 12px}:host([data-sui-size=xlarge]) .sui-table__cell{min-height:96px;padding:20px 20px 20px 12px}.sui-table__cell{display:flex;align-items:center;gap:12px;min-width:0;overflow:hidden;box-sizing:border-box;background:var(--sui-bg-white-0);transition:background-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out);font-size:var(--sui-type-paragraph-sm-size);font-weight:var(--sui-type-paragraph-sm-weight);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing);color:var(--sui-text-strong-950)}.sui-table__cell--center{justify-content:center}.sui-table__cell--right{justify-content:flex-end}.sui-table__cell--checkbox{flex:0 0 44px;justify-content:center;padding:0 12px}.sui-table__cell--leading{font-weight:var(--sui-type-label-sm-weight);color:var(--sui-text-strong-950)}.sui-table__cell--passive{color:var(--sui-text-sub-600);font-weight:var(--sui-type-paragraph-sm-weight)}.sui-table__cell--sticky{position:sticky;left:0;z-index:1;background:var(--sui-bg-white-0)}.sui-table__row--selected .sui-table__cell{background:transparent}.sui-table__row--selected .sui-table__cell.sui-table__cell--sticky{background:var(--sui-primary-alpha-10)}.sui-table__cell-text{min-width:0}.sui-table__cell-text--truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;display:block}.sui-table__cell-block{display:flex;flex-direction:column;min-width:0}.sui-table__cell-desc{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--sui-type-paragraph-xs-size);font-weight:var(--sui-type-paragraph-xs-weight);line-height:var(--sui-type-paragraph-xs-line);letter-spacing:var(--sui-type-paragraph-xs-spacing);color:var(--sui-text-sub-600)}.sui-table__cell--leading .sui-table__cell-text{font-weight:var(--sui-type-label-sm-weight)}.sui-table__cell--passive .sui-table__cell-text{font-weight:inherit;color:inherit}:host ::ng-deep .sui-table__leading-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;padding:10px;box-sizing:border-box;border-radius:var(--sui-radius-full);background:var(--sui-bg-white-0);border:1px solid var(--sui-stroke-soft-200);box-shadow:var(--sui-regular-shadow-x-small);color:var(--sui-text-sub-600)}:host([data-sui-size=small]) ::ng-deep .sui-table__leading-icon{width:32px;height:32px;padding:6px}.sui-table__divider{width:100%;padding:1.5px 0;flex-shrink:0;background:var(--sui-bg-white-0)}.sui-table__divider:after{content:\"\";display:block;height:1px;background:var(--sui-stroke-soft-200)}.sui-table__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;gap:12px;text-align:center}.sui-table__empty-icon{color:var(--sui-text-disabled-300)}.sui-table__empty-msg{margin:0;font-size:var(--sui-type-paragraph-sm-size);line-height:var(--sui-type-paragraph-sm-line);color:var(--sui-text-sub-600)}.sui-table__skeleton-box{display:block;height:14px;width:100%;max-width:180px;border-radius:var(--sui-radius-4);background:linear-gradient(90deg,var(--sui-bg-soft-200) 25%,var(--sui-bg-weak-50) 50%,var(--sui-bg-soft-200) 75%);background-size:400% 100%;animation:sui-skeleton-pulse 1.4s ease-in-out infinite}.sui-table__skeleton-box--sm{width:20px;max-width:20px;height:20px;border-radius:var(--sui-radius-4)}@keyframes sui-skeleton-pulse{0%{background-position:100% 50%}to{background-position:0% 50%}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SuiCheckbox, selector: "sui-checkbox", inputs: ["size", "checked", "indeterminate", "disabled", "focusable"], outputs: ["checkedChange"] }, { kind: "component", type: SuiIcon, selector: "sui-icon", inputs: ["name", "size", "color"] }, { kind: "directive", type: SuiTooltip, selector: "[suiTooltip], [suiTooltipLarge]", inputs: ["suiTooltip", "suiTooltipLarge", "position", "suiTooltipSize", "theme", "delay", "disabled", "showArrow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SuiTable, isStandalone: true, selector: "sui-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, rowKey: { classPropertyName: "rowKey", publicName: "rowKey", isSignal: true, isRequired: false, transformFunction: null }, pistaDeScroll: { classPropertyName: "pistaDeScroll", publicName: "pistaDeScroll", isSignal: true, isRequired: false, transformFunction: null }, selectedRows: { classPropertyName: "selectedRows", publicName: "selectedRows", isSignal: true, isRequired: false, transformFunction: null }, sortKey: { classPropertyName: "sortKey", publicName: "sortKey", isSignal: true, isRequired: false, transformFunction: null }, sortDir: { classPropertyName: "sortDir", publicName: "sortDir", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedRows: "selectedRowsChange", sortKey: "sortKeyChange", sortDir: "sortDirChange", rowClicked: "rowClicked", sortChanged: "sortChanged" }, host: { properties: { "attr.data-sui-size": "size()", "attr.data-sui-striped": "striped() ? \"\" : null", "attr.data-sui-selectable": "selectable() ? \"\" : null", "attr.data-sui-loading": "loading() ? \"\" : null", "attr.data-sui-sticky": "hasStickyColumn() ? \"\" : null" } }, queries: [{ propertyName: "cellTemplates", predicate: SuiTableCellDirective }], viewQueries: [{ propertyName: "scrollEl", first: true, predicate: ["scrollEl"], descendants: true, isSignal: true }, { propertyName: "pista", first: true, predicate: SuiPistaDeScroll, descendants: true, isSignal: true }], ngImport: i0, template: "<!-- \u2550\u2550 SUI Table \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<!-- Pista de scroll (canon, due\u00F1o 05-10-2026): degradado + flechas con mouse.\n     Con columna fija no hay pista a la izquierda: la columna pegada ya avisa. -->\n<sui-pista-de-scroll class=\"sui-table__pista\" [ocultarInicio]=\"hasStickyColumn()\">\n<div class=\"sui-table\" #scrollEl [suiPistaDeScroll]=\"pistaDeScroll()\">\n\n  <!-- Header -->\n  <div class=\"sui-table__header\">\n    <!-- Checkbox header (selectable mode) \u2014 compone sui-checkbox (canon) -->\n    @if (selectable()) {\n      <div class=\"sui-table__header-cell sui-table__header-cell--checkbox\">\n        <sui-checkbox\n          [checked]=\"allSelected\"\n          [indeterminate]=\"partialSelected\"\n          (checkedChange)=\"toggleAll()\"\n          (click)=\"$event.stopPropagation()\"\n          aria-label=\"Seleccionar todas las filas\"\n        />\n      </div>\n    }\n\n    @for (col of columns(); track col.key) {\n      <div\n        class=\"sui-table__header-cell\"\n        [class.sui-table__header-cell--sortable]=\"col.sortable && !col.disabled\"\n        [class.sui-table__header-cell--sorted]=\"isSortActive(col.key)\"\n        [class.sui-table__header-cell--disabled]=\"col.disabled\"\n        [class.sui-table__header-cell--center]=\"col.align === 'center'\"\n        [class.sui-table__header-cell--right]=\"col.align === 'right'\"\n        [class.sui-table__header-cell--empty]=\"!col.label\"\n        [class.sui-table__header-cell--sticky]=\"col.sticky\"\n        [style.width]=\"col.width ?? null\"\n        [style.min-width]=\"colMinWidth(col)\"\n        [style.max-width]=\"col.maxWidth ?? null\"\n        [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n        (click)=\"!col.disabled && onSort(col)\"\n        [attr.tabindex]=\"col.sortable && !col.disabled ? '0' : null\"\n        [attr.role]=\"col.sortable ? 'columnheader' : null\"\n        [attr.aria-disabled]=\"col.disabled ? 'true' : null\"\n        [attr.aria-sort]=\"col.sortable ? (isSortActive(col.key) ? (sortDir() === 'asc' ? 'ascending' : 'descending') : 'none') : null\"\n        (keydown.enter)=\"!col.disabled && onSort(col)\"\n        (keydown.space)=\"$event.preventDefault(); !col.disabled && onSort(col)\"\n      >\n        @if (col.label) {\n          <span class=\"sui-table__header-label\">{{ col.label }}</span>\n        }\n        @if (col.sortable) {\n          <span class=\"sui-table__sort-icon\" [class.sui-table__sort-icon--active]=\"isSortActive(col.key)\">\n            @if (!isSortActive(col.key)) {\n              <sui-icon name=\"expand-up-down-line\" [size]=\"20\" />\n            } @else if (sortDir() === 'asc') {\n              <sui-icon name=\"arrow-up-s-fill\" [size]=\"20\" />\n            } @else {\n              <sui-icon name=\"arrow-down-s-fill\" [size]=\"20\" />\n            }\n          </span>\n        }\n      </div>\n    }\n  </div>\n\n  <!-- Body: Loading skeleton -->\n  @if (loading()) {\n    <div class=\"sui-table__body\">\n      @for (sk of skeletonRows; track sk) {\n        <div class=\"sui-table__row sui-table__row--skeleton\">\n          @if (selectable()) {\n            <div class=\"sui-table__cell sui-table__cell--checkbox\">\n              <span class=\"sui-table__skeleton-box sui-table__skeleton-box--sm\"></span>\n            </div>\n          }\n          @for (col of columns(); track col.key) {\n            <div\n              class=\"sui-table__cell\"\n              [class.sui-table__cell--sticky]=\"col.sticky\"\n              [style.width]=\"col.width ?? null\"\n              [style.min-width]=\"colMinWidth(col)\"\n              [style.max-width]=\"col.maxWidth ?? null\"\n              [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n            >\n              <span class=\"sui-table__skeleton-box\"></span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  }\n\n  <!-- Body: Empty state -->\n  @else if (rows().length === 0) {\n    <div class=\"sui-table__empty\">\n      <sui-icon name=\"inbox-line\" [size]=\"40\" class=\"sui-table__empty-icon\" />\n      <p class=\"sui-table__empty-msg\">{{ emptyMessage() }}</p>\n    </div>\n  }\n\n  <!-- Body: Data rows -->\n  @else {\n    <div class=\"sui-table__body\">\n      @for (row of rows(); track getRowKey(row, $index); let i = $index) {\n        <div\n          class=\"sui-table__row\"\n          [class.sui-table__row--selected]=\"selectedRows().has(getRowKey(row, i))\"\n          [class.sui-table__row--striped]=\"striped() && i % 2 === 1\"\n          (click)=\"rowClicked.emit(row)\"\n        >\n          <!-- Checkbox column \u2014 compone sui-checkbox (canon) -->\n          @if (selectable()) {\n            <div class=\"sui-table__cell sui-table__cell--checkbox\" (click)=\"$event.stopPropagation()\">\n              <sui-checkbox\n                [checked]=\"selectedRows().has(getRowKey(row, i))\"\n                (checkedChange)=\"toggleRow(row, i)\"\n                aria-label=\"Seleccionar fila\"\n              />\n            </div>\n          }\n\n          <!-- Data columns -->\n          @for (col of columns(); track col.key) {\n            <div\n              class=\"sui-table__cell\"\n              [class.sui-table__cell--center]=\"col.align === 'center'\"\n              [class.sui-table__cell--right]=\"col.align === 'right'\"\n              [class.sui-table__cell--sticky]=\"col.sticky\"\n              [class.sui-table__cell--leading]=\"cellPriority(col) === 'leading'\"\n              [class.sui-table__cell--passive]=\"cellPriority(col) === 'passive'\"\n              [class.sui-table__cell--none]=\"cellPriority(col) === 'none'\"\n              [style.width]=\"col.width ?? null\"\n              [style.min-width]=\"colMinWidth(col)\"\n              [style.max-width]=\"col.maxWidth ?? null\"\n              [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n            >\n              <!-- Custom template via SuiTableCellDirective -->\n              @if (getTemplate(col.key); as tmpl) {\n                <ng-container *ngTemplateOutlet=\"tmpl.templateRef; context: { $implicit: row }\"></ng-container>\n              } @else if (getCellDescription(row, col); as desc) {\n                <!-- Texto + sub-texto (Figma Priority=Leading, 2da l\u00EDnea XSmall) -->\n                <span class=\"sui-table__cell-block\">\n                  <span\n                    class=\"sui-table__cell-text\"\n                    [class.sui-table__cell-text--truncate]=\"col.truncate\"\n                    [suiTooltip]=\"getCellTooltip(row, col)\"\n                  >{{ getCellValue(row, col.key) }}</span>\n                  <span class=\"sui-table__cell-desc\">{{ desc }}</span>\n                </span>\n              } @else if (col.truncate) {\n                <!-- Texto truncado + tooltip con el valor completo -->\n                <span\n                  class=\"sui-table__cell-text sui-table__cell-text--truncate\"\n                  [suiTooltip]=\"getCellTooltip(row, col)\"\n                >{{ getCellValue(row, col.key) }}</span>\n              } @else {\n                <!-- Default text rendering -->\n                <span class=\"sui-table__cell-text\">{{ getCellValue(row, col.key) }}</span>\n              }\n            </div>\n          }\n        </div>\n\n        <!-- Row divider (not after last row) -->\n        @if (i < rows().length - 1) {\n          <div class=\"sui-table__divider\"></div>\n        }\n      }\n    </div>\n  }\n\n</div>\n</sui-pista-de-scroll>\n", styles: ["@charset \"UTF-8\";.mp-badge{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:6px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid transparent;line-height:1}.mp-badge--green{background:var(--admin-success-bg, #dcfce7);color:var(--admin-success, #16a34a)}.mp-badge--red{background:var(--admin-error-bg, #fee2e2);color:var(--admin-error, #ef4444)}.mp-badge--orange{background:#fff7ed;color:#c2410c;border-color:#fed7aa}.mp-badge--blue{background:var(--admin-info-bg, #dbeafe);color:#2563eb}.mp-badge--gray{background:var(--admin-bg-tertiary, #f3f4f6);color:var(--admin-text-tertiary, #6b7280)}.mp-badge--sm{height:20px;padding:0 8px;font-size:11px}.mp-action-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 12px;border-radius:6px;border:1px solid transparent;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .15s ease}.mp-action-btn:disabled{opacity:.5;cursor:not-allowed}.mp-action-btn--activate{background:var(--admin-success, #16a34a);color:#fff}.mp-action-btn--activate:hover{background:#15803d}.mp-action-btn--renew{background:var(--admin-info, #3b82f6);color:#fff}.mp-action-btn--renew:hover{background:#2563eb}.mp-action-btn--suspend{background:var(--admin-bg-primary, #fff);color:var(--admin-error, #ef4444);border-color:#fca5a5}.mp-action-btn--suspend:hover{background:var(--admin-error-bg, #fee2e2)}.mp-action-btn--danger{background:#dc2626;color:#fff;border:none}.mp-action-btn--danger:hover{background:#b91c1c}.mp-action-btn--outline{background:var(--admin-bg-primary, #fff);color:var(--admin-text-secondary, #374151);border-color:var(--admin-border-primary, #e5e7eb)}.mp-action-btn--outline:hover{background:var(--admin-bg-hover, #f9fafb)}.mp-action-btn--icon{width:28px;height:28px;padding:0;background:transparent;color:var(--admin-text-muted, #9ca3af);border:none}.mp-action-btn--icon:hover{background:var(--admin-bg-hover, #f9fafb);color:var(--admin-text-primary, #171717)}.mp-action-btn--icon-danger{width:28px;height:28px;padding:0;background:transparent;color:#dc2626;border:none}.mp-action-btn--icon-danger:hover{background:var(--admin-error-bg, #fee2e2);color:#dc2626}:host{display:block;width:100%}.sui-table__pista{width:100%;--sui-pista-de-scroll-flecha-top: 18px;--sui-pista-de-scroll-flecha-size: 28px}.sui-table{display:flex;flex-direction:column;width:100%;overflow:hidden;font-family:var(--sui-font-sans);font-feature-settings:\"ss11\" 1,\"calt\" 0,\"liga\" 0;font-optical-sizing:auto}:host([data-sui-sticky]) .sui-table__header,:host([data-sui-sticky]) .sui-table__row{overflow:visible}@media(max-width:767px){.sui-table{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:var(--sui-bg-white-0);overscroll-behavior-y:none;display:grid;grid-template-columns:max-content}}@media(max-width:767px)and (max-width:767px){.sui-table{scrollbar-width:none}.sui-table::-webkit-scrollbar{display:none;width:0;height:0}}@media(max-width:767px){.sui-table .sui-table__header,.sui-table .sui-table__body{min-width:100%}.sui-table .sui-table__cell,.sui-table .sui-table__header-cell{min-width:120px}.sui-table .sui-table__cell--checkbox,.sui-table .sui-table__header-cell--checkbox{min-width:44px}.sui-table .sui-table__header-cell--empty{min-width:0}}:host([data-sui-sticky]) .sui-table{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:var(--sui-bg-white-0);overscroll-behavior-y:none}@media(max-width:767px){:host([data-sui-sticky]) .sui-table{scrollbar-width:none}:host([data-sui-sticky]) .sui-table::-webkit-scrollbar{display:none;width:0;height:0}}:host([data-sui-sticky]) .sui-table{display:grid;grid-template-columns:max-content}:host([data-sui-sticky]) .sui-table .sui-table__header,:host([data-sui-sticky]) .sui-table .sui-table__body{min-width:100%}:host([data-sui-sticky]) .sui-table .sui-table__cell,:host([data-sui-sticky]) .sui-table .sui-table__header-cell{min-width:120px}:host([data-sui-sticky]) .sui-table .sui-table__cell--checkbox,:host([data-sui-sticky]) .sui-table .sui-table__header-cell--checkbox{min-width:44px}:host([data-sui-sticky]) .sui-table .sui-table__header-cell--empty{min-width:0}.sui-table__header{display:flex;align-items:flex-start;background:var(--sui-bg-weak-50);border-radius:var(--sui-radius-8);overflow:hidden;min-height:36px;flex-shrink:0}.sui-table__header-cell{display:flex;align-items:center;gap:2px;padding:8px 12px;min-width:0;box-sizing:border-box;white-space:nowrap;overflow:hidden;font-size:var(--sui-type-paragraph-sm-size);font-weight:var(--sui-type-paragraph-sm-weight);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing);color:var(--sui-text-sub-600)}.sui-table__header-cell--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.sui-table__header-cell--sortable:hover{color:var(--sui-text-strong-950)}.sui-table__header-cell--sortable:hover .sui-table__sort-icon{opacity:1}.sui-table__header-cell--sortable:focus-visible{outline:2px solid var(--sui-primary-alpha-10);outline-offset:-2px;border-radius:var(--sui-radius-4)}.sui-table__header-cell--sorted{color:var(--sui-text-strong-950)}.sui-table__header-cell--disabled{cursor:default;pointer-events:none;color:var(--sui-text-disabled-300)}.sui-table__header-cell--disabled .sui-table__sort-icon{color:var(--sui-text-disabled-300);opacity:1}.sui-table__header-cell--empty{flex-shrink:0;padding:0}.sui-table__header-cell--center{justify-content:center}.sui-table__header-cell--right{justify-content:flex-end}.sui-table__header-cell--checkbox{flex:0 0 44px;justify-content:center}.sui-table__header-cell--sticky{position:sticky;left:0;z-index:2;background:var(--sui-bg-weak-50)}.sui-table__header-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:1;min-width:0}.sui-table__sort-icon{display:inline-flex;align-items:center;flex-shrink:0;color:var(--sui-text-soft-400);opacity:.6;transition:opacity var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out)}.sui-table__sort-icon--active{color:var(--sui-text-strong-950);opacity:1}.sui-table__body{display:flex;flex-direction:column;width:100%}.sui-table__row{display:flex;align-items:center;width:100%;border-radius:var(--sui-radius-12);overflow:hidden;cursor:pointer;transition:background-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out);box-sizing:border-box}@media(hover:hover)and (pointer:fine){.sui-table__row:hover,.sui-table__row:hover .sui-table__cell{background:var(--sui-bg-weak-50)}}.sui-table__row:active,.sui-table__row:active .sui-table__cell{background:var(--sui-bg-weak-50)}.sui-table__row--selected{background:var(--sui-primary-alpha-10)}.sui-table__row--selected:hover{background:var(--sui-primary-alpha-16)}.sui-table__row--striped{background:var(--sui-bg-weak-25)}.sui-table__row--skeleton{pointer-events:none;cursor:default}.sui-table__row--skeleton:hover{background:transparent}.sui-table__row--skeleton:hover .sui-table__cell{background:var(--sui-bg-white-0)}:host([data-sui-size=medium]) .sui-table__cell{min-height:64px;padding:12px 20px 12px 12px}:host([data-sui-size=small]) .sui-table__cell{min-height:48px;padding:8px 16px 8px 12px}:host([data-sui-size=large]) .sui-table__cell{min-height:80px;padding:16px 20px 16px 12px}:host([data-sui-size=xlarge]) .sui-table__cell{min-height:96px;padding:20px 20px 20px 12px}.sui-table__cell{display:flex;align-items:center;gap:12px;min-width:0;overflow:hidden;box-sizing:border-box;background:var(--sui-bg-white-0);transition:background-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out);font-size:var(--sui-type-paragraph-sm-size);font-weight:var(--sui-type-paragraph-sm-weight);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing);color:var(--sui-text-strong-950)}.sui-table__cell--center{justify-content:center}.sui-table__cell--right{justify-content:flex-end}.sui-table__cell--checkbox{flex:0 0 44px;justify-content:center;padding:0 12px}.sui-table__cell--leading{font-weight:var(--sui-type-label-sm-weight);color:var(--sui-text-strong-950)}.sui-table__cell--passive{color:var(--sui-text-sub-600);font-weight:var(--sui-type-paragraph-sm-weight)}.sui-table__cell--sticky{position:sticky;left:0;z-index:1;background:var(--sui-bg-white-0)}.sui-table__row--selected .sui-table__cell{background:transparent}.sui-table__row--selected .sui-table__cell.sui-table__cell--sticky{background:var(--sui-primary-alpha-10)}.sui-table__cell-text{min-width:0}.sui-table__cell-text--truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;display:block}.sui-table__cell-block{display:flex;flex-direction:column;min-width:0}.sui-table__cell-desc{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--sui-type-paragraph-xs-size);font-weight:var(--sui-type-paragraph-xs-weight);line-height:var(--sui-type-paragraph-xs-line);letter-spacing:var(--sui-type-paragraph-xs-spacing);color:var(--sui-text-sub-600)}.sui-table__cell--leading .sui-table__cell-text{font-weight:var(--sui-type-label-sm-weight)}.sui-table__cell--passive .sui-table__cell-text{font-weight:inherit;color:inherit}:host ::ng-deep .sui-table__leading-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;padding:10px;box-sizing:border-box;border-radius:var(--sui-radius-full);background:var(--sui-bg-white-0);border:1px solid var(--sui-stroke-soft-200);box-shadow:var(--sui-regular-shadow-x-small);color:var(--sui-text-sub-600)}:host([data-sui-size=small]) ::ng-deep .sui-table__leading-icon{width:32px;height:32px;padding:6px}.sui-table__divider{width:100%;padding:1.5px 0;flex-shrink:0;background:var(--sui-bg-white-0)}.sui-table__divider:after{content:\"\";display:block;height:1px;background:var(--sui-stroke-soft-200)}.sui-table__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;gap:12px;text-align:center}.sui-table__empty-icon{color:var(--sui-text-disabled-300)}.sui-table__empty-msg{margin:0;font-size:var(--sui-type-paragraph-sm-size);line-height:var(--sui-type-paragraph-sm-line);color:var(--sui-text-sub-600)}.sui-table__skeleton-box{display:block;height:14px;width:100%;max-width:180px;border-radius:var(--sui-radius-4);background:linear-gradient(90deg,var(--sui-bg-soft-200) 25%,var(--sui-bg-weak-50) 50%,var(--sui-bg-soft-200) 75%);background-size:400% 100%;animation:sui-skeleton-pulse 1.4s ease-in-out infinite}.sui-table__skeleton-box--sm{width:20px;max-width:20px;height:20px;border-radius:var(--sui-radius-4)}@keyframes sui-skeleton-pulse{0%{background-position:100% 50%}to{background-position:0% 50%}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SuiCheckbox, selector: "sui-checkbox", inputs: ["size", "checked", "indeterminate", "disabled", "focusable"], outputs: ["checkedChange"] }, { kind: "component", type: SuiIcon, selector: "sui-icon", inputs: ["name", "size", "color"] }, { kind: "directive", type: SuiTooltip, selector: "[suiTooltip], [suiTooltipLarge]", inputs: ["suiTooltip", "suiTooltipLarge", "position", "suiTooltipSize", "theme", "delay", "disabled", "showArrow"] }, { kind: "directive", type: SuiPistaDeScroll, selector: "[suiPistaDeScroll]", inputs: ["suiPistaDeScroll"], exportAs: ["suiPistaDeScroll"] }, { kind: "component", type: SuiPistaDeScrollMarco, selector: "sui-pista-de-scroll", inputs: ["ocultarInicio"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SuiTable, decorators: [{
             type: Component,
-            args: [{ selector: 'sui-table', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgTemplateOutlet, SuiCheckbox, SuiIcon, SuiTooltip], host: {
+            args: [{ selector: 'sui-table', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgTemplateOutlet, SuiCheckbox, SuiIcon, SuiTooltip, SuiPistaDeScroll, SuiPistaDeScrollMarco], host: {
                         '[attr.data-sui-size]': 'size()',
                         '[attr.data-sui-striped]': 'striped() ? "" : null',
                         '[attr.data-sui-selectable]': 'selectable() ? "" : null',
                         '[attr.data-sui-loading]': 'loading() ? "" : null',
                         '[attr.data-sui-sticky]': 'hasStickyColumn() ? "" : null',
-                    }, template: "<!-- \u2550\u2550 SUI Table \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<div class=\"sui-table\" #scrollEl>\n\n  <!-- Header -->\n  <div class=\"sui-table__header\">\n    <!-- Checkbox header (selectable mode) \u2014 compone sui-checkbox (canon) -->\n    @if (selectable()) {\n      <div class=\"sui-table__header-cell sui-table__header-cell--checkbox\">\n        <sui-checkbox\n          [checked]=\"allSelected\"\n          [indeterminate]=\"partialSelected\"\n          (checkedChange)=\"toggleAll()\"\n          (click)=\"$event.stopPropagation()\"\n          aria-label=\"Seleccionar todas las filas\"\n        />\n      </div>\n    }\n\n    @for (col of columns(); track col.key) {\n      <div\n        class=\"sui-table__header-cell\"\n        [class.sui-table__header-cell--sortable]=\"col.sortable && !col.disabled\"\n        [class.sui-table__header-cell--sorted]=\"isSortActive(col.key)\"\n        [class.sui-table__header-cell--disabled]=\"col.disabled\"\n        [class.sui-table__header-cell--center]=\"col.align === 'center'\"\n        [class.sui-table__header-cell--right]=\"col.align === 'right'\"\n        [class.sui-table__header-cell--empty]=\"!col.label\"\n        [class.sui-table__header-cell--sticky]=\"col.sticky\"\n        [style.width]=\"col.width ?? null\"\n        [style.min-width]=\"colMinWidth(col)\"\n        [style.max-width]=\"col.maxWidth ?? null\"\n        [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n        (click)=\"!col.disabled && onSort(col)\"\n        [attr.tabindex]=\"col.sortable && !col.disabled ? '0' : null\"\n        [attr.role]=\"col.sortable ? 'columnheader' : null\"\n        [attr.aria-disabled]=\"col.disabled ? 'true' : null\"\n        [attr.aria-sort]=\"col.sortable ? (isSortActive(col.key) ? (sortDir() === 'asc' ? 'ascending' : 'descending') : 'none') : null\"\n        (keydown.enter)=\"!col.disabled && onSort(col)\"\n        (keydown.space)=\"$event.preventDefault(); !col.disabled && onSort(col)\"\n      >\n        @if (col.label) {\n          <span class=\"sui-table__header-label\">{{ col.label }}</span>\n        }\n        @if (col.sortable) {\n          <span class=\"sui-table__sort-icon\" [class.sui-table__sort-icon--active]=\"isSortActive(col.key)\">\n            @if (!isSortActive(col.key)) {\n              <sui-icon name=\"expand-up-down-line\" [size]=\"20\" />\n            } @else if (sortDir() === 'asc') {\n              <sui-icon name=\"arrow-up-s-fill\" [size]=\"20\" />\n            } @else {\n              <sui-icon name=\"arrow-down-s-fill\" [size]=\"20\" />\n            }\n          </span>\n        }\n      </div>\n    }\n  </div>\n\n  <!-- Body: Loading skeleton -->\n  @if (loading()) {\n    <div class=\"sui-table__body\">\n      @for (sk of skeletonRows; track sk) {\n        <div class=\"sui-table__row sui-table__row--skeleton\">\n          @if (selectable()) {\n            <div class=\"sui-table__cell sui-table__cell--checkbox\">\n              <span class=\"sui-table__skeleton-box sui-table__skeleton-box--sm\"></span>\n            </div>\n          }\n          @for (col of columns(); track col.key) {\n            <div\n              class=\"sui-table__cell\"\n              [class.sui-table__cell--sticky]=\"col.sticky\"\n              [style.width]=\"col.width ?? null\"\n              [style.min-width]=\"colMinWidth(col)\"\n              [style.max-width]=\"col.maxWidth ?? null\"\n              [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n            >\n              <span class=\"sui-table__skeleton-box\"></span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  }\n\n  <!-- Body: Empty state -->\n  @else if (rows().length === 0) {\n    <div class=\"sui-table__empty\">\n      <sui-icon name=\"inbox-line\" [size]=\"40\" class=\"sui-table__empty-icon\" />\n      <p class=\"sui-table__empty-msg\">{{ emptyMessage() }}</p>\n    </div>\n  }\n\n  <!-- Body: Data rows -->\n  @else {\n    <div class=\"sui-table__body\">\n      @for (row of rows(); track getRowKey(row, $index); let i = $index) {\n        <div\n          class=\"sui-table__row\"\n          [class.sui-table__row--selected]=\"selectedRows().has(getRowKey(row, i))\"\n          [class.sui-table__row--striped]=\"striped() && i % 2 === 1\"\n          (click)=\"rowClicked.emit(row)\"\n        >\n          <!-- Checkbox column \u2014 compone sui-checkbox (canon) -->\n          @if (selectable()) {\n            <div class=\"sui-table__cell sui-table__cell--checkbox\" (click)=\"$event.stopPropagation()\">\n              <sui-checkbox\n                [checked]=\"selectedRows().has(getRowKey(row, i))\"\n                (checkedChange)=\"toggleRow(row, i)\"\n                aria-label=\"Seleccionar fila\"\n              />\n            </div>\n          }\n\n          <!-- Data columns -->\n          @for (col of columns(); track col.key) {\n            <div\n              class=\"sui-table__cell\"\n              [class.sui-table__cell--center]=\"col.align === 'center'\"\n              [class.sui-table__cell--right]=\"col.align === 'right'\"\n              [class.sui-table__cell--sticky]=\"col.sticky\"\n              [class.sui-table__cell--leading]=\"cellPriority(col) === 'leading'\"\n              [class.sui-table__cell--passive]=\"cellPriority(col) === 'passive'\"\n              [class.sui-table__cell--none]=\"cellPriority(col) === 'none'\"\n              [style.width]=\"col.width ?? null\"\n              [style.min-width]=\"colMinWidth(col)\"\n              [style.max-width]=\"col.maxWidth ?? null\"\n              [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n            >\n              <!-- Custom template via SuiTableCellDirective -->\n              @if (getTemplate(col.key); as tmpl) {\n                <ng-container *ngTemplateOutlet=\"tmpl.templateRef; context: { $implicit: row }\"></ng-container>\n              } @else if (getCellDescription(row, col); as desc) {\n                <!-- Texto + sub-texto (Figma Priority=Leading, 2da l\u00EDnea XSmall) -->\n                <span class=\"sui-table__cell-block\">\n                  <span\n                    class=\"sui-table__cell-text\"\n                    [class.sui-table__cell-text--truncate]=\"col.truncate\"\n                    [suiTooltip]=\"getCellTooltip(row, col)\"\n                  >{{ getCellValue(row, col.key) }}</span>\n                  <span class=\"sui-table__cell-desc\">{{ desc }}</span>\n                </span>\n              } @else if (col.truncate) {\n                <!-- Texto truncado + tooltip con el valor completo -->\n                <span\n                  class=\"sui-table__cell-text sui-table__cell-text--truncate\"\n                  [suiTooltip]=\"getCellTooltip(row, col)\"\n                >{{ getCellValue(row, col.key) }}</span>\n              } @else {\n                <!-- Default text rendering -->\n                <span class=\"sui-table__cell-text\">{{ getCellValue(row, col.key) }}</span>\n              }\n            </div>\n          }\n        </div>\n\n        <!-- Row divider (not after last row) -->\n        @if (i < rows().length - 1) {\n          <div class=\"sui-table__divider\"></div>\n        }\n      }\n    </div>\n  }\n\n</div>\n", styles: ["@charset \"UTF-8\";.mp-badge{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:6px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid transparent;line-height:1}.mp-badge--green{background:var(--admin-success-bg, #dcfce7);color:var(--admin-success, #16a34a)}.mp-badge--red{background:var(--admin-error-bg, #fee2e2);color:var(--admin-error, #ef4444)}.mp-badge--orange{background:#fff7ed;color:#c2410c;border-color:#fed7aa}.mp-badge--blue{background:var(--admin-info-bg, #dbeafe);color:#2563eb}.mp-badge--gray{background:var(--admin-bg-tertiary, #f3f4f6);color:var(--admin-text-tertiary, #6b7280)}.mp-badge--sm{height:20px;padding:0 8px;font-size:11px}.mp-action-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 12px;border-radius:6px;border:1px solid transparent;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .15s ease}.mp-action-btn:disabled{opacity:.5;cursor:not-allowed}.mp-action-btn--activate{background:var(--admin-success, #16a34a);color:#fff}.mp-action-btn--activate:hover{background:#15803d}.mp-action-btn--renew{background:var(--admin-info, #3b82f6);color:#fff}.mp-action-btn--renew:hover{background:#2563eb}.mp-action-btn--suspend{background:var(--admin-bg-primary, #fff);color:var(--admin-error, #ef4444);border-color:#fca5a5}.mp-action-btn--suspend:hover{background:var(--admin-error-bg, #fee2e2)}.mp-action-btn--danger{background:#dc2626;color:#fff;border:none}.mp-action-btn--danger:hover{background:#b91c1c}.mp-action-btn--outline{background:var(--admin-bg-primary, #fff);color:var(--admin-text-secondary, #374151);border-color:var(--admin-border-primary, #e5e7eb)}.mp-action-btn--outline:hover{background:var(--admin-bg-hover, #f9fafb)}.mp-action-btn--icon{width:28px;height:28px;padding:0;background:transparent;color:var(--admin-text-muted, #9ca3af);border:none}.mp-action-btn--icon:hover{background:var(--admin-bg-hover, #f9fafb);color:var(--admin-text-primary, #171717)}.mp-action-btn--icon-danger{width:28px;height:28px;padding:0;background:transparent;color:#dc2626;border:none}.mp-action-btn--icon-danger:hover{background:var(--admin-error-bg, #fee2e2);color:#dc2626}:host{display:block;width:100%}.sui-table{display:flex;flex-direction:column;width:100%;overflow:hidden;font-family:var(--sui-font-sans);font-feature-settings:\"ss11\" 1,\"calt\" 0,\"liga\" 0;font-optical-sizing:auto}:host([data-sui-sticky]) .sui-table__header,:host([data-sui-sticky]) .sui-table__row{overflow:visible}@media(max-width:767px){.sui-table{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:var(--sui-bg-white-0);overscroll-behavior-y:none;display:grid;grid-template-columns:max-content}}@media(max-width:767px)and (max-width:767px){.sui-table{scrollbar-width:none}.sui-table::-webkit-scrollbar{display:none;width:0;height:0}}@media(max-width:767px){.sui-table .sui-table__header,.sui-table .sui-table__body{min-width:100%}.sui-table .sui-table__cell,.sui-table .sui-table__header-cell{min-width:120px}.sui-table .sui-table__cell--checkbox,.sui-table .sui-table__header-cell--checkbox{min-width:44px}.sui-table .sui-table__header-cell--empty{min-width:0}}:host([data-sui-sticky]) .sui-table{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:var(--sui-bg-white-0);overscroll-behavior-y:none}@media(max-width:767px){:host([data-sui-sticky]) .sui-table{scrollbar-width:none}:host([data-sui-sticky]) .sui-table::-webkit-scrollbar{display:none;width:0;height:0}}:host([data-sui-sticky]) .sui-table{display:grid;grid-template-columns:max-content}:host([data-sui-sticky]) .sui-table .sui-table__header,:host([data-sui-sticky]) .sui-table .sui-table__body{min-width:100%}:host([data-sui-sticky]) .sui-table .sui-table__cell,:host([data-sui-sticky]) .sui-table .sui-table__header-cell{min-width:120px}:host([data-sui-sticky]) .sui-table .sui-table__cell--checkbox,:host([data-sui-sticky]) .sui-table .sui-table__header-cell--checkbox{min-width:44px}:host([data-sui-sticky]) .sui-table .sui-table__header-cell--empty{min-width:0}.sui-table__header{display:flex;align-items:flex-start;background:var(--sui-bg-weak-50);border-radius:var(--sui-radius-8);overflow:hidden;min-height:36px;flex-shrink:0}.sui-table__header-cell{display:flex;align-items:center;gap:2px;padding:8px 12px;min-width:0;box-sizing:border-box;white-space:nowrap;overflow:hidden;font-size:var(--sui-type-paragraph-sm-size);font-weight:var(--sui-type-paragraph-sm-weight);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing);color:var(--sui-text-sub-600)}.sui-table__header-cell--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.sui-table__header-cell--sortable:hover{color:var(--sui-text-strong-950)}.sui-table__header-cell--sortable:hover .sui-table__sort-icon{opacity:1}.sui-table__header-cell--sortable:focus-visible{outline:2px solid var(--sui-primary-alpha-10);outline-offset:-2px;border-radius:var(--sui-radius-4)}.sui-table__header-cell--sorted{color:var(--sui-text-strong-950)}.sui-table__header-cell--disabled{cursor:default;pointer-events:none;color:var(--sui-text-disabled-300)}.sui-table__header-cell--disabled .sui-table__sort-icon{color:var(--sui-text-disabled-300);opacity:1}.sui-table__header-cell--empty{flex-shrink:0;padding:0}.sui-table__header-cell--center{justify-content:center}.sui-table__header-cell--right{justify-content:flex-end}.sui-table__header-cell--checkbox{flex:0 0 44px;justify-content:center}.sui-table__header-cell--sticky{position:sticky;left:0;z-index:2;background:var(--sui-bg-weak-50)}.sui-table__header-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:1;min-width:0}.sui-table__sort-icon{display:inline-flex;align-items:center;flex-shrink:0;color:var(--sui-text-soft-400);opacity:.6;transition:opacity var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out)}.sui-table__sort-icon--active{color:var(--sui-text-strong-950);opacity:1}.sui-table__body{display:flex;flex-direction:column;width:100%}.sui-table__row{display:flex;align-items:center;width:100%;border-radius:var(--sui-radius-12);overflow:hidden;cursor:pointer;transition:background-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out);box-sizing:border-box}@media(hover:hover)and (pointer:fine){.sui-table__row:hover,.sui-table__row:hover .sui-table__cell{background:var(--sui-bg-weak-50)}}.sui-table__row:active,.sui-table__row:active .sui-table__cell{background:var(--sui-bg-weak-50)}.sui-table__row--selected{background:var(--sui-primary-alpha-10)}.sui-table__row--selected:hover{background:var(--sui-primary-alpha-16)}.sui-table__row--striped{background:var(--sui-bg-weak-25)}.sui-table__row--skeleton{pointer-events:none;cursor:default}.sui-table__row--skeleton:hover{background:transparent}.sui-table__row--skeleton:hover .sui-table__cell{background:var(--sui-bg-white-0)}:host([data-sui-size=medium]) .sui-table__cell{min-height:64px;padding:12px 20px 12px 12px}:host([data-sui-size=small]) .sui-table__cell{min-height:48px;padding:8px 16px 8px 12px}:host([data-sui-size=large]) .sui-table__cell{min-height:80px;padding:16px 20px 16px 12px}:host([data-sui-size=xlarge]) .sui-table__cell{min-height:96px;padding:20px 20px 20px 12px}.sui-table__cell{display:flex;align-items:center;gap:12px;min-width:0;overflow:hidden;box-sizing:border-box;background:var(--sui-bg-white-0);transition:background-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out);font-size:var(--sui-type-paragraph-sm-size);font-weight:var(--sui-type-paragraph-sm-weight);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing);color:var(--sui-text-strong-950)}.sui-table__cell--center{justify-content:center}.sui-table__cell--right{justify-content:flex-end}.sui-table__cell--checkbox{flex:0 0 44px;justify-content:center;padding:0 12px}.sui-table__cell--leading{font-weight:var(--sui-type-label-sm-weight);color:var(--sui-text-strong-950)}.sui-table__cell--passive{color:var(--sui-text-sub-600);font-weight:var(--sui-type-paragraph-sm-weight)}.sui-table__cell--sticky{position:sticky;left:0;z-index:1;background:var(--sui-bg-white-0)}.sui-table__row--selected .sui-table__cell{background:transparent}.sui-table__row--selected .sui-table__cell.sui-table__cell--sticky{background:var(--sui-primary-alpha-10)}.sui-table__cell-text{min-width:0}.sui-table__cell-text--truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;display:block}.sui-table__cell-block{display:flex;flex-direction:column;min-width:0}.sui-table__cell-desc{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--sui-type-paragraph-xs-size);font-weight:var(--sui-type-paragraph-xs-weight);line-height:var(--sui-type-paragraph-xs-line);letter-spacing:var(--sui-type-paragraph-xs-spacing);color:var(--sui-text-sub-600)}.sui-table__cell--leading .sui-table__cell-text{font-weight:var(--sui-type-label-sm-weight)}.sui-table__cell--passive .sui-table__cell-text{font-weight:inherit;color:inherit}:host ::ng-deep .sui-table__leading-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;padding:10px;box-sizing:border-box;border-radius:var(--sui-radius-full);background:var(--sui-bg-white-0);border:1px solid var(--sui-stroke-soft-200);box-shadow:var(--sui-regular-shadow-x-small);color:var(--sui-text-sub-600)}:host([data-sui-size=small]) ::ng-deep .sui-table__leading-icon{width:32px;height:32px;padding:6px}.sui-table__divider{width:100%;padding:1.5px 0;flex-shrink:0;background:var(--sui-bg-white-0)}.sui-table__divider:after{content:\"\";display:block;height:1px;background:var(--sui-stroke-soft-200)}.sui-table__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;gap:12px;text-align:center}.sui-table__empty-icon{color:var(--sui-text-disabled-300)}.sui-table__empty-msg{margin:0;font-size:var(--sui-type-paragraph-sm-size);line-height:var(--sui-type-paragraph-sm-line);color:var(--sui-text-sub-600)}.sui-table__skeleton-box{display:block;height:14px;width:100%;max-width:180px;border-radius:var(--sui-radius-4);background:linear-gradient(90deg,var(--sui-bg-soft-200) 25%,var(--sui-bg-weak-50) 50%,var(--sui-bg-soft-200) 75%);background-size:400% 100%;animation:sui-skeleton-pulse 1.4s ease-in-out infinite}.sui-table__skeleton-box--sm{width:20px;max-width:20px;height:20px;border-radius:var(--sui-radius-4)}@keyframes sui-skeleton-pulse{0%{background-position:100% 50%}to{background-position:0% 50%}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], rowKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowKey", required: false }] }], selectedRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedRows", required: false }] }, { type: i0.Output, args: ["selectedRowsChange"] }], sortKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortKey", required: false }] }, { type: i0.Output, args: ["sortKeyChange"] }], sortDir: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortDir", required: false }] }, { type: i0.Output, args: ["sortDirChange"] }], rowClicked: [{ type: i0.Output, args: ["rowClicked"] }], sortChanged: [{ type: i0.Output, args: ["sortChanged"] }], scrollEl: [{ type: i0.ViewChild, args: ['scrollEl', { isSignal: true }] }], cellTemplates: [{
+                    }, template: "<!-- \u2550\u2550 SUI Table \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<!-- Pista de scroll (canon, due\u00F1o 05-10-2026): degradado + flechas con mouse.\n     Con columna fija no hay pista a la izquierda: la columna pegada ya avisa. -->\n<sui-pista-de-scroll class=\"sui-table__pista\" [ocultarInicio]=\"hasStickyColumn()\">\n<div class=\"sui-table\" #scrollEl [suiPistaDeScroll]=\"pistaDeScroll()\">\n\n  <!-- Header -->\n  <div class=\"sui-table__header\">\n    <!-- Checkbox header (selectable mode) \u2014 compone sui-checkbox (canon) -->\n    @if (selectable()) {\n      <div class=\"sui-table__header-cell sui-table__header-cell--checkbox\">\n        <sui-checkbox\n          [checked]=\"allSelected\"\n          [indeterminate]=\"partialSelected\"\n          (checkedChange)=\"toggleAll()\"\n          (click)=\"$event.stopPropagation()\"\n          aria-label=\"Seleccionar todas las filas\"\n        />\n      </div>\n    }\n\n    @for (col of columns(); track col.key) {\n      <div\n        class=\"sui-table__header-cell\"\n        [class.sui-table__header-cell--sortable]=\"col.sortable && !col.disabled\"\n        [class.sui-table__header-cell--sorted]=\"isSortActive(col.key)\"\n        [class.sui-table__header-cell--disabled]=\"col.disabled\"\n        [class.sui-table__header-cell--center]=\"col.align === 'center'\"\n        [class.sui-table__header-cell--right]=\"col.align === 'right'\"\n        [class.sui-table__header-cell--empty]=\"!col.label\"\n        [class.sui-table__header-cell--sticky]=\"col.sticky\"\n        [style.width]=\"col.width ?? null\"\n        [style.min-width]=\"colMinWidth(col)\"\n        [style.max-width]=\"col.maxWidth ?? null\"\n        [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n        (click)=\"!col.disabled && onSort(col)\"\n        [attr.tabindex]=\"col.sortable && !col.disabled ? '0' : null\"\n        [attr.role]=\"col.sortable ? 'columnheader' : null\"\n        [attr.aria-disabled]=\"col.disabled ? 'true' : null\"\n        [attr.aria-sort]=\"col.sortable ? (isSortActive(col.key) ? (sortDir() === 'asc' ? 'ascending' : 'descending') : 'none') : null\"\n        (keydown.enter)=\"!col.disabled && onSort(col)\"\n        (keydown.space)=\"$event.preventDefault(); !col.disabled && onSort(col)\"\n      >\n        @if (col.label) {\n          <span class=\"sui-table__header-label\">{{ col.label }}</span>\n        }\n        @if (col.sortable) {\n          <span class=\"sui-table__sort-icon\" [class.sui-table__sort-icon--active]=\"isSortActive(col.key)\">\n            @if (!isSortActive(col.key)) {\n              <sui-icon name=\"expand-up-down-line\" [size]=\"20\" />\n            } @else if (sortDir() === 'asc') {\n              <sui-icon name=\"arrow-up-s-fill\" [size]=\"20\" />\n            } @else {\n              <sui-icon name=\"arrow-down-s-fill\" [size]=\"20\" />\n            }\n          </span>\n        }\n      </div>\n    }\n  </div>\n\n  <!-- Body: Loading skeleton -->\n  @if (loading()) {\n    <div class=\"sui-table__body\">\n      @for (sk of skeletonRows; track sk) {\n        <div class=\"sui-table__row sui-table__row--skeleton\">\n          @if (selectable()) {\n            <div class=\"sui-table__cell sui-table__cell--checkbox\">\n              <span class=\"sui-table__skeleton-box sui-table__skeleton-box--sm\"></span>\n            </div>\n          }\n          @for (col of columns(); track col.key) {\n            <div\n              class=\"sui-table__cell\"\n              [class.sui-table__cell--sticky]=\"col.sticky\"\n              [style.width]=\"col.width ?? null\"\n              [style.min-width]=\"colMinWidth(col)\"\n              [style.max-width]=\"col.maxWidth ?? null\"\n              [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n            >\n              <span class=\"sui-table__skeleton-box\"></span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  }\n\n  <!-- Body: Empty state -->\n  @else if (rows().length === 0) {\n    <div class=\"sui-table__empty\">\n      <sui-icon name=\"inbox-line\" [size]=\"40\" class=\"sui-table__empty-icon\" />\n      <p class=\"sui-table__empty-msg\">{{ emptyMessage() }}</p>\n    </div>\n  }\n\n  <!-- Body: Data rows -->\n  @else {\n    <div class=\"sui-table__body\">\n      @for (row of rows(); track getRowKey(row, $index); let i = $index) {\n        <div\n          class=\"sui-table__row\"\n          [class.sui-table__row--selected]=\"selectedRows().has(getRowKey(row, i))\"\n          [class.sui-table__row--striped]=\"striped() && i % 2 === 1\"\n          (click)=\"rowClicked.emit(row)\"\n        >\n          <!-- Checkbox column \u2014 compone sui-checkbox (canon) -->\n          @if (selectable()) {\n            <div class=\"sui-table__cell sui-table__cell--checkbox\" (click)=\"$event.stopPropagation()\">\n              <sui-checkbox\n                [checked]=\"selectedRows().has(getRowKey(row, i))\"\n                (checkedChange)=\"toggleRow(row, i)\"\n                aria-label=\"Seleccionar fila\"\n              />\n            </div>\n          }\n\n          <!-- Data columns -->\n          @for (col of columns(); track col.key) {\n            <div\n              class=\"sui-table__cell\"\n              [class.sui-table__cell--center]=\"col.align === 'center'\"\n              [class.sui-table__cell--right]=\"col.align === 'right'\"\n              [class.sui-table__cell--sticky]=\"col.sticky\"\n              [class.sui-table__cell--leading]=\"cellPriority(col) === 'leading'\"\n              [class.sui-table__cell--passive]=\"cellPriority(col) === 'passive'\"\n              [class.sui-table__cell--none]=\"cellPriority(col) === 'none'\"\n              [style.width]=\"col.width ?? null\"\n              [style.min-width]=\"colMinWidth(col)\"\n              [style.max-width]=\"col.maxWidth ?? null\"\n              [style.flex]=\"col.width ? '0 0 ' + col.width : '1'\"\n            >\n              <!-- Custom template via SuiTableCellDirective -->\n              @if (getTemplate(col.key); as tmpl) {\n                <ng-container *ngTemplateOutlet=\"tmpl.templateRef; context: { $implicit: row }\"></ng-container>\n              } @else if (getCellDescription(row, col); as desc) {\n                <!-- Texto + sub-texto (Figma Priority=Leading, 2da l\u00EDnea XSmall) -->\n                <span class=\"sui-table__cell-block\">\n                  <span\n                    class=\"sui-table__cell-text\"\n                    [class.sui-table__cell-text--truncate]=\"col.truncate\"\n                    [suiTooltip]=\"getCellTooltip(row, col)\"\n                  >{{ getCellValue(row, col.key) }}</span>\n                  <span class=\"sui-table__cell-desc\">{{ desc }}</span>\n                </span>\n              } @else if (col.truncate) {\n                <!-- Texto truncado + tooltip con el valor completo -->\n                <span\n                  class=\"sui-table__cell-text sui-table__cell-text--truncate\"\n                  [suiTooltip]=\"getCellTooltip(row, col)\"\n                >{{ getCellValue(row, col.key) }}</span>\n              } @else {\n                <!-- Default text rendering -->\n                <span class=\"sui-table__cell-text\">{{ getCellValue(row, col.key) }}</span>\n              }\n            </div>\n          }\n        </div>\n\n        <!-- Row divider (not after last row) -->\n        @if (i < rows().length - 1) {\n          <div class=\"sui-table__divider\"></div>\n        }\n      }\n    </div>\n  }\n\n</div>\n</sui-pista-de-scroll>\n", styles: ["@charset \"UTF-8\";.mp-badge{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:6px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid transparent;line-height:1}.mp-badge--green{background:var(--admin-success-bg, #dcfce7);color:var(--admin-success, #16a34a)}.mp-badge--red{background:var(--admin-error-bg, #fee2e2);color:var(--admin-error, #ef4444)}.mp-badge--orange{background:#fff7ed;color:#c2410c;border-color:#fed7aa}.mp-badge--blue{background:var(--admin-info-bg, #dbeafe);color:#2563eb}.mp-badge--gray{background:var(--admin-bg-tertiary, #f3f4f6);color:var(--admin-text-tertiary, #6b7280)}.mp-badge--sm{height:20px;padding:0 8px;font-size:11px}.mp-action-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 12px;border-radius:6px;border:1px solid transparent;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .15s ease}.mp-action-btn:disabled{opacity:.5;cursor:not-allowed}.mp-action-btn--activate{background:var(--admin-success, #16a34a);color:#fff}.mp-action-btn--activate:hover{background:#15803d}.mp-action-btn--renew{background:var(--admin-info, #3b82f6);color:#fff}.mp-action-btn--renew:hover{background:#2563eb}.mp-action-btn--suspend{background:var(--admin-bg-primary, #fff);color:var(--admin-error, #ef4444);border-color:#fca5a5}.mp-action-btn--suspend:hover{background:var(--admin-error-bg, #fee2e2)}.mp-action-btn--danger{background:#dc2626;color:#fff;border:none}.mp-action-btn--danger:hover{background:#b91c1c}.mp-action-btn--outline{background:var(--admin-bg-primary, #fff);color:var(--admin-text-secondary, #374151);border-color:var(--admin-border-primary, #e5e7eb)}.mp-action-btn--outline:hover{background:var(--admin-bg-hover, #f9fafb)}.mp-action-btn--icon{width:28px;height:28px;padding:0;background:transparent;color:var(--admin-text-muted, #9ca3af);border:none}.mp-action-btn--icon:hover{background:var(--admin-bg-hover, #f9fafb);color:var(--admin-text-primary, #171717)}.mp-action-btn--icon-danger{width:28px;height:28px;padding:0;background:transparent;color:#dc2626;border:none}.mp-action-btn--icon-danger:hover{background:var(--admin-error-bg, #fee2e2);color:#dc2626}:host{display:block;width:100%}.sui-table__pista{width:100%;--sui-pista-de-scroll-flecha-top: 18px;--sui-pista-de-scroll-flecha-size: 28px}.sui-table{display:flex;flex-direction:column;width:100%;overflow:hidden;font-family:var(--sui-font-sans);font-feature-settings:\"ss11\" 1,\"calt\" 0,\"liga\" 0;font-optical-sizing:auto}:host([data-sui-sticky]) .sui-table__header,:host([data-sui-sticky]) .sui-table__row{overflow:visible}@media(max-width:767px){.sui-table{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:var(--sui-bg-white-0);overscroll-behavior-y:none;display:grid;grid-template-columns:max-content}}@media(max-width:767px)and (max-width:767px){.sui-table{scrollbar-width:none}.sui-table::-webkit-scrollbar{display:none;width:0;height:0}}@media(max-width:767px){.sui-table .sui-table__header,.sui-table .sui-table__body{min-width:100%}.sui-table .sui-table__cell,.sui-table .sui-table__header-cell{min-width:120px}.sui-table .sui-table__cell--checkbox,.sui-table .sui-table__header-cell--checkbox{min-width:44px}.sui-table .sui-table__header-cell--empty{min-width:0}}:host([data-sui-sticky]) .sui-table{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:var(--sui-bg-white-0);overscroll-behavior-y:none}@media(max-width:767px){:host([data-sui-sticky]) .sui-table{scrollbar-width:none}:host([data-sui-sticky]) .sui-table::-webkit-scrollbar{display:none;width:0;height:0}}:host([data-sui-sticky]) .sui-table{display:grid;grid-template-columns:max-content}:host([data-sui-sticky]) .sui-table .sui-table__header,:host([data-sui-sticky]) .sui-table .sui-table__body{min-width:100%}:host([data-sui-sticky]) .sui-table .sui-table__cell,:host([data-sui-sticky]) .sui-table .sui-table__header-cell{min-width:120px}:host([data-sui-sticky]) .sui-table .sui-table__cell--checkbox,:host([data-sui-sticky]) .sui-table .sui-table__header-cell--checkbox{min-width:44px}:host([data-sui-sticky]) .sui-table .sui-table__header-cell--empty{min-width:0}.sui-table__header{display:flex;align-items:flex-start;background:var(--sui-bg-weak-50);border-radius:var(--sui-radius-8);overflow:hidden;min-height:36px;flex-shrink:0}.sui-table__header-cell{display:flex;align-items:center;gap:2px;padding:8px 12px;min-width:0;box-sizing:border-box;white-space:nowrap;overflow:hidden;font-size:var(--sui-type-paragraph-sm-size);font-weight:var(--sui-type-paragraph-sm-weight);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing);color:var(--sui-text-sub-600)}.sui-table__header-cell--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.sui-table__header-cell--sortable:hover{color:var(--sui-text-strong-950)}.sui-table__header-cell--sortable:hover .sui-table__sort-icon{opacity:1}.sui-table__header-cell--sortable:focus-visible{outline:2px solid var(--sui-primary-alpha-10);outline-offset:-2px;border-radius:var(--sui-radius-4)}.sui-table__header-cell--sorted{color:var(--sui-text-strong-950)}.sui-table__header-cell--disabled{cursor:default;pointer-events:none;color:var(--sui-text-disabled-300)}.sui-table__header-cell--disabled .sui-table__sort-icon{color:var(--sui-text-disabled-300);opacity:1}.sui-table__header-cell--empty{flex-shrink:0;padding:0}.sui-table__header-cell--center{justify-content:center}.sui-table__header-cell--right{justify-content:flex-end}.sui-table__header-cell--checkbox{flex:0 0 44px;justify-content:center}.sui-table__header-cell--sticky{position:sticky;left:0;z-index:2;background:var(--sui-bg-weak-50)}.sui-table__header-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:1;min-width:0}.sui-table__sort-icon{display:inline-flex;align-items:center;flex-shrink:0;color:var(--sui-text-soft-400);opacity:.6;transition:opacity var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out)}.sui-table__sort-icon--active{color:var(--sui-text-strong-950);opacity:1}.sui-table__body{display:flex;flex-direction:column;width:100%}.sui-table__row{display:flex;align-items:center;width:100%;border-radius:var(--sui-radius-12);overflow:hidden;cursor:pointer;transition:background-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out);box-sizing:border-box}@media(hover:hover)and (pointer:fine){.sui-table__row:hover,.sui-table__row:hover .sui-table__cell{background:var(--sui-bg-weak-50)}}.sui-table__row:active,.sui-table__row:active .sui-table__cell{background:var(--sui-bg-weak-50)}.sui-table__row--selected{background:var(--sui-primary-alpha-10)}.sui-table__row--selected:hover{background:var(--sui-primary-alpha-16)}.sui-table__row--striped{background:var(--sui-bg-weak-25)}.sui-table__row--skeleton{pointer-events:none;cursor:default}.sui-table__row--skeleton:hover{background:transparent}.sui-table__row--skeleton:hover .sui-table__cell{background:var(--sui-bg-white-0)}:host([data-sui-size=medium]) .sui-table__cell{min-height:64px;padding:12px 20px 12px 12px}:host([data-sui-size=small]) .sui-table__cell{min-height:48px;padding:8px 16px 8px 12px}:host([data-sui-size=large]) .sui-table__cell{min-height:80px;padding:16px 20px 16px 12px}:host([data-sui-size=xlarge]) .sui-table__cell{min-height:96px;padding:20px 20px 20px 12px}.sui-table__cell{display:flex;align-items:center;gap:12px;min-width:0;overflow:hidden;box-sizing:border-box;background:var(--sui-bg-white-0);transition:background-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out);font-size:var(--sui-type-paragraph-sm-size);font-weight:var(--sui-type-paragraph-sm-weight);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing);color:var(--sui-text-strong-950)}.sui-table__cell--center{justify-content:center}.sui-table__cell--right{justify-content:flex-end}.sui-table__cell--checkbox{flex:0 0 44px;justify-content:center;padding:0 12px}.sui-table__cell--leading{font-weight:var(--sui-type-label-sm-weight);color:var(--sui-text-strong-950)}.sui-table__cell--passive{color:var(--sui-text-sub-600);font-weight:var(--sui-type-paragraph-sm-weight)}.sui-table__cell--sticky{position:sticky;left:0;z-index:1;background:var(--sui-bg-white-0)}.sui-table__row--selected .sui-table__cell{background:transparent}.sui-table__row--selected .sui-table__cell.sui-table__cell--sticky{background:var(--sui-primary-alpha-10)}.sui-table__cell-text{min-width:0}.sui-table__cell-text--truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;display:block}.sui-table__cell-block{display:flex;flex-direction:column;min-width:0}.sui-table__cell-desc{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--sui-type-paragraph-xs-size);font-weight:var(--sui-type-paragraph-xs-weight);line-height:var(--sui-type-paragraph-xs-line);letter-spacing:var(--sui-type-paragraph-xs-spacing);color:var(--sui-text-sub-600)}.sui-table__cell--leading .sui-table__cell-text{font-weight:var(--sui-type-label-sm-weight)}.sui-table__cell--passive .sui-table__cell-text{font-weight:inherit;color:inherit}:host ::ng-deep .sui-table__leading-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;padding:10px;box-sizing:border-box;border-radius:var(--sui-radius-full);background:var(--sui-bg-white-0);border:1px solid var(--sui-stroke-soft-200);box-shadow:var(--sui-regular-shadow-x-small);color:var(--sui-text-sub-600)}:host([data-sui-size=small]) ::ng-deep .sui-table__leading-icon{width:32px;height:32px;padding:6px}.sui-table__divider{width:100%;padding:1.5px 0;flex-shrink:0;background:var(--sui-bg-white-0)}.sui-table__divider:after{content:\"\";display:block;height:1px;background:var(--sui-stroke-soft-200)}.sui-table__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;gap:12px;text-align:center}.sui-table__empty-icon{color:var(--sui-text-disabled-300)}.sui-table__empty-msg{margin:0;font-size:var(--sui-type-paragraph-sm-size);line-height:var(--sui-type-paragraph-sm-line);color:var(--sui-text-sub-600)}.sui-table__skeleton-box{display:block;height:14px;width:100%;max-width:180px;border-radius:var(--sui-radius-4);background:linear-gradient(90deg,var(--sui-bg-soft-200) 25%,var(--sui-bg-weak-50) 50%,var(--sui-bg-soft-200) 75%);background-size:400% 100%;animation:sui-skeleton-pulse 1.4s ease-in-out infinite}.sui-table__skeleton-box--sm{width:20px;max-width:20px;height:20px;border-radius:var(--sui-radius-4)}@keyframes sui-skeleton-pulse{0%{background-position:100% 50%}to{background-position:0% 50%}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], rowKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowKey", required: false }] }], pistaDeScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "pistaDeScroll", required: false }] }], selectedRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedRows", required: false }] }, { type: i0.Output, args: ["selectedRowsChange"] }], sortKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortKey", required: false }] }, { type: i0.Output, args: ["sortKeyChange"] }], sortDir: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortDir", required: false }] }, { type: i0.Output, args: ["sortDirChange"] }], rowClicked: [{ type: i0.Output, args: ["rowClicked"] }], sortChanged: [{ type: i0.Output, args: ["sortChanged"] }], scrollEl: [{ type: i0.ViewChild, args: ['scrollEl', { isSignal: true }] }], pista: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SuiPistaDeScroll), { isSignal: true }] }], cellTemplates: [{
                 type: ContentChildren,
                 args: [SuiTableCellDirective]
             }] } });