matcha-components 19.10.0 → 19.13.0

package/fesm2022/matcha-components.mjs

@@ -1,7 +1,8 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, Component, Input, Output, ContentChildren, ElementRef, Renderer2, Inject, HostListener, Directive, NgModule } from '@angular/core';
 import { animation, style, animate, trigger, transition, useAnimation, state, query, stagger, animateChild, sequence, group } from '@angular/animations';
-import { Subscription } from 'rxjs';
+import { Subscription, Subject } from 'rxjs';
+import { debounceTime } from 'rxjs/operators';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
@@ -500,12 +501,18 @@ class MatchaInfiniteScrollDataComponent {
         this.aggregatedData = new EventEmitter();
         this.aggregatedList = [];
         this.currentPage = 0;
-        this.subscription = new Subscription();
+        // Subscription para as chamadas do loadData
+        this.dataSubscription = new Subscription();
+        // Subscription exclusiva para o debounce do searchTerm
+        this.searchSubscription = new Subscription();
+        // Subject para aplicar debounce no searchTerm
+        this.searchTermSubject = new Subject();
     }
     ngOnInit() {
         this.initialize();
+        // Configura o Intersection Observer para carregamento via scroll
         const options = {
-            root: null, // utiliza a viewport como área de visualização
+            root: null,
             rootMargin: '0px',
             threshold: this.threshold
         };
@@ -517,18 +524,24 @@ class MatchaInfiniteScrollDataComponent {
             });
         }, options);
         this.observer.observe(this.element.nativeElement);
+        // Inscreve para receber alterações do searchTerm com debounce
+        this.searchSubscription = this.searchTermSubject.pipe(debounceTime(300) // ajuste o tempo conforme necessário
+        ).subscribe(() => {
+            // Reseta e carrega a primeira página após o debounce
+            this.resetData();
+            this.loadNextPage();
+        });
     }
     /**
-     * Detecta mudanças no resetKey e, se for o caso, reseta a lista e a página atual.
+     * Detecta mudanças nos inputs e, se for o caso, reseta a lista e a página atual.
      */
     ngOnChanges(changes) {
         if (changes['resetKey'] && !changes['resetKey'].firstChange) {
-            this.reset();
+            this.resetData();
         }
         if (changes['searchTerm'] && !changes['searchTerm'].firstChange) {
-            // Reset e dispara imediatamente a carga para o autocomplete
-            this.reset();
-            this.loadNextPage();
+            // Emite o novo valor para o Subject e aguarda o debounce
+            this.searchTermSubject.next(changes['searchTerm'].currentValue);
         }
     }
     /**
@@ -540,12 +553,12 @@ class MatchaInfiniteScrollDataComponent {
         this.aggregatedData.emit(this.aggregatedList);
     }
     /**
-     * Reseta o estado interno da diretiva.
+     * Reseta apenas as assinaturas e o estado dos dados (não a inscrição do searchTerm).
      */
-    reset() {
-        // Cancela quaisquer assinaturas pendentes
-        this.subscription.unsubscribe();
-        this.subscription = new Subscription();
+    resetData() {
+        // Cancela as assinaturas das chamadas de loadData
+        this.dataSubscription.unsubscribe();
+        this.dataSubscription = new Subscription();
         // Re-inicializa a lista e o contador
         this.initialize();
     }
@@ -564,11 +577,12 @@ class MatchaInfiniteScrollDataComponent {
                 this.aggregatedData.emit(this.aggregatedList);
             }
         });
-        this.subscription.add(sub);
+        this.dataSubscription.add(sub);
     }
     ngOnDestroy() {
         this.observer.disconnect();
-        this.subscription.unsubscribe();
+        this.dataSubscription.unsubscribe();
+        this.searchSubscription.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: MatchaInfiniteScrollDataComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: MatchaInfiniteScrollDataComponent, isStandalone: false, selector: "matcha-infinite-scroll-data", inputs: { loadData: "loadData", initialList: "initialList", threshold: "threshold", resetKey: "resetKey", searchTerm: "searchTerm" }, outputs: { aggregatedData: "aggregatedData" }, usesOnChanges: true, ngImport: i0, template: "", styles: ["", ":host{height:1px;opacity:0}\n"] }); }