@caribeng/ui 22.4.0 → 22.6.0

package/fesm2022/{caribeng-ui-caribe-off-canvas.mjs → caribeng-ui-off-canvas.mjs}

@@ -5,7 +5,7 @@ import { A11yModule } from '@angular/cdk/a11y';
 import { injectCbTranslation, cbOverlayFocus } from '@caribeng/ui';
 
 /**
- * Off-canvas de Caribe Design: panel lateral deslizable con cabecera, botón de
+ * Off-canvas: panel lateral deslizable con cabecera, botón de
  * cierre y contenido proyectado.
  *
  * @example
@@ -31,64 +31,64 @@ class CbOffCanvas {
         cbOverlayFocus({ open: this.open, initialFocus: () => this.closeBtn()?.nativeElement });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbOffCanvas, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbOffCanvas, isStandalone: true, selector: "cb-off-canvas", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { classAttribute: "cb-off-canvas-host" }, viewQueries: [{ propertyName: "closeBtn", first: true, predicate: ["closeBtn"], descendants: true, isSignal: true }], ngImport: i0, template: `
-    @if (open()) {
-      <aside
-        class="cb-off-canvas cb-off-canvas--{{ position() }}"
-        role="dialog"
-        aria-modal="true"
-        [attr.aria-label]="(title() ?? t().sidePanel)"
-        cdkTrapFocus
-        (keydown.escape)="open.set(false)"
-      >
-        <div class="cb-off-canvas__header">
-          <strong class="cb-off-canvas__title">{{ (title() ?? t().sidePanel) }}</strong>
-          <button
-            #closeBtn
-            type="button"
-            class="cb-off-canvas__close"
-            [attr.aria-label]="t().close"
-            (click)="open.set(false)"
-          >
-            <span aria-hidden="true">×</span>
-          </button>
-        </div>
-        <div class="cb-off-canvas__body">
-          <ng-content />
-        </div>
-      </aside>
-    }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbOffCanvas, isStandalone: true, selector: "cb-off-canvas", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { classAttribute: "cb-off-canvas-host" }, viewQueries: [{ propertyName: "closeBtn", first: true, predicate: ["closeBtn"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    @if (open()) {
+      <aside
+        class="cb-off-canvas cb-off-canvas--{{ position() }}"
+        role="dialog"
+        aria-modal="true"
+        [attr.aria-label]="(title() ?? t().sidePanel)"
+        cdkTrapFocus
+        (keydown.escape)="open.set(false)"
+      >
+        <div class="cb-off-canvas__header">
+          <strong class="cb-off-canvas__title">{{ (title() ?? t().sidePanel) }}</strong>
+          <button
+            #closeBtn
+            type="button"
+            class="cb-off-canvas__close"
+            [attr.aria-label]="t().close"
+            (click)="open.set(false)"
+          >
+            <span aria-hidden="true">×</span>
+          </button>
+        </div>
+        <div class="cb-off-canvas__body">
+          <ng-content />
+        </div>
+      </aside>
+    }
   `, isInline: true, styles: [":host{display:block}.cb-off-canvas{display:flex;flex-direction:column;box-sizing:border-box;width:100%;max-width:20rem;min-height:12rem;padding:var(--cb-space-4, 1rem);font-family:var(--cb-font-sans, inherit);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-0, #ffffff);border:1px solid var(--cb-color-border, #e2e8f0);border-radius:var(--cb-radius-lg, .75rem);box-shadow:var(--cb-shadow-lg, 0 12px 32px rgba(0, 0, 0, .18));animation:cb-off-canvas-in var(--cb-duration-normal, .2s) var(--cb-ease-out, ease-out)}.cb-off-canvas--bottom{max-width:none}.cb-off-canvas__header{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);margin-bottom:var(--cb-space-3, .75rem);padding-bottom:var(--cb-space-3, .75rem);border-bottom:1px solid var(--cb-color-border, #e2e8f0)}.cb-off-canvas__title{font-size:var(--cb-text-lg, 1rem);font-weight:var(--cb-font-weight-semibold, 600)}.cb-off-canvas__close{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;font-size:1.25rem;line-height:1;color:inherit;background:transparent;border:none;border-radius:var(--cb-radius-full, 999px);cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-off-canvas__close:hover{background-color:var(--cb-color-surface-100, #f1f5f9)}.cb-off-canvas__body{flex:1;font-size:var(--cb-text-sm, .875rem);color:var(--cb-color-text, #334155)}@keyframes cb-off-canvas-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}:host-context([data-theme=\"dark\"]) .cb-off-canvas{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-800, #1e293b);border-color:var(--cb-color-surface-600, #475569)}:host-context([data-theme=\"dark\"]) .cb-off-canvas__header{border-bottom-color:var(--cb-color-surface-600, #475569)}:host-context([data-theme=\"dark\"]) .cb-off-canvas__close:hover{background-color:var(--cb-color-surface-700, #334155)}:host-context([data-theme=\"dark\"]) .cb-off-canvas__body{color:var(--cb-color-surface-200, #e2e8f0)}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbOffCanvas, decorators: [{
             type: Component,
-            args: [{ selector: 'cb-off-canvas', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, imports: [A11yModule], host: { class: 'cb-off-canvas-host' }, template: `
-    @if (open()) {
-      <aside
-        class="cb-off-canvas cb-off-canvas--{{ position() }}"
-        role="dialog"
-        aria-modal="true"
-        [attr.aria-label]="(title() ?? t().sidePanel)"
-        cdkTrapFocus
-        (keydown.escape)="open.set(false)"
-      >
-        <div class="cb-off-canvas__header">
-          <strong class="cb-off-canvas__title">{{ (title() ?? t().sidePanel) }}</strong>
-          <button
-            #closeBtn
-            type="button"
-            class="cb-off-canvas__close"
-            [attr.aria-label]="t().close"
-            (click)="open.set(false)"
-          >
-            <span aria-hidden="true">×</span>
-          </button>
-        </div>
-        <div class="cb-off-canvas__body">
-          <ng-content />
-        </div>
-      </aside>
-    }
+            args: [{ selector: 'cb-off-canvas', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, imports: [A11yModule], host: { class: 'cb-off-canvas-host' }, template: `
+    @if (open()) {
+      <aside
+        class="cb-off-canvas cb-off-canvas--{{ position() }}"
+        role="dialog"
+        aria-modal="true"
+        [attr.aria-label]="(title() ?? t().sidePanel)"
+        cdkTrapFocus
+        (keydown.escape)="open.set(false)"
+      >
+        <div class="cb-off-canvas__header">
+          <strong class="cb-off-canvas__title">{{ (title() ?? t().sidePanel) }}</strong>
+          <button
+            #closeBtn
+            type="button"
+            class="cb-off-canvas__close"
+            [attr.aria-label]="t().close"
+            (click)="open.set(false)"
+          >
+            <span aria-hidden="true">×</span>
+          </button>
+        </div>
+        <div class="cb-off-canvas__body">
+          <ng-content />
+        </div>
+      </aside>
+    }
   `, styles: [":host{display:block}.cb-off-canvas{display:flex;flex-direction:column;box-sizing:border-box;width:100%;max-width:20rem;min-height:12rem;padding:var(--cb-space-4, 1rem);font-family:var(--cb-font-sans, inherit);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-0, #ffffff);border:1px solid var(--cb-color-border, #e2e8f0);border-radius:var(--cb-radius-lg, .75rem);box-shadow:var(--cb-shadow-lg, 0 12px 32px rgba(0, 0, 0, .18));animation:cb-off-canvas-in var(--cb-duration-normal, .2s) var(--cb-ease-out, ease-out)}.cb-off-canvas--bottom{max-width:none}.cb-off-canvas__header{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);margin-bottom:var(--cb-space-3, .75rem);padding-bottom:var(--cb-space-3, .75rem);border-bottom:1px solid var(--cb-color-border, #e2e8f0)}.cb-off-canvas__title{font-size:var(--cb-text-lg, 1rem);font-weight:var(--cb-font-weight-semibold, 600)}.cb-off-canvas__close{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;font-size:1.25rem;line-height:1;color:inherit;background:transparent;border:none;border-radius:var(--cb-radius-full, 999px);cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-off-canvas__close:hover{background-color:var(--cb-color-surface-100, #f1f5f9)}.cb-off-canvas__body{flex:1;font-size:var(--cb-text-sm, .875rem);color:var(--cb-color-text, #334155)}@keyframes cb-off-canvas-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}:host-context([data-theme=\"dark\"]) .cb-off-canvas{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-800, #1e293b);border-color:var(--cb-color-surface-600, #475569)}:host-context([data-theme=\"dark\"]) .cb-off-canvas__header{border-bottom-color:var(--cb-color-surface-600, #475569)}:host-context([data-theme=\"dark\"]) .cb-off-canvas__close:hover{background-color:var(--cb-color-surface-700, #334155)}:host-context([data-theme=\"dark\"]) .cb-off-canvas__body{color:var(--cb-color-surface-200, #e2e8f0)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], closeBtn: [{ type: i0.ViewChild, args: ['closeBtn', { isSignal: true }] }] } });
 

package/fesm2022/{caribeng-ui-caribe-onboarding.mjs → caribeng-ui-onboarding.mjs}

@@ -3,7 +3,7 @@ import { input, model, output, ViewEncapsulation, ChangeDetectionStrategy, Compo
 import { injectCbTranslation, cbFormat } from '@caribeng/ui';
 
 /**
- * Onboarding de Caribe Design: panel de bienvenida paso a paso con progreso y
+ * Onboarding: panel de bienvenida paso a paso con progreso y
  * navegación.
  *
  * @example
@@ -41,113 +41,113 @@ class CbOnboarding {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbOnboarding, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbOnboarding, isStandalone: true, selector: "cb-onboarding", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", index: "indexChange", currentStepIndex: "currentStepIndex" }, ngImport: i0, template: `
-    @if (visible() && steps().length) {
-      <section
-        class="cb-onboarding"
-        role="dialog"
-        [attr.aria-label]="t().onboarding"
-        (keydown.escape)="visible.set(false)"
-      >
-        <div class="cb-onboarding__dots" aria-hidden="true">
-          @for (step of steps(); track $index) {
-            <span
-              class="cb-onboarding__dot"
-              [class.cb-is-active]="$index === index()"
-            ></span>
-          }
-        </div>
-        <!-- Región viva: al cambiar de paso se anuncian el contador y el título. -->
-        <div class="cb-onboarding__announce" aria-live="polite" aria-atomic="true">
-          <span class="cb-onboarding__counter" aria-hidden="true">
-            {{ index() + 1 }} / {{ steps().length }}
-          </span>
-          <span class="cb-onboarding__sr">{{ fmt(t().stepOf, index() + 1, steps().length) }}</span>
-          <h2 class="cb-onboarding__title">{{ steps()[index()] }}</h2>
-        </div>
-        <div class="cb-onboarding__body"><ng-content /></div>
-        <div class="cb-onboarding__actions">
-          <button
-            type="button"
-            class="cb-onboarding__btn cb-onboarding__btn--ghost"
-            (click)="visible.set(false)"
-          >
-            {{ t().skip }}
-          </button>
-          <button
-            type="button"
-            class="cb-onboarding__btn"
-            (click)="previous()"
-            [disabled]="index() === 0"
-          >
-            {{ t().previous }}
-          </button>
-          <button
-            type="button"
-            class="cb-onboarding__btn cb-onboarding__btn--primary"
-            (click)="next()"
-          >
-            {{ index() === steps().length - 1 ? t().start : t().continue }}
-          </button>
-        </div>
-      </section>
-    }
-  `, isInline: true, styles: [":host{display:block;width:100%;max-width:24rem}.cb-onboarding{display:flex;flex-direction:column;gap:var(--cb-space-3, .75rem);box-sizing:border-box;padding:var(--cb-space-6, 1.5rem);font-family:var(--cb-font-sans, inherit);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-0, #ffffff);border:1px solid var(--cb-color-border, #e2e8f0);border-radius:var(--cb-radius-lg, .75rem);box-shadow:var(--cb-shadow-md, 0 8px 24px rgba(0, 0, 0, .12));text-align:center}.cb-onboarding__dots{display:flex;justify-content:center;gap:var(--cb-space-1, .3rem)}.cb-onboarding__dot{width:.5rem;height:.5rem;border-radius:var(--cb-radius-full, 999px);background-color:var(--cb-color-surface-300, #cbd5e1);transition:all var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-onboarding__dot.cb-is-active{width:1.25rem;background-color:var(--cb-color-primary-500, #10b981)}.cb-onboarding__announce{display:flex;flex-direction:column;gap:var(--cb-space-3, .75rem)}.cb-onboarding__counter{font-size:var(--cb-text-xs, .75rem);font-weight:var(--cb-font-weight-semibold, 600);color:var(--cb-color-text-muted, #64748b)}.cb-onboarding__title{margin:0;font-size:var(--cb-text-xl, 1.25rem);font-weight:var(--cb-font-weight-bold, 700)}.cb-onboarding__body{font-size:var(--cb-text-sm, .875rem);color:var(--cb-color-text, #334155);line-height:var(--cb-line-height-relaxed, 1.6)}.cb-onboarding__body:empty{display:none}.cb-onboarding__actions{display:flex;justify-content:center;gap:var(--cb-space-2, .5rem);margin-top:var(--cb-space-2, .5rem)}.cb-onboarding__btn{padding:var(--cb-space-2, .5rem) var(--cb-space-4, 1rem);font:inherit;font-size:var(--cb-text-sm, .875rem);font-weight:var(--cb-font-weight-semibold, 600);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-100, #f1f5f9);border:none;border-radius:var(--cb-radius-md, .5rem);cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-onboarding__btn:hover:not(:disabled){background-color:var(--cb-color-surface-200, #e2e8f0)}.cb-onboarding__btn:disabled{opacity:.4;cursor:not-allowed}.cb-onboarding__btn--ghost{background-color:transparent;color:var(--cb-color-text-muted, #64748b)}.cb-onboarding__btn--primary{color:var(--cb-color-primary-contrast, #ffffff);background-color:var(--cb-color-primary-600, #047857)}.cb-onboarding__btn--primary:hover:not(:disabled){background-color:var(--cb-color-primary-700, #065f46)}:host-context([data-theme=\"dark\"]) .cb-onboarding{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-800, #1e293b);border-color:var(--cb-color-surface-600, #475569)}:host-context([data-theme=\"dark\"]) .cb-onboarding__body{color:var(--cb-color-surface-200, #e2e8f0)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-700, #334155)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn--ghost{background-color:transparent;color:var(--cb-color-surface-300, #cbd5e1)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn--primary{background-color:var(--cb-color-primary-500, #10b981)}.cb-onboarding__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbOnboarding, isStandalone: true, selector: "cb-onboarding", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", index: "indexChange", currentStepIndex: "currentStepIndex" }, ngImport: i0, template: `
+    @if (visible() && steps().length) {
+      <section
+        class="cb-onboarding"
+        role="dialog"
+        [attr.aria-label]="t().onboarding"
+        (keydown.escape)="visible.set(false)"
+      >
+        <div class="cb-onboarding__dots" aria-hidden="true">
+          @for (step of steps(); track $index) {
+            <span
+              class="cb-onboarding__dot"
+              [class.cb-is-active]="$index === index()"
+            ></span>
+          }
+        </div>
+        <!-- Región viva: al cambiar de paso se anuncian el contador y el título. -->
+        <div class="cb-onboarding__announce" aria-live="polite" aria-atomic="true">
+          <span class="cb-onboarding__counter" aria-hidden="true">
+            {{ index() + 1 }} / {{ steps().length }}
+          </span>
+          <span class="cb-onboarding__sr">{{ fmt(t().stepOf, index() + 1, steps().length) }}</span>
+          <h2 class="cb-onboarding__title">{{ steps()[index()] }}</h2>
+        </div>
+        <div class="cb-onboarding__body"><ng-content /></div>
+        <div class="cb-onboarding__actions">
+          <button
+            type="button"
+            class="cb-onboarding__btn cb-onboarding__btn--ghost"
+            (click)="visible.set(false)"
+          >
+            {{ t().skip }}
+          </button>
+          <button
+            type="button"
+            class="cb-onboarding__btn"
+            (click)="previous()"
+            [disabled]="index() === 0"
+          >
+            {{ t().previous }}
+          </button>
+          <button
+            type="button"
+            class="cb-onboarding__btn cb-onboarding__btn--primary"
+            (click)="next()"
+          >
+            {{ index() === steps().length - 1 ? t().start : t().continue }}
+          </button>
+        </div>
+      </section>
+    }
+  `, isInline: true, styles: [":host{display:block;width:100%;max-width:24rem}.cb-onboarding{display:flex;flex-direction:column;gap:var(--cb-space-3, .75rem);box-sizing:border-box;padding:var(--cb-space-6, 1.5rem);font-family:var(--cb-font-sans, inherit);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-0, #ffffff);border:1px solid var(--cb-color-border, #e2e8f0);border-radius:var(--cb-radius-lg, .75rem);box-shadow:var(--cb-shadow-md, 0 8px 24px rgba(0, 0, 0, .12));text-align:center}.cb-onboarding__dots{display:flex;justify-content:center;gap:var(--cb-space-1, .3rem)}.cb-onboarding__dot{width:.5rem;height:.5rem;border-radius:var(--cb-radius-full, 999px);background-color:var(--cb-color-surface-300, #cbd5e1);transition:all var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-onboarding__dot.cb-is-active{width:1.25rem;background-color:var(--cb-color-primary-500, #10b981)}.cb-onboarding__announce{display:flex;flex-direction:column;gap:var(--cb-space-3, .75rem)}.cb-onboarding__counter{font-size:var(--cb-text-xs, .75rem);font-weight:var(--cb-font-weight-semibold, 600);color:var(--cb-color-text-muted, #64748b)}.cb-onboarding__title{margin:0;font-size:var(--cb-text-xl, 1.25rem);font-weight:var(--cb-font-weight-bold, 700)}.cb-onboarding__body{font-size:var(--cb-text-sm, .875rem);color:var(--cb-color-text, #334155);line-height:var(--cb-line-height-relaxed, 1.6)}.cb-onboarding__body:empty{display:none}.cb-onboarding__actions{display:flex;justify-content:center;gap:var(--cb-space-2, .5rem);margin-top:var(--cb-space-2, .5rem)}.cb-onboarding__btn{padding:var(--cb-space-2, .5rem) var(--cb-space-4, 1rem);font:inherit;font-size:var(--cb-text-sm, .875rem);font-weight:var(--cb-font-weight-semibold, 600);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-100, #f1f5f9);border:none;border-radius:var(--cb-radius-md, .5rem);cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-onboarding__btn:hover:not(:disabled){background-color:var(--cb-color-surface-200, #e2e8f0)}.cb-onboarding__btn:disabled{opacity:.4;cursor:not-allowed}.cb-onboarding__btn--ghost{background-color:transparent;color:var(--cb-color-text-muted, #64748b)}.cb-onboarding__btn--primary{color:#fff;background-color:var(--cb-color-primary-700, #047857)}.cb-onboarding__btn--primary:hover:not(:disabled){background-color:var(--cb-color-primary-700, #065f46)}:host-context([data-theme=\"dark\"]) .cb-onboarding{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-800, #1e293b);border-color:var(--cb-color-surface-600, #475569)}:host-context([data-theme=\"dark\"]) .cb-onboarding__body{color:var(--cb-color-surface-200, #e2e8f0)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-700, #334155)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn--ghost{background-color:transparent;color:var(--cb-color-surface-300, #cbd5e1)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn--primary{background-color:var(--cb-color-primary-500, #10b981)}.cb-onboarding__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbOnboarding, decorators: [{
             type: Component,
-            args: [{ selector: 'cb-onboarding', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, template: `
-    @if (visible() && steps().length) {
-      <section
-        class="cb-onboarding"
-        role="dialog"
-        [attr.aria-label]="t().onboarding"
-        (keydown.escape)="visible.set(false)"
-      >
-        <div class="cb-onboarding__dots" aria-hidden="true">
-          @for (step of steps(); track $index) {
-            <span
-              class="cb-onboarding__dot"
-              [class.cb-is-active]="$index === index()"
-            ></span>
-          }
-        </div>
-        <!-- Región viva: al cambiar de paso se anuncian el contador y el título. -->
-        <div class="cb-onboarding__announce" aria-live="polite" aria-atomic="true">
-          <span class="cb-onboarding__counter" aria-hidden="true">
-            {{ index() + 1 }} / {{ steps().length }}
-          </span>
-          <span class="cb-onboarding__sr">{{ fmt(t().stepOf, index() + 1, steps().length) }}</span>
-          <h2 class="cb-onboarding__title">{{ steps()[index()] }}</h2>
-        </div>
-        <div class="cb-onboarding__body"><ng-content /></div>
-        <div class="cb-onboarding__actions">
-          <button
-            type="button"
-            class="cb-onboarding__btn cb-onboarding__btn--ghost"
-            (click)="visible.set(false)"
-          >
-            {{ t().skip }}
-          </button>
-          <button
-            type="button"
-            class="cb-onboarding__btn"
-            (click)="previous()"
-            [disabled]="index() === 0"
-          >
-            {{ t().previous }}
-          </button>
-          <button
-            type="button"
-            class="cb-onboarding__btn cb-onboarding__btn--primary"
-            (click)="next()"
-          >
-            {{ index() === steps().length - 1 ? t().start : t().continue }}
-          </button>
-        </div>
-      </section>
-    }
-  `, styles: [":host{display:block;width:100%;max-width:24rem}.cb-onboarding{display:flex;flex-direction:column;gap:var(--cb-space-3, .75rem);box-sizing:border-box;padding:var(--cb-space-6, 1.5rem);font-family:var(--cb-font-sans, inherit);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-0, #ffffff);border:1px solid var(--cb-color-border, #e2e8f0);border-radius:var(--cb-radius-lg, .75rem);box-shadow:var(--cb-shadow-md, 0 8px 24px rgba(0, 0, 0, .12));text-align:center}.cb-onboarding__dots{display:flex;justify-content:center;gap:var(--cb-space-1, .3rem)}.cb-onboarding__dot{width:.5rem;height:.5rem;border-radius:var(--cb-radius-full, 999px);background-color:var(--cb-color-surface-300, #cbd5e1);transition:all var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-onboarding__dot.cb-is-active{width:1.25rem;background-color:var(--cb-color-primary-500, #10b981)}.cb-onboarding__announce{display:flex;flex-direction:column;gap:var(--cb-space-3, .75rem)}.cb-onboarding__counter{font-size:var(--cb-text-xs, .75rem);font-weight:var(--cb-font-weight-semibold, 600);color:var(--cb-color-text-muted, #64748b)}.cb-onboarding__title{margin:0;font-size:var(--cb-text-xl, 1.25rem);font-weight:var(--cb-font-weight-bold, 700)}.cb-onboarding__body{font-size:var(--cb-text-sm, .875rem);color:var(--cb-color-text, #334155);line-height:var(--cb-line-height-relaxed, 1.6)}.cb-onboarding__body:empty{display:none}.cb-onboarding__actions{display:flex;justify-content:center;gap:var(--cb-space-2, .5rem);margin-top:var(--cb-space-2, .5rem)}.cb-onboarding__btn{padding:var(--cb-space-2, .5rem) var(--cb-space-4, 1rem);font:inherit;font-size:var(--cb-text-sm, .875rem);font-weight:var(--cb-font-weight-semibold, 600);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-100, #f1f5f9);border:none;border-radius:var(--cb-radius-md, .5rem);cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-onboarding__btn:hover:not(:disabled){background-color:var(--cb-color-surface-200, #e2e8f0)}.cb-onboarding__btn:disabled{opacity:.4;cursor:not-allowed}.cb-onboarding__btn--ghost{background-color:transparent;color:var(--cb-color-text-muted, #64748b)}.cb-onboarding__btn--primary{color:var(--cb-color-primary-contrast, #ffffff);background-color:var(--cb-color-primary-600, #047857)}.cb-onboarding__btn--primary:hover:not(:disabled){background-color:var(--cb-color-primary-700, #065f46)}:host-context([data-theme=\"dark\"]) .cb-onboarding{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-800, #1e293b);border-color:var(--cb-color-surface-600, #475569)}:host-context([data-theme=\"dark\"]) .cb-onboarding__body{color:var(--cb-color-surface-200, #e2e8f0)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-700, #334155)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn--ghost{background-color:transparent;color:var(--cb-color-surface-300, #cbd5e1)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn--primary{background-color:var(--cb-color-primary-500, #10b981)}.cb-onboarding__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}\n"] }]
+            args: [{ selector: 'cb-onboarding', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, template: `
+    @if (visible() && steps().length) {
+      <section
+        class="cb-onboarding"
+        role="dialog"
+        [attr.aria-label]="t().onboarding"
+        (keydown.escape)="visible.set(false)"
+      >
+        <div class="cb-onboarding__dots" aria-hidden="true">
+          @for (step of steps(); track $index) {
+            <span
+              class="cb-onboarding__dot"
+              [class.cb-is-active]="$index === index()"
+            ></span>
+          }
+        </div>
+        <!-- Región viva: al cambiar de paso se anuncian el contador y el título. -->
+        <div class="cb-onboarding__announce" aria-live="polite" aria-atomic="true">
+          <span class="cb-onboarding__counter" aria-hidden="true">
+            {{ index() + 1 }} / {{ steps().length }}
+          </span>
+          <span class="cb-onboarding__sr">{{ fmt(t().stepOf, index() + 1, steps().length) }}</span>
+          <h2 class="cb-onboarding__title">{{ steps()[index()] }}</h2>
+        </div>
+        <div class="cb-onboarding__body"><ng-content /></div>
+        <div class="cb-onboarding__actions">
+          <button
+            type="button"
+            class="cb-onboarding__btn cb-onboarding__btn--ghost"
+            (click)="visible.set(false)"
+          >
+            {{ t().skip }}
+          </button>
+          <button
+            type="button"
+            class="cb-onboarding__btn"
+            (click)="previous()"
+            [disabled]="index() === 0"
+          >
+            {{ t().previous }}
+          </button>
+          <button
+            type="button"
+            class="cb-onboarding__btn cb-onboarding__btn--primary"
+            (click)="next()"
+          >
+            {{ index() === steps().length - 1 ? t().start : t().continue }}
+          </button>
+        </div>
+      </section>
+    }
+  `, styles: [":host{display:block;width:100%;max-width:24rem}.cb-onboarding{display:flex;flex-direction:column;gap:var(--cb-space-3, .75rem);box-sizing:border-box;padding:var(--cb-space-6, 1.5rem);font-family:var(--cb-font-sans, inherit);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-0, #ffffff);border:1px solid var(--cb-color-border, #e2e8f0);border-radius:var(--cb-radius-lg, .75rem);box-shadow:var(--cb-shadow-md, 0 8px 24px rgba(0, 0, 0, .12));text-align:center}.cb-onboarding__dots{display:flex;justify-content:center;gap:var(--cb-space-1, .3rem)}.cb-onboarding__dot{width:.5rem;height:.5rem;border-radius:var(--cb-radius-full, 999px);background-color:var(--cb-color-surface-300, #cbd5e1);transition:all var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-onboarding__dot.cb-is-active{width:1.25rem;background-color:var(--cb-color-primary-500, #10b981)}.cb-onboarding__announce{display:flex;flex-direction:column;gap:var(--cb-space-3, .75rem)}.cb-onboarding__counter{font-size:var(--cb-text-xs, .75rem);font-weight:var(--cb-font-weight-semibold, 600);color:var(--cb-color-text-muted, #64748b)}.cb-onboarding__title{margin:0;font-size:var(--cb-text-xl, 1.25rem);font-weight:var(--cb-font-weight-bold, 700)}.cb-onboarding__body{font-size:var(--cb-text-sm, .875rem);color:var(--cb-color-text, #334155);line-height:var(--cb-line-height-relaxed, 1.6)}.cb-onboarding__body:empty{display:none}.cb-onboarding__actions{display:flex;justify-content:center;gap:var(--cb-space-2, .5rem);margin-top:var(--cb-space-2, .5rem)}.cb-onboarding__btn{padding:var(--cb-space-2, .5rem) var(--cb-space-4, 1rem);font:inherit;font-size:var(--cb-text-sm, .875rem);font-weight:var(--cb-font-weight-semibold, 600);color:var(--cb-color-text-strong, #0f172a);background-color:var(--cb-color-surface-100, #f1f5f9);border:none;border-radius:var(--cb-radius-md, .5rem);cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-onboarding__btn:hover:not(:disabled){background-color:var(--cb-color-surface-200, #e2e8f0)}.cb-onboarding__btn:disabled{opacity:.4;cursor:not-allowed}.cb-onboarding__btn--ghost{background-color:transparent;color:var(--cb-color-text-muted, #64748b)}.cb-onboarding__btn--primary{color:#fff;background-color:var(--cb-color-primary-700, #047857)}.cb-onboarding__btn--primary:hover:not(:disabled){background-color:var(--cb-color-primary-700, #065f46)}:host-context([data-theme=\"dark\"]) .cb-onboarding{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-800, #1e293b);border-color:var(--cb-color-surface-600, #475569)}:host-context([data-theme=\"dark\"]) .cb-onboarding__body{color:var(--cb-color-surface-200, #e2e8f0)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn{color:var(--cb-color-surface-0, #f8fafc);background-color:var(--cb-color-surface-700, #334155)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn--ghost{background-color:transparent;color:var(--cb-color-surface-300, #cbd5e1)}:host-context([data-theme=\"dark\"]) .cb-onboarding__btn--primary{background-color:var(--cb-color-primary-500, #10b981)}.cb-onboarding__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}\n"] }]
         }], propDecorators: { steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: false }] }], visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], index: [{ type: i0.Input, args: [{ isSignal: true, alias: "index", required: false }] }, { type: i0.Output, args: ["indexChange"] }], currentStepIndex: [{ type: i0.Output, args: ["currentStepIndex"] }] } });
 
 /**

package/fesm2022/caribeng-ui-orderlist.mjs

@@ -186,7 +186,7 @@ class CbOrderList {
         </ul>
       </div>
     </div>
-  `, isInline: true, styles: [":host{display:block;color:var(--cb-color-text)}.cb-orderlist{display:flex;gap:var(--cb-space-3, .75rem)}.cb-orderlist__controls{display:flex;flex-direction:column;justify-content:center;gap:var(--cb-space-2, .5rem)}.cb-orderlist__btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);background:var(--cb-color-surface-raised);color:var(--cb-color-text);cursor:pointer}.cb-orderlist__btn:hover:not(:disabled){border-color:var(--cb-color-primary-500);color:var(--cb-color-primary-600)}.cb-orderlist__btn:disabled{opacity:.45;cursor:not-allowed}.cb-orderlist__btn:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500));outline-offset:2px}.cb-orderlist__panel{flex:1;min-width:0;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, .75rem);background:var(--cb-color-surface-raised);overflow:hidden}.cb-orderlist__header{padding:.65rem .85rem;font-weight:var(--cb-font-weight-semibold, 600);border-bottom:1px solid var(--cb-color-border)}.cb-orderlist__list{max-height:16rem;margin:0;padding:var(--cb-space-1, .25rem);list-style:none;overflow-y:auto}.cb-orderlist__item{padding:.6rem .75rem;border-radius:var(--cb-radius-md, .5rem);cursor:pointer;outline:none;font-size:var(--cb-text-sm, .875rem)}.cb-orderlist__item:hover{background:color-mix(in srgb,var(--cb-color-text) 6%,transparent)}.cb-orderlist__item[aria-selected=true]{color:var(--cb-color-primary-700);background:color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent);font-weight:var(--cb-font-weight-medium, 500)}.cb-orderlist__item:focus-visible{box-shadow:inset 0 0 0 2px var(--cb-color-focus-ring, var(--cb-color-primary-500))}:host-context([data-theme=\"dark\"]) .cb-orderlist__item[aria-selected=true]{color:var(--cb-color-primary-300)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CbIcon, selector: "cb-icon", inputs: ["name", "size", "spin", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:block;color:var(--cb-color-text)}.cb-orderlist{display:flex;gap:var(--cb-space-3, .75rem)}.cb-orderlist__controls{display:flex;flex-direction:column;justify-content:center;gap:var(--cb-space-2, .5rem)}.cb-orderlist__btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);background:var(--cb-color-surface-raised);color:var(--cb-color-text);cursor:pointer}.cb-orderlist__btn:hover:not(:disabled){border-color:var(--cb-color-primary-500);color:var(--cb-color-primary-text)}.cb-orderlist__btn:disabled{opacity:.45;cursor:not-allowed}.cb-orderlist__btn:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500));outline-offset:2px}.cb-orderlist__panel{flex:1;min-width:0;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, .75rem);background:var(--cb-color-surface-raised);overflow:hidden}.cb-orderlist__header{padding:.65rem .85rem;font-weight:var(--cb-font-weight-semibold, 600);border-bottom:1px solid var(--cb-color-border)}.cb-orderlist__list{max-height:16rem;margin:0;padding:var(--cb-space-1, .25rem);list-style:none;overflow-y:auto}.cb-orderlist__item{padding:.6rem .75rem;border-radius:var(--cb-radius-md, .5rem);cursor:pointer;outline:none;font-size:var(--cb-text-sm, .875rem)}.cb-orderlist__item:hover{background:color-mix(in srgb,var(--cb-color-text) 6%,transparent)}.cb-orderlist__item[aria-selected=true]{color:var(--cb-color-primary-700);background:color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent);font-weight:var(--cb-font-weight-medium, 500)}.cb-orderlist__item:focus-visible{box-shadow:inset 0 0 0 2px var(--cb-color-focus-ring, var(--cb-color-primary-500))}:host-context([data-theme=\"dark\"]) .cb-orderlist__item[aria-selected=true]{color:var(--cb-color-primary-300)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CbIcon, selector: "cb-icon", inputs: ["name", "size", "spin", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbOrderList, decorators: [{
             type: Component,
@@ -237,7 +237,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
         </ul>
       </div>
     </div>
-  `, styles: [":host{display:block;color:var(--cb-color-text)}.cb-orderlist{display:flex;gap:var(--cb-space-3, .75rem)}.cb-orderlist__controls{display:flex;flex-direction:column;justify-content:center;gap:var(--cb-space-2, .5rem)}.cb-orderlist__btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);background:var(--cb-color-surface-raised);color:var(--cb-color-text);cursor:pointer}.cb-orderlist__btn:hover:not(:disabled){border-color:var(--cb-color-primary-500);color:var(--cb-color-primary-600)}.cb-orderlist__btn:disabled{opacity:.45;cursor:not-allowed}.cb-orderlist__btn:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500));outline-offset:2px}.cb-orderlist__panel{flex:1;min-width:0;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, .75rem);background:var(--cb-color-surface-raised);overflow:hidden}.cb-orderlist__header{padding:.65rem .85rem;font-weight:var(--cb-font-weight-semibold, 600);border-bottom:1px solid var(--cb-color-border)}.cb-orderlist__list{max-height:16rem;margin:0;padding:var(--cb-space-1, .25rem);list-style:none;overflow-y:auto}.cb-orderlist__item{padding:.6rem .75rem;border-radius:var(--cb-radius-md, .5rem);cursor:pointer;outline:none;font-size:var(--cb-text-sm, .875rem)}.cb-orderlist__item:hover{background:color-mix(in srgb,var(--cb-color-text) 6%,transparent)}.cb-orderlist__item[aria-selected=true]{color:var(--cb-color-primary-700);background:color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent);font-weight:var(--cb-font-weight-medium, 500)}.cb-orderlist__item:focus-visible{box-shadow:inset 0 0 0 2px var(--cb-color-focus-ring, var(--cb-color-primary-500))}:host-context([data-theme=\"dark\"]) .cb-orderlist__item[aria-selected=true]{color:var(--cb-color-primary-300)}\n"] }]
+  `, styles: [":host{display:block;color:var(--cb-color-text)}.cb-orderlist{display:flex;gap:var(--cb-space-3, .75rem)}.cb-orderlist__controls{display:flex;flex-direction:column;justify-content:center;gap:var(--cb-space-2, .5rem)}.cb-orderlist__btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);background:var(--cb-color-surface-raised);color:var(--cb-color-text);cursor:pointer}.cb-orderlist__btn:hover:not(:disabled){border-color:var(--cb-color-primary-500);color:var(--cb-color-primary-text)}.cb-orderlist__btn:disabled{opacity:.45;cursor:not-allowed}.cb-orderlist__btn:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500));outline-offset:2px}.cb-orderlist__panel{flex:1;min-width:0;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, .75rem);background:var(--cb-color-surface-raised);overflow:hidden}.cb-orderlist__header{padding:.65rem .85rem;font-weight:var(--cb-font-weight-semibold, 600);border-bottom:1px solid var(--cb-color-border)}.cb-orderlist__list{max-height:16rem;margin:0;padding:var(--cb-space-1, .25rem);list-style:none;overflow-y:auto}.cb-orderlist__item{padding:.6rem .75rem;border-radius:var(--cb-radius-md, .5rem);cursor:pointer;outline:none;font-size:var(--cb-text-sm, .875rem)}.cb-orderlist__item:hover{background:color-mix(in srgb,var(--cb-color-text) 6%,transparent)}.cb-orderlist__item[aria-selected=true]{color:var(--cb-color-primary-700);background:color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent);font-weight:var(--cb-font-weight-medium, 500)}.cb-orderlist__item:focus-visible{box-shadow:inset 0 0 0 2px var(--cb-color-focus-ring, var(--cb-color-primary-500))}:host-context([data-theme=\"dark\"]) .cb-orderlist__item[aria-selected=true]{color:var(--cb-color-primary-300)}\n"] }]
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], reorder: [{ type: i0.Output, args: ["reorder"] }], itemTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CbOrderListItemTemplate), { isSignal: true }] }] } });
 
 /**