valtech-components 2.0.795 → 2.0.796

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

@@ -0,0 +1,12 @@
+export interface PageMetadata {
+    title: string;
+    description: string;
+    keywords?: string;
+    ogImage?: string;
+    type?: 'website' | 'article';
+}
+export interface MetaConfig {
+    baseUrl: string;
+    siteName: string;
+    defaultImage?: string;
+}

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

@@ -0,0 +1,100 @@
+import { ModalController } from '@ionic/angular/standalone';
+import { ModalMetadata, SimpleModalMetadata, ModalResult, ModalButton } from './types';
+import * as i0 from "@angular/core";
+/**
+ * ModalService
+ *
+ * A service for creating and managing modals with various configurations.
+ *
+ * @example Basic component modal
+ * ```typescript
+ * const result = await modalService.open({
+ *   component: MyFormComponent,
+ *   componentProps: { userId: 123 },
+ *   header: { title: 'Edit User', showCloseButton: true },
+ *   size: 'medium'
+ * });
+ *
+ * if (result.role === 'confirm') {
+ *   console.log('Saved:', result.data);
+ * }
+ * ```
+ *
+ * @example Simple content modal
+ * ```typescript
+ * await modalService.openSimple({
+ *   title: 'Terms of Service',
+ *   content: '<p>Terms content here...</p>',
+ *   size: 'large',
+ *   showCloseButton: true
+ * });
+ * ```
+ *
+ * @example Sheet modal (mobile)
+ * ```typescript
+ * const result = await modalService.openSheet({
+ *   component: FilterComponent,
+ *   breakpoints: {
+ *     initialBreakpoint: 0.5,
+ *     breakpoints: [0, 0.5, 1],
+ *     showHandle: true
+ *   }
+ * });
+ * ```
+ */
+export declare class ModalService {
+    private modalController;
+    constructor(modalController: ModalController);
+    /**
+     * Opens a modal with a component.
+     * @param options - Modal configuration
+     * @returns Promise resolving to the modal result
+     */
+    open<T = any, R = any>(options: ModalMetadata<T>): Promise<ModalResult<R>>;
+    /**
+     * Opens a simple content modal without a custom component.
+     * Uses Ionic's alert-like styling but with modal capabilities.
+     * @param options - Simple modal configuration
+     * @returns Promise resolving to the modal result
+     */
+    openSimple(options: SimpleModalMetadata): Promise<ModalResult>;
+    /**
+     * Opens a confirmation modal.
+     * @param title - Modal title
+     * @param message - Modal message
+     * @param confirmButton - Confirm button config (optional)
+     * @param cancelButton - Cancel button config (optional)
+     * @returns Promise resolving to true if confirmed
+     */
+    confirm(title: string, message: string, confirmButton?: Partial<ModalButton>, cancelButton?: Partial<ModalButton>): Promise<boolean>;
+    /**
+     * Opens a sheet modal (iOS-style bottom sheet).
+     * @param options - Modal configuration with sheet-specific options
+     * @returns Promise resolving to the modal result
+     */
+    openSheet<T = any, R = any>(options: Omit<ModalMetadata<T>, 'breakpoints'> & {
+        initialBreakpoint?: number;
+        breakpoints?: number[];
+        showHandle?: boolean;
+    }): Promise<ModalResult<R>>;
+    /**
+     * Opens a fullscreen modal.
+     * @param options - Modal configuration
+     * @returns Promise resolving to the modal result
+     */
+    openFullscreen<T = any, R = any>(options: ModalMetadata<T>): Promise<ModalResult<R>>;
+    /**
+     * Dismisses the top-most modal.
+     * @param data - Optional data to return
+     * @param role - Optional role
+     */
+    dismiss(data?: any, role?: string): Promise<boolean>;
+    /**
+     * Gets the top-most modal.
+     */
+    getTop(): Promise<HTMLIonModalElement | undefined>;
+    private normalizeCanDismiss;
+    private buildCssClasses;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ModalService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ModalService>;
+}

package/lib/services/modal/simple-modal-content.component.d.ts

