valtech-components 2.0.496 → 2.0.498

package/lib/components/molecules/language-selector/language-selector.component.d.ts

@@ -10,18 +10,15 @@ export declare class LanguageSelectorComponent implements OnInit {
     /**
      * Event emitted when the language selection changes.
      * Emits the selected language code.
-     * Note: Page will reload after this event.
      */
     languageChange: EventEmitter<string>;
     /** Popover selector configuration */
     popoverProps: PopoverSelectorMetadata;
-    private localeService;
+    private i18n;
     /** Default language display names */
     private readonly defaultLanguageNames;
     /** Default flag icons for languages */
     private readonly defaultLanguageFlags;
-    /** Available languages */
-    private readonly availableLanguages;
     constructor();
     ngOnInit(): void;
     private initializePopoverProps;

package/lib/components/molecules/language-selector/types.d.ts

@@ -49,4 +49,11 @@ export interface LanguageSelectorMetadata {
     disabled?: boolean;
     /** Custom display names for languages */
     customLanguageNames?: Record<string, string>;
+    /**
+     * Force page reload on language change.
+     * By default (false), language changes are reactive without reload.
+     * Set to true for legacy behavior or if reactive updates don't work.
+     * @default false
+     */
+    forceReload?: boolean;
 }

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

@@ -8,6 +8,7 @@ import { AuthStorageService } from './storage.service';
 import { AuthSyncService } from './sync.service';
 import { SigninRequest, SigninResponse, SignupRequest, SignupResponse, VerifyEmailRequest, VerifyEmailResponse, ResendCodeRequest, ResendCodeResponse, MFAVerifyResponse, RefreshResponse, GetPermissionsResponse, GetProfileResponse, UpdateProfileRequest, UpdateProfileResponse, MFASetupResponse, MFAConfirmResponse, MFADisableResponse, ForgotPasswordRequest, ForgotPasswordResponse, ResetPasswordRequest, ResetPasswordResponse, SwitchOrgResponse, MFAMethod, AuthError, ValtechAuthConfig, EnableNotificationsResult, NotificationPermissionState, RegisterDeviceResult, TOTPSetupResponse, TOTPVerifySetupResponse, TOTPDisableResponse, RegenerateBackupCodesResponse, BackupCodesCountResponse } from './types';
 import { FirebaseService, MessagingService } from '../firebase';
+import { I18nService } from '../i18n';
 import * as i0 from "@angular/core";
 /**
  * Servicio principal de autenticación.
@@ -41,9 +42,10 @@ export declare class AuthService implements OnDestroy {
     private syncService;
     private firebaseService;
     private messagingService;
+    private i18nService;
     private refreshTimerId;
     private syncSubscription;
-    constructor(config: ValtechAuthConfig, http: HttpClient, router: Router, stateService: AuthStateService, tokenService: TokenService, storageService: AuthStorageService, syncService: AuthSyncService, firebaseService: FirebaseService, messagingService: MessagingService | null);
+    constructor(config: ValtechAuthConfig, http: HttpClient, router: Router, stateService: AuthStateService, tokenService: TokenService, storageService: AuthStorageService, syncService: AuthSyncService, firebaseService: FirebaseService, messagingService: MessagingService | null, i18nService: I18nService | null);
     /** Estado completo de autenticación */
     readonly state: import("@angular/core").Signal<import("./types").AuthState>;
     /** Usuario está autenticado */
@@ -275,6 +277,6 @@ export declare class AuthService implements OnDestroy {
      * Detecta información de la plataforma del dispositivo.
      */
     private detectPlatformInfo;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AuthService, [null, null, null, null, null, null, null, null, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AuthService, [null, null, null, null, null, null, null, null, { optional: true; }, { optional: true; }]>;
     static ɵprov: i0.ɵɵInjectableDeclaration<AuthService>;
 }

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

@@ -249,6 +249,8 @@ export interface SigninResponse {
     isNewDevice?: boolean;
     /** ID del dispositivo usado para el login */
     deviceId?: string;
+    /** Idioma preferido del usuario (para sincronizar con i18n) */
+    language?: string;
 }
 /**
  * Request para verificar MFA.
@@ -269,6 +271,8 @@ export interface MFAVerifyResponse {
     tokenType: string;
     roles?: string[];
     permissions?: string[];
+    /** Idioma preferido del usuario (para sincronizar con i18n) */
+    language?: string;
 }
 /**
  * Request para refrescar token.

package/lib/services/firebase/analytics-types.d.ts

@@ -0,0 +1,219 @@
+/**
+ * Analytics Types
+ *
+ * Tipos e interfaces para el servicio de Firebase Analytics (GA4).
+ */
+/**
+ * Configuración de Analytics para ValtechFirebaseConfig
+ */
+export interface AnalyticsConfig {
+    /** Habilitar tracking automático de page views via Router (default: true) */
+    enablePageViewTracking?: boolean;
+    /** Habilitar tracking automático de errores via ErrorHandler (default: false) */
+    enableErrorTracking?: boolean;
+    /** Habilitar integración con auth para userId y userProperties (default: true) */
+    enableAuthIntegration?: boolean;
+    /** Modo debug: no envía a Firebase, logea a consola (default: false en prod) */
+    debugMode?: boolean;
+    /** Rutas a excluir del page view tracking (regex patterns) */
+    excludeRoutes?: string[];
+    /** Consent mode inicial (GDPR) */
+    defaultConsent?: ConsentSettings;
+    /** Clave de localStorage para persistir consent (default: 'analytics_consent') */
+    consentStorageKey?: string;
+    /** Propiedades de usuario por defecto */
+    defaultUserProperties?: Record<string, string>;
+    /** Prefijo para eventos custom (ej: 'myapp_') */
+    eventPrefix?: string;
+    /** Sampling rate (0.0 - 1.0) para reducir volumen (default: 1.0) */
+    samplingRate?: number;
+}
+/**
+ * Settings de consentimiento GDPR
+ */
+export interface ConsentSettings {
+    /** Permite recolección de analytics */
+    analytics?: boolean;
+    /** Permite personalización de ads */
+    advertising?: boolean;
+    /** Permite funcionalidad */
+    functionality?: boolean;
+    /** Permite seguridad */
+    security?: boolean;
+}
+/**
+ * Estado completo de consentimiento
+ */
+export interface ConsentState {
+    /** Settings actuales */
+    settings: ConsentSettings;
+    /** Timestamp de la última actualización */
+    updatedAt: Date | null;
+    /** Si el usuario ha tomado una decisión explícita */
+    hasDecided: boolean;
+}
+/**
+ * Nombres de eventos GA4 recomendados + customs
+ */
+export type AnalyticsEventName = 'add_payment_info' | 'add_shipping_info' | 'add_to_cart' | 'add_to_wishlist' | 'begin_checkout' | 'purchase' | 'refund' | 'remove_from_cart' | 'view_cart' | 'view_item' | 'view_item_list' | 'generate_lead' | 'login' | 'page_view' | 'screen_view' | 'search' | 'select_content' | 'select_item' | 'select_promotion' | 'share' | 'sign_up' | 'view_promotion' | 'feature_used' | 'preference_changed' | 'onboarding_step' | 'error_occurred' | 'performance_metric' | string;
+/**
+ * Parámetros tipados por evento
+ */
+export interface AnalyticsEventParams {
+    add_to_cart: {
+        item_id: string;
+        item_name?: string;
+        value?: number;
+        currency?: string;
+        quantity?: number;
+    };
+    purchase: {
+        transaction_id: string;
+        value: number;
+        currency?: string;
+        items?: AnalyticsItem[];
+        tax?: number;
+        shipping?: number;
+    };
+    begin_checkout: {
+        value?: number;
+        currency?: string;
+        items?: AnalyticsItem[];
+    };
+    view_item: {
+        item_id: string;
+        item_name?: string;
+        value?: number;
+        currency?: string;
+    };
+    remove_from_cart: {
+        item_id: string;
+        item_name?: string;
+        value?: number;
+    };
+    login: {
+        method?: string;
+    };
+    sign_up: {
+        method?: string;
+    };
+    search: {
+        search_term: string;
+    };
+    share: {
+        content_type?: string;
+        item_id?: string;
+        method?: string;
+    };
+    select_content: {
+        content_type: string;
+        item_id?: string;
+    };
+    page_view: {
+        page_path?: string;
+        page_title?: string;
+        page_location?: string;
+    };
+    screen_view: {
+        screen_name: string;
+        screen_class?: string;
+    };
+    feature_used: {
+        feature_name: string;
+        feature_category?: string;
+    };
+    preference_changed: {
+        preference_name: string;
+        old_value?: string;
+        new_value?: string;
+    };
+    onboarding_step: {
+        step_number: number;
+        step_name?: string;
+    };
+    error_occurred: {
+        error_type: string;
+        error_message?: string;
+        error_stack?: string;
+        context?: string;
+    };
+    performance_metric: {
+        metric_name: string;
+        value: number;
+        unit?: string;
+    };
+    [key: string]: Record<string, unknown> | undefined;
+}
+/**
+ * Item para eventos de ecommerce
+ */
+export interface AnalyticsItem {
+    /** ID único del item */
+    item_id: string;
+    /** Nombre del item */
+    item_name: string;
+    /** Categoría principal */
+    item_category?: string;
+    /** Subcategorías */
+    item_category2?: string;
+    item_category3?: string;
+    /** Marca */
+    item_brand?: string;
+    /** Variante (ej: color, talla) */
+    item_variant?: string;
+    /** Precio unitario */
+    price?: number;
+    /** Cantidad */
+    quantity?: number;
+    /** Moneda ISO 4217 */
+    currency?: string;
+    /** Posición en lista */
+    index?: number;
+    /** Cupón aplicado */
+    coupon?: string;
+}
+/**
+ * Tipo de evento de debug
+ */
+export type DebugEventType = 'event' | 'page_view' | 'screen_view' | 'user_property' | 'error' | 'consent' | 'timing';
+/**
+ * Evento de debug (solo en debug mode)
+ */
+export interface AnalyticsDebugEvent {
+    /** Timestamp del evento */
+    timestamp: Date;
+    /** Tipo de evento */
+    type: DebugEventType;
+    /** Nombre del evento */
+    name: string;
+    /** Parámetros del evento */
+    params?: Record<string, unknown>;
+    /** Si fue enviado a Firebase (false en debug mode) */
+    sent: boolean;
+}
+/**
+ * Métrica de timing/performance
+ */
+export interface TimingMetric {
+    /** Nombre de la métrica */
+    name: string;
+    /** Valor en milisegundos */
+    valueMs: number;
+    /** Categoría (ej: 'api', 'render', 'load') */
+    category?: string;
+    /** Parámetros adicionales */
+    params?: Record<string, string>;
+}
+/**
+ * Propiedades de usuario para segmentación
+ */
+export interface UserProperties {
+    /** Idioma preferido */
+    preferred_language?: string;
+    /** Nivel de suscripción */
+    subscription_tier?: string;
+    /** Organización activa (multi-tenant) */
+    active_organization?: string;
+    /** Propiedades custom */
+    [key: string]: string | number | boolean | undefined;
+}

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

@@ -4,6 +4,7 @@
  * Tipos e interfaces para la integración de Firebase en valtech-components.
  * Todos los modelos de Firestore deben extender FirestoreDocument.
  */
+import type { AnalyticsConfig } from './analytics-types';
 /**
  * Configuración de Firebase (valores de firebaseConfig)
  */
@@ -72,6 +73,16 @@ export interface ValtechFirebaseConfig {
      * Default: false
      */
     debugMessagePersistence?: boolean;
+    /**
+     * Habilitar Firebase Analytics / GA4 (default: false).
+     * Requiere measurementId en firebase config.
+     */
+    enableAnalytics?: boolean;
+    /**
+     * Configuración detallada de Analytics.
+     * Solo aplica si enableAnalytics es true.
+     */
+    analyticsConfig?: AnalyticsConfig;
 }
 /**
  * Interface base para todos los documentos de Firestore.

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

@@ -0,0 +1,29 @@
+import { EnvironmentProviders } from '@angular/core';
+import { I18nConfig } from './types';
+/**
+ * Configura el sistema de internacionalización de Valtech Components.
+ *
+ * @param config Configuración de i18n
+ * @returns Providers para agregar en app.config.ts
+ *
+ * @example
+ * // app.config.ts
+ * import { provideValtechI18n } from 'valtech-components';
+ * import { GLOBAL_CONTENT } from './i18n/_global';
+ * import { LOGIN_CONTENT } from './i18n/login.i18n';
+ *
+ * export const appConfig: ApplicationConfig = {
+ *   providers: [
+ *     provideValtechI18n({
+ *       defaultLanguage: 'es',
+ *       supportedLanguages: ['es', 'en'],
+ *       detectBrowserLanguage: true,
+ *       content: {
+ *         '_global': GLOBAL_CONTENT,
+ *         'Login': LOGIN_CONTENT,
+ *       }
+ *     }),
+ *   ]
+ * };
+ */
+export declare function provideValtechI18n(config?: I18nConfig): EnvironmentProviders;

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

@@ -0,0 +1,112 @@
+import { I18nLang, LanguagesContent, ContentStore } from './types';
+import * as i0 from "@angular/core";
+/**
+ * Servicio de internacionalización basado en Angular Signals.
+ *
+ * Características:
+ * - Sin RxJS: usa Signals para evitar memory leaks y congelamiento
+ * - Namespace-based: organiza traducciones por contexto
+ * - Fallback multi-nivel: namespace → _global → placeholder
+ * - Interpolación: soporta {variable} en textos
+ *
+ * @example
+ * // En un componente
+ * i18n = inject(I18nService);
+ *
+ * // Obtener texto
+ * const title = this.i18n.t('title', 'Login');
+ *
+ * // Con interpolación
+ * const welcome = this.i18n.t('welcome', 'Login', { name: 'Juan' });
+ *
+ * // Cambiar idioma
+ * this.i18n.setLanguage('en');
+ */
+export declare class I18nService {
+    private readonly _lang;
+    private readonly _content;
+    private readonly _supportedLanguages;
+    readonly lang: import("@angular/core").Signal<I18nLang>;
+    readonly supportedLanguages: import("@angular/core").Signal<I18nLang[]>;
+    readonly isSpanish: import("@angular/core").Signal<boolean>;
+    readonly isEnglish: import("@angular/core").Signal<boolean>;
+    constructor();
+    /**
+     * Obtiene texto traducido (alias corto de getText)
+     *
+     * @param key Clave del texto
+     * @param namespace Namespace (default: '_global')
+     * @param data Variables para interpolación
+     * @returns Texto traducido o placeholder [namespace.key]
+     *
+     * @example
+     * i18n.t('submit');                    // busca en _global
+     * i18n.t('title', 'Login');            // busca en Login
+     * i18n.t('welcome', 'Login', {name});  // con interpolación
+     */
+    t(key: string, namespace?: string, data?: Record<string, string>): string;
+    /**
+     * Obtiene texto traducido
+     *
+     * Fallback order:
+     * 1. content[namespace][lang][key]
+     * 2. content['_global'][lang][key]
+     * 3. "[namespace.key]" (placeholder)
+     */
+    getText(key: string, namespace?: string, data?: Record<string, string>): string;
+    /**
+     * Cambia el idioma de la aplicación
+     *
+     * @param lang Nuevo idioma
+     * @param forceReload Si true, recarga la página (fallback si reactividad falla)
+     */
+    setLanguage(lang: I18nLang, forceReload?: boolean): void;
+    /**
+     * Registra contenido de traducciones para un namespace
+     *
+     * @param namespace Nombre del namespace
+     * @param content Contenido de traducciones
+     *
+     * @example
+     * i18n.registerContent('Login', {
+     *   es: { title: 'Iniciar sesión' },
+     *   en: { title: 'Sign in' }
+     * });
+     */
+    registerContent(namespace: string, content: LanguagesContent): void;
+    /**
+     * Registra múltiples namespaces de una vez
+     *
+     * @param contentStore Objeto con namespaces como keys
+     */
+    registerContentBulk(contentStore: ContentStore): void;
+    /**
+     * Configura los idiomas soportados
+     */
+    setI18nLanguages(languages: I18nLang[]): void;
+    /**
+     * Obtiene todos los namespaces registrados
+     */
+    getNamespaces(): string[];
+    /**
+     * Verifica si un namespace tiene traducciones
+     */
+    hasNamespace(namespace: string): boolean;
+    /**
+     * Carga idioma guardado en localStorage o detecta del navegador
+     */
+    private loadStoredLanguage;
+    /**
+     * Valida si un idioma está soportado
+     */
+    private isValidLanguage;
+    /**
+     * Reemplaza {variable} en texto con valores de data
+     *
+     * @example
+     * interpolate('Hola {name}', { name: 'Juan' }) // 'Hola Juan'
+     */
+    private interpolate;
+    static ɵfac: i0.ɵɵFactoryDeclaration<I18nService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<I18nService>;
+}

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

@@ -0,0 +1,4 @@
+export { I18nLang, LanguagesContent, ContentStore, I18nConfig, LANG_STORAGE_KEY, } from './types';
+export { I18nService } from './i18n.service';
+export { TranslatePipe } from './translate.pipe';
+export { provideValtechI18n } from './config';

package/lib/services/i18n/translate.pipe.d.ts

@@ -0,0 +1,36 @@
+import { PipeTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Pipe de traducción para templates.
+ *
+ * NOTA: Es impure para detectar cambios de idioma.
+ * El costo es mínimo porque I18nService usa Signals internamente.
+ *
+ * @example
+ * <!-- Busca en _global -->
+ * {{ 'submit' | t }}
+ *
+ * <!-- Busca en namespace específico -->
+ * {{ 'title' | t:'Login' }}
+ *
+ * <!-- Con interpolación -->
+ * {{ 'welcome' | t:'Login':{ name: userName } }}
+ *
+ * <!-- En atributos -->
+ * <val-button [label]="'submit' | t"></val-button>
+ * <val-input [label]="'email' | t:'Login'"></val-input>
+ */
+export declare class TranslatePipe implements PipeTransform {
+    private readonly i18n;
+    /**
+     * Transforma una key de traducción a su valor
+     *
+     * @param key Clave del texto
+     * @param namespace Namespace opcional (default: '_global')
+     * @param data Variables para interpolación opcional
+     * @returns Texto traducido
+     */
+    transform(key: string, namespace?: string, data?: Record<string, string>): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TranslatePipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<TranslatePipe, "t", true>;
+}

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

@@ -0,0 +1,59 @@
+/**
+ * Idiomas soportados por el sistema i18n
+ */
+export type I18nLang = 'es' | 'en' | 'pt' | 'fr' | 'de';
+/**
+ * Contenido de traducciones para un namespace
+ *
+ * @example
+ * const loginContent: LanguagesContent = {
+ *   es: { title: 'Iniciar sesión', submit: 'Entrar' },
+ *   en: { title: 'Sign in', submit: 'Sign in' }
+ * };
+ */
+export type LanguagesContent = {
+    [lang in I18nLang]?: Record<string, string>;
+};
+/**
+ * Almacén de contenido por namespace
+ *
+ * @example
+ * {
+ *   '_global': { es: {...}, en: {...} },
+ *   'Login': { es: {...}, en: {...} },
+ *   'Profile': { es: {...}, en: {...} }
+ * }
+ */
+export type ContentStore = Record<string, LanguagesContent>;
+/**
+ * Configuración para provideValtechI18n()
+ */
+export interface I18nConfig {
+    /**
+     * Idioma por defecto si no hay preferencia guardada
+     * @default 'es'
+     */
+    defaultLanguage?: I18nLang;
+    /**
+     * Lista de idiomas habilitados en la app
+     * @default ['es', 'en']
+     */
+    supportedLanguages?: I18nLang[];
+    /**
+     * Detectar idioma del navegador al iniciar
+     * @default true
+     */
+    detectBrowserLanguage?: boolean;
+    /**
+     * Contenido inicial de traducciones por namespace
+     */
+    content?: ContentStore;
+}
+/**
+ * Valores por defecto de configuración
+ */
+export declare const DEFAULT_I18N_CONFIG: Required<I18nConfig>;
+/**
+ * Clave para persistir idioma en localStorage
+ */
+export declare const LANG_STORAGE_KEY = "app_lang";

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

@@ -0,0 +1,32 @@
+import { EnvironmentProviders } from '@angular/core';
+import { PresetConfig } from './types';
+/**
+ * Configura el sistema de presets de Valtech Components.
+ *
+ * @param presets Configuración de presets por componente
+ * @returns Providers para agregar en app.config.ts
+ *
+ * @example
+ * // app.config.ts
+ * import { provideValtechPresets } from 'valtech-components';
+ *
+ * export const appConfig: ApplicationConfig = {
+ *   providers: [
+ *     provideValtechPresets({
+ *       button: {
+ *         'primary-action': { size: 'large', color: 'primary', fill: 'solid' },
+ *         'secondary': { size: 'medium', color: 'secondary', fill: 'outline' },
+ *         'danger': { size: 'medium', color: 'danger', fill: 'solid' },
+ *       },
+ *       card: {
+ *         'feature': { variant: 'elevated', padding: 'large' },
+ *         'compact': { variant: 'flat', padding: 'small' },
+ *       },
+ *       input: {
+ *         'form-field': { size: 'medium', fill: 'outline', labelPosition: 'floating' },
+ *       }
+ *     }),
+ *   ]
+ * };
+ */
+export declare function provideValtechPresets(presets: PresetConfig): EnvironmentProviders;

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

@@ -0,0 +1,3 @@
+export { PresetConfig, ComponentPresets, PresetsOptions } from './types';
+export { PresetService } from './preset.service';
+export { provideValtechPresets } from './config';

package/lib/services/presets/preset.service.d.ts

@@ -0,0 +1,69 @@
+import { PresetConfig, ComponentPresets } from './types';
+import * as i0 from "@angular/core";
+/**
+ * Servicio para gestionar presets de componentes.
+ *
+ * Los presets permiten definir configuraciones reutilizables
+ * de componentes (tamaño, color, variante, etc.) que se pueden
+ * aplicar con un nombre semántico.
+ *
+ * @example
+ * // En un componente
+ * presets = inject(PresetService);
+ *
+ * // Obtener preset
+ * const buttonProps = this.presets.get<ButtonMetadata>('button', 'primary-action');
+ * // { size: 'large', color: 'primary', fill: 'solid' }
+ */
+export declare class PresetService {
+    private readonly _presets;
+    /**
+     * Obtiene un preset específico para un componente
+     *
+     * @param component Tipo de componente (ej: 'button', 'card', 'input')
+     * @param presetName Nombre del preset (ej: 'primary-action', 'compact')
+     * @returns Propiedades del preset o objeto vacío si no existe
+     *
+     * @example
+     * // Obtener preset de botón
+     * const props = presets.get<ButtonMetadata>('button', 'primary-action');
+     *
+     * // Usar en componente
+     * <val-button [props]="props"></val-button>
+     */
+    get<T extends Record<string, unknown>>(component: string, presetName: string): Partial<T>;
+    /**
+     * Verifica si existe un preset
+     */
+    has(component: string, presetName: string): boolean;
+    /**
+     * Registra presets de la aplicación
+     *
+     * @param presets Configuración de presets
+     *
+     * @example
+     * presets.registerPresets({
+     *   button: {
+     *     'primary-action': { size: 'large', color: 'primary' },
+     *   },
+     *   card: {
+     *     'feature': { variant: 'elevated' },
+     *   }
+     * });
+     */
+    registerPresets(presets: PresetConfig): void;
+    /**
+     * Agrega presets para un componente específico (merge con existentes)
+     */
+    registerComponentPresets(component: string, presets: ComponentPresets): void;
+    /**
+     * Obtiene todos los nombres de presets para un componente
+     */
+    getPresetNames(component: string): string[];
+    /**
+     * Obtiene todos los componentes con presets registrados
+     */
+    getRegisteredComponents(): string[];
+    static ɵfac: i0.ɵɵFactoryDeclaration<PresetService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<PresetService>;
+}