valtech-components 2.0.291 → 2.0.293

package/lib/components/atoms/button/button.component.d.ts

@@ -1,25 +1,32 @@
-import { EventEmitter } from '@angular/core';
+import { EventEmitter, OnDestroy, OnInit } from '@angular/core';
+import { Observable } from 'rxjs';
+import { ContentService } from '../../../services/content.service';
 import { DownloadService } from '../../../services/download.service';
 import { IconService } from '../../../services/icons.service';
 import { NavigationService } from '../../../services/navigation.service';
 import { ButtonMetadata } from '../../types';
 import * as i0 from "@angular/core";
-export declare class ButtonComponent {
+export declare class ButtonComponent implements OnInit, OnDestroy {
     private download;
     private navigation;
+    private contentService;
     states: {
         ENABLED: "ENABLED";
         DISABLED: "DISABLED";
         WORKING: "WORKING";
         ERROR: "ERROR";
     };
+    displayText$: Observable<string>;
+    private subscriptions;
     props: ButtonMetadata;
     /**
      * Event emitted when the button is clicked.
      */
     onClick: EventEmitter<string>;
-    constructor(download: DownloadService, icon: IconService, navigation: NavigationService);
+    constructor(download: DownloadService, icon: IconService, navigation: NavigationService, contentService: ContentService);
     ngOnInit(): void;
+    ngOnDestroy(): void;
+    private initializeDisplayText;
     clickHandler(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "val-button", never, { "props": { "alias": "props"; "required": false; }; }, { "onClick": "onClick"; }, never, never, true, never>;

package/lib/components/atoms/display/display.component.d.ts

@@ -1,17 +1,25 @@
-import { OnInit } from '@angular/core';
+import { OnDestroy, OnInit } from '@angular/core';
+import { Observable } from 'rxjs';
+import { ContentService } from '../../../services/content.service';
 import { DisplayMetadata } from './types';
 import * as i0 from "@angular/core";
-export declare class DisplayComponent implements OnInit {
+export declare class DisplayComponent implements OnInit, OnDestroy {
+    private contentService;
+    displayContent$: Observable<string>;
+    private subscriptions;
     /**
      * Display configuration object.
      * @type {DisplayMetadata}
-     * @property content - The text to display.
+     * @property content - Static text to display (takes precedence over contentConfig).
+     * @property contentConfig - Reactive content configuration.
      * @property color - The text color (Ionic color string).
      * @property size - The text size ('small' | 'medium' | 'large' | 'xlarge').
      */
     props: DisplayMetadata;
-    constructor();
+    constructor(contentService: ContentService);
     ngOnInit(): void;
+    ngOnDestroy(): void;
+    private initializeDisplayContent;
     static ɵfac: i0.ɵɵFactoryDeclaration<DisplayComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DisplayComponent, "val-display", never, { "props": { "alias": "props"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/components/atoms/display/types.d.ts

@@ -1,13 +1,23 @@
 import { Color } from '@ionic/core';
 /**
- * Props for val-display component.
+ * Props for val-display component with reactive content support.
+ * Supports both static and reactive content patterns.
  *
  * @property size - The text size ('small' | 'medium' | 'large' | 'xlarge').
  * @property color - The text color (Ionic color string).
- * @property content - The text to display.
+ * @property content - Static content text (takes precedence over contentConfig).
+ * @property contentConfig - Reactive content configuration.
  */
 export interface DisplayMetadata {
     size: 'small' | 'medium' | 'large' | 'xlarge';
     color: Color;
-    content: string;
+    /** Static content (takes precedence over contentConfig) */
+    content?: string;
+    /** Reactive content configuration */
+    contentConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
 }

package/lib/components/atoms/title/title.component.d.ts

@@ -1,17 +1,22 @@
 import { OnInit } from '@angular/core';
+import { Observable } from 'rxjs';
 import { TitleMetadata } from './types';
 import * as i0 from "@angular/core";
 export declare class TitleComponent implements OnInit {
     /**
      * Title configuration object.
      * @type {TitleMetadata}
-     * @property content - The title text to display.
+     * @property content - Static title text (takes precedence over reactive content).
+     * @property contentConfig - Reactive content configuration.
      * @property color - The title color (Ionic color string).
      * @property size - The title size ('small' | 'medium' | 'large' | 'xlarge').
      * @property bold - Whether the title is bold.
      * @property thin - Whether the title is thin (optional).
      */
     props: TitleMetadata;
+    private contentService;
+    private contentHelper;
+    displayContent$: Observable<string>;
     constructor();
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TitleComponent, never>;

package/lib/components/atoms/title/types.d.ts

@@ -1,17 +1,43 @@
 import { Color } from '@ionic/core';
+import { ReactiveTextMetadata } from '../../../shared/utils/reactive-content';
 /**
  * Props for val-title component.
+ * Supports both static content and reactive content from the language service.
  *
- * @property content - The title text to display.
+ * @property content - Static title text to display (takes precedence over reactive content).
+ * @property contentConfig - Reactive content configuration (used when content is not provided).
  * @property color - The title color (Ionic color string).
  * @property size - The title size ('small' | 'medium' | 'large' | 'xlarge').
  * @property bold - Whether the title is bold.
  * @property thin - Whether the title is thin (optional).
  */
-export interface TitleMetadata {
+export interface TitleMetadata extends ReactiveTextMetadata {
     size: 'small' | 'medium' | 'large' | 'xlarge';
     color: Color;
-    content: string;
     bold: boolean;
     thin?: boolean;
 }
+/**
+ * Factory function to create title props with reactive content support.
+ *
+ * @param styleConfig - Title styling configuration
+ * @param contentConfig - Content configuration (static or reactive)
+ * @returns Complete TitleMetadata object
+ *
+ * @example Static content:
+ * ```typescript
+ * const props = createTitleProps(
+ *   { size: 'large', color: 'primary', bold: true },
+ *   { content: 'Static Title' }
+ * );
+ * ```
+ *
+ * @example Reactive content:
+ * ```typescript
+ * const props = createTitleProps(
+ *   { size: 'large', color: 'primary', bold: true },
+ *   { contentConfig: { key: 'pageTitle', fallback: 'Default Title' } }
+ * );
+ * ```
+ */
+export declare function createTitleProps(styleConfig: Pick<TitleMetadata, 'size' | 'color' | 'bold' | 'thin'>, contentConfig: Pick<TitleMetadata, 'content' | 'contentConfig'>): TitleMetadata;

package/lib/components/molecules/alert-box/alert-box.component.d.ts

@@ -1,17 +1,25 @@
-import { OnInit } from '@angular/core';
-import { AlertBoxMetadata } from './types';
+import { OnDestroy, OnInit } from '@angular/core';
+import { ContentService } from '../../../services/content.service';
+import { AlertBoxMetadata, ReactiveAlertBoxMetadata } from './types';
 import * as i0 from "@angular/core";
-export declare class AlertBoxComponent implements OnInit {
+export declare class AlertBoxComponent implements OnInit, OnDestroy {
+    private contentService;
+    private subscriptions;
     /**
      * Alert box configuration object.
-     * @type {AlertBoxMetadata}
-     * @property box - Box configuration (see BoxMetadata).
-     * @property icon - Icon configuration (see IconMetadata).
-     * @property text - Text configuration (see TextMetadata).
+     * Supports both legacy AlertBoxMetadata and ReactiveAlertBoxMetadata patterns.
      */
-    props: AlertBoxMetadata;
-    constructor();
+    props: AlertBoxMetadata | ReactiveAlertBoxMetadata;
+    /** Computed text properties for reactive pattern */
+    computedTextProps: any;
+    /** Whether this is using the legacy props pattern */
+    get isLegacyProps(): boolean;
+    /** Get text props for legacy pattern */
+    getLegacyTextProps(): any;
+    constructor(contentService: ContentService);
     ngOnInit(): void;
+    ngOnDestroy(): void;
+    private initializeReactiveTextProps;
     static ɵfac: i0.ɵɵFactoryDeclaration<AlertBoxComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<AlertBoxComponent, "val-alert-box", never, { "props": { "alias": "props"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/components/molecules/alert-box/types.d.ts

@@ -1,8 +1,37 @@
 import { BoxMetadata } from '../../atoms/box/types';
 import { IconMetadata } from '../../atoms/icon/types';
 import { TextMetadata } from '../../atoms/text/types';
+/**
+ * Alert box component metadata with support for reactive content.
+ * Provides both static and reactive content options for the text element.
+ */
 export interface AlertBoxMetadata {
     box: BoxMetadata;
     icon: IconMetadata;
     text: TextMetadata;
 }
+/**
+ * Enhanced alert box metadata with simplified reactive content support.
+ * Alternative to the standard AlertBoxMetadata for common use cases.
+ */
+export interface ReactiveAlertBoxMetadata {
+    /** Box styling configuration */
+    box: BoxMetadata;
+    /** Icon configuration */
+    icon: IconMetadata;
+    /** Static text (takes precedence over textConfig) */
+    text?: string;
+    /** Reactive content configuration for alert text */
+    textConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
+    /** Text styling options */
+    textStyle?: {
+        size?: 'small' | 'medium' | 'large' | 'xlarge';
+        color?: string;
+        bold?: boolean;
+    };
+}

package/lib/components/organisms/item-list/types.d.ts

@@ -6,27 +6,40 @@ import { Color } from '@ionic/core';
 import { ComponentState } from '../../types';
 /**
  * Representa una acción disponible en un elemento de la lista.
+ * Ahora soporta contenido reactivo para la descripción.
  * @property token Identificador único de la acción.
  * @property icon (opcional) Icono a mostrar.
- * @property description Descripción de la acción.
+ * @property description (opcional) Descripción estática de la acción.
+ * @property descriptionConfig (opcional) Configuración de contenido reactivo para la descripción.
  * @property state Estado de la acción (habilitado, deshabilitado, trabajando, etc).
  */
 export type ItemAction = {
     token: string;
     icon?: string;
-    description: string;
+    description?: string;
+    descriptionConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
     state: ComponentState;
 };
 /**
  * Metadatos de un elemento individual de la lista.
+ * Ahora soporta contenido reactivo para todos los campos de texto.
  * @property token (opcional) Identificador único del elemento.
  * @property mode Modo de visualización ('justext', 'subtitule', 'avatar', 'icon', 'route', 'actionable').
- * @property text Texto principal del elemento.
+ * @property text (opcional) Texto estático principal del elemento.
+ * @property textConfig (opcional) Configuración de contenido reactivo para el texto principal.
  * @property image (opcional) Imagen para modo avatar.
  * @property icon (opcional) Icono para modo icon.
- * @property comments (opcional) Comentarios o notas.
- * @property subtitle (opcional) Subtítulo.
- * @property endNote (opcional) Nota al final del elemento.
+ * @property comments (opcional) Comentarios estáticos.
+ * @property commentsConfig (opcional) Configuración de contenido reactivo para comentarios.
+ * @property subtitle (opcional) Subtítulo estático.
+ * @property subtitleConfig (opcional) Configuración de contenido reactivo para subtítulo.
+ * @property endNote (opcional) Nota estática al final del elemento.
+ * @property endNoteConfig (opcional) Configuración de contenido reactivo para la nota final.
  * @property actions (opcional) Acciones disponibles para el elemento.
  * @property color (opcional) Color personalizado.
  * @property lines (opcional) Tipo de líneas ('full', 'inset', 'none').
@@ -43,12 +56,36 @@ export type ItemAction = {
 export interface ItemMetadata {
     token?: string;
     mode: 'justext' | 'subtitule' | 'avatar' | 'icon' | 'route' | 'actionable';
-    text: string;
+    text?: string;
+    textConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
     image?: string;
     icon?: string;
     comments?: string;
+    commentsConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
     subtitle?: string;
+    subtitleConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
     endNote?: string;
+    endNoteConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
     actions?: ItemAction[];
     color?: string;
     lines?: 'full' | 'inset' | 'none';
@@ -64,11 +101,13 @@ export interface ItemMetadata {
 }
 /**
  * Metadatos de la lista de elementos.
+ * Ahora soporta contenido reactivo para el título.
  * @property color Color principal de la lista.
  * @property bordered Si la lista tiene borde.
  * @property rounded Si la lista tiene bordes redondeados.
  * @property shadowed Si la lista tiene sombra.
- * @property title Título de la lista.
+ * @property title (opcional) Título estático de la lista.
+ * @property titleConfig (opcional) Configuración de contenido reactivo para el título.
  * @property items Elementos a mostrar en la lista.
  */
 export interface ListMetadata {
@@ -76,6 +115,12 @@ export interface ListMetadata {
     bordered: boolean;
     rounded: boolean;
     shadowed: boolean;
-    title: string;
+    title?: string;
+    titleConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
     items: ItemMetadata[];
 }

package/lib/components/types.d.ts

@@ -177,8 +177,10 @@ export interface IconMetada {
 }
 /**
  * Button configuration object.
+ * Supports both static and reactive content.
  * @type {ButtonMetadata}
- * @property text - The button label.
+ * @property text - Static button label (takes precedence over textConfig).
+ * @property textConfig - Reactive content configuration for button text.
  * @property color - The button color (Ionic color string).
  * @property icon - Icon to display (optional).
  * @property state - Button state (enabled, disabled, working, etc.).
@@ -201,8 +203,15 @@ export interface ButtonMetadata {
     color: Color;
     /** Button state */
     state: ComponentState;
-    /** Display text */
-    text: string;
+    /** Static display text (takes precedence over textConfig) */
+    text?: string;
+    /** Reactive content configuration for button text */
+    textConfig?: {
+        className?: string;
+        key: string;
+        fallback?: string;
+        interpolation?: Record<string, any>;
+    };
     /** Associated icon */
     icon?: IconMetada;
     /** Button shape */

package/lib/examples/display-demo.component.d.ts

@@ -0,0 +1,59 @@
+import { OnInit } from '@angular/core';
+import { Observable } from 'rxjs';
+import { DisplayMetadata } from '../components/atoms/display/types';
+import { ContentService } from '../services/content.service';
+import { LangService } from '../services/lang-provider/lang-provider.service';
+import * as i0 from "@angular/core";
+/**
+ * Componente de demostración para val-display con contenido reactivo.
+ * Muestra diferentes patrones de uso y casos de ejemplo.
+ */
+export declare class DisplayDemoComponent implements OnInit {
+    private contentService;
+    private langService;
+    demoTitle$: Observable<string>;
+    languageLabel$: Observable<string>;
+    staticSectionTitle$: Observable<string>;
+    reactiveSectionTitle$: Observable<string>;
+    mixedSectionTitle$: Observable<string>;
+    dynamicSectionTitle$: Observable<string>;
+    analysisTitle$: Observable<string>;
+    reactiveContentTitle$: Observable<string>;
+    interpolationTitle$: Observable<string>;
+    fallbackTitle$: Observable<string>;
+    mixedContentTitle$: Observable<string>;
+    dynamicContentTitle$: Observable<string>;
+    updateButtonText$: Observable<string>;
+    currentLangLabel$: Observable<string>;
+    availableLangsLabel$: Observable<string>;
+    currentLanguage$: Observable<string>;
+    availableLanguages$: Observable<string[]>;
+    private counter;
+    smallStaticDisplay: DisplayMetadata;
+    mediumStaticDisplay: DisplayMetadata;
+    largeStaticDisplay: DisplayMetadata;
+    xlargeStaticDisplay: DisplayMetadata;
+    primaryDisplay: DisplayMetadata;
+    secondaryDisplay: DisplayMetadata;
+    successDisplay: DisplayMetadata;
+    warningDisplay: DisplayMetadata;
+    dangerDisplay: DisplayMetadata;
+    welcomeDisplay: DisplayMetadata;
+    descriptionDisplay: DisplayMetadata;
+    statusDisplay: DisplayMetadata;
+    userWelcomeDisplay: DisplayMetadata;
+    counterDisplay: DisplayMetadata;
+    missingKeyDisplay: DisplayMetadata;
+    noFallbackDisplay: DisplayMetadata;
+    staticMixedDisplay: DisplayMetadata;
+    reactiveMixedDisplay: DisplayMetadata;
+    dynamicCounterDisplay: DisplayMetadata;
+    constructor(contentService: ContentService, langService: LangService);
+    ngOnInit(): void;
+    private initializeContent;
+    private initializeLanguageState;
+    changeLanguage(language: string): void;
+    updateCounter(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DisplayDemoComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DisplayDemoComponent, "val-display-demo", never, {}, {}, never, never, true, never>;
+}

package/lib/examples/display-simple-example.component.d.ts

@@ -0,0 +1,23 @@
+import { DisplayMetadata } from '../components/atoms/display/types';
+import * as i0 from "@angular/core";
+/**
+ * Ejemplo rápido de uso del componente val-display con contenido reactivo
+ */
+export declare class DisplayExampleComponent {
+    staticTitle: DisplayMetadata;
+    staticSubtitle: DisplayMetadata;
+    reactiveWelcome: DisplayMetadata;
+    reactiveDescription: DisplayMetadata;
+    userGreeting: DisplayMetadata;
+    statusMessage: DisplayMetadata;
+    smallText: DisplayMetadata;
+    mediumText: DisplayMetadata;
+    largeText: DisplayMetadata;
+    xlargeText: DisplayMetadata;
+    primaryText: DisplayMetadata;
+    successText: DisplayMetadata;
+    warningText: DisplayMetadata;
+    dangerText: DisplayMetadata;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DisplayExampleComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DisplayExampleComponent, "app-display-example", never, {}, {}, never, never, true, never>;
+}

package/lib/examples/multi-language-demo.component.d.ts

@@ -0,0 +1,34 @@
+import { OnInit } from '@angular/core';
+import { ContentService } from '../services/content.service';
+import { LangService } from '../services/lang-provider/lang-provider.service';
+import * as i0 from "@angular/core";
+/**
+ * MultiLanguageDemoComponent - Demuestra el sistema de idiomas flexible.
+ *
+ * Este componente muestra cómo el sistema maneja múltiples idiomas,
+ * fallbacks automáticos y warnings por traducciones faltantes.
+ */
+export declare class MultiLanguageDemoComponent implements OnInit {
+    content: ContentService;
+    langService: LangService;
+    availableLanguages: string[];
+    analysisResults: {
+        availableLanguages: string[];
+        missingKeys: string[];
+    } | null;
+    okButton$: import("rxjs").Observable<string>;
+    cancelButton$: import("rxjs").Observable<string>;
+    saveButton$: import("rxjs").Observable<string>;
+    deleteButton$: import("rxjs").Observable<string>;
+    nextButton$: import("rxjs").Observable<string>;
+    finishButton$: import("rxjs").Observable<string>;
+    searchPlaceholder$: import("rxjs").Observable<string>;
+    noDataMessage$: import("rxjs").Observable<string>;
+    constructor(content: ContentService, langService: LangService);
+    ngOnInit(): void;
+    switchLanguage(lang: string): void;
+    getLanguageName(lang: string): string;
+    analyzeCurrentComponent(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MultiLanguageDemoComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MultiLanguageDemoComponent, "val-multi-language-demo", never, {}, {}, never, never, true, never>;
+}

package/lib/services/lang-provider/content.d.ts

@@ -5,7 +5,10 @@ export interface Provider {
 /**
  * Global content that can be used across all components.
  * These are common texts like buttons, actions, states, etc.
- * Structure: {es: {key1: 'value1', key2: 'value2'}, en: {key1: 'value1', key2: 'value2'}}
+ * Structure: {es: {key1: 'value1', key2: 'value2'}, en: {key1: 'value1', key2: 'value2'}, fr: {...}}
+ *
+ * Note: You can add any language code. The system will automatically detect available languages
+ * and provide intelligent fallbacks with warnings for missing translations.
  */
 declare const globalContentData: LanguagesContent;
 declare const GlobalContent: TextContent;

package/lib/services/lang-provider/lang-provider.service.d.ts

@@ -8,6 +8,9 @@ import * as i0 from "@angular/core";
  * This service provides reactive content management with Observable-based language switching.
  * Components can subscribe to content changes and automatically update when the language changes.
  *
+ * The service automatically detects available languages from the content configuration
+ * and provides intelligent fallbacks with console warnings for missing translations.
+ *
  * @example Basic usage:
  * ```typescript
  * constructor(private langService: LangService) {}
@@ -27,10 +30,30 @@ import * as i0 from "@angular/core";
  */
 export declare class LangService {
     private content;
-    private default;
+    private defaultLang;
+    private availableLanguages;
     private selectedLang;
     private config;
+    private warnedMissingLanguages;
     constructor(config: ValtechConfig);
+    /**
+     * Detect available languages from the content configuration.
+     * Scans all component content to find which languages are actually configured.
+     */
+    private detectAvailableLanguages;
+    /**
+     * Determine the best default language based on available content.
+     */
+    private determineDefaultLanguage;
+    /**
+     * Validate if a language is available in the content.
+     */
+    private validateLanguage;
+    /**
+     * Get the best available language for a component and key.
+     * Provides intelligent fallback with warnings.
+     */
+    private getBestAvailableContent;
     /**
      * Observable that emits the current language whenever it changes.
      * Use this to subscribe to language changes in components.
@@ -40,10 +63,20 @@ export declare class LangService {
      * Get the current language synchronously.
      */
     get currentLang(): LangOption;
+    /**
+     * Get array of available languages detected from content.
+     */
+    get availableLangs(): LangOption[];
+    /**
+     * Get the default language.
+     */
+    get defaultLanguage(): LangOption;
     /**
      * Set the current language and persist it to localStorage.
      * This will trigger updates in all reactive content subscriptions.
      *
+     * Validates that the language is available and warns if not.
+     *
      * @param lang - The language to set
      */
     setLang(lang: LangOption): void;
@@ -55,6 +88,7 @@ export declare class LangService {
     Text(className: string): LanguageText;
     /**
      * Get a single content string synchronously for the current language.
+     * Provides intelligent fallback with warnings for missing translations.
      *
      * @param className - The component class name
      * @param key - The text key
@@ -65,6 +99,7 @@ export declare class LangService {
     /**
      * Get a reactive Observable for a specific text key that updates when language changes.
      * This is the recommended method for components that need reactive content.
+     * Provides intelligent fallback with warnings for missing translations.
      *
      * @param className - The component class name
      * @param key - The text key
@@ -74,6 +109,7 @@ export declare class LangService {
     getContent(className: string, key: string, fallback?: string): Observable<string>;
     /**
      * Get reactive content for multiple keys at once.
+     * Provides intelligent fallback with warnings for missing translations.
      *
      * @param className - The component class name
      * @param keys - Array of text keys to retrieve
@@ -81,13 +117,39 @@ export declare class LangService {
      */
     getMultipleContent(className: string, keys: string[]): Observable<Record<string, string>>;
     /**
-     * Check if a content key exists for a component.
+     * Check if a content key exists for a component in any available language.
      *
      * @param className - The component class name
      * @param key - The text key
      * @returns True if the key exists in any language
      */
     hasContent(className: string, key: string): boolean;
+    /**
+     * Check if a content key exists for a component in a specific language.
+     *
+     * @param className - The component class name
+     * @param key - The text key
+     * @param lang - The language to check (defaults to current language)
+     * @returns True if the key exists in the specified language
+     */
+    hasContentInLanguage(className: string, key: string, lang?: LangOption): boolean;
+    /**
+     * Get available languages for a specific component.
+     *
+     * @param className - The component class name
+     * @returns Array of language codes available for the component
+     */
+    getAvailableLanguagesForComponent(className: string): LangOption[];
+    /**
+     * Get missing content keys for a component in a specific language.
+     * Useful for identifying incomplete translations.
+     *
+     * @param className - The component class name
+     * @param lang - The language to check
+     * @param referenceLang - The reference language to compare against (defaults to default language)
+     * @returns Array of missing keys
+     */
+    getMissingContentKeys(className: string, lang: LangOption, referenceLang?: LangOption): string[];
     get Lang(): LangOption;
     set Lang(lang: LangOption);
     static ɵfac: i0.ɵɵFactoryDeclaration<LangService, never>;