@@ -0,0 +1,19 @@
+import { ModalButton } from './types';
+import * as i0 from "@angular/core";
+/**
+ * Internal component for simple content modals.
+ * Used by ModalService.openSimple()
+ */
+export declare class SimpleModalContentComponent {
+    title: string;
+    content: string;
+    buttons: ModalButton[];
+    showCloseButton: boolean;
+    _modalRef: {
+        dismiss: (data?: any, role?: string) => Promise<boolean>;
+    };
+    onButtonClick(button: ModalButton): Promise<void>;
+    onDismiss(role: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SimpleModalContentComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SimpleModalContentComponent, "val-simple-modal-content", never, { "title": { "alias": "title"; "required": false; }; "content": { "alias": "content"; "required": false; }; "buttons": { "alias": "buttons"; "required": false; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; }; "_modalRef": { "alias": "_modalRef"; "required": false; }; }, {}, never, never, true, never>;
+}

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

@@ -0,0 +1,155 @@
+import { Type } from '@angular/core';
+import { Color } from '@ionic/core';
+/**
+ * Modal size preset.
+ */
+export type ModalSize = 'small' | 'medium' | 'large' | 'full' | 'auto';
+/**
+ * Modal breakpoint configuration for sheet modals.
+ */
+export interface ModalBreakpoint {
+    /** Initial breakpoint (0-1) */
+    initialBreakpoint?: number;
+    /** Available breakpoints */
+    breakpoints?: number[];
+    /** Can dismiss by dragging below threshold */
+    canDismiss?: boolean | (() => boolean | Promise<boolean>);
+    /** Handle element */
+    handleBehavior?: 'cycle' | 'none';
+    /** Show handle */
+    showHandle?: boolean;
+}
+/**
+ * Modal header configuration.
+ */
+export interface ModalHeader {
+    /** Title text */
+    title?: string;
+    /** Subtitle text */
+    subtitle?: string;
+    /** Show close button */
+    showCloseButton?: boolean;
+    /** Close button icon */
+    closeIcon?: string;
+    /** Header color */
+    color?: Color;
+    /** Custom CSS class */
+    cssClass?: string;
+}
+/**
+ * Modal footer configuration.
+ */
+export interface ModalFooter {
+    /** Footer buttons */
+    buttons?: ModalButton[];
+    /** Footer alignment */
+    alignment?: 'start' | 'center' | 'end' | 'space-between';
+    /** Custom CSS class */
+    cssClass?: string;
+}
+/**
+ * Modal button configuration.
+ */
+export interface ModalButton {
+    /** Button text */
+    text: string;
+    /** Button role */
+    role?: 'cancel' | 'confirm' | 'destructive' | string;
+    /** Button color */
+    color?: Color;
+    /** Button fill */
+    fill?: 'clear' | 'outline' | 'solid';
+    /** Button size */
+    size?: 'small' | 'default' | 'large';
+    /** Custom CSS class */
+    cssClass?: string;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Loading state */
+    loading?: boolean;
+    /** Handler function */
+    handler?: (data?: any) => void | boolean | Promise<void | boolean>;
+}
+/**
+ * Metadata for creating a modal with a component.
+ */
+export interface ModalMetadata<T = any> {
+    /** Component to render in modal */
+    component: Type<T>;
+    /** Component inputs/props */
+    componentProps?: Partial<T>;
+    /** Unique identifier */
+    id?: string;
+    /** Modal header configuration */
+    header?: ModalHeader;
+    /** Modal footer configuration */
+    footer?: ModalFooter;
+    /** Modal size */
+    size?: ModalSize;
+    /** Custom width (overrides size) */
+    width?: string;
+    /** Custom height (overrides size) */
+    height?: string;
+    /** Show backdrop */
+    showBackdrop?: boolean;
+    /** Backdrop dismiss */
+    backdropDismiss?: boolean;
+    /** Enable keyboard close (ESC) */
+    keyboardClose?: boolean;
+    /** CSS class for modal */
+    cssClass?: string;
+    /** Animation mode */
+    mode?: 'ios' | 'md';
+    /** Enter animation */
+    enterAnimation?: any;
+    /** Leave animation */
+    leaveAnimation?: any;
+    /** Sheet modal breakpoints */
+    breakpoints?: ModalBreakpoint;
+    /** Presenting element for card modal */
+    presentingElement?: HTMLElement;
+    /** Can dismiss callback */
+    canDismiss?: boolean | (() => boolean | Promise<boolean>);
+    /** Animated */
+    animated?: boolean;
+}
+/**
+ * Metadata for creating a simple content modal.
+ */
+export interface SimpleModalMetadata {
+    /** Modal title */
+    title: string;
+    /** Modal content (HTML or plain text) */
+    content: string;
+    /** Modal size */
+    size?: ModalSize;
+    /** Footer buttons */
+    buttons?: ModalButton[];
+    /** Show close button in header */
+    showCloseButton?: boolean;
+    /** Backdrop dismiss */
+    backdropDismiss?: boolean;
+    /** CSS class */
+    cssClass?: string;
+}
+/**
+ * Result from modal dismissal.
+ */
+export interface ModalResult<T = any> {
+    /** Role of the dismissal (button role or 'backdrop') */
+    role?: string;
+    /** Data returned from modal */
+    data?: T;
+}
+/**
+ * Default modal sizes.
+ */
+export declare const MODAL_SIZES: Record<ModalSize, {
+    width?: string;
+    height?: string;
+}>;
+/**
+ * Default modal buttons.
+ */
+export declare const DEFAULT_MODAL_CONFIRM_BUTTON: ModalButton;
+export declare const DEFAULT_MODAL_CANCEL_BUTTON: ModalButton;

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

@@ -0,0 +1,134 @@
+import { Location } from '@angular/common';
+import { Router } from '@angular/router';
+import { InAppBrowserService } from '../in-app-browser.service';
+import { HeaderConfig, HomeHeaderConfig, CustomHeaderConfig } from './types';
+import * as i0 from "@angular/core";
+/**
+ * NavigationService
+ *
+ * Servicio centralizado para navegacion y configuracion de headers.
+ * Permite a las paginas declarar su tipo de header de forma simple.
+ *
+ * @example
+ * // En una pagina con header de tipo "back"
+ * export class ProfilePage {
+ *   private nav = inject(NavigationService);
+ *
+ *   constructor() {
+ *     this.nav.setBackHeader('pageTitle', 'Settings.Profile');
+ *   }
+ * }
+ *
+ * @example
+ * // En el layout principal (tabs.page.ts)
+ * export class TabsPage {
+ *   private nav = inject(NavigationService);
+ *
+ *   headerConfig = this.nav.headerConfig;
+ *   headerTitle = this.nav.headerTitle;
+ * }
+ */
+export declare class NavigationService {
+    router: Router;
+    location: Location;
+    inAppBrowser: InAppBrowserService;
+    private i18n;
+    private readonly _headerConfig;
+    /**
+     * Configuracion actual del header (readonly signal)
+     */
+    readonly headerConfig: import("@angular/core").Signal<HeaderConfig>;
+    /**
+     * Titulo del header traducido y reactivo al cambio de idioma.
+     * Solo aplica para headers tipo 'back' o 'custom' con titleKey.
+     */
+    readonly headerTitle: import("@angular/core").Signal<string>;
+    /**
+     * Indica si el header actual tiene boton volver
+     */
+    readonly hasBackButton: import("@angular/core").Signal<boolean>;
+    /**
+     * Arbitrary data to be transferred during navigation.
+     * @deprecated Use navigateWithData instead
+     */
+    data: any;
+    constructor(router: Router, location: Location, inAppBrowser: InAppBrowserService);
+    /**
+     * Configura un header tipo "back" con titulo traducido.
+     *
+     * @param key Clave i18n (ej: 'pageTitle')
+     * @param namespace Namespace i18n (ej: 'Settings.Profile')
+     * @param options Opciones adicionales (backText, withMenu)
+     *
+     * @example
+     * // Sin menu
+     * this.nav.setBackHeader('pageTitle', 'Settings.Profile');
+     *
+     * @example
+     * // Con menu hamburguesa
+     * this.nav.setBackHeader('pageTitle', 'Settings.Profile', { withMenu: true });
+     */
+    setBackHeader(key: string, namespace: string, options?: {
+        backText?: string;
+        withMenu?: boolean;
+    }): void;
+    /**
+     * Configura un header tipo "home" con logo y acciones.
+     *
+     * @param options Opciones del header home
+     *
+     * @example
+     * this.nav.setHomeHeader({
+     *   withMenu: true,
+     *   actions: [
+     *     { type: 'ICON', token: 'notifications', position: 'right', description: 'notifications-outline' }
+     *   ]
+     * });
+     */
+    setHomeHeader(options?: Partial<Omit<HomeHeaderConfig, 'type'>>): void;
+    /**
+     * Configura un header personalizado.
+     *
+     * @param options Opciones del header
+     */
+    setCustomHeader(options: Omit<CustomHeaderConfig, 'type'>): void;
+    /**
+     * Oculta el header completamente.
+     */
+    hideHeader(): void;
+    /**
+     * Resetea el header al estado por defecto (home).
+     */
+    resetHeader(): void;
+    /**
+     * Opens a URL using the in-app browser service.
+     * @param url The URL to open
+     */
+    navigateInApp(url: string): void;
+    /**
+     * Navigates to a route and transfers data using Angular Router state.
+     * @param route The route to navigate to
+     * @param dataTransfer The data to transfer
+     */
+    navigateWithData(route: string, dataTransfer: any): void;
+    /**
+     * Navigates to a URL using Angular Router.
+     * @param url The URL to navigate to
+     */
+    navigateByUrl(url: string): void;
+    /**
+     * Opens a URL in a new browser tab.
+     * @param url The URL to open
+     */
+    openInNewTab(url: string): void;
+    /**
+     * Navigates back to the previous page in the browser history.
+     */
+    back(): void;
+    /**
+     * Traduce una clave i18n en formato 'namespace.key'
+     */
+    private translateKey;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NavigationService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<NavigationService>;
+}

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

@@ -0,0 +1,67 @@
+import { ToolbarAction } from '../../components/types';
+/**
+ * Tipos de header soportados por NavigationService
+ */
+export type HeaderType = 'home' | 'back' | 'custom' | 'none';
+/**
+ * Configuracion de header para paginas con boton volver
+ */
+export interface BackHeaderConfig {
+    type: 'back';
+    /** Clave i18n para el titulo (formato: 'namespace.key') */
+    titleKey: string;
+    /** Texto del boton volver (opcional, usa icono por defecto) */
+    backText?: string;
+    /** Mostrar menu hamburguesa (opcional, false por defecto) */
+    withMenu?: boolean;
+}
+/**
+ * Configuracion de header para pagina principal (home)
+ */
+export interface HomeHeaderConfig {
+    type: 'home';
+    /** Mostrar menu hamburguesa */
+    withMenu?: boolean;
+    /** Acciones adicionales en el header */
+    actions?: ToolbarAction[];
+    /** Logo personalizado (CSS variable o URL) */
+    logoSrc?: string;
+}
+/**
+ * Configuracion de header personalizado
+ */
+export interface CustomHeaderConfig {
+    type: 'custom';
+    /** Titulo del header */
+    title?: string;
+    /** Clave i18n para el titulo */
+    titleKey?: string;
+    /** Mostrar boton volver */
+    withBack?: boolean;
+    /** Texto del boton volver */
+    backText?: string;
+    /** Mostrar acciones */
+    withActions?: boolean;
+    /** Mostrar menu */
+    withMenu?: boolean;
+    /** Acciones del header */
+    actions?: ToolbarAction[];
+}
+/**
+ * Sin header
+ */
+export interface NoHeaderConfig {
+    type: 'none';
+}
+/**
+ * Union de todos los tipos de configuracion de header
+ */
+export type HeaderConfig = BackHeaderConfig | HomeHeaderConfig | CustomHeaderConfig | NoHeaderConfig;
+/**
+ * Configuracion por defecto para header tipo 'home'
+ */
+export declare const DEFAULT_HOME_HEADER: HomeHeaderConfig;
+/**
+ * Configuracion por defecto para header tipo 'back'
+ */
+export declare const DEFAULT_BACK_HEADER: BackHeaderConfig;

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

@@ -0,0 +1,2 @@
+export { PaginationStrategy, PaginationState, PaginationLoadParams, PaginationLoadResult, PaginationConfig, PaginationController, createInitialPaginationState, } from './types';
+export { PaginationService } from './pagination.service';

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

@@ -0,0 +1,43 @@
+import { PaginationConfig, PaginationController } from './types';
+import * as i0 from "@angular/core";
+/**
+ * Servicio para crear controladores de paginacion reutilizables.
+ *
+ * @example
+ * // En un componente
+ * pagination = inject(PaginationService);
+ *
+ * usersController = this.pagination.createController<User>({
+ *   strategy: 'offset',
+ *   pageSize: 20,
+ *   loadFn: (params) => this.userService.getUsers(params.page, params.pageSize)
+ * });
+ *
+ * // En el template
+ * @for (user of usersController.items(); track user.id) {
+ *   <app-user-card [user]="user"></app-user-card>
+ * }
+ *
+ * @if (usersController.hasMore()) {
+ *   <ion-button (click)="usersController.loadNext()">Cargar mas</ion-button>
+ * }
+ */
+export declare class PaginationService {
+    /**
+     * Crea un controlador de paginacion para una fuente de datos.
+     *
+     * @param config Configuracion del controlador
+     * @returns Controlador de paginacion
+     */
+    createController<T>(config: PaginationConfig<T>): PaginationController<T>;
+    /**
+     * Crea un controlador simple para arrays estaticos con paginacion local.
+     *
+     * @param items Array completo de items
+     * @param pageSize Tamano de pagina
+     * @returns Controlador de paginacion
+     */
+    createLocalController<T>(items: T[], pageSize?: number): PaginationController<T>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PaginationService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<PaginationService>;
+}

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

@@ -0,0 +1,113 @@
+import { Signal } from '@angular/core';
+import { Observable } from 'rxjs';
+/**
+ * Estrategia de paginacion.
+ */
+export type PaginationStrategy = 'offset' | 'cursor' | 'page';
+/**
+ * Estado de paginacion.
+ */
+export interface PaginationState<T> {
+    /** Items actuales */
+    items: T[];
+    /** Pagina actual (para estrategia offset/page) */
+    page: number;
+    /** Tamano de pagina */
+    pageSize: number;
+    /** Conteo total (si se conoce) */
+    total?: number;
+    /** Cursor para siguiente pagina (para estrategia cursor) */
+    nextCursor?: unknown;
+    /** Cursor para pagina anterior */
+    prevCursor?: unknown;
+    /** Si existen mas items */
+    hasMore: boolean;
+    /** Estado de carga */
+    isLoading: boolean;
+    /** Estado de error */
+    error?: Error;
+}
+/**
+ * Parametros para funcion de carga.
+ */
+export interface PaginationLoadParams {
+    /** Estrategia de paginacion */
+    strategy: PaginationStrategy;
+    /** Numero de pagina */
+    page: number;
+    /** Tamano de pagina */
+    pageSize: number;
+    /** Cursor (para estrategia cursor) */
+    cursor?: unknown;
+    /** Direccion de carga */
+    direction: 'forward' | 'backward';
+}
+/**
+ * Resultado de funcion de carga.
+ */
+export interface PaginationLoadResult<T> {
+    /** Items cargados */
+    items: T[];
+    /** Si hay mas items */
+    hasMore: boolean;
+    /** Total de items (opcional) */
+    total?: number;
+    /** Cursor para siguiente pagina */
+    nextCursor?: unknown;
+    /** Cursor para pagina anterior */
+    prevCursor?: unknown;
+}
+/**
+ * Configuracion para crear un controlador de paginacion.
+ */
+export interface PaginationConfig<T> {
+    /** Estrategia de paginacion */
+    strategy: PaginationStrategy;
+    /** Tamano de pagina */
+    pageSize?: number;
+    /** Items iniciales (opcional) */
+    initialItems?: T[];
+    /** Funcion de carga */
+    loadFn: (params: PaginationLoadParams) => Observable<PaginationLoadResult<T>> | Promise<PaginationLoadResult<T>>;
+    /** Funcion de tracking para items */
+    trackBy?: (item: T) => unknown;
+}
+/**
+ * Interface del controlador de paginacion.
+ */
+export interface PaginationController<T> {
+    /** Estado reactivo como signal */
+    state: Signal<PaginationState<T>>;
+    /** Signal de items (accessor de conveniencia) */
+    items: Signal<T[]>;
+    /** Signal de carga */
+    isLoading: Signal<boolean>;
+    /** Signal de mas items */
+    hasMore: Signal<boolean>;
+    /** Signal de error */
+    error: Signal<Error | null>;
+    /** Signal de pagina actual */
+    currentPage: Signal<number>;
+    /** Signal de total */
+    total: Signal<number | undefined>;
+    /** Cargar siguiente pagina */
+    loadNext(): Promise<void>;
+    /** Cargar pagina anterior (si soportado) */
+    loadPrevious(): Promise<void>;
+    /** Refresh (recargar desde inicio) */
+    refresh(): Promise<void>;
+    /** Reset a estado inicial */
+    reset(): void;
+    /** Actualizar un item */
+    updateItem(predicate: (item: T) => boolean, updates: Partial<T>): void;
+    /** Remover un item */
+    removeItem(predicate: (item: T) => boolean): void;
+    /** Agregar items al inicio */
+    prependItems(items: T[]): void;
+    /** Agregar items al final */
+    appendItems(items: T[]): void;
+}
+/**
+ * Estado inicial para controladores de paginacion.
+ */
+export declare function createInitialPaginationState<T>(pageSize: number, initialItems?: T[]): PaginationState<T>;