valtech-components 2.0.292 → 2.0.294

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/selector-examples.component.d.ts

@@ -0,0 +1,20 @@
+import { LanguageSelectorMetadata } from '../components/molecules/language-selector/types';
+import { PopoverSelectorMetadata } from '../components/molecules/popover-selector/types';
+import * as i0 from "@angular/core";
+/**
+ * Ejemplo de uso de los componentes popover-selector y language-selector
+ */
+export declare class SelectorExamplesComponent {
+    categorySelector: PopoverSelectorMetadata;
+    prioritySelector: PopoverSelectorMetadata;
+    multipleSelector: PopoverSelectorMetadata;
+    basicLanguageSelector: LanguageSelectorMetadata;
+    flagLanguageSelector: LanguageSelectorMetadata;
+    customLanguageSelector: LanguageSelectorMetadata;
+    onCategoryChange(category: string | string[]): void;
+    onPriorityChange(priority: string | string[]): void;
+    onMultipleChange(notifications: string | string[]): void;
+    onLanguageChange(language: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SelectorExamplesComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SelectorExamplesComponent, "app-selector-examples", never, {}, {}, never, never, true, never>;
+}

package/lib/services/lang-provider/components/display-demo.d.ts

@@ -0,0 +1,3 @@
+import { TextContent } from '../types';
+declare const _default: TextContent;
+export default _default;

package/lib/shared/utils/reactive-content.d.ts

@@ -0,0 +1,109 @@
+/**
+ * Enhanced content utilities for multi-language component support.
+ * Extends the base content utilities to provide specialized helpers for different component patterns.
+ */
+import { Observable } from 'rxjs';
+import { ContentService } from '../../services/content.service';
+/**
+ * Base configuration for reactive content.
+ */
+export interface ReactiveContentConfig {
+    /** Content class name - defaults to '_global' if not provided */
+    className?: string;
+    /** Content key */
+    key: string;
+    /** Fallback text if content is not found */
+    fallback?: string;
+    /** Interpolation data for parameterized content */
+    interpolation?: Record<string, any>;
+}
+/**
+ * Configuration for components that support both static and reactive content.
+ */
+export interface HybridContentConfig {
+    /** Static content - takes precedence over reactive content */
+    content?: string;
+    /** Reactive content configuration */
+    contentConfig?: ReactiveContentConfig;
+}
+/**
+ * Configuration for components with multiple text properties.
+ */
+export interface MultiTextConfig {
+    /** Map of property names to their content configurations */
+    textConfigs: Record<string, ReactiveContentConfig>;
+}
+/**
+ * Enhanced metadata for components that support reactive content.
+ */
+export interface ReactiveTextMetadata extends HybridContentConfig {
+    size?: 'small' | 'medium' | 'large' | 'xlarge';
+    color?: string;
+    bold?: boolean;
+    processLinks?: boolean;
+    linkConfig?: any;
+}
+/**
+ * Helper class for managing reactive content in components.
+ */
+export declare class ComponentContentHelper {
+    private contentService;
+    private defaultClassName?;
+    constructor(contentService: ContentService, defaultClassName?: string);
+    /**
+     * Resolves content based on hybrid configuration (static vs reactive).
+     */
+    resolveContent(config: HybridContentConfig): Observable<string> | string;
+    /**
+     * Resolves multiple text properties for components with multiple text fields.
+     */
+    resolveMultipleTexts(config: MultiTextConfig): Record<string, Observable<string>>;
+    /**
+     * Creates a reactive content configuration for array items.
+     * Useful for list components where items might have translatable text.
+     */
+    createArrayItemConfig(baseKey: string, index: number, fallback?: string): ReactiveContentConfig;
+    /**
+     * Helper for button/action text that commonly needs translation.
+     */
+    createActionConfig(actionKey: 'ok' | 'cancel' | 'save' | 'delete' | 'edit' | 'close' | 'back' | 'next' | 'previous' | 'finish' | 'continue' | 'add' | 'remove' | 'search' | 'filter' | 'sort' | 'refresh', fallback?: string): ReactiveContentConfig;
+}
+/**
+ * Factory function to create content helpers for components.
+ */
+export declare function createComponentContentHelper(contentService: ContentService, componentClassName?: string): ComponentContentHelper;
+/**
+ * Utility function to determine if content should be reactive.
+ */
+export declare function shouldUseReactiveContent(config: HybridContentConfig): boolean;
+/**
+ * Enhanced props factory for components that support reactive content.
+ */
+export declare function createReactiveProps<T extends Record<string, any>>(contentHelper: ComponentContentHelper, staticProps: Omit<T, keyof HybridContentConfig>, contentConfig: HybridContentConfig): T;
+/**
+ * Configuration for list components that mix static and dynamic content.
+ */
+export interface ListComponentConfig<T> {
+    /** Static items that don't need translation */
+    staticItems?: T[];
+    /** Reactive items configuration */
+    reactiveItems?: {
+        /** Base key for the items (e.g., 'navigationLinks') */
+        baseKey: string;
+        /** Number of items expected */
+        count: number;
+        /** Template for creating individual items */
+        itemTemplate: (contentHelper: ComponentContentHelper, index: number) => T;
+    };
+}
+/**
+ * Helper for list components that need to mix static and reactive content.
+ */
+export declare class ListContentHelper<T> {
+    private contentHelper;
+    constructor(contentHelper: ComponentContentHelper);
+    /**
+     * Resolves a list configuration into final items.
+     */
+    resolveListItems(config: ListComponentConfig<T>): T[];
+}

package/package.json

@@ -1,12 +1,14 @@
 {
   "name": "valtech-components",
-  "version": "2.0.292",
+  "version": "2.0.294",
   "peerDependencies": {
     "@angular/common": "^18.0.0",
     "@angular/core": "^18.0.0",
     "@ionic/angular": "^8.0.0",
     "ionicons": "^7.2.1",
-    "rxjs": "~7.8.0"
+    "rxjs": "~7.8.0",
+    "prismjs": "^1.30.0",
+    "swiper": "^11.2.8"
   },
   "dependencies": {
     "@capacitor/browser": "^6.0.3",

package/public-api.d.ts

@@ -37,6 +37,8 @@ export * from './lib/components/molecules/expandable-text/types';
 export * from './lib/components/molecules/file-input/file-input.component';
 export * from './lib/components/molecules/hint/hint.component';
 export * from './lib/components/molecules/hour-input/hour-input.component';
+export * from './lib/components/molecules/language-selector/language-selector.component';
+export * from './lib/components/molecules/language-selector/types';
 export * from './lib/components/molecules/layered-card/layered-card.component';
 export * from './lib/components/molecules/layered-card/types';
 export * from './lib/components/molecules/link/link.component';
@@ -48,6 +50,8 @@ export * from './lib/components/molecules/notes-box/types';
 export * from './lib/components/molecules/number-input/number-input.component';
 export * from './lib/components/molecules/password-input/password-input.component';
 export * from './lib/components/molecules/pin-input/pin-input.component';
+export * from './lib/components/molecules/popover-selector/popover-selector.component';
+export * from './lib/components/molecules/popover-selector/types';
 export * from './lib/components/molecules/progress-status/progress-status.component';
 export * from './lib/components/molecules/progress-status/types';
 export * from './lib/components/molecules/prompter/prompter.component';
@@ -81,8 +85,11 @@ export * from './lib/components/templates/simple/simple.component';
 export * from './lib/components/templates/simple/types';
 export * from './lib/examples/comprehensive-link-test.component';
 export * from './lib/examples/custom-content-demo.component';
+export * from './lib/examples/display-demo.component';
+export * from './lib/examples/display-simple-example.component';
 export * from './lib/examples/link-processing-example.component';
 export * from './lib/examples/multi-language-demo.component';
+export * from './lib/examples/selector-examples.component';
 export * from './lib/services/content.service';
 export * from './lib/services/download.service';
 export * from './lib/services/icons.service';
@@ -101,5 +108,6 @@ export * from './lib/shared/pipes/process-links.pipe';
 export * from './lib/shared/utils/content';
 export * from './lib/shared/utils/dom';
 export * from './lib/shared/utils/form-defaults';
+export * from './lib/shared/utils/reactive-content';
 export * from './lib/shared/utils/styles';
 export * from './lib/shared/utils/text';