@js-smart/ng-kit 21.4.0 → 21.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@js-smart/ng-kit",
-  "version": "21.4.0",
+  "version": "21.5.0",
   "license": "MIT",
   "author": "Pavan Kumar Jadda",
   "private": false,
@@ -45,4 +45,4 @@
       "default": "./fesm2022/js-smart-ng-kit.mjs"
     }
   }
-}
+}

package/types/js-smart-ng-kit.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, ChangeDetectorRef, OnDestroy, OnChanges, AfterContentChecked, ElementRef, SimpleChanges, ViewContainerRef, ComponentRef, WritableSignal } from '@angular/core';
+import { OnInit, ChangeDetectorRef, OnDestroy, OnChanges, ElementRef, SimpleChanges, ViewContainerRef, ComponentRef, WritableSignal } from '@angular/core';
 import { BehaviorSubject, Observable, Subject } from 'rxjs';
 import { ThemePalette, MatOptionSelectionChange } from '@angular/material/core';
 import { ControlValueAccessor, FormControl } from '@angular/forms';
@@ -257,22 +257,23 @@ declare class SpinnerComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SpinnerComponent, "spinner,lib-spinner", never, { "bootstrapSpinner": { "alias": "bootstrapSpinner"; "required": false; "isSignal": true; }; "diameter": { "alias": "diameter"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+type AutocompleteOption = Record<string, any>;
 /**
  * Reusable Auto Complete component that extends MatAutoComplete to show Clear icon and Arrow buttons
  *
  * @author Pavan Kumar Jadda
  * @since 12.0.0
  */
-declare class AutocompleteComponent implements OnInit, OnChanges, AfterContentChecked, ControlValueAccessor {
+declare class AutocompleteComponent implements OnInit, OnChanges, ControlValueAccessor {
     /**
      * Gets reference inputAutoComplete HTML attribute
      */
     inputAutoComplete: ElementRef;
-    cdRef: ChangeDetectorRef;
+    private destroyRef;
     /**
      * Internal form control for the autocomplete
      */
-    control: FormControl<string | null>;
+    control: FormControl<string | AutocompleteOption | null>;
     /**
      * Label of the AutoComplete
      */
@@ -284,7 +285,7 @@ declare class AutocompleteComponent implements OnInit, OnChanges, AfterContentCh
     /**
      * Appearance of the AutoComplete, defaults to `fill`
      */
-    appearance: _angular_core.InputSignal<string>;
+    appearance: _angular_core.InputSignal<"fill" | "outline">;
     /**
      * List of CSS classes that need to applied to autocomplete
      */
@@ -300,7 +301,7 @@ declare class AutocompleteComponent implements OnInit, OnChanges, AfterContentCh
     /**
      * Function that maps an option's control value to its display value in the trigger.
      */
-    displayWith: ((value: any) => string) | null;
+    displayWith: _angular_core.InputSignal<((value: string | AutocompleteOption) => string) | null>;
     /**
      * Specifies if the autocomplete is required. Default is not required.
      */
@@ -309,37 +310,87 @@ declare class AutocompleteComponent implements OnInit, OnChanges, AfterContentCh
      * Specifies if the autocomplete is disabled. Default is not required.
      */
     disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * Text displayed when no options match the input. Defaults to 'No options'
+     */
+    noOptionsText: _angular_core.InputSignal<string>;
+    /**
+     * Whether the autocomplete is in a loading state. Shows a loading message instead of options
+     */
+    loading: _angular_core.InputSignal<boolean>;
+    /**
+     * Text displayed when the autocomplete is in a loading state. Defaults to 'Loading...'
+     */
+    loadingText: _angular_core.InputSignal<string>;
     /**
      * List of Objects that need to be bind and searched for
      */
-    data: _angular_core.InputSignal<any[] | string[] | undefined>;
+    data: _angular_core.InputSignal<(string | AutocompleteOption)[] | undefined>;
     /**
      * Emit selected value on selection changes
      */
-    onSelectionChange: _angular_core.OutputEmitterRef<any>;
+    onSelectionChange: _angular_core.OutputEmitterRef<string | AutocompleteOption>;
     /**
-     * BehaviorSubject that shows the current active arrow icon
+     * Signal that tracks the current arrow icon state
      */
-    arrowIconSubject: BehaviorSubject<string>;
+    arrowIcon: _angular_core.WritableSignal<string>;
     /**
      * Filtered options when user types
      */
-    filteredOptions: Observable<any[] | undefined> | undefined;
-    writeValue(value: any): void;
-    registerOnChange(fn: any): void;
-    registerOnTouched(fn: any): void;
+    filteredOptions: Observable<(string | AutocompleteOption)[] | undefined> | undefined;
+    /**
+     * Writes a new value to the control
+     */
+    writeValue(value: string | AutocompleteOption): void;
+    /**
+     * Registers a callback function that is called when the control's value changes
+     */
+    registerOnChange(fn: (value: string | AutocompleteOption | null) => void): void;
+    /**
+     * Registers a callback function that is called when the control is touched
+     */
+    registerOnTouched(fn: () => void): void;
+    /**
+     * Sets the disabled state of the control
+     */
     setDisabledState(isDisabled: boolean): void;
-    ngAfterContentChecked(): void;
+    /**
+     * Initializes the filtered options observable pipeline
+     */
     ngOnInit(): void;
+    /**
+     * Binds the displayFn to the component context on input changes
+     */
     ngOnChanges(_changes: SimpleChanges): void;
-    clearInput(evt: any): void;
-    openOrClosePanel(evt: any, trigger: MatAutocompleteTrigger): void;
-    displayFn(object: any): string;
+    /**
+     * Clears the input value, resets the control, and re-focuses the input
+     */
+    clearInput(evt: Event): void;
+    /**
+     * Toggles the autocomplete panel open or closed
+     */
+    openOrClosePanel(evt: Event, trigger: MatAutocompleteTrigger): void;
+    /**
+     * Returns the display value for the given option. Uses custom displayWith function if provided,
+     * otherwise falls back to the bindLabel property or the string value itself.
+     */
+    displayFn(object: string | AutocompleteOption): string;
+    /**
+     * Emits the selected value and notifies the parent form of the selection change
+     */
     emitSelectedValue($event: MatOptionSelectionChange): void;
+    /**
+     * Updates the arrow icon to point up when the panel opens
+     */
+    onPanelOpened(): void;
+    /**
+     * Updates the arrow icon to point down when the panel closes
+     */
+    onPanelClosed(): void;
     private onChange;
     private onTouched;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AutocompleteComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AutocompleteComponent, "autocomplete, lib-autocomplete", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeHolder": { "alias": "placeHolder"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "classes": { "alias": "classes"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindValue": { "alias": "bindValue"; "required": false; "isSignal": true; }; "displayWith": { "alias": "displayWith"; "required": false; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; }, { "onSelectionChange": "onSelectionChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AutocompleteComponent, "autocomplete, lib-autocomplete", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeHolder": { "alias": "placeHolder"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "classes": { "alias": "classes"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindValue": { "alias": "bindValue"; "required": false; "isSignal": true; }; "displayWith": { "alias": "displayWith"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "noOptionsText": { "alias": "noOptionsText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; }, { "onSelectionChange": "onSelectionChange"; }, never, never, true, never>;
 }
 
 declare class PrintOptions {
@@ -1080,4 +1131,4 @@ declare const markSuccess: (progressState: WritableSignal<ProgressState>, messag
 declare const markError: (progressState: WritableSignal<ProgressState>, message?: string) => void;
 
 export { AlertComponent, AutocompleteComponent, BaseButtonDirective, BsLinkButtonComponent, BsLinkButtonDirective, CloseButtonDirective, ConfirmDialogComponent, DeleteButtonComponent, DeleteButtonDirective, EditBsButtonComponent, EditBsButtonDirective, EditButtonComponent, EditButtonDirective, EditSolidSvgComponent, EditSvgIconButtonComponent, EditSvgIconButtonDirective, EntityStore, ExcelExportButtonComponent, ExcelExportButtonDirective, ManageButtonComponent, ManageButtonDirective, MatSnackBarService, NgxPrintDirective, NgxSpinnerComponent, NgxSpinnerService, PdfExportButtonComponent, PdfExportButtonDirective, PreventMultipleClicksDirective, PrimaryButtonComponent, PrimaryButtonDirective, SavePrimaryButtonComponent, SavePrimaryButtonDirective, SearchButtonComponent, SpinnerComponent, Store, SuccessButtonComponent, SuccessButtonDirective, ViewButtonComponent, ViewButtonDirective, ViewPrimaryButtonComponent, ViewPrimaryButtonDirective, initializeState, markError, markLoading, markSuccess };
-export type { AlertType, ConfirmDialogData, MatSnackBarOptions, ProgressState };
+export type { AlertType, AutocompleteOption, ConfirmDialogData, MatSnackBarOptions, ProgressState };