@caribeng/ui 22.1.1 → 22.4.0

package/types/caribeng-ui-fileupload.d.ts

@@ -1,22 +1,42 @@
 import * as _angular_core from '@angular/core';
+import * as _caribeng_ui from '@caribeng/ui';
+import { cbFormat } from '@caribeng/ui';
 
 interface CbFileUploadEvent {
     files: File[];
 }
+/** Archivos descartados al elegirlos o soltarlos, con el motivo. */
+interface CbFileRejectEvent {
+    files: {
+        file: File;
+        reason: 'size' | 'type';
+    }[];
+}
 /**
  * FileUpload de CaribeNG: selector de archivos con arrastrar y soltar,
  * validación de tamaño máximo y lista de archivos seleccionados.
  */
 declare class CbFileUpload {
+    /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+    protected readonly t: _angular_core.Signal<_caribeng_ui.CbTranslation>;
+    /** Rellena `{0}`, `{1}`… de un texto traducido. */
+    protected readonly fmt: typeof cbFormat;
     readonly accept: _angular_core.InputSignal<string>;
     readonly multiple: _angular_core.InputSignal<boolean>;
     readonly maxFileSize: _angular_core.InputSignal<number | null>;
     readonly disabled: _angular_core.InputSignal<boolean>;
-    readonly chooseLabel: _angular_core.InputSignal<string>;
-    readonly uploadLabel: _angular_core.InputSignal<string>;
+    readonly chooseLabel: _angular_core.InputSignal<string | undefined>;
+    readonly uploadLabel: _angular_core.InputSignal<string | undefined>;
     readonly selectFiles: _angular_core.OutputEmitterRef<CbFileUploadEvent>;
     readonly uploadHandler: _angular_core.OutputEmitterRef<CbFileUploadEvent>;
+    /** Se emite con los archivos descartados por tamaño (`maxFileSize`) o tipo (`accept`). */
+    readonly rejectFiles: _angular_core.OutputEmitterRef<CbFileRejectEvent>;
     readonly files: _angular_core.WritableSignal<File[]>;
+    /** Archivos descartados en la última selección (se muestran como aviso). */
+    protected readonly rejected: _angular_core.WritableSignal<{
+        file: File;
+        reason: "size" | "type";
+    }[]>;
     readonly dragging: _angular_core.WritableSignal<boolean>;
     private readonly fileInputRef;
     openPicker(): void;
@@ -24,15 +44,18 @@ declare class CbFileUpload {
     protected onDragOver(event: DragEvent): void;
     protected onDragLeave(event: DragEvent): void;
     protected onDrop(event: DragEvent): void;
+    /** Añade archivos validando `accept` y `maxFileSize`; ignora los repetidos. */
     addFiles(incoming: File[]): void;
     removeAt(index: number): void;
     clear(): void;
     triggerUpload(): void;
     protected formatSize(bytes: number): string;
+    /** Comprueba `accept` (extensiones `.pdf`, tipos `image/png` o comodines `image/*`). */
+    private isAccepted;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<CbFileUpload, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CbFileUpload, "cb-file-upload", never, { "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "chooseLabel": { "alias": "chooseLabel"; "required": false; "isSignal": true; }; "uploadLabel": { "alias": "uploadLabel"; "required": false; "isSignal": true; }; }, { "selectFiles": "selectFiles"; "uploadHandler": "uploadHandler"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CbFileUpload, "cb-file-upload", never, { "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "chooseLabel": { "alias": "chooseLabel"; "required": false; "isSignal": true; }; "uploadLabel": { "alias": "uploadLabel"; "required": false; "isSignal": true; }; }, { "selectFiles": "selectFiles"; "uploadHandler": "uploadHandler"; "rejectFiles": "rejectFiles"; }, never, never, true, never>;
 }
 
 export { CbFileUpload };
-export type { CbFileUploadEvent };
+export type { CbFileRejectEvent, CbFileUploadEvent };
 //# sourceMappingURL=caribeng-ui-fileupload.d.ts.map

package/types/caribeng-ui-folder-card.d.ts

@@ -1,29 +1,54 @@
 import * as _angular_core from '@angular/core';
+import * as _caribeng_ui from '@caribeng/ui';
+import { CbMenuItem } from '@caribeng/ui/menu';
 
 /**
  * Tarjeta de carpeta de CaribeNG: icono de carpeta, nombre y una fila con
- * número de archivos y tamaño. Proyecta acciones (menú) por `[cb-folder-actions]`.
+ * número de archivos y tamaño.
+ *
+ * Con `actions` muestra un botón ⋮ que abre un menú (`cb-menu`) con esas
+ * acciones y emite `actionSelect`. Con `clickable`, toda la tarjeta abre la
+ * carpeta (`open`) sin interferir con el botón del menú. Sigue aceptando un
+ * trigger propio proyectado por `[cb-folder-actions]`.
  *
  * @example
  * ```html
- * <cb-folder-card name="Imágenes" files="345" size="26.4 GB">
- *   <button cb-folder-actions aria-label="Opciones">⋮</button>
- * </cb-folder-card>
+ * <cb-folder-card name="Imágenes" files="345" size="26.4 GB" clickable
+ *   [actions]="acciones" (actionSelect)="onAccion($event)" (open)="abrir()" />
  * ```
  */
 declare class CbFolderCard {
+    /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+    protected readonly t: _angular_core.Signal<_caribeng_ui.CbTranslation>;
+    private readonly menu;
+    private readonly trigger;
     /** Nombre de la carpeta. */
     readonly name: _angular_core.InputSignal<string>;
     /** Número de archivos (texto o número). */
     readonly files: _angular_core.InputSignal<string | number>;
     /** Etiqueta tras el número de archivos. */
-    readonly filesLabel: _angular_core.InputSignal<string>;
+    readonly filesLabel: _angular_core.InputSignal<string | undefined>;
     /** Tamaño mostrado a la derecha. */
     readonly size: _angular_core.InputSignal<string>;
     /** Color del icono de carpeta. */
     readonly color: _angular_core.InputSignal<string>;
+    /** Acciones del menú ⋮ (abrir, renombrar, eliminar…). Sin acciones no se muestra el botón. */
+    readonly actions: _angular_core.InputSignal<readonly CbMenuItem[]>;
+    /** Nombre del botón ⋮ y del menú. Por defecto, "Más acciones: {nombre}" del idioma activo. */
+    readonly actionsAriaLabel: _angular_core.InputSignal<string | undefined>;
+    /** Toda la tarjeta es pulsable y emite `open` (clic, Enter o Espacio). */
+    readonly clickable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Acción elegida en el menú ⋮. */
+    readonly actionSelect: _angular_core.OutputEmitterRef<CbMenuItem>;
+    /** Se pidió abrir la carpeta (solo con `clickable`). */
+    readonly open: _angular_core.OutputEmitterRef<MouseEvent>;
+    protected readonly menuOpen: _angular_core.WritableSignal<boolean>;
+    protected readonly menuLabel: _angular_core.Signal<string>;
+    /** Abre o cierra el menú de acciones anclado al botón ⋮. */
+    toggleMenu(): void;
+    protected openFromKeyboard(event: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<CbFolderCard, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CbFolderCard, "cb-folder-card", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "files": { "alias": "files"; "required": false; "isSignal": true; }; "filesLabel": { "alias": "filesLabel"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, {}, never, ["[cb-folder-actions]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CbFolderCard, "cb-folder-card", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "files": { "alias": "files"; "required": false; "isSignal": true; }; "filesLabel": { "alias": "filesLabel"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "actionsAriaLabel": { "alias": "actionsAriaLabel"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; }, { "actionSelect": "actionSelect"; "open": "open"; }, never, ["[cb-folder-actions]"], true, never>;
 }
 
 export { CbFolderCard };

package/types/caribeng-ui-galleria.d.ts

@@ -1,4 +1,6 @@
 import * as _angular_core from '@angular/core';
+import * as _caribeng_ui from '@caribeng/ui';
+import { cbFormat } from '@caribeng/ui';
 
 interface CbGalleriaItem {
     itemImageSrc: string;
@@ -11,13 +13,20 @@ interface CbGalleriaItem {
  * barra de miniaturas seleccionables.
  */
 declare class CbGalleria {
+    /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+    protected readonly t: _angular_core.Signal<_caribeng_ui.CbTranslation>;
+    /** Rellena `{0}`, `{1}`… de un texto traducido. */
+    protected readonly fmt: typeof cbFormat;
     readonly value: _angular_core.InputSignal<CbGalleriaItem[]>;
     readonly showThumbnails: _angular_core.InputSignal<boolean>;
     readonly circular: _angular_core.InputSignal<boolean>;
     readonly activeIndex: _angular_core.ModelSignal<number>;
+    private readonly host;
     protected readonly activeItem: _angular_core.Signal<CbGalleriaItem | null>;
     prev(): void;
     next(): void;
+    /** Miniaturas (patrón *tabs*): flechas, Inicio y Fin cambian de imagen y mueven el foco. */
+    protected onThumbKeydown(event: KeyboardEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<CbGalleria, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<CbGalleria, "cb-galleria", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "showThumbnails": { "alias": "showThumbnails"; "required": false; "isSignal": true; }; "circular": { "alias": "circular"; "required": false; "isSignal": true; }; "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; }, { "activeIndex": "activeIndexChange"; }, never, never, true, never>;
 }

package/types/caribeng-ui-image.d.ts

@@ -1,16 +1,25 @@
 import * as _angular_core from '@angular/core';
+import * as _caribeng_ui from '@caribeng/ui';
+import { cbFormat } from '@caribeng/ui';
 
 /**
  * Image de CaribeNG: imagen con previsualización lightbox accesible y controles
  * de zoom/rotación.
  */
 declare class CbImage {
+    /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+    protected readonly t: _angular_core.Signal<_caribeng_ui.CbTranslation>;
+    /** Rellena `{0}`, `{1}`… de un texto traducido. */
+    protected readonly fmt: typeof cbFormat;
     readonly src: _angular_core.InputSignal<string>;
     readonly alt: _angular_core.InputSignal<string>;
     readonly width: _angular_core.InputSignal<string>;
     readonly height: _angular_core.InputSignal<string>;
     readonly preview: _angular_core.InputSignal<boolean>;
     private readonly lightboxEl;
+    private readonly overlayBtn;
+    private readonly closeBtn;
+    private readonly injector;
     readonly lightboxOpen: _angular_core.WritableSignal<boolean>;
     readonly scale: _angular_core.WritableSignal<number>;
     readonly rotation: _angular_core.WritableSignal<number>;
@@ -19,6 +28,7 @@ declare class CbImage {
     /** Transform combinado (rotación + escala + volteo) de la imagen. */
     readonly transform: _angular_core.Signal<string>;
     openPreview(): void;
+    /** Cierra la previsualización y devuelve el foco al botón que la abrió. */
     closePreview(): void;
     zoomIn(): void;
     zoomOut(): void;

package/types/caribeng-ui-inplace.d.ts

@@ -1,15 +1,23 @@
 import * as _angular_core from '@angular/core';
+import * as _caribeng_ui from '@caribeng/ui';
 
 /**
  * Inplace de CaribeNG: alterna entre una vista previa (`[cb-inplace-display]`)
  * y el contenido editable o completo (`[cb-inplace-content]`) al hacer clic.
  */
 declare class CbInplace {
+    /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+    protected readonly t: _angular_core.Signal<_caribeng_ui.CbTranslation>;
     readonly closable: _angular_core.InputSignal<boolean>;
     readonly disabled: _angular_core.InputSignal<boolean>;
     readonly active: _angular_core.ModelSignal<boolean>;
+    private readonly host;
+    private readonly injector;
+    /** Muestra el contenido y mueve el foco a su primer elemento enfocable. */
     open(): void;
+    /** Vuelve a la vista previa y devuelve el foco a ella. */
     close(): void;
+    private focusAfterRender;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<CbInplace, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<CbInplace, "cb-inplace", never, { "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; }, { "active": "activeChange"; }, never, ["[cb-inplace-display]", "[cb-inplace-content]"], true, never>;
 }

package/types/caribeng-ui-input-number.d.ts

@@ -1,6 +1,6 @@
+import * as _angular_core from '@angular/core';
 import * as _caribeng_ui from '@caribeng/ui';
 import { CbSize, CbRequiredIndicator } from '@caribeng/ui';
-import * as _angular_core from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 
 /**
@@ -15,6 +15,8 @@ import { ControlValueAccessor } from '@angular/forms';
  * ```
  */
 declare class CbInputNumber implements ControlValueAccessor {
+    /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+    protected readonly t: _angular_core.Signal<_caribeng_ui.CbTranslation>;
     /** Valor numérico (two-way opcional fuera de Angular Forms). */
     readonly value: _angular_core.ModelSignal<number | null>;
     readonly label: _angular_core.InputSignal<string>;

package/types/caribeng-ui-inputmask.d.ts

@@ -18,6 +18,8 @@ declare class CbInputMask implements ControlValueAccessor {
     /** Estado de validación: inputs manuales + estado de Angular Forms. */
     protected readonly fieldState: _caribeng_ui.CbFieldState;
     readonly ariaLabel: _angular_core.InputSignal<string>;
+    /** `id` del campo, para asociarlo a un `<label for>`. */
+    readonly inputId: _angular_core.InputSignal<string>;
     readonly value: _angular_core.ModelSignal<string>;
     private readonly cvaDisabled;
     protected readonly isDisabled: _angular_core.Signal<boolean>;
@@ -30,10 +32,15 @@ declare class CbInputMask implements ControlValueAccessor {
     setDisabledState(isDisabled: boolean): void;
     protected onInput(event: Event): void;
     protected onBlur(): void;
+    /**
+     * Aplica la máscara. Los literales (`-`, `(`, espacios…) se escriben solo
+     * cuando llega el carácter siguiente: así un literal inicial aparece y
+     * Backspace puede borrar el último literal sin que vuelva a añadirse.
+     */
     private applyMask;
     private matchesToken;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<CbInputMask, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CbInputMask, "cb-input-mask", never, { "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "unmask": { "alias": "unmask"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CbInputMask, "cb-input-mask", never, { "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "unmask": { "alias": "unmask"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
 }
 
 export { CbInputMask };

package/types/caribeng-ui-inputotp.d.ts

@@ -1,5 +1,6 @@
-import * as _caribeng_ui from '@caribeng/ui';
 import * as _angular_core from '@angular/core';
+import * as _caribeng_ui from '@caribeng/ui';
+import { cbFormat } from '@caribeng/ui';
 import { ControlValueAccessor } from '@angular/forms';
 
 /**
@@ -7,6 +8,10 @@ import { ControlValueAccessor } from '@angular/forms';
  * con avance automático de foco, pegado desde portapapeles e integración CVA.
  */
 declare class CbInputOtp implements ControlValueAccessor {
+    /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+    protected readonly t: _angular_core.Signal<_caribeng_ui.CbTranslation>;
+    /** Rellena `{0}`, `{1}`… de un texto traducido. */
+    protected readonly fmt: typeof cbFormat;
     private readonly hostRef;
     readonly length: _angular_core.InputSignal<number>;
     readonly integerOnly: _angular_core.InputSignal<boolean>;
@@ -16,7 +21,7 @@ declare class CbInputOtp implements ControlValueAccessor {
     readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** Estado de validación: inputs manuales + estado de Angular Forms. */
     protected readonly fieldState: _caribeng_ui.CbFieldState;
-    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
     readonly value: _angular_core.ModelSignal<string>;
     private readonly cvaDisabled;
     protected readonly isDisabled: _angular_core.Signal<boolean>;