valtech-components 2.0.821 → 2.0.824

package/lib/services/refreshable-stream/refreshable-stream.d.ts

@@ -0,0 +1,113 @@
+/**
+ * Refreshable Stream
+ *
+ * Helper estándar para vistas que consumen datos de Firestore. Soporta DOS
+ * modos — el caller decide cuál vía la `factory`:
+ *
+ *  - **one-shot** (recomendado por defecto): `() => from(svc.getAllOnce())`.
+ *    Carga una vez y completa. Más barato — sin listener vivo.
+ *  - **real-time**: `() => svc.getAll()`. Listener Firestore que auto-actualiza.
+ *    Solo donde importa (inbox de notificaciones, badges).
+ *
+ * En ambos modos la primera suscripción se gatea por `firebaseAuthReady`
+ * (sesión de Firebase Auth lista) — así el listener/lectura nunca se adjunta
+ * antes de que `request.auth` esté disponible en las reglas de Firestore, lo
+ * que cierra la ventana de `permission-denied` en cold start de PWA.
+ *
+ * El `retry` con backoff corto es solo red de seguridad para reconexiones
+ * transitorias (no para cubrir cold start — eso lo cubre el gate de auth).
+ */
+import { Injector, Signal } from '@angular/core';
+import { Observable } from 'rxjs';
+/** Opciones de configuración para `createRefreshableStream`. */
+export interface RefreshableStreamOptions<T> {
+    /**
+     * Valor emitido cuando la factory falla tras agotar los reintentos.
+     * Default: `null`.
+     */
+    fallback?: T;
+    /**
+     * Número máximo de reintentos ante un error de la factory.
+     * Backoff corto — NO cubre cold start (eso lo hace el gate de auth), solo
+     * reconexiones transitorias. Default: 4.
+     */
+    retryCount?: number;
+    /**
+     * Delay base del backoff (ms). El delay efectivo crece exponencialmente
+     * acotado: 500ms → 1s → 2s ... Default: 500.
+     */
+    retryBaseDelayMs?: number;
+    /**
+     * Si `false`, NO espera a `firebaseAuthReady` antes de la primera
+     * suscripción. Útil para streams que no leen Firestore. Default: `true`.
+     */
+    gateOnFirebaseAuth?: boolean;
+    /**
+     * Timeout (ms) del gate de Firebase Auth. Si la sesión de Firebase Auth no
+     * se establece en este tiempo, el stream procede igual (la factory correrá
+     * y, si no hay permiso, terminará en estado `error` — NUNCA en skeleton
+     * infinito). Muy por encima de cualquier handshake real. Default: 20000.
+     */
+    authGateTimeoutMs?: number;
+    /**
+     * Timeout (ms) de la PRIMERA emisión de la factory. Si la factory no emite
+     * ni un valor ni un error en este tiempo (caso típico: un servicio Firestore
+     * que nunca se inicializó → `EMPTY` → silencio total), el stream pasa a
+     * estado `error` en vez de quedarse en skeleton perpetuo. Default: 20000.
+     */
+    firstEmitTimeoutMs?: number;
+    /**
+     * Injector explícito. Solo necesario si `createRefreshableStream` se llama
+     * fuera de un injection context (raro). Por defecto usa `inject(Injector)`.
+     */
+    injector?: Injector;
+}
+/**
+ * Resultado de `createRefreshableStream`.
+ */
+export interface RefreshableStream<T> {
+    /** Datos actuales. `null` mientras la primera emisión no ha llegado. */
+    readonly data: Signal<T | null>;
+    /** `true` mientras se espera la primera emisión de la suscripción actual. */
+    readonly loading: Signal<boolean>;
+    /** `true` si la factory falló tras agotar los reintentos. */
+    readonly error: Signal<boolean>;
+    /**
+     * Re-suscribe la factory desde cero (nuevo listener / nueva lectura).
+     * Es lo que registra el `PageRefreshService` como handler de pull-to-refresh,
+     * y también el "reconectar manual" si un listener murió.
+     */
+    reload: () => void;
+}
+/**
+ * Crea un stream refrescable a partir de una factory de Observable.
+ *
+ * DEBE llamarse en un injection context (field initializer o constructor) —
+ * usa `toSignal`/`toObservable`/`inject` internamente.
+ *
+ * @param factory - Función que produce el Observable a consumir. El caller
+ *   decide el modo: `() => from(svc.getAllOnce())` (one-shot) o
+ *   `() => svc.getAll()` (real-time).
+ * @param options - Configuración opcional (fallback, retry, gate).
+ *
+ * @example
+ * ```typescript
+ * // one-shot (recomendado por defecto)
+ * private readonly stream = createRefreshableStream(
+ *   () => from(this.svc.getAllOnce()),
+ * );
+ *
+ * // real-time (inbox)
+ * private readonly stream = createRefreshableStream(
+ *   () => this.notifs.getAll(50),
+ * );
+ *
+ * readonly items = this.stream.data;
+ * readonly loading = this.stream.loading;
+ *
+ * ionViewWillEnter() {
+ *   this.pageRefresh.register(() => this.stream.reload());
+ * }
+ * ```
+ */
+export declare function createRefreshableStream<T>(factory: () => Observable<T>, options?: RefreshableStreamOptions<T>): RefreshableStream<T>;

