@libs-ui/components-inputs-input 0.2.357-1 → 0.2.357-11

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 (6) hide show
  1. package/README.md +57 -8
  2. package/esm2022/input.component.mjs +19 -9
  3. package/fesm2022/libs-ui-components-inputs-input.mjs +19 -9
  4. package/fesm2022/libs-ui-components-inputs-input.mjs.map +1 -1
  5. package/input.component.d.ts +8 -7
  6. package/package.json +6 -6
package/fesm2022/libs-ui-components-inputs-input.mjs CHANGED
@@ -1,15 +1,15 @@
1
+ import { NgTemplateOutlet } from '@angular/common';
1
2
  import * as i0 from '@angular/core';
2
3
  import { signal, computed, input, model, output, viewChild, inject, Renderer2, effect, untracked, Component, ChangeDetectionStrategy } from '@angular/core';
3
4
  import { DomSanitizer } from '@angular/platform-browser';
4
5
  import { LibsUiComponentsButtonsSortComponent } from '@libs-ui/components-buttons-sort';
5
6
  import { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';
6
7
  import { LibsUiConfigProjectService } from '@libs-ui/services-config-project';
7
- import { viewDataNumberByLanguage, UtilsKeyCodeConstant, isTypeFile, UtilsCache, UtilsLanguageConstants, isNil, formatNumber, removeEmoji, uuid, setCaretPosition } from '@libs-ui/utils';
8
+ import { viewDataNumberByLanguage, watchSignalEffect, UtilsKeyCodeConstant, isTypeFile, UtilsCache, UtilsLanguageConstants, isNil, formatNumber, removeEmoji, uuid, setCaretPosition } from '@libs-ui/utils';
8
9
  import * as i1 from '@ngx-translate/core';
9
10
  import { TranslateService, TranslateModule } from '@ngx-translate/core';
10
- import { Subject, fromEvent } from 'rxjs';
11
- import { take, tap, mergeMap, filter, takeUntil, debounceTime } from 'rxjs/operators';
12
- import { NgTemplateOutlet } from '@angular/common';
11
+ import { Subject, merge, fromEvent } from 'rxjs';
12
+ import { take, tap, mergeMap, takeUntil, filter, debounceTime } from 'rxjs/operators';
13
13
 
14
14
  const indexInputHtml = (customStyle) => `
15
15
  <!DOCTYPE html>
@@ -145,6 +145,7 @@ class LibsUiComponentsInputsInputComponent {
145
145
  maxLengthDisplay = computed(() => `${viewDataNumberByLanguage(this.maxLength() || 0, false)}`);
146
146
  paddingRightCustom = signal(undefined);
147
147
  inputIframeRef = signal(undefined);
148
+ ignoreCompositionEvent = new Subject();
148
149
  DEFAULT_MAX_HEIGHT_TEXT_AREA = 250;
149
150
  charFirstIsZero = signal(false);
150
151
  preHeightArea = signal(0);
@@ -228,25 +229,26 @@ class LibsUiComponentsInputsInputComponent {
228
229
  sanitizer = inject(DomSanitizer);
229
230
  constructor() {
230
231
  effect(() => {
232
+ watchSignalEffect(this.onlyAcceptNegativeValue, this.dataType, this.value, this.emitEmptyInDataTypeNumber);
231
233
  if (this.onlyAcceptNegativeValue()) {
232
- this.acceptNegativeValue.set(true);
234
+ untracked(() => this.acceptNegativeValue.set(true));
233
235
  }
234
236
  if (!this.Element) {
235
237
  return;
236
238
  }
237
239
  if (this.dataType() === 'string') {
238
240
  if (this.Element.value !== this.value()) {
239
- this.init();
241
+ untracked(() => this.init());
240
242
  }
241
243
  return;
242
244
  }
243
- this.updateMaxLengthMinMaxValueByDataType();
245
+ untracked(() => this.updateMaxLengthMinMaxValueByDataType());
244
246
  const value = this.parseValueByDataType(this.Element.value);
245
247
  if ((this.Element.value !== '' && value === this.value()) || (this.Element.value === '' && this.emitEmptyInDataTypeNumber() && this.value() === undefined)) {
246
248
  return;
247
249
  }
248
- this.init();
249
- }, { allowSignalWrites: true });
250
+ untracked(() => this.init());
251
+ });
250
252
  effect(() => {
251
253
  if (this.Element) {
252
254
  this.onDestroy.next();
@@ -289,11 +291,18 @@ class LibsUiComponentsInputsInputComponent {
289
291
  keyDownEvent
290
292
  .pipe(take(1), tap((e) => this.checkTypeNumber(e, 'key')), mergeMap(() => inputEvent), tap((e) => this.checkTypeNumber(e, 'data')))
291
293
  .subscribe((e) => {
294
+ this.ignoreCompositionEvent.next(true);
295
+ this.ignoreCompositionEvent.complete();
292
296
  if (this.dataType() === 'string' && this.maxLength() && (e.inputType === 'insertCompositionText' || e.inputType === 'insertText') && e.target.value?.length > (this.maxLength() || 0)) {
293
297
  e.target.value = e.target.value.slice(0, this.maxLength());
294
298
  }
295
299
  this.processEventAndEmitValue(e);
296
300
  });
301
+ merge(fromEvent(this.Element, 'compositionstart'), fromEvent(this.Element, 'compositionend'))
302
+ .pipe(takeUntil(this.ignoreCompositionEvent), takeUntil(this.onDestroy))
303
+ .subscribe((e) => {
304
+ this.processEventAndEmitValue(e);
305
+ });
297
306
  keyupEvent
298
307
  .pipe(filter((event) => event.keyCode === UtilsKeyCodeConstant.ENTER), filter((event) => !this.textAreaEnterNotNewLine() || (this.textAreaEnterNotNewLine() && !event.shiftKey)))
299
308
  .subscribe((event) => this.outEnterEvent.emit(event));
@@ -954,6 +963,7 @@ class LibsUiComponentsInputsInputComponent {
954
963
  ngOnDestroy() {
955
964
  this.onDestroy.next();
956
965
  this.onDestroy.complete();
966
+ this.ignoreCompositionEvent.complete();
957
967
  }
958
968
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsInputsInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
959
969
  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 title=\"Content frame\"\n [style.maxHeight.px]=\"maxHeightTextArea()\"\n [style.height.px]=\"defaultHeight()\"\n [srcdoc]=\"htmlIframeArea()\"\n class=\"w-full border-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')\"\n (keydown.enter)=\"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')\"\n (keydown.enter)=\"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 });