valtech-components 2.0.948 → 2.0.950

package/lib/components/molecules/features-list/features-list.component.d.ts

@@ -1,46 +1,39 @@
-import { FeatureItem, FeaturesListMetadata } from './types';
+import { FeatureItem, FeaturesListFooterLink, FeaturesListMetadata } from './types';
 import * as i0 from "@angular/core";
 /**
  * val-features-list
  *
- * A component to display a list of features with icons, titles, and descriptions.
- * Supports i18n for all text content.
+ * Lista de features con icono **o imagen**, título y descripción. Soporta i18n,
+ * colapso opcional ("ver más" cuando supera `maxVisible`) y un link al pie
+ * (ej. "Find out more"). Útil para listas de settings, apps, beneficios.
  *
  * @example
  * ```html
  * <val-features-list
  *   [props]="{
  *     features: [
- *       { icon: 'flash-outline', titleKey: 'feature1Title', descriptionKey: 'feature1Desc' },
- *       { icon: 'color-palette-outline', titleKey: 'feature2Title', descriptionKey: 'feature2Desc' }
+ *       { icon: 'flash-outline', titleKey: 'Rápido', descriptionKey: 'Carga al instante' },
+ *       { image: '/logos/app.png', titleKey: 'Mi App', descriptionKey: 'Gestión de equipos', token: 'app' }
  *     ],
- *     i18nNamespace: 'Features',
- *     iconColor: 'primary',
- *     mode: 'vertical'
- *   }"
- * />
- * ```
- *
- * @example With custom SVG icons
- * ```html
- * <val-features-list
- *   [props]="{
- *     features: [
- *       {
- *         icon: 'custom',
- *         svgPath: 'M13 2L3 14h9l-1 8 10-12h-9l1-8z',
- *         titleKey: 'Fast & Secure',
- *         descriptionKey: 'Modern authentication with OAuth and MFA'
- *       }
- *     ]
+ *     maxVisible: 3,
+ *     footerLink: { label: 'Ver todo', routerLink: '/apps' }
  *   }"
+ *   (itemClick)="open($event)"
  * />
  * ```
  */
 export declare class FeaturesListComponent {
     private i18n;
+    private navigation;
     /** Component configuration */
     readonly props: import("@angular/core").InputSignal<FeaturesListMetadata>;
+    /** Emitido al tocar un item (con su `token`). */
+    readonly itemClick: import("@angular/core").OutputEmitterRef<string>;
+    /** Emitido al tocar el footer link (con su `token`). */
+    readonly footerClick: import("@angular/core").OutputEmitterRef<string>;
+    private readonly _expanded;
+    readonly expanded: import("@angular/core").Signal<boolean>;
+    constructor();
     /** Merged configuration with defaults */
     config: import("@angular/core").Signal<{
         features: FeatureItem[];
@@ -50,17 +43,27 @@ export declare class FeaturesListComponent {
         mode: "horizontal" | "vertical";
         gap: "small" | "medium" | "large";
         alignment: "center" | "start";
+        imageShape: "circle" | "square";
+        maxVisible: number;
+        showMoreLabel?: string;
+        showLessLabel?: string;
+        footerLink?: FeaturesListFooterLink;
     }>;
+    /** Items visibles según el estado de colapso. */
+    visibleFeatures: import("@angular/core").Signal<FeatureItem[]>;
+    /** Si hay items de sobra para colapsar/expandir. */
+    canCollapse: import("@angular/core").Signal<boolean>;
+    showMoreText: import("@angular/core").Signal<string>;
+    showLessText: import("@angular/core").Signal<string>;
     /** Resolved icon color (handles Ionic colors and CSS colors) */
     iconColorStyle: import("@angular/core").Signal<string>;
-    /**
-     * Get translated title or return direct text
-     */
+    toggle(): void;
+    onItem(feature: FeatureItem): void;
+    onFooter(event: MouseEvent, link: FeaturesListFooterLink): void;
+    /** Get translated title or return direct text */
     getTitle(feature: FeatureItem): string;
-    /**
-     * Get translated description or return direct text
-     */
+    /** Get translated description or return direct text */
     getDescription(feature: FeatureItem): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<FeaturesListComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FeaturesListComponent, "val-features-list", never, { "props": { "alias": "props"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FeaturesListComponent, "val-features-list", never, { "props": { "alias": "props"; "required": true; "isSignal": true; }; }, { "itemClick": "itemClick"; "footerClick": "footerClick"; }, never, never, true, never>;
 }

package/lib/components/molecules/features-list/types.d.ts

@@ -2,14 +2,31 @@
  * Feature item configuration
  */
 export interface FeatureItem {
-    /** Ionicon name or 'custom' for SVG path */
-    icon: string;
+    /** Ionicon name or 'custom' for SVG path. Opcional si se usa `image`. */
+    icon?: string;
     /** SVG path data (only used when icon is 'custom') */
     svgPath?: string;
+    /** Image URL — si se provee, reemplaza al icono (ej. logos de apps). */
+    image?: string;
     /** Title i18n key or direct text */
     titleKey: string;
     /** Description i18n key or direct text */
     descriptionKey: string;
+    /** Optional token — emitido por (itemClick) al tocar el item. */
+    token?: string;
+}
+/**
+ * Footer link / CTA mostrado al pie de la lista (ej. "Find out more").
+ */
+export interface FeaturesListFooterLink {
+    /** Texto del link (ya resuelto por el consumer). */
+    label: string;
+    /** Ruta Angular interna. */
+    routerLink?: string | any[];
+    /** URL externa (abre en nueva pestaña). */
+    href?: string;
+    /** Token emitido por (footerClick). */
+    token?: string;
 }
 /**
  * Features list component configuration
@@ -29,8 +46,22 @@ export interface FeaturesListMetadata {
     gap?: 'small' | 'medium' | 'large';
     /** Alignment of features */
     alignment?: 'start' | 'center';
+    /** Forma de la imagen del item (cuando `feature.image`). Default 'square'. */
+    imageShape?: 'square' | 'circle';
+    /**
+     * Máximo de items visibles antes de colapsar. Si `features.length` supera
+     * este número, se muestran los primeros `maxVisible` + un botón "ver más".
+     * `0` (default) = sin colapso, muestra todos.
+     */
+    maxVisible?: number;
+    /** Label del botón expandir. Default: i18n `FeaturesList.showMore`. */
+    showMoreLabel?: string;
+    /** Label del botón contraer. Default: i18n `FeaturesList.showLess`. */
+    showLessLabel?: string;
+    /** Link/CTA al pie de la lista (ej. "Find out more"). */
+    footerLink?: FeaturesListFooterLink;
 }
 /**
  * Default values for FeaturesListMetadata
  */
-export declare const FEATURES_LIST_DEFAULTS: Required<Omit<FeaturesListMetadata, 'features' | 'i18nNamespace'>>;
+export declare const FEATURES_LIST_DEFAULTS: Required<Pick<FeaturesListMetadata, 'iconColor' | 'iconSize' | 'mode' | 'gap' | 'alignment' | 'imageShape' | 'maxVisible'>>;

package/lib/components/organisms/search-header/search-header.component.d.ts

@@ -0,0 +1,54 @@
+import { EventEmitter } from '@angular/core';
+import { SearchHeaderMetadata } from './types';
+import * as i0 from "@angular/core";
+/**
+ * `val-search-header` — header/toolbar con búsqueda desplegable.
+ *
+ * El botón de búsqueda es una ICON action del toolbar (igual que
+ * menu/avatar/notificaciones), identificada por su `token` (`searchToken`).
+ * Al presionarla se despliega un `val-searchbar` debajo del toolbar: 100% del
+ * ancho en mobile, un máximo centrado en desktop.
+ *
+ * Reusa `val-toolbar` para el header — las demás acciones se emiten por
+ * `(onAction)`. La query se emite por `(search)`.
+ *
+ * @example
+ * ```html
+ * <val-search-header
+ *   [props]="{
+ *     header: { toolbar: { title: 'AWS', withActions: true, withBack: false,
+ *       actions: [
+ *         { type: 'ICON', description: 'search-outline', token: 'search', position: 'right' },
+ *         { type: 'ICON', description: 'notifications-outline', token: 'notif', position: 'right' }
+ *       ] } },
+ *     searchbar: { placeholder: 'Buscar...' }
+ *   }"
+ *   (search)="onSearch($event)"
+ *   (onAction)="onAction($event)"
+ * >
+ *   <ion-button slot="search-actions" fill="outline">Filter: All</ion-button>
+ * </val-search-header>
+ * ```
+ */
+export declare class SearchHeaderComponent {
+    private host;
+    /** Configuración del search header. */
+    props: SearchHeaderMetadata;
+    /** Emite el token de cualquier acción del toolbar que NO sea la de búsqueda. */
+    onAction: EventEmitter<string>;
+    /** Emite la query del searchbar. */
+    search: EventEmitter<string>;
+    /** Emite al abrir/cerrar la barra de búsqueda. */
+    searchToggle: EventEmitter<boolean>;
+    /** Emite cuando el searchbar pierde el foco. */
+    blur: EventEmitter<void>;
+    private readonly _open;
+    readonly open: import("@angular/core").Signal<boolean>;
+    config: import("@angular/core").Signal<SearchHeaderMetadata & Required<Pick<SearchHeaderMetadata, "maxWidth" | "searchToken" | "startOpen" | "showClose">>>;
+    constructor();
+    handleToolbar(token?: string): void;
+    toggle(): void;
+    private focusSearchbar;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SearchHeaderComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SearchHeaderComponent, "val-search-header", never, { "props": { "alias": "props"; "required": false; }; }, { "onAction": "onAction"; "search": "search"; "searchToggle": "searchToggle"; "blur": "blur"; }, never, ["[search-actions]"], true, never>;
+}

package/lib/components/organisms/search-header/types.d.ts

@@ -0,0 +1,31 @@
+import { HeaderMetadata } from '../header/types';
+import { SearchbarMetadata } from '../../molecules/searchbar/types';
+/**
+ * Metadata for val-search-header.
+ *
+ * Header/toolbar con un botón de búsqueda que, al presionarse, despliega un
+ * `val-searchbar` colapsable debajo del toolbar (100% del ancho en mobile, un
+ * máximo centrado en desktop). El botón de búsqueda es una ICON action más del
+ * toolbar (idéntica a menu/avatar/notificaciones): se identifica por su `token`.
+ */
+export interface SearchHeaderMetadata {
+    /** Configuración del header + toolbar (reusa val-header/val-toolbar). */
+    header: HeaderMetadata;
+    /**
+     * Token de la ICON action que dispara la búsqueda. La action correspondiente
+     * debe existir en `header.toolbar.actions`. Default: 'search'.
+     */
+    searchToken?: string;
+    /** Configuración del searchbar desplegado. */
+    searchbar?: SearchbarMetadata;
+    /** Ancho máximo de la barra en desktop (CSS). Default: '720px'. */
+    maxWidth?: string;
+    /** Si arranca con la barra abierta. Default: false. */
+    startOpen?: boolean;
+    /** Mostrar botón de cierre (X) a la derecha de la barra. Default: true. */
+    showClose?: boolean;
+}
+/**
+ * Default values for SearchHeaderMetadata.
+ */
+export declare const SEARCH_HEADER_DEFAULTS: Required<Pick<SearchHeaderMetadata, 'searchToken' | 'maxWidth' | 'startOpen' | 'showClose'>>;

package/lib/config/site-links.config.d.ts

@@ -49,7 +49,7 @@ export declare const VALTECH_SITE_PATHS: {
     readonly support: "/contact";
     readonly contact: "/contact";
     readonly faq: "/faq";
-    readonly about: "/legal/about";
+    readonly about: "/about";
     readonly terms: "/legal/terms";
     readonly privacy: "/legal/privacy";
     readonly cookies: "/legal/cookies";

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

@@ -81,6 +81,8 @@ export interface OrgRole {
     id: string;
     name: string;
     description?: string;
+    permissions?: string[];
+    isSystem?: boolean;
 }
 export interface ListOrgRolesResponse {
     operationId: string;

package/lib/version.d.ts

@@ -2,4 +2,4 @@
  * Current version of valtech-components.
  * This is automatically updated during the publish process.
  */
-export declare const VERSION = "2.0.948";
+export declare const VERSION = "2.0.950";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "valtech-components",
-  "version": "2.0.948",
+  "version": "2.0.950",
   "private": false,
   "bin": {
     "valtech-firebase-config": "./src/lib/services/firebase/scripts/generate-sw-config.js"

package/public-api.d.ts

@@ -217,6 +217,8 @@ export * from './lib/components/organisms/form/form-footer/form-footer.component
 export * from './lib/components/organisms/form/form.component';
 export * from './lib/components/organisms/header/header.component';
 export * from './lib/components/organisms/header/types';
+export * from './lib/components/organisms/search-header/search-header.component';
+export * from './lib/components/organisms/search-header/types';
 export * from './lib/components/organisms/mfa-modal/mfa-modal.component';
 export * from './lib/components/organisms/item-list/item-list.component';
 export * from './lib/components/organisms/item-list/types';