package/lib/services/skeleton/config.d.ts

@@ -0,0 +1,30 @@
+import { EnvironmentProviders } from '@angular/core';
+import { SkeletonConfig } from './types';
+/**
+ * Configura el sistema de skeletons para Valtech Components.
+ *
+ * @param config Configuracion de skeletons
+ * @returns Providers para app.config.ts
+ *
+ * @example
+ * // app.config.ts
+ * import { provideValtechSkeleton } from 'valtech-components';
+ *
+ * export const appConfig: ApplicationConfig = {
+ *   providers: [
+ *     provideValtechSkeleton({
+ *       animated: true,
+ *       defaultDelay: 100,
+ *       defaultMinTime: 500,
+ *       templates: [
+ *         { name: 'custom-card', component: MyCustomCardSkeleton }
+ *       ]
+ *     }),
+ *   ]
+ * };
+ *
+ * @example
+ * // Uso minimo - usa configuracion por defecto
+ * providers: [provideValtechSkeleton()]
+ */
+export declare function provideValtechSkeleton(config?: SkeletonConfig): EnvironmentProviders;

package/lib/services/skeleton/directives/loading.directive.d.ts

@@ -0,0 +1,71 @@
+import { TemplateRef, OnDestroy } from '@angular/core';
+import { LoadingSource, SkeletonTemplateName } from '../types';
+import * as i0 from "@angular/core";
+/**
+ * Directiva estructural simplificada para estados de carga.
+ *
+ * Soporta multiples fuentes de estado de carga:
+ * - Angular Signal<boolean>
+ * - RxJS Observable<boolean>
+ * - Promise<any> (cargando hasta que se resuelve)
+ * - boolean literal
+ *
+ * @example
+ * <!-- Uso simple con signal -->
+ * <ng-container *valLoading="isLoading(); skeleton: 'list'">
+ *   <app-list [items]="items()"></app-list>
+ * </ng-container>
+ *
+ * @example
+ * <!-- Con configuracion -->
+ * <ng-container *valLoading="loading$; skeleton: 'grid-cards'; count: 8">
+ *   <app-grid [data]="data"></app-grid>
+ * </ng-container>
+ *
+ * @example
+ * <!-- Con template personalizado -->
+ * <ng-container *valLoading="isLoading(); skeletonTpl: customSkeleton">
+ *   <app-content></app-content>
+ * </ng-container>
+ * <ng-template #customSkeleton>
+ *   <val-skeleton [props]="{ type: 'card' }"></val-skeleton>
+ * </ng-template>
+ */
+export declare class LoadingDirective implements OnDestroy {
+    private readonly templateRef;
+    private readonly viewContainer;
+    private readonly skeletonService;
+    private readonly destroyRef;
+    private readonly _loading;
+    private hasContentView;
+    private skeletonComponentRef;
+    /** Template de skeleton a usar */
+    skeleton: SkeletonTemplateName | string;
+    /** Template personalizado para skeleton */
+    skeletonTpl: TemplateRef<unknown> | null;
+    /** Cantidad de items skeleton */
+    count: number;
+    /** Animacion habilitada */
+    animated: boolean;
+    /** Gap entre items */
+    gap: string | undefined;
+    /** Variante del template */
+    variant: string | undefined;
+    /** Mostrar spinner en lugar de skeleton */
+    spinner: boolean;
+    constructor();
+    /**
+     * Input principal - puede ser boolean, Signal, Observable o Promise.
+     */
+    set loading(source: LoadingSource);
+    ngOnDestroy(): void;
+    private resolveLoadingSource;
+    private updateView;
+    private showSkeleton;
+    private showSkeletonTemplate;
+    private showSpinner;
+    private showFallback;
+    private showContent;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LoadingDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<LoadingDirective, "[valLoading]", never, { "skeleton": { "alias": "valLoadingSkeleton"; "required": false; }; "skeletonTpl": { "alias": "valLoadingSkeletonTpl"; "required": false; }; "count": { "alias": "valLoadingCount"; "required": false; }; "animated": { "alias": "valLoadingAnimated"; "required": false; }; "gap": { "alias": "valLoadingGap"; "required": false; }; "variant": { "alias": "valLoadingVariant"; "required": false; }; "spinner": { "alias": "valLoadingSpinner"; "required": false; }; "loading": { "alias": "valLoading"; "required": false; }; }, {}, never, never, true, never>;
+}

