@caribeng/ui 22.2.0 → 22.5.0

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

@@ -3,7 +3,7 @@ import { input, model, ViewEncapsulation, ChangeDetectionStrategy, Component } f
 import { injectCbTranslation } from '@caribeng/ui';
 
 /**
- * Expansion-panel de Caribe Design: panel colapsable con cabecera pulsable y
+ * Expansion-panel: panel colapsable con cabecera pulsable y
  * contenido proyectado.
  *
  * @example
@@ -27,48 +27,48 @@ class CbExpansionPanel {
         this.bodyId = `cb-expansion-panel-${this.uid}-body`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbExpansionPanel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbExpansionPanel, isStandalone: true, selector: "cb-expansion-panel", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { classAttribute: "cb-expansion-panel-host" }, ngImport: i0, template: `
-    <div class="cb-expansion-panel" [class.cb-is-open]="expanded()">
-      <button
-        type="button"
-        class="cb-expansion-panel__header"
-        [id]="headerId"
-        [attr.aria-expanded]="expanded()"
-        [attr.aria-controls]="expanded() ? bodyId : null"
-        (click)="expanded.set(!expanded())"
-      >
-        <span class="cb-expansion-panel__title">{{ (title() ?? t().details) }}</span>
-        <span class="cb-expansion-panel__chevron" aria-hidden="true">▾</span>
-      </button>
-      @if (expanded()) {
-        <div class="cb-expansion-panel__body" role="region" [id]="bodyId" [attr.aria-labelledby]="headerId">
-          <ng-content />
-        </div>
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbExpansionPanel, isStandalone: true, selector: "cb-expansion-panel", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { classAttribute: "cb-expansion-panel-host" }, ngImport: i0, template: `
+    <div class="cb-expansion-panel" [class.cb-is-open]="expanded()">
+      <button
+        type="button"
+        class="cb-expansion-panel__header"
+        [id]="headerId"
+        [attr.aria-expanded]="expanded()"
+        [attr.aria-controls]="expanded() ? bodyId : null"
+        (click)="expanded.set(!expanded())"
+      >
+        <span class="cb-expansion-panel__title">{{ (title() ?? t().details) }}</span>
+        <span class="cb-expansion-panel__chevron" aria-hidden="true">▾</span>
+      </button>
+      @if (expanded()) {
+        <div class="cb-expansion-panel__body" role="region" [id]="bodyId" [attr.aria-labelledby]="headerId">
+          <ng-content />
+        </div>
+      }
+    </div>
   `, isInline: true, styles: [":host{display:block;width:100%}.cb-expansion-panel{width:100%;box-sizing:border-box;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-md, .5rem);overflow:hidden}.cb-expansion-panel__header{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);width:100%;box-sizing:border-box;padding:var(--cb-space-3, .75rem) var(--cb-space-4, 1rem);font:inherit;font-weight:var(--cb-font-weight-semibold, 600);color:inherit;text-align:left;background:transparent;border:none;cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-expansion-panel__header:hover{background-color:var(--cb-color-surface-50, #f8fafc)}.cb-expansion-panel__header:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500, #10b981));outline-offset:-2px}.cb-expansion-panel__chevron{flex:none;color:var(--cb-color-text-muted, #64748b);transition:transform var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-expansion-panel.cb-is-open .cb-expansion-panel__chevron{transform:rotate(180deg)}.cb-expansion-panel__body{padding:var(--cb-space-3, .75rem) var(--cb-space-4, 1rem) var(--cb-space-4, 1rem);font-size:var(--cb-text-sm, .875rem);color:var(--cb-color-text, #334155);border-top:1px solid var(--cb-color-border, #e2e8f0)}:host-context([data-theme=\"dark\"]) .cb-expansion-panel{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-expansion-panel__header:hover{background-color:var(--cb-color-surface-700, #334155)}:host-context([data-theme=\"dark\"]) .cb-expansion-panel__body{color:var(--cb-color-surface-200, #e2e8f0);border-top-color:var(--cb-color-surface-600, #475569)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbExpansionPanel, decorators: [{
             type: Component,
-            args: [{ selector: 'cb-expansion-panel', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, host: { class: 'cb-expansion-panel-host' }, template: `
-    <div class="cb-expansion-panel" [class.cb-is-open]="expanded()">
-      <button
-        type="button"
-        class="cb-expansion-panel__header"
-        [id]="headerId"
-        [attr.aria-expanded]="expanded()"
-        [attr.aria-controls]="expanded() ? bodyId : null"
-        (click)="expanded.set(!expanded())"
-      >
-        <span class="cb-expansion-panel__title">{{ (title() ?? t().details) }}</span>
-        <span class="cb-expansion-panel__chevron" aria-hidden="true">▾</span>
-      </button>
-      @if (expanded()) {
-        <div class="cb-expansion-panel__body" role="region" [id]="bodyId" [attr.aria-labelledby]="headerId">
-          <ng-content />
-        </div>
-      }
-    </div>
+            args: [{ selector: 'cb-expansion-panel', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, host: { class: 'cb-expansion-panel-host' }, template: `
+    <div class="cb-expansion-panel" [class.cb-is-open]="expanded()">
+      <button
+        type="button"
+        class="cb-expansion-panel__header"
+        [id]="headerId"
+        [attr.aria-expanded]="expanded()"
+        [attr.aria-controls]="expanded() ? bodyId : null"
+        (click)="expanded.set(!expanded())"
+      >
+        <span class="cb-expansion-panel__title">{{ (title() ?? t().details) }}</span>
+        <span class="cb-expansion-panel__chevron" aria-hidden="true">▾</span>
+      </button>
+      @if (expanded()) {
+        <div class="cb-expansion-panel__body" role="region" [id]="bodyId" [attr.aria-labelledby]="headerId">
+          <ng-content />
+        </div>
+      }
+    </div>
   `, styles: [":host{display:block;width:100%}.cb-expansion-panel{width:100%;box-sizing:border-box;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-md, .5rem);overflow:hidden}.cb-expansion-panel__header{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);width:100%;box-sizing:border-box;padding:var(--cb-space-3, .75rem) var(--cb-space-4, 1rem);font:inherit;font-weight:var(--cb-font-weight-semibold, 600);color:inherit;text-align:left;background:transparent;border:none;cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-expansion-panel__header:hover{background-color:var(--cb-color-surface-50, #f8fafc)}.cb-expansion-panel__header:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500, #10b981));outline-offset:-2px}.cb-expansion-panel__chevron{flex:none;color:var(--cb-color-text-muted, #64748b);transition:transform var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-expansion-panel.cb-is-open .cb-expansion-panel__chevron{transform:rotate(180deg)}.cb-expansion-panel__body{padding:var(--cb-space-3, .75rem) var(--cb-space-4, 1rem) var(--cb-space-4, 1rem);font-size:var(--cb-text-sm, .875rem);color:var(--cb-color-text, #334155);border-top:1px solid var(--cb-color-border, #e2e8f0)}:host-context([data-theme=\"dark\"]) .cb-expansion-panel{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-expansion-panel__header:hover{background-color:var(--cb-color-surface-700, #334155)}:host-context([data-theme=\"dark\"]) .cb-expansion-panel__body{color:var(--cb-color-surface-200, #e2e8f0);border-top-color:var(--cb-color-surface-600, #475569)}\n"] }]
         }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }, { type: i0.Output, args: ["expandedChange"] }] } });
 

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

@@ -4,7 +4,7 @@ import { injectCbTranslation, cbOverlayFocus } from '@caribeng/ui';
 
 let nextId = 0;
 /**
- * Fab-menu de Caribe Design: botón de acción flotante que despliega una lista
+ * Fab-menu: botón de acción flotante que despliega una lista
  * de acciones rápidas.
  *
  * @example
@@ -60,83 +60,83 @@ class CbFabMenu {
         this.open.set(false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbFabMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbFabMenu, isStandalone: true, selector: "cb-fab-menu", inputs: { triggerLabel: { classPropertyName: "triggerLabel", publicName: "triggerLabel", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", itemSelected: "itemSelected" }, host: { classAttribute: "cb-fab-menu-host" }, ngImport: i0, template: `
-    <div class="cb-fab-menu">
-      @if (open()) {
-        <div
-          class="cb-fab-menu__list"
-          role="menu"
-          [id]="menuId"
-          [attr.aria-label]="(triggerLabel() ?? t().quickActions)"
-          (keydown)="onMenuKeydown($event)"
-        >
-          @for (item of items(); track item.id) {
-            <button
-              type="button"
-              class="cb-fab-menu__item"
-              role="menuitem"
-              tabindex="-1"
-              (click)="selectItem(item)"
-            >
-              {{ item.label }}
-            </button>
-          }
-        </div>
-      }
-      <button
-        type="button"
-        class="cb-fab-menu__trigger"
-        [class.cb-is-open]="open()"
-        aria-haspopup="menu"
-        [attr.aria-expanded]="open()"
-        [attr.aria-controls]="open() ? menuId : null"
-        [attr.aria-label]="(triggerLabel() ?? t().quickActions)"
-        (click)="open.set(!open())"
-      >
-        <span aria-hidden="true">{{ open() ? '×' : '+' }}</span>
-      </button>
-    </div>
-  `, isInline: true, styles: [":host{display:inline-flex}.cb-fab-menu{display:inline-flex;flex-direction:column;align-items:flex-end;gap:var(--cb-space-2, .5rem);font-family:var(--cb-font-sans, inherit)}.cb-fab-menu__list{display:flex;flex-direction:column;gap:var(--cb-space-2, .35rem);animation:cb-fab-in var(--cb-duration-fast, .12s) var(--cb-ease-out, ease-out)}.cb-fab-menu__item{padding:var(--cb-space-2, .5rem) var(--cb-space-4, 1rem);font:inherit;font-size:var(--cb-text-sm, .8125rem);font-weight:var(--cb-font-weight-medium, 500);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-full, 999px);box-shadow:var(--cb-shadow-sm, 0 1px 2px rgba(0, 0, 0, .12));cursor:pointer;white-space:nowrap;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-fab-menu__item:hover{background-color:var(--cb-color-surface-100, #f1f5f9)}.cb-fab-menu__trigger{display:inline-flex;align-items:center;justify-content:center;width:3.25rem;height:3.25rem;font-size:1.6rem;line-height:1;color:var(--cb-color-primary-contrast, #ffffff);background-color:var(--cb-color-primary-600, #047857);border:none;border-radius:var(--cb-radius-full, 999px);box-shadow:var(--cb-shadow-md, 0 6px 16px rgba(0, 0, 0, .2));cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease),transform var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-fab-menu__trigger:hover{background-color:var(--cb-color-primary-700, #065f46)}.cb-fab-menu__trigger.cb-is-open{transform:rotate(90deg)}.cb-fab-menu__trigger:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500, #10b981));outline-offset:2px}@keyframes cb-fab-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}:host-context([data-theme=\"dark\"]) .cb-fab-menu__item{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-fab-menu__item:hover{background-color:var(--cb-color-surface-700, #334155)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbFabMenu, isStandalone: true, selector: "cb-fab-menu", inputs: { triggerLabel: { classPropertyName: "triggerLabel", publicName: "triggerLabel", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", itemSelected: "itemSelected" }, host: { classAttribute: "cb-fab-menu-host" }, ngImport: i0, template: `
+    <div class="cb-fab-menu">
+      @if (open()) {
+        <div
+          class="cb-fab-menu__list"
+          role="menu"
+          [id]="menuId"
+          [attr.aria-label]="(triggerLabel() ?? t().quickActions)"
+          (keydown)="onMenuKeydown($event)"
+        >
+          @for (item of items(); track item.id) {
+            <button
+              type="button"
+              class="cb-fab-menu__item"
+              role="menuitem"
+              tabindex="-1"
+              (click)="selectItem(item)"
+            >
+              {{ item.label }}
+            </button>
+          }
+        </div>
+      }
+      <button
+        type="button"
+        class="cb-fab-menu__trigger"
+        [class.cb-is-open]="open()"
+        aria-haspopup="menu"
+        [attr.aria-expanded]="open()"
+        [attr.aria-controls]="open() ? menuId : null"
+        [attr.aria-label]="(triggerLabel() ?? t().quickActions)"
+        (click)="open.set(!open())"
+      >
+        <span aria-hidden="true">{{ open() ? '×' : '+' }}</span>
+      </button>
+    </div>
+  `, isInline: true, styles: [":host{display:inline-flex}.cb-fab-menu{display:inline-flex;flex-direction:column;align-items:flex-end;gap:var(--cb-space-2, .5rem);font-family:var(--cb-font-sans, inherit)}.cb-fab-menu__list{display:flex;flex-direction:column;gap:var(--cb-space-2, .35rem);animation:cb-fab-in var(--cb-duration-fast, .12s) var(--cb-ease-out, ease-out)}.cb-fab-menu__item{padding:var(--cb-space-2, .5rem) var(--cb-space-4, 1rem);font:inherit;font-size:var(--cb-text-sm, .8125rem);font-weight:var(--cb-font-weight-medium, 500);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-full, 999px);box-shadow:var(--cb-shadow-sm, 0 1px 2px rgba(0, 0, 0, .12));cursor:pointer;white-space:nowrap;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-fab-menu__item:hover{background-color:var(--cb-color-surface-100, #f1f5f9)}.cb-fab-menu__trigger{display:inline-flex;align-items:center;justify-content:center;width:3.25rem;height:3.25rem;font-size:1.6rem;line-height:1;color:#fff;background-color:var(--cb-color-primary-700, #047857);border:none;border-radius:var(--cb-radius-full, 999px);box-shadow:var(--cb-shadow-md, 0 6px 16px rgba(0, 0, 0, .2));cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease),transform var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-fab-menu__trigger:hover{background-color:var(--cb-color-primary-700, #065f46)}.cb-fab-menu__trigger.cb-is-open{transform:rotate(90deg)}.cb-fab-menu__trigger:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500, #10b981));outline-offset:2px}@keyframes cb-fab-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}:host-context([data-theme=\"dark\"]) .cb-fab-menu__item{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-fab-menu__item:hover{background-color:var(--cb-color-surface-700, #334155)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbFabMenu, decorators: [{
             type: Component,
-            args: [{ selector: 'cb-fab-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, host: { class: 'cb-fab-menu-host' }, template: `
-    <div class="cb-fab-menu">
-      @if (open()) {
-        <div
-          class="cb-fab-menu__list"
-          role="menu"
-          [id]="menuId"
-          [attr.aria-label]="(triggerLabel() ?? t().quickActions)"
-          (keydown)="onMenuKeydown($event)"
-        >
-          @for (item of items(); track item.id) {
-            <button
-              type="button"
-              class="cb-fab-menu__item"
-              role="menuitem"
-              tabindex="-1"
-              (click)="selectItem(item)"
-            >
-              {{ item.label }}
-            </button>
-          }
-        </div>
-      }
-      <button
-        type="button"
-        class="cb-fab-menu__trigger"
-        [class.cb-is-open]="open()"
-        aria-haspopup="menu"
-        [attr.aria-expanded]="open()"
-        [attr.aria-controls]="open() ? menuId : null"
-        [attr.aria-label]="(triggerLabel() ?? t().quickActions)"
-        (click)="open.set(!open())"
-      >
-        <span aria-hidden="true">{{ open() ? '×' : '+' }}</span>
-      </button>
-    </div>
-  `, styles: [":host{display:inline-flex}.cb-fab-menu{display:inline-flex;flex-direction:column;align-items:flex-end;gap:var(--cb-space-2, .5rem);font-family:var(--cb-font-sans, inherit)}.cb-fab-menu__list{display:flex;flex-direction:column;gap:var(--cb-space-2, .35rem);animation:cb-fab-in var(--cb-duration-fast, .12s) var(--cb-ease-out, ease-out)}.cb-fab-menu__item{padding:var(--cb-space-2, .5rem) var(--cb-space-4, 1rem);font:inherit;font-size:var(--cb-text-sm, .8125rem);font-weight:var(--cb-font-weight-medium, 500);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-full, 999px);box-shadow:var(--cb-shadow-sm, 0 1px 2px rgba(0, 0, 0, .12));cursor:pointer;white-space:nowrap;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-fab-menu__item:hover{background-color:var(--cb-color-surface-100, #f1f5f9)}.cb-fab-menu__trigger{display:inline-flex;align-items:center;justify-content:center;width:3.25rem;height:3.25rem;font-size:1.6rem;line-height:1;color:var(--cb-color-primary-contrast, #ffffff);background-color:var(--cb-color-primary-600, #047857);border:none;border-radius:var(--cb-radius-full, 999px);box-shadow:var(--cb-shadow-md, 0 6px 16px rgba(0, 0, 0, .2));cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease),transform var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-fab-menu__trigger:hover{background-color:var(--cb-color-primary-700, #065f46)}.cb-fab-menu__trigger.cb-is-open{transform:rotate(90deg)}.cb-fab-menu__trigger:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500, #10b981));outline-offset:2px}@keyframes cb-fab-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}:host-context([data-theme=\"dark\"]) .cb-fab-menu__item{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-fab-menu__item:hover{background-color:var(--cb-color-surface-700, #334155)}\n"] }]
+            args: [{ selector: 'cb-fab-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, host: { class: 'cb-fab-menu-host' }, template: `
+    <div class="cb-fab-menu">
+      @if (open()) {
+        <div
+          class="cb-fab-menu__list"
+          role="menu"
+          [id]="menuId"
+          [attr.aria-label]="(triggerLabel() ?? t().quickActions)"
+          (keydown)="onMenuKeydown($event)"
+        >
+          @for (item of items(); track item.id) {
+            <button
+              type="button"
+              class="cb-fab-menu__item"
+              role="menuitem"
+              tabindex="-1"
+              (click)="selectItem(item)"
+            >
+              {{ item.label }}
+            </button>
+          }
+        </div>
+      }
+      <button
+        type="button"
+        class="cb-fab-menu__trigger"
+        [class.cb-is-open]="open()"
+        aria-haspopup="menu"
+        [attr.aria-expanded]="open()"
+        [attr.aria-controls]="open() ? menuId : null"
+        [attr.aria-label]="(triggerLabel() ?? t().quickActions)"
+        (click)="open.set(!open())"
+      >
+        <span aria-hidden="true">{{ open() ? '×' : '+' }}</span>
+      </button>
+    </div>
+  `, styles: [":host{display:inline-flex}.cb-fab-menu{display:inline-flex;flex-direction:column;align-items:flex-end;gap:var(--cb-space-2, .5rem);font-family:var(--cb-font-sans, inherit)}.cb-fab-menu__list{display:flex;flex-direction:column;gap:var(--cb-space-2, .35rem);animation:cb-fab-in var(--cb-duration-fast, .12s) var(--cb-ease-out, ease-out)}.cb-fab-menu__item{padding:var(--cb-space-2, .5rem) var(--cb-space-4, 1rem);font:inherit;font-size:var(--cb-text-sm, .8125rem);font-weight:var(--cb-font-weight-medium, 500);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-full, 999px);box-shadow:var(--cb-shadow-sm, 0 1px 2px rgba(0, 0, 0, .12));cursor:pointer;white-space:nowrap;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease)}.cb-fab-menu__item:hover{background-color:var(--cb-color-surface-100, #f1f5f9)}.cb-fab-menu__trigger{display:inline-flex;align-items:center;justify-content:center;width:3.25rem;height:3.25rem;font-size:1.6rem;line-height:1;color:#fff;background-color:var(--cb-color-primary-700, #047857);border:none;border-radius:var(--cb-radius-full, 999px);box-shadow:var(--cb-shadow-md, 0 6px 16px rgba(0, 0, 0, .2));cursor:pointer;transition:background-color var(--cb-duration-fast, .12s) var(--cb-ease, ease),transform var(--cb-duration-normal, .2s) var(--cb-ease, ease)}.cb-fab-menu__trigger:hover{background-color:var(--cb-color-primary-700, #065f46)}.cb-fab-menu__trigger.cb-is-open{transform:rotate(90deg)}.cb-fab-menu__trigger:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500, #10b981));outline-offset:2px}@keyframes cb-fab-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}:host-context([data-theme=\"dark\"]) .cb-fab-menu__item{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-fab-menu__item:hover{background-color:var(--cb-color-surface-700, #334155)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { triggerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "triggerLabel", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], itemSelected: [{ type: i0.Output, args: ["itemSelected"] }] } });
 
 /**

package/fesm2022/caribeng-ui-fieldset.mjs

@@ -42,7 +42,7 @@ class CbFieldset {
             type="button"
             class="cb-fieldset__toggler"
             [attr.aria-expanded]="!collapsed()"
-            [attr.aria-controls]="contentId"
+            [attr.aria-controls]="collapsed() ? null : contentId"
             (click)="toggle()"
           >
             <cb-icon
@@ -84,7 +84,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
             type="button"
             class="cb-fieldset__toggler"
             [attr.aria-expanded]="!collapsed()"
-            [attr.aria-controls]="contentId"
+            [attr.aria-controls]="collapsed() ? null : contentId"
             (click)="toggle()"
           >
             <cb-icon

package/fesm2022/caribeng-ui-file-card.mjs

@@ -1,20 +1,32 @@
 import * as i0 from '@angular/core';
-import { input, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { viewChild, input, booleanAttribute, output, signal, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
 import { CbIcon } from '@caribeng/ui/icon';
+import { CbMenu } from '@caribeng/ui/menu';
+import { injectCbTranslation } from '@caribeng/ui';
 
 /**
  * Tarjeta de categoría/almacenamiento de CaribeNG: icono con tinte, título y
  * subtítulo a la izquierda; dos valores alineados a la derecha. Útil para
  * resúmenes de media, almacenamiento o métricas de categoría.
  *
+ * Como `cb-folder-card`: con `actions` muestra un botón ⋮ con un menú
+ * (`actionSelect`) y con `clickable` toda la tarjeta emite `open`.
+ *
  * @example
  * ```html
  * <cb-file-card icon="image" color="#10b981" title="Imágenes"
- *   subtitle="17% usado" value="245 archivos" valueSub="26.4 GB" />
+ *   subtitle="17% usado" value="245 archivos" valueSub="26.4 GB"
+ *   clickable (open)="verImagenes()" />
  * ```
  */
 class CbFileCard {
     constructor() {
+        /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+        this.t = injectCbTranslation();
+        this.menu = viewChild('menu', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "menu" }] : /* istanbul ignore next */ []));
+        this.trigger = viewChild('trigger', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
         /** Nombre del icono (del set de CaribeNG). */
         this.icon = input('file', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
@@ -33,55 +45,160 @@ class CbFileCard {
         /** Valor secundario a la derecha (p. ej. "26.4 GB"). */
         this.valueSub = input('', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "valueSub" }] : /* istanbul ignore next */ []));
