valtech-components 4.0.203 → 4.0.205

package/lib/components/molecules/reaction-bar/reaction-bar.component.d.ts

@@ -0,0 +1,44 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { ReactionBarMetadata, ReactionBarEvent, EnrichedReaction } from './types';
+import { ReactionSet } from '../../../services/reactions/types';
+import * as i0 from "@angular/core";
+/**
+ * Barra de reacciones emoji configurables por contexto.
+ *
+ * Muestra un set de emojis y permite al usuario reaccionar a una entidad.
+ * Soporta conteos, multiples reacciones y modo picker (popup).
+ *
+ * @example
+ * html
+ * <val-reaction-bar
+ *   [props]="{
+ *     entityRef: { entityType: 'post', entityId: 'p1' },
+ *     reactionSet: mySet,
+ *     showCounts: true
+ *   }"
+ *   (reactionChange)="onReaction($event)"
+ * />
+ */
+export declare class ReactionBarComponent implements OnInit {
+    props: ReactionBarMetadata;
+    reactionChange: EventEmitter<ReactionBarEvent>;
+    private reactionsService;
+    private i18n;
+    protected reactionSet: import("@angular/core").WritableSignal<ReactionSet>;
+    protected myReactions: import("@angular/core").WritableSignal<string[]>;
+    protected counts: import("@angular/core").WritableSignal<Record<string, number>>;
+    protected isLoading: import("@angular/core").WritableSignal<boolean>;
+    protected pickerOpen: import("@angular/core").WritableSignal<boolean>;
+    protected enrichedReactions: import("@angular/core").Signal<EnrichedReaction[]>;
+    constructor();
+    ngOnInit(): void;
+    private loadSetAndCounts;
+    private loadCounts;
+    protected onReact(token: string): void;
+    protected onReactAndClosePicker(token: string): void;
+    protected togglePicker(): void;
+    private handleReact;
+    protected t(key: string): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ReactionBarComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ReactionBarComponent, "val-reaction-bar", never, { "props": { "alias": "props"; "required": false; }; }, { "reactionChange": "reactionChange"; }, never, never, true, never>;
+}

package/lib/components/molecules/reaction-bar/types.d.ts

@@ -0,0 +1,55 @@
+import { ReactionSet } from '../../../services/reactions/types';
+export interface ReactionBarMetadata {
+    /** Referencia a la entidad a reaccionar */
+    entityRef: {
+        entityType: string;
+        entityId: string;
+    };
+    /** ID del set de reacciones a mostrar. Si no se provee, se carga desde el binding. */
+    reactionSetId?: string;
+    /** Set completo (si ya se tiene, evita fetch) */
+    reactionSet?: ReactionSet;
+    /** Max reacciones permitidas por usuario: 1=swap, 0=multiples */
+    maxReactions?: number;
+    /** Tamano visual */
+    size?: 'sm' | 'md' | 'lg';
+    /** Mostrar conteos numericos junto al emoji */
+    showCounts?: boolean;
+    /** Layout: row=barra horizontal, picker=popup selector */
+    layout?: 'row' | 'picker';
+    /** Modo readonly */
+    readonly?: boolean;
+    /** appId para la API */
+    appId?: string;
+    /** Reacciones del usuario ya conocidas (evita fetch inicial) */
+    initialMyReactions?: string[];
+    /** Conteos ya conocidos (evita fetch inicial) */
+    initialCounts?: Record<string, number>;
+    /** Omitir carga inicial desde API */
+    skipInitialLoad?: boolean;
+}
+export interface ReactionBarState {
+    reactionSet: ReactionSet | null;
+    myReactions: string[];
+    counts: Record<string, number>;
+    isLoading: boolean;
+    error: string | null;
+}
+export interface ReactionBarEvent {
+    token: string;
+    active: boolean;
+    entityRef: {
+        entityType: string;
+        entityId: string;
+    };
+    counts: Record<string, number>;
+}
+export interface EnrichedReaction {
+    token: string;
+    emoji: string;
+    label: string;
+    icon: string;
+    order: number;
+    count: number;
+    active: boolean;
+}

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