package/lib/services/skeleton/index.d.ts

@@ -0,0 +1,10 @@
+export { SkeletonTemplateName, SkeletonTemplateConfig, LoadingSource, SkeletonDirectiveConfig, LoadingDirectiveConfig, RegisteredSkeletonTemplate, SkeletonConfig, SkeletonTemplateContext, SkeletonTemplateComponent, DEFAULT_SKELETON_CONFIG, } from './types';
+export { SkeletonService } from './skeleton.service';
+export { LoadingDirective } from './directives/loading.directive';
+export { ListSkeletonComponent } from './templates/list-skeleton.component';
+export { GridSkeletonComponent } from './templates/grid-skeleton.component';
+export { FormSkeletonComponent } from './templates/form-skeleton.component';
+export { ProfileSkeletonComponent } from './templates/profile-skeleton.component';
+export { TableSkeletonComponent } from './templates/table-skeleton.component';
+export { DetailSkeletonComponent } from './templates/detail-skeleton.component';
+export { provideValtechSkeleton } from './config';

package/lib/services/skeleton/skeleton.service.d.ts

@@ -0,0 +1,127 @@
+import { Type } from '@angular/core';
+import { SkeletonTemplateName, SkeletonTemplateConfig, RegisteredSkeletonTemplate, SkeletonConfig } from './types';
+import * as i0 from "@angular/core";
+/**
+ * Servicio para gestionar templates de skeleton y estados de carga globales.
+ *
+ * @example
+ * // En un componente
+ * skeleton = inject(SkeletonService);
+ *
+ * // Registrar template personalizado
+ * skeleton.registerTemplate('my-custom', MyCustomSkeletonComponent);
+ *
+ * // Obtener componente de template
+ * const component = skeleton.getTemplate('list');
+ *
+ * // Gestionar estados de carga globales
+ * skeleton.setLoadingState('dashboard', true);
+ * const isDashboardLoading = skeleton.loadingState('dashboard');
+ */
+export declare class SkeletonService {
+    private readonly _config;
+    private readonly _templates;
+    private readonly _loadingStates;
+    private _initialized;
+    /** Configuracion actual (solo lectura) */
+    readonly config: import("@angular/core").Signal<SkeletonConfig>;
+    /** Templates registrados (solo lectura) */
+    readonly templates: import("@angular/core").Signal<Map<string, RegisteredSkeletonTemplate>>;
+    /** Estado de carga global (cualquier estado registrado esta cargando) */
+    readonly isAnyLoading: import("@angular/core").Signal<boolean>;
+    /** Cantidad de templates registrados */
+    readonly templateCount: import("@angular/core").Signal<number>;
+    /**
+     * Configura el servicio de skeleton.
+     * Llamado por provideValtechSkeleton().
+     */
+    configure(config: SkeletonConfig): void;
+    /**
+     * Registra un template de skeleton personalizado.
+     *
+     * @param name Nombre unico del template
+     * @param component Componente a usar
+     * @param defaultConfig Configuracion por defecto opcional
+     */
+    registerTemplate(name: string, component: Type<unknown>, defaultConfig?: SkeletonTemplateConfig): void;
+    /**
+     * Obtiene un template de skeleton registrado.
+     *
+     * @param name Nombre del template
+     * @returns Template registrado o undefined si no existe
+     */
+    getTemplate(name: SkeletonTemplateName | string): RegisteredSkeletonTemplate | undefined;
+    /**
+     * Verifica si un template esta registrado.
+     *
+     * @param name Nombre del template
+     * @returns true si el template existe
+     */
+    hasTemplate(name: string): boolean;
+    /**
+     * Obtiene todos los nombres de templates registrados.
+     *
+     * @returns Array de nombres de templates
+     */
+    getTemplateNames(): string[];
+    /**
+     * Registra un estado de carga nombrado.
+     * Util para indicadores de carga globales.
+     *
+     * @param key Identificador unico del estado
+     * @param isLoading Estado de carga
+     */
+    setLoadingState(key: string, isLoading: boolean): void;
+    /**
+     * Obtiene el estado de carga para una clave especifica.
+     *
+     * @param key Identificador del estado
+     * @returns Estado de carga actual
+     */
+    getLoadingState(key: string): boolean;
+    /**
+     * Crea un signal computado para un estado de carga especifico.
+     *
+     * @param key Identificador del estado
+     * @returns Signal reactivo del estado de carga
+     */
+    loadingState(key: string): import("@angular/core").Signal<boolean>;
+    /**
+     * Obtiene todas las claves de estados de carga activos.
+     *
+     * @returns Array de claves con estado de carga activo
+     */
+    getActiveLoadingKeys(): string[];
+    /**
+     * Limpia todos los estados de carga.
+     */
+    clearLoadingStates(): void;
+    /**
+     * Limpia un estado de carga especifico.
+     *
+     * @param key Identificador del estado a limpiar
+     */
+    clearLoadingState(key: string): void;
+    /**
+     * Ejecuta una funcion async con tracking de estado de carga.
+     *
+     * @param key Identificador del estado
+     * @param fn Funcion async a ejecutar
+     * @returns Resultado de la funcion
+     */
+    withLoading<T>(key: string, fn: () => Promise<T>): Promise<T>;
+    /**
+     * Obtiene la configuracion de animacion por defecto.
+     */
+    get animated(): boolean;
+    /**
+     * Obtiene el delay por defecto.
+     */
+    get defaultDelay(): number;
+    /**
+     * Obtiene el tiempo minimo por defecto.
+     */
+    get defaultMinTime(): number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SkeletonService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<SkeletonService>;
+}

