@decaf-ts/for-angular 0.0.47 → 0.0.49

package/index.d.ts

@@ -5,7 +5,7 @@ import { TextFieldTypes, SelectInterface, AutocompleteTypes, CheckboxCustomEvent
 import * as i2 from '@angular/forms';
 import { FormGroup, FormControl, FormArray, ControlValueAccessor, AbstractControl } from '@angular/forms';
 import { OrderDirection, Repository, Adapter, EventIds, Paginator, Condition } from '@decaf-ts/core';
-import { FieldProperties, IPagedComponentProperties, CrudOperationKeys, UIFunctionLike, HTML5InputTypes, DecafComponent, UIModelMetadata, FieldDefinition, UIMediaBreakPointsType, RenderingEngine } from '@decaf-ts/ui-decorators';
+import { FieldProperties, IPagedComponentProperties, CrudOperationKeys, UIFunctionLike, HTML5InputTypes, DecafComponent, UIModelMetadata, FieldDefinition, UIMediaBreakPointsType, UIElementMetadata, RenderingEngine, DecafEventHandler } from '@decaf-ts/ui-decorators';
 import * as _decaf_ts_decorator_validation from '@decaf-ts/decorator-validation';
 import { Model, VALIDATION_PARENT_KEY, ModelConstructor } from '@decaf-ts/decorator-validation';
 import { RepositoryFlags, Context, CrudOperations, OperationKeys, IRepository } from '@decaf-ts/db-decorators';
@@ -19,8 +19,8 @@ import { TranslateService, TranslateLoader, TranslationObject, TranslateParser,
 import { HttpClient } from '@angular/common/http';
 import { Observable, Subscription } from 'rxjs';
 import { SafeHtml, DomSanitizer, Title } from '@angular/platform-browser';
-import { LoggedClass, Logger } from '@decaf-ts/logging';
 import { InjectablesRegistry } from '@decaf-ts/injectable-decorators';
+import { Logger } from '@decaf-ts/logging';
 
 /**
  * @module lib/engine/interfaces
@@ -778,8 +778,8 @@ interface RawQuery<M extends Model> {
     limit?: number;
     skip?: number;
 }
-type DecafRepositoryAdapter<F extends RepositoryFlags = RepositoryFlags, C extends Context<F> = Context<F>> = Adapter<any, any, RawQuery<any>, F, C>;
-type DecafRepository<M extends Model> = Repository<M, RawQuery<M>, DecafRepositoryAdapter<RepositoryFlags, Context<RepositoryFlags>>, RepositoryFlags, Context<RepositoryFlags>>;
+type DecafRepositoryAdapter<F extends RepositoryFlags = RepositoryFlags, C extends Context<F> = Context<F>> = Adapter<any, any, RawQuery<any>, C>;
+type DecafRepository<M extends Model> = Repository<M, DecafRepositoryAdapter<RepositoryFlags, Context>>;
 /**
  * @description Generic key-value pair type
  * @summary Represents a generic object with string keys and any type of values.
@@ -1310,6 +1310,7 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
      * @memberOf module:lib/engine/NgxComponentDirective
      */
     modelId?: EventIds;
+    value: unknown;
     /**
      * @description Primary key field name for the data model.
      * @summary Specifies which field in the model should be used as the primary key.
@@ -1347,9 +1348,9 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
      * The operation affects form validation, field availability, and the specific repository
      * method called during data submission.
      *
-     * @type {OperationKeys.CREATE | OperationKeys.READ | OperationKeys.UPDATE | OperationKeys.DELETE}
+     * @type {OperationKeys}
      * @default OperationKeys.READ
-     *  @memberOf ModelPage
+     * @memberOf module:lib/engine/NgxComponentDirective
      */
     operation: OperationKeys | undefined;
     /**
@@ -1437,6 +1438,16 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
      * @memberOf module:lib/engine/NgxComponentDirective
      */
     listenEvent: EventEmitter<IBaseCustomEvent>;
+    /**
+     * @description Event emitter for custom component events.
+     * @summary Emits custom events that occur within child components or the component itself.
+     * This allows parent components to listen for and respond to user interactions or
+     * state changes. Events are passed up the component hierarchy to enable coordinated
+     * behavior across the application.
+     * @type {EventEmitter<IBaseCustomEvent>}
+     * @memberOf module:lib/engine/NgxComponentDirective
+     */
+    refreshEvent: EventEmitter<IBaseCustomEvent | boolean>;
     /**
      * @description Angular Router instance for programmatic navigation.
      * @summary Injected Router service used for programmatic navigation between routes
@@ -1446,7 +1457,7 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
      * @type {Router}
      * @memberOf module:lib/engine/NgxComponentDirective
      */
-    protected router: Router;
+    router: Router;
     /**
      * @description Current locale identifier for component internationalization.
      * @summary Specifies the locale code (e.g., 'en-US', 'pt-BR') used for translating UI text
@@ -1528,6 +1539,24 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
     isModalChild: boolean;
     protected handlers: Record<string, UIFunctionLike>;
     protected events: Record<string, UIFunctionLike>;
+    /**
+     * @description Indicates whether a refresh operation is in progress.
+     * @summary When true, the component is currently fetching new data. This is used
+     * to control loading indicators and prevent duplicate refresh operations from
+     * being triggered simultaneously.
+     *
+     * @type {boolean}
+     * @default false
+     */
+    refreshing: boolean;
+    /**
+     * @description Represents the color scheme used for application.
+     * @summary  This property determines the visual appearance of the application
+     * based on predefined color schemes (e.g., light or dark mode).
+     * @type {WindowColorScheme}
+     * @default WindowColorSchemes.light
+     */
+    protected colorSchema: WindowColorScheme;
     /**
      * @description Constructor for NgxComponentDirective.
      * @summary Initializes the directive by setting up the component name, locale root,
@@ -1548,6 +1577,7 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
      * @returns {void}
      */
     ngOnDestroy(): Promise<void> | void;
+    refresh(...args: unknown[]): Promise<void>;
     /**
      * @description Getter for the current locale context identifier.
      * @summary Returns the current locale identifier by calling the getLocale method.
@@ -1566,7 +1596,8 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
      * @throws {InternalError} If repository initialization fails
      * @memberOf module:lib/engine/NgxComponentDirective
      */
-    protected get repository(): DecafRepository<Model> | undefined;
+    get repository(): DecafRepository<Model> | undefined;
+    set repository(repository: DecafRepository<Model> | undefined);
     /**
      * @description Angular lifecycle hook for handling input property changes.
      * @summary Responds to changes in component input properties, specifically monitoring changes
@@ -1722,7 +1753,7 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
      *   end
      * @memberOf module:lib/engine/NgxComponentDirective
      */
-    handleEvent(event: IBaseCustomEvent | ICrudFormEvent | CustomEvent): Promise<void>;
+    handleEvent(event: IBaseCustomEvent | ICrudFormEvent | CustomEvent, repository?: DecafRepository<Model>): Promise<void>;
     /**
      * @description Determines if a specific operation is allowed in the current context.
      * @summary This method checks if an operation is included in the list of available
@@ -1775,7 +1806,7 @@ declare abstract class NgxComponentDirective extends DecafComponent implements O
      */
     changeOperation(operation: string, id?: string): Promise<boolean>;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgxComponentDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgxComponentDirective, never, never, { "enableDarkMode": { "alias": "enableDarkMode"; "required": false; }; "isDarkMode": { "alias": "isDarkMode"; "required": false; }; "name": { "alias": "name"; "required": false; }; "childOf": { "alias": "childOf"; "required": false; }; "uid": { "alias": "uid"; "required": false; }; "model": { "alias": "model"; "required": false; }; "modelId": { "alias": "modelId"; "required": false; }; "pk": { "alias": "pk"; "required": false; }; "mapper": { "alias": "mapper"; "required": false; }; "operations": { "alias": "operations"; "required": false; }; "operation": { "alias": "operation"; "required": false; }; "row": { "alias": "row"; "required": false; }; "col": { "alias": "col"; "required": false; }; "className": { "alias": "className"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "item": { "alias": "item"; "required": false; }; "props": { "alias": "props"; "required": false; }; "route": { "alias": "route"; "required": false; }; "borders": { "alias": "borders"; "required": false; }; "isModalChild": { "alias": "isModalChild"; "required": false; }; "handlers": { "alias": "handlers"; "required": false; }; "events": { "alias": "events"; "required": false; }; }, { "listenEvent": "listenEvent"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgxComponentDirective, never, never, { "enableDarkMode": { "alias": "enableDarkMode"; "required": false; }; "isDarkMode": { "alias": "isDarkMode"; "required": false; }; "name": { "alias": "name"; "required": false; }; "childOf": { "alias": "childOf"; "required": false; }; "uid": { "alias": "uid"; "required": false; }; "model": { "alias": "model"; "required": false; }; "modelId": { "alias": "modelId"; "required": false; }; "value": { "alias": "value"; "required": false; }; "pk": { "alias": "pk"; "required": false; }; "mapper": { "alias": "mapper"; "required": false; }; "operations": { "alias": "operations"; "required": false; }; "operation": { "alias": "operation"; "required": false; }; "row": { "alias": "row"; "required": false; }; "col": { "alias": "col"; "required": false; }; "className": { "alias": "className"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "item": { "alias": "item"; "required": false; }; "props": { "alias": "props"; "required": false; }; "route": { "alias": "route"; "required": false; }; "borders": { "alias": "borders"; "required": false; }; "isModalChild": { "alias": "isModalChild"; "required": false; }; "handlers": { "alias": "handlers"; "required": false; }; "events": { "alias": "events"; "required": false; }; }, { "listenEvent": "listenEvent"; "refreshEvent": "refreshEvent"; }, never, never, true, never>;
 }
 
 declare class NgxRenderableComponentDirective extends NgxComponentDirective implements OnChanges, OnDestroy, IRenderedModel {
@@ -3066,7 +3097,7 @@ declare class NgxParentComponentDirective extends NgxComponentDirective implemen
     protected timerSubscription: Subscription;
     ngOnInit(model?: Model | string): Promise<void>;
     ngOnDestroy(): Promise<void> | void;
-    protected getActivePage(page: number): UIModelMetadata | UIModelMetadata[] | FieldDefinition | undefined;
+    protected getActivePage(page: number, firstClick?: boolean): UIModelMetadata | UIModelMetadata[] | FieldDefinition | undefined;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgxParentComponentDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<NgxParentComponentDirective, never, never, { "page": { "alias": "page"; "required": false; }; "pages": { "alias": "pages"; "required": false; }; "parentForm": { "alias": "parentForm"; "required": false; }; "children": { "alias": "children"; "required": false; }; "cols": { "alias": "cols"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "cardBody": { "alias": "cardBody"; "required": false; }; "cardType": { "alias": "cardType"; "required": false; }; "breakpoint": { "alias": "breakpoint"; "required": false; }; "match": { "alias": "match"; "required": false; }; }, {}, never, never, true, never>;
 }
@@ -3243,7 +3274,7 @@ declare abstract class NgxFormDirective extends NgxParentComponentDirective impl
      * @returns {void}
      */
     handleReset(): void;
-    handleSubmit(event?: SubmitEvent, eventName?: string, componentName?: string): Promise<boolean | void>;
+    submit(event?: SubmitEvent, eventName?: string, componentName?: string): Promise<boolean | void>;
     /**
     * @description Updates the active form group and children for the specified page.
     * @summary Extracts the FormGroup for the given page from the FormArray and filters
@@ -3914,7 +3945,7 @@ declare class FieldsetComponent extends NgxFormDirective implements OnInit, Afte
      * @default []
      * @memberOf FieldsetComponent
      */
-    items: IFieldSetItem[];
+    items: IFieldSetItem[] | UIElementMetadata[][];
     /**
      * @description Currently selected item for update operations.
      * @summary Holds the item being edited when in update mode. Used to track
@@ -4081,6 +4112,7 @@ declare class FieldsetComponent extends NgxFormDirective implements OnInit, Afte
      * @memberOf FieldsetComponent
      */
     ngAfterViewInit(): Promise<void>;
+    refresh(): Promise<void>;
     /**
      * @description Handles removal of the fieldset with slide animation.
      * @summary Initiates the removal process for the fieldset with a smooth slide-up animation.
@@ -4605,7 +4637,7 @@ declare class FilterComponent extends NgxComponentDirective implements OnInit, O
      *
      * @memberOf FilterComponent
      */
-    addFilter(value: string, event?: CustomEvent): void;
+    addFilter(value: string, event?: CustomEvent): Promise<void>;
     /**
      * @description Selects an option from the dropdown suggestions.
      * @summary Handles option selection when a user clicks on a suggestion in the dropdown.
@@ -4676,10 +4708,10 @@ declare class FilterComponent extends NgxComponentDirective implements OnInit, O
      * @summary Emits the current filter array to parent components when filters are ready
      * to be applied. Only emits if there are active filters. Clears options after submission.
      *
-     * @returns {void}
+     * @returns {Promise<void>}
      * @memberOf FilterComponent
      */
-    submit(): void;
+    submit(): Promise<void>;
     /**
      * @description Toggles the sort direction between ascending and descending.
      * @summary Handles sort direction changes by toggling between ASC and DSC values.
@@ -5052,7 +5084,7 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      * @default "full"
      * @memberOf ListComponent
      */
-    lines: "inset" | "full" | "none";
+    lines: 'inset' | 'full' | 'none';
     /**
      * @description Controls whether the list has inset styling.
      * @summary When set to true, the list will have inset styling with rounded corners
@@ -5083,7 +5115,7 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      * @default "bottom"
      * @memberOf ListComponent
      */
-    scrollPosition: "bottom" | "top";
+    scrollPosition: 'bottom' | 'top';
     /**
      * @description Custom text to display during loading operations.
      * @summary Specifies the text shown in the loading indicator when the component
@@ -5198,17 +5230,6 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      * @memberOf ListComponent
      */
     pages: number;
-    /**
-     * @description Indicates whether a refresh operation is in progress.
-     * @summary When true, the component is currently fetching new data. This is used
-     * to control loading indicators and prevent duplicate refresh operations from
-     * being triggered simultaneously.
-     *
-     * @type {boolean}
-     * @default false
-     * @memberOf ListComponent
-     */
-    refreshing: boolean;
     /**
      * @description Array used for rendering skeleton loading placeholders.
      * @summary Contains placeholder items that are displayed during data loading.
@@ -5263,15 +5284,6 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      * @memberOf ListComponent
      */
     lastPage: number;
-    /**
-     * @description Event emitter for refresh operations.
-     * @summary Emits an event when the list data is refreshed, either through pull-to-refresh
-     * or programmatic refresh. The event includes the refreshed data and component information.
-     *
-     * @type {EventEmitter<IBaseCustomEvent>}
-     * @memberOf ListComponent
-     */
-    refreshEvent: EventEmitter<IBaseCustomEvent>;
     /**
      * @description Event emitter for item click interactions.
      * @summary Emits an event when a list item is clicked. The event includes the data
@@ -5581,16 +5593,16 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      */
     refresh(event?: InfiniteScrollCustomEvent | RefresherCustomEvent | boolean): Promise<void>;
     /**
-   * @description Handles pagination events from the pagination component.
-   * @summary Processes pagination events by updating the current page number and
-   * refreshing the list data to display the selected page. This method is called
-   * when a user interacts with the pagination controls to navigate between pages.
-   *
-   * @param {IPaginationCustomEvent} event - The pagination event containing page information
-   * @returns {void}
-   *
-   * @memberOf ListComponent
-   */
+     * @description Handles pagination events from the pagination component.
+     * @summary Processes pagination events by updating the current page number and
+     * refreshing the list data to display the selected page. This method is called
+     * when a user interacts with the pagination controls to navigate between pages.
+     *
+     * @param {IPaginationCustomEvent} event - The pagination event containing page information
+     * @returns {void}
+     *
+     * @memberOf ListComponent
+     */
     handlePaginate(event: IPaginationCustomEvent): void;
     /**
      * @description Handles pull-to-refresh events from the refresher component.
@@ -5679,7 +5691,7 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      *
      * @memberOf ListComponent
      */
-    protected parseResult(result: KeyValue[] | Paginator<Model>): Promise<KeyValue[]>;
+    protected parseResult(result: KeyValue[] | Paginator<any>): Promise<KeyValue[]>;
     /**
      * @description Updates pagination state based on data length.
      * @summary Calculates whether more data is available and how many pages exist
@@ -5721,7 +5733,7 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
     mapResults(data: KeyValue[]): KeyValue[];
     parseSearchValue(): string | IFilterQuery;
     static ɵfac: i0.ɵɵFactoryDeclaration<ListComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ListComponent, "ngx-decaf-list", never, { "type": { "alias": "type"; "required": false; }; "showSearchbar": { "alias": "showSearchbar"; "required": false; }; "data": { "alias": "data"; "required": false; }; "source": { "alias": "source"; "required": false; }; "start": { "alias": "start"; "required": false; }; "limit": { "alias": "limit"; "required": false; }; "loadMoreData": { "alias": "loadMoreData"; "required": false; }; "lines": { "alias": "lines"; "required": false; }; "inset": { "alias": "inset"; "required": false; }; "scrollThreshold": { "alias": "scrollThreshold"; "required": false; }; "scrollPosition": { "alias": "scrollPosition"; "required": false; }; "loadingText": { "alias": "loadingText"; "required": false; }; "showRefresher": { "alias": "showRefresher"; "required": false; }; "createButton": { "alias": "createButton"; "required": false; }; "loadingSpinner": { "alias": "loadingSpinner"; "required": false; }; "enableFilter": { "alias": "enableFilter"; "required": false; }; "sortDirection": { "alias": "sortDirection"; "required": false; }; "sortBy": { "alias": "sortBy"; "required": false; }; "disableSort": { "alias": "disableSort"; "required": false; }; "empty": { "alias": "empty"; "required": false; }; }, { "refreshEvent": "refreshEvent"; "clickEvent": "clickEvent"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ListComponent, "ngx-decaf-list", never, { "type": { "alias": "type"; "required": false; }; "showSearchbar": { "alias": "showSearchbar"; "required": false; }; "data": { "alias": "data"; "required": false; }; "source": { "alias": "source"; "required": false; }; "start": { "alias": "start"; "required": false; }; "limit": { "alias": "limit"; "required": false; }; "loadMoreData": { "alias": "loadMoreData"; "required": false; }; "lines": { "alias": "lines"; "required": false; }; "inset": { "alias": "inset"; "required": false; }; "scrollThreshold": { "alias": "scrollThreshold"; "required": false; }; "scrollPosition": { "alias": "scrollPosition"; "required": false; }; "loadingText": { "alias": "loadingText"; "required": false; }; "showRefresher": { "alias": "showRefresher"; "required": false; }; "createButton": { "alias": "createButton"; "required": false; }; "loadingSpinner": { "alias": "loadingSpinner"; "required": false; }; "enableFilter": { "alias": "enableFilter"; "required": false; }; "sortDirection": { "alias": "sortDirection"; "required": false; }; "sortBy": { "alias": "sortBy"; "required": false; }; "disableSort": { "alias": "disableSort"; "required": false; }; "empty": { "alias": "empty"; "required": false; }; }, { "clickEvent": "clickEvent"; }, never, ["*"], true, never>;
 }
 
 /**
@@ -6159,7 +6171,7 @@ declare class ModelRendererComponent<M extends Model> extends NgxRenderableCompo
      * @description Refreshes the rendered model
      * @param {string | M} model - The model to be rendered
      */
-    private refresh;
+    refresh(model: string | M): Promise<void>;
     /**
      * @description Lifecycle hook that is called when data-bound properties of a directive change
      * @param {SimpleChanges} changes - Object containing changes
@@ -7126,6 +7138,13 @@ declare class ModalComponent extends NgxParentComponentDirective implements OnIn
      * @default false
      */
     lightBox: boolean;
+    /**
+     * @description Controls the visibility of the modal header.
+     * @summary When set to true, the modal header is displayed; when false, it is hidden.
+     * @type {boolean}
+     * @default true
+     */
+    showHeader: boolean;
     /**
      * @description Event emitted when the modal is about to be dismissed.
      * @summary Emits an OverlayEventDetail object containing details about the dismiss event.
@@ -7201,7 +7220,7 @@ declare class ModalComponent extends NgxParentComponentDirective implements OnIn
      */
     confirm(event: IBaseCustomEvent): Promise<void>;
     static ɵfac: i0.ɵɵFactoryDeclaration<ModalComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ModalComponent, "ngx-decaf-modal", never, { "title": { "alias": "title"; "required": false; }; "isOpen": { "alias": "isOpen"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "options": { "alias": "options"; "required": false; }; "globals": { "alias": "globals"; "required": false; }; "inlineContent": { "alias": "inlineContent"; "required": false; }; "inlineContentPosition": { "alias": "inlineContentPosition"; "required": false; }; "fullscreen": { "alias": "fullscreen"; "required": false; }; "lightBox": { "alias": "lightBox"; "required": false; }; }, { "willDismissEvent": "willDismissEvent"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ModalComponent, "ngx-decaf-modal", never, { "title": { "alias": "title"; "required": false; }; "isOpen": { "alias": "isOpen"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "options": { "alias": "options"; "required": false; }; "globals": { "alias": "globals"; "required": false; }; "inlineContent": { "alias": "inlineContent"; "required": false; }; "inlineContentPosition": { "alias": "inlineContentPosition"; "required": false; }; "fullscreen": { "alias": "fullscreen"; "required": false; }; "lightBox": { "alias": "lightBox"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; }, { "willDismissEvent": "willDismissEvent"; }, never, never, true, never>;
 }
 /**
  * @description Retrieves a modal component instance.
@@ -7223,6 +7242,16 @@ declare function getNgxModalComponent(props?: Partial<ModalComponent>, modalProp
  * @returns {Promise<void>} - A promise that resolves when the modal is presented.
  */
 declare function presentNgxLightBoxModal(inlineContent: string | SafeHtml, props?: Partial<ModalComponent>, injector?: EnvironmentInjector): Promise<void>;
+/**
+ * @description Presents a lightbox modal with inline content.
+ * @summary Displays a modal in lightbox mode with the specified content and properties.
+ *
+ * @param {string | SafeHtml} inlineContent - The content to display in the lightbox modal.
+ * @param {Partial<ModalComponent>} [props={}] - Properties to initialize the modal component.
+ * @param {EnvironmentInjector} [injector] - Optional environment injector for dependency injection.
+ * @returns {Promise<void>} - A promise that resolves when the modal is presented.
+ */
+declare function presentNgxInlineModal(inlineContent: string | SafeHtml, props?: Partial<ModalComponent>, injector?: EnvironmentInjector): Promise<void>;
 /**
  * @description Retrieves a modal for selecting options.
  * @summary Creates and initializes a modal component for displaying a list of selectable options.
@@ -7391,6 +7420,7 @@ declare class FileUploadComponent extends NgxFormFieldDirective implements OnIni
      * @default false
      */
     enableDirectoryMode: boolean;
+    previewHandler?: unknown;
     /**
      * @description Maximum file size allowed for upload.
      * @summary Specifies the maximum size (in MB) for files that can be uploaded.
@@ -7413,7 +7443,7 @@ declare class FileUploadComponent extends NgxFormFieldDirective implements OnIni
      *
      * @type {string | undefined}
      */
-    preview: string | undefined;
+    previewFile: string | undefined;
     /**
      * @description List of files selected for upload.
      * @summary Contains the files selected by the user for upload. This array is updated
@@ -7421,7 +7451,7 @@ declare class FileUploadComponent extends NgxFormFieldDirective implements OnIni
      *
      * @type {File[]}
      */
-    files: File[];
+    files: File[] | KeyValue[];
     /**
      * @description List of errors encountered during file validation.
      * @summary Stores validation errors for files that do not meet the specified criteria,
@@ -7457,6 +7487,7 @@ declare class FileUploadComponent extends NgxFormFieldDirective implements OnIni
      * @returns {void}
      */
     ngOnInit(): void;
+    initialize(): Promise<void>;
     /**
      * @description Lifecycle hook that is called when a directive, pipe, or service is destroyed.
      * @summary Cleans up the component by calling the parent ngOnDestroy method and clearing the file upload state.
@@ -7543,7 +7574,7 @@ declare class FileUploadComponent extends NgxFormFieldDirective implements OnIni
      * @param {File | string} [file] - The file to be previewed. If not provided, the current preview file is used.
      * @returns {Promise<void>}
      */
-    showFilePreview(file: File | string, fileExtension?: string): Promise<void>;
+    preview(file: File | string, fileExtension?: string): Promise<void | UIFunctionLike>;
     /**
      * @description Checks if a file is an image based on its MIME type.
      * @summary Determines if the file can be accepted as an image by checking
@@ -7553,6 +7584,7 @@ declare class FileUploadComponent extends NgxFormFieldDirective implements OnIni
      * @returns {boolean} - True if the file is an image, false otherwise.
      */
     isImageFile(file: File): boolean;
+    getFileMime(base64: string): string;
     /**
      * @description Removes a file from the selection.
      * @summary Updates the file list to exclude the file at the specified index.
@@ -7615,7 +7647,7 @@ declare class FileUploadComponent extends NgxFormFieldDirective implements OnIni
      */
     private readFile;
     static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FileUploadComponent, "ngx-decaf-file-upload", never, { "formGroup": { "alias": "formGroup"; "required": false; }; "name": { "alias": "name"; "required": false; }; "formControl": { "alias": "formControl"; "required": false; }; "required": { "alias": "required"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "type": { "alias": "type"; "required": false; }; "label": { "alias": "label"; "required": false; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; }; "size": { "alias": "size"; "required": false; }; "position": { "alias": "position"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "showIcon": { "alias": "showIcon"; "required": false; }; "enableDirectoryMode": { "alias": "enableDirectoryMode"; "required": false; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; }; }, { "changeEvent": "changeEvent"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FileUploadComponent, "ngx-decaf-file-upload", never, { "formGroup": { "alias": "formGroup"; "required": false; }; "name": { "alias": "name"; "required": false; }; "formControl": { "alias": "formControl"; "required": false; }; "required": { "alias": "required"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "type": { "alias": "type"; "required": false; }; "label": { "alias": "label"; "required": false; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; }; "size": { "alias": "size"; "required": false; }; "position": { "alias": "position"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "showIcon": { "alias": "showIcon"; "required": false; }; "enableDirectoryMode": { "alias": "enableDirectoryMode"; "required": false; }; "previewHandler": { "alias": "previewHandler"; "required": false; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; }; }, { "changeEvent": "changeEvent"; }, never, never, true, never>;
 }
 
 declare class ForAngularComponentsModule {
@@ -8529,17 +8561,10 @@ declare class NgxFormService {
     static reset(formGroup: FormGroup | FormControl): void;
 }
 
-/**
- * @module module:lib/engine/NgxEventHandler
- * @description Event handler base class used by Decaf components.
- * @summary Defines NgxEventHandler which standardizes event handling logic and provides
- * logging support for handlers that process custom events emitted by components.
- *
- * @link {@link NgxEventHandler}
- */
-
-declare abstract class NgxEventHandler<PAYLOAD> extends LoggedClass {
-    abstract handle(evt: IBaseCustomEvent | CustomEvent<PAYLOAD>): Promise<unknown>;
+declare abstract class NgxEventHandler extends DecafEventHandler {
+    constructor();
+    refresh(args?: unknown[]): Promise<void>;
+    preview(args?: unknown[]): Promise<void>;
 }
 
 /**
@@ -8732,15 +8757,15 @@ declare abstract class NgxModelPageDirective extends NgxPageDirective {
      */
     allowedOperations: OperationKeys[];
     /**
-   * @description Current model data loaded from the repository.
-   * @summary Stores the raw data object representing the current model instance retrieved
-   * from the repository. This property holds the actual data values for the model being
-   * displayed or edited, and is set to undefined when no data is available or when an
-   * error occurs during data loading.
-   * @type {KeyValue | undefined}
-   * @default undefined
-   * @memberOf NgxModelPageDirective
-   */
+     * @description Current model data loaded from the repository.
+     * @summary Stores the raw data object representing the current model instance retrieved
+     * from the repository. This property holds the actual data values for the model being
+     * displayed or edited, and is set to undefined when no data is available or when an
+     * error occurs during data loading.
+     * @type {KeyValue | undefined}
+     * @default undefined
+     * @memberOf NgxModelPageDirective
+     */
     modelData: KeyValue | undefined;
     /**
      * @description Error message from failed operations.
@@ -8764,7 +8789,7 @@ declare abstract class NgxModelPageDirective extends NgxPageDirective {
      *
      * @throws {InternalError} When the model is not found in the registry
      */
-    protected get repository(): DecafRepository<Model> | undefined;
+    get repository(): DecafRepository<Model> | undefined;
     /**
      * @description Angular lifecycle hook for component initialization.
      * @summary Initializes the component by setting up the logger instance using the getLogger
@@ -8786,12 +8811,12 @@ declare abstract class NgxModelPageDirective extends NgxPageDirective {
      * @description Generic event handler for component events.
      * @summary Processes incoming events from child components and routes them to appropriate
      * handlers based on the event name. Currently handles SUBMIT events by delegating to
-     * the handleSubmit method. This centralized event handling approach allows for easy
+     * the submit method. This centralized event handling approach allows for easy
      * extension and consistent event processing.
      *
      * @param {IBaseCustomEvent} event - The event object containing event data and metadata
      */
-    handleEvent(event: IBaseCustomEvent): Promise<void>;
+    handleEvent(event: IBaseCustomEvent, repository?: DecafRepository<Model>): Promise<void>;
     /**
      * @description Handles form submission events for CRUD operations.
      * @summary Processes form submission by executing the appropriate repository operation
@@ -8803,7 +8828,7 @@ declare abstract class NgxModelPageDirective extends NgxPageDirective {
      * @param {IBaseCustomEvent} event - The submit event containing form data
      * @return {Promise<IModelPageCustomEvent|void>} Promise that resolves on success or throws on error
      */
-    handleSubmit(event: IBaseCustomEvent, redirect?: boolean): Promise<IModelPageCustomEvent | void>;
+    submit(event: IBaseCustomEvent, repository?: DecafRepository<Model>, redirect?: boolean): Promise<IModelPageCustomEvent | void>;
     /**
      * @description Retrieves a model instance from the repository by unique identifier.
      * @summary Fetches a specific model instance using the repository's read method.
@@ -8814,7 +8839,7 @@ declare abstract class NgxModelPageDirective extends NgxPageDirective {
      * @param {string} uid - The unique identifier of the model instance to retrieve
      * @return {Promise<Model | undefined>} Promise resolving to the model instance or undefined
      */
-    handleGet(uid?: EventIds, repository?: IRepository<Model>, modelName?: string): Promise<Model | undefined>;
+    handleGet(uid?: EventIds, repository?: IRepository<any>, modelName?: string): Promise<Model | undefined>;
     /**
      * @description Parses and transforms form data for repository operations.
      * @summary Converts raw form data into the appropriate format for repository operations.
@@ -9201,7 +9226,7 @@ declare class DecafFakerRepository<T extends Model> {
     constructor(model: string | Model, limit?: number);
     protected get repository(): DecafRepository<Model>;
     initialize(): Promise<void>;
-    generateData<T extends Model>(pkValues?: KeyValue, pk?: string, pkType?: string): Promise<T[]>;
+    generateData<T extends Model>(values?: KeyValue, key?: string, keyType?: string): Promise<T[]>;
 }
 declare function getFakerData<T extends Model>(limit: number | undefined, data: Record<string, FunctionLike>, model?: string): T[];
 
@@ -9409,6 +9434,7 @@ declare function provideDynamicComponents(...components: Constructor<unknown>[])
 declare function getModelAndRepository(model: Model | string): {
     repository: DecafRepository<Model>;
     model: Model;
+    pk: string;
 } | undefined;
 /**
  * @description Provides a database adapter for dependency injection.
@@ -9434,7 +9460,7 @@ declare function getModelAndRepository(model: Model | string): {
  */
 declare function provideDbAdapter<DbAdapter extends {
     flavour: string;
-}>(adapterClass: Constructor<DbAdapter>, options?: KeyValue, flavour?: string): Provider;
+}>(clazz: Constructor<DbAdapter>, options?: KeyValue, flavour?: string): Provider;
 /**
  * @description Retrieves a logger instance for the given context.
  * @summary Creates or retrieves a namespaced logger instance using the Decaf logging system.
@@ -9496,5 +9522,5 @@ declare class ForAngularCommonModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<ForAngularCommonModule>;
 }
 
-export { ActionRoles, AngularEngineKeys, BaseComponentProps, CPTKN, CardComponent, ComponentEventNames, ComponentRendererComponent, ComponentsTagNames, CrudFieldComponent, CrudFormComponent, CssClasses, DB_ADAPTER_PROVIDER, DB_ADAPTER_PROVIDER_TOKEN, DecafFakerRepository, DefaultFormReactiveOptions, DefaultListEmptyOptions, DefaultModalOptions, Dynamic, DynamicModule, ElementPositions, ElementSizes, EmptyStateComponent, FieldsetComponent, FileUploadComponent, FilterComponent, ForAngularCommonModule, ForAngularComponentsModule, FormConstants, I18N_CONFIG_TOKEN, I18nLoader, I18nLoaderFactory, I18nParser, IconComponent, LOCALE_ROOT_TOKEN, LayoutComponent, LayoutGridGaps, ListComponent, ListComponentsTypes, ListItemComponent, ListItemPositions, LoggerLevels, ModalComponent, ModelRendererComponent, NgxComponentDirective, NgxEventHandler, NgxFormDirective, NgxFormFieldDirective, NgxFormService, NgxMediaService, NgxModelPageDirective, NgxPageDirective, NgxParentComponentDirective, NgxRenderingEngine, NgxSvgDirective, PaginationComponent, RouteDirections, SearchbarComponent, SteppedFormComponent, WindowColorSchemes, cleanSpaces, dataMapper, filterString, formatDate, generateRandomValue, getFakerData, getInjectablesRegistry, getLocaleContext, getLocaleContextByKey, getLocaleFromClassName, getLocaleLanguage, getLogger, getModelAndRepository, getNgxModalComponent, getNgxSelectOptionsModal, getOnWindow, getOnWindowDocument, getWindow, getWindowDocument, getWindowWidth, isDarkMode, isDevelopmentMode, isNotUndefined, isValidDate, itemMapper, parseToValidDate, presentNgxLightBoxModal, provideDbAdapter, provideDynamicComponents, provideI18n, provideI18nLoader, removeFocusTrap, setOnWindow, stringToBoolean, windowEventEmitter };
+export { ActionRoles, AngularEngineKeys, BaseComponentProps, CPTKN, CardComponent, ComponentEventNames, ComponentRendererComponent, ComponentsTagNames, CrudFieldComponent, CrudFormComponent, CssClasses, DB_ADAPTER_PROVIDER, DB_ADAPTER_PROVIDER_TOKEN, DecafFakerRepository, DefaultFormReactiveOptions, DefaultListEmptyOptions, DefaultModalOptions, Dynamic, DynamicModule, ElementPositions, ElementSizes, EmptyStateComponent, FieldsetComponent, FileUploadComponent, FilterComponent, ForAngularCommonModule, ForAngularComponentsModule, FormConstants, I18N_CONFIG_TOKEN, I18nLoader, I18nLoaderFactory, I18nParser, IconComponent, LOCALE_ROOT_TOKEN, LayoutComponent, LayoutGridGaps, ListComponent, ListComponentsTypes, ListItemComponent, ListItemPositions, LoggerLevels, ModalComponent, ModelRendererComponent, NgxComponentDirective, NgxEventHandler, NgxFormDirective, NgxFormFieldDirective, NgxFormService, NgxMediaService, NgxModelPageDirective, NgxPageDirective, NgxParentComponentDirective, NgxRenderingEngine, NgxSvgDirective, PaginationComponent, RouteDirections, SearchbarComponent, SteppedFormComponent, WindowColorSchemes, cleanSpaces, dataMapper, filterString, formatDate, generateRandomValue, getFakerData, getInjectablesRegistry, getLocaleContext, getLocaleContextByKey, getLocaleFromClassName, getLocaleLanguage, getLogger, getModelAndRepository, getNgxModalComponent, getNgxSelectOptionsModal, getOnWindow, getOnWindowDocument, getWindow, getWindowDocument, getWindowWidth, isDarkMode, isDevelopmentMode, isNotUndefined, isValidDate, itemMapper, parseToValidDate, presentNgxInlineModal, presentNgxLightBoxModal, provideDbAdapter, provideDynamicComponents, provideI18n, provideI18nLoader, removeFocusTrap, setOnWindow, stringToBoolean, windowEventEmitter };
 export type { ActionRole, AngularDynamicOutput, AngularFieldDefinition, CheckboxOption, ComponentMetadata, CrudFieldOption, DecafRepository, DecafRepositoryAdapter, ElementPosition, ElementSize, FieldUpdateMode, FlexPosition, FormParent, FormParentGroup, FormServiceControl, FormServiceControls, FunctionLike, HTML5InputType, HTMLFormTarget, I18nResourceConfig, I18nResourceConfigType, I18nToken, IBaseCustomEvent, IComponentConfig, IComponentHolder, IComponentProperties, ICrudFormEvent, ICrudFormOptions, IFieldSetItem, IFieldSetValidationEvent, IFileUploadError, IFilterQuery, IFilterQueryItem, IFormComponentProperties, IFormElement, IFormReactiveSubmitEvent, IListComponentRefreshEvent, IListEmptyOptions, IMenuItem, IModelPageCustomEvent, IPaginationCustomEvent, IRenderedModel, ISortObject, IWindowResizeEvent, InputOption, KeyValue, LayoutGridGap, ListItemCustomEvent, ListItemPosition, PossibleInputTypes, RadioOption, RawQuery, SelectOption, StringOrBoolean, WindowColorScheme };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decaf-ts/for-angular",
-  "version": "0.0.47",
+  "version": "0.0.49",
   "author": "Tiago Venceslau and Contributors",
   "license": "MPL-2.0 OR AGPL-3.0",
   "repository": {