@libs-ui/components-inputs-input 0.2.312-0 → 0.2.312-2

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.
Files changed (3) hide show
  1. package/esm2022/input.component.mjs +3 -3
  2. package/fesm2022/libs-ui-components-inputs-input.mjs +3 -3
  3. package/package.json +6 -6
package/esm2022/input.component.mjs CHANGED
@@ -822,10 +822,10 @@ export class LibsUiComponentsInputsInputComponent {
822
822
  this.onDestroy.next();
823
823
  this.onDestroy.complete();
824
824
  }
825
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsInputsInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
826
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsInputsInputComponent, isStandalone: true, selector: "libs_ui-components-inputs-input", inputs: { tagInput: { classPropertyName: "tagInput", publicName: "tagInput", isSignal: true, isRequired: false, transformFunction: null }, dataType: { classPropertyName: "dataType", publicName: "dataType", isSignal: true, isRequired: false, transformFunction: null }, typeInput: { classPropertyName: "typeInput", publicName: "typeInput", isSignal: true, isRequired: false, transformFunction: null }, modeInput: { classPropertyName: "modeInput", publicName: "modeInput", isSignal: true, isRequired: false, transformFunction: null }, tabInsertContentTagInput: { classPropertyName: "tabInsertContentTagInput", publicName: "tabInsertContentTagInput", isSignal: true, isRequired: false, transformFunction: null }, textAreaEnterNotNewLine: { classPropertyName: "textAreaEnterNotNewLine", publicName: "textAreaEnterNotNewLine", isSignal: true, isRequired: false, transformFunction: null }, emitEmptyInDataTypeNumber: { classPropertyName: "emitEmptyInDataTypeNumber", publicName: "emitEmptyInDataTypeNumber", isSignal: true, isRequired: false, transformFunction: null }, keepZeroInTypeInt: { classPropertyName: "keepZeroInTypeInt", publicName: "keepZeroInTypeInt", isSignal: true, isRequired: false, transformFunction: null }, autoAddZeroLessThan10InTypeInt: { classPropertyName: "autoAddZeroLessThan10InTypeInt", publicName: "autoAddZeroLessThan10InTypeInt", isSignal: true, isRequired: false, transformFunction: null }, ignoreBlockInputMaxValue: { classPropertyName: "ignoreBlockInputMaxValue", publicName: "ignoreBlockInputMaxValue", isSignal: true, isRequired: false, transformFunction: null }, maxValueNumber: { classPropertyName: "maxValueNumber", publicName: "maxValueNumber", isSignal: true, isRequired: false, transformFunction: null }, minValueNumber: { classPropertyName: "minValueNumber", publicName: "minValueNumber", isSignal: true, isRequired: false, transformFunction: null }, fixedFloat: { classPropertyName: "fixedFloat", publicName: "fixedFloat", isSignal: true, isRequired: false, transformFunction: null }, acceptNegativeValue: { classPropertyName: "acceptNegativeValue", publicName: "acceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, valueUpDownNumber: { classPropertyName: "valueUpDownNumber", publicName: "valueUpDownNumber", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, noBorder: { classPropertyName: "noBorder", publicName: "noBorder", isSignal: true, isRequired: false, transformFunction: null }, backgroundNone: { classPropertyName: "backgroundNone", publicName: "backgroundNone", isSignal: true, isRequired: false, transformFunction: null }, borderError: { classPropertyName: "borderError", publicName: "borderError", isSignal: true, isRequired: false, transformFunction: null }, useColorModeExist: { classPropertyName: "useColorModeExist", publicName: "useColorModeExist", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, keepPlaceholderOnly: { classPropertyName: "keepPlaceholderOnly", publicName: "keepPlaceholderOnly", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, autoRemoveEmoji: { classPropertyName: "autoRemoveEmoji", publicName: "autoRemoveEmoji", isSignal: true, isRequired: false, transformFunction: null }, defaultHeight: { classPropertyName: "defaultHeight", publicName: "defaultHeight", isSignal: true, isRequired: false, transformFunction: null }, minHeightTextArea: { classPropertyName: "minHeightTextArea", publicName: "minHeightTextArea", isSignal: true, isRequired: false, transformFunction: null }, maxHeightTextArea: { classPropertyName: "maxHeightTextArea", publicName: "maxHeightTextArea", isSignal: true, isRequired: false, transformFunction: null }, focusTimeOut: { classPropertyName: "focusTimeOut", publicName: "focusTimeOut", isSignal: true, isRequired: false, transformFunction: null }, selectAllTimeOut: { classPropertyName: "selectAllTimeOut", publicName: "selectAllTimeOut", isSignal: true, isRequired: false, transformFunction: null }, blurTimeOut: { classPropertyName: "blurTimeOut", publicName: "blurTimeOut", isSignal: true, isRequired: false, transformFunction: null }, zIndexPopoverContent: { classPropertyName: "zIndexPopoverContent", publicName: "zIndexPopoverContent", isSignal: true, isRequired: false, transformFunction: null }, classContainerInput: { classPropertyName: "classContainerInput", publicName: "classContainerInput", isSignal: true, isRequired: false, transformFunction: null }, showCount: { classPropertyName: "showCount", publicName: "showCount", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, templateLeftBottomInput: { classPropertyName: "templateLeftBottomInput", publicName: "templateLeftBottomInput", isSignal: true, isRequired: false, transformFunction: null }, templateRightBottomInput: { classPropertyName: "templateRightBottomInput", publicName: "templateRightBottomInput", isSignal: true, isRequired: false, transformFunction: null }, classContainerBottomInput: { classPropertyName: "classContainerBottomInput", publicName: "classContainerBottomInput", isSignal: true, isRequired: false, transformFunction: null }, ignoreWidthInput100: { classPropertyName: "ignoreWidthInput100", publicName: "ignoreWidthInput100", isSignal: true, isRequired: false, transformFunction: null }, iframeTextareaCustomStyle: { classPropertyName: "iframeTextareaCustomStyle", publicName: "iframeTextareaCustomStyle", isSignal: true, isRequired: false, transformFunction: null }, iconLeftClass: { classPropertyName: "iconLeftClass", publicName: "iconLeftClass", isSignal: true, isRequired: false, transformFunction: null }, popoverContentIconLeft: { classPropertyName: "popoverContentIconLeft", publicName: "popoverContentIconLeft", isSignal: true, isRequired: false, transformFunction: null }, iconRightClass: { classPropertyName: "iconRightClass", publicName: "iconRightClass", isSignal: true, isRequired: false, transformFunction: null }, popoverContentIconRight: { classPropertyName: "popoverContentIconRight", publicName: "popoverContentIconRight", isSignal: true, isRequired: false, transformFunction: null }, resetAutoCompletePassword: { classPropertyName: "resetAutoCompletePassword", publicName: "resetAutoCompletePassword", isSignal: true, isRequired: false, transformFunction: null }, acceptOnlyClickIcon: { classPropertyName: "acceptOnlyClickIcon", publicName: "acceptOnlyClickIcon", isSignal: true, isRequired: false, transformFunction: null }, setIconRightColorSameColorDisableReadOnly: { classPropertyName: "setIconRightColorSameColorDisableReadOnly", publicName: "setIconRightColorSameColorDisableReadOnly", isSignal: true, isRequired: false, transformFunction: null }, onlyAcceptNegativeValue: { classPropertyName: "onlyAcceptNegativeValue", publicName: "onlyAcceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, maxLengthNumberCount: { classPropertyName: "maxLengthNumberCount", publicName: "maxLengthNumberCount", isSignal: true, isRequired: false, transformFunction: null }, focusInput: { classPropertyName: "focusInput", publicName: "focusInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { maxValueNumber: "maxValueNumberChange", minValueNumber: "minValueNumberChange", fixedFloat: "fixedFloatChange", acceptNegativeValue: "acceptNegativeValueChange", maxLength: "maxLengthChange", value: "valueChange", maxLengthNumberCount: "maxLengthNumberCountChange", outHeightAreaChange: "outHeightAreaChange", outChange: "outChange", outFocusAndBlurEvent: "outFocusAndBlurEvent", outEnterEvent: "outEnterEvent", outInputEvent: "outInputEvent", outIconLeft: "outIconLeft", outIconRight: "outIconRight", outFunctionsControl: "outFunctionsControl", outFilesDrop: "outFilesDrop", outFileDrop: "outFileDrop", outChangeValueByButtonUpDown: "outChangeValueByButtonUpDown" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true, isSignal: true }, { propertyName: "textCountRef", first: true, predicate: ["textCountRef"], descendants: true, isSignal: true }, { propertyName: "elementRightRef", first: true, predicate: ["elementRightRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n [class]=\"'flex relative !text-[#9ca2ad] ' + classContainerInput()\"\n [class.libs-ui-components-input-textarea-container]=\"tagInput() === 'textarea' && resize() === 'auto'\">\n @if (tagInput() === 'input') {\n <input\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r ' + classInclude()\"\n [class.border-primary-focus-general]=\"focusInput()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.!pl-[40px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [attr.type]=\"typeInput()\"\n [attr.inputmode]=\"modeInput()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"\n [autocomplete]=\"resetAutoCompletePassword() ? 'new-password' : ''\" />\n }\n @if (tagInput() === 'textarea') {\n @if (resize() === 'auto') {\n <div class=\"libs-ui-components-input-textarea-container-resize-icon\"></div>\n }\n <textarea\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"minHeightTextArea() ?? defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.resize]=\"resize()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r libs-ui-cursor-auto ' + classInclude()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.pl-[32px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"></textarea>\n }\n\n @if (tagInput() === 'iframe-textarea' && htmlIframeArea()) {\n <span class=\"d-none\"></span>\n <iframe\n #iframeRef\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.height.px]=\"defaultHeight()\"\n [srcdoc]=\"htmlIframeArea()\"\n class=\"w-full\"\n frameBorder=\"0\"\n (load)=\"handlerOnLoad($event, iframeRef)\"></iframe>\n }\n @if (iconLeftClass()) {\n <libs_ui-components-popover\n [ignoreShowPopover]=\"!popoverContentIconLeft()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconLeft(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class]=\"iconLeftClass() + ' libs-ui-input-icon-left !text-[#9ca2ad]'\"\n (click)=\"handlerEventIconLeft($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n <div\n #elementRightRef\n class=\"absolute flex items-center h-full top-0 right-0\">\n @if (value() && placeholder().trim() && keepPlaceholderOnly()) {\n <span [class]=\"'libs-ui-input-placeholder-custom libs-ui-font-h5r'\">\n {{ placeholder() }}\n </span>\n }\n @if (dataType() !== 'string' && valueUpDownNumber()) {\n <libs_ui-components-buttons-sort\n class=\"mr-[12px]\"\n [disableAsc]=\"disableAsc()\"\n [disableDesc]=\"disableDesc()\"\n [attr.tagInput]=\"tagInput()\"\n [onlyEmit]=\"true\"\n [disable]=\"disable() || readonly()\"\n (outChange)=\"handlerChangeValue($event)\" />\n }\n @if (iconRightClass()) {\n <libs_ui-components-popover\n class=\"flex\"\n [ignoreShowPopover]=\"!popoverContentIconRight()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconRight(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class.text-[#6a7383]]=\"(!disable() && !readonly()) || acceptOnlyClickIcon()\"\n [class.text-[#cdd0d6]]=\"((disable() || readonly()) && !acceptOnlyClickIcon()) || setIconRightColorSameColorDisableReadOnly()\"\n [class]=\"iconRightClass() + ' libs-ui-input-icon-right'\"\n (click)=\"handlerEventIconRight($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n </div>\n <div\n class=\"libs-ui-input-text-bottom {{ classContainerBottomInput() }}\"\n [style.right.px]=\"(tagInput() === 'input' ? elementRightRef.clientWidth || 0 : 0) + 8\">\n @if (templateLeftBottomInput(); as templateLeftBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateLeftBottomInput\" />\n }\n <div\n #textCountRef\n class=\"text-[#9ca2ad] libs-ui-font-h7r\"\n [class.hidden]=\"dataType() !== 'string' || !showCount()\">\n <span>{{ countDisplay() }}</span>\n @if (maxLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n </div>\n @if (templateRightBottomInput(); as templateRightBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateRightBottomInput\" />\n }\n </div>\n</div>\n", styles: [".libs-ui-input{max-width:100%;border-radius:none;color:#071631;padding:7px 12px;background-color:#fff;background-clip:padding-box;min-height:32px}.libs-ui-input:not(.libs-ui-input-not-border){border:1px solid #e6e7ea;border-radius:4px}.libs-ui-input:focus{outline:none}.libs-ui-input:focus:not(:read-only):not(:disabled):not(.libs-ui-input-not-border){border:1px solid var(--libs-ui-color-light-1, #4e8cf7)}.libs-ui-input .libs-ui-input-valid-check{position:absolute;left:-27px}.libs-ui-input-not-border{border:transparent}libs-ui-components-button-sort{position:absolute;right:12px;top:0}libs-ui-components-button-sort[tagInput=textarea]{top:-10px}.libs-ui-input-icon-left{position:absolute;top:8px;left:16px;font-size:16px}.libs-ui-input-icon-right{font-size:16px;margin-right:8px}.libs-ui-input-text-bottom{display:flex;align-items:center;position:absolute;bottom:8px}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-credentials-auto-fill-button{margin-right:8px!important}textarea::-webkit-resizer{border:transparent;outline:none}.libs-ui-components-input-textarea-container:after{content:\"\";border-top:1.5px solid #9ca2ad;width:15px;transform:rotate(-45deg);background:transparent;position:absolute;right:0;bottom:8px;pointer-events:none;border-radius:25%}.libs-ui-components-input-textarea-container .libs-ui-components-input-textarea-container-resize-icon{border-top:1.5px solid #9ca2ad;width:7px;transform:rotate(-45deg);position:absolute;bottom:5px;right:1px;pointer-events:none;border-radius:25%}.libs-ui-input-placeholder-custom{color:#6a7378;margin-right:16px;background:inherit}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsButtonsSortComponent, selector: "libs_ui-components-buttons-sort", inputs: ["size", "mode", "fieldSort", "disable", "disableAsc", "disableDesc", "onlyEmit"], outputs: ["modeChange", "outChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
825
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
826
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsInputsInputComponent, isStandalone: true, selector: "libs_ui-components-inputs-input", inputs: { tagInput: { classPropertyName: "tagInput", publicName: "tagInput", isSignal: true, isRequired: false, transformFunction: null }, dataType: { classPropertyName: "dataType", publicName: "dataType", isSignal: true, isRequired: false, transformFunction: null }, typeInput: { classPropertyName: "typeInput", publicName: "typeInput", isSignal: true, isRequired: false, transformFunction: null }, modeInput: { classPropertyName: "modeInput", publicName: "modeInput", isSignal: true, isRequired: false, transformFunction: null }, tabInsertContentTagInput: { classPropertyName: "tabInsertContentTagInput", publicName: "tabInsertContentTagInput", isSignal: true, isRequired: false, transformFunction: null }, textAreaEnterNotNewLine: { classPropertyName: "textAreaEnterNotNewLine", publicName: "textAreaEnterNotNewLine", isSignal: true, isRequired: false, transformFunction: null }, emitEmptyInDataTypeNumber: { classPropertyName: "emitEmptyInDataTypeNumber", publicName: "emitEmptyInDataTypeNumber", isSignal: true, isRequired: false, transformFunction: null }, keepZeroInTypeInt: { classPropertyName: "keepZeroInTypeInt", publicName: "keepZeroInTypeInt", isSignal: true, isRequired: false, transformFunction: null }, autoAddZeroLessThan10InTypeInt: { classPropertyName: "autoAddZeroLessThan10InTypeInt", publicName: "autoAddZeroLessThan10InTypeInt", isSignal: true, isRequired: false, transformFunction: null }, ignoreBlockInputMaxValue: { classPropertyName: "ignoreBlockInputMaxValue", publicName: "ignoreBlockInputMaxValue", isSignal: true, isRequired: false, transformFunction: null }, maxValueNumber: { classPropertyName: "maxValueNumber", publicName: "maxValueNumber", isSignal: true, isRequired: false, transformFunction: null }, minValueNumber: { classPropertyName: "minValueNumber", publicName: "minValueNumber", isSignal: true, isRequired: false, transformFunction: null }, fixedFloat: { classPropertyName: "fixedFloat", publicName: "fixedFloat", isSignal: true, isRequired: false, transformFunction: null }, acceptNegativeValue: { classPropertyName: "acceptNegativeValue", publicName: "acceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, valueUpDownNumber: { classPropertyName: "valueUpDownNumber", publicName: "valueUpDownNumber", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, noBorder: { classPropertyName: "noBorder", publicName: "noBorder", isSignal: true, isRequired: false, transformFunction: null }, backgroundNone: { classPropertyName: "backgroundNone", publicName: "backgroundNone", isSignal: true, isRequired: false, transformFunction: null }, borderError: { classPropertyName: "borderError", publicName: "borderError", isSignal: true, isRequired: false, transformFunction: null }, useColorModeExist: { classPropertyName: "useColorModeExist", publicName: "useColorModeExist", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, keepPlaceholderOnly: { classPropertyName: "keepPlaceholderOnly", publicName: "keepPlaceholderOnly", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, autoRemoveEmoji: { classPropertyName: "autoRemoveEmoji", publicName: "autoRemoveEmoji", isSignal: true, isRequired: false, transformFunction: null }, defaultHeight: { classPropertyName: "defaultHeight", publicName: "defaultHeight", isSignal: true, isRequired: false, transformFunction: null }, minHeightTextArea: { classPropertyName: "minHeightTextArea", publicName: "minHeightTextArea", isSignal: true, isRequired: false, transformFunction: null }, maxHeightTextArea: { classPropertyName: "maxHeightTextArea", publicName: "maxHeightTextArea", isSignal: true, isRequired: false, transformFunction: null }, focusTimeOut: { classPropertyName: "focusTimeOut", publicName: "focusTimeOut", isSignal: true, isRequired: false, transformFunction: null }, selectAllTimeOut: { classPropertyName: "selectAllTimeOut", publicName: "selectAllTimeOut", isSignal: true, isRequired: false, transformFunction: null }, blurTimeOut: { classPropertyName: "blurTimeOut", publicName: "blurTimeOut", isSignal: true, isRequired: false, transformFunction: null }, zIndexPopoverContent: { classPropertyName: "zIndexPopoverContent", publicName: "zIndexPopoverContent", isSignal: true, isRequired: false, transformFunction: null }, classContainerInput: { classPropertyName: "classContainerInput", publicName: "classContainerInput", isSignal: true, isRequired: false, transformFunction: null }, showCount: { classPropertyName: "showCount", publicName: "showCount", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, templateLeftBottomInput: { classPropertyName: "templateLeftBottomInput", publicName: "templateLeftBottomInput", isSignal: true, isRequired: false, transformFunction: null }, templateRightBottomInput: { classPropertyName: "templateRightBottomInput", publicName: "templateRightBottomInput", isSignal: true, isRequired: false, transformFunction: null }, classContainerBottomInput: { classPropertyName: "classContainerBottomInput", publicName: "classContainerBottomInput", isSignal: true, isRequired: false, transformFunction: null }, ignoreWidthInput100: { classPropertyName: "ignoreWidthInput100", publicName: "ignoreWidthInput100", isSignal: true, isRequired: false, transformFunction: null }, iframeTextareaCustomStyle: { classPropertyName: "iframeTextareaCustomStyle", publicName: "iframeTextareaCustomStyle", isSignal: true, isRequired: false, transformFunction: null }, iconLeftClass: { classPropertyName: "iconLeftClass", publicName: "iconLeftClass", isSignal: true, isRequired: false, transformFunction: null }, popoverContentIconLeft: { classPropertyName: "popoverContentIconLeft", publicName: "popoverContentIconLeft", isSignal: true, isRequired: false, transformFunction: null }, iconRightClass: { classPropertyName: "iconRightClass", publicName: "iconRightClass", isSignal: true, isRequired: false, transformFunction: null }, popoverContentIconRight: { classPropertyName: "popoverContentIconRight", publicName: "popoverContentIconRight", isSignal: true, isRequired: false, transformFunction: null }, resetAutoCompletePassword: { classPropertyName: "resetAutoCompletePassword", publicName: "resetAutoCompletePassword", isSignal: true, isRequired: false, transformFunction: null }, acceptOnlyClickIcon: { classPropertyName: "acceptOnlyClickIcon", publicName: "acceptOnlyClickIcon", isSignal: true, isRequired: false, transformFunction: null }, setIconRightColorSameColorDisableReadOnly: { classPropertyName: "setIconRightColorSameColorDisableReadOnly", publicName: "setIconRightColorSameColorDisableReadOnly", isSignal: true, isRequired: false, transformFunction: null }, onlyAcceptNegativeValue: { classPropertyName: "onlyAcceptNegativeValue", publicName: "onlyAcceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, maxLengthNumberCount: { classPropertyName: "maxLengthNumberCount", publicName: "maxLengthNumberCount", isSignal: true, isRequired: false, transformFunction: null }, focusInput: { classPropertyName: "focusInput", publicName: "focusInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { maxValueNumber: "maxValueNumberChange", minValueNumber: "minValueNumberChange", fixedFloat: "fixedFloatChange", acceptNegativeValue: "acceptNegativeValueChange", maxLength: "maxLengthChange", value: "valueChange", maxLengthNumberCount: "maxLengthNumberCountChange", outHeightAreaChange: "outHeightAreaChange", outChange: "outChange", outFocusAndBlurEvent: "outFocusAndBlurEvent", outEnterEvent: "outEnterEvent", outInputEvent: "outInputEvent", outIconLeft: "outIconLeft", outIconRight: "outIconRight", outFunctionsControl: "outFunctionsControl", outFilesDrop: "outFilesDrop", outFileDrop: "outFileDrop", outChangeValueByButtonUpDown: "outChangeValueByButtonUpDown" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true, isSignal: true }, { propertyName: "textCountRef", first: true, predicate: ["textCountRef"], descendants: true, isSignal: true }, { propertyName: "elementRightRef", first: true, predicate: ["elementRightRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n [class]=\"'flex relative !text-[#9ca2ad] ' + classContainerInput()\"\n [class.libs-ui-components-input-textarea-container]=\"tagInput() === 'textarea' && resize() === 'auto'\">\n @if (tagInput() === 'input') {\n <input\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r ' + classInclude()\"\n [class.border-primary-focus-general]=\"focusInput()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.!pl-[40px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [attr.type]=\"typeInput()\"\n [attr.inputmode]=\"modeInput()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"\n [autocomplete]=\"resetAutoCompletePassword() ? 'new-password' : ''\" />\n }\n @if (tagInput() === 'textarea') {\n @if (resize() === 'auto') {\n <div class=\"libs-ui-components-input-textarea-container-resize-icon\"></div>\n }\n <textarea\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"minHeightTextArea() ?? defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.resize]=\"resize()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r libs-ui-cursor-auto ' + classInclude()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.pl-[32px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"></textarea>\n }\n\n @if (tagInput() === 'iframe-textarea' && htmlIframeArea()) {\n <span class=\"d-none\"></span>\n <iframe\n #iframeRef\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.height.px]=\"defaultHeight()\"\n [srcdoc]=\"htmlIframeArea()\"\n class=\"w-full\"\n frameBorder=\"0\"\n (load)=\"handlerOnLoad($event, iframeRef)\"></iframe>\n }\n @if (iconLeftClass()) {\n <libs_ui-components-popover\n [ignoreShowPopover]=\"!popoverContentIconLeft()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconLeft(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class]=\"iconLeftClass() + ' libs-ui-input-icon-left !text-[#9ca2ad]'\"\n (click)=\"handlerEventIconLeft($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n <div\n #elementRightRef\n class=\"absolute flex items-center h-full top-0 right-0\">\n @if (value() && placeholder().trim() && keepPlaceholderOnly()) {\n <span [class]=\"'libs-ui-input-placeholder-custom libs-ui-font-h5r'\">\n {{ placeholder() }}\n </span>\n }\n @if (dataType() !== 'string' && valueUpDownNumber()) {\n <libs_ui-components-buttons-sort\n class=\"mr-[12px]\"\n [disableAsc]=\"disableAsc()\"\n [disableDesc]=\"disableDesc()\"\n [attr.tagInput]=\"tagInput()\"\n [onlyEmit]=\"true\"\n [disable]=\"disable() || readonly()\"\n (outChange)=\"handlerChangeValue($event)\" />\n }\n @if (iconRightClass()) {\n <libs_ui-components-popover\n class=\"flex\"\n [ignoreShowPopover]=\"!popoverContentIconRight()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconRight(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class.text-[#6a7383]]=\"(!disable() && !readonly()) || acceptOnlyClickIcon()\"\n [class.text-[#cdd0d6]]=\"((disable() || readonly()) && !acceptOnlyClickIcon()) || setIconRightColorSameColorDisableReadOnly()\"\n [class]=\"iconRightClass() + ' libs-ui-input-icon-right'\"\n (click)=\"handlerEventIconRight($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n </div>\n <div\n class=\"libs-ui-input-text-bottom {{ classContainerBottomInput() }}\"\n [style.right.px]=\"(tagInput() === 'input' ? elementRightRef.clientWidth || 0 : 0) + 8\">\n @if (templateLeftBottomInput(); as templateLeftBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateLeftBottomInput\" />\n }\n <div\n #textCountRef\n class=\"text-[#9ca2ad] libs-ui-font-h7r\"\n [class.hidden]=\"dataType() !== 'string' || !showCount()\">\n <span>{{ countDisplay() }}</span>\n @if (maxLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n </div>\n @if (templateRightBottomInput(); as templateRightBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateRightBottomInput\" />\n }\n </div>\n</div>\n", styles: [".libs-ui-input{max-width:100%;border-radius:none;color:#071631;padding:7px 12px;background-color:#fff;background-clip:padding-box;min-height:32px}.libs-ui-input:not(.libs-ui-input-not-border){border:1px solid #e6e7ea;border-radius:4px}.libs-ui-input:focus{outline:none}.libs-ui-input:focus:not(:read-only):not(:disabled):not(.libs-ui-input-not-border){border:1px solid var(--libs-ui-color-light-1, #4e8cf7)}.libs-ui-input .libs-ui-input-valid-check{position:absolute;left:-27px}.libs-ui-input-not-border{border:transparent}libs-ui-components-button-sort{position:absolute;right:12px;top:0}libs-ui-components-button-sort[tagInput=textarea]{top:-10px}.libs-ui-input-icon-left{position:absolute;top:8px;left:16px;font-size:16px}.libs-ui-input-icon-right{font-size:16px;margin-right:8px}.libs-ui-input-text-bottom{display:flex;align-items:center;position:absolute;bottom:8px}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-credentials-auto-fill-button{margin-right:8px!important}textarea::-webkit-resizer{border:transparent;outline:none}.libs-ui-components-input-textarea-container:after{content:\"\";border-top:1.5px solid #9ca2ad;width:15px;transform:rotate(-45deg);background:transparent;position:absolute;right:0;bottom:8px;pointer-events:none;border-radius:25%}.libs-ui-components-input-textarea-container .libs-ui-components-input-textarea-container-resize-icon{border-top:1.5px solid #9ca2ad;width:7px;transform:rotate(-45deg);position:absolute;bottom:5px;right:1px;pointer-events:none;border-radius:25%}.libs-ui-input-placeholder-custom{color:#6a7378;margin-right:16px;background:inherit}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsButtonsSortComponent, selector: "libs_ui-components-buttons-sort", inputs: ["size", "mode", "fieldSort", "disable", "disableAsc", "disableDesc", "onlyEmit"], outputs: ["modeChange", "outChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
827
827
  }
828
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsInputsInputComponent, decorators: [{
828
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsInputComponent, decorators: [{
829
829
  type: Component,
830
830
  args: [{ selector: 'libs_ui-components-inputs-input', standalone: true, imports: [TranslateModule, NgTemplateOutlet, LibsUiComponentsPopoverComponent, LibsUiComponentsButtonsSortComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [class]=\"'flex relative !text-[#9ca2ad] ' + classContainerInput()\"\n [class.libs-ui-components-input-textarea-container]=\"tagInput() === 'textarea' && resize() === 'auto'\">\n @if (tagInput() === 'input') {\n <input\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r ' + classInclude()\"\n [class.border-primary-focus-general]=\"focusInput()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.!pl-[40px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [attr.type]=\"typeInput()\"\n [attr.inputmode]=\"modeInput()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"\n [autocomplete]=\"resetAutoCompletePassword() ? 'new-password' : ''\" />\n }\n @if (tagInput() === 'textarea') {\n @if (resize() === 'auto') {\n <div class=\"libs-ui-components-input-textarea-container-resize-icon\"></div>\n }\n <textarea\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"minHeightTextArea() ?? defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.resize]=\"resize()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r libs-ui-cursor-auto ' + classInclude()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.pl-[32px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"></textarea>\n }\n\n @if (tagInput() === 'iframe-textarea' && htmlIframeArea()) {\n <span class=\"d-none\"></span>\n <iframe\n #iframeRef\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.height.px]=\"defaultHeight()\"\n [srcdoc]=\"htmlIframeArea()\"\n class=\"w-full\"\n frameBorder=\"0\"\n (load)=\"handlerOnLoad($event, iframeRef)\"></iframe>\n }\n @if (iconLeftClass()) {\n <libs_ui-components-popover\n [ignoreShowPopover]=\"!popoverContentIconLeft()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconLeft(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class]=\"iconLeftClass() + ' libs-ui-input-icon-left !text-[#9ca2ad]'\"\n (click)=\"handlerEventIconLeft($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n <div\n #elementRightRef\n class=\"absolute flex items-center h-full top-0 right-0\">\n @if (value() && placeholder().trim() && keepPlaceholderOnly()) {\n <span [class]=\"'libs-ui-input-placeholder-custom libs-ui-font-h5r'\">\n {{ placeholder() }}\n </span>\n }\n @if (dataType() !== 'string' && valueUpDownNumber()) {\n <libs_ui-components-buttons-sort\n class=\"mr-[12px]\"\n [disableAsc]=\"disableAsc()\"\n [disableDesc]=\"disableDesc()\"\n [attr.tagInput]=\"tagInput()\"\n [onlyEmit]=\"true\"\n [disable]=\"disable() || readonly()\"\n (outChange)=\"handlerChangeValue($event)\" />\n }\n @if (iconRightClass()) {\n <libs_ui-components-popover\n class=\"flex\"\n [ignoreShowPopover]=\"!popoverContentIconRight()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconRight(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class.text-[#6a7383]]=\"(!disable() && !readonly()) || acceptOnlyClickIcon()\"\n [class.text-[#cdd0d6]]=\"((disable() || readonly()) && !acceptOnlyClickIcon()) || setIconRightColorSameColorDisableReadOnly()\"\n [class]=\"iconRightClass() + ' libs-ui-input-icon-right'\"\n (click)=\"handlerEventIconRight($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n </div>\n <div\n class=\"libs-ui-input-text-bottom {{ classContainerBottomInput() }}\"\n [style.right.px]=\"(tagInput() === 'input' ? elementRightRef.clientWidth || 0 : 0) + 8\">\n @if (templateLeftBottomInput(); as templateLeftBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateLeftBottomInput\" />\n }\n <div\n #textCountRef\n class=\"text-[#9ca2ad] libs-ui-font-h7r\"\n [class.hidden]=\"dataType() !== 'string' || !showCount()\">\n <span>{{ countDisplay() }}</span>\n @if (maxLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n </div>\n @if (templateRightBottomInput(); as templateRightBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateRightBottomInput\" />\n }\n </div>\n</div>\n", styles: [".libs-ui-input{max-width:100%;border-radius:none;color:#071631;padding:7px 12px;background-color:#fff;background-clip:padding-box;min-height:32px}.libs-ui-input:not(.libs-ui-input-not-border){border:1px solid #e6e7ea;border-radius:4px}.libs-ui-input:focus{outline:none}.libs-ui-input:focus:not(:read-only):not(:disabled):not(.libs-ui-input-not-border){border:1px solid var(--libs-ui-color-light-1, #4e8cf7)}.libs-ui-input .libs-ui-input-valid-check{position:absolute;left:-27px}.libs-ui-input-not-border{border:transparent}libs-ui-components-button-sort{position:absolute;right:12px;top:0}libs-ui-components-button-sort[tagInput=textarea]{top:-10px}.libs-ui-input-icon-left{position:absolute;top:8px;left:16px;font-size:16px}.libs-ui-input-icon-right{font-size:16px;margin-right:8px}.libs-ui-input-text-bottom{display:flex;align-items:center;position:absolute;bottom:8px}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-credentials-auto-fill-button{margin-right:8px!important}textarea::-webkit-resizer{border:transparent;outline:none}.libs-ui-components-input-textarea-container:after{content:\"\";border-top:1.5px solid #9ca2ad;width:15px;transform:rotate(-45deg);background:transparent;position:absolute;right:0;bottom:8px;pointer-events:none;border-radius:25%}.libs-ui-components-input-textarea-container .libs-ui-components-input-textarea-container-resize-icon{border-top:1.5px solid #9ca2ad;width:7px;transform:rotate(-45deg);position:absolute;bottom:5px;right:1px;pointer-events:none;border-radius:25%}.libs-ui-input-placeholder-custom{color:#6a7378;margin-right:16px;background:inherit}\n"] }]
831
831
  }], ctorParameters: () => [] });
package/fesm2022/libs-ui-components-inputs-input.mjs CHANGED
@@ -942,10 +942,10 @@ class LibsUiComponentsInputsInputComponent {
942
942
  this.onDestroy.next();
943
943
  this.onDestroy.complete();
944
944
  }
945
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsInputsInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
946
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsInputsInputComponent, isStandalone: true, selector: "libs_ui-components-inputs-input", inputs: { tagInput: { classPropertyName: "tagInput", publicName: "tagInput", isSignal: true, isRequired: false, transformFunction: null }, dataType: { classPropertyName: "dataType", publicName: "dataType", isSignal: true, isRequired: false, transformFunction: null }, typeInput: { classPropertyName: "typeInput", publicName: "typeInput", isSignal: true, isRequired: false, transformFunction: null }, modeInput: { classPropertyName: "modeInput", publicName: "modeInput", isSignal: true, isRequired: false, transformFunction: null }, tabInsertContentTagInput: { classPropertyName: "tabInsertContentTagInput", publicName: "tabInsertContentTagInput", isSignal: true, isRequired: false, transformFunction: null }, textAreaEnterNotNewLine: { classPropertyName: "textAreaEnterNotNewLine", publicName: "textAreaEnterNotNewLine", isSignal: true, isRequired: false, transformFunction: null }, emitEmptyInDataTypeNumber: { classPropertyName: "emitEmptyInDataTypeNumber", publicName: "emitEmptyInDataTypeNumber", isSignal: true, isRequired: false, transformFunction: null }, keepZeroInTypeInt: { classPropertyName: "keepZeroInTypeInt", publicName: "keepZeroInTypeInt", isSignal: true, isRequired: false, transformFunction: null }, autoAddZeroLessThan10InTypeInt: { classPropertyName: "autoAddZeroLessThan10InTypeInt", publicName: "autoAddZeroLessThan10InTypeInt", isSignal: true, isRequired: false, transformFunction: null }, ignoreBlockInputMaxValue: { classPropertyName: "ignoreBlockInputMaxValue", publicName: "ignoreBlockInputMaxValue", isSignal: true, isRequired: false, transformFunction: null }, maxValueNumber: { classPropertyName: "maxValueNumber", publicName: "maxValueNumber", isSignal: true, isRequired: false, transformFunction: null }, minValueNumber: { classPropertyName: "minValueNumber", publicName: "minValueNumber", isSignal: true, isRequired: false, transformFunction: null }, fixedFloat: { classPropertyName: "fixedFloat", publicName: "fixedFloat", isSignal: true, isRequired: false, transformFunction: null }, acceptNegativeValue: { classPropertyName: "acceptNegativeValue", publicName: "acceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, valueUpDownNumber: { classPropertyName: "valueUpDownNumber", publicName: "valueUpDownNumber", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, noBorder: { classPropertyName: "noBorder", publicName: "noBorder", isSignal: true, isRequired: false, transformFunction: null }, backgroundNone: { classPropertyName: "backgroundNone", publicName: "backgroundNone", isSignal: true, isRequired: false, transformFunction: null }, borderError: { classPropertyName: "borderError", publicName: "borderError", isSignal: true, isRequired: false, transformFunction: null }, useColorModeExist: { classPropertyName: "useColorModeExist", publicName: "useColorModeExist", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, keepPlaceholderOnly: { classPropertyName: "keepPlaceholderOnly", publicName: "keepPlaceholderOnly", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, autoRemoveEmoji: { classPropertyName: "autoRemoveEmoji", publicName: "autoRemoveEmoji", isSignal: true, isRequired: false, transformFunction: null }, defaultHeight: { classPropertyName: "defaultHeight", publicName: "defaultHeight", isSignal: true, isRequired: false, transformFunction: null }, minHeightTextArea: { classPropertyName: "minHeightTextArea", publicName: "minHeightTextArea", isSignal: true, isRequired: false, transformFunction: null }, maxHeightTextArea: { classPropertyName: "maxHeightTextArea", publicName: "maxHeightTextArea", isSignal: true, isRequired: false, transformFunction: null }, focusTimeOut: { classPropertyName: "focusTimeOut", publicName: "focusTimeOut", isSignal: true, isRequired: false, transformFunction: null }, selectAllTimeOut: { classPropertyName: "selectAllTimeOut", publicName: "selectAllTimeOut", isSignal: true, isRequired: false, transformFunction: null }, blurTimeOut: { classPropertyName: "blurTimeOut", publicName: "blurTimeOut", isSignal: true, isRequired: false, transformFunction: null }, zIndexPopoverContent: { classPropertyName: "zIndexPopoverContent", publicName: "zIndexPopoverContent", isSignal: true, isRequired: false, transformFunction: null }, classContainerInput: { classPropertyName: "classContainerInput", publicName: "classContainerInput", isSignal: true, isRequired: false, transformFunction: null }, showCount: { classPropertyName: "showCount", publicName: "showCount", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, templateLeftBottomInput: { classPropertyName: "templateLeftBottomInput", publicName: "templateLeftBottomInput", isSignal: true, isRequired: false, transformFunction: null }, templateRightBottomInput: { classPropertyName: "templateRightBottomInput", publicName: "templateRightBottomInput", isSignal: true, isRequired: false, transformFunction: null }, classContainerBottomInput: { classPropertyName: "classContainerBottomInput", publicName: "classContainerBottomInput", isSignal: true, isRequired: false, transformFunction: null }, ignoreWidthInput100: { classPropertyName: "ignoreWidthInput100", publicName: "ignoreWidthInput100", isSignal: true, isRequired: false, transformFunction: null }, iframeTextareaCustomStyle: { classPropertyName: "iframeTextareaCustomStyle", publicName: "iframeTextareaCustomStyle", isSignal: true, isRequired: false, transformFunction: null }, iconLeftClass: { classPropertyName: "iconLeftClass", publicName: "iconLeftClass", isSignal: true, isRequired: false, transformFunction: null }, popoverContentIconLeft: { classPropertyName: "popoverContentIconLeft", publicName: "popoverContentIconLeft", isSignal: true, isRequired: false, transformFunction: null }, iconRightClass: { classPropertyName: "iconRightClass", publicName: "iconRightClass", isSignal: true, isRequired: false, transformFunction: null }, popoverContentIconRight: { classPropertyName: "popoverContentIconRight", publicName: "popoverContentIconRight", isSignal: true, isRequired: false, transformFunction: null }, resetAutoCompletePassword: { classPropertyName: "resetAutoCompletePassword", publicName: "resetAutoCompletePassword", isSignal: true, isRequired: false, transformFunction: null }, acceptOnlyClickIcon: { classPropertyName: "acceptOnlyClickIcon", publicName: "acceptOnlyClickIcon", isSignal: true, isRequired: false, transformFunction: null }, setIconRightColorSameColorDisableReadOnly: { classPropertyName: "setIconRightColorSameColorDisableReadOnly", publicName: "setIconRightColorSameColorDisableReadOnly", isSignal: true, isRequired: false, transformFunction: null }, onlyAcceptNegativeValue: { classPropertyName: "onlyAcceptNegativeValue", publicName: "onlyAcceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, maxLengthNumberCount: { classPropertyName: "maxLengthNumberCount", publicName: "maxLengthNumberCount", isSignal: true, isRequired: false, transformFunction: null }, focusInput: { classPropertyName: "focusInput", publicName: "focusInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { maxValueNumber: "maxValueNumberChange", minValueNumber: "minValueNumberChange", fixedFloat: "fixedFloatChange", acceptNegativeValue: "acceptNegativeValueChange", maxLength: "maxLengthChange", value: "valueChange", maxLengthNumberCount: "maxLengthNumberCountChange", outHeightAreaChange: "outHeightAreaChange", outChange: "outChange", outFocusAndBlurEvent: "outFocusAndBlurEvent", outEnterEvent: "outEnterEvent", outInputEvent: "outInputEvent", outIconLeft: "outIconLeft", outIconRight: "outIconRight", outFunctionsControl: "outFunctionsControl", outFilesDrop: "outFilesDrop", outFileDrop: "outFileDrop", outChangeValueByButtonUpDown: "outChangeValueByButtonUpDown" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true, isSignal: true }, { propertyName: "textCountRef", first: true, predicate: ["textCountRef"], descendants: true, isSignal: true }, { propertyName: "elementRightRef", first: true, predicate: ["elementRightRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n [class]=\"'flex relative !text-[#9ca2ad] ' + classContainerInput()\"\n [class.libs-ui-components-input-textarea-container]=\"tagInput() === 'textarea' && resize() === 'auto'\">\n @if (tagInput() === 'input') {\n <input\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r ' + classInclude()\"\n [class.border-primary-focus-general]=\"focusInput()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.!pl-[40px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [attr.type]=\"typeInput()\"\n [attr.inputmode]=\"modeInput()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"\n [autocomplete]=\"resetAutoCompletePassword() ? 'new-password' : ''\" />\n }\n @if (tagInput() === 'textarea') {\n @if (resize() === 'auto') {\n <div class=\"libs-ui-components-input-textarea-container-resize-icon\"></div>\n }\n <textarea\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"minHeightTextArea() ?? defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.resize]=\"resize()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r libs-ui-cursor-auto ' + classInclude()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.pl-[32px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"></textarea>\n }\n\n @if (tagInput() === 'iframe-textarea' && htmlIframeArea()) {\n <span class=\"d-none\"></span>\n <iframe\n #iframeRef\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.height.px]=\"defaultHeight()\"\n [srcdoc]=\"htmlIframeArea()\"\n class=\"w-full\"\n frameBorder=\"0\"\n (load)=\"handlerOnLoad($event, iframeRef)\"></iframe>\n }\n @if (iconLeftClass()) {\n <libs_ui-components-popover\n [ignoreShowPopover]=\"!popoverContentIconLeft()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconLeft(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class]=\"iconLeftClass() + ' libs-ui-input-icon-left !text-[#9ca2ad]'\"\n (click)=\"handlerEventIconLeft($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n <div\n #elementRightRef\n class=\"absolute flex items-center h-full top-0 right-0\">\n @if (value() && placeholder().trim() && keepPlaceholderOnly()) {\n <span [class]=\"'libs-ui-input-placeholder-custom libs-ui-font-h5r'\">\n {{ placeholder() }}\n </span>\n }\n @if (dataType() !== 'string' && valueUpDownNumber()) {\n <libs_ui-components-buttons-sort\n class=\"mr-[12px]\"\n [disableAsc]=\"disableAsc()\"\n [disableDesc]=\"disableDesc()\"\n [attr.tagInput]=\"tagInput()\"\n [onlyEmit]=\"true\"\n [disable]=\"disable() || readonly()\"\n (outChange)=\"handlerChangeValue($event)\" />\n }\n @if (iconRightClass()) {\n <libs_ui-components-popover\n class=\"flex\"\n [ignoreShowPopover]=\"!popoverContentIconRight()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconRight(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class.text-[#6a7383]]=\"(!disable() && !readonly()) || acceptOnlyClickIcon()\"\n [class.text-[#cdd0d6]]=\"((disable() || readonly()) && !acceptOnlyClickIcon()) || setIconRightColorSameColorDisableReadOnly()\"\n [class]=\"iconRightClass() + ' libs-ui-input-icon-right'\"\n (click)=\"handlerEventIconRight($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n </div>\n <div\n class=\"libs-ui-input-text-bottom {{ classContainerBottomInput() }}\"\n [style.right.px]=\"(tagInput() === 'input' ? elementRightRef.clientWidth || 0 : 0) + 8\">\n @if (templateLeftBottomInput(); as templateLeftBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateLeftBottomInput\" />\n }\n <div\n #textCountRef\n class=\"text-[#9ca2ad] libs-ui-font-h7r\"\n [class.hidden]=\"dataType() !== 'string' || !showCount()\">\n <span>{{ countDisplay() }}</span>\n @if (maxLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n </div>\n @if (templateRightBottomInput(); as templateRightBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateRightBottomInput\" />\n }\n </div>\n</div>\n", styles: [".libs-ui-input{max-width:100%;border-radius:none;color:#071631;padding:7px 12px;background-color:#fff;background-clip:padding-box;min-height:32px}.libs-ui-input:not(.libs-ui-input-not-border){border:1px solid #e6e7ea;border-radius:4px}.libs-ui-input:focus{outline:none}.libs-ui-input:focus:not(:read-only):not(:disabled):not(.libs-ui-input-not-border){border:1px solid var(--libs-ui-color-light-1, #4e8cf7)}.libs-ui-input .libs-ui-input-valid-check{position:absolute;left:-27px}.libs-ui-input-not-border{border:transparent}libs-ui-components-button-sort{position:absolute;right:12px;top:0}libs-ui-components-button-sort[tagInput=textarea]{top:-10px}.libs-ui-input-icon-left{position:absolute;top:8px;left:16px;font-size:16px}.libs-ui-input-icon-right{font-size:16px;margin-right:8px}.libs-ui-input-text-bottom{display:flex;align-items:center;position:absolute;bottom:8px}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-credentials-auto-fill-button{margin-right:8px!important}textarea::-webkit-resizer{border:transparent;outline:none}.libs-ui-components-input-textarea-container:after{content:\"\";border-top:1.5px solid #9ca2ad;width:15px;transform:rotate(-45deg);background:transparent;position:absolute;right:0;bottom:8px;pointer-events:none;border-radius:25%}.libs-ui-components-input-textarea-container .libs-ui-components-input-textarea-container-resize-icon{border-top:1.5px solid #9ca2ad;width:7px;transform:rotate(-45deg);position:absolute;bottom:5px;right:1px;pointer-events:none;border-radius:25%}.libs-ui-input-placeholder-custom{color:#6a7378;margin-right:16px;background:inherit}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsButtonsSortComponent, selector: "libs_ui-components-buttons-sort", inputs: ["size", "mode", "fieldSort", "disable", "disableAsc", "disableDesc", "onlyEmit"], outputs: ["modeChange", "outChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
945
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
946
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsInputsInputComponent, isStandalone: true, selector: "libs_ui-components-inputs-input", inputs: { tagInput: { classPropertyName: "tagInput", publicName: "tagInput", isSignal: true, isRequired: false, transformFunction: null }, dataType: { classPropertyName: "dataType", publicName: "dataType", isSignal: true, isRequired: false, transformFunction: null }, typeInput: { classPropertyName: "typeInput", publicName: "typeInput", isSignal: true, isRequired: false, transformFunction: null }, modeInput: { classPropertyName: "modeInput", publicName: "modeInput", isSignal: true, isRequired: false, transformFunction: null }, tabInsertContentTagInput: { classPropertyName: "tabInsertContentTagInput", publicName: "tabInsertContentTagInput", isSignal: true, isRequired: false, transformFunction: null }, textAreaEnterNotNewLine: { classPropertyName: "textAreaEnterNotNewLine", publicName: "textAreaEnterNotNewLine", isSignal: true, isRequired: false, transformFunction: null }, emitEmptyInDataTypeNumber: { classPropertyName: "emitEmptyInDataTypeNumber", publicName: "emitEmptyInDataTypeNumber", isSignal: true, isRequired: false, transformFunction: null }, keepZeroInTypeInt: { classPropertyName: "keepZeroInTypeInt", publicName: "keepZeroInTypeInt", isSignal: true, isRequired: false, transformFunction: null }, autoAddZeroLessThan10InTypeInt: { classPropertyName: "autoAddZeroLessThan10InTypeInt", publicName: "autoAddZeroLessThan10InTypeInt", isSignal: true, isRequired: false, transformFunction: null }, ignoreBlockInputMaxValue: { classPropertyName: "ignoreBlockInputMaxValue", publicName: "ignoreBlockInputMaxValue", isSignal: true, isRequired: false, transformFunction: null }, maxValueNumber: { classPropertyName: "maxValueNumber", publicName: "maxValueNumber", isSignal: true, isRequired: false, transformFunction: null }, minValueNumber: { classPropertyName: "minValueNumber", publicName: "minValueNumber", isSignal: true, isRequired: false, transformFunction: null }, fixedFloat: { classPropertyName: "fixedFloat", publicName: "fixedFloat", isSignal: true, isRequired: false, transformFunction: null }, acceptNegativeValue: { classPropertyName: "acceptNegativeValue", publicName: "acceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, valueUpDownNumber: { classPropertyName: "valueUpDownNumber", publicName: "valueUpDownNumber", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, noBorder: { classPropertyName: "noBorder", publicName: "noBorder", isSignal: true, isRequired: false, transformFunction: null }, backgroundNone: { classPropertyName: "backgroundNone", publicName: "backgroundNone", isSignal: true, isRequired: false, transformFunction: null }, borderError: { classPropertyName: "borderError", publicName: "borderError", isSignal: true, isRequired: false, transformFunction: null }, useColorModeExist: { classPropertyName: "useColorModeExist", publicName: "useColorModeExist", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, keepPlaceholderOnly: { classPropertyName: "keepPlaceholderOnly", publicName: "keepPlaceholderOnly", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, autoRemoveEmoji: { classPropertyName: "autoRemoveEmoji", publicName: "autoRemoveEmoji", isSignal: true, isRequired: false, transformFunction: null }, defaultHeight: { classPropertyName: "defaultHeight", publicName: "defaultHeight", isSignal: true, isRequired: false, transformFunction: null }, minHeightTextArea: { classPropertyName: "minHeightTextArea", publicName: "minHeightTextArea", isSignal: true, isRequired: false, transformFunction: null }, maxHeightTextArea: { classPropertyName: "maxHeightTextArea", publicName: "maxHeightTextArea", isSignal: true, isRequired: false, transformFunction: null }, focusTimeOut: { classPropertyName: "focusTimeOut", publicName: "focusTimeOut", isSignal: true, isRequired: false, transformFunction: null }, selectAllTimeOut: { classPropertyName: "selectAllTimeOut", publicName: "selectAllTimeOut", isSignal: true, isRequired: false, transformFunction: null }, blurTimeOut: { classPropertyName: "blurTimeOut", publicName: "blurTimeOut", isSignal: true, isRequired: false, transformFunction: null }, zIndexPopoverContent: { classPropertyName: "zIndexPopoverContent", publicName: "zIndexPopoverContent", isSignal: true, isRequired: false, transformFunction: null }, classContainerInput: { classPropertyName: "classContainerInput", publicName: "classContainerInput", isSignal: true, isRequired: false, transformFunction: null }, showCount: { classPropertyName: "showCount", publicName: "showCount", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, templateLeftBottomInput: { classPropertyName: "templateLeftBottomInput", publicName: "templateLeftBottomInput", isSignal: true, isRequired: false, transformFunction: null }, templateRightBottomInput: { classPropertyName: "templateRightBottomInput", publicName: "templateRightBottomInput", isSignal: true, isRequired: false, transformFunction: null }, classContainerBottomInput: { classPropertyName: "classContainerBottomInput", publicName: "classContainerBottomInput", isSignal: true, isRequired: false, transformFunction: null }, ignoreWidthInput100: { classPropertyName: "ignoreWidthInput100", publicName: "ignoreWidthInput100", isSignal: true, isRequired: false, transformFunction: null }, iframeTextareaCustomStyle: { classPropertyName: "iframeTextareaCustomStyle", publicName: "iframeTextareaCustomStyle", isSignal: true, isRequired: false, transformFunction: null }, iconLeftClass: { classPropertyName: "iconLeftClass", publicName: "iconLeftClass", isSignal: true, isRequired: false, transformFunction: null }, popoverContentIconLeft: { classPropertyName: "popoverContentIconLeft", publicName: "popoverContentIconLeft", isSignal: true, isRequired: false, transformFunction: null }, iconRightClass: { classPropertyName: "iconRightClass", publicName: "iconRightClass", isSignal: true, isRequired: false, transformFunction: null }, popoverContentIconRight: { classPropertyName: "popoverContentIconRight", publicName: "popoverContentIconRight", isSignal: true, isRequired: false, transformFunction: null }, resetAutoCompletePassword: { classPropertyName: "resetAutoCompletePassword", publicName: "resetAutoCompletePassword", isSignal: true, isRequired: false, transformFunction: null }, acceptOnlyClickIcon: { classPropertyName: "acceptOnlyClickIcon", publicName: "acceptOnlyClickIcon", isSignal: true, isRequired: false, transformFunction: null }, setIconRightColorSameColorDisableReadOnly: { classPropertyName: "setIconRightColorSameColorDisableReadOnly", publicName: "setIconRightColorSameColorDisableReadOnly", isSignal: true, isRequired: false, transformFunction: null }, onlyAcceptNegativeValue: { classPropertyName: "onlyAcceptNegativeValue", publicName: "onlyAcceptNegativeValue", isSignal: true, isRequired: false, transformFunction: null }, maxLengthNumberCount: { classPropertyName: "maxLengthNumberCount", publicName: "maxLengthNumberCount", isSignal: true, isRequired: false, transformFunction: null }, focusInput: { classPropertyName: "focusInput", publicName: "focusInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { maxValueNumber: "maxValueNumberChange", minValueNumber: "minValueNumberChange", fixedFloat: "fixedFloatChange", acceptNegativeValue: "acceptNegativeValueChange", maxLength: "maxLengthChange", value: "valueChange", maxLengthNumberCount: "maxLengthNumberCountChange", outHeightAreaChange: "outHeightAreaChange", outChange: "outChange", outFocusAndBlurEvent: "outFocusAndBlurEvent", outEnterEvent: "outEnterEvent", outInputEvent: "outInputEvent", outIconLeft: "outIconLeft", outIconRight: "outIconRight", outFunctionsControl: "outFunctionsControl", outFilesDrop: "outFilesDrop", outFileDrop: "outFileDrop", outChangeValueByButtonUpDown: "outChangeValueByButtonUpDown" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true, isSignal: true }, { propertyName: "textCountRef", first: true, predicate: ["textCountRef"], descendants: true, isSignal: true }, { propertyName: "elementRightRef", first: true, predicate: ["elementRightRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n [class]=\"'flex relative !text-[#9ca2ad] ' + classContainerInput()\"\n [class.libs-ui-components-input-textarea-container]=\"tagInput() === 'textarea' && resize() === 'auto'\">\n @if (tagInput() === 'input') {\n <input\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r ' + classInclude()\"\n [class.border-primary-focus-general]=\"focusInput()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.!pl-[40px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [attr.type]=\"typeInput()\"\n [attr.inputmode]=\"modeInput()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"\n [autocomplete]=\"resetAutoCompletePassword() ? 'new-password' : ''\" />\n }\n @if (tagInput() === 'textarea') {\n @if (resize() === 'auto') {\n <div class=\"libs-ui-components-input-textarea-container-resize-icon\"></div>\n }\n <textarea\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"minHeightTextArea() ?? defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.resize]=\"resize()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r libs-ui-cursor-auto ' + classInclude()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.pl-[32px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"></textarea>\n }\n\n @if (tagInput() === 'iframe-textarea' && htmlIframeArea()) {\n <span class=\"d-none\"></span>\n <iframe\n #iframeRef\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.height.px]=\"defaultHeight()\"\n [srcdoc]=\"htmlIframeArea()\"\n class=\"w-full\"\n frameBorder=\"0\"\n (load)=\"handlerOnLoad($event, iframeRef)\"></iframe>\n }\n @if (iconLeftClass()) {\n <libs_ui-components-popover\n [ignoreShowPopover]=\"!popoverContentIconLeft()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconLeft(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class]=\"iconLeftClass() + ' libs-ui-input-icon-left !text-[#9ca2ad]'\"\n (click)=\"handlerEventIconLeft($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n <div\n #elementRightRef\n class=\"absolute flex items-center h-full top-0 right-0\">\n @if (value() && placeholder().trim() && keepPlaceholderOnly()) {\n <span [class]=\"'libs-ui-input-placeholder-custom libs-ui-font-h5r'\">\n {{ placeholder() }}\n </span>\n }\n @if (dataType() !== 'string' && valueUpDownNumber()) {\n <libs_ui-components-buttons-sort\n class=\"mr-[12px]\"\n [disableAsc]=\"disableAsc()\"\n [disableDesc]=\"disableDesc()\"\n [attr.tagInput]=\"tagInput()\"\n [onlyEmit]=\"true\"\n [disable]=\"disable() || readonly()\"\n (outChange)=\"handlerChangeValue($event)\" />\n }\n @if (iconRightClass()) {\n <libs_ui-components-popover\n class=\"flex\"\n [ignoreShowPopover]=\"!popoverContentIconRight()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconRight(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class.text-[#6a7383]]=\"(!disable() && !readonly()) || acceptOnlyClickIcon()\"\n [class.text-[#cdd0d6]]=\"((disable() || readonly()) && !acceptOnlyClickIcon()) || setIconRightColorSameColorDisableReadOnly()\"\n [class]=\"iconRightClass() + ' libs-ui-input-icon-right'\"\n (click)=\"handlerEventIconRight($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n </div>\n <div\n class=\"libs-ui-input-text-bottom {{ classContainerBottomInput() }}\"\n [style.right.px]=\"(tagInput() === 'input' ? elementRightRef.clientWidth || 0 : 0) + 8\">\n @if (templateLeftBottomInput(); as templateLeftBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateLeftBottomInput\" />\n }\n <div\n #textCountRef\n class=\"text-[#9ca2ad] libs-ui-font-h7r\"\n [class.hidden]=\"dataType() !== 'string' || !showCount()\">\n <span>{{ countDisplay() }}</span>\n @if (maxLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n </div>\n @if (templateRightBottomInput(); as templateRightBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateRightBottomInput\" />\n }\n </div>\n</div>\n", styles: [".libs-ui-input{max-width:100%;border-radius:none;color:#071631;padding:7px 12px;background-color:#fff;background-clip:padding-box;min-height:32px}.libs-ui-input:not(.libs-ui-input-not-border){border:1px solid #e6e7ea;border-radius:4px}.libs-ui-input:focus{outline:none}.libs-ui-input:focus:not(:read-only):not(:disabled):not(.libs-ui-input-not-border){border:1px solid var(--libs-ui-color-light-1, #4e8cf7)}.libs-ui-input .libs-ui-input-valid-check{position:absolute;left:-27px}.libs-ui-input-not-border{border:transparent}libs-ui-components-button-sort{position:absolute;right:12px;top:0}libs-ui-components-button-sort[tagInput=textarea]{top:-10px}.libs-ui-input-icon-left{position:absolute;top:8px;left:16px;font-size:16px}.libs-ui-input-icon-right{font-size:16px;margin-right:8px}.libs-ui-input-text-bottom{display:flex;align-items:center;position:absolute;bottom:8px}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-credentials-auto-fill-button{margin-right:8px!important}textarea::-webkit-resizer{border:transparent;outline:none}.libs-ui-components-input-textarea-container:after{content:\"\";border-top:1.5px solid #9ca2ad;width:15px;transform:rotate(-45deg);background:transparent;position:absolute;right:0;bottom:8px;pointer-events:none;border-radius:25%}.libs-ui-components-input-textarea-container .libs-ui-components-input-textarea-container-resize-icon{border-top:1.5px solid #9ca2ad;width:7px;transform:rotate(-45deg);position:absolute;bottom:5px;right:1px;pointer-events:none;border-radius:25%}.libs-ui-input-placeholder-custom{color:#6a7378;margin-right:16px;background:inherit}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsButtonsSortComponent, selector: "libs_ui-components-buttons-sort", inputs: ["size", "mode", "fieldSort", "disable", "disableAsc", "disableDesc", "onlyEmit"], outputs: ["modeChange", "outChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
947
947
  }
948
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsInputsInputComponent, decorators: [{
948
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsInputComponent, decorators: [{
949
949
  type: Component,
950
950
  args: [{ selector: 'libs_ui-components-inputs-input', standalone: true, imports: [TranslateModule, NgTemplateOutlet, LibsUiComponentsPopoverComponent, LibsUiComponentsButtonsSortComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [class]=\"'flex relative !text-[#9ca2ad] ' + classContainerInput()\"\n [class.libs-ui-components-input-textarea-container]=\"tagInput() === 'textarea' && resize() === 'auto'\">\n @if (tagInput() === 'input') {\n <input\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r ' + classInclude()\"\n [class.border-primary-focus-general]=\"focusInput()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.!pl-[40px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [attr.type]=\"typeInput()\"\n [attr.inputmode]=\"modeInput()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"\n [autocomplete]=\"resetAutoCompletePassword() ? 'new-password' : ''\" />\n }\n @if (tagInput() === 'textarea') {\n @if (resize() === 'auto') {\n <div class=\"libs-ui-components-input-textarea-container-resize-icon\"></div>\n }\n <textarea\n #inputRef\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [style.height.px]=\"defaultHeight()\"\n [style.minHeight.px]=\"minHeightTextArea() ?? defaultHeight()\"\n [style.paddingRight.px.important]=\"paddingRightCustom()\"\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.resize]=\"resize()\"\n [class.w-full]=\"!ignoreWidthInput100()\"\n [class]=\"'libs-ui-input libs-ui-font-h5r libs-ui-cursor-auto ' + classInclude()\"\n [class.libs-ui-input-not-border]=\"noBorder()\"\n [class.libs-ui-bg-special-none]=\"backgroundNone()\"\n [class.libs-ui-border-error-general]=\"borderError()\"\n [class.text-[#29c7cc]]=\"useColorModeExist()\"\n [class.pl-[32px]]=\"iconLeftClass()\"\n [attr.maxLength]=\"maxLength() || undefined\"\n [placeholder]=\"placeholder() | translate\"\n [readonly]=\"readonly()\"\n [disabled]=\"disable()\"></textarea>\n }\n\n @if (tagInput() === 'iframe-textarea' && htmlIframeArea()) {\n <span class=\"d-none\"></span>\n <iframe\n #iframeRef\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.height.px]=\"defaultHeight()\"\n [srcdoc]=\"htmlIframeArea()\"\n class=\"w-full\"\n frameBorder=\"0\"\n (load)=\"handlerOnLoad($event, iframeRef)\"></iframe>\n }\n @if (iconLeftClass()) {\n <libs_ui-components-popover\n [ignoreShowPopover]=\"!popoverContentIconLeft()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconLeft(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class]=\"iconLeftClass() + ' libs-ui-input-icon-left !text-[#9ca2ad]'\"\n (click)=\"handlerEventIconLeft($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n <div\n #elementRightRef\n class=\"absolute flex items-center h-full top-0 right-0\">\n @if (value() && placeholder().trim() && keepPlaceholderOnly()) {\n <span [class]=\"'libs-ui-input-placeholder-custom libs-ui-font-h5r'\">\n {{ placeholder() }}\n </span>\n }\n @if (dataType() !== 'string' && valueUpDownNumber()) {\n <libs_ui-components-buttons-sort\n class=\"mr-[12px]\"\n [disableAsc]=\"disableAsc()\"\n [disableDesc]=\"disableDesc()\"\n [attr.tagInput]=\"tagInput()\"\n [onlyEmit]=\"true\"\n [disable]=\"disable() || readonly()\"\n (outChange)=\"handlerChangeValue($event)\" />\n }\n @if (iconRightClass()) {\n <libs_ui-components-popover\n class=\"flex\"\n [ignoreShowPopover]=\"!popoverContentIconRight()\"\n [config]=\"{ maxWidth: 250, direction: 'bottom', content: popoverContentIconRight(), zIndex: zIndexPopoverContent() }\">\n <i\n [attr.tagInput]=\"tagInput()\"\n [class.text-[#6a7383]]=\"(!disable() && !readonly()) || acceptOnlyClickIcon()\"\n [class.text-[#cdd0d6]]=\"((disable() || readonly()) && !acceptOnlyClickIcon()) || setIconRightColorSameColorDisableReadOnly()\"\n [class]=\"iconRightClass() + ' libs-ui-input-icon-right'\"\n (click)=\"handlerEventIconRight($event, 'click')\"></i>\n </libs_ui-components-popover>\n }\n </div>\n <div\n class=\"libs-ui-input-text-bottom {{ classContainerBottomInput() }}\"\n [style.right.px]=\"(tagInput() === 'input' ? elementRightRef.clientWidth || 0 : 0) + 8\">\n @if (templateLeftBottomInput(); as templateLeftBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateLeftBottomInput\" />\n }\n <div\n #textCountRef\n class=\"text-[#9ca2ad] libs-ui-font-h7r\"\n [class.hidden]=\"dataType() !== 'string' || !showCount()\">\n <span>{{ countDisplay() }}</span>\n @if (maxLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n </div>\n @if (templateRightBottomInput(); as templateRightBottomInput) {\n <ng-container *ngTemplateOutlet=\"templateRightBottomInput\" />\n }\n </div>\n</div>\n", styles: [".libs-ui-input{max-width:100%;border-radius:none;color:#071631;padding:7px 12px;background-color:#fff;background-clip:padding-box;min-height:32px}.libs-ui-input:not(.libs-ui-input-not-border){border:1px solid #e6e7ea;border-radius:4px}.libs-ui-input:focus{outline:none}.libs-ui-input:focus:not(:read-only):not(:disabled):not(.libs-ui-input-not-border){border:1px solid var(--libs-ui-color-light-1, #4e8cf7)}.libs-ui-input .libs-ui-input-valid-check{position:absolute;left:-27px}.libs-ui-input-not-border{border:transparent}libs-ui-components-button-sort{position:absolute;right:12px;top:0}libs-ui-components-button-sort[tagInput=textarea]{top:-10px}.libs-ui-input-icon-left{position:absolute;top:8px;left:16px;font-size:16px}.libs-ui-input-icon-right{font-size:16px;margin-right:8px}.libs-ui-input-text-bottom{display:flex;align-items:center;position:absolute;bottom:8px}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-credentials-auto-fill-button{margin-right:8px!important}textarea::-webkit-resizer{border:transparent;outline:none}.libs-ui-components-input-textarea-container:after{content:\"\";border-top:1.5px solid #9ca2ad;width:15px;transform:rotate(-45deg);background:transparent;position:absolute;right:0;bottom:8px;pointer-events:none;border-radius:25%}.libs-ui-components-input-textarea-container .libs-ui-components-input-textarea-container-resize-icon{border-top:1.5px solid #9ca2ad;width:7px;transform:rotate(-45deg);position:absolute;bottom:5px;right:1px;pointer-events:none;border-radius:25%}.libs-ui-input-placeholder-custom{color:#6a7378;margin-right:16px;background:inherit}\n"] }]
951
951
  }], ctorParameters: () => [] });
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@libs-ui/components-inputs-input",
3
- "version": "0.2.312-0",
3
+ "version": "0.2.312-2",
4
4
  "peerDependencies": {
5
5
  "@angular/core": ">=18.0.0",
6
6
  "@angular/platform-browser": ">=18.0.0",
7
- "@libs-ui/components-buttons-sort": "0.2.312-0",
8
- "@libs-ui/components-popover": "0.2.312-0",
9
- "@libs-ui/interfaces-types": "0.2.312-0",
10
- "@libs-ui/services-config-project": "0.2.312-0",
11
- "@libs-ui/utils": "0.2.312-0",
7
+ "@libs-ui/components-buttons-sort": "0.2.312-2",
8
+ "@libs-ui/components-popover": "0.2.312-2",
9
+ "@libs-ui/interfaces-types": "0.2.312-2",
10
+ "@libs-ui/services-config-project": "0.2.312-2",
11
+ "@libs-ui/utils": "0.2.312-2",
12
12
  "@ngx-translate/core": "^15.0.0",
13
13
  "rxjs": "~7.8.0"
14
14
  },