ng-tailwind 4.5.43 → 4.5.45

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2142,7 +2142,7 @@ class NgtInputComponent extends NgtBaseNgModel {
2142
2142
  h: 'h-12',
2143
2143
  rounded: 'rounded',
2144
2144
  text: 'text-sm',
2145
- fontCase: '',
2145
+ font: 'font-normal',
2146
2146
  color: {
2147
2147
  border: 'border-gray-400 focus:border-gray-700',
2148
2148
  bg: 'bg-bg-white focus:bg-white',
@@ -2769,7 +2769,7 @@ class NgtInputComponent extends NgtBaseNgModel {
2769
2769
  NgtInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtInputComponent, deps: [{ token: i0.Injector }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: NgtStylizableDirective, optional: true, self: true }, { token: i2$1.ControlContainer, host: true, optional: true }, { token: NgtFormComponent, optional: true, skipSelf: true }, { token: NgtHttpValidationService, optional: true, skipSelf: true }, { token: NgtHttpResourceService, optional: true, skipSelf: true }, { token: NgtFormComponent, optional: true, skipSelf: true }, { token: NgtSectionComponent, optional: true, skipSelf: true }, { token: NgtModalComponent, optional: true, skipSelf: true }, { token: NgtTranslateService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
2770
2770
  NgtInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtInputComponent, selector: "ngt-input", inputs: { label: "label", placeholder: "placeholder", shining: "shining", loading: "loading", helpTitle: "helpTitle", helpTextColor: "helpTextColor", helpText: "helpText", innerLeftIcon: "innerLeftIcon", innerLeftIconColor: "innerLeftIconColor", innerRightIcon: "innerRightIcon", innerRightIconColor: "innerRightIconColor", decimalMaskPrecision: "decimalMaskPrecision", showCharactersLength: "showCharactersLength", uppercase: "uppercase", customInnerContentTemplate: "customInnerContentTemplate", isDisabled: "isDisabled", isReadonly: "isReadonly", showRoundedIcon: "showRoundedIcon", type: "type", name: "name", mask: "mask", focus: "focus", allowClear: "allowClear", jit: "jit", findExistingResource: "findExistingResource", allowPhoneValidation: "allowPhoneValidation", validatePassword: "validatePassword", passwordableId: "passwordableId", passwordPolicyId: "passwordPolicyId", isRequired: "isRequired", uniqueResource: "uniqueResource", minValue: "minValue", maxValue: "maxValue", maxLength: "maxLength", minLength: "minLength", match: "match", multipleOf: "multipleOf", validateMinValueOnMask: "validateMinValueOnMask", externalServerDependency: "externalServerDependency", helperReverseYPosition: "helperReverseYPosition", helperAutoXReverse: "helperAutoXReverse" }, outputs: { onClickLeftIcon: "onClickLeftIcon", onClickRightIcon: "onClickRightIcon", validatePhoneResult: "validatePhoneResult" }, providers: [
2771
2771
  NgtMakeProvider(NgtInputComponent),
2772
- ], viewQueries: [{ propertyName: "element", first: true, predicate: ["element"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label *ngIf=\"label\" class=\"mb-2 flex {{ ngtStyle.compile(['color.text', 'text', 'fontCase']) }}\" [hidden]='shining'>\n {{ label }}:\n\n <span *ngIf=\"isRequired\" class=\"text-red-500 font-bold text-md ml-1\">*</span>\n\n <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\"\n [helperReverseYPosition]=\"helperReverseYPosition\" [autoXReverse]=\"helperAutoXReverse\" class=\"ml-1\">\n <span [innerHtml]=\"helpText\"></span>\n </ngt-helper>\n</label>\n\n<div class=\"{{ shining ? 'hidden' : 'flex relative'}}\">\n <input autocomplete=\"new-password\"\n class=\"flex border appearance-none focus:outline-none leading-tight w-full {{ getInputPaddings() }} {{ ngtStyle.compile(['h', 'text', 'color.border', 'color.bg', 'color.text', 'rounded', 'cursor']) }}\"\n [disabled]=\"disabled()\" [readonly]=\"isReadonly || loading\" [placeholder]=\"placeholder\"\n [style]=\"uppercase ? 'text-transform: uppercase!important':''\"\n [ngClass]=\"{'input-has-error border-red-700': formControl?.errors && (formControl?.dirty || (formContainer && formContainer['submitted']))}\"\n [attr.type]=\"inputProperties.htmlType\" (mouseleave)=\"restorePlaceholder()\" (focusout)=\"restorePlaceholder()\"\n #element>\n <span *ngIf=\"innerLeftIcon\"\n class=\"absolute self-center px-2 {{ innerLeftIconColor }} {{ onClickLeftIcon ? 'cursor-pointer' : '' }}\"\n (click)=\"onClickLeftIcon.emit()\">\n\n <ngt-svg *ngIf=\"!showRoundedIcon\" class=\"fill-current\" [src]='innerLeftIcon'></ngt-svg>\n <img *ngIf=\"showRoundedIcon\" class=\"rounded-full h-6\" [src]='innerLeftIcon'>\n </span>\n\n <div *ngIf=\"customInnerContentTemplate\" class=\"absolute self-center px-2\">\n <ng-container [ngTemplateOutlet]=\"customInnerContentTemplate\"></ng-container>\n </div>\n\n <div class=\"flex absolute h-full justify-end right-0 w-auto\">\n <span *ngIf=\"!disabled() && allowClear && value && !loading\"\n class=\"self-center right-0 px-2 text-red-400 cursor-pointer\" (click)='clearInput($event)'>\n <svg class=\"fill-current self-center\" 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 </span>\n\n <span *ngIf=\"loading\" class=\"self-center right-0 px-2 text-gray-500\">\n <div class=\"div-loader\"></div>\n </span>\n\n <span *ngIf=\"type == 'password' && value\" class=\"self-center px-2 cursor-pointer\">\n <svg *ngIf=\"element.type == 'password'\" class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\" (click)='showPassword()'>\n <path\n d=\"M.2 10a11 11 0 0 1 19.6 0A11 11 0 0 1 .2 10zm9.8 4a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm0-2a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n </svg>\n\n <svg *ngIf=\"element.type == 'text'\" class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\" (click)='hidePassword()'>\n <path\n d=\"M12.81 4.36l-1.77 1.78a4 4 0 0 0-4.9 4.9l-2.76 2.75C2.06 12.79.96 11.49.2 10a11 11 0 0 1 12.6-5.64zm3.8 1.85c1.33 1 2.43 2.3 3.2 3.79a11 11 0 0 1-12.62 5.64l1.77-1.78a4 4 0 0 0 4.9-4.9l2.76-2.75zm-.25-3.99l1.42 1.42L3.64 17.78l-1.42-1.42L16.36 2.22z\" />\n </svg>\n </span>\n\n <span *ngIf=\"innerRightIcon && type != 'password'\"\n class=\"self-center px-2 {{ innerRightIconColor }} {{ onClickRightIcon ? 'cursor-pointer' : '' }}\"\n (click)=\"onClickRightIcon.emit()\">\n <ngt-svg class=\"fill-current\" [src]='innerRightIcon'></ngt-svg>\n </span>\n </div>\n</div>\n\n<ng-container *ngIf=\"showCharactersLength && maxTotalCharsCount && !shining\">\n <p class=\"text-xs mt-1\">\n {{ ngtTranslateService.ngtTextAreaRemainingCharacters }}:\n <span class=\"font-semibold\">{{ getRemainingCharacters() }}</span>\n </p>\n</ng-container>\n\n<ng-container *ngIf='shining'>\n <div class=\"flex\">\n <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\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\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\" [minValue]='minValue' [minLength]='minLength'>\n</ngt-validation>\n", styles: [".div-loader{width:20px;height:20px;border:3px solid #a0aec038;border-top-color:#a0aec0;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], viewProviders: [
2772
+ ], viewQueries: [{ propertyName: "element", first: true, predicate: ["element"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label *ngIf=\"label\" class=\"mb-2 flex {{ ngtStyle.compile(['color.text', 'text', 'font']) }}\" [hidden]='shining'>\n {{ label }}:\n\n <span *ngIf=\"isRequired\" class=\"text-red-500 font-bold text-md ml-1\">*</span>\n\n <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\"\n [helperReverseYPosition]=\"helperReverseYPosition\" [autoXReverse]=\"helperAutoXReverse\" class=\"ml-1\">\n <span [innerHtml]=\"helpText\"></span>\n </ngt-helper>\n</label>\n\n<div class=\"{{ shining ? 'hidden' : 'flex relative'}}\">\n <input autocomplete=\"new-password\"\n class=\"flex border appearance-none focus:outline-none leading-tight w-full {{ getInputPaddings() }} {{ ngtStyle.compile(['h', 'text', 'color.border', 'color.bg', 'color.text', 'rounded', 'cursor']) }}\"\n [disabled]=\"disabled()\" [readonly]=\"isReadonly || loading\" [placeholder]=\"placeholder\"\n [style]=\"uppercase ? 'text-transform: uppercase!important':''\"\n [ngClass]=\"{'input-has-error border-red-700': formControl?.errors && (formControl?.dirty || (formContainer && formContainer['submitted']))}\"\n [attr.type]=\"inputProperties.htmlType\" (mouseleave)=\"restorePlaceholder()\" (focusout)=\"restorePlaceholder()\"\n #element>\n <span *ngIf=\"innerLeftIcon\"\n class=\"absolute self-center px-2 {{ innerLeftIconColor }} {{ onClickLeftIcon ? 'cursor-pointer' : '' }}\"\n (click)=\"onClickLeftIcon.emit()\">\n\n <ngt-svg *ngIf=\"!showRoundedIcon\" class=\"fill-current\" [src]='innerLeftIcon'></ngt-svg>\n <img *ngIf=\"showRoundedIcon\" class=\"rounded-full h-6\" [src]='innerLeftIcon'>\n </span>\n\n <div *ngIf=\"customInnerContentTemplate\" class=\"absolute self-center px-2\">\n <ng-container [ngTemplateOutlet]=\"customInnerContentTemplate\"></ng-container>\n </div>\n\n <div class=\"flex absolute h-full justify-end right-0 w-auto\">\n <span *ngIf=\"!disabled() && allowClear && value && !loading\"\n class=\"self-center right-0 px-2 text-red-400 cursor-pointer\" (click)='clearInput($event)'>\n <svg class=\"fill-current self-center\" 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 </span>\n\n <span *ngIf=\"loading\" class=\"self-center right-0 px-2 text-gray-500\">\n <div class=\"div-loader\"></div>\n </span>\n\n <span *ngIf=\"type == 'password' && value\" class=\"self-center px-2 cursor-pointer\">\n <svg *ngIf=\"element.type == 'password'\" class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\" (click)='showPassword()'>\n <path\n d=\"M.2 10a11 11 0 0 1 19.6 0A11 11 0 0 1 .2 10zm9.8 4a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm0-2a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n </svg>\n\n <svg *ngIf=\"element.type == 'text'\" class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\" (click)='hidePassword()'>\n <path\n d=\"M12.81 4.36l-1.77 1.78a4 4 0 0 0-4.9 4.9l-2.76 2.75C2.06 12.79.96 11.49.2 10a11 11 0 0 1 12.6-5.64zm3.8 1.85c1.33 1 2.43 2.3 3.2 3.79a11 11 0 0 1-12.62 5.64l1.77-1.78a4 4 0 0 0 4.9-4.9l2.76-2.75zm-.25-3.99l1.42 1.42L3.64 17.78l-1.42-1.42L16.36 2.22z\" />\n </svg>\n </span>\n\n <span *ngIf=\"innerRightIcon && type != 'password'\"\n class=\"self-center px-2 {{ innerRightIconColor }} {{ onClickRightIcon ? 'cursor-pointer' : '' }}\"\n (click)=\"onClickRightIcon.emit()\">\n <ngt-svg class=\"fill-current\" [src]='innerRightIcon'></ngt-svg>\n </span>\n </div>\n</div>\n\n<ng-container *ngIf=\"showCharactersLength && maxTotalCharsCount && !shining\">\n <p class=\"text-xs mt-1\">\n {{ ngtTranslateService.ngtTextAreaRemainingCharacters }}:\n <span class=\"font-semibold\">{{ getRemainingCharacters() }}</span>\n </p>\n</ng-container>\n\n<ng-container *ngIf='shining'>\n <div class=\"flex\">\n <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\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\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\" [minValue]='minValue' [minLength]='minLength'>\n</ngt-validation>", styles: [".div-loader{width:20px;height:20px;border:3px solid #a0aec038;border-top-color:#a0aec0;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], viewProviders: [
2773
2773
  { provide: ControlContainer, useExisting: NgForm }
2774
2774
  ] });
2775
2775
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtInputComponent, decorators: [{
@@ -2778,7 +2778,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
2778
2778
  NgtMakeProvider(NgtInputComponent),
2779
2779
  ], viewProviders: [
2780
2780
  { provide: ControlContainer, useExisting: NgForm }
2781
- ], template: "<label *ngIf=\"label\" class=\"mb-2 flex {{ ngtStyle.compile(['color.text', 'text', 'fontCase']) }}\" [hidden]='shining'>\n {{ label }}:\n\n <span *ngIf=\"isRequired\" class=\"text-red-500 font-bold text-md ml-1\">*</span>\n\n <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\"\n [helperReverseYPosition]=\"helperReverseYPosition\" [autoXReverse]=\"helperAutoXReverse\" class=\"ml-1\">\n <span [innerHtml]=\"helpText\"></span>\n </ngt-helper>\n</label>\n\n<div class=\"{{ shining ? 'hidden' : 'flex relative'}}\">\n <input autocomplete=\"new-password\"\n class=\"flex border appearance-none focus:outline-none leading-tight w-full {{ getInputPaddings() }} {{ ngtStyle.compile(['h', 'text', 'color.border', 'color.bg', 'color.text', 'rounded', 'cursor']) }}\"\n [disabled]=\"disabled()\" [readonly]=\"isReadonly || loading\" [placeholder]=\"placeholder\"\n [style]=\"uppercase ? 'text-transform: uppercase!important':''\"\n [ngClass]=\"{'input-has-error border-red-700': formControl?.errors && (formControl?.dirty || (formContainer && formContainer['submitted']))}\"\n [attr.type]=\"inputProperties.htmlType\" (mouseleave)=\"restorePlaceholder()\" (focusout)=\"restorePlaceholder()\"\n #element>\n <span *ngIf=\"innerLeftIcon\"\n class=\"absolute self-center px-2 {{ innerLeftIconColor }} {{ onClickLeftIcon ? 'cursor-pointer' : '' }}\"\n (click)=\"onClickLeftIcon.emit()\">\n\n <ngt-svg *ngIf=\"!showRoundedIcon\" class=\"fill-current\" [src]='innerLeftIcon'></ngt-svg>\n <img *ngIf=\"showRoundedIcon\" class=\"rounded-full h-6\" [src]='innerLeftIcon'>\n </span>\n\n <div *ngIf=\"customInnerContentTemplate\" class=\"absolute self-center px-2\">\n <ng-container [ngTemplateOutlet]=\"customInnerContentTemplate\"></ng-container>\n </div>\n\n <div class=\"flex absolute h-full justify-end right-0 w-auto\">\n <span *ngIf=\"!disabled() && allowClear && value && !loading\"\n class=\"self-center right-0 px-2 text-red-400 cursor-pointer\" (click)='clearInput($event)'>\n <svg class=\"fill-current self-center\" 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 </span>\n\n <span *ngIf=\"loading\" class=\"self-center right-0 px-2 text-gray-500\">\n <div class=\"div-loader\"></div>\n </span>\n\n <span *ngIf=\"type == 'password' && value\" class=\"self-center px-2 cursor-pointer\">\n <svg *ngIf=\"element.type == 'password'\" class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\" (click)='showPassword()'>\n <path\n d=\"M.2 10a11 11 0 0 1 19.6 0A11 11 0 0 1 .2 10zm9.8 4a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm0-2a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n </svg>\n\n <svg *ngIf=\"element.type == 'text'\" class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\" (click)='hidePassword()'>\n <path\n d=\"M12.81 4.36l-1.77 1.78a4 4 0 0 0-4.9 4.9l-2.76 2.75C2.06 12.79.96 11.49.2 10a11 11 0 0 1 12.6-5.64zm3.8 1.85c1.33 1 2.43 2.3 3.2 3.79a11 11 0 0 1-12.62 5.64l1.77-1.78a4 4 0 0 0 4.9-4.9l2.76-2.75zm-.25-3.99l1.42 1.42L3.64 17.78l-1.42-1.42L16.36 2.22z\" />\n </svg>\n </span>\n\n <span *ngIf=\"innerRightIcon && type != 'password'\"\n class=\"self-center px-2 {{ innerRightIconColor }} {{ onClickRightIcon ? 'cursor-pointer' : '' }}\"\n (click)=\"onClickRightIcon.emit()\">\n <ngt-svg class=\"fill-current\" [src]='innerRightIcon'></ngt-svg>\n </span>\n </div>\n</div>\n\n<ng-container *ngIf=\"showCharactersLength && maxTotalCharsCount && !shining\">\n <p class=\"text-xs mt-1\">\n {{ ngtTranslateService.ngtTextAreaRemainingCharacters }}:\n <span class=\"font-semibold\">{{ getRemainingCharacters() }}</span>\n </p>\n</ng-container>\n\n<ng-container *ngIf='shining'>\n <div class=\"flex\">\n <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\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\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\" [minValue]='minValue' [minLength]='minLength'>\n</ngt-validation>\n", styles: [".div-loader{width:20px;height:20px;border:3px solid #a0aec038;border-top-color:#a0aec0;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
2781
+ ], template: "<label *ngIf=\"label\" class=\"mb-2 flex {{ ngtStyle.compile(['color.text', 'text', 'font']) }}\" [hidden]='shining'>\n {{ label }}:\n\n <span *ngIf=\"isRequired\" class=\"text-red-500 font-bold text-md ml-1\">*</span>\n\n <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\"\n [helperReverseYPosition]=\"helperReverseYPosition\" [autoXReverse]=\"helperAutoXReverse\" class=\"ml-1\">\n <span [innerHtml]=\"helpText\"></span>\n </ngt-helper>\n</label>\n\n<div class=\"{{ shining ? 'hidden' : 'flex relative'}}\">\n <input autocomplete=\"new-password\"\n class=\"flex border appearance-none focus:outline-none leading-tight w-full {{ getInputPaddings() }} {{ ngtStyle.compile(['h', 'text', 'color.border', 'color.bg', 'color.text', 'rounded', 'cursor']) }}\"\n [disabled]=\"disabled()\" [readonly]=\"isReadonly || loading\" [placeholder]=\"placeholder\"\n [style]=\"uppercase ? 'text-transform: uppercase!important':''\"\n [ngClass]=\"{'input-has-error border-red-700': formControl?.errors && (formControl?.dirty || (formContainer && formContainer['submitted']))}\"\n [attr.type]=\"inputProperties.htmlType\" (mouseleave)=\"restorePlaceholder()\" (focusout)=\"restorePlaceholder()\"\n #element>\n <span *ngIf=\"innerLeftIcon\"\n class=\"absolute self-center px-2 {{ innerLeftIconColor }} {{ onClickLeftIcon ? 'cursor-pointer' : '' }}\"\n (click)=\"onClickLeftIcon.emit()\">\n\n <ngt-svg *ngIf=\"!showRoundedIcon\" class=\"fill-current\" [src]='innerLeftIcon'></ngt-svg>\n <img *ngIf=\"showRoundedIcon\" class=\"rounded-full h-6\" [src]='innerLeftIcon'>\n </span>\n\n <div *ngIf=\"customInnerContentTemplate\" class=\"absolute self-center px-2\">\n <ng-container [ngTemplateOutlet]=\"customInnerContentTemplate\"></ng-container>\n </div>\n\n <div class=\"flex absolute h-full justify-end right-0 w-auto\">\n <span *ngIf=\"!disabled() && allowClear && value && !loading\"\n class=\"self-center right-0 px-2 text-red-400 cursor-pointer\" (click)='clearInput($event)'>\n <svg class=\"fill-current self-center\" 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 </span>\n\n <span *ngIf=\"loading\" class=\"self-center right-0 px-2 text-gray-500\">\n <div class=\"div-loader\"></div>\n </span>\n\n <span *ngIf=\"type == 'password' && value\" class=\"self-center px-2 cursor-pointer\">\n <svg *ngIf=\"element.type == 'password'\" class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\" (click)='showPassword()'>\n <path\n d=\"M.2 10a11 11 0 0 1 19.6 0A11 11 0 0 1 .2 10zm9.8 4a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm0-2a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n </svg>\n\n <svg *ngIf=\"element.type == 'text'\" class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\" (click)='hidePassword()'>\n <path\n d=\"M12.81 4.36l-1.77 1.78a4 4 0 0 0-4.9 4.9l-2.76 2.75C2.06 12.79.96 11.49.2 10a11 11 0 0 1 12.6-5.64zm3.8 1.85c1.33 1 2.43 2.3 3.2 3.79a11 11 0 0 1-12.62 5.64l1.77-1.78a4 4 0 0 0 4.9-4.9l2.76-2.75zm-.25-3.99l1.42 1.42L3.64 17.78l-1.42-1.42L16.36 2.22z\" />\n </svg>\n </span>\n\n <span *ngIf=\"innerRightIcon && type != 'password'\"\n class=\"self-center px-2 {{ innerRightIconColor }} {{ onClickRightIcon ? 'cursor-pointer' : '' }}\"\n (click)=\"onClickRightIcon.emit()\">\n <ngt-svg class=\"fill-current\" [src]='innerRightIcon'></ngt-svg>\n </span>\n </div>\n</div>\n\n<ng-container *ngIf=\"showCharactersLength && maxTotalCharsCount && !shining\">\n <p class=\"text-xs mt-1\">\n {{ ngtTranslateService.ngtTextAreaRemainingCharacters }}:\n <span class=\"font-semibold\">{{ getRemainingCharacters() }}</span>\n </p>\n</ng-container>\n\n<ng-container *ngIf='shining'>\n <div class=\"flex\">\n <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\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\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\" [minValue]='minValue' [minLength]='minLength'>\n</ngt-validation>", styles: [".div-loader{width:20px;height:20px;border:3px solid #a0aec038;border-top-color:#a0aec0;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
2782
2782
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: NgtStylizableDirective, decorators: [{
2783
2783
  type: Self
2784
2784
  }, {
@@ -5454,7 +5454,7 @@ class NgtTextareaComponent extends NgtBaseNgModel {
5454
5454
  }
5455
5455
  this.ngtStyle.load(this.injector, 'NgtTextarea', {
5456
5456
  text: 'text-sm',
5457
- fontCase: '',
5457
+ font: 'font-normal',
5458
5458
  color: {
5459
5459
  border: 'border-gray-400 focus:border-gray-700',
5460
5460
  bg: 'bg-bg-white focus:bg-white',
@@ -5581,7 +5581,7 @@ class NgtTextareaComponent extends NgtBaseNgModel {
5581
5581
  NgtTextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTextareaComponent, deps: [{ token: i0.Injector }, { token: NgtStylizableDirective, optional: true, self: true }, { token: i2$1.ControlContainer, host: true, optional: true }, { token: NgtFormComponent, optional: true, skipSelf: true }, { token: i0.Renderer2 }, { token: NgtTranslateService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
5582
5582
  NgtTextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtTextareaComponent, selector: "ngt-textarea", inputs: { label: "label", placeholder: "placeholder", rows: "rows", showCharactersLength: "showCharactersLength", helpTitle: "helpTitle", helpText: "helpText", helpTextColor: "helpTextColor", shining: "shining", name: "name", isDisabled: "isDisabled", isReadonly: "isReadonly", jit: "jit", focus: "focus", isRequired: "isRequired", maxLength: "maxLength" }, providers: [
5583
5583
  NgtMakeProvider(NgtTextareaComponent),
5584
- ], viewQueries: [{ propertyName: "element", first: true, predicate: ["element"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label class=\"{{ shining ? '' : 'block' }} mb-2 flex {{ ngtStyle.compile(['text', 'fontCase']) }}\" *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=\"flex flex-col\">\n <div class=\"{{ shining ? '' : 'flex'}}\" [hidden]='shining'>\n <textarea [rows]='rows' autocomplete=\"new-password\" attr.type=\"text\"\n class=\"appearance-none block border focus:outline-none leading-tight px-4 py-3 rounded w-full h-full {{ ngtStyle.compile(['h', 'color.border', 'color.bg', 'color.text']) }}\"\n [disabled]=\"isDisabled\" [readonly]=\"isReadonly\" placeholder=\"{{ placeholder ? placeholder : ''}}\"\n [ngClass]=\"{'textarea-has-error border-red-700': formControl?.errors && (formControl?.dirty || (formContainer && formContainer['submitted']))}\"\n #element>\n </textarea>\n </div>\n\n <ng-container *ngIf=\"showCharactersLength && !shining\">\n <p class=\"text-xs mt-1\">\n {{ ngtTranslateService.ngtTextAreaRemainingCharacters }}: <span class=\"font-semibold\">\n {{ getRemainingCharacters() }}\n </span>\n </p>\n </ng-container>\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<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>", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], viewProviders: [
5584
+ ], viewQueries: [{ propertyName: "element", first: true, predicate: ["element"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label class=\"{{ shining ? '' : 'block' }} mb-2 flex {{ ngtStyle.compile(['text', 'font', 'color.text']) }}\"\n *ngIf=\"label\" [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=\"flex flex-col\">\n <div class=\"{{ shining ? '' : 'flex'}}\" [hidden]='shining'>\n <textarea [rows]='rows' autocomplete=\"new-password\" attr.type=\"text\"\n class=\"appearance-none block border focus:outline-none leading-tight px-4 py-3 rounded w-full {{ ngtStyle.compile(['h', 'color.border', 'color.bg', 'color.text']) }}\"\n [disabled]=\"isDisabled\" [readonly]=\"isReadonly\" placeholder=\"{{ placeholder ? placeholder : ''}}\"\n [ngClass]=\"{'textarea-has-error border-red-700': formControl?.errors && (formControl?.dirty || (formContainer && formContainer['submitted']))}\"\n #element>\n </textarea>\n </div>\n\n <ng-container *ngIf=\"showCharactersLength && !shining\">\n <p class=\"text-xs mt-1\">\n {{ ngtTranslateService.ngtTextAreaRemainingCharacters }}: <span class=\"font-semibold\">\n {{ getRemainingCharacters() }}\n </span>\n </p>\n </ng-container>\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<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>", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], viewProviders: [
5585
5585
  { provide: ControlContainer, useExisting: NgForm }
5586
5586
  ] });
5587
5587
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtTextareaComponent, decorators: [{
@@ -5590,7 +5590,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
5590
5590
  NgtMakeProvider(NgtTextareaComponent),
5591
5591
  ], viewProviders: [
5592
5592
  { provide: ControlContainer, useExisting: NgForm }
5593
- ], template: "<label class=\"{{ shining ? '' : 'block' }} mb-2 flex {{ ngtStyle.compile(['text', 'fontCase']) }}\" *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=\"flex flex-col\">\n <div class=\"{{ shining ? '' : 'flex'}}\" [hidden]='shining'>\n <textarea [rows]='rows' autocomplete=\"new-password\" attr.type=\"text\"\n class=\"appearance-none block border focus:outline-none leading-tight px-4 py-3 rounded w-full h-full {{ ngtStyle.compile(['h', 'color.border', 'color.bg', 'color.text']) }}\"\n [disabled]=\"isDisabled\" [readonly]=\"isReadonly\" placeholder=\"{{ placeholder ? placeholder : ''}}\"\n [ngClass]=\"{'textarea-has-error border-red-700': formControl?.errors && (formControl?.dirty || (formContainer && formContainer['submitted']))}\"\n #element>\n </textarea>\n </div>\n\n <ng-container *ngIf=\"showCharactersLength && !shining\">\n <p class=\"text-xs mt-1\">\n {{ ngtTranslateService.ngtTextAreaRemainingCharacters }}: <span class=\"font-semibold\">\n {{ getRemainingCharacters() }}\n </span>\n </p>\n </ng-container>\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<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>" }]
5593
+ ], template: "<label class=\"{{ shining ? '' : 'block' }} mb-2 flex {{ ngtStyle.compile(['text', 'font', 'color.text']) }}\"\n *ngIf=\"label\" [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=\"flex flex-col\">\n <div class=\"{{ shining ? '' : 'flex'}}\" [hidden]='shining'>\n <textarea [rows]='rows' autocomplete=\"new-password\" attr.type=\"text\"\n class=\"appearance-none block border focus:outline-none leading-tight px-4 py-3 rounded w-full {{ ngtStyle.compile(['h', 'color.border', 'color.bg', 'color.text']) }}\"\n [disabled]=\"isDisabled\" [readonly]=\"isReadonly\" placeholder=\"{{ placeholder ? placeholder : ''}}\"\n [ngClass]=\"{'textarea-has-error border-red-700': formControl?.errors && (formControl?.dirty || (formContainer && formContainer['submitted']))}\"\n #element>\n </textarea>\n </div>\n\n <ng-container *ngIf=\"showCharactersLength && !shining\">\n <p class=\"text-xs mt-1\">\n {{ ngtTranslateService.ngtTextAreaRemainingCharacters }}: <span class=\"font-semibold\">\n {{ getRemainingCharacters() }}\n </span>\n </p>\n </ng-container>\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<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>" }]
5594
5594
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: NgtStylizableDirective, decorators: [{
5595
5595
  type: Self
5596
5596
  }, {
@@ -6317,6 +6317,8 @@ class NgtPortletFooterComponent {
6317
6317
  this.ngtStyle = new NgtStylizableService();
6318
6318
  }
6319
6319
  this.ngtStyle.load(this.injector, 'NgtPortletFooter', {
6320
+ px: 'px-6',
6321
+ py: 'py-3',
6320
6322
  color: {
6321
6323
  bg: 'bg-gray-200',
6322
6324
  text: 'text-black'
@@ -6325,10 +6327,10 @@ class NgtPortletFooterComponent {
6325
6327
  }
6326
6328
  }
6327
6329
  NgtPortletFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtPortletFooterComponent, deps: [{ token: i0.Injector }, { token: NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
6328
- NgtPortletFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtPortletFooterComponent, selector: "ngt-portlet-footer", ngImport: i0, template: "<div class=\"{{ ngtStyle.compile(['color.text', 'color.bg']) }}\">\n <div class=\"clearfix w-full px-6 py-3\">\n <div class=\"md:float-left w-full\">\n <ng-content></ng-content>\n </div>\n <div class=\"md:float-left w-full md:w-auto\">\n <ng-content select=\"[left-footer]\"></ng-content>\n </div>\n <div class=\"md:float-right w-full md:w-auto\">\n <ng-content select=\"[right-footer]\"></ng-content>\n </div>\n </div>\n</div>" });
6330
+ NgtPortletFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtPortletFooterComponent, selector: "ngt-portlet-footer", ngImport: i0, template: "<div class=\"block w-full {{ ngtStyle.compile(['color.text', 'color.bg', 'px', 'py', 'pb']) }}\">\n <div class=\"block w-full\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"block md:float-left w-full md:w-auto\">\n <ng-content select=\"[left-footer]\"></ng-content>\n </div>\n\n <div class=\"block md:float-right w-full md:w-auto\">\n <ng-content select=\"[right-footer]\"></ng-content>\n </div>\n</div>" });
6329
6331
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtPortletFooterComponent, decorators: [{
6330
6332
  type: Component,
6331
- args: [{ selector: 'ngt-portlet-footer', template: "<div class=\"{{ ngtStyle.compile(['color.text', 'color.bg']) }}\">\n <div class=\"clearfix w-full px-6 py-3\">\n <div class=\"md:float-left w-full\">\n <ng-content></ng-content>\n </div>\n <div class=\"md:float-left w-full md:w-auto\">\n <ng-content select=\"[left-footer]\"></ng-content>\n </div>\n <div class=\"md:float-right w-full md:w-auto\">\n <ng-content select=\"[right-footer]\"></ng-content>\n </div>\n </div>\n</div>" }]
6333
+ args: [{ selector: 'ngt-portlet-footer', template: "<div class=\"block w-full {{ ngtStyle.compile(['color.text', 'color.bg', 'px', 'py', 'pb']) }}\">\n <div class=\"block w-full\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"block md:float-left w-full md:w-auto\">\n <ng-content select=\"[left-footer]\"></ng-content>\n </div>\n\n <div class=\"block md:float-right w-full md:w-auto\">\n <ng-content select=\"[right-footer]\"></ng-content>\n </div>\n</div>" }]
6332
6334
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: NgtStylizableDirective, decorators: [{
6333
6335
  type: Self
6334
6336
  }, {
@@ -6341,6 +6343,7 @@ class NgtPortletHeaderComponent {
6341
6343
  this.ngtStylizableDirective = ngtStylizableDirective;
6342
6344
  this.caption = '';
6343
6345
  this.icon = '';
6346
+ this.iconSize = 'text-xl';
6344
6347
  this.helperTitle = '';
6345
6348
  this.helperText = '';
6346
6349
  this.helperIconColor = '';
@@ -6354,17 +6357,17 @@ class NgtPortletHeaderComponent {
6354
6357
  h: 'h-auto',
6355
6358
  w: 'w-auto',
6356
6359
  text: 'text-xl',
6357
- fontCase: '',
6360
+ font: 'font-medium',
6358
6361
  border: 'border-b',
6359
6362
  color: {}
6360
6363
  }, ['NgtPortletStyle']);
6361
6364
  }
6362
6365
  }
6363
6366
  NgtPortletHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtPortletHeaderComponent, deps: [{ token: i0.Injector }, { token: NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
6364
- NgtPortletHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtPortletHeaderComponent, selector: "ngt-portlet-header", inputs: { caption: "caption", icon: "icon", helperTitle: "helperTitle", helperText: "helperText", helperIconColor: "helperIconColor" }, ngImport: i0, template: "<div class='leading-loose {{ ngtStyle.compile([\"h\", \"color.text\", \"color.bg\", \"border\", \"text\", \"fontCase\"]) }}'>\n <div class=\"flex flex-wrap md:flex-nowrap h-full relative px-3 md:px-8 py-2\">\n <div *ngIf=\"caption || icon\" class=\"flex md:whitespace-nowrap items-center gap-2\">\n <ngt-svg [src]=\"icon\" class=\"text-xl\" *ngIf=\"icon\"></ngt-svg>\n <div class=\"flex font-medium self-center gap-1\">\n {{ caption }}\n\n <ngt-helper *ngIf=\"helperText\" [helpTitle]=\"helperTitle\" class=\"mt-1\"\n [iconColor]=\"helperIconColor\">\n {{ helperText }}\n </ngt-helper>\n </div>\n </div>\n\n <div [hidden]='!leftHeader?.children[0]?.children?.length'\n class=\"self-center {{ ngtStyle.compile(['position', 'w']) }}\" #leftHeader>\n <ng-content select=\"[left-header]\"></ng-content>\n </div>\n\n <div [hidden]='!header?.children[0]?.children?.length'\n class=\"self-center {{ ngtStyle.compile(['position', 'w']) }}\" #header>\n <ng-content select=\"[header]\"></ng-content>\n </div>\n\n <div class=\"{{ !rightHeader?.children[0]?.children?.length ? 'hidden' : 'flex justify-end ml-auto self-center' }} {{ ngtStyle.compile(['position', 'w']) }}\"\n #rightHeader>\n <ng-content select=\"[right-header]\"></ng-content>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }] });
6367
+ NgtPortletHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtPortletHeaderComponent, selector: "ngt-portlet-header", inputs: { caption: "caption", icon: "icon", iconSize: "iconSize", helperTitle: "helperTitle", helperText: "helperText", helperIconColor: "helperIconColor" }, ngImport: i0, template: "<div [class]=\"ngtStyle.compile(['h', 'color.text', 'color.bg', 'border', 'text'])\">\n <div class=\"flex flex-wrap md:flex-nowrap h-full relative px-3 md:px-8 py-2\">\n <div *ngIf=\"caption || icon\" class=\"flex md:whitespace-nowrap items-center gap-2\">\n <ngt-svg *ngIf=\"icon\" [src]=\"icon\" [class]=\"iconSize\"></ngt-svg>\n\n <div class=\"flex self-center gap-1 {{ ngtStyle.compile(['font']) }}\">\n {{ caption }}\n\n <ngt-helper *ngIf=\"helperText\" [helpTitle]=\"helperTitle\" class=\"mt-1\" [iconColor]=\"helperIconColor\">\n {{ helperText }}\n </ngt-helper>\n </div>\n </div>\n\n <div [hidden]='!leftHeader?.children[0]?.children?.length'\n class=\"self-center {{ ngtStyle.compile(['position', 'w']) }}\" #leftHeader>\n <ng-content select=\"[left-header]\"></ng-content>\n </div>\n\n <div [hidden]='!header?.children[0]?.children?.length'\n class=\"self-center {{ ngtStyle.compile(['position', 'w']) }}\" #header>\n <ng-content select=\"[header]\"></ng-content>\n </div>\n\n <div class=\"{{ !rightHeader?.children[0]?.children?.length ? 'hidden' : 'flex justify-end ml-auto self-center' }} {{ ngtStyle.compile(['position', 'w']) }}\"\n #rightHeader>\n <ng-content select=\"[right-header]\"></ng-content>\n </div>\n </div>\n</div>", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }] });
6365
6368
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtPortletHeaderComponent, decorators: [{
6366
6369
  type: Component,
6367
- args: [{ selector: 'ngt-portlet-header', template: "<div class='leading-loose {{ ngtStyle.compile([\"h\", \"color.text\", \"color.bg\", \"border\", \"text\", \"fontCase\"]) }}'>\n <div class=\"flex flex-wrap md:flex-nowrap h-full relative px-3 md:px-8 py-2\">\n <div *ngIf=\"caption || icon\" class=\"flex md:whitespace-nowrap items-center gap-2\">\n <ngt-svg [src]=\"icon\" class=\"text-xl\" *ngIf=\"icon\"></ngt-svg>\n <div class=\"flex font-medium self-center gap-1\">\n {{ caption }}\n\n <ngt-helper *ngIf=\"helperText\" [helpTitle]=\"helperTitle\" class=\"mt-1\"\n [iconColor]=\"helperIconColor\">\n {{ helperText }}\n </ngt-helper>\n </div>\n </div>\n\n <div [hidden]='!leftHeader?.children[0]?.children?.length'\n class=\"self-center {{ ngtStyle.compile(['position', 'w']) }}\" #leftHeader>\n <ng-content select=\"[left-header]\"></ng-content>\n </div>\n\n <div [hidden]='!header?.children[0]?.children?.length'\n class=\"self-center {{ ngtStyle.compile(['position', 'w']) }}\" #header>\n <ng-content select=\"[header]\"></ng-content>\n </div>\n\n <div class=\"{{ !rightHeader?.children[0]?.children?.length ? 'hidden' : 'flex justify-end ml-auto self-center' }} {{ ngtStyle.compile(['position', 'w']) }}\"\n #rightHeader>\n <ng-content select=\"[right-header]\"></ng-content>\n </div>\n </div>\n</div>\n" }]
6370
+ args: [{ selector: 'ngt-portlet-header', template: "<div [class]=\"ngtStyle.compile(['h', 'color.text', 'color.bg', 'border', 'text'])\">\n <div class=\"flex flex-wrap md:flex-nowrap h-full relative px-3 md:px-8 py-2\">\n <div *ngIf=\"caption || icon\" class=\"flex md:whitespace-nowrap items-center gap-2\">\n <ngt-svg *ngIf=\"icon\" [src]=\"icon\" [class]=\"iconSize\"></ngt-svg>\n\n <div class=\"flex self-center gap-1 {{ ngtStyle.compile(['font']) }}\">\n {{ caption }}\n\n <ngt-helper *ngIf=\"helperText\" [helpTitle]=\"helperTitle\" class=\"mt-1\" [iconColor]=\"helperIconColor\">\n {{ helperText }}\n </ngt-helper>\n </div>\n </div>\n\n <div [hidden]='!leftHeader?.children[0]?.children?.length'\n class=\"self-center {{ ngtStyle.compile(['position', 'w']) }}\" #leftHeader>\n <ng-content select=\"[left-header]\"></ng-content>\n </div>\n\n <div [hidden]='!header?.children[0]?.children?.length'\n class=\"self-center {{ ngtStyle.compile(['position', 'w']) }}\" #header>\n <ng-content select=\"[header]\"></ng-content>\n </div>\n\n <div class=\"{{ !rightHeader?.children[0]?.children?.length ? 'hidden' : 'flex justify-end ml-auto self-center' }} {{ ngtStyle.compile(['position', 'w']) }}\"\n #rightHeader>\n <ng-content select=\"[right-header]\"></ng-content>\n </div>\n </div>\n</div>" }]
6368
6371
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: NgtStylizableDirective, decorators: [{
6369
6372
  type: Self
6370
6373
  }, {
@@ -6373,6 +6376,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
6373
6376
  type: Input
6374
6377
  }], icon: [{
6375
6378
  type: Input
6379
+ }], iconSize: [{
6380
+ type: Input
6376
6381
  }], helperTitle: [{
6377
6382
  type: Input
6378
6383
  }], helperText: [{
@@ -6406,7 +6411,7 @@ class NgtPortletComponent {
6406
6411
  }
6407
6412
  }
6408
6413
  NgtPortletComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtPortletComponent, deps: [{ token: i0.Injector }, { token: NgtStylizableDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
6409
- NgtPortletComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtPortletComponent, selector: "ngt-portlet", inputs: { caption: "caption", icon: "icon", customLayout: "customLayout", withFooter: "withFooter", withBody: "withBody", helpTitle: "helpTitle", helpText: "helpText", helpIconColor: "helpIconColor" }, ngImport: i0, template: "<section class='flex'>\n <div class=\"w-full {{ ngtStyle.compile(['h', 'color.bg', 'color.text', 'p', 'px', 'py', 'pl', 'pr', 'pt', 'pb', 'm', 'mx', 'my', 'ml', 'mr', 'mt', 'mb', 'shadow']) }}\"\n @fadeUp>\n <!--Header-->\n <div *ngIf=\"!customLayout\">\n <ngt-portlet-header [icon]='icon' [caption]='caption' [helperText]=\"helpText\" [helperTitle]=\"helpTitle\"\n [helperIconColor]=\"helpIconColor\">\n <div right-header>\n <ng-content select='[right-header]'></ng-content>\n </div>\n <div left-header>\n <ng-content select='[left-header]'></ng-content>\n </div>\n <div header>\n <ng-content select='[header]'></ng-content>\n </div>\n </ngt-portlet-header>\n </div>\n\n <!--Body-->\n <ng-container *ngIf=\"!customLayout && withBody\">\n <ngt-portlet-body>\n <ng-content select='[body]'></ng-content>\n </ngt-portlet-body>\n </ng-container>\n\n <!--Footer-->\n <ng-container *ngIf=\"!customLayout && withFooter\">\n <ngt-portlet-footer>\n <div right-footer>\n <ng-content select='[right-footer]'></ng-content>\n </div>\n <div left-footer>\n <ng-content select='[left-footer]'></ng-content>\n </div>\n <div footer>\n <ng-content select='[footer]'></ng-content>\n </div>\n </ngt-portlet-footer>\n </ng-container>\n\n <ng-content></ng-content>\n </div>\n</section>", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NgtPortletHeaderComponent, selector: "ngt-portlet-header", inputs: ["caption", "icon", "helperTitle", "helperText", "helperIconColor"] }, { kind: "component", type: NgtPortletBodyComponent, selector: "ngt-portlet-body" }, { kind: "component", type: NgtPortletFooterComponent, selector: "ngt-portlet-footer" }], animations: [
6414
+ NgtPortletComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtPortletComponent, selector: "ngt-portlet", inputs: { caption: "caption", icon: "icon", customLayout: "customLayout", withFooter: "withFooter", withBody: "withBody", helpTitle: "helpTitle", helpText: "helpText", helpIconColor: "helpIconColor" }, ngImport: i0, template: "<div class=\"w-full {{ ngtStyle.compile(['h', 'color.bg', 'color.text', 'p', 'px', 'py', 'pl', 'pr', 'pt', 'pb', 'm', 'mx', 'my', 'ml', 'mr', 'mt', 'mb', 'shadow']) }}\"\n @fadeUp>\n <div *ngIf=\"!customLayout\">\n <ngt-portlet-header [icon]='icon' [caption]='caption' [helperText]=\"helpText\" [helperTitle]=\"helpTitle\"\n [helperIconColor]=\"helpIconColor\">\n <div right-header>\n <ng-content select='[right-header]'></ng-content>\n </div>\n\n <div left-header>\n <ng-content select='[left-header]'></ng-content>\n </div>\n\n <div header>\n <ng-content select='[header]'></ng-content>\n </div>\n </ngt-portlet-header>\n </div>\n\n <ng-container *ngIf=\"!customLayout && withBody\">\n <ngt-portlet-body>\n <ng-content select='[body]'></ng-content>\n </ngt-portlet-body>\n </ng-container>\n\n <ng-container *ngIf=\"!customLayout && withFooter\">\n <ngt-portlet-footer>\n <div right-footer>\n <ng-content select='[right-footer]'></ng-content>\n </div>\n\n <div left-footer>\n <ng-content select='[left-footer]'></ng-content>\n </div>\n\n <div footer>\n <ng-content select='[footer]'></ng-content>\n </div>\n </ngt-portlet-footer>\n </ng-container>\n\n <ng-content></ng-content>\n</div>", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NgtPortletHeaderComponent, selector: "ngt-portlet-header", inputs: ["caption", "icon", "iconSize", "helperTitle", "helperText", "helperIconColor"] }, { kind: "component", type: NgtPortletBodyComponent, selector: "ngt-portlet-body" }, { kind: "component", type: NgtPortletFooterComponent, selector: "ngt-portlet-footer" }], animations: [
6410
6415
  trigger('fadeUp', [
6411
6416
  state('void', style({ transform: 'translateY(20px)', opacity: 0 })),
6412
6417
  transition(':enter', [
@@ -6423,7 +6428,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
6423
6428
  animate(500)
6424
6429
  ])
6425
6430
  ])
6426
- ], template: "<section class='flex'>\n <div class=\"w-full {{ ngtStyle.compile(['h', 'color.bg', 'color.text', 'p', 'px', 'py', 'pl', 'pr', 'pt', 'pb', 'm', 'mx', 'my', 'ml', 'mr', 'mt', 'mb', 'shadow']) }}\"\n @fadeUp>\n <!--Header-->\n <div *ngIf=\"!customLayout\">\n <ngt-portlet-header [icon]='icon' [caption]='caption' [helperText]=\"helpText\" [helperTitle]=\"helpTitle\"\n [helperIconColor]=\"helpIconColor\">\n <div right-header>\n <ng-content select='[right-header]'></ng-content>\n </div>\n <div left-header>\n <ng-content select='[left-header]'></ng-content>\n </div>\n <div header>\n <ng-content select='[header]'></ng-content>\n </div>\n </ngt-portlet-header>\n </div>\n\n <!--Body-->\n <ng-container *ngIf=\"!customLayout && withBody\">\n <ngt-portlet-body>\n <ng-content select='[body]'></ng-content>\n </ngt-portlet-body>\n </ng-container>\n\n <!--Footer-->\n <ng-container *ngIf=\"!customLayout && withFooter\">\n <ngt-portlet-footer>\n <div right-footer>\n <ng-content select='[right-footer]'></ng-content>\n </div>\n <div left-footer>\n <ng-content select='[left-footer]'></ng-content>\n </div>\n <div footer>\n <ng-content select='[footer]'></ng-content>\n </div>\n </ngt-portlet-footer>\n </ng-container>\n\n <ng-content></ng-content>\n </div>\n</section>" }]
6431
+ ], template: "<div class=\"w-full {{ ngtStyle.compile(['h', 'color.bg', 'color.text', 'p', 'px', 'py', 'pl', 'pr', 'pt', 'pb', 'm', 'mx', 'my', 'ml', 'mr', 'mt', 'mb', 'shadow']) }}\"\n @fadeUp>\n <div *ngIf=\"!customLayout\">\n <ngt-portlet-header [icon]='icon' [caption]='caption' [helperText]=\"helpText\" [helperTitle]=\"helpTitle\"\n [helperIconColor]=\"helpIconColor\">\n <div right-header>\n <ng-content select='[right-header]'></ng-content>\n </div>\n\n <div left-header>\n <ng-content select='[left-header]'></ng-content>\n </div>\n\n <div header>\n <ng-content select='[header]'></ng-content>\n </div>\n </ngt-portlet-header>\n </div>\n\n <ng-container *ngIf=\"!customLayout && withBody\">\n <ngt-portlet-body>\n <ng-content select='[body]'></ng-content>\n </ngt-portlet-body>\n </ng-container>\n\n <ng-container *ngIf=\"!customLayout && withFooter\">\n <ngt-portlet-footer>\n <div right-footer>\n <ng-content select='[right-footer]'></ng-content>\n </div>\n\n <div left-footer>\n <ng-content select='[left-footer]'></ng-content>\n </div>\n\n <div footer>\n <ng-content select='[footer]'></ng-content>\n </div>\n </ngt-portlet-footer>\n </ng-container>\n\n <ng-content></ng-content>\n</div>" }]
6427
6432
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: NgtStylizableDirective, decorators: [{
6428
6433
  type: Self
6429
6434
  }, {