package/lib/services/skeleton/templates/detail-skeleton.component.d.ts

@@ -0,0 +1,18 @@
+import { SkeletonTemplateConfig, SkeletonTemplateComponent } from '../types';
+import * as i0 from "@angular/core";
+/**
+ * Template de skeleton para paginas de detalle.
+ *
+ * @example
+ * <val-skeleton-detail></val-skeleton-detail>
+ *
+ * @example
+ * <val-skeleton-detail [config]="{ sections: 3 }"></val-skeleton-detail>
+ */
+export declare class DetailSkeletonComponent implements SkeletonTemplateComponent {
+    config: SkeletonTemplateConfig;
+    get sections(): number[];
+    get metaItems(): number[];
+    static ɵfac: i0.ɵɵFactoryDeclaration<DetailSkeletonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DetailSkeletonComponent, "val-skeleton-detail", never, { "config": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}

package/lib/services/skeleton/templates/form-skeleton.component.d.ts

@@ -0,0 +1,22 @@
+import { SkeletonTemplateConfig, SkeletonTemplateComponent } from '../types';
+import * as i0 from "@angular/core";
+/**
+ * Template de skeleton para formularios.
+ *
+ * @example
+ * <val-skeleton-form [config]="{ count: 4 }"></val-skeleton-form>
+ *
+ * @example
+ * <val-skeleton-form [config]="{ count: 3, variant: 'compact' }"></val-skeleton-form>
+ */
+export declare class FormSkeletonComponent implements SkeletonTemplateComponent {
+    config: SkeletonTemplateConfig;
+    get fields(): number[];
+    get isCompact(): boolean;
+    get labelWidth(): string;
+    get inputHeight(): string;
+    get buttonWidth(): string;
+    get buttonHeight(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormSkeletonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormSkeletonComponent, "val-skeleton-form", never, { "config": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}

package/lib/services/skeleton/templates/grid-skeleton.component.d.ts

@@ -0,0 +1,18 @@
+import { SkeletonTemplateConfig, SkeletonTemplateComponent } from '../types';
+import * as i0 from "@angular/core";
+/**
+ * Template de skeleton para grids de cards.
+ *
+ * @example
+ * <val-skeleton-grid [config]="{ count: 6 }"></val-skeleton-grid>
+ *
+ * @example
+ * <val-skeleton-grid [config]="{ count: 8, variant: 'cards', columns: 4 }"></val-skeleton-grid>
+ */
+export declare class GridSkeletonComponent implements SkeletonTemplateComponent {
+    config: SkeletonTemplateConfig;
+    get items(): number[];
+    get gridColumns(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GridSkeletonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GridSkeletonComponent, "val-skeleton-grid", never, { "config": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}

package/lib/services/skeleton/templates/list-skeleton.component.d.ts

@@ -0,0 +1,17 @@
+import { SkeletonTemplateConfig, SkeletonTemplateComponent } from '../types';
+import * as i0 from "@angular/core";
+/**
+ * Template de skeleton para listas.
+ *
+ * @example
+ * <val-skeleton-list [config]="{ count: 5 }"></val-skeleton-list>
+ *
+ * @example
+ * <val-skeleton-list [config]="{ count: 3, variant: 'avatar', gap: '16px' }"></val-skeleton-list>
+ */
+export declare class ListSkeletonComponent implements SkeletonTemplateComponent {
+    config: SkeletonTemplateConfig;
+    get items(): number[];
+    static ɵfac: i0.ɵɵFactoryDeclaration<ListSkeletonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ListSkeletonComponent, "val-skeleton-list", never, { "config": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}

package/lib/services/skeleton/templates/profile-skeleton.component.d.ts

@@ -0,0 +1,20 @@
+import { SkeletonTemplateConfig, SkeletonTemplateComponent } from '../types';
+import * as i0 from "@angular/core";
+/**
+ * Template de skeleton para perfiles de usuario.
+ *
+ * @example
+ * <val-skeleton-profile></val-skeleton-profile>
+ *
+ * @example
+ * <val-skeleton-profile [config]="{ variant: 'full' }"></val-skeleton-profile>
+ */
+export declare class ProfileSkeletonComponent implements SkeletonTemplateComponent {
+    config: SkeletonTemplateConfig;
+    get avatarSize(): string;
+    get nameWidth(): string;
+    get subtitleWidth(): string;
+    get stats(): number[];
+    static ɵfac: i0.ɵɵFactoryDeclaration<ProfileSkeletonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ProfileSkeletonComponent, "val-skeleton-profile", never, { "config": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}

package/lib/services/skeleton/templates/table-skeleton.component.d.ts

@@ -0,0 +1,17 @@
+import { SkeletonTemplateConfig, SkeletonTemplateComponent } from '../types';
+import * as i0 from "@angular/core";
+/**
+ * Template de skeleton para tablas.
+ *
+ * @example
+ * <val-skeleton-table [config]="{ columns: 5, rows: 10 }"></val-skeleton-table>
+ */
+export declare class TableSkeletonComponent implements SkeletonTemplateComponent {
+    config: SkeletonTemplateConfig;
+    get columns(): number[];
+    get rows(): number[];
+    getColumnFlex(index: number): string;
+    getColumnContentWidth(index: number): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TableSkeletonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TableSkeletonComponent, "val-skeleton-table", never, { "config": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}

package/lib/services/skeleton/types.d.ts

@@ -0,0 +1,111 @@
+import { Signal, TemplateRef, Type } from '@angular/core';
+import { Observable } from 'rxjs';
+/**
+ * Nombres de templates de skeleton disponibles.
+ */
+export type SkeletonTemplateName = 'list' | 'list-avatar' | 'grid' | 'grid-cards' | 'form' | 'form-compact' | 'profile' | 'profile-full' | 'detail' | 'table';
+/**
+ * Configuracion para un skeleton template.
+ */
+export interface SkeletonTemplateConfig {
+    /** Numero de items skeleton a mostrar */
+    count?: number;
+    /** Variante del layout */
+    variant?: string;
+    /** Gap entre items (valor CSS) */
+    gap?: string;
+    /** Ancho personalizado */
+    width?: string;
+    /** Animacion habilitada */
+    animated?: boolean;
+    /** Clases CSS adicionales */
+    cssClass?: string;
+    /** Numero de columnas (para grid/table) */
+    columns?: number;
+    /** Numero de filas (para table) */
+    rows?: number;
+    /** Numero de secciones (para detail) */
+    sections?: number;
+}
+/**
+ * Fuente de estado de carga - puede ser Signal, Observable o Promise.
+ */
+export type LoadingSource<T = boolean> = Signal<T> | Observable<T> | Promise<T> | boolean;
+/**
+ * Configuracion para la directiva valSkeleton.
+ */
+export interface SkeletonDirectiveConfig {
+    /** Mostrar skeleton cuando esto sea truthy */
+    when: LoadingSource;
+    /** Nombre del template o componente a usar */
+    template?: SkeletonTemplateName | string;
+    /** Configuracion del template */
+    config?: SkeletonTemplateConfig;
+    /** Delay antes de mostrar skeleton (ms) - previene flash */
+    delay?: number;
+    /** Tiempo minimo de visualizacion (ms) - previene parpadeo */
+    minTime?: number;
+}
+/**
+ * Configuracion para la directiva valLoading.
+ */
+export interface LoadingDirectiveConfig {
+    /** Fuente de estado de carga */
+    loading: LoadingSource;
+    /** Template de skeleton a mostrar durante carga */
+    skeleton?: SkeletonTemplateName | string;
+    /** Configuracion del skeleton */
+    skeletonConfig?: SkeletonTemplateConfig;
+    /** Template ref personalizado para skeleton */
+    skeletonTemplate?: TemplateRef<unknown>;
+    /** Mostrar spinner en lugar de skeleton */
+    spinner?: boolean;
+    /** Delay antes de mostrar estado de carga (ms) */
+    delay?: number;
+    /** Tiempo minimo de carga (ms) */
+    minTime?: number;
+}
+/**
+ * Template de skeleton registrado.
+ */
+export interface RegisteredSkeletonTemplate {
+    name: string;
+    component: Type<unknown>;
+    defaultConfig?: SkeletonTemplateConfig;
+}
+/**
+ * Configuracion para provideValtechSkeleton().
+ */
+export interface SkeletonConfig {
+    /** Animacion habilitada por defecto */
+    animated?: boolean;
+    /** Delay global antes de mostrar skeletons */
+    defaultDelay?: number;
+    /** Tiempo minimo de visualizacion global */
+    defaultMinTime?: number;
+    /** Templates de skeleton personalizados a registrar */
+    templates?: RegisteredSkeletonTemplate[];
+    /** Template por defecto para listas */
+    defaultListTemplate?: SkeletonTemplateName;
+    /** Template por defecto para grids */
+    defaultGridTemplate?: SkeletonTemplateName;
+}
+/**
+ * Configuracion por defecto para el sistema de skeletons.
+ */
+export declare const DEFAULT_SKELETON_CONFIG: SkeletonConfig;
+/**
+ * Contexto para templates de skeleton en directivas.
+ */
+export interface SkeletonTemplateContext {
+    /** Configuracion del skeleton */
+    config: SkeletonTemplateConfig;
+    /** Estado de animacion */
+    animated: boolean;
+}
+/**
+ * Tipo base para componentes de skeleton template.
+ */
+export interface SkeletonTemplateComponent {
+    config: SkeletonTemplateConfig;
+}

package/lib/services/theme.service.d.ts

@@ -0,0 +1,76 @@
+import { BehaviorSubject } from 'rxjs';
+import * as i0 from "@angular/core";
+export declare enum ThemeOption {
+    LIGHT = "light",
+    DARK = "dark",
+    AUTO = "auto"
+}
+export declare class ThemeService {
+    /**
+     * Indicates if the light theme is active.
+     */
+    lightToggle: boolean;
+    /**
+     * Indicates if the dark theme is active.
+     */
+    darkToggle: boolean;
+    /**
+     * Indicates if the auto theme is active.
+     */
+    autoToggle: boolean;
+    /**
+     * The current selected theme option.
+     */
+    currentOption: ThemeOption;
+    /**
+     * Enum with all available theme options.
+     */
+    themeOptions: typeof ThemeOption;
+    /**
+     * Whether the system prefers dark mode.
+     */
+    prefersDark: boolean;
+    /**
+     * The default theme option.
+     */
+    default: ThemeOption;
+    /**
+     * Observable for the current theme.
+     */
+    theme: BehaviorSubject<ThemeOption>;
+    constructor();
+    private handleAutoConfiguration;
+    private handleDarkPreference;
+    private handleLightPreference;
+    /**
+     * Returns true if the system prefers dark mode.
+     */
+    get IsDark(): boolean;
+    /**
+     * Gets the current theme option.
+     */
+    get Theme(): ThemeOption;
+    /**
+     * Sets the current theme option and persists it.
+     */
+    set Theme(theme: ThemeOption);
+    /**
+     * Toggles a theme class on the document body.
+     * @param name The theme name
+     * @param shouldAdd Whether to add or remove the class
+     *
+     * Ionic 8 (`dark.class.css` palette) usa `.ion-palette-dark` en `<html>` para
+     * conmutar el tema dark; en versiones previas leía `body.dark`. Mantenemos
+     * el toggle sobre `body.{name}` por compat con código legacy, y además
+     * espejamos `ion-palette-dark` en `<html>` cuando `name === 'dark'` — esto
+     * es lo que las apps en Ionic 8 necesitan para que el palette aplique.
+     */
+    toggleTheme(name: string, shouldAdd: boolean): void;
+    /**
+     * Sets the user theme preference and updates toggles and theme classes.
+     * @param option The selected theme option
+     */
+    toggleUserPreference(option: ThemeOption): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ThemeService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ThemeService>;
+}