+        /** Acciones del menú ⋮. Sin acciones no se muestra el botón. */
+        this.actions = input([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
+        /** Nombre del botón ⋮ y del menú. Por defecto, "Más acciones: {título}" del idioma activo. */
+        this.actionsAriaLabel = input(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "actionsAriaLabel" }] : /* istanbul ignore next */ []));
+        /** Toda la tarjeta es pulsable y emite `open` (clic, Enter o Espacio). */
+        this.clickable = input(false, { ...(ngDevMode ? { debugName: "clickable" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        /** Acción elegida en el menú ⋮. */
+        this.actionSelect = output();
+        /** Se pulsó la tarjeta (solo con `clickable`). */
+        this.open = output();
+        this.menuOpen = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "menuOpen" }] : /* istanbul ignore next */ []));
+        this.menuLabel = computed(() => {
+            const custom = this.actionsAriaLabel();
+            if (custom)
+                return custom;
+            const title = this.title();
+            return title ? `${this.t().moreActions}: ${title}` : this.t().moreActions;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "menuLabel" }] : /* istanbul ignore next */ []));
     }
     /** Fondo tintado derivado del color (cualquier color CSS: hex, rgb(), var(--…)). */
     tintBg() {
         const c = this.color();
         return c ? `color-mix(in srgb, ${c} 12%, transparent)` : null;
     }
+    /** Abre o cierra el menú de acciones anclado al botón ⋮. */
+    toggleMenu() {
+        const menu = this.menu();
+        const trigger = this.trigger()?.nativeElement;
+        if (!menu || !trigger)
+            return;
+        if (menu.isOpen) {
+            menu.hide();
+            return;
+        }
+        menu.show(trigger);
+        this.menuOpen.set(true);
+    }
+    openFromKeyboard(event) {
+        event.preventDefault();
+        if (!this.menu()?.isOpen)
+            this.toggleMenu();
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbFileCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbFileCard, isStandalone: true, selector: "cb-file-card", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, valueSub: { classPropertyName: "valueSub", publicName: "valueSub", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "cb-file-card" }, ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbFileCard, isStandalone: true, selector: "cb-file-card", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, valueSub: { classPropertyName: "valueSub", publicName: "valueSub", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, actionsAriaLabel: { classPropertyName: "actionsAriaLabel", publicName: "actionsAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionSelect: "actionSelect", open: "open" }, host: { properties: { "class.cb-file-card--clickable": "clickable()" }, classAttribute: "cb-file-card" }, viewQueries: [{ propertyName: "menu", first: true, predicate: ["menu"], descendants: true, isSignal: true }, { propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div class="cb-file-card__left">
       <span class="cb-file-card__icon" [style.background]="tintBg()" [style.color]="color() || null">
         <cb-icon [name]="icon()" [size]="20" aria-hidden="true" />
       </span>
       <div class="cb-file-card__text">
-        <span class="cb-file-card__title">{{ title() }}</span>
+        @if (clickable()) {
+          <button type="button" class="cb-file-card__title cb-file-card__open" (click)="open.emit($event)">{{ title() }}</button>
+        } @else {
+          <span class="cb-file-card__title">{{ title() }}</span>
+        }
         @if (subtitle()) {
           <span class="cb-file-card__subtitle">{{ subtitle() }}</span>
         }
       </div>
     </div>
-    <div class="cb-file-card__values">
-      <span class="cb-file-card__value">{{ value() }}</span>
-      @if (valueSub()) {
-        <span class="cb-file-card__value-sub">{{ valueSub() }}</span>
+    <div class="cb-file-card__end">
+      <div class="cb-file-card__values">
+        <span class="cb-file-card__value">{{ value() }}</span>
+        @if (valueSub()) {
+          <span class="cb-file-card__value-sub">{{ valueSub() }}</span>
+        }
+      </div>
+      @if (actions().length) {
+        <button
+          #trigger
+          type="button"
+          class="cb-file-card__menu-button"
+          [attr.aria-label]="menuLabel()"
+          aria-haspopup="menu"
+          [attr.aria-expanded]="menuOpen()"
+          (click)="toggleMenu()"
+          (keydown.arrowdown)="openFromKeyboard($event)"
+        >
+          <svg viewBox="0 0 24 24" width="18" height="18" fill="currentColor" aria-hidden="true">
+            <circle cx="12" cy="5" r="2" />
+            <circle cx="12" cy="12" r="2" />
+            <circle cx="12" cy="19" r="2" />
+          </svg>
+        </button>
+        <cb-menu
+          #menu
+          [items]="actions()"
+          [ariaLabel]="menuLabel()"
+          (itemSelect)="actionSelect.emit($event)"
+          (hidden)="menuOpen.set(false)"
+        />
       }
     </div>
-  `, isInline: true, styles: [":host{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);padding:.9rem 1rem;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, 14px);background:var(--cb-color-surface);font-family:var(--cb-font-sans);color:var(--cb-color-text)}.cb-file-card__left{display:flex;align-items:center;gap:.75rem;min-width:0}.cb-file-card__icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:var(--cb-radius-md, 10px);flex:none;color:var(--cb-color-primary-600, #059669)}.cb-file-card__text{display:flex;flex-direction:column;min-width:0}.cb-file-card__title{font-weight:600;font-size:.9rem}.cb-file-card__subtitle{font-size:.8rem;color:var(--cb-color-text-muted)}.cb-file-card__values{display:flex;flex-direction:column;align-items:flex-end;text-align:right;flex:none}.cb-file-card__value,.cb-file-card__value-sub{font-size:.85rem;color:var(--cb-color-text-muted)}\n"], dependencies: [{ kind: "component", type: CbIcon, selector: "cb-icon", inputs: ["name", "size", "spin", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{position:relative;display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);padding:.9rem 1rem;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, 14px);background:var(--cb-color-surface);font-family:var(--cb-font-sans);color:var(--cb-color-text)}:host(.cb-file-card--clickable){cursor:pointer;transition:background-color .15s ease}:host(.cb-file-card--clickable:hover){background:var(--cb-color-surface-hover)}:host(.cb-file-card--clickable:has(.cb-file-card__open:focus-visible)){outline:2px solid var(--cb-color-focus-ring);outline-offset:2px}.cb-file-card__left{display:flex;align-items:center;gap:.75rem;min-width:0}.cb-file-card__icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:var(--cb-radius-md, 10px);flex:none;color:var(--cb-color-primary-text)}.cb-file-card__text{display:flex;flex-direction:column;min-width:0}.cb-file-card__title{max-width:100%;overflow:hidden;font-weight:600;font-size:.9rem;text-overflow:ellipsis;white-space:nowrap}.cb-file-card__open{padding:0;border:0;background:transparent;color:inherit;font:inherit;font-weight:600;font-size:.9rem;text-align:start;cursor:pointer}.cb-file-card__open:focus-visible{outline:none}.cb-file-card__open:after{content:\"\";position:absolute;inset:0;border-radius:inherit}.cb-file-card__subtitle{font-size:.8rem;color:var(--cb-color-text-muted)}.cb-file-card__end{display:flex;align-items:center;gap:.25rem;flex:none}.cb-file-card__menu-button{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin-right:-.5rem;padding:0;border:0;border-radius:var(--cb-radius-md, 8px);background:transparent;color:var(--cb-color-text-muted);cursor:pointer}.cb-file-card__menu-button:hover,.cb-file-card__menu-button[aria-expanded=true]{background:var(--cb-color-surface-hover);color:var(--cb-color-text)}.cb-file-card__menu-button:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:2px}.cb-file-card__values{display:flex;flex-direction:column;align-items:flex-end;text-align:right;flex:none}.cb-file-card__value,.cb-file-card__value-sub{font-size:.85rem;color:var(--cb-color-text-muted)}\n"], dependencies: [{ kind: "component", type: CbIcon, selector: "cb-icon", inputs: ["name", "size", "spin", "ariaLabel"] }, { kind: "component", type: CbMenu, selector: "cb-menu", inputs: ["items", "ariaLabel"], outputs: ["itemSelect", "hidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbFileCard, decorators: [{
             type: Component,
-            args: [{ selector: 'cb-file-card', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, imports: [CbIcon], host: { class: 'cb-file-card' }, template: `
+            args: [{ selector: 'cb-file-card', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, imports: [CbIcon, CbMenu], host: {
+                        class: 'cb-file-card',
+                        '[class.cb-file-card--clickable]': 'clickable()',
+                    }, template: `
     <div class="cb-file-card__left">
       <span class="cb-file-card__icon" [style.background]="tintBg()" [style.color]="color() || null">
         <cb-icon [name]="icon()" [size]="20" aria-hidden="true" />
       </span>
       <div class="cb-file-card__text">
-        <span class="cb-file-card__title">{{ title() }}</span>
+        @if (clickable()) {
+          <button type="button" class="cb-file-card__title cb-file-card__open" (click)="open.emit($event)">{{ title() }}</button>
+        } @else {
+          <span class="cb-file-card__title">{{ title() }}</span>
+        }
         @if (subtitle()) {
           <span class="cb-file-card__subtitle">{{ subtitle() }}</span>
         }
       </div>
     </div>
-    <div class="cb-file-card__values">
-      <span class="cb-file-card__value">{{ value() }}</span>
-      @if (valueSub()) {
-        <span class="cb-file-card__value-sub">{{ valueSub() }}</span>
+    <div class="cb-file-card__end">
+      <div class="cb-file-card__values">
+        <span class="cb-file-card__value">{{ value() }}</span>
+        @if (valueSub()) {
+          <span class="cb-file-card__value-sub">{{ valueSub() }}</span>
+        }
+      </div>
+      @if (actions().length) {
+        <button
+          #trigger
+          type="button"
+          class="cb-file-card__menu-button"
+          [attr.aria-label]="menuLabel()"
+          aria-haspopup="menu"
+          [attr.aria-expanded]="menuOpen()"
+          (click)="toggleMenu()"
+          (keydown.arrowdown)="openFromKeyboard($event)"
+        >
+          <svg viewBox="0 0 24 24" width="18" height="18" fill="currentColor" aria-hidden="true">
+            <circle cx="12" cy="5" r="2" />
+            <circle cx="12" cy="12" r="2" />
+            <circle cx="12" cy="19" r="2" />
+          </svg>
+        </button>
+        <cb-menu
+          #menu
+          [items]="actions()"
+          [ariaLabel]="menuLabel()"
+          (itemSelect)="actionSelect.emit($event)"
+          (hidden)="menuOpen.set(false)"
+        />
       }
     </div>
-  `, styles: [":host{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);padding:.9rem 1rem;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, 14px);background:var(--cb-color-surface);font-family:var(--cb-font-sans);color:var(--cb-color-text)}.cb-file-card__left{display:flex;align-items:center;gap:.75rem;min-width:0}.cb-file-card__icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:var(--cb-radius-md, 10px);flex:none;color:var(--cb-color-primary-600, #059669)}.cb-file-card__text{display:flex;flex-direction:column;min-width:0}.cb-file-card__title{font-weight:600;font-size:.9rem}.cb-file-card__subtitle{font-size:.8rem;color:var(--cb-color-text-muted)}.cb-file-card__values{display:flex;flex-direction:column;align-items:flex-end;text-align:right;flex:none}.cb-file-card__value,.cb-file-card__value-sub{font-size:.85rem;color:var(--cb-color-text-muted)}\n"] }]
-        }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueSub: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueSub", required: false }] }] } });
+  `, styles: [":host{position:relative;display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);padding:.9rem 1rem;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, 14px);background:var(--cb-color-surface);font-family:var(--cb-font-sans);color:var(--cb-color-text)}:host(.cb-file-card--clickable){cursor:pointer;transition:background-color .15s ease}:host(.cb-file-card--clickable:hover){background:var(--cb-color-surface-hover)}:host(.cb-file-card--clickable:has(.cb-file-card__open:focus-visible)){outline:2px solid var(--cb-color-focus-ring);outline-offset:2px}.cb-file-card__left{display:flex;align-items:center;gap:.75rem;min-width:0}.cb-file-card__icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:var(--cb-radius-md, 10px);flex:none;color:var(--cb-color-primary-text)}.cb-file-card__text{display:flex;flex-direction:column;min-width:0}.cb-file-card__title{max-width:100%;overflow:hidden;font-weight:600;font-size:.9rem;text-overflow:ellipsis;white-space:nowrap}.cb-file-card__open{padding:0;border:0;background:transparent;color:inherit;font:inherit;font-weight:600;font-size:.9rem;text-align:start;cursor:pointer}.cb-file-card__open:focus-visible{outline:none}.cb-file-card__open:after{content:\"\";position:absolute;inset:0;border-radius:inherit}.cb-file-card__subtitle{font-size:.8rem;color:var(--cb-color-text-muted)}.cb-file-card__end{display:flex;align-items:center;gap:.25rem;flex:none}.cb-file-card__menu-button{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin-right:-.5rem;padding:0;border:0;border-radius:var(--cb-radius-md, 8px);background:transparent;color:var(--cb-color-text-muted);cursor:pointer}.cb-file-card__menu-button:hover,.cb-file-card__menu-button[aria-expanded=true]{background:var(--cb-color-surface-hover);color:var(--cb-color-text)}.cb-file-card__menu-button:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:2px}.cb-file-card__values{display:flex;flex-direction:column;align-items:flex-end;text-align:right;flex:none}.cb-file-card__value,.cb-file-card__value-sub{font-size:.85rem;color:var(--cb-color-text-muted)}\n"] }]
+        }], propDecorators: { menu: [{ type: i0.ViewChild, args: ['menu', { isSignal: true }] }], trigger: [{ type: i0.ViewChild, args: ['trigger', { isSignal: true }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueSub: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueSub", required: false }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], actionsAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionsAriaLabel", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], actionSelect: [{ type: i0.Output, args: ["actionSelect"] }], open: [{ type: i0.Output, args: ["open"] }] } });
 
 /*
  * Public API Surface de @caribeng/ui/file-card