@@ -0,0 +1,20 @@
+import { EnvironmentProviders, InjectionToken } from '@angular/core';
+import { ValtechReactionsConfig } from './types';
+/**
+ * Token de inyeccion para la configuracion del servicio de Reactions.
+ */
+export declare const VALTECH_REACTIONS_CONFIG: InjectionToken<ValtechReactionsConfig>;
+/**
+ * Provee el servicio de reactions a la aplicacion Angular.
+ *
+ * @param config - Configuracion de reactions
+ * @returns EnvironmentProviders para usar en bootstrapApplication
+ *
+ * @example
+ * bootstrapApplication(AppComponent, {
+ *   providers: [
+ *     provideValtechReactions({ apiUrl: environment.apiUrl, appId: 'my-app' }),
+ *   ],
+ * });
+ */
+export declare function provideValtechReactions(config: ValtechReactionsConfig): EnvironmentProviders;

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

@@ -0,0 +1,3 @@
+export { VALTECH_REACTIONS_CONFIG, provideValtechReactions } from './config';
+export { ReactionsService } from './reactions.service';
+export type { ValtechReactionsConfig, ReactionSetContext, ReactionDefinition, ReactionSet, ReactionCounts, ReactRequest, ReactResponse, GetCountsResponse, GetMyReactionsResponse, } from './types';

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

@@ -0,0 +1,42 @@
+import { Observable } from 'rxjs';
+import { ReactRequest, ReactResponse, GetCountsResponse, ReactionSet } from './types';
+import * as i0 from "@angular/core";
+/**
+ * Servicio para gestionar reacciones emoji configurables por contexto.
+ *
+ * Requiere provideValtechReactions() en el bootstrap de la app.
+ *
+ * @example
+ * const svc = inject(ReactionsService);
+ * svc.react({ entityRef: { entityType: 'post', entityId: '1' }, token: 'heart', appId: 'app' })
+ *   .subscribe(res => console.log(res.counts));
+ */
+export declare class ReactionsService {
+    private http;
+    private config;
+    constructor();
+    private get apiUrl();
+    private get baseUrl();
+    /**
+     * Toggle reaccion — retorna estado nuevo + conteos actualizados.
+     */
+    react(req: ReactRequest): Observable<ReactResponse>;
+    /**
+     * Conteos + reacciones del usuario para una entidad.
+     */
+    getCounts(appId: string, entityType: string, entityId: string): Observable<GetCountsResponse>;
+    /**
+     * Solo mis tokens activos para una entidad.
+     */
+    getMyReactions(appId: string, entityType: string, entityId: string): Observable<string[]>;
+    /**
+     * Obtener un set de reacciones por ID.
+     */
+    getSet(setId: string): Observable<ReactionSet>;
+    /**
+     * Listar todos los sets disponibles para una app.
+     */
+    listSets(appId: string): Observable<ReactionSet[]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ReactionsService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ReactionsService>;
+}

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

@@ -0,0 +1,48 @@
+export type ReactionSetContext = 'formal' | 'social' | 'celebration' | 'opinion' | 'custom';
+export interface ReactionDefinition {
+    token: string;
+    emoji: string;
+    label: string;
+    icon: string;
+    order: number;
+}
+export interface ReactionSet {
+    setId: string;
+    appId: string;
+    name: string;
+    context: ReactionSetContext;
+    reactions: ReactionDefinition[];
+    isPreset: boolean;
+    createdAt: string;
+    updatedAt: string;
+}
+export interface ReactionCounts {
+    counts: Record<string, number>;
+}
+export interface ReactRequest {
+    entityRef: {
+        entityType: string;
+        entityId: string;
+    };
+    token: string;
+    appId: string;
+}
+export interface ReactResponse {
+    operationId: string;
+    token: string;
+    active: boolean;
+    counts: Record<string, number>;
+}
+export interface GetCountsResponse {
+    operationId: string;
+    counts: Record<string, number>;
+    myReactions: string[];
+}
+export interface GetMyReactionsResponse {
+    operationId: string;
+    tokens: string[];
+}
+export interface ValtechReactionsConfig {
+    apiUrl: string;
+    appId?: 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 = "4.0.203";
+export declare const VERSION = "4.0.204";

package/package.json

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

package/public-api.d.ts

@@ -410,6 +410,9 @@ export * from './lib/components/molecules/request-form/request-form.component';
 export * from './lib/components/molecules/request-form/types';
 export * from './lib/components/molecules/content-reaction/content-reaction.component';
 export * from './lib/components/molecules/content-reaction/types';
+export * from './lib/services/reactions/index';
+export * from './lib/components/molecules/reaction-bar/reaction-bar.component';
+export * from './lib/components/molecules/reaction-bar/types';
 export * from './lib/services/splash-screen';
 export * from './lib/services/haptics';
 export * from './lib/components/templates/docs-layout/docs-layout.component';