ng-tailwind 4.1.7 → 4.1.8

package/components/ngt-modal/ngt-modal-header/ngt-modal-header.component.d.ts

@@ -5,10 +5,11 @@ import * as i0 from "@angular/core";
 export declare class NgtModalHeaderComponent {
     private injector;
     private tailStylizableDirective;
+    static onCloseModalByHeader: EventEmitter<void>;
     disableDefaultCloses: boolean;
-    onClose: EventEmitter<void>;
     ngtStyle: NgtStylizableService;
     constructor(injector: Injector, tailStylizableDirective: NgtStylizableDirective);
+    emitOnCloseEvent(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtModalHeaderComponent, [null, { optional: true; self: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgtModalHeaderComponent, "ngt-modal-header", never, { "disableDefaultCloses": "disableDefaultCloses"; }, { "onClose": "onClose"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgtModalHeaderComponent, "ngt-modal-header", never, { "disableDefaultCloses": "disableDefaultCloses"; }, {}, never, ["*"], false, never>;
 }

package/components/ngt-modal/ngt-modal.component.d.ts

@@ -9,14 +9,17 @@ export declare class NgtModalComponent {
     customLayout: boolean;
     disableDefaultCloses: boolean;
     ngtStyle: NgtStylizableService;
-    onCloseModal: EventEmitter<any>;
-    onOpenModal: EventEmitter<any>;
+    onCloseModal: EventEmitter<void>;
+    onOpenModal: EventEmitter<void>;
     isOpen: boolean;
     private keydownEventWasAdded;
+    private subscriptions;
     constructor(changeDetectorRef: ChangeDetectorRef, injector: Injector, tailStylizableDirective: NgtStylizableDirective);
     close(): void;
     open(): void;
     private addKeydownEventListener;
+    private bindOnCloseModalByHeaderSubscription;
+    private destroySubscriptions;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtModalComponent, [null, null, { optional: true; self: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<NgtModalComponent, "ngt-modal", never, { "customLayout": "customLayout"; "disableDefaultCloses": "disableDefaultCloses"; "ngtStyle": "ngtStyle"; }, { "onCloseModal": "onCloseModal"; "onOpenModal": "onOpenModal"; }, never, ["[header]", "[body]", "[footer]", "*"], false, never>;
 }

package/esm2020/components/ngt-action/ngt-action.component.mjs

@@ -33,9 +33,9 @@ export class NgtActionComponent {
         }
     }
 }
-NgtActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtActionComponent, deps: [{ token: i0.Injector }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtActionComponent, selector: "ngt-action", inputs: { href: "href", icon: "icon", ngtStyle: "ngtStyle", isDisabled: "isDisabled" }, ngImport: i0, template: "<a *ngIf=\"href\"\n    [class]=\"isDisabled ? 'block rounded-full cursor-not-allowed text-gray-600 bg-gray-400 hover:bg-gray-400 opacity-50' : 'cursor-pointer'\"\n    [routerLink]=\"href\" (click)='onClick($event)'>\n    <div\n        class=\"flex justify-center rounded-full {{ ngtStyle.compile(['h', 'w', 'color.bg', 'color.text', 'px', 'py', 'shadow', 'text']) }}\">\n        <ngt-svg [src]=\"icon\" class='self-center' *ngIf=\"icon\">\n        </ngt-svg>\n        <div class=\"self-center\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</a>\n\n<a *ngIf=\"!href\"\n    [class]=\"isDisabled ? 'block rounded-full cursor-not-allowed text-gray-600 bg-gray-400 hover:bg-gray-400 opacity-50' : 'cursor-pointer'\"\n    (click)='onClick($event)'>\n    <div\n        class=\"flex justify-center rounded-full {{ ngtStyle.compile(['h', 'w', 'color.bg', 'color.text', 'px', 'py', 'shadow', 'text', 'border', 'color.border']) }}\">\n        <ngt-svg [src]=\"icon\" class='self-center' *ngIf=\"icon\"></ngt-svg>\n        <div class=\"self-center\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</a>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtActionComponent, decorators: [{
+NgtActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtActionComponent, deps: [{ token: i0.Injector }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtActionComponent, selector: "ngt-action", inputs: { href: "href", icon: "icon", ngtStyle: "ngtStyle", isDisabled: "isDisabled" }, ngImport: i0, template: "<a *ngIf=\"href\"\n    [class]=\"isDisabled ? 'block rounded-full cursor-not-allowed text-gray-600 bg-gray-400 hover:bg-gray-400 opacity-50' : 'cursor-pointer'\"\n    [routerLink]=\"href\" (click)='onClick($event)'>\n    <div\n        class=\"flex justify-center rounded-full {{ ngtStyle.compile(['h', 'w', 'color.bg', 'color.text', 'px', 'py', 'shadow', 'text']) }}\">\n        <ngt-svg [src]=\"icon\" class='self-center' *ngIf=\"icon\">\n        </ngt-svg>\n        <div class=\"self-center\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</a>\n\n<a *ngIf=\"!href\"\n    [class]=\"isDisabled ? 'block rounded-full cursor-not-allowed text-gray-600 bg-gray-400 hover:bg-gray-400 opacity-50' : 'cursor-pointer'\"\n    (click)='onClick($event)'>\n    <div\n        class=\"flex justify-center rounded-full {{ ngtStyle.compile(['h', 'w', 'color.bg', 'color.text', 'px', 'py', 'shadow', 'text', 'border', 'color.border']) }}\">\n        <ngt-svg [src]=\"icon\" class='self-center' *ngIf=\"icon\"></ngt-svg>\n        <div class=\"self-center\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</a>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtActionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngt-action', template: "<a *ngIf=\"href\"\n    [class]=\"isDisabled ? 'block rounded-full cursor-not-allowed text-gray-600 bg-gray-400 hover:bg-gray-400 opacity-50' : 'cursor-pointer'\"\n    [routerLink]=\"href\" (click)='onClick($event)'>\n    <div\n        class=\"flex justify-center rounded-full {{ ngtStyle.compile(['h', 'w', 'color.bg', 'color.text', 'px', 'py', 'shadow', 'text']) }}\">\n        <ngt-svg [src]=\"icon\" class='self-center' *ngIf=\"icon\">\n        </ngt-svg>\n        <div class=\"self-center\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</a>\n\n<a *ngIf=\"!href\"\n    [class]=\"isDisabled ? 'block rounded-full cursor-not-allowed text-gray-600 bg-gray-400 hover:bg-gray-400 opacity-50' : 'cursor-pointer'\"\n    (click)='onClick($event)'>\n    <div\n        class=\"flex justify-center rounded-full {{ ngtStyle.compile(['h', 'w', 'color.bg', 'color.text', 'px', 'py', 'shadow', 'text', 'border', 'color.border']) }}\">\n        <ngt-svg [src]=\"icon\" class='self-center' *ngIf=\"icon\"></ngt-svg>\n        <div class=\"self-center\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</a>\n" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.NgtStylizableDirective, decorators: [{

package/esm2020/components/ngt-action/ngt-action.module.mjs

@@ -6,14 +6,14 @@ import { NgtActionComponent } from './ngt-action.component';
 import * as i0 from "@angular/core";
 export class NgtActionModule {
 }
-NgtActionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtActionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgtActionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NgtActionModule, declarations: [NgtActionComponent], imports: [CommonModule,
+NgtActionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtActionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgtActionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: NgtActionModule, declarations: [NgtActionComponent], imports: [CommonModule,
         RouterModule,
         NgtSvgModule], exports: [NgtActionComponent] });
-NgtActionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtActionModule, imports: [CommonModule,
+NgtActionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtActionModule, imports: [CommonModule,
         RouterModule,
         NgtSvgModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtActionModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtActionModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NgtActionComponent],

package/esm2020/components/ngt-button/ngt-button.component.mjs

@@ -86,9 +86,9 @@ export class NgtButtonComponent {
         this.subscriptions = [];
     }
 }
-NgtButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtButtonComponent, deps: [{ token: i1.NgtFormComponent, optional: true, skipSelf: true }, { token: i0.Injector }, { token: i2.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtButtonComponent, selector: "ngt-button", inputs: { link: "link", href: "href", type: "type", loading: "loading", isDisabled: "isDisabled", noSubmit: "noSubmit" }, usesOnChanges: true, ngImport: i0, template: "<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n\n<div class=\"h-full w-full\" (click)='onClick($event)'>\n    <ng-container *ngIf='!link'>\n        <button [ngClass]=\"{ 'disabled-button': isDisabled, 'loading-button': loading }\" [disabled]=\"isDisabled\"\n            [type]=\"(loading || isDisabled || noSubmit) ? 'button' : 'submit'\"\n            class=\"flex justify-center items-center h-full w-full focus:outline-none rounded cursor-pointer {{ ngtStyle.compile(['color.bg', 'color.text', 'color.border', 'px', 'py', 'border']) }}\">\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n\n            <span *ngIf=\"loading\" class=\"ml-2\">\n                <div class=\"div-loader h-5 w-5\"></div>\n            </span>\n        </button>\n    </ng-container>\n\n    <ng-container *ngIf='link'>\n        <a [routerLink]='href ? href : null' [ngClass]=\"{ 'disabled-button': isDisabled, 'loading-button': loading }\"\n            class=\"flex justify-center items-center h-full w-full focus:outline-none rounded cursor-pointer {{ ngtStyle.compile(['color.bg', 'color.text', 'color.border', 'px', 'py', 'border']) }}\">\n            <span class=\"w-full\">\n                <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n            </span>\n\n            <span *ngIf=\"loading\" class=\"ml-1\">\n                <div class=\"div-loader\"></div>\n            </span>\n        </a>\n    </ng-container>\n</div>", styles: [".disabled-button{opacity:.5!important;cursor:not-allowed!important}.loading-button{opacity:.5!important;cursor:wait!important}.div-loader{border:3px solid #edf2f738;border-top-color:#edf2f7;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtButtonComponent, decorators: [{
+NgtButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtButtonComponent, deps: [{ token: i1.NgtFormComponent, optional: true, skipSelf: true }, { token: i0.Injector }, { token: i2.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtButtonComponent, selector: "ngt-button", inputs: { link: "link", href: "href", type: "type", loading: "loading", isDisabled: "isDisabled", noSubmit: "noSubmit" }, usesOnChanges: true, ngImport: i0, template: "<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n\n<div class=\"h-full w-full\" (click)='onClick($event)'>\n    <ng-container *ngIf='!link'>\n        <button [ngClass]=\"{ 'disabled-button': isDisabled, 'loading-button': loading }\" [disabled]=\"isDisabled\"\n            [type]=\"(loading || isDisabled || noSubmit) ? 'button' : 'submit'\"\n            class=\"flex justify-center items-center h-full w-full focus:outline-none rounded cursor-pointer {{ ngtStyle.compile(['color.bg', 'color.text', 'color.border', 'px', 'py', 'border']) }}\">\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n\n            <span *ngIf=\"loading\" class=\"ml-2\">\n                <div class=\"div-loader h-5 w-5\"></div>\n            </span>\n        </button>\n    </ng-container>\n\n    <ng-container *ngIf='link'>\n        <a [routerLink]='href ? href : null' [ngClass]=\"{ 'disabled-button': isDisabled, 'loading-button': loading }\"\n            class=\"flex justify-center items-center h-full w-full focus:outline-none rounded cursor-pointer {{ ngtStyle.compile(['color.bg', 'color.text', 'color.border', 'px', 'py', 'border']) }}\">\n            <span class=\"w-full\">\n                <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n            </span>\n\n            <span *ngIf=\"loading\" class=\"ml-1\">\n                <div class=\"div-loader\"></div>\n            </span>\n        </a>\n    </ng-container>\n</div>", styles: [".disabled-button{opacity:.5!important;cursor:not-allowed!important}.loading-button{opacity:.5!important;cursor:wait!important}.div-loader{border:3px solid #edf2f738;border-top-color:#edf2f7;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngt-button', template: "<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n\n<div class=\"h-full w-full\" (click)='onClick($event)'>\n    <ng-container *ngIf='!link'>\n        <button [ngClass]=\"{ 'disabled-button': isDisabled, 'loading-button': loading }\" [disabled]=\"isDisabled\"\n            [type]=\"(loading || isDisabled || noSubmit) ? 'button' : 'submit'\"\n            class=\"flex justify-center items-center h-full w-full focus:outline-none rounded cursor-pointer {{ ngtStyle.compile(['color.bg', 'color.text', 'color.border', 'px', 'py', 'border']) }}\">\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n\n            <span *ngIf=\"loading\" class=\"ml-2\">\n                <div class=\"div-loader h-5 w-5\"></div>\n            </span>\n        </button>\n    </ng-container>\n\n    <ng-container *ngIf='link'>\n        <a [routerLink]='href ? href : null' [ngClass]=\"{ 'disabled-button': isDisabled, 'loading-button': loading }\"\n            class=\"flex justify-center items-center h-full w-full focus:outline-none rounded cursor-pointer {{ ngtStyle.compile(['color.bg', 'color.text', 'color.border', 'px', 'py', 'border']) }}\">\n            <span class=\"w-full\">\n                <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n            </span>\n\n            <span *ngIf=\"loading\" class=\"ml-1\">\n                <div class=\"div-loader\"></div>\n            </span>\n        </a>\n    </ng-container>\n</div>", styles: [".disabled-button{opacity:.5!important;cursor:not-allowed!important}.loading-button{opacity:.5!important;cursor:wait!important}.div-loader{border:3px solid #edf2f738;border-top-color:#edf2f7;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.NgtFormComponent, decorators: [{

package/esm2020/components/ngt-button/ngt-button.module.mjs

@@ -6,14 +6,14 @@ import { NgtButtonComponent } from './ngt-button.component';
 import * as i0 from "@angular/core";
 export class NgtButtonModule {
 }
-NgtButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgtButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NgtButtonModule, declarations: [NgtButtonComponent], imports: [CommonModule,
+NgtButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgtButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: NgtButtonModule, declarations: [NgtButtonComponent], imports: [CommonModule,
         RouterModule,
         NgtFormModule], exports: [NgtButtonComponent] });
-NgtButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtButtonModule, imports: [CommonModule,
+NgtButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtButtonModule, imports: [CommonModule,
         RouterModule,
         NgtFormModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NgtButtonComponent],

package/esm2020/components/ngt-checkbox/ngt-checkbox.component.mjs

@@ -92,8 +92,8 @@ export class NgtCheckboxComponent extends NgtBaseNgModel {
         this.subscriptions = [];
     }
 }
-NgtCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtCheckboxComponent, deps: [{ token: i0.Injector }, { token: i1.ControlContainer, host: true, optional: true }, { token: i0.Renderer2 }, { token: i2.NgtStylizableDirective, optional: true, self: true }, { token: i3.NgtFormComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtCheckboxComponent, selector: "ngt-checkbox", inputs: { label: "label", shining: "shining", isDisabled: "isDisabled", isClickDisabled: "isClickDisabled", name: "name", mode: "mode", helpTitle: "helpTitle", helpTextColor: "helpTextColor", helpText: "helpText" }, providers: [
+NgtCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtCheckboxComponent, deps: [{ token: i0.Injector }, { token: i1.ControlContainer, host: true, optional: true }, { token: i0.Renderer2 }, { token: i2.NgtStylizableDirective, optional: true, self: true }, { token: i3.NgtFormComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtCheckboxComponent, selector: "ngt-checkbox", inputs: { label: "label", shining: "shining", isDisabled: "isDisabled", isClickDisabled: "isClickDisabled", name: "name", mode: "mode", helpTitle: "helpTitle", helpTextColor: "helpTextColor", helpText: "helpText" }, providers: [
         NgtMakeProvider(NgtCheckboxComponent)
     ], viewQueries: [{ propertyName: "element", first: true, predicate: ["element"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label class=\"flex items-center {{ isDisabled ? 'cursor-not-allowed' : 'cursor-pointer' }}\"\n    [class.flex-col]='isToggleMode()' style=\"max-width: max-content;\">\n    <input type=\"checkbox\" [name]='name' class=\"hidden\" ([ngModel])='value' [disabled]=\"isDisabled || isClickDisabled\"\n        #element>\n\n    <span *ngIf=\"isToggleMode() && label\" class=\"flex\">\n        <span class=\"{{ ngtStyle.compile(['text', 'fontCase']) }} mb-2\">{{ label }}</span>\n\n        <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n            {{ helpText }}\n        </ngt-helper>\n    </span>\n\n    <ng-container *ngIf=\"isDefaultMode()\">\n        <div style=\"transition: background-color .2s ease-out\"\n            class=\"{{ value ? ngtStyle.compile(['color.bg']) : 'bg-white' }}  {{ ngtStyle.compile(['h', 'w']) }}\n                    shadow rounded border border-gray-400 {{ isDisabled ? 'opacity-50' : '' }} {{ !shining ? 'flex justify-center' : 'hidden' }}\">\n            <svg class=\"fill-current self-center text-white pointer-events-none\" xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 20 20\">\n                <path d=\"M0 11l2-2 5 5L18 3l2 2L7 18z\" />\n            </svg>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"isRadioMode()\">\n        <div style=\"transition: background-color .2s ease-out\"\n            class=\"{{ value ? ngtStyle.compile(['color.border', 'color.text']) : 'border-gray-500' }} {{ isDisabled ? 'opacity-50' : '' }}\n                    shadow w-6 h-6 rounded-full border-2 border-gray-400 {{ !shining ? 'flex justify-center' : 'hidden' }}\">\n            <svg *ngIf=\"value\" class=\"fill-current self-center h-3\" xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 29.107 29.107\">\n                <path\n                    d=\"M14.554 0C6.561 0 0 6.562 0 14.552c0 7.996 6.561 14.555 14.554 14.555 7.996 0 14.553-6.559 14.553-14.555C29.106 6.562 22.55 0 14.554 0z\" />\n            </svg>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"isToggleMode() || isSideToggleMode()\">\n        <div class=\"shadow w-16 h-8 rounded-full border border-gray-400 {{ shining ? 'hidden' : 'flex' }}\"\n            [class.justify-end]=\"value\" [class.opacity-50]=\"isDisabled\" style=\"padding: 1px;\">\n            <div *ngIf=\"value\"\n                class=\"flex text-xs text-white {{ ngtStyle.compile(['color.bg']) }} pointer-events-none rounded-full px-2 py-3\"\n                @slideLeftToRight>\n                <svg class=\"fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                    <path d=\"M0 11l2-2 5 5L18 3l2 2L7 18z\" />\n                </svg>\n            </div>\n\n            <div *ngIf=\"!value\" class=\"flex text-xl text-white bg-gray-300 pointer-events-none rounded-full px-1 py-3\"\n                @slideRightToLeft>\n                <svg class=\"fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n                    <path class=\"heroicon-ui\"\n                        d=\"M16.24 14.83a1 1 0 0 1-1.41 1.41L12 13.41l-2.83 2.83a1 1 0 0 1-1.41-1.41L10.59 12 7.76 9.17a1 1 0 0 1 1.41-1.41L12 10.59l2.83-2.83a1 1 0 0 1 1.41 1.41L13.41 12l2.83 2.83z\" />\n                </svg>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf='label && !shining && !isToggleMode()'>\n        <span class=\"{{ ngtStyle.compile(['text', 'fontCase']) }} ml-2\">{{ label }}</span>\n\n        <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n            {{ helpText }}\n        </ngt-helper>\n    </ng-container>\n</label>\n\n<ng-container *ngIf='shining'>\n    <div class=\"flex\">\n        <ngt-shining class=\"w-16 h-12\"></ngt-shining>\n    </div>\n</ng-container>", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: i6.NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse"] }], viewProviders: [
         { provide: ControlContainer, useExisting: NgForm }
@@ -111,7 +111,7 @@ NgtCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
             ])
         ])
     ] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtCheckboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtCheckboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngt-checkbox', providers: [
                         NgtMakeProvider(NgtCheckboxComponent)

package/esm2020/components/ngt-checkbox/ngt-checkbox.module.mjs

@@ -6,14 +6,14 @@ import { NgtCheckboxComponent } from './ngt-checkbox.component';
 import * as i0 from "@angular/core";
 export class NgtCheckboxModule {
 }
-NgtCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgtCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NgtCheckboxModule, declarations: [NgtCheckboxComponent], imports: [CommonModule,
+NgtCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgtCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: NgtCheckboxModule, declarations: [NgtCheckboxComponent], imports: [CommonModule,
         NgtShiningModule,
         NgtHelperModule], exports: [NgtCheckboxComponent] });
-NgtCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtCheckboxModule, imports: [CommonModule,
+NgtCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtCheckboxModule, imports: [CommonModule,
         NgtShiningModule,
         NgtHelperModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtCheckboxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtCheckboxModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NgtCheckboxComponent],

package/esm2020/components/ngt-content/ngt-content.component.mjs

@@ -17,9 +17,9 @@ export class NgtContentComponent {
         });
     }
 }
-NgtContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtContentComponent, deps: [{ token: i0.Injector }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtContentComponent, selector: "ngt-content", inputs: { ngtStyle: "ngtStyle" }, ngImport: i0, template: "<div class=\"flex flex-col\">\n    <div class='flex-grow {{ ngtStyle.compile([\"color.bg\"]) }}'>\n        <ng-content></ng-content>\n    </div>\n</div>" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtContentComponent, decorators: [{
+NgtContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtContentComponent, deps: [{ token: i0.Injector }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtContentComponent, selector: "ngt-content", inputs: { ngtStyle: "ngtStyle" }, ngImport: i0, template: "<div class=\"flex flex-col\">\n    <div class='flex-grow {{ ngtStyle.compile([\"color.bg\"]) }}'>\n        <ng-content></ng-content>\n    </div>\n</div>" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtContentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngt-content', template: "<div class=\"flex flex-col\">\n    <div class='flex-grow {{ ngtStyle.compile([\"color.bg\"]) }}'>\n        <ng-content></ng-content>\n    </div>\n</div>" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.NgtStylizableDirective, decorators: [{

package/esm2020/components/ngt-content/ngt-content.module.mjs

@@ -4,10 +4,10 @@ import { NgtContentComponent } from './ngt-content.component';
 import * as i0 from "@angular/core";
 export class NgtContentModule {
 }
-NgtContentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtContentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgtContentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NgtContentModule, declarations: [NgtContentComponent], imports: [CommonModule], exports: [NgtContentComponent] });
-NgtContentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtContentModule, imports: [CommonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtContentModule, decorators: [{
+NgtContentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtContentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgtContentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: NgtContentModule, declarations: [NgtContentComponent], imports: [CommonModule], exports: [NgtContentComponent] });
+NgtContentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtContentModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtContentModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NgtContentComponent],

package/esm2020/components/ngt-datatable/ngt-datatable.component.mjs

@@ -352,9 +352,9 @@ export class NgtDatatableComponent {
         this.subscriptions = [];
     }
 }
-NgtDatatableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDatatableComponent, deps: [{ token: i0.Injector }, { token: i1.NgtHttpService }, { token: i0.ChangeDetectorRef }, { token: i2.NgtTranslateService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtDatatableComponent, selector: "ngt-datatable", inputs: { remoteResource: "remoteResource", type: "type", filterTagBgColor: "filterTagBgColor", filterTagMargin: "filterTagMargin", paginationMargin: "paginationMargin", inputSearch: "inputSearch", searchDelay: "searchDelay", searchTermMinLength: "searchTermMinLength", searchTermOnEnter: "searchTermOnEnter", defaultFilters: "defaultFilters", filtersDescription: "filtersDescription" }, outputs: { onDataChange: "onDataChange", onClearFilter: "onClearFilter", onClearSelectedElements: "onClearSelectedElements", onSelectedElementsChange: "onSelectedElementsChange", onToogleAllCheckboxes: "onToogleAllCheckboxes", onToogleCheckbox: "onToogleCheckbox", onOpenSearchModal: "onOpenSearchModal", onSearch: "onSearch" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, static: true }, { propertyName: "ngtPagination", first: true, predicate: ["ngtPagination"], descendants: true, static: true }, { propertyName: "searchModal", first: true, predicate: ["searchModal"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"w-full\">\n    <div class=\"flex flex-wrap w-full\">\n        <ngt-tag *ngIf=\"hasAppliedFilters()\" class=\"w-full sm:w-auto {{ filterTagMargin }}\"\n            [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\" color.bg=\"bg-red-500\" (click)=\"removeFilter()\" ngt-stylizable>\n            Limpar Filtros\n        </ngt-tag>\n\n        <ng-container *ngIf=\"hasAppliedFilters()\">\n            <ng-container *ngFor=\"let filter of filtersTranslated\">\n                <ngt-tag class=\"w-full sm:w-auto {{ filterTagMargin }}\" [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\"\n                    [color.bg]=\"filterTagBgColor\" (click)=\"removeFilter(filter.reference)\" ngt-stylizable>\n                    {{ filter.translation + ': ' + (filter?.value?.tagValue ? filter.value.tagValue : filter.value)}}\n                </ngt-tag>\n            </ng-container>\n        </ng-container>\n    </div>\n\n    <table style=\"display: table;\" class=\"text-left w-full border-collapse table-responsive\" #table>\n        <ng-content></ng-content>\n    </table>\n\n    <p *ngIf=\"emptyStateVisible\" class=\"mt-8 mx-auto self-center text-center text-xl\">\n        {{ ngtTranslateService.ngtDatatableNoDataFound }}\n    </p>\n\n    <div *ngIf=\"loading\">\n        <div *ngFor=\"let i of [1, 2, 3, 4]\" class=\"flex w-full mt-3\">\n            <ng-container *ngIf=\"columnCount.length >= 2\">\n                <ng-container *ngFor=\"let j of columnCount; let last = last\">\n                    <ng-container *ngIf=\"last\">\n                        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                    </ng-container>\n\n                    <ng-container *ngIf=\"!last\">\n                        <ngt-shining class=\"h-10 w-full mr-10\"></ngt-shining>\n                    </ng-container>\n                </ng-container>\n            </ng-container>\n\n            <ng-container *ngIf=\"columnCount.length < 2\">\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full mr-10 ml-10\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n            </ng-container>\n        </div>\n    </div>\n</div>\n\n<div class=\"clearfix {{ paginationMargin }}\" [hidden]='!data || data.length == 0'>\n    <ngt-pagination [pagesInterval]='4' (onPageChange)='apply($event, false)' (onPerPageChange)='apply(1, false)'\n        #ngtPagination>\n    </ngt-pagination>\n</div>\n\n<ngt-modal #searchModal [customLayout]='true'>\n    <ng-container *ngTemplateOutlet=\"searchModalTemplate\"></ng-container>\n</ngt-modal>", styles: ["@media (max-width: 767px){.table-responsive{display:block;position:relative;width:100%}.table-responsive thead,.table-responsive tbody,.table-responsive th,.table-responsive td,.table-responsive tr{display:block}.table-responsive td,.table-responsive th{height:50px}.table-responsive thead{float:left;margin-bottom:15px}.table-responsive tbody{width:auto;position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}.table-responsive tbody tr{display:inline-block;min-width:100%}}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: i5.NgtPaginationComponent, selector: "ngt-pagination", inputs: ["pagesInterval"], outputs: ["onPageChange", "onPerPageChange"] }, { kind: "component", type: i6.NgtModalComponent, selector: "ngt-modal", inputs: ["customLayout", "disableDefaultCloses", "ngtStyle"], outputs: ["onCloseModal", "onOpenModal"] }, { kind: "component", type: i7.NgtTagComponent, selector: "ngt-tag", inputs: ["icon"] }, { kind: "directive", type: i8.NgtStylizableDirective, selector: "[ngt-stylizable]", inputs: ["color", "color.text", "color.bg", "color.border", "h", "w", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "mt", "mr", "mb", "ml", "border", "shadow", "rounded", "font", "text", "breakWords", "overflow", "position", "justifyContent", "cursor", "fontCase"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDatatableComponent, decorators: [{
+NgtDatatableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDatatableComponent, deps: [{ token: i0.Injector }, { token: i1.NgtHttpService }, { token: i0.ChangeDetectorRef }, { token: i2.NgtTranslateService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtDatatableComponent, selector: "ngt-datatable", inputs: { remoteResource: "remoteResource", type: "type", filterTagBgColor: "filterTagBgColor", filterTagMargin: "filterTagMargin", paginationMargin: "paginationMargin", inputSearch: "inputSearch", searchDelay: "searchDelay", searchTermMinLength: "searchTermMinLength", searchTermOnEnter: "searchTermOnEnter", defaultFilters: "defaultFilters", filtersDescription: "filtersDescription" }, outputs: { onDataChange: "onDataChange", onClearFilter: "onClearFilter", onClearSelectedElements: "onClearSelectedElements", onSelectedElementsChange: "onSelectedElementsChange", onToogleAllCheckboxes: "onToogleAllCheckboxes", onToogleCheckbox: "onToogleCheckbox", onOpenSearchModal: "onOpenSearchModal", onSearch: "onSearch" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, static: true }, { propertyName: "ngtPagination", first: true, predicate: ["ngtPagination"], descendants: true, static: true }, { propertyName: "searchModal", first: true, predicate: ["searchModal"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"w-full\">\n    <div class=\"flex flex-wrap w-full\">\n        <ngt-tag *ngIf=\"hasAppliedFilters()\" class=\"w-full sm:w-auto {{ filterTagMargin }}\"\n            [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\" color.bg=\"bg-red-500\" (click)=\"removeFilter()\" ngt-stylizable>\n            Limpar Filtros\n        </ngt-tag>\n\n        <ng-container *ngIf=\"hasAppliedFilters()\">\n            <ng-container *ngFor=\"let filter of filtersTranslated\">\n                <ngt-tag class=\"w-full sm:w-auto {{ filterTagMargin }}\" [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\"\n                    [color.bg]=\"filterTagBgColor\" (click)=\"removeFilter(filter.reference)\" ngt-stylizable>\n                    {{ filter.translation + ': ' + (filter?.value?.tagValue ? filter.value.tagValue : filter.value)}}\n                </ngt-tag>\n            </ng-container>\n        </ng-container>\n    </div>\n\n    <table style=\"display: table;\" class=\"text-left w-full border-collapse table-responsive\" #table>\n        <ng-content></ng-content>\n    </table>\n\n    <p *ngIf=\"emptyStateVisible\" class=\"mt-8 mx-auto self-center text-center text-xl\">\n        {{ ngtTranslateService.ngtDatatableNoDataFound }}\n    </p>\n\n    <div *ngIf=\"loading\">\n        <div *ngFor=\"let i of [1, 2, 3, 4]\" class=\"flex w-full mt-3\">\n            <ng-container *ngIf=\"columnCount.length >= 2\">\n                <ng-container *ngFor=\"let j of columnCount; let last = last\">\n                    <ng-container *ngIf=\"last\">\n                        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                    </ng-container>\n\n                    <ng-container *ngIf=\"!last\">\n                        <ngt-shining class=\"h-10 w-full mr-10\"></ngt-shining>\n                    </ng-container>\n                </ng-container>\n            </ng-container>\n\n            <ng-container *ngIf=\"columnCount.length < 2\">\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full mr-10 ml-10\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n            </ng-container>\n        </div>\n    </div>\n</div>\n\n<div class=\"clearfix {{ paginationMargin }}\" [hidden]='!data || data.length == 0'>\n    <ngt-pagination [pagesInterval]='4' (onPageChange)='apply($event, false)' (onPerPageChange)='apply(1, false)'\n        #ngtPagination>\n    </ngt-pagination>\n</div>\n\n<ngt-modal #searchModal [customLayout]='true'>\n    <ng-container *ngTemplateOutlet=\"searchModalTemplate\"></ng-container>\n</ngt-modal>", styles: ["@media (max-width: 767px){.table-responsive{display:block;position:relative;width:100%}.table-responsive thead,.table-responsive tbody,.table-responsive th,.table-responsive td,.table-responsive tr{display:block}.table-responsive td,.table-responsive th{height:50px}.table-responsive thead{float:left;margin-bottom:15px}.table-responsive tbody{width:auto;position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}.table-responsive tbody tr{display:inline-block;min-width:100%}}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: i5.NgtPaginationComponent, selector: "ngt-pagination", inputs: ["pagesInterval"], outputs: ["onPageChange", "onPerPageChange"] }, { kind: "component", type: i6.NgtModalComponent, selector: "ngt-modal", inputs: ["customLayout", "disableDefaultCloses", "ngtStyle"], outputs: ["onCloseModal", "onOpenModal"] }, { kind: "component", type: i7.NgtTagComponent, selector: "ngt-tag", inputs: ["icon"] }, { kind: "directive", type: i8.NgtStylizableDirective, selector: "[ngt-stylizable]", inputs: ["color", "color.text", "color.bg", "color.border", "h", "w", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "mt", "mr", "mb", "ml", "border", "shadow", "rounded", "font", "text", "breakWords", "overflow", "position", "justifyContent", "cursor", "fontCase"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDatatableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngt-datatable', template: "<div class=\"w-full\">\n    <div class=\"flex flex-wrap w-full\">\n        <ngt-tag *ngIf=\"hasAppliedFilters()\" class=\"w-full sm:w-auto {{ filterTagMargin }}\"\n            [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\" color.bg=\"bg-red-500\" (click)=\"removeFilter()\" ngt-stylizable>\n            Limpar Filtros\n        </ngt-tag>\n\n        <ng-container *ngIf=\"hasAppliedFilters()\">\n            <ng-container *ngFor=\"let filter of filtersTranslated\">\n                <ngt-tag class=\"w-full sm:w-auto {{ filterTagMargin }}\" [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\"\n                    [color.bg]=\"filterTagBgColor\" (click)=\"removeFilter(filter.reference)\" ngt-stylizable>\n                    {{ filter.translation + ': ' + (filter?.value?.tagValue ? filter.value.tagValue : filter.value)}}\n                </ngt-tag>\n            </ng-container>\n        </ng-container>\n    </div>\n\n    <table style=\"display: table;\" class=\"text-left w-full border-collapse table-responsive\" #table>\n        <ng-content></ng-content>\n    </table>\n\n    <p *ngIf=\"emptyStateVisible\" class=\"mt-8 mx-auto self-center text-center text-xl\">\n        {{ ngtTranslateService.ngtDatatableNoDataFound }}\n    </p>\n\n    <div *ngIf=\"loading\">\n        <div *ngFor=\"let i of [1, 2, 3, 4]\" class=\"flex w-full mt-3\">\n            <ng-container *ngIf=\"columnCount.length >= 2\">\n                <ng-container *ngFor=\"let j of columnCount; let last = last\">\n                    <ng-container *ngIf=\"last\">\n                        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                    </ng-container>\n\n                    <ng-container *ngIf=\"!last\">\n                        <ngt-shining class=\"h-10 w-full mr-10\"></ngt-shining>\n                    </ng-container>\n                </ng-container>\n            </ng-container>\n\n            <ng-container *ngIf=\"columnCount.length < 2\">\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full mr-10 ml-10\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n            </ng-container>\n        </div>\n    </div>\n</div>\n\n<div class=\"clearfix {{ paginationMargin }}\" [hidden]='!data || data.length == 0'>\n    <ngt-pagination [pagesInterval]='4' (onPageChange)='apply($event, false)' (onPerPageChange)='apply(1, false)'\n        #ngtPagination>\n    </ngt-pagination>\n</div>\n\n<ngt-modal #searchModal [customLayout]='true'>\n    <ng-container *ngTemplateOutlet=\"searchModalTemplate\"></ng-container>\n</ngt-modal>", styles: ["@media (max-width: 767px){.table-responsive{display:block;position:relative;width:100%}.table-responsive thead,.table-responsive tbody,.table-responsive th,.table-responsive td,.table-responsive tr{display:block}.table-responsive td,.table-responsive th{height:50px}.table-responsive thead{float:left;margin-bottom:15px}.table-responsive tbody{width:auto;position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}.table-responsive tbody tr{display:inline-block;min-width:100%}}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.NgtHttpService }, { type: i0.ChangeDetectorRef }, { type: i2.NgtTranslateService, decorators: [{

package/esm2020/components/ngt-datatable/ngt-datatable.module.mjs

@@ -20,8 +20,8 @@ import { NgtTrComponent } from './ngt-tr/ngt-tr.component';
 import * as i0 from "@angular/core";
 export class NgtDatatableModule {
 }
-NgtDatatableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDatatableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgtDatatableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NgtDatatableModule, declarations: [NgtDatatableComponent,
+NgtDatatableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDatatableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgtDatatableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: NgtDatatableModule, declarations: [NgtDatatableComponent,
         NgtTbodyComponent,
         NgtTdComponent,
         NgtTdCheckComponent,
@@ -45,7 +45,7 @@ NgtDatatableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
         NgtThCheckComponent,
         NgtTheadComponent,
         NgtTrComponent] });
-NgtDatatableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDatatableModule, imports: [CommonModule,
+NgtDatatableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDatatableModule, imports: [CommonModule,
         FormsModule,
         NgtShiningModule,
         NgtPaginationModule,
@@ -55,7 +55,7 @@ NgtDatatableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", vers
         NgtTagModule,
         NgtActionModule,
         NgtStylizableModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDatatableModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDatatableModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [

package/esm2020/components/ngt-datatable/ngt-tbody/ngt-tbody.component.mjs

@@ -44,9 +44,9 @@ export class NgtTbodyComponent {
         ]);
     }
 }
-NgtTbodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTbodyComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtTbodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtTbodyComponent, selector: "[ngt-tbody]", ngImport: i0, template: "<ng-content></ng-content>" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTbodyComponent, decorators: [{
+NgtTbodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTbodyComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtTbodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtTbodyComponent, selector: "[ngt-tbody]", ngImport: i0, template: "<ng-content></ng-content>" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTbodyComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ngt-tbody]', template: "<ng-content></ng-content>" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1.NgtStylizableDirective, decorators: [{

package/esm2020/components/ngt-datatable/ngt-td/ngt-td.component.mjs

@@ -49,9 +49,9 @@ export class NgtTdComponent {
         ]);
     }
 }
-NgtTdComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTdComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtTdComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtTdComponent, selector: "[ngt-td]", ngImport: i0, template: "<ng-content></ng-content>" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTdComponent, decorators: [{
+NgtTdComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTdComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtTdComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtTdComponent, selector: "[ngt-td]", ngImport: i0, template: "<ng-content></ng-content>" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTdComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ngt-td]', template: "<ng-content></ng-content>" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1.NgtStylizableDirective, decorators: [{

package/esm2020/components/ngt-datatable/ngt-td-check/ngt-td-check.component.mjs

@@ -85,9 +85,9 @@ export class NgtTdCheckComponent {
         this.subscriptions = [];
     }
 }
-NgtTdCheckComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTdCheckComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }, { token: i2.NgtDatatableComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtTdCheckComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtTdCheckComponent, selector: "[ngt-td-check]", inputs: { reference: "reference", isDisabled: "isDisabled", checked: "checked" }, outputs: { onCheckboxInit: "onCheckboxInit" }, viewQueries: [{ propertyName: "checkbox", first: true, predicate: NgtCheckboxComponent, descendants: true, static: true }], ngImport: i0, template: "<ngt-checkbox [(ngModel)]='checked' [isDisabled]=\"isDisabled\" (ngModelChange)='onCheckboxChange($event)'></ngt-checkbox>\n<ng-content></ng-content>", dependencies: [{ kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgtCheckboxComponent, selector: "ngt-checkbox", inputs: ["label", "shining", "isDisabled", "isClickDisabled", "name", "mode", "helpTitle", "helpTextColor", "helpText"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTdCheckComponent, decorators: [{
+NgtTdCheckComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTdCheckComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }, { token: i2.NgtDatatableComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtTdCheckComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtTdCheckComponent, selector: "[ngt-td-check]", inputs: { reference: "reference", isDisabled: "isDisabled", checked: "checked" }, outputs: { onCheckboxInit: "onCheckboxInit" }, viewQueries: [{ propertyName: "checkbox", first: true, predicate: NgtCheckboxComponent, descendants: true, static: true }], ngImport: i0, template: "<ngt-checkbox [(ngModel)]='checked' [isDisabled]=\"isDisabled\" (ngModelChange)='onCheckboxChange($event)'></ngt-checkbox>\n<ng-content></ng-content>", dependencies: [{ kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgtCheckboxComponent, selector: "ngt-checkbox", inputs: ["label", "shining", "isDisabled", "isClickDisabled", "name", "mode", "helpTitle", "helpTextColor", "helpText"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTdCheckComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ngt-td-check]', template: "<ngt-checkbox [(ngModel)]='checked' [isDisabled]=\"isDisabled\" (ngModelChange)='onCheckboxChange($event)'></ngt-checkbox>\n<ng-content></ng-content>" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1.NgtStylizableDirective, decorators: [{

package/esm2020/components/ngt-datatable/ngt-th/ngt-th.component.mjs

@@ -170,9 +170,9 @@ export class NgtThComponent {
         this.subscriptions = [];
     }
 }
-NgtThComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtThComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }, { token: i2.NgtDatatableComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtThComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtThComponent, selector: "[ngt-th]", inputs: { reference: "reference", sortReference: "sortReference", modalWidth: "modalWidth", sortable: "sortable", searchable: "searchable", hasCustomSearch: "hasCustomSearch", searchLabel: "searchLabel", sortableTooltip: "sortableTooltip" }, outputs: { onEnableSearch: "onEnableSearch" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "modal", first: true, predicate: ["modal"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex items-center w-full {{ ngtStyle.compile(['justifyContent']) }}\" [title]=\"getTooltip()\" (click)='sort()'\n    [class.cursor-pointer]='sortable'>\n    <ng-content></ng-content>\n    <ng-container *ngIf='sortable && isCurrentSort'>\n        <svg *ngIf=\"sortDirection == 'asc'\" class=\"fill-current self-center cursor-pointer ml-1\"\n            xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n            <path d=\"M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z\" />\n        </svg>\n\n        <svg *ngIf=\"sortDirection == 'desc'\" class=\"fill-current self-center cursor-pointer ml-1\"\n            xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n            <path d=\"M10.707 7.05L10 6.343 4.343 12l1.414 1.414L10 9.172l4.243 4.242L15.657 12z\" />\n        </svg>\n    </ng-container>\n\n    <ng-container *ngIf='searchable'>\n        <div (click)='enableSearch($event)' class=\"float-right ml-2\" title=\"Filtrar\">\n            <ngt-action class=\"text-lg\" h='h-6' w='w-6' ngt-stylizable>\n                <svg class=\"fill-current self-center\" viewBox=\"0 0 1792 1792\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path\n                        d=\"M1595 295q17 41-14 70l-493 493v742q0 42-39 59-13 5-25 5-27 0-45-19l-256-256q-19-19-19-45V858L211 365q-31-29-14-70 17-39 59-39h1280q42 0 59 39z\" />\n                </svg>\n            </ngt-action>\n        </div>\n    </ng-container>\n</div>\n\n<ng-template #modal>\n    <ngt-modal-header [disableDefaultCloses]=\"ngtDataTable.searchModal.disableDefaultCloses\"\n        (onClose)=\"ngtDataTable.searchModal.close()\">\n        <span *ngIf=\"searchLabel\" class=\"font-semibold text-gray-800 text-sm\">{{ searchLabel }}</span>\n\n        <ng-content select='[customSearchHeader]'></ng-content>\n    </ngt-modal-header>\n\n    <ngt-modal-body>\n        <ngt-input *ngIf=\"!hasCustomSearch\" jit='true' [(ngModel)]='searchTerm' (ngModelChange)='search($event)'\n            placeholder='Pesquisar...' name='{{ reference }}_filter' #searchInput>\n        </ngt-input>\n\n        <div [hidden]='!hasCustomSearch'>\n            <ng-content select='[customSearch]'></ng-content>\n        </div>\n    </ngt-modal-body>\n</ng-template>", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.NgtInputComponent, selector: "ngt-input", inputs: ["label", "placeholder", "shining", "loading", "helpTitle", "helpTextColor", "helpText", "innerLeftIcon", "innerLeftIconColor", "innerRightIcon", "innerRightIconColor", "decimalMaskPrecision", "showCharactersLength", "isDisabled", "isReadonly", "showRoundedIcon", "type", "name", "mask", "focus", "allowClear", "jit", "findExistingResource", "allowPhoneValidation", "isRequired", "uniqueResource", "minValue", "maxValue", "maxLength", "minLength", "match", "multipleOf", "externalServerDependency"], outputs: ["onClickLeftIcon", "onClickRightIcon", "validatePhoneResult"] }, { kind: "component", type: i6.NgtModalHeaderComponent, selector: "ngt-modal-header", inputs: ["disableDefaultCloses"], outputs: ["onClose"] }, { kind: "component", type: i7.NgtModalBodyComponent, selector: "ngt-modal-body" }, { kind: "component", type: i8.NgtActionComponent, selector: "ngt-action", inputs: ["href", "icon", "ngtStyle", "isDisabled"] }, { kind: "directive", type: i1.NgtStylizableDirective, selector: "[ngt-stylizable]", inputs: ["color", "color.text", "color.bg", "color.border", "h", "w", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "mt", "mr", "mb", "ml", "border", "shadow", "rounded", "font", "text", "breakWords", "overflow", "position", "justifyContent", "cursor", "fontCase"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtThComponent, decorators: [{
+NgtThComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtThComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }, { token: i2.NgtDatatableComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtThComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtThComponent, selector: "[ngt-th]", inputs: { reference: "reference", sortReference: "sortReference", modalWidth: "modalWidth", sortable: "sortable", searchable: "searchable", hasCustomSearch: "hasCustomSearch", searchLabel: "searchLabel", sortableTooltip: "sortableTooltip" }, outputs: { onEnableSearch: "onEnableSearch" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "modal", first: true, predicate: ["modal"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex items-center w-full {{ ngtStyle.compile(['justifyContent']) }}\" [title]=\"getTooltip()\" (click)='sort()'\n    [class.cursor-pointer]='sortable'>\n    <ng-content></ng-content>\n    <ng-container *ngIf='sortable && isCurrentSort'>\n        <svg *ngIf=\"sortDirection == 'asc'\" class=\"fill-current self-center cursor-pointer ml-1\"\n            xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n            <path d=\"M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z\" />\n        </svg>\n\n        <svg *ngIf=\"sortDirection == 'desc'\" class=\"fill-current self-center cursor-pointer ml-1\"\n            xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n            <path d=\"M10.707 7.05L10 6.343 4.343 12l1.414 1.414L10 9.172l4.243 4.242L15.657 12z\" />\n        </svg>\n    </ng-container>\n\n    <ng-container *ngIf='searchable'>\n        <div (click)='enableSearch($event)' class=\"float-right ml-2\" title=\"Filtrar\">\n            <ngt-action class=\"text-lg\" h='h-6' w='w-6' ngt-stylizable>\n                <svg class=\"fill-current self-center\" viewBox=\"0 0 1792 1792\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path\n                        d=\"M1595 295q17 41-14 70l-493 493v742q0 42-39 59-13 5-25 5-27 0-45-19l-256-256q-19-19-19-45V858L211 365q-31-29-14-70 17-39 59-39h1280q42 0 59 39z\" />\n                </svg>\n            </ngt-action>\n        </div>\n    </ng-container>\n</div>\n\n<ng-template #modal>\n    <ngt-modal-header [disableDefaultCloses]=\"ngtDataTable.searchModal.disableDefaultCloses\"\n        (onClose)=\"ngtDataTable.searchModal.close()\">\n        <span *ngIf=\"searchLabel\" class=\"font-semibold text-gray-800 text-sm\">{{ searchLabel }}</span>\n\n        <ng-content select='[customSearchHeader]'></ng-content>\n    </ngt-modal-header>\n\n    <ngt-modal-body>\n        <ngt-input *ngIf=\"!hasCustomSearch\" jit='true' [(ngModel)]='searchTerm' (ngModelChange)='search($event)'\n            placeholder='Pesquisar...' name='{{ reference }}_filter' #searchInput>\n        </ngt-input>\n\n        <div [hidden]='!hasCustomSearch'>\n            <ng-content select='[customSearch]'></ng-content>\n        </div>\n    </ngt-modal-body>\n</ng-template>", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.NgtInputComponent, selector: "ngt-input", inputs: ["label", "placeholder", "shining", "loading", "helpTitle", "helpTextColor", "helpText", "innerLeftIcon", "innerLeftIconColor", "innerRightIcon", "innerRightIconColor", "decimalMaskPrecision", "showCharactersLength", "isDisabled", "isReadonly", "showRoundedIcon", "type", "name", "mask", "focus", "allowClear", "jit", "findExistingResource", "allowPhoneValidation", "isRequired", "uniqueResource", "minValue", "maxValue", "maxLength", "minLength", "match", "multipleOf", "externalServerDependency"], outputs: ["onClickLeftIcon", "onClickRightIcon", "validatePhoneResult"] }, { kind: "component", type: i6.NgtModalHeaderComponent, selector: "ngt-modal-header", inputs: ["disableDefaultCloses"] }, { kind: "component", type: i7.NgtModalBodyComponent, selector: "ngt-modal-body" }, { kind: "component", type: i8.NgtActionComponent, selector: "ngt-action", inputs: ["href", "icon", "ngtStyle", "isDisabled"] }, { kind: "directive", type: i1.NgtStylizableDirective, selector: "[ngt-stylizable]", inputs: ["color", "color.text", "color.bg", "color.border", "h", "w", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "mt", "mr", "mb", "ml", "border", "shadow", "rounded", "font", "text", "breakWords", "overflow", "position", "justifyContent", "cursor", "fontCase"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtThComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ngt-th]', template: "<div class=\"flex items-center w-full {{ ngtStyle.compile(['justifyContent']) }}\" [title]=\"getTooltip()\" (click)='sort()'\n    [class.cursor-pointer]='sortable'>\n    <ng-content></ng-content>\n    <ng-container *ngIf='sortable && isCurrentSort'>\n        <svg *ngIf=\"sortDirection == 'asc'\" class=\"fill-current self-center cursor-pointer ml-1\"\n            xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n            <path d=\"M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z\" />\n        </svg>\n\n        <svg *ngIf=\"sortDirection == 'desc'\" class=\"fill-current self-center cursor-pointer ml-1\"\n            xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n            <path d=\"M10.707 7.05L10 6.343 4.343 12l1.414 1.414L10 9.172l4.243 4.242L15.657 12z\" />\n        </svg>\n    </ng-container>\n\n    <ng-container *ngIf='searchable'>\n        <div (click)='enableSearch($event)' class=\"float-right ml-2\" title=\"Filtrar\">\n            <ngt-action class=\"text-lg\" h='h-6' w='w-6' ngt-stylizable>\n                <svg class=\"fill-current self-center\" viewBox=\"0 0 1792 1792\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path\n                        d=\"M1595 295q17 41-14 70l-493 493v742q0 42-39 59-13 5-25 5-27 0-45-19l-256-256q-19-19-19-45V858L211 365q-31-29-14-70 17-39 59-39h1280q42 0 59 39z\" />\n                </svg>\n            </ngt-action>\n        </div>\n    </ng-container>\n</div>\n\n<ng-template #modal>\n    <ngt-modal-header [disableDefaultCloses]=\"ngtDataTable.searchModal.disableDefaultCloses\"\n        (onClose)=\"ngtDataTable.searchModal.close()\">\n        <span *ngIf=\"searchLabel\" class=\"font-semibold text-gray-800 text-sm\">{{ searchLabel }}</span>\n\n        <ng-content select='[customSearchHeader]'></ng-content>\n    </ngt-modal-header>\n\n    <ngt-modal-body>\n        <ngt-input *ngIf=\"!hasCustomSearch\" jit='true' [(ngModel)]='searchTerm' (ngModelChange)='search($event)'\n            placeholder='Pesquisar...' name='{{ reference }}_filter' #searchInput>\n        </ngt-input>\n\n        <div [hidden]='!hasCustomSearch'>\n            <ng-content select='[customSearch]'></ng-content>\n        </div>\n    </ngt-modal-body>\n</ng-template>" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1.NgtStylizableDirective, decorators: [{

package/esm2020/components/ngt-datatable/ngt-th-check/ngt-th-check.component.mjs

@@ -74,9 +74,9 @@ export class NgtThCheckComponent {
         this.subscriptions = [];
     }
 }
-NgtThCheckComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtThCheckComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }, { token: i2.NgtDatatableComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtThCheckComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtThCheckComponent, selector: "[ngt-th-check]", ngImport: i0, template: "<ngt-checkbox [(ngModel)]='checked' (ngModelChange)='onCheckboxChange($event)'></ngt-checkbox>\n<ng-content></ng-content>", dependencies: [{ kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgtCheckboxComponent, selector: "ngt-checkbox", inputs: ["label", "shining", "isDisabled", "isClickDisabled", "name", "mode", "helpTitle", "helpTextColor", "helpText"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtThCheckComponent, decorators: [{
+NgtThCheckComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtThCheckComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }, { token: i2.NgtDatatableComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtThCheckComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtThCheckComponent, selector: "[ngt-th-check]", ngImport: i0, template: "<ngt-checkbox [(ngModel)]='checked' (ngModelChange)='onCheckboxChange($event)'></ngt-checkbox>\n<ng-content></ng-content>", dependencies: [{ kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgtCheckboxComponent, selector: "ngt-checkbox", inputs: ["label", "shining", "isDisabled", "isClickDisabled", "name", "mode", "helpTitle", "helpTextColor", "helpText"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtThCheckComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ngt-th-check]', template: "<ngt-checkbox [(ngModel)]='checked' (ngModelChange)='onCheckboxChange($event)'></ngt-checkbox>\n<ng-content></ng-content>" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1.NgtStylizableDirective, decorators: [{

package/esm2020/components/ngt-datatable/ngt-thead/ngt-thead.component.mjs

@@ -42,9 +42,9 @@ export class NgtTheadComponent {
         ]);
     }
 }
-NgtTheadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTheadComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtTheadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtTheadComponent, selector: "[ngt-thead]", ngImport: i0, template: "<ng-content></ng-content>" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTheadComponent, decorators: [{
+NgtTheadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTheadComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtTheadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtTheadComponent, selector: "[ngt-thead]", ngImport: i0, template: "<ng-content></ng-content>" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTheadComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ngt-thead]', template: "<ng-content></ng-content>" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1.NgtStylizableDirective, decorators: [{

package/esm2020/components/ngt-datatable/ngt-tr/ngt-tr.component.mjs

@@ -55,9 +55,9 @@ export class NgtTrComponent {
         return '';
     }
 }
-NgtTrComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTrComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtTheadComponent, optional: true, skipSelf: true }, { token: i2.NgtTbodyComponent, optional: true, skipSelf: true }, { token: i3.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtTrComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtTrComponent, selector: "[ngt-tr]", inputs: { evenStripped: "evenStripped", oddStripped: "oddStripped" }, host: { properties: { "class.evenStripped": "this.evenStripped", "class.oddStripped": "this.oddStripped" } }, ngImport: i0, template: "<ng-content></ng-content>", styles: [".evenStripped:nth-child(even){background-color:#edf2f7!important}.oddStripped:nth-child(odd){background-color:#edf2f7!important}\n"], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtTrComponent, decorators: [{
+NgtTrComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTrComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.NgtTheadComponent, optional: true, skipSelf: true }, { token: i2.NgtTbodyComponent, optional: true, skipSelf: true }, { token: i3.NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtTrComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtTrComponent, selector: "[ngt-tr]", inputs: { evenStripped: "evenStripped", oddStripped: "oddStripped" }, host: { properties: { "class.evenStripped": "this.evenStripped", "class.oddStripped": "this.oddStripped" } }, ngImport: i0, template: "<ng-content></ng-content>", styles: [".evenStripped:nth-child(even){background-color:#edf2f7!important}.oddStripped:nth-child(odd){background-color:#edf2f7!important}\n"], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTrComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ngt-tr]', encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: [".evenStripped:nth-child(even){background-color:#edf2f7!important}.oddStripped:nth-child(odd){background-color:#edf2f7!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1.NgtTheadComponent, decorators: [{

package/esm2020/components/ngt-date/ngt-date.component.mjs

@@ -326,13 +326,13 @@ export class NgtDateComponent extends NgtBaseNgModel {
         this.subscriptions = [];
     }
 }
-NgtDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDateComponent, deps: [{ token: i0.Injector }, { token: i1.NgtStylizableDirective, optional: true, self: true }, { token: i2.ControlContainer, host: true, optional: true }, { token: i3.NgtFormComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NgtDateComponent, selector: "ngt-date", inputs: { label: "label", placeholder: "placeholder", helpTitle: "helpTitle", helpText: "helpText", helpTextColor: "helpTextColor", shining: "shining", dateFormat: "dateFormat", dateFormatNgModel: "dateFormatNgModel", showCalendarIcon: "showCalendarIcon", name: "name", isDisabled: "isDisabled", isReadonly: "isReadonly", mode: "mode", time_24hr: "time_24hr", enableTime: "enableTime", noCalendar: "noCalendar", minuteIncrement: "minuteIncrement", allowInput: "allowInput", locale: "locale", allowClear: "allowClear", minDate: "minDate", maxDate: "maxDate", defaultDate: "defaultDate", isRequired: "isRequired" }, providers: [
+NgtDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDateComponent, deps: [{ token: i0.Injector }, { token: i1.NgtStylizableDirective, optional: true, self: true }, { token: i2.ControlContainer, host: true, optional: true }, { token: i3.NgtFormComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
+NgtDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtDateComponent, selector: "ngt-date", inputs: { label: "label", placeholder: "placeholder", helpTitle: "helpTitle", helpText: "helpText", helpTextColor: "helpTextColor", shining: "shining", dateFormat: "dateFormat", dateFormatNgModel: "dateFormatNgModel", showCalendarIcon: "showCalendarIcon", name: "name", isDisabled: "isDisabled", isReadonly: "isReadonly", mode: "mode", time_24hr: "time_24hr", enableTime: "enableTime", noCalendar: "noCalendar", minuteIncrement: "minuteIncrement", allowInput: "allowInput", locale: "locale", allowClear: "allowClear", minDate: "minDate", maxDate: "maxDate", defaultDate: "defaultDate", isRequired: "isRequired" }, providers: [
         NgtMakeProvider(NgtDateComponent),
     ], viewQueries: [{ propertyName: "ng2FlatpickrComponent", first: true, predicate: ["ng2FlatpickrComponent"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label class=\"{{ shining ? '' : 'block' }} mb-2 {{ngtStyle.compile(['text', 'fontCase'])}} flex\" *ngIf=\"label\"\n    [hidden]='shining'>\n    {{ label }}:\n\n    <span class=\"text-red-500 font-bold text-md ml-1\" *ngIf=\"isRequired\">*</span>\n\n    <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n        {{ helpText }}\n    </ngt-helper>\n</label>\n\n<div class=\"relative\" [hidden]='shining || isDisabled || isReadonly'>\n    <div\n        class=\"overflow-hidden {{ ngtStyle.compile(['h', 'color.text']) }} {{ hasErrors() ? 'border-error' : 'border-normal' }}\">\n        <ng2-flatpickr class=\"block h-full\" [config]='dateConfig' disabled='true' placeholder=\"{{ placeholder }}\"\n            #ng2FlatpickrComponent>\n        </ng2-flatpickr>\n\n        <div *ngIf=\"allowClear && value\"\n            class=\"flex h-full absolute items-center right-0 top-0 w-auto cursor-pointer {{showCalendarIcon ? 'mr-6' : 'mr-2'}}\"\n            (click)='clearInput(true)'>\n            <svg class=\"fill-current text-red-400\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n                <path\n                    d=\"M19.1 17.2l-5.3-5.3 5.3-5.3-1.8-1.8-5.3 5.4-5.3-5.3-1.8 1.7 5.3 5.3-5.3 5.3L6.7 19l5.3-5.3 5.3 5.3 1.8-1.8z\" />\n            </svg>\n        </div>\n\n        <div *ngIf=\"showCalendarIcon\"\n            class=\"flex h-full absolute items-center right-0 top-0 w-auto cursor-pointer mr-2\">\n            <svg class=\"fill-current text-lg\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n                <path\n                    d=\"M19,4H17V3a1,1,0,0,0-2,0V4H9V3A1,1,0,0,0,7,3V4H5A3,3,0,0,0,2,7V19a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V7A3,3,0,0,0,19,4Zm1,15a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V12H20Zm0-9H4V7A1,1,0,0,1,5,6H7V7A1,1,0,0,0,9,7V6h6V7a1,1,0,0,0,2,0V6h2a1,1,0,0,1,1,1Z\" />\n            </svg>\n        </div>\n    </div>\n</div>\n\n<ng-container *ngIf='shining'>\n    <div class=\"flex\">\n        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n    </div>\n</ng-container>\n\n<ng-container *ngIf='isDisabled || isReadonly'>\n    <div\n        class=\"{{isDisabled ? 'disabledDiv' : ''}} {{ngtStyle.compile(['h'])}} w-full px-4 rounded appearance-none flex items-center border border-gray-400\">\n        {{ getFormattedNativeValue() }}\n    </div>\n</ng-container>\n\n<input *ngIf='componentReady' type=\"hidden\" [ngModel]=\"value\" [name]=\"name\" [value]=\"value\">\n\n<ng-content></ng-content>\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\"></ngt-validation>", styles: [".flatpickr-calendar{background:transparent;opacity:0;display:none;text-align:center;visibility:hidden;padding:0;animation:none;direction:ltr;border:0;font-size:14px;line-height:24px;border-radius:5px;position:absolute;width:auto;box-sizing:border-box;touch-action:manipulation;background:#fff;box-shadow:1px 0 #e6e6e6,-1px 0 #e6e6e6,0 1px #e6e6e6,0 -1px #e6e6e6,0 3px 13px #00000014}.flatpickr-calendar.open,.flatpickr-calendar.inline{opacity:1;max-height:640px;visibility:visible}.flatpickr-calendar.open{display:inline-block;z-index:99999}.flatpickr-calendar.animate.open{animation:fpFadeInDown .3s cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.inline{display:block;position:relative;top:2px}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{z-index:999;display:block}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7){box-shadow:none!important}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1){box-shadow:-2px 0 #e6e6e6,5px 0 #e6e6e6}.flatpickr-calendar .hasWeeks .dayContainer,.flatpickr-calendar .hasTime .dayContainer{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-left:0}.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time{height:30px;border-top:1px solid #e6e6e6}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:before,.flatpickr-calendar:after{position:absolute;display:block;pointer-events:none;border:solid transparent;content:\"\";height:0;width:0;left:22px}.flatpickr-calendar.rightMost:before,.flatpickr-calendar.rightMost:after{left:auto;right:22px}.flatpickr-calendar:before{border-width:5px;margin:0 -5px}.flatpickr-calendar:after{border-width:4px;margin:0 -4px}.flatpickr-calendar.arrowTop:before,.flatpickr-calendar.arrowTop:after{bottom:100%}.flatpickr-calendar.arrowTop:before{border-bottom-color:#e6e6e6}.flatpickr-calendar.arrowTop:after{border-bottom-color:#fff}.flatpickr-calendar.arrowBottom:before,.flatpickr-calendar.arrowBottom:after{top:100%}.flatpickr-calendar.arrowBottom:before{border-top-color:#e6e6e6}.flatpickr-calendar.arrowBottom:after{border-top-color:#fff}.flatpickr-calendar:focus{outline:0}.flatpickr-wrapper{position:relative;display:inline-block}.flatpickr-months{display:flex}.flatpickr-months .flatpickr-month{background:transparent;color:#000000e6;fill:#000000e6;height:34px;line-height:1;text-align:center;position:relative;-webkit-user-select:none;user-select:none;overflow:hidden;flex:1}.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{text-decoration:none;cursor:pointer;position:absolute;top:0;height:34px;padding:10px;z-index:3;color:#000000e6;fill:#000000e6}.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,.flatpickr-months .flatpickr-next-month.flatpickr-disabled{display:none}.flatpickr-months .flatpickr-prev-month i,.flatpickr-months .flatpickr-next-month i{position:relative}.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,.flatpickr-months .flatpickr-next-month.flatpickr-prev-month{left:0}.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,.flatpickr-months .flatpickr-next-month.flatpickr-next-month{right:0}.flatpickr-months .flatpickr-prev-month:hover,.flatpickr-months .flatpickr-next-month:hover{color:#959ea9}.flatpickr-months .flatpickr-prev-month:hover svg,.flatpickr-months .flatpickr-next-month:hover svg{fill:#f64747}.flatpickr-months .flatpickr-prev-month svg,.flatpickr-months .flatpickr-next-month svg{width:14px;height:14px}.flatpickr-months .flatpickr-prev-month svg path,.flatpickr-months .flatpickr-next-month svg path{transition:fill .1s;fill:inherit}.numInputWrapper{position:relative;height:auto}.numInputWrapper input,.numInputWrapper span{display:inline-block}.numInputWrapper input{width:100%}.numInputWrapper input::-ms-clear{display:none}.numInputWrapper input::-webkit-outer-spin-button,.numInputWrapper input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.numInputWrapper span{position:absolute;right:0;width:14px;padding:0 4px 0 2px;height:50%;line-height:50%;opacity:0;cursor:pointer;border:1px solid rgba(57,57,57,.15);box-sizing:border-box}.numInputWrapper span:hover{background:rgba(0,0,0,.1)}.numInputWrapper span:active{background:rgba(0,0,0,.2)}.numInputWrapper span:after{display:block;content:\"\";position:absolute}.numInputWrapper span.arrowUp{top:0;border-bottom:0}.numInputWrapper span.arrowUp:after{border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:4px solid rgba(57,57,57,.6);top:26%}.numInputWrapper span.arrowDown{top:50%}.numInputWrapper span.arrowDown:after{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(57,57,57,.6);top:40%}.numInputWrapper span svg{width:inherit;height:auto}.numInputWrapper span svg path{fill:#00000080}.numInputWrapper:hover{background:rgba(0,0,0,.05)}.numInputWrapper:hover span{opacity:1}.flatpickr-current-month{font-size:135%;line-height:inherit;font-weight:300;color:inherit;position:absolute;width:75%;left:12.5%;padding:7.48px 0 0;line-height:1;height:34px;display:inline-block;text-align:center;transform:translateZ(0)}.flatpickr-current-month span.cur-month{font-family:inherit;font-weight:700;color:inherit;display:inline-block;margin-left:.5ch;padding:0}.flatpickr-current-month span.cur-month:hover{background:rgba(0,0,0,.05)}.flatpickr-current-month .numInputWrapper{width:6ch;width:7ch\\fffd;display:inline-block}.flatpickr-current-month .numInputWrapper span.arrowUp:after{border-bottom-color:#000000e6}.flatpickr-current-month .numInputWrapper span.arrowDown:after{border-top-color:#000000e6}.flatpickr-current-month input.cur-year{background:transparent;box-sizing:border-box;color:inherit;cursor:text;padding:0 0 0 .5ch;margin:0;display:inline-block;font-size:inherit;font-family:inherit;font-weight:300;line-height:inherit;height:auto;border:0;border-radius:0;vertical-align:initial;-webkit-appearance:textfield;appearance:textfield}.flatpickr-current-month input.cur-year:focus{outline:0}.flatpickr-current-month input.cur-year[disabled],.flatpickr-current-month input.cur-year[disabled]:hover{font-size:100%;color:#00000080;background:transparent;pointer-events:none}.flatpickr-current-month .flatpickr-monthDropdown-months{appearance:menulist;background:transparent;border:none;border-radius:0;box-sizing:border-box;color:inherit;cursor:pointer;font-size:inherit;font-family:inherit;font-weight:300;height:auto;line-height:inherit;margin:-1px 0 0;outline:none;padding:0 0 0 .5ch;position:relative;vertical-align:initial;-webkit-box-sizing:border-box;-webkit-appearance:menulist;-moz-appearance:menulist;width:auto}.flatpickr-current-month .flatpickr-monthDropdown-months:focus,.flatpickr-current-month .flatpickr-monthDropdown-months:active{outline:none}.flatpickr-current-month .flatpickr-monthDropdown-months:hover{background:rgba(0,0,0,.05)}.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{background-color:transparent;outline:none;padding:0}.flatpickr-weekdays{background:transparent;text-align:center;overflow:hidden;width:100%;display:flex;align-items:center;height:28px}.flatpickr-weekdays .flatpickr-weekdaycontainer{display:flex;flex:1}span.flatpickr-weekday{cursor:default;font-size:90%;background:transparent;color:#0000008a;line-height:1;margin:0;text-align:center;display:block;flex:1;font-weight:bolder}.dayContainer,.flatpickr-weeks{padding:1px 0 0}.flatpickr-days{position:relative;overflow:hidden;display:flex;align-items:flex-start;width:307.875px}.flatpickr-days:focus{outline:0}.dayContainer{padding:0;outline:0;text-align:left;width:307.875px;min-width:307.875px;max-width:307.875px;box-sizing:border-box;display:inline-block;display:flex;flex-wrap:wrap;-ms-flex-wrap:wrap;justify-content:space-around;transform:translateZ(0);opacity:1}.dayContainer+.dayContainer{box-shadow:-1px 0 #e6e6e6}.flatpickr-day{background:none;border:1px solid transparent;border-radius:150px;box-sizing:border-box;color:#393939;cursor:pointer;font-weight:400;width:14.2857143%;flex-basis:14.2857143%;max-width:39px;height:39px;line-height:39px;margin:0;display:inline-block;position:relative;justify-content:center;text-align:center}.flatpickr-day.inRange,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.today.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day:hover,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.nextMonthDay:hover,.flatpickr-day:focus,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.nextMonthDay:focus{cursor:pointer;outline:0;background:#e6e6e6;border-color:#e6e6e6}.flatpickr-day.today{border-color:#959ea9}.flatpickr-day.today:hover,.flatpickr-day.today:focus{border-color:#959ea9;background:#959ea9;color:#fff}.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange,.flatpickr-day.selected.inRange,.flatpickr-day.startRange.inRange,.flatpickr-day.endRange.inRange,.flatpickr-day.selected:focus,.flatpickr-day.startRange:focus,.flatpickr-day.endRange:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange:hover,.flatpickr-day.endRange:hover,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.endRange.nextMonthDay{background:#569ff7;box-shadow:none;color:#fff;border-color:#569ff7}.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange,.flatpickr-day.endRange.startRange{border-radius:50px 0 0 50px}.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange,.flatpickr-day.endRange.endRange{border-radius:0 50px 50px 0}.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)){box-shadow:-10px 0 #569ff7}.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange,.flatpickr-day.endRange.startRange.endRange{border-radius:50px}.flatpickr-day.inRange{border-radius:0;box-shadow:-5px 0 #e6e6e6,5px 0 #e6e6e6}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.notAllowed.nextMonthDay{color:#3939394d;background:transparent;border-color:transparent;cursor:default}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{cursor:not-allowed;color:#3939391a}.flatpickr-day.week.selected{border-radius:0;box-shadow:-5px 0 #569ff7,5px 0 #569ff7}.flatpickr-day.hidden{visibility:hidden}.rangeMode .flatpickr-day{margin-top:1px}.flatpickr-weekwrapper{float:left}.flatpickr-weekwrapper .flatpickr-weeks{padding:0 12px;box-shadow:1px 0 #e6e6e6}.flatpickr-weekwrapper .flatpickr-weekday{float:none;width:100%;line-height:28px}.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{display:block;width:100%;max-width:none;color:#3939394d;background:transparent;cursor:default;border:none}.flatpickr-innerContainer{display:block;display:flex;box-sizing:border-box;overflow:hidden}.flatpickr-rContainer{display:inline-block;padding:0;box-sizing:border-box}.flatpickr-time{text-align:center;outline:0;display:block;height:0;line-height:30px;max-height:40px;box-sizing:border-box;overflow:hidden;display:flex}.flatpickr-time:after{content:\"\";display:table;clear:both}.flatpickr-time .numInputWrapper{flex:1;width:40%;height:30px;float:left}.flatpickr-time .numInputWrapper span.arrowUp:after{border-bottom-color:#393939}.flatpickr-time .numInputWrapper span.arrowDown:after{border-top-color:#393939}.flatpickr-time.hasSeconds .numInputWrapper{width:26%}.flatpickr-time.time24hr .numInputWrapper{width:49%}.flatpickr-time input{background:transparent;box-shadow:none;border:0;border-radius:0;text-align:center;margin:0;padding:0;height:inherit;line-height:inherit;color:#393939;font-size:12px;position:relative;box-sizing:border-box;-webkit-appearance:textfield;appearance:textfield}.flatpickr-time input.flatpickr-hour{font-weight:700}.flatpickr-time input.flatpickr-minute,.flatpickr-time input.flatpickr-second{font-weight:400}.flatpickr-time input:focus{outline:0;border:0}.flatpickr-time .flatpickr-time-separator,.flatpickr-time .flatpickr-am-pm{height:inherit;float:left;line-height:inherit;color:#393939;font-weight:700;width:2%;-webkit-user-select:none;user-select:none;align-self:center}.flatpickr-time .flatpickr-am-pm{outline:0;width:18%;cursor:pointer;text-align:center;font-weight:400}.flatpickr-time input:hover,.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time input:focus,.flatpickr-time .flatpickr-am-pm:focus{background:#eee}.flatpickr-input[readonly]{cursor:pointer}@keyframes fpFadeInDown{0%{opacity:0;transform:translate3d(0,-20px,0)}to{opacity:1;transform:translateZ(0)}}.border-error{border:solid #c53030 1px;background-color:unset!important;border-radius:.25rem}.border-normal{border:solid #cbd5e0 1px;background-color:unset!important;border-radius:.25rem}.ng2-flatpickr-input:focus{outline:none}.ng2-flatpickr-input{border:0;width:100%;height:100%;padding-left:.8rem}.ng2-flatpickr-input-container{height:100%!important}.disabledDiv{background-color:#fafafa}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.Ng2FlatpickrComponent, selector: "ng2-flatpickr", inputs: ["placeholder", "addClass", "hideButton", "tabindex", "config", "setDate"] }, { kind: "component", type: i6.NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: i7.NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: i8.NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse"] }], viewProviders: [
         { provide: ControlContainer, useExisting: NgForm }
     ], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDateComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDateComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngt-date', encapsulation: ViewEncapsulation.None, providers: [
                         NgtMakeProvider(NgtDateComponent),

package/esm2020/components/ngt-date/ngt-date.module.mjs

@@ -9,20 +9,20 @@ import { NgtDateComponent } from './ngt-date.component';
 import * as i0 from "@angular/core";
 export class NgtDateModule {
 }
-NgtDateModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDateModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgtDateModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NgtDateModule, declarations: [NgtDateComponent], imports: [CommonModule,
+NgtDateModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDateModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgtDateModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: NgtDateModule, declarations: [NgtDateComponent], imports: [CommonModule,
         FormsModule,
         Ng2FlatpickrModule,
         NgtValidationModule,
         NgtShiningModule,
         NgtHelperModule], exports: [NgtDateComponent] });
-NgtDateModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDateModule, imports: [CommonModule,
+NgtDateModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDateModule, imports: [CommonModule,
         FormsModule,
         Ng2FlatpickrModule,
         NgtValidationModule,
         NgtShiningModule,
         NgtHelperModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NgtDateModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDateModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NgtDateComponent],