@libs-ui/components-list 0.2.65 → 0.2.67

package/fesm2022/libs-ui-components-list.mjs

@@ -519,6 +519,7 @@ class LibsUiComponentsListCheckboxComponent extends LibsUiComponentsListTemplate
         if (isEmpty(this.config()?.configTemplateCheckbox?.())) {
             return;
         }
+        super.ngOnInit();
         this.configTemplateCheckbox.set(this.config()?.configTemplateCheckbox?.());
         this.fieldKey.set(this.configTemplateCheckbox()?.fieldKey ?? this.fieldKeyDefault());
         this.callApiByService();
@@ -632,7 +633,6 @@ class LibsUiComponentsListCheckboxComponent extends LibsUiComponentsListTemplate
         this.checkAndEmitMultiKeySelected(item);
     }
     handlerChange(event, item, ignoreDisable = false, isClickManual = true) {
-        console.log('handlerChange');
         if (this.configTemplateCheckbox()?.ignoreClickItemUnChecked) {
             const key = item[this.fieldKey()];
             if (this.multiKeySelected()?.includes(key)) {
@@ -673,7 +673,7 @@ class LibsUiComponentsListCheckboxComponent extends LibsUiComponentsListTemplate
         }
         multiKeySelected.forEach((key) => {
             const item = this.store().find(item => item()[this.fieldKey()] === key);
-            mapKeys.push({ key, item, isClickManual });
+            mapKeys.push({ key, item: convertSignalToObject(item), isClickManual });
         });
         this.outSelectMultiKey.emit({ keys: this.multiKeySelected() || [], mapKeys, isClickManual });
     }
@@ -763,7 +763,7 @@ class LibsUiComponentsListCheckboxComponent extends LibsUiComponentsListTemplate
         return this.items().length;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListCheckboxComponent, isStandalone: true, selector: "libs_ui-components-list-templates_checkbox", usesInheritance: true, ngImport: i0, template: "@if (configTemplateCheckbox(); as configTemplateCheckbox) {\n  <div class=\"flex flex-col w-full h-full\">\n    @if (items().length && configTemplateCheckbox.configButtonSelectAndUndSelectItem?.(); as configButtonSelectItem) {\n      <div [class]=\"'flex items-center bg-[#ffffff] '+(configButtonSelectItem.classInclude ?? 'libs-ui-border-bottom-general')\">\n        <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonCheckAll?.type ?? 'button-link-primary'\"\n          [label]=\"configButtonSelectItem.buttonCheckAll?.label ?? 'i18n_select_all_searched_results'\"\n          [classInclude]=\"configButtonSelectItem.buttonCheckAll?.classInclude || 'pr-[8px]'\"\n          [classLabel]=\"configButtonSelectItem.buttonCheckAll?.classLabel || 'libs-ui-font-h6r'\"\n          [disable]=\"loading() || disable() || false\"\n          (outClick)=\"handlerSelect(true)\" />\n        <div class=\"text-[#e6e7ea]\">|</div>\n        <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonUncheckAll?.type ?? 'button-link-primary'\"\n          [label]=\"configButtonSelectItem.buttonUncheckAll?.label ?? 'i18n_unselect_all_searched_results'\"\n          [classInclude]=\"configButtonSelectItem.buttonUncheckAll?.classInclude || 'pl-[8px]'\"\n          [classLabel]=\"configButtonSelectItem.buttonUncheckAll?.classLabel || 'libs-ui-font-h6r'\"\n          [disable]=\"loading() || disable() || false\"\n          (outClick)=\"handlerSelect(false)\" />\n      </div>\n    }\n    @if (items().length && configTemplateCheckbox.configCheckboxCheckAll?.(); as configCheckBox) {\n      <div [class]=\"'flex libs-ui-border-bottom-general bg-[#ffffff] pl-[12px] '+(configTemplateCheckbox.classIncludeHasConfigCheckBoxAll ?? 'py-[6px] libs-ui-border-bottom-general')\">\n        <libs_ui-components-checkbox-single [label]=\"configCheckBox.label ?? 'i18n_all'\"\n          [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n          [checked]=\"(multiKeySelected()?.length && (multiKeySelected()?.length ||0) >= (store().length || -1)) || false\"\n          [disable]=\"loading() || disable() || false\"\n          (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n          (outChange)=\"handlerSelect($event.checked)\" />\n      </div>\n    }\n    <div #elementScroll\n      [class]=\"'relative h-full w-full ' +((!items() || !items().length) ? 'bg-[#ffffff]': configTemplateCheckbox.classListInclude || '')\">\n      @if (items() && items().length) {\n        <div LibsUiComponentsScrollOverlayDirective\n          class=\"w-full\"\n          [style.height]=\"heightViewPort() && !config()?.ignoreShowDataWhenNotSearch ? heightViewPort()+'px':'100%'\"\n          (outScrollBottom)=\"handlerScrollBottom()\">\n          <virtual-scroller #scroll\n            [parentScroll]=\"elementScroll\"\n            [items]=\"items()\"\n            class=\"h-full\">\n            @for (item of scroll.viewPortItems; track item()[fieldKey()]; let last = $last) {\n              <div [class]=\"last ? (configTemplateCheckbox.classIncludeLastViewItem || '') : ''\">\n                <div #itemRef\n                  LibsUiComponentsListHighlightKeySearchDirective\n                  [isHighlight]=\"config()?.highlightTextSearchInResult\"\n                  [keySearch]=\"keySearch()\"\n                  [attr.clickExactly]=\"clickExactly\"\n                  [class]=\"'libs-ui-list-template-checkbox-item flex ' + (configTemplateCheckbox.classItemInclude || '')\"\n                  [class.w-full]=\"!configTemplateCheckbox.ignoreItemWidth100\"\n                  [class.libs-ui-bg-list-hover]=\"!clickExactly()\"\n                  [class.libs-ui-bg-list-hover-active]=\"!clickExactly()\"\n                  [class.pl-[12px]]=\"paddingLeftItem()\"\n                  [class.py-[6px]]=\"clickExactly()\"\n                  [class.pr-[4px]]=\"hasScroll() && configTemplateCheckbox.rows\"\n                  [class.pr-[12px]]=\"!hasScroll() && configTemplateCheckbox.rows\"\n                  (click)=\"handlerChange($event,item())\">\n                  <div class=\"flex flex-col w-full\">\n                    @if (item().fieldLabel) {\n                      <libs_ui-components-checkbox-single [label]=\"item().fieldLabel\"\n                        [avatarConfig]=\"item().avatarConfig\"\n                        [linkImage]=\"configTemplateCheckbox.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateCheckbox.getImage:item()) | async) : item()[configTemplateCheckbox.fieldGetImage || '']\"\n                        [linkImageError]=\"configTemplateCheckbox.getImageError ? (('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateCheckbox.getImageError:item()) | async) : item()[configTemplateCheckbox.fieldGetLinkImageError || '']\"\n                        [classLabelInclude]=\"item().classLabelInclude || configTemplateCheckbox.classLabelInclude || ''\"\n                        [zIndexLabel]=\"configTemplateCheckbox.zIndexPopover ?? 1200\"\n                        [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length\"\n                        [key]=\"item()[fieldKey()]\"\n                        [imgTypeIcon]=\"configTemplateCheckbox.hasAvatarGroupSocial\"\n                        [linkImageError]=\"configTemplateCheckbox.fieldGetLinkImageError  || ''\"\n                        [classInclude]=\"configTemplateCheckbox.classInclude || ''\"\n                        [classImageInclude]=\"configTemplateCheckbox.classIncludeImage || ''\"\n                        [bullet]=\"item().bullet\"\n                        [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [popover]=\"item().dataPopover\"\n                        [clickExactly]=\"clickExactly()\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outChange)=\"handlerChange('checkbox',item())\"\n                        (outClickLabel)=\"handlerChange('checkbox',item())\" />\n                    }\n                    @if (configTemplateCheckbox?.rows) {\n                      <libs_ui-components-list-templates_rows class=\"{{ !configTemplateCheckbox.ignoreItemWidth100 ? 'w-full' : '' }} {{ configTemplateCheckbox.classRowsWrapper || configTemplateCheckbox.classRows ?? '' }}\"\n                        [item]=\"item()\"\n                        [zIndex]=\"zIndex()\"\n                        [fieldKey]=\"fieldKey()\"\n                        [keySelected]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) ? item()[fieldKey()] : undefined\"\n                        [configTemplate]=\"configTemplateCheckbox\"\n                        (outEvent)=\"handlerChange('checkbox',$event.item)\" />\n                    }\n                  </div>\n                </div>\n              </div>\n            }\n          </virtual-scroller>\n        </div>\n      }\n      @if ((!items() || !items().length) && (!config()?.ignoreShowDataWhenNotSearch || keySearch())) {\n        <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[4px] px-[12px]')\">\n          @if (config()?.hasIconNoData && !loading()) {\n            <div class=\"mb-[16px]\">\n              <div *ngComponentOutlet=\"(keySearch()  ? 'no-result' : 'no-data') | LibsUiIconsGetIconComponentPipe | async\"></div>\n            </div>\n          }\n          @if (!keySearch() && !loading()) {\n            <span>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</span>\n          }\n          @if (templateRefSearchNoData() && keySearch() && !loading()) {\n            <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n          }\n          @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n            <span>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</span>\n          }\n          @if (loading()) {\n            <span>&nbsp;</span>\n          }\n\n        </div>\n      }\n      @if (loading()) {\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      }\n    </div>\n  </div>\n}\n", styles: [".libs-ui-list-template-checkbox-item{padding:6px 0 6px 16px;margin-right:8px;font-size:12px;line-height:18px;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "component", type: i1$1.VirtualScrollerComponent, selector: "virtual-scroller,[virtualScroller]", inputs: ["executeRefreshOutsideAngularZone", "enableUnequalChildrenSizes", "RTL", "useMarginInsteadOfTranslate", "modifyOverflowStyleOfParentScroll", "stripedTable", "scrollbarWidth", "scrollbarHeight", "childWidth", "childHeight", "ssrChildWidth", "ssrChildHeight", "ssrViewportWidth", "ssrViewportHeight", "bufferAmount", "scrollAnimationTime", "resizeBypassRefreshThreshold", "scrollThrottlingTime", "scrollDebounceTime", "checkResizeInterval", "items", "compareItems", "horizontal", "parentScroll"], outputs: ["vsUpdate", "vsChange", "vsStart", "vsEnd"], exportAs: ["virtualScroller"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsCheckboxSingleComponent, selector: "libs_ui-components-checkbox-single", inputs: ["key", "checked", "label", "classLabelInclude", "ignoreShowPopoverLabel", "typeLabelPopover", "popover", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "classInclude", "clickExactly", "disable", "disableLabel", "ignoreCheckbox", "zIndexLabel", "stillOtherOptions", "error", "showBorderError", "description", "iconImageClass", "classIconInclude", "modeBorder"], outputs: ["checkedChange", "linkImageChange", "outChange", "outEventPopover", "outClickLabel", "outChangStageFlagMousePopover"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "pipe", type: LibsUiIconsGetIconComponentPipe, name: "LibsUiIconsGetIconComponentPipe" }, { kind: "directive", type: LibsUiComponentsListHighlightKeySearchDirective, selector: "[LibsUiComponentsListHighlightKeySearchDirective]", inputs: ["isHighlight", "keySearch", "classHighlight"] }, { kind: "component", type: LibsUiComponentsListRowsComponent, selector: "libs_ui-components-list-templates_rows", inputs: ["configTemplate", "item", "keySelected", "fieldKey", "zIndex"], outputs: ["outChangStageFlagMousePopover", "outEvent"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListCheckboxComponent, isStandalone: true, selector: "libs_ui-components-list-templates_checkbox", usesInheritance: true, ngImport: i0, template: "@if (configTemplateCheckbox(); as configTemplateCheckbox) {\n  <div class=\"flex flex-col w-full h-full\">\n    @if (items().length && configTemplateCheckbox.configButtonSelectAndUndSelectItem?.(); as configButtonSelectItem) {\n      <div [class]=\"'flex items-center bg-[#ffffff] '+(configButtonSelectItem.classInclude ?? 'libs-ui-border-bottom-general')\">\n        <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonCheckAll?.type ?? 'button-link-primary'\"\n          [label]=\"configButtonSelectItem.buttonCheckAll?.label ?? 'i18n_select_all_searched_results'\"\n          [classInclude]=\"configButtonSelectItem.buttonCheckAll?.classInclude || 'pr-[8px]'\"\n          [classLabel]=\"configButtonSelectItem.buttonCheckAll?.classLabel || 'libs-ui-font-h6r'\"\n          [disable]=\"loading() || disable() || false\"\n          (outClick)=\"handlerSelect(true)\" />\n        <div class=\"text-[#e6e7ea]\">|</div>\n        <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonUncheckAll?.type ?? 'button-link-primary'\"\n          [label]=\"configButtonSelectItem.buttonUncheckAll?.label ?? 'i18n_unselect_all_searched_results'\"\n          [classInclude]=\"configButtonSelectItem.buttonUncheckAll?.classInclude || 'pl-[8px]'\"\n          [classLabel]=\"configButtonSelectItem.buttonUncheckAll?.classLabel || 'libs-ui-font-h6r'\"\n          [disable]=\"loading() || disable() || false\"\n          (outClick)=\"handlerSelect(false)\" />\n      </div>\n    }\n    @if (items().length && configTemplateCheckbox.configCheckboxCheckAll?.(); as configCheckBox) {\n      <div [class]=\"'flex libs-ui-border-bottom-general bg-[#ffffff] pl-[12px] '+(configTemplateCheckbox.classIncludeHasConfigCheckBoxAll ?? 'py-[6px] libs-ui-border-bottom-general')\">\n        <libs_ui-components-checkbox-single [label]=\"configCheckBox.label ?? 'i18n_all'\"\n          [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n          [checked]=\"(multiKeySelected()?.length && (multiKeySelected()?.length ||0) >= (store().length || -1)) || false\"\n          [disable]=\"loading() || disable() || false\"\n          (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n          (outChange)=\"handlerSelect($event.checked)\" />\n      </div>\n    }\n    <div #elementScroll\n      [class]=\"'relative h-full w-full ' +((!items() || !items().length) ? 'bg-[#ffffff]': configTemplateCheckbox.classListInclude || '')\">\n      @if (items() && items().length) {\n        <div LibsUiComponentsScrollOverlayDirective\n          class=\"w-full\"\n          [style.height]=\"heightViewPort() && !config()?.ignoreShowDataWhenNotSearch ? heightViewPort()+'px':'100%'\"\n          (outScrollBottom)=\"handlerScrollBottom()\">\n          <virtual-scroller #scroll\n            [parentScroll]=\"elementScroll\"\n            [items]=\"items()\"\n            class=\"h-full\">\n            @for (item of scroll.viewPortItems; track item()[fieldKey()]; let last = $last) {\n              <div [class]=\"last ? (configTemplateCheckbox.classIncludeLastViewItem || '') : ''\">\n                <div #itemRef\n                  LibsUiComponentsListHighlightKeySearchDirective\n                  [isHighlight]=\"config()?.highlightTextSearchInResult\"\n                  [keySearch]=\"keySearch()\"\n                  [attr.clickExactly]=\"clickExactly\"\n                  [class]=\"'libs-ui-list-template-checkbox-item flex ' + (configTemplateCheckbox.classItemInclude || '')\"\n                  [class.w-full]=\"!configTemplateCheckbox.ignoreItemWidth100\"\n                  [class.libs-ui-bg-list-hover]=\"!clickExactly()\"\n                  [class.libs-ui-bg-list-hover-active]=\"!clickExactly()\"\n                  [class.!pl-[12px]]=\"paddingLeftItem()\"\n                  [class.!py-[6px]]=\"clickExactly()\"\n                  [class.!pr-[4px]]=\"hasScroll() && configTemplateCheckbox.rows\"\n                  [class.!pr-[12px]]=\"!hasScroll() && configTemplateCheckbox.rows\"\n                  (click)=\"handlerChange($event,item())\">\n                  <div class=\"flex flex-col w-full\">\n                    @if (item().fieldLabel) {\n                      <libs_ui-components-checkbox-single [label]=\"item().fieldLabel\"\n                        [avatarConfig]=\"item().avatarConfig\"\n                        [linkImage]=\"configTemplateCheckbox.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateCheckbox.getImage:item()) | async) : item()[configTemplateCheckbox.fieldGetImage || '']\"\n                        [linkImageError]=\"configTemplateCheckbox.getImageError ? (('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateCheckbox.getImageError:item()) | async) : item()[configTemplateCheckbox.fieldGetLinkImageError || '']\"\n                        [classLabelInclude]=\"item().classLabelInclude || configTemplateCheckbox.classLabelInclude || ''\"\n                        [zIndexLabel]=\"configTemplateCheckbox.zIndexPopover ?? 1200\"\n                        [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length\"\n                        [key]=\"item()[fieldKey()]\"\n                        [imgTypeIcon]=\"configTemplateCheckbox.hasAvatarGroupSocial\"\n                        [linkImageError]=\"configTemplateCheckbox.fieldGetLinkImageError  || ''\"\n                        [classInclude]=\"configTemplateCheckbox.classInclude || ''\"\n                        [classImageInclude]=\"configTemplateCheckbox.classIncludeImage || ''\"\n                        [bullet]=\"item().bullet\"\n                        [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [popover]=\"item().dataPopover\"\n                        [clickExactly]=\"clickExactly()\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outChange)=\"handlerChange('checkbox',item())\"\n                        (outClickLabel)=\"handlerChange('checkbox',item())\" />\n                    }\n                    @if (configTemplateCheckbox?.rows) {\n                      <libs_ui-components-list-templates_rows class=\"{{ !configTemplateCheckbox.ignoreItemWidth100 ? 'w-full' : '' }} {{ configTemplateCheckbox.classRowsWrapper || configTemplateCheckbox.classRows ?? '' }}\"\n                        [item]=\"item()\"\n                        [zIndex]=\"zIndex()\"\n                        [fieldKey]=\"fieldKey()\"\n                        [keySelected]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) ? item()[fieldKey()] : undefined\"\n                        [configTemplate]=\"configTemplateCheckbox\"\n                        (outEvent)=\"handlerChange('checkbox',$event.item)\" />\n                    }\n                  </div>\n                </div>\n              </div>\n            }\n          </virtual-scroller>\n        </div>\n      }\n      @if ((!items() || !items().length) && (!config()?.ignoreShowDataWhenNotSearch || keySearch())) {\n        <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[4px] px-[12px]')\">\n          @if (config()?.hasIconNoData && !loading()) {\n            <div class=\"mb-[16px]\">\n              <div *ngComponentOutlet=\"(keySearch()  ? 'no-result' : 'no-data') | LibsUiIconsGetIconComponentPipe | async\"></div>\n            </div>\n          }\n          @if (!keySearch() && !loading()) {\n            <span>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</span>\n          }\n          @if (templateRefSearchNoData() && keySearch() && !loading()) {\n            <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n          }\n          @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n            <span>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</span>\n          }\n          @if (loading()) {\n            <span>&nbsp;</span>\n          }\n\n        </div>\n      }\n      @if (loading()) {\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      }\n    </div>\n  </div>\n}\n", styles: [".libs-ui-list-template-checkbox-item{padding:6px 0 6px 16px;margin-right:8px;font-size:12px;line-height:18px;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "component", type: i1$1.VirtualScrollerComponent, selector: "virtual-scroller,[virtualScroller]", inputs: ["executeRefreshOutsideAngularZone", "enableUnequalChildrenSizes", "RTL", "useMarginInsteadOfTranslate", "modifyOverflowStyleOfParentScroll", "stripedTable", "scrollbarWidth", "scrollbarHeight", "childWidth", "childHeight", "ssrChildWidth", "ssrChildHeight", "ssrViewportWidth", "ssrViewportHeight", "bufferAmount", "scrollAnimationTime", "resizeBypassRefreshThreshold", "scrollThrottlingTime", "scrollDebounceTime", "checkResizeInterval", "items", "compareItems", "horizontal", "parentScroll"], outputs: ["vsUpdate", "vsChange", "vsStart", "vsEnd"], exportAs: ["virtualScroller"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsCheckboxSingleComponent, selector: "libs_ui-components-checkbox-single", inputs: ["key", "checked", "label", "classLabelInclude", "ignoreShowPopoverLabel", "typeLabelPopover", "popover", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "classInclude", "clickExactly", "disable", "disableLabel", "ignoreCheckbox", "zIndexLabel", "stillOtherOptions", "error", "showBorderError", "description", "iconImageClass", "classIconInclude", "modeBorder"], outputs: ["checkedChange", "linkImageChange", "outChange", "outEventPopover", "outClickLabel", "outChangStageFlagMousePopover"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "pipe", type: LibsUiIconsGetIconComponentPipe, name: "LibsUiIconsGetIconComponentPipe" }, { kind: "directive", type: LibsUiComponentsListHighlightKeySearchDirective, selector: "[LibsUiComponentsListHighlightKeySearchDirective]", inputs: ["isHighlight", "keySearch", "classHighlight"] }, { kind: "component", type: LibsUiComponentsListRowsComponent, selector: "libs_ui-components-list-templates_rows", inputs: ["configTemplate", "item", "keySelected", "fieldKey", "zIndex"], outputs: ["outChangStageFlagMousePopover", "outEvent"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListCheckboxComponent, decorators: [{
             type: Component,
@@ -778,7 +778,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         LibsUiComponentsListHighlightKeySearchDirective,
                         LibsUiComponentsListRowsComponent,
                         LibsUiPipesCallFunctionInTemplatePipe
-                    ], template: "@if (configTemplateCheckbox(); as configTemplateCheckbox) {\n  <div class=\"flex flex-col w-full h-full\">\n    @if (items().length && configTemplateCheckbox.configButtonSelectAndUndSelectItem?.(); as configButtonSelectItem) {\n      <div [class]=\"'flex items-center bg-[#ffffff] '+(configButtonSelectItem.classInclude ?? 'libs-ui-border-bottom-general')\">\n        <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonCheckAll?.type ?? 'button-link-primary'\"\n          [label]=\"configButtonSelectItem.buttonCheckAll?.label ?? 'i18n_select_all_searched_results'\"\n          [classInclude]=\"configButtonSelectItem.buttonCheckAll?.classInclude || 'pr-[8px]'\"\n          [classLabel]=\"configButtonSelectItem.buttonCheckAll?.classLabel || 'libs-ui-font-h6r'\"\n          [disable]=\"loading() || disable() || false\"\n          (outClick)=\"handlerSelect(true)\" />\n        <div class=\"text-[#e6e7ea]\">|</div>\n        <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonUncheckAll?.type ?? 'button-link-primary'\"\n          [label]=\"configButtonSelectItem.buttonUncheckAll?.label ?? 'i18n_unselect_all_searched_results'\"\n          [classInclude]=\"configButtonSelectItem.buttonUncheckAll?.classInclude || 'pl-[8px]'\"\n          [classLabel]=\"configButtonSelectItem.buttonUncheckAll?.classLabel || 'libs-ui-font-h6r'\"\n          [disable]=\"loading() || disable() || false\"\n          (outClick)=\"handlerSelect(false)\" />\n      </div>\n    }\n    @if (items().length && configTemplateCheckbox.configCheckboxCheckAll?.(); as configCheckBox) {\n      <div [class]=\"'flex libs-ui-border-bottom-general bg-[#ffffff] pl-[12px] '+(configTemplateCheckbox.classIncludeHasConfigCheckBoxAll ?? 'py-[6px] libs-ui-border-bottom-general')\">\n        <libs_ui-components-checkbox-single [label]=\"configCheckBox.label ?? 'i18n_all'\"\n          [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n          [checked]=\"(multiKeySelected()?.length && (multiKeySelected()?.length ||0) >= (store().length || -1)) || false\"\n          [disable]=\"loading() || disable() || false\"\n          (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n          (outChange)=\"handlerSelect($event.checked)\" />\n      </div>\n    }\n    <div #elementScroll\n      [class]=\"'relative h-full w-full ' +((!items() || !items().length) ? 'bg-[#ffffff]': configTemplateCheckbox.classListInclude || '')\">\n      @if (items() && items().length) {\n        <div LibsUiComponentsScrollOverlayDirective\n          class=\"w-full\"\n          [style.height]=\"heightViewPort() && !config()?.ignoreShowDataWhenNotSearch ? heightViewPort()+'px':'100%'\"\n          (outScrollBottom)=\"handlerScrollBottom()\">\n          <virtual-scroller #scroll\n            [parentScroll]=\"elementScroll\"\n            [items]=\"items()\"\n            class=\"h-full\">\n            @for (item of scroll.viewPortItems; track item()[fieldKey()]; let last = $last) {\n              <div [class]=\"last ? (configTemplateCheckbox.classIncludeLastViewItem || '') : ''\">\n                <div #itemRef\n                  LibsUiComponentsListHighlightKeySearchDirective\n                  [isHighlight]=\"config()?.highlightTextSearchInResult\"\n                  [keySearch]=\"keySearch()\"\n                  [attr.clickExactly]=\"clickExactly\"\n                  [class]=\"'libs-ui-list-template-checkbox-item flex ' + (configTemplateCheckbox.classItemInclude || '')\"\n                  [class.w-full]=\"!configTemplateCheckbox.ignoreItemWidth100\"\n                  [class.libs-ui-bg-list-hover]=\"!clickExactly()\"\n                  [class.libs-ui-bg-list-hover-active]=\"!clickExactly()\"\n                  [class.pl-[12px]]=\"paddingLeftItem()\"\n                  [class.py-[6px]]=\"clickExactly()\"\n                  [class.pr-[4px]]=\"hasScroll() && configTemplateCheckbox.rows\"\n                  [class.pr-[12px]]=\"!hasScroll() && configTemplateCheckbox.rows\"\n                  (click)=\"handlerChange($event,item())\">\n                  <div class=\"flex flex-col w-full\">\n                    @if (item().fieldLabel) {\n                      <libs_ui-components-checkbox-single [label]=\"item().fieldLabel\"\n                        [avatarConfig]=\"item().avatarConfig\"\n                        [linkImage]=\"configTemplateCheckbox.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateCheckbox.getImage:item()) | async) : item()[configTemplateCheckbox.fieldGetImage || '']\"\n                        [linkImageError]=\"configTemplateCheckbox.getImageError ? (('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateCheckbox.getImageError:item()) | async) : item()[configTemplateCheckbox.fieldGetLinkImageError || '']\"\n                        [classLabelInclude]=\"item().classLabelInclude || configTemplateCheckbox.classLabelInclude || ''\"\n                        [zIndexLabel]=\"configTemplateCheckbox.zIndexPopover ?? 1200\"\n                        [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length\"\n                        [key]=\"item()[fieldKey()]\"\n                        [imgTypeIcon]=\"configTemplateCheckbox.hasAvatarGroupSocial\"\n                        [linkImageError]=\"configTemplateCheckbox.fieldGetLinkImageError  || ''\"\n                        [classInclude]=\"configTemplateCheckbox.classInclude || ''\"\n                        [classImageInclude]=\"configTemplateCheckbox.classIncludeImage || ''\"\n                        [bullet]=\"item().bullet\"\n                        [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [popover]=\"item().dataPopover\"\n                        [clickExactly]=\"clickExactly()\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outChange)=\"handlerChange('checkbox',item())\"\n                        (outClickLabel)=\"handlerChange('checkbox',item())\" />\n                    }\n                    @if (configTemplateCheckbox?.rows) {\n                      <libs_ui-components-list-templates_rows class=\"{{ !configTemplateCheckbox.ignoreItemWidth100 ? 'w-full' : '' }} {{ configTemplateCheckbox.classRowsWrapper || configTemplateCheckbox.classRows ?? '' }}\"\n                        [item]=\"item()\"\n                        [zIndex]=\"zIndex()\"\n                        [fieldKey]=\"fieldKey()\"\n                        [keySelected]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) ? item()[fieldKey()] : undefined\"\n                        [configTemplate]=\"configTemplateCheckbox\"\n                        (outEvent)=\"handlerChange('checkbox',$event.item)\" />\n                    }\n                  </div>\n                </div>\n              </div>\n            }\n          </virtual-scroller>\n        </div>\n      }\n      @if ((!items() || !items().length) && (!config()?.ignoreShowDataWhenNotSearch || keySearch())) {\n        <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[4px] px-[12px]')\">\n          @if (config()?.hasIconNoData && !loading()) {\n            <div class=\"mb-[16px]\">\n              <div *ngComponentOutlet=\"(keySearch()  ? 'no-result' : 'no-data') | LibsUiIconsGetIconComponentPipe | async\"></div>\n            </div>\n          }\n          @if (!keySearch() && !loading()) {\n            <span>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</span>\n          }\n          @if (templateRefSearchNoData() && keySearch() && !loading()) {\n            <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n          }\n          @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n            <span>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</span>\n          }\n          @if (loading()) {\n            <span>&nbsp;</span>\n          }\n\n        </div>\n      }\n      @if (loading()) {\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      }\n    </div>\n  </div>\n}\n", styles: [".libs-ui-list-template-checkbox-item{padding:6px 0 6px 16px;margin-right:8px;font-size:12px;line-height:18px;position:relative}\n"] }]
+                    ], template: "@if (configTemplateCheckbox(); as configTemplateCheckbox) {\n  <div class=\"flex flex-col w-full h-full\">\n    @if (items().length && configTemplateCheckbox.configButtonSelectAndUndSelectItem?.(); as configButtonSelectItem) {\n      <div [class]=\"'flex items-center bg-[#ffffff] '+(configButtonSelectItem.classInclude ?? 'libs-ui-border-bottom-general')\">\n        <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonCheckAll?.type ?? 'button-link-primary'\"\n          [label]=\"configButtonSelectItem.buttonCheckAll?.label ?? 'i18n_select_all_searched_results'\"\n          [classInclude]=\"configButtonSelectItem.buttonCheckAll?.classInclude || 'pr-[8px]'\"\n          [classLabel]=\"configButtonSelectItem.buttonCheckAll?.classLabel || 'libs-ui-font-h6r'\"\n          [disable]=\"loading() || disable() || false\"\n          (outClick)=\"handlerSelect(true)\" />\n        <div class=\"text-[#e6e7ea]\">|</div>\n        <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonUncheckAll?.type ?? 'button-link-primary'\"\n          [label]=\"configButtonSelectItem.buttonUncheckAll?.label ?? 'i18n_unselect_all_searched_results'\"\n          [classInclude]=\"configButtonSelectItem.buttonUncheckAll?.classInclude || 'pl-[8px]'\"\n          [classLabel]=\"configButtonSelectItem.buttonUncheckAll?.classLabel || 'libs-ui-font-h6r'\"\n          [disable]=\"loading() || disable() || false\"\n          (outClick)=\"handlerSelect(false)\" />\n      </div>\n    }\n    @if (items().length && configTemplateCheckbox.configCheckboxCheckAll?.(); as configCheckBox) {\n      <div [class]=\"'flex libs-ui-border-bottom-general bg-[#ffffff] pl-[12px] '+(configTemplateCheckbox.classIncludeHasConfigCheckBoxAll ?? 'py-[6px] libs-ui-border-bottom-general')\">\n        <libs_ui-components-checkbox-single [label]=\"configCheckBox.label ?? 'i18n_all'\"\n          [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n          [checked]=\"(multiKeySelected()?.length && (multiKeySelected()?.length ||0) >= (store().length || -1)) || false\"\n          [disable]=\"loading() || disable() || false\"\n          (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n          (outChange)=\"handlerSelect($event.checked)\" />\n      </div>\n    }\n    <div #elementScroll\n      [class]=\"'relative h-full w-full ' +((!items() || !items().length) ? 'bg-[#ffffff]': configTemplateCheckbox.classListInclude || '')\">\n      @if (items() && items().length) {\n        <div LibsUiComponentsScrollOverlayDirective\n          class=\"w-full\"\n          [style.height]=\"heightViewPort() && !config()?.ignoreShowDataWhenNotSearch ? heightViewPort()+'px':'100%'\"\n          (outScrollBottom)=\"handlerScrollBottom()\">\n          <virtual-scroller #scroll\n            [parentScroll]=\"elementScroll\"\n            [items]=\"items()\"\n            class=\"h-full\">\n            @for (item of scroll.viewPortItems; track item()[fieldKey()]; let last = $last) {\n              <div [class]=\"last ? (configTemplateCheckbox.classIncludeLastViewItem || '') : ''\">\n                <div #itemRef\n                  LibsUiComponentsListHighlightKeySearchDirective\n                  [isHighlight]=\"config()?.highlightTextSearchInResult\"\n                  [keySearch]=\"keySearch()\"\n                  [attr.clickExactly]=\"clickExactly\"\n                  [class]=\"'libs-ui-list-template-checkbox-item flex ' + (configTemplateCheckbox.classItemInclude || '')\"\n                  [class.w-full]=\"!configTemplateCheckbox.ignoreItemWidth100\"\n                  [class.libs-ui-bg-list-hover]=\"!clickExactly()\"\n                  [class.libs-ui-bg-list-hover-active]=\"!clickExactly()\"\n                  [class.!pl-[12px]]=\"paddingLeftItem()\"\n                  [class.!py-[6px]]=\"clickExactly()\"\n                  [class.!pr-[4px]]=\"hasScroll() && configTemplateCheckbox.rows\"\n                  [class.!pr-[12px]]=\"!hasScroll() && configTemplateCheckbox.rows\"\n                  (click)=\"handlerChange($event,item())\">\n                  <div class=\"flex flex-col w-full\">\n                    @if (item().fieldLabel) {\n                      <libs_ui-components-checkbox-single [label]=\"item().fieldLabel\"\n                        [avatarConfig]=\"item().avatarConfig\"\n                        [linkImage]=\"configTemplateCheckbox.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateCheckbox.getImage:item()) | async) : item()[configTemplateCheckbox.fieldGetImage || '']\"\n                        [linkImageError]=\"configTemplateCheckbox.getImageError ? (('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateCheckbox.getImageError:item()) | async) : item()[configTemplateCheckbox.fieldGetLinkImageError || '']\"\n                        [classLabelInclude]=\"item().classLabelInclude || configTemplateCheckbox.classLabelInclude || ''\"\n                        [zIndexLabel]=\"configTemplateCheckbox.zIndexPopover ?? 1200\"\n                        [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length\"\n                        [key]=\"item()[fieldKey()]\"\n                        [imgTypeIcon]=\"configTemplateCheckbox.hasAvatarGroupSocial\"\n                        [linkImageError]=\"configTemplateCheckbox.fieldGetLinkImageError  || ''\"\n                        [classInclude]=\"configTemplateCheckbox.classInclude || ''\"\n                        [classImageInclude]=\"configTemplateCheckbox.classIncludeImage || ''\"\n                        [bullet]=\"item().bullet\"\n                        [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [popover]=\"item().dataPopover\"\n                        [clickExactly]=\"clickExactly()\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outChange)=\"handlerChange('checkbox',item())\"\n                        (outClickLabel)=\"handlerChange('checkbox',item())\" />\n                    }\n                    @if (configTemplateCheckbox?.rows) {\n                      <libs_ui-components-list-templates_rows class=\"{{ !configTemplateCheckbox.ignoreItemWidth100 ? 'w-full' : '' }} {{ configTemplateCheckbox.classRowsWrapper || configTemplateCheckbox.classRows ?? '' }}\"\n                        [item]=\"item()\"\n                        [zIndex]=\"zIndex()\"\n                        [fieldKey]=\"fieldKey()\"\n                        [keySelected]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) ? item()[fieldKey()] : undefined\"\n                        [configTemplate]=\"configTemplateCheckbox\"\n                        (outEvent)=\"handlerChange('checkbox',$event.item)\" />\n                    }\n                  </div>\n                </div>\n              </div>\n            }\n          </virtual-scroller>\n        </div>\n      }\n      @if ((!items() || !items().length) && (!config()?.ignoreShowDataWhenNotSearch || keySearch())) {\n        <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[4px] px-[12px]')\">\n          @if (config()?.hasIconNoData && !loading()) {\n            <div class=\"mb-[16px]\">\n              <div *ngComponentOutlet=\"(keySearch()  ? 'no-result' : 'no-data') | LibsUiIconsGetIconComponentPipe | async\"></div>\n            </div>\n          }\n          @if (!keySearch() && !loading()) {\n            <span>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</span>\n          }\n          @if (templateRefSearchNoData() && keySearch() && !loading()) {\n            <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n          }\n          @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n            <span>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</span>\n          }\n          @if (loading()) {\n            <span>&nbsp;</span>\n          }\n\n        </div>\n      }\n      @if (loading()) {\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      }\n    </div>\n  </div>\n}\n", styles: [".libs-ui-list-template-checkbox-item{padding:6px 0 6px 16px;margin-right:8px;font-size:12px;line-height:18px;position:relative}\n"] }]
         }] });
 
 class LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe {
@@ -901,8 +901,11 @@ class LibsUiComponentsListGroupItemComponent {
     /* FUNCTIONS */
     handlerToggleExpand(e, item) {
         e.stopPropagation();
-        item.expand = !item.expand;
-        this.outChangeView.emit(item.expand);
+        item.update(current => {
+            current.expand = !current.expand;
+            return current;
+        });
+        this.outChangeView.emit(item().expand);
     }
     handlerChangeView(expand) {
         this.outChangeView.emit(expand);
@@ -926,7 +929,7 @@ class LibsUiComponentsListGroupItemComponent {
         this.outChangStageFlagMouseTooltip.emit(flag);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListGroupItemComponent, isStandalone: true, selector: "libs_ui-components-list-templates_group-item", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, configTemplateGroup: { classPropertyName: "configTemplateGroup", publicName: "configTemplateGroup", isSignal: true, isRequired: false, transformFunction: null }, keySearch: { classPropertyName: "keySearch", publicName: "keySearch", isSignal: true, isRequired: false, transformFunction: null }, fieldKey: { classPropertyName: "fieldKey", publicName: "fieldKey", isSignal: true, isRequired: false, transformFunction: null }, keysChecked: { classPropertyName: "keysChecked", publicName: "keysChecked", isSignal: true, isRequired: false, transformFunction: null }, keysDisableItem: { classPropertyName: "keysDisableItem", publicName: "keysDisableItem", isSignal: true, isRequired: false, transformFunction: null }, parentItem: { classPropertyName: "parentItem", publicName: "parentItem", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, disableLabel: { classPropertyName: "disableLabel", publicName: "disableLabel", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, keysStillOtherOptions: { classPropertyName: "keysStillOtherOptions", publicName: "keysStillOtherOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outChangeView: "outChangeView", outChange: "outChange", outChangStageFlagMouseTooltip: "outChangStageFlagMouseTooltip" }, ngImport: i0, template: "@if (configTemplateGroup(); as configTemplateGroup) {\n  @if ((configTemplateGroup.isViewTree && !!items().length) || (parentItem().maxLevelGroup > 2 && parentItem().level > 1)) {\n    <div class='libs-ui-list-group-item-line-vertical'\n      [style.left.px]=\"parentItem().level | LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe:parentItem().maxLevelGroup:configTemplateGroup.isViewTree :configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\">\n    </div>\n  }\n  @for (item of items(); track item()[fieldKey()]) {\n    <div>\n      <div\n        [style.marginLeft.px]=\"item().level | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:item().maxLevelGroup:configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\"\n        [style.paddingLeft.px]=\"item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe:item().maxLevelGroup:configTemplateGroup.isViewTree:configTemplateGroup.isViewTreeJson:!!item()[configTemplateGroup.fieldGetItems]?.length\"\n        [class]=\"'libs-ui-bg-list-hover py-[6px] pr-[16px] flex items-center relative libs-ui-bg-list-hover-active ' + item()?.classInclude\"\n        [class.libs-ui-bg-list-active]=\"configTemplateGroup.singleSelectItem && item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n        [class.libs-ui-disable]=\"configTemplateGroup.allowDisableLabel && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n        [class.pointer-events-none]=\"configTemplateGroup.allowDisableLabel && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n        [class.cursor-pointer]=\"!disable() && !(configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) && !(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n        [class.libs-ui-bg-list-active]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.hasBackgroundColorWhenItemSelected && item().isCheckManual\"\n        (click)=\"handlerChangeChecked(item(), item()[fieldKey()], disable() || (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup))\">\n        @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTree) {\n          <i class=\"libs-ui-icon-chevron-right\"\n            [class.rotate-90]=\"item().expand\"\n            (click)=\"handlerToggleExpand($event,item)\">\n          </i>\n        }\n        @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.length) {\n          <div [class]=\"'p-[5px]'\">\n            <div [class]=\"'libs-ui-list-group-json_icon-item-parent'\"\n              [attr.disabled]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\">\n            </div>\n          </div>\n        }\n        @if (!configTemplateGroup.isViewRadio) {\n          <libs_ui-components-checkbox-single [avatarConfig]=\"item().avatarConfig\"\n            [class.ml-[8px]]=\"configTemplateGroup.isViewTree || (configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.length)\"\n            [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.singleSelectItem\"\n            [class]=\"configTemplateGroup.classIncludeItem || ''\"\n            [class.-w-auto]=\"configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem\"\n            [class.max-w-[calc(100%\n            -\n            12px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && configTemplateGroup.ignoreIconExpandMarginRight\"\n            [class.max-w-[calc(100%-24px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || (configTemplateGroup.widthLabelSub24WhenNotTreeView && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey))) && !configTemplateGroup.ignoreIconExpandMarginRight\"\n            [clickExactly]=\"false\"\n            [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n            [disable]=\"disable() || (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup && !configTemplateGroup.isViewTreeJson) || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\"\n            [label]=\"item().fieldLabel\"\n            [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n            [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysStillOtherOptions():keysStillOtherOptions().length\"\n            [classLabelInclude]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual ? 'mo-lib-color-global mo-lib-font-head-5' : 'mo-lib-font-head-5'\"\n            [popover]=\"item().dataPopover\"\n            [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateGroup.getImage:item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n            [linkImageError]=\"configTemplateGroup.getLinkImageError ? (('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateGroup.getLinkImageError:item()) | async) : ''\"\n            [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n            [iconImageClass]=\"item().iconImageClass ? item().iconImageClass : undefined\"\n            [classImageInclude]=\"configTemplateGroup.classImageInclude || ''\"\n            (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n            (outEventPopover)=\"handlerEventPopover($event, item())\"\n            (outChange)=\"handlerChangeChecked(item())\" />\n        }\n        @if (configTemplateGroup.isViewRadio) {\n          <libs_ui-components-radio-single [avatarConfig]=\"item().avatarConfig\"\n            [class.ml-[8px]]=\"configTemplateGroup.isViewTree\"\n            [ignoreRadio]=\"configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem\"\n            [class]=\"configTemplateGroup.classIncludeItem || ''\"\n            [class.w-auto]=\"configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem\"\n            [class.max-w-[calc(100%\n            -\n            12px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && configTemplateGroup.ignoreIconExpandMarginRight\"\n            [class.max-w-[calc(100%\n            -\n            24px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && !configTemplateGroup.ignoreIconExpandMarginRight\"\n            [clickExactly]=\"false\"\n            [disable]=\"disable() || (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.length)||(configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\"\n            [label]=\"item().fieldLabel\"\n            [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n            [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n            [classLabelInclude]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual ? 'text-[#009cdb]': ''\"\n            [popover]=\"item().dataPopover\"\n            [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n            (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n            (outChange)=\"handlerChangeChecked(item)\" />\n        }\n        @if ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey)) {\n          <i class=\"libs-ui-icon-check\"\n            [class.ml-[8px]]=\"item().dataPopover\"\n            [class.libs-ui-icon-check]=\"configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\">\n          </i>\n        }\n        @if (!!item()[configTemplateGroup.fieldGetItems]?.length && !configTemplateGroup.isViewTree && !configTemplateGroup.isViewTreeJson) {\n          <i class=\"libs-ui-icon-chevron-right\"\n            [class.rotate-90]=\"item().expand\"\n            [class.ml-[8px]]=\"item().dataPopover\"\n            (click)=\"handlerToggleExpand($event,item())\">\n          </i>\n        }\n      </div>\n      @if (item().expand || configTemplateGroup.isViewTreeJson) {\n        @if (item().level < item().maxLevelGroup && !item()[configTemplateGroup.fieldGetItems]?.length && configTemplateGroup.isViewTree) {\n          <div class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n            [style.marginLeft.px]=\"(item().level + 1) | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:(item().maxLevelGroup+1):configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n            [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n            [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n            <div [class]=\"item().classIncludeItemNoData || ''\">\n              @if (!keySearch()) {\n                <span>{{ 'i18n_no_data_yet' | translate }}</span>\n              }\n              @if (keySearch()) {\n                <span>{{ 'i18n_no_result' | translate }}</span>\n              }\n            </div>\n          </div>\n        }\n        @if (!!item()[configTemplateGroup.fieldGetItems]?.length) {\n          <libs_ui-components-list-templates_group-item [keySearch]=\"keySearch()\"\n            [items]=\"item()[configTemplateGroup.fieldGetItems]\"\n            [parentItem]=\"item()\"\n            [fieldKey]=\"fieldKey()\"\n            [keysChecked]=\"keysChecked()\"\n            [disable]=\"(disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)) && !configTemplateGroup.isViewTreeJson\"\n            [keysDisableItem]=\"keysDisableItem()\"\n            [configTemplateGroup]=\"configTemplateGroup\"\n            (outChangStageFlagMouseTooltip)='handlerChangStageFlagMouse($event)'\n            (outChangeView)=\"handlerChangeView($event)\"\n            (outChange)=\"handlerChangeChecked($event.item)\" />\n        }\n      }\n    </div>\n  }\n  @if ((!items() || !items().length) && (parentItem().level < parentItem().maxLevelGroup)) {\n    <div class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n      [style.marginLeft.px]=\"(parentItem().level + 1) | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:(parentItem().maxLevelGroup+1):configTemplateGroup.isViewTree:configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n      [style.paddingLeft.px]=\"(parentItem().level + 1) | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe:(parentItem().maxLevelGroup+1):configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:false\"\n      [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n      [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n      <div [class]=\"parentItem().classIncludeItemNoData || ''\">\n        @if (parentItem().iconEmptyDataInGroup) {\n          <div class=\"pb-[16px]\">\n            <ng-container *ngComponentOutlet=\"(keySearch()  ? 'no-result' : 'no-data') | LibsUiIconsGetIconComponentPipe | async\" />\n          </div>\n        }\n        @if (!keySearch()) {\n          <span>{{ ( parentItem().textDescriptionGroupWhenNoData ?? config()?.textNoData ?? 'i18n_no_result') | translate }}</span>\n        }\n        @if (keySearch()) {\n          <span>{{ 'i18n_no_result' | translate }}</span>\n        }\n      </div>\n    </div>\n  }\n}\n", styles: [":host{position:relative}:host .libs-ui-list-group-item-line-vertical{position:absolute;width:1px;height:100%;background-color:#e6e7ea}.libs-ui--icon-check{--color: var(--libs-ui-color-default, #226FF5)}.libs-ui-icon-check:before{font-size:16px;color:var(--libs-ui-color-default, #226FF5)}[class*=libs-ui-icon-chevron]:before{color:#6a7383}.libs-ui-list-group-json_icon-item-parent{min-width:6px;min-height:6px;height:6px;width:6px;border-radius:50%;background-color:#226ff5}.libs-ui-list-group-json_icon-item-parent[disabled=true]{background-color:#6a7383!important}\n"], dependencies: [{ kind: "component", type: LibsUiComponentsListGroupItemComponent, selector: "libs_ui-components-list-templates_group-item", inputs: ["items", "configTemplateGroup", "keySearch", "fieldKey", "keysChecked", "keysDisableItem", "parentItem", "disable", "disableLabel", "config", "keysStillOtherOptions"], outputs: ["outChangeView", "outChange", "outChangStageFlagMouseTooltip"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe, name: "LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe" }, { kind: "pipe", type: LibsUiComponentsListGroupCalculatorMarginLeftItemPipe, name: "LibsUiComponentsListGroupCalculatorMarginLeftItemPipe" }, { kind: "pipe", type: LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe, name: "LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe" }, { kind: "pipe", type: LibsUiIconsGetIconComponentPipe, name: "LibsUiIconsGetIconComponentPipe" }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "component", type: LibsUiComponentsCheckboxSingleComponent, selector: "libs_ui-components-checkbox-single", inputs: ["key", "checked", "label", "classLabelInclude", "ignoreShowPopoverLabel", "typeLabelPopover", "popover", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "classInclude", "clickExactly", "disable", "disableLabel", "ignoreCheckbox", "zIndexLabel", "stillOtherOptions", "error", "showBorderError", "description", "iconImageClass", "classIconInclude", "modeBorder"], outputs: ["checkedChange", "linkImageChange", "outChange", "outEventPopover", "outClickLabel", "outChangStageFlagMousePopover"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabe", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon"], outputs: ["activeChange", "outClickLabel", "outChange", "outChangStageFlagMousePopover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListGroupItemComponent, isStandalone: true, selector: "libs_ui-components-list-templates_group-item", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, configTemplateGroup: { classPropertyName: "configTemplateGroup", publicName: "configTemplateGroup", isSignal: true, isRequired: false, transformFunction: null }, keySearch: { classPropertyName: "keySearch", publicName: "keySearch", isSignal: true, isRequired: false, transformFunction: null }, fieldKey: { classPropertyName: "fieldKey", publicName: "fieldKey", isSignal: true, isRequired: false, transformFunction: null }, keysChecked: { classPropertyName: "keysChecked", publicName: "keysChecked", isSignal: true, isRequired: false, transformFunction: null }, keysDisableItem: { classPropertyName: "keysDisableItem", publicName: "keysDisableItem", isSignal: true, isRequired: false, transformFunction: null }, parentItem: { classPropertyName: "parentItem", publicName: "parentItem", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, disableLabel: { classPropertyName: "disableLabel", publicName: "disableLabel", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, keysStillOtherOptions: { classPropertyName: "keysStillOtherOptions", publicName: "keysStillOtherOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outChangeView: "outChangeView", outChange: "outChange", outChangStageFlagMouseTooltip: "outChangStageFlagMouseTooltip" }, ngImport: i0, template: "@if (configTemplateGroup(); as configTemplateGroup) {\n  @if ((configTemplateGroup.isViewTree && !!items().length) || (parentItem().maxLevelGroup > 2 && parentItem().level > 1)) {\n    <div class='libs-ui-list-group-item-line-vertical'\n      [style.left.px]=\"parentItem().level | LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe:parentItem().maxLevelGroup:configTemplateGroup.isViewTree :configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\">\n    </div>\n  }\n  @if (items() && items().length) {\n    @for (item of items(); track item()[fieldKey()]) {\n      <div>\n        <div\n          [style.marginLeft.px]=\"item().level | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:item().maxLevelGroup:configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\"\n          [style.paddingLeft.px]=\"item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe:item().maxLevelGroup:configTemplateGroup.isViewTree:configTemplateGroup.isViewTreeJson:!!item()[configTemplateGroup.fieldGetItems]?.()?.length\"\n          [class]=\"'libs-ui-bg-list-hover py-[6px] pr-[16px] flex items-center relative libs-ui-bg-list-hover-active ' + item()?.classInclude\"\n          [class.libs-ui-bg-list-active]=\"configTemplateGroup.singleSelectItem && item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n          [class.libs-ui-disable]=\"configTemplateGroup.allowDisableLabel && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n          [class.pointer-events-none]=\"configTemplateGroup.allowDisableLabel && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n          [class.cursor-pointer]=\"!disable() && !(configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) && !(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n          [class.libs-ui-bg-list-active]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.hasBackgroundColorWhenItemSelected && item().isCheckManual\"\n          (click)=\"handlerChangeChecked(item(), item()[fieldKey()], disable() || (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup))\">\n          @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTree) {\n            <i class=\"libs-ui-icon-chevron-right\"\n              [class.rotate-90]=\"item().expand\"\n              (click)=\"handlerToggleExpand($event,item)\">\n            </i>\n          }\n          @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]()?.length) {\n            <div [class]=\"'p-[5px]'\">\n              <div [class]=\"'libs-ui-list-group-json_icon-item-parent'\"\n                [attr.disabled]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\">\n              </div>\n            </div>\n          }\n          @if (!configTemplateGroup.isViewRadio) {\n            <libs_ui-components-checkbox-single [avatarConfig]=\"item().avatarConfig\"\n              [class.ml-[8px]]=\"configTemplateGroup.isViewTree || (configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.()?.length)\"\n              [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.singleSelectItem\"\n              [class]=\"configTemplateGroup.classIncludeItem || ''\"\n              [class.-w-auto]=\"configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem\"\n              [class.max-w-[calc(100%-12px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && configTemplateGroup.ignoreIconExpandMarginRight\"\n              [class.max-w-[calc(100%-24px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || (configTemplateGroup.widthLabelSub24WhenNotTreeView && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey))) && !configTemplateGroup.ignoreIconExpandMarginRight\"\n              [clickExactly]=\"false\"\n              [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n              [disable]=\"disable() || (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup && !configTemplateGroup.isViewTreeJson) || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\"\n              [label]=\"item().fieldLabel\"\n              [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n              [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysStillOtherOptions():keysStillOtherOptions().length\"\n              [classLabelInclude]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual ? 'libs-ui-color-default libs-ui-font-h5r' : 'libs-ui-font-h5r'\"\n              [popover]=\"item().dataPopover\"\n              [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateGroup.getImage:item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n              [linkImageError]=\"configTemplateGroup.getLinkImageError ? (('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateGroup.getLinkImageError:item()) | async) : ''\"\n              [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n              [iconImageClass]=\"item().iconImageClass ? item().iconImageClass : undefined\"\n              [classImageInclude]=\"configTemplateGroup.classImageInclude || ''\"\n              (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n              (outEventPopover)=\"handlerEventPopover($event, item())\"\n              (outChange)=\"handlerChangeChecked(item())\" />\n          }\n          @if (configTemplateGroup.isViewRadio) {\n            <libs_ui-components-radio-single [avatarConfig]=\"item().avatarConfig\"\n              [class.!ml-[8px]]=\"configTemplateGroup.isViewTree\"\n              [ignoreRadio]=\"configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem\"\n              [class]=\"configTemplateGroup.classIncludeItem || ''\"\n              [class.w-auto]=\"configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem\"\n              [class.max-w-[calc(100%-12px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && configTemplateGroup.ignoreIconExpandMarginRight\"\n              [class.max-w-[calc(100%-24px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && !configTemplateGroup.ignoreIconExpandMarginRight\"\n              [clickExactly]=\"false\"\n              [disable]=\"disable() || (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length)||(configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\"\n              [label]=\"item().fieldLabel\"\n              [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n              [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n              [classLabelInclude]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual ? 'text-[#009cdb] libs-ui-font-h5r ': ' libs-ui-font-h5r '\"\n              [popover]=\"item().dataPopover\"\n              [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n              (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n              (outChange)=\"handlerChangeChecked(item())\" />\n          }\n          @if ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey)) {\n            <i class=\"libs-ui-icon-check\"\n              [class.!ml-[8px]]=\"item().dataPopover\"\n              [class.libs-ui-icon-check]=\"configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\">\n            </i>\n          }\n          @if (!!item()[configTemplateGroup.fieldGetItems]?.()?.length && !configTemplateGroup.isViewTree && !configTemplateGroup.isViewTreeJson) {\n            <i class=\"libs-ui-icon-chevron-right\"\n              [class.rotate-90]=\"item().expand\"\n              [class.!ml-[8px]]=\"item().dataPopover\"\n              (click)=\"handlerToggleExpand($event,item)\">\n            </i>\n          }\n        </div>\n        @if (item().expand || configTemplateGroup.isViewTreeJson) {\n          @if (item().level < item().maxLevelGroup && !item()[configTemplateGroup.fieldGetItems]?.()?.length && configTemplateGroup.isViewTree) {\n            <div class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n              [style.marginLeft.px]=\"(item().level + 1) | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:(item().maxLevelGroup+1):configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n              [class.!py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n              [class.!py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n              <div [class]=\"item().classIncludeItemNoData || ''\">\n                @if (!keySearch()) {\n                  <span>{{ 'i18n_no_data_yet' | translate }}</span>\n                }\n                @if (keySearch()) {\n                  <span>{{ 'i18n_no_result' | translate }}</span>\n                }\n              </div>\n            </div>\n          }\n          @if (!!item()[configTemplateGroup.fieldGetItems]?.()?.length) {\n            <libs_ui-components-list-templates_group-item [keySearch]=\"keySearch()\"\n              [items]=\"item()[configTemplateGroup.fieldGetItems]()\"\n              [parentItem]=\"item()\"\n              [fieldKey]=\"fieldKey()\"\n              [keysChecked]=\"keysChecked()\"\n              [disable]=\"(disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)) && !configTemplateGroup.isViewTreeJson\"\n              [keysDisableItem]=\"keysDisableItem()\"\n              [configTemplateGroup]=\"configTemplateGroup\"\n              (outChangStageFlagMouseTooltip)='handlerChangStageFlagMouse($event)'\n              (outChangeView)=\"handlerChangeView($event)\"\n              (outChange)=\"handlerChangeChecked($event.item)\" />\n          }\n        }\n      </div>\n    }\n  }\n\n  @if ((!items() || !items().length) && (parentItem().level < parentItem().maxLevelGroup)) {\n    <div class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n      [style.marginLeft.px]=\"(parentItem().level + 1) | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:(parentItem().maxLevelGroup+1):configTemplateGroup.isViewTree:configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n      [style.paddingLeft.px]=\"(parentItem().level + 1) | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe:(parentItem().maxLevelGroup+1):configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:false\"\n      [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n      [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n      <div [class]=\"parentItem().classIncludeItemNoData || ''\">\n        @if (parentItem().iconEmptyDataInGroup) {\n          <div class=\"pb-[16px]\">\n            <ng-container *ngComponentOutlet=\"(keySearch()  ? 'no-result' : 'no-data') | LibsUiIconsGetIconComponentPipe | async\" />\n          </div>\n        }\n        @if (!keySearch()) {\n          <span>{{ ( parentItem().textDescriptionGroupWhenNoData ?? config()?.textNoData ?? 'i18n_no_result') | translate }}</span>\n        }\n        @if (keySearch()) {\n          <span>{{ 'i18n_no_result' | translate }}</span>\n        }\n      </div>\n    </div>\n  }\n}\n", styles: [":host{position:relative}:host .libs-ui-list-group-item-line-vertical{position:absolute;width:1px;height:100%;background-color:#e6e7ea}.libs-ui--icon-check{--color: var(--libs-ui-color-default, #226FF5)}.libs-ui--icon-check:before{font-size:16px;color:var(--libs-ui-color-default, #226FF5)}[class*=libs-ui-icon-chevron]:before{color:#6a7383}.libs-ui-list-group-json_icon-item-parent{min-width:6px;min-height:6px;height:6px;width:6px;border-radius:50%;background-color:#226ff5}.libs-ui-list-group-json_icon-item-parent[disabled=true]{background-color:#6a7383!important}\n"], dependencies: [{ kind: "component", type: LibsUiComponentsListGroupItemComponent, selector: "libs_ui-components-list-templates_group-item", inputs: ["items", "configTemplateGroup", "keySearch", "fieldKey", "keysChecked", "keysDisableItem", "parentItem", "disable", "disableLabel", "config", "keysStillOtherOptions"], outputs: ["outChangeView", "outChange", "outChangStageFlagMouseTooltip"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe, name: "LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe" }, { kind: "pipe", type: LibsUiComponentsListGroupCalculatorMarginLeftItemPipe, name: "LibsUiComponentsListGroupCalculatorMarginLeftItemPipe" }, { kind: "pipe", type: LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe, name: "LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe" }, { kind: "pipe", type: LibsUiIconsGetIconComponentPipe, name: "LibsUiIconsGetIconComponentPipe" }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "component", type: LibsUiComponentsCheckboxSingleComponent, selector: "libs_ui-components-checkbox-single", inputs: ["key", "checked", "label", "classLabelInclude", "ignoreShowPopoverLabel", "typeLabelPopover", "popover", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "classInclude", "clickExactly", "disable", "disableLabel", "ignoreCheckbox", "zIndexLabel", "stillOtherOptions", "error", "showBorderError", "description", "iconImageClass", "classIconInclude", "modeBorder"], outputs: ["checkedChange", "linkImageChange", "outChange", "outEventPopover", "outClickLabel", "outChangStageFlagMousePopover"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabe", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon"], outputs: ["activeChange", "outClickLabel", "outChange", "outChangStageFlagMousePopover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupItemComponent, decorators: [{
             type: Component,
@@ -940,7 +943,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         LibsUiComponentsCheckboxSingleComponent,
                         LibsUiPipesCallFunctionInTemplatePipe,
                         LibsUiComponentsRadioSingleComponent
-                    ], template: "@if (configTemplateGroup(); as configTemplateGroup) {\n  @if ((configTemplateGroup.isViewTree && !!items().length) || (parentItem().maxLevelGroup > 2 && parentItem().level > 1)) {\n    <div class='libs-ui-list-group-item-line-vertical'\n      [style.left.px]=\"parentItem().level | LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe:parentItem().maxLevelGroup:configTemplateGroup.isViewTree :configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\">\n    </div>\n  }\n  @for (item of items(); track item()[fieldKey()]) {\n    <div>\n      <div\n        [style.marginLeft.px]=\"item().level | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:item().maxLevelGroup:configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\"\n        [style.paddingLeft.px]=\"item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe:item().maxLevelGroup:configTemplateGroup.isViewTree:configTemplateGroup.isViewTreeJson:!!item()[configTemplateGroup.fieldGetItems]?.length\"\n        [class]=\"'libs-ui-bg-list-hover py-[6px] pr-[16px] flex items-center relative libs-ui-bg-list-hover-active ' + item()?.classInclude\"\n        [class.libs-ui-bg-list-active]=\"configTemplateGroup.singleSelectItem && item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n        [class.libs-ui-disable]=\"configTemplateGroup.allowDisableLabel && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n        [class.pointer-events-none]=\"configTemplateGroup.allowDisableLabel && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n        [class.cursor-pointer]=\"!disable() && !(configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) && !(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n        [class.libs-ui-bg-list-active]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.hasBackgroundColorWhenItemSelected && item().isCheckManual\"\n        (click)=\"handlerChangeChecked(item(), item()[fieldKey()], disable() || (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup))\">\n        @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTree) {\n          <i class=\"libs-ui-icon-chevron-right\"\n            [class.rotate-90]=\"item().expand\"\n            (click)=\"handlerToggleExpand($event,item)\">\n          </i>\n        }\n        @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.length) {\n          <div [class]=\"'p-[5px]'\">\n            <div [class]=\"'libs-ui-list-group-json_icon-item-parent'\"\n              [attr.disabled]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\">\n            </div>\n          </div>\n        }\n        @if (!configTemplateGroup.isViewRadio) {\n          <libs_ui-components-checkbox-single [avatarConfig]=\"item().avatarConfig\"\n            [class.ml-[8px]]=\"configTemplateGroup.isViewTree || (configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.length)\"\n            [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.singleSelectItem\"\n            [class]=\"configTemplateGroup.classIncludeItem || ''\"\n            [class.-w-auto]=\"configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem\"\n            [class.max-w-[calc(100%\n            -\n            12px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && configTemplateGroup.ignoreIconExpandMarginRight\"\n            [class.max-w-[calc(100%-24px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || (configTemplateGroup.widthLabelSub24WhenNotTreeView && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey))) && !configTemplateGroup.ignoreIconExpandMarginRight\"\n            [clickExactly]=\"false\"\n            [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n            [disable]=\"disable() || (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup && !configTemplateGroup.isViewTreeJson) || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\"\n            [label]=\"item().fieldLabel\"\n            [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n            [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysStillOtherOptions():keysStillOtherOptions().length\"\n            [classLabelInclude]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual ? 'mo-lib-color-global mo-lib-font-head-5' : 'mo-lib-font-head-5'\"\n            [popover]=\"item().dataPopover\"\n            [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateGroup.getImage:item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n            [linkImageError]=\"configTemplateGroup.getLinkImageError ? (('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateGroup.getLinkImageError:item()) | async) : ''\"\n            [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n            [iconImageClass]=\"item().iconImageClass ? item().iconImageClass : undefined\"\n            [classImageInclude]=\"configTemplateGroup.classImageInclude || ''\"\n            (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n            (outEventPopover)=\"handlerEventPopover($event, item())\"\n            (outChange)=\"handlerChangeChecked(item())\" />\n        }\n        @if (configTemplateGroup.isViewRadio) {\n          <libs_ui-components-radio-single [avatarConfig]=\"item().avatarConfig\"\n            [class.ml-[8px]]=\"configTemplateGroup.isViewTree\"\n            [ignoreRadio]=\"configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem\"\n            [class]=\"configTemplateGroup.classIncludeItem || ''\"\n            [class.w-auto]=\"configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem\"\n            [class.max-w-[calc(100%\n            -\n            12px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && configTemplateGroup.ignoreIconExpandMarginRight\"\n            [class.max-w-[calc(100%\n            -\n            24px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && !configTemplateGroup.ignoreIconExpandMarginRight\"\n            [clickExactly]=\"false\"\n            [disable]=\"disable() || (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.length)||(configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\"\n            [label]=\"item().fieldLabel\"\n            [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n            [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n            [classLabelInclude]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual ? 'text-[#009cdb]': ''\"\n            [popover]=\"item().dataPopover\"\n            [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n            (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n            (outChange)=\"handlerChangeChecked(item)\" />\n        }\n        @if ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey)) {\n          <i class=\"libs-ui-icon-check\"\n            [class.ml-[8px]]=\"item().dataPopover\"\n            [class.libs-ui-icon-check]=\"configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\">\n          </i>\n        }\n        @if (!!item()[configTemplateGroup.fieldGetItems]?.length && !configTemplateGroup.isViewTree && !configTemplateGroup.isViewTreeJson) {\n          <i class=\"libs-ui-icon-chevron-right\"\n            [class.rotate-90]=\"item().expand\"\n            [class.ml-[8px]]=\"item().dataPopover\"\n            (click)=\"handlerToggleExpand($event,item())\">\n          </i>\n        }\n      </div>\n      @if (item().expand || configTemplateGroup.isViewTreeJson) {\n        @if (item().level < item().maxLevelGroup && !item()[configTemplateGroup.fieldGetItems]?.length && configTemplateGroup.isViewTree) {\n          <div class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n            [style.marginLeft.px]=\"(item().level + 1) | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:(item().maxLevelGroup+1):configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n            [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n            [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n            <div [class]=\"item().classIncludeItemNoData || ''\">\n              @if (!keySearch()) {\n                <span>{{ 'i18n_no_data_yet' | translate }}</span>\n              }\n              @if (keySearch()) {\n                <span>{{ 'i18n_no_result' | translate }}</span>\n              }\n            </div>\n          </div>\n        }\n        @if (!!item()[configTemplateGroup.fieldGetItems]?.length) {\n          <libs_ui-components-list-templates_group-item [keySearch]=\"keySearch()\"\n            [items]=\"item()[configTemplateGroup.fieldGetItems]\"\n            [parentItem]=\"item()\"\n            [fieldKey]=\"fieldKey()\"\n            [keysChecked]=\"keysChecked()\"\n            [disable]=\"(disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)) && !configTemplateGroup.isViewTreeJson\"\n            [keysDisableItem]=\"keysDisableItem()\"\n            [configTemplateGroup]=\"configTemplateGroup\"\n            (outChangStageFlagMouseTooltip)='handlerChangStageFlagMouse($event)'\n            (outChangeView)=\"handlerChangeView($event)\"\n            (outChange)=\"handlerChangeChecked($event.item)\" />\n        }\n      }\n    </div>\n  }\n  @if ((!items() || !items().length) && (parentItem().level < parentItem().maxLevelGroup)) {\n    <div class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n      [style.marginLeft.px]=\"(parentItem().level + 1) | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:(parentItem().maxLevelGroup+1):configTemplateGroup.isViewTree:configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n      [style.paddingLeft.px]=\"(parentItem().level + 1) | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe:(parentItem().maxLevelGroup+1):configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:false\"\n      [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n      [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n      <div [class]=\"parentItem().classIncludeItemNoData || ''\">\n        @if (parentItem().iconEmptyDataInGroup) {\n          <div class=\"pb-[16px]\">\n            <ng-container *ngComponentOutlet=\"(keySearch()  ? 'no-result' : 'no-data') | LibsUiIconsGetIconComponentPipe | async\" />\n          </div>\n        }\n        @if (!keySearch()) {\n          <span>{{ ( parentItem().textDescriptionGroupWhenNoData ?? config()?.textNoData ?? 'i18n_no_result') | translate }}</span>\n        }\n        @if (keySearch()) {\n          <span>{{ 'i18n_no_result' | translate }}</span>\n        }\n      </div>\n    </div>\n  }\n}\n", styles: [":host{position:relative}:host .libs-ui-list-group-item-line-vertical{position:absolute;width:1px;height:100%;background-color:#e6e7ea}.libs-ui--icon-check{--color: var(--libs-ui-color-default, #226FF5)}.libs-ui-icon-check:before{font-size:16px;color:var(--libs-ui-color-default, #226FF5)}[class*=libs-ui-icon-chevron]:before{color:#6a7383}.libs-ui-list-group-json_icon-item-parent{min-width:6px;min-height:6px;height:6px;width:6px;border-radius:50%;background-color:#226ff5}.libs-ui-list-group-json_icon-item-parent[disabled=true]{background-color:#6a7383!important}\n"] }]
+                    ], template: "@if (configTemplateGroup(); as configTemplateGroup) {\n  @if ((configTemplateGroup.isViewTree && !!items().length) || (parentItem().maxLevelGroup > 2 && parentItem().level > 1)) {\n    <div class='libs-ui-list-group-item-line-vertical'\n      [style.left.px]=\"parentItem().level | LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe:parentItem().maxLevelGroup:configTemplateGroup.isViewTree :configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\">\n    </div>\n  }\n  @if (items() && items().length) {\n    @for (item of items(); track item()[fieldKey()]) {\n      <div>\n        <div\n          [style.marginLeft.px]=\"item().level | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:item().maxLevelGroup:configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\"\n          [style.paddingLeft.px]=\"item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe:item().maxLevelGroup:configTemplateGroup.isViewTree:configTemplateGroup.isViewTreeJson:!!item()[configTemplateGroup.fieldGetItems]?.()?.length\"\n          [class]=\"'libs-ui-bg-list-hover py-[6px] pr-[16px] flex items-center relative libs-ui-bg-list-hover-active ' + item()?.classInclude\"\n          [class.libs-ui-bg-list-active]=\"configTemplateGroup.singleSelectItem && item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n          [class.libs-ui-disable]=\"configTemplateGroup.allowDisableLabel && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n          [class.pointer-events-none]=\"configTemplateGroup.allowDisableLabel && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n          [class.cursor-pointer]=\"!disable() && !(configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) && !(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n          [class.libs-ui-bg-list-active]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.hasBackgroundColorWhenItemSelected && item().isCheckManual\"\n          (click)=\"handlerChangeChecked(item(), item()[fieldKey()], disable() || (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup))\">\n          @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTree) {\n            <i class=\"libs-ui-icon-chevron-right\"\n              [class.rotate-90]=\"item().expand\"\n              (click)=\"handlerToggleExpand($event,item)\">\n            </i>\n          }\n          @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]()?.length) {\n            <div [class]=\"'p-[5px]'\">\n              <div [class]=\"'libs-ui-list-group-json_icon-item-parent'\"\n                [attr.disabled]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\">\n              </div>\n            </div>\n          }\n          @if (!configTemplateGroup.isViewRadio) {\n            <libs_ui-components-checkbox-single [avatarConfig]=\"item().avatarConfig\"\n              [class.ml-[8px]]=\"configTemplateGroup.isViewTree || (configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.()?.length)\"\n              [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.singleSelectItem\"\n              [class]=\"configTemplateGroup.classIncludeItem || ''\"\n              [class.-w-auto]=\"configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem\"\n              [class.max-w-[calc(100%-12px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && configTemplateGroup.ignoreIconExpandMarginRight\"\n              [class.max-w-[calc(100%-24px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || (configTemplateGroup.widthLabelSub24WhenNotTreeView && (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey))) && !configTemplateGroup.ignoreIconExpandMarginRight\"\n              [clickExactly]=\"false\"\n              [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n              [disable]=\"disable() || (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup && !configTemplateGroup.isViewTreeJson) || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\"\n              [label]=\"item().fieldLabel\"\n              [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n              [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysStillOtherOptions():keysStillOtherOptions().length\"\n              [classLabelInclude]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual ? 'libs-ui-color-default libs-ui-font-h5r' : 'libs-ui-font-h5r'\"\n              [popover]=\"item().dataPopover\"\n              [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateGroup.getImage:item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n              [linkImageError]=\"configTemplateGroup.getLinkImageError ? (('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe:configTemplateGroup.getLinkImageError:item()) | async) : ''\"\n              [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n              [iconImageClass]=\"item().iconImageClass ? item().iconImageClass : undefined\"\n              [classImageInclude]=\"configTemplateGroup.classImageInclude || ''\"\n              (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n              (outEventPopover)=\"handlerEventPopover($event, item())\"\n              (outChange)=\"handlerChangeChecked(item())\" />\n          }\n          @if (configTemplateGroup.isViewRadio) {\n            <libs_ui-components-radio-single [avatarConfig]=\"item().avatarConfig\"\n              [class.!ml-[8px]]=\"configTemplateGroup.isViewTree\"\n              [ignoreRadio]=\"configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem\"\n              [class]=\"configTemplateGroup.classIncludeItem || ''\"\n              [class.w-auto]=\"configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem\"\n              [class.max-w-[calc(100%-12px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && configTemplateGroup.ignoreIconExpandMarginRight\"\n              [class.max-w-[calc(100%-24px)]]=\"((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) || configTemplateGroup.widthLabelSub24WhenNotTreeView) && !configTemplateGroup.ignoreIconExpandMarginRight\"\n              [clickExactly]=\"false\"\n              [disable]=\"disable() || (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length)||(configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) || false\"\n              [label]=\"item().fieldLabel\"\n              [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n              [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n              [classLabelInclude]=\"(item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual ? 'text-[#009cdb] libs-ui-font-h5r ': ' libs-ui-font-h5r '\"\n              [popover]=\"item().dataPopover\"\n              [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n              (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n              (outChange)=\"handlerChangeChecked(item())\" />\n          }\n          @if ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey)) {\n            <i class=\"libs-ui-icon-check\"\n              [class.!ml-[8px]]=\"item().dataPopover\"\n              [class.libs-ui-icon-check]=\"configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\">\n            </i>\n          }\n          @if (!!item()[configTemplateGroup.fieldGetItems]?.()?.length && !configTemplateGroup.isViewTree && !configTemplateGroup.isViewTreeJson) {\n            <i class=\"libs-ui-icon-chevron-right\"\n              [class.rotate-90]=\"item().expand\"\n              [class.!ml-[8px]]=\"item().dataPopover\"\n              (click)=\"handlerToggleExpand($event,item)\">\n            </i>\n          }\n        </div>\n        @if (item().expand || configTemplateGroup.isViewTreeJson) {\n          @if (item().level < item().maxLevelGroup && !item()[configTemplateGroup.fieldGetItems]?.()?.length && configTemplateGroup.isViewTree) {\n            <div class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n              [style.marginLeft.px]=\"(item().level + 1) | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:(item().maxLevelGroup+1):configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n              [class.!py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n              [class.!py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n              <div [class]=\"item().classIncludeItemNoData || ''\">\n                @if (!keySearch()) {\n                  <span>{{ 'i18n_no_data_yet' | translate }}</span>\n                }\n                @if (keySearch()) {\n                  <span>{{ 'i18n_no_result' | translate }}</span>\n                }\n              </div>\n            </div>\n          }\n          @if (!!item()[configTemplateGroup.fieldGetItems]?.()?.length) {\n            <libs_ui-components-list-templates_group-item [keySearch]=\"keySearch()\"\n              [items]=\"item()[configTemplateGroup.fieldGetItems]()\"\n              [parentItem]=\"item()\"\n              [fieldKey]=\"fieldKey()\"\n              [keysChecked]=\"keysChecked()\"\n              [disable]=\"(disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)) && !configTemplateGroup.isViewTreeJson\"\n              [keysDisableItem]=\"keysDisableItem()\"\n              [configTemplateGroup]=\"configTemplateGroup\"\n              (outChangStageFlagMouseTooltip)='handlerChangStageFlagMouse($event)'\n              (outChangeView)=\"handlerChangeView($event)\"\n              (outChange)=\"handlerChangeChecked($event.item)\" />\n          }\n        }\n      </div>\n    }\n  }\n\n  @if ((!items() || !items().length) && (parentItem().level < parentItem().maxLevelGroup)) {\n    <div class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n      [style.marginLeft.px]=\"(parentItem().level + 1) | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:(parentItem().maxLevelGroup+1):configTemplateGroup.isViewTree:configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n      [style.paddingLeft.px]=\"(parentItem().level + 1) | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe:(parentItem().maxLevelGroup+1):configTemplateGroup.isViewTree: configTemplateGroup.isViewTreeJson:false\"\n      [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n      [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n      <div [class]=\"parentItem().classIncludeItemNoData || ''\">\n        @if (parentItem().iconEmptyDataInGroup) {\n          <div class=\"pb-[16px]\">\n            <ng-container *ngComponentOutlet=\"(keySearch()  ? 'no-result' : 'no-data') | LibsUiIconsGetIconComponentPipe | async\" />\n          </div>\n        }\n        @if (!keySearch()) {\n          <span>{{ ( parentItem().textDescriptionGroupWhenNoData ?? config()?.textNoData ?? 'i18n_no_result') | translate }}</span>\n        }\n        @if (keySearch()) {\n          <span>{{ 'i18n_no_result' | translate }}</span>\n        }\n      </div>\n    </div>\n  }\n}\n", styles: [":host{position:relative}:host .libs-ui-list-group-item-line-vertical{position:absolute;width:1px;height:100%;background-color:#e6e7ea}.libs-ui--icon-check{--color: var(--libs-ui-color-default, #226FF5)}.libs-ui--icon-check:before{font-size:16px;color:var(--libs-ui-color-default, #226FF5)}[class*=libs-ui-icon-chevron]:before{color:#6a7383}.libs-ui-list-group-json_icon-item-parent{min-width:6px;min-height:6px;height:6px;width:6px;border-radius:50%;background-color:#226ff5}.libs-ui-list-group-json_icon-item-parent[disabled=true]{background-color:#6a7383!important}\n"] }]
         }] });
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
@@ -958,9 +961,6 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
     mappingItemsChecked = signal(new Map());
     selectFirstItem = signal(false);
     firstItemSelected = signal(undefined);
-    constructor() {
-        super();
-    }
     ngOnInit() {
         if (!this.config()?.configTemplateGroup?.()) {
             return;
@@ -1000,9 +1000,11 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                     current.ref = item;
                     return current;
                 });
-                this.checkedGroupItems(itemGroup(), item);
+                if (itemGroup) {
+                    this.checkedGroupItems(itemGroup(), item);
+                }
                 if (this.multiKeySelected() && this.multiKeySelected()?.length && this.multiKeySelected()?.find(key => key === item()[this.fieldKey()])) {
-                    this.handlerChangeChecked(true, itemMap, !configTemplateGroup.singleSelectItem);
+                    this.handlerChangeChecked(true, itemMap, false, !configTemplateGroup.singleSelectItem);
                     return;
                 }
             });
@@ -1019,21 +1021,21 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
             this.items().forEach(item => {
                 this.mappingItemsChecked().delete(item()[this.fieldKey()]);
                 const itemsOfGroup = item()[configTemplateGroup.fieldGetItems];
-                if (itemsOfGroup() && itemsOfGroup().length) {
+                if (itemsOfGroup && itemsOfGroup() && itemsOfGroup().length) {
                     this.removeCheckedItemsChild(itemsOfGroup());
                 }
             });
-            this.setKeysCheckedByMappingChecked();
+            this.setKeysCheckedByMappingChecked(false);
             return;
         }
         this.items().forEach(item => {
             this.mappingItemsChecked().set(item()[this.fieldKey()], item());
             const itemsOfGroup = item()[configTemplateGroup.fieldGetItems];
-            if (itemsOfGroup() && itemsOfGroup().length) {
+            if (itemsOfGroup && itemsOfGroup() && itemsOfGroup().length) {
                 this.setCheckCheckedItemsChild(itemsOfGroup());
             }
         });
-        this.setKeysCheckedByMappingChecked();
+        this.setKeysCheckedByMappingChecked(false);
     }
     checkedGroupItems(items, parent) {
         const configTemplateGroup = this.configTemplateGroup();
@@ -1054,13 +1056,15 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                 current.parentItem = parent;
                 return current;
             });
-            this.checkedGroupItems(itemGroup(), item);
+            if (itemGroup) {
+                this.checkedGroupItems(itemGroup(), item);
+            }
             if (this.multiKeySelected() && this.multiKeySelected()?.length && this.multiKeySelected()?.find(key => key === item()[this.fieldKey()])) {
-                this.handlerChangeChecked(true, itemMap, !configTemplateGroup.singleSelectItem);
+                this.handlerChangeChecked(true, itemMap, false, !configTemplateGroup.singleSelectItem);
                 return;
             }
             if (configTemplateGroup.singleSelectItem) {
-                this.handlerChangeChecked(false, itemMap, !configTemplateGroup.singleSelectItem);
+                this.handlerChangeChecked(false, itemMap, false, !configTemplateGroup.singleSelectItem);
             }
         });
     }
@@ -1074,7 +1078,10 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         if (e instanceof Event) {
             e.stopPropagation();
         }
-        item.expand = !item.expand;
+        item.update(current => {
+            current.expand = !current.expand;
+            return current;
+        });
         this.refreshView();
     }
     handlerChangeView() {
@@ -1087,13 +1094,13 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         this.handlerChangeItemChecked(item);
     }
     handlerChangeItemChecked(item) {
-        const checked = !this.keysChecked().some(key => item()[this.fieldKey()] === key);
+        const checked = !this.keysChecked().some(key => item[this.fieldKey()] === key);
         if (!checked && this.configTemplateGroup()?.isViewRadio) {
             return;
         }
-        this.handlerChangeChecked(checked, item);
+        this.handlerChangeChecked(checked, signal(item), false);
     }
-    handlerChangeChecked(checked, item, isCheckedByDefaultKey) {
+    handlerChangeChecked(checked, item, isClickManual, isCheckedByDefaultKey) {
         const configTemplateGroup = this.configTemplateGroup();
         if (!configTemplateGroup) {
             return;
@@ -1138,7 +1145,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
             });
             this.outUnSelectMultiKey.emit(this.keysChecked());
             this.mappingItemsChecked().clear();
-            this.setKeysCheckedByMappingChecked(item);
+            this.setKeysCheckedByMappingChecked(isClickManual, item);
         }
         if (checked) {
             this.expandAllItemsInGroup(item);
@@ -1153,7 +1160,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                 current.isCheckedByDefaultKey = refItem().isCheckedByDefaultKey;
                 return current;
             });
-            if (configTemplateGroup.chooseChildThenAutoChooseParent) { // chỉ chọn các thằng cha trên cùng tree, ko quan tâm node cha có các con đã đc tích hết chưa
+            if (configTemplateGroup.chooseChildThenAutoChooseParent) { // chỉ chọn các cha trên cùng tree, ko quan tâm node cha có các con đã đc tích hết chưa
                 item.update(current => {
                     current.isCheckManual = true;
                     return current;
@@ -1166,14 +1173,14 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                 if (!configTemplateGroup.ignoreChooseParentThenAutoChooseChildren && !isCheckedByDefaultKey) {
                     this.setCheckCheckedItemsChild(itemsOfGroup());
                 }
-                this.setKeysCheckedByMappingChecked(item);
+                this.setKeysCheckedByMappingChecked(isClickManual, item);
                 return;
             }
             if (configTemplateGroup.ignoreChooseParentThenAutoChooseChildren) { // lựa chọn node cha sẽ bỏ qua việc chọn tất cả node con
-                this.setKeysCheckedByMappingChecked(item);
+                this.setKeysCheckedByMappingChecked(isClickManual, item);
                 return;
             }
-            if (itemsOfGroup() && itemsOfGroup().length && !isCheckedByDefaultKey && !configTemplateGroup.isViewTreeJson) {
+            if (itemsOfGroup && itemsOfGroup() && itemsOfGroup().length && !isCheckedByDefaultKey && !configTemplateGroup.isViewTreeJson) {
                 const itemsChange = configTemplateGroup.ignoreChangeChildrenDisableWhenChangeParent ?
                     itemsOfGroup().filter((item) => !this.keysDisableItem()?.find(key => key === item()[this.fieldKey()])) : itemsOfGroup();
                 this.setCheckCheckedItemsChild(itemsChange);
@@ -1181,7 +1188,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
             if (!configTemplateGroup.notChangeStateItemCheckOther && !configTemplateGroup.isViewTreeJson) {
                 this.setCheckCheckedItemsParent(item().parentItem);
             }
-            this.setKeysCheckedByMappingChecked(item);
+            this.setKeysCheckedByMappingChecked(isClickManual, item);
             return;
         }
         item.update(current => {
@@ -1203,14 +1210,14 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         if (configTemplateGroup.notChangeStateItemCheckOther) {
             this.mappingItemsChecked().delete(item()[this.fieldKey()]);
             this.outUnSelectMultiKey.emit(!isEmpty(item()[this.fieldKey()]) ? [item()[this.fieldKey()]] : []);
-            this.setKeysCheckedByMappingChecked(item);
+            this.setKeysCheckedByMappingChecked(isClickManual, item);
             return;
         }
         if (configTemplateGroup.ignoreUnselectChildrenRemoveSelectParent) {
             this.recursivelyCheckedParentByTree(item().parentItem);
         }
         // nếu ko phải trường hơp của bank và danh mục sản phẩm thì bỏ cha sẽ bỏ con
-        if (itemsOfGroup() && itemsOfGroup().length) {
+        if (itemsOfGroup && itemsOfGroup() && itemsOfGroup().length) {
             const itemsChange = configTemplateGroup.ignoreChangeChildrenDisableWhenChangeParent ?
                 itemsOfGroup().filter((item) => !this.keysDisableItem()?.find(key => key === item()[this.fieldKey()])) : itemsOfGroup();
             this.removeCheckedItemsChild(itemsChange);
@@ -1218,7 +1225,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         if (item().parentItem && !configTemplateGroup.ignoreUnselectChildrenRemoveSelectParent) {
             this.mappingItemsChecked().delete(item().parentItem[this.fieldKey()]);
         }
-        this.setKeysCheckedByMappingChecked(item);
+        this.setKeysCheckedByMappingChecked(isClickManual, item);
     }
     getItemsOfGroup(item, stores) {
         const configTemplateGroup = this.configTemplateGroup();
@@ -1248,7 +1255,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                 return current;
             });
         }
-        if (!itemParent()) {
+        if (!itemParent || !itemParent()) {
             return;
         }
         const itemsOfGroupParent = this.getItemsOfGroup(itemParent, this.store);
@@ -1274,9 +1281,9 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
             });
         }
     }
-    setKeysCheckedByMappingChecked(item) {
+    setKeysCheckedByMappingChecked(isClickManual, item) {
         this.keysChecked.set(Array.from(this.mappingItemsChecked().keys()));
-        this.emitMultiKeyChecked();
+        this.emitMultiKeyChecked(isClickManual);
         this.setKeysStillOtherOptions(item);
     }
     emitMultiKeyChecked(isClickManual = true) {
@@ -1288,7 +1295,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         if ((configTemplateGroup.emitAllItemChecked || configTemplateGroup.chooseChildThenAutoChooseParent) && !configTemplateGroup.ignoreEmitAllItemCheckedWhenChooseChildThenAutoChooseParent) {
             for (const [key, item] of this.mappingItemsChecked()) {
                 dataMultiKeyChecked.keys.push(key);
-                dataMultiKeyChecked.mapKeys.push({ key, item: item.ref || item, isClickManual });
+                dataMultiKeyChecked.mapKeys.push({ key, item: (item.ref?.() || item), isClickManual });
             }
             this.outSelectMultiKey.emit(dataMultiKeyChecked);
             this.totalItemChecked.set(dataMultiKeyChecked.keys.length);
@@ -1297,7 +1304,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         for (const [key, item] of this.mappingItemsChecked()) {
             if (item[this.fieldKey()] && !String(item[this.fieldKey()]).includes(this.PATTERN_FAKE_ID) && (!item[configTemplateGroup.fieldGetItems]?.length || !item[configTemplateGroup.fieldGetItems]().some((itemGroup) => this.mappingItemsChecked().get(itemGroup()[this.fieldKey()])))) {
                 dataMultiKeyChecked.keys.push(key);
-                dataMultiKeyChecked.mapKeys.push({ key, item: item.ref || item, isClickManual });
+                dataMultiKeyChecked.mapKeys.push({ key, item: (item.ref?.() || item), isClickManual });
             }
         }
         this.outSelectMultiKey.emit(dataMultiKeyChecked);
@@ -1337,7 +1344,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         items.forEach(item => {
             this.mappingItemsChecked().set(item()[this.fieldKey()], item());
             const itemsOfGroup = item()[configTemplateGroup.fieldGetItems];
-            if (itemsOfGroup() && itemsOfGroup().length) {
+            if (itemsOfGroup && itemsOfGroup() && itemsOfGroup().length) {
                 this.setCheckCheckedItemsChild(itemsOfGroup());
             }
         });
@@ -1355,7 +1362,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
             this.mappingItemsChecked().delete(item()[this.fieldKey()]);
             this.outUnSelectMultiKey.emit([item()[this.fieldKey()]]);
             const itemsOfGroup = item()[configTemplateGroup.fieldGetItems];
-            if (itemsOfGroup() && itemsOfGroup().length) {
+            if (itemsOfGroup && itemsOfGroup() && itemsOfGroup().length) {
                 this.removeCheckedItemsChild(itemsOfGroup());
             }
         });
@@ -1451,7 +1458,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                 return current;
             });
             if (this.multiKeySelected() && this.multiKeySelected()?.length && this.multiKeySelected()?.some(key => key === itemMap()[this.fieldKey()])) {
-                this.handlerChangeChecked(true, itemMap(), true);
+                this.handlerChangeChecked(true, itemMap, false, true);
             }
             this.buildValueByConfig(itemMap());
             return itemMap;
@@ -1459,7 +1466,6 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         if (this.configTemplateGroup()?.searchAllLevel && this.keySearch()) {
             items = items.filter(item => item().hasDisplay);
         }
-        console.log('items', items);
         this.config()?.sort?.(items);
         this.items.set(items);
         this.multiKeySelected.set([]);
@@ -1469,8 +1475,8 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                 this.expandAllItemsInGroup(this.items()[0]);
             }
             this.setHeightViewPort();
-            if (this.firstItemSelected()) {
-                this.handlerChangeChecked(true, this.firstItemSelected);
+            if (this.firstItemSelected && this.firstItemSelected()) {
+                this.handlerChangeChecked(true, this.firstItemSelected, false);
                 this.firstItemSelected.set(undefined);
             }
         };
@@ -1542,7 +1548,6 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                     this.setDisplayItem(current);
                 }
                 const itemGroup = current[configTemplateGroup.fieldGetItems];
-                console.log(itemGroup, current);
                 if (itemGroup?.()) {
                     const data = this.filterItemsDisplay(this.convertDataByGroupInItem(itemGroup?.(), signal(current)));
                     itemGroup.set(data);
@@ -1575,7 +1580,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
                 }
                 current.avatarConfig = configTemplateGroup.getAvatarConfig && configTemplateGroup.getAvatarConfig(current);
                 if (this.multiKeySelected() && this.multiKeySelected()?.length && this.multiKeySelected()?.some(key => key === current[this.fieldKey()])) {
-                    this.handlerChangeChecked(true, current, true);
+                    this.handlerChangeChecked(true, signal(current), false, true);
                 }
                 if (this.selectFirstItem() && current.level === current.maxLevelGroup) {
                     this.firstItemSelected.set(current);
@@ -1609,7 +1614,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         return itemsDisplay;
     }
     getLengthItem() {
-        const data = { length: this.items.length };
+        const data = { length: this.items().length };
         if (data.length > this.maxItemShow()) {
             return data.length;
         }
@@ -1678,8 +1683,8 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
         item.fieldLabel = this.translateService.instant(item.label || item.name || ' ');
         return labelSearch ?? item.fieldLabel;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListGroupComponent, isStandalone: true, selector: "libs_ui-components-list-templates_group", usesInheritance: true, ngImport: i0, template: "@if (configTemplateGroup(); as configTemplateGroup) {\n  <div class=\"libs-ui-list-group overflow-[hidden]\"\n    [style.height]=\"heightViewPort() ? heightViewPort()+'px':'100%'\">\n    <div class=\"flex flex-col w-full h-full relative min-h-[28px]\">\n      @if (items().length && configTemplateGroup.configButtonSelectAndUndSelectItem?.(); as configButtonSelectItem) {\n        <div [class]=\"'flex items-center bg-[#ffffff] '+(configButtonSelectItem.classInclude ?? 'libs-ui-border-bottom-general')\">\n          <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonCheckAll?.type ?? 'button-link-primary'\"\n            [label]=\"configButtonSelectItem.buttonCheckAll?.label ?? 'i18n_select_all_searched_results'\"\n            [classInclude]=\"configButtonSelectItem.buttonCheckAll?.classInclude || 'pr-[8px]'\"\n            [classLabel]=\"configButtonSelectItem.buttonCheckAll?.classLabel || 'libs-ui-font-h6r'\"\n            [disable]=\"loading() || disable() || false\"\n            (outClick)=\"handlerCheckedOrUnCheckedAll(true)\" />\n          <div class=\"text-[#999999]\">|</div>\n          <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonUncheckAll?.type ?? 'button-link-primary'\"\n            [label]=\"configButtonSelectItem.buttonUncheckAll?.label ?? 'i18n_unselect_all_searched_results'\"\n            [classInclude]=\"configButtonSelectItem.buttonUncheckAll?.classInclude || 'pl-[8px]'\"\n            [classLabel]=\"configButtonSelectItem.buttonUncheckAll?.classLabel || 'libs-ui-font-h6s'\"\n            [disable]=\"loading() || disable() || false\"\n            (outClick)=\"handlerCheckedOrUnCheckedAll(false)\" />\n        </div>\n      }\n      @if (items().length && configTemplateGroup.configCheckboxCheckAll?.(); as configCheckBox) {\n        <div [class]=\"'flex libs-ui-border-bottom-general '+(configTemplateGroup.classIncludeHasConfigCheckBoxAll ?? ' bg-[#ffffff]')\">\n          <libs_ui-components-checkbox-single [label]=\"configCheckBox.label ?? 'i18n_all'\"\n            [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n            [checked]=\"totalItemChecked() >= totalItem() && totalItem() > 0\"\n            [disable]=\"loading() || disable() || false\"\n            (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n            (outChange)=\"handlerCheckedOrUnCheckedAll($event.checked)\" />\n        </div>\n      }\n      @if (items() && items().length) {\n        <div class=\"w-full h-full relative flex\">\n          <div LibsUiComponentsScrollOverlayDirective\n            class=\"w-full h-full absolute top-0 left-0 {{ configTemplateGroup.classIncludeGroup ? configTemplateGroup.classIncludeGroup : '' }}\">\n            @for (item of items(); track item()[fieldKey()]; let first = $first; let last = $last) {\n              <div #itemRef\n                [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"\n                class=\"flex flex-col relative \">\n                <div class=\"flex items-center py-[6px] \"\n                  [class.libs-ui-bg-list-hover]=\"!configTemplateGroup.ignoreClickLabelGroup\"\n                  [class.libs-ui-bg-list-hover-active]=\"!configTemplateGroup.ignoreClickLabelGroup\"\n                  [class.!cursor-pointer]=\"!configTemplateGroup.ignoreClickLabelGroup  && (configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem)\"\n                  [style.paddingLeft.px]=\"level()*(configTemplateGroup.isViewTree ? 8 : 16)\"\n                  (click)=\"(configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem) ? handlerToggleExpand($event,item()) : undefined\">\n                  @if (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree) {\n                    <i class=\"cursor-pointer libs-ui-icon-chevron-right\"\n                      [class.rotate-90]=\"item().expand\"\n                      (click)=\"handlerToggleExpand($event,item())\">\n                    </i>\n                  }\n                  <div class=\"flex\"\n                    [class.mo-lib-calc-w-32px]=\"configTemplateGroup.iconExpand === 'right' && !configTemplateGroup.isViewTree && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length)\"\n                    [class.mo-lib-calc-w-16px]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\">\n                    @if (!configTemplateGroup.isViewRadio) {\n                      <libs_ui-components-checkbox-single [avatarConfig]=\"item().avatarConfig\"\n                        [class.ml-[8px]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\"\n                        [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem\"\n                        [class]=\"configTemplateGroup.classIncludeItem || ''\"\n                        [class.w-auto]=\"configTemplateGroup.isViewTree\"\n                        [class.w-full]=\"!item()[configTemplateGroup.fieldGetItems]?.length && !((configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length)))\"\n                        [class.max-w-[calc(100%-24px)]]=\"(configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length))\"\n                        [label]=\"item().fieldLabel\"\n                        [popover]=\"item().dataPopover\"\n                        [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n                        [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n                        [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n                        [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : (configTemplateGroup.isViewTree ? ' mo-lib-font-head-6 ':' mo-lib-font-head-6s ')) + ((configTemplateGroup.ignoreTextUppercaseLabelGroup || configTemplateGroup.isViewTree) ? '':' text-uppercase ')\"\n                        [disable]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n                        [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysStillOtherOptions():keysStillOtherOptions().length\"\n                        (outChange)=\"handlerChangeChecked($event.checked,item())\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outClickLabel)=\"handlerToggleExpand('clickLabel',item(),configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem)\" />\n                    }\n\n                    @if (configTemplateGroup.isViewRadio) {\n                      <libs_ui-components-radio-single [class.ml-[8px]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\"\n                        [avatarConfig]=\"item().avatarConfig\"\n                        [ignoreRadio]=\"configTemplateGroup.ignoreRadioGroup || configTemplateGroup.singleSelectItem\"\n                        [class]=\"configTemplateGroup.classIncludeItem || ''\"\n                        [class.w-auto]=\"configTemplateGroup.isViewTree\"\n                        [class.w-full]=\"!item()[configTemplateGroup.fieldGetItems]?.length && !((configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length)))\"\n                        [class.max-w-[calc(100%-24px)]]=\"(configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length))\"\n                        [label]=\"item().fieldLabel\"\n                        [popover]=\"item().dataPopover\"\n                        [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n                        [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n                        [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n                        [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : 'libs-ui-font-h6s ') + (configTemplateGroup.ignoreTextUppercaseLabelGroup ? '':' uppercase')\"\n                        [disable]=\"disable() || (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.length) || configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n                        (outChange)=\"handlerChangeChecked($event.active,item())\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outClickLabel)=\"handlerToggleExpand('clickLabel',item(),configTemplateGroup.ignoreRadioGroup || configTemplateGroup.singleSelectItem)\" />\n                    }\n\n                    @if (item().buttonInGroup; as buttonInGroup) {\n                      <libs_ui-components-buttons-button [type]=\"buttonInGroup.type || 'button-link-primary'\"\n                        [label]=\"buttonInGroup.label || ' '\"\n                        [classIconLeft]=\"(buttonInGroup.classIconLeft || '')+' flex mr-[8px] !text-[8px]'\"\n                        [classInclude]=\"buttonInGroup.classInclude\"\n                        [classLabel]=\"buttonInGroup.classLabel || 'libs-ui-font-h5r'\"\n                        [disable]=\"buttonInGroup.disable || disable() || false\"\n                        (outClick)=\"handlerClickButtonGroup(buttonInGroup,item())\" />\n                    }\n                  </div>\n\n                  @if (configTemplateGroup.iconExpand === 'right' && !configTemplateGroup.isViewTree && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length)) {\n                    <i class=\"flex items-center cursor-pointer mr-[16px] libs-ui-icon-chevron-right\"\n                      [class.ml-[8px]]=\"item().dataPopover\"\n                      [class.rotate-90]=\"item().expand\"\n                      (click)=\"handlerToggleExpand($event,item)\">\n                    </i>\n                  }\n                </div>\n                @if (item().expand && calculatorHeighItemSuccess()) {\n                  <libs_ui-components-list-templates_group-item [keySearch]=\"keySearch()\"\n                    [items]=\"item()[configTemplateGroup.fieldGetItems]\"\n                    [parentItem]=\"item()\"\n                    [fieldKey]=\"fieldKey()\"\n                    [keysChecked]=\"keysChecked()\"\n                    [disable]=\"disable()\"\n                    [keysDisableItem]=\"keysDisableItem() || []\"\n                    [configTemplateGroup]=\"configTemplateGroup\"\n                    [config]=\"config()\"\n                    [keysStillOtherOptions]=\"keysStillOtherOptions()\"\n                    (outChangeView)=\"handlerChangeView()\"\n                    (outChangStageFlagMouseTooltip)='handlerChangStageFlagMouse($event)'\n                    (outChange)=\"handlerChangeItemChecked($event.item)\" />\n                }\n                @if (!last && !configTemplateGroup.ignoreGroupLine && calculatorHeighItemSuccess()) {\n                  <div class=\"libs-ui-list-group-line\"\n                    [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\">\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      }\n      @if (!items() || !items().length) {\n        <div class=\"libs-ui-font-h5r text-[#c1c1c1] relative {{ configTemplateGroup.classIncludeNodata?configTemplateGroup.classIncludeNodata:'' }}\"\n          [style.marginLeft.px]=\"0 | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:2:(configTemplateGroup.isViewTree || configTemplateGroup.iconExpand === 'left'):configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n          [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n          [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n          @if (!keySearch() && !loading()) {\n            <div>{{ (config()?.textNoData ?? 'i18n_no_data_yet') | translate }}</div>\n          }\n          @if (keySearch() && !loading()) {\n            <div>{{ (config()?.textSearchNoData ??'i18n_no_result') | translate }}</div>\n          }\n        </div>\n      }\n      @if (loading()) {\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      }\n    </div>\n  </div>\n}\n", styles: [".libs-ui-list-group{display:flex;flex-direction:column;width:100%}.libs-ui-list-group .libs-ui-list-group-line{width:100%;height:1px;background-color:#e6e7ea}.libs-ui-list-group [class*=libs-ui-icon-chevron]:before{color:#6a7383}\n"], dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsCheckboxSingleComponent, selector: "libs_ui-components-checkbox-single", inputs: ["key", "checked", "label", "classLabelInclude", "ignoreShowPopoverLabel", "typeLabelPopover", "popover", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "classInclude", "clickExactly", "disable", "disableLabel", "ignoreCheckbox", "zIndexLabel", "stillOtherOptions", "error", "showBorderError", "description", "iconImageClass", "classIconInclude", "modeBorder"], outputs: ["checkedChange", "linkImageChange", "outChange", "outEventPopover", "outClickLabel", "outChangStageFlagMousePopover"] }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabe", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon"], outputs: ["activeChange", "outClickLabel", "outChange", "outChangStageFlagMousePopover"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }, { kind: "pipe", type: LibsUiComponentsListGroupCalculatorMarginLeftItemPipe, name: "LibsUiComponentsListGroupCalculatorMarginLeftItemPipe" }, { kind: "component", type: LibsUiComponentsListGroupItemComponent, selector: "libs_ui-components-list-templates_group-item", inputs: ["items", "configTemplateGroup", "keySearch", "fieldKey", "keysChecked", "keysDisableItem", "parentItem", "disable", "disableLabel", "config", "keysStillOtherOptions"], outputs: ["outChangeView", "outChange", "outChangStageFlagMouseTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListGroupComponent, isStandalone: true, selector: "libs_ui-components-list-templates_group", usesInheritance: true, ngImport: i0, template: "@if (configTemplateGroup(); as configTemplateGroup) {\n  <div class=\"libs-ui-list-group overflow-[hidden]\"\n    [style.height]=\"heightViewPort() ? heightViewPort()+'px':'100%'\">\n    <div class=\"flex flex-col w-full h-full relative min-h-[28px]\">\n      @if (items().length && configTemplateGroup.configButtonSelectAndUndSelectItem?.(); as configButtonSelectItem) {\n        <div [class]=\"'flex items-center bg-[#ffffff] '+(configButtonSelectItem.classInclude ?? 'libs-ui-border-bottom-general')\">\n          <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonCheckAll?.type ?? 'button-link-primary'\"\n            [label]=\"configButtonSelectItem.buttonCheckAll?.label ?? 'i18n_select_all_searched_results'\"\n            [classInclude]=\"configButtonSelectItem.buttonCheckAll?.classInclude || 'pr-[8px]'\"\n            [classLabel]=\"configButtonSelectItem.buttonCheckAll?.classLabel || 'libs-ui-font-h6r'\"\n            [disable]=\"loading() || disable() || false\"\n            (outClick)=\"handlerCheckedOrUnCheckedAll(true)\" />\n          <div class=\"text-[#999999]\">|</div>\n          <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonUncheckAll?.type ?? 'button-link-primary'\"\n            [label]=\"configButtonSelectItem.buttonUncheckAll?.label ?? 'i18n_unselect_all_searched_results'\"\n            [classInclude]=\"configButtonSelectItem.buttonUncheckAll?.classInclude || 'pl-[8px]'\"\n            [classLabel]=\"configButtonSelectItem.buttonUncheckAll?.classLabel || 'libs-ui-font-h6s'\"\n            [disable]=\"loading() || disable() || false\"\n            (outClick)=\"handlerCheckedOrUnCheckedAll(false)\" />\n        </div>\n      }\n      @if (items().length && configTemplateGroup.configCheckboxCheckAll?.(); as configCheckBox) {\n        <div [class]=\"'flex libs-ui-border-bottom-general '+(configTemplateGroup.classIncludeHasConfigCheckBoxAll ?? ' bg-[#ffffff]')\">\n          <libs_ui-components-checkbox-single [label]=\"configCheckBox.label ?? 'i18n_all'\"\n            [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n            [checked]=\"totalItemChecked() >= totalItem() && totalItem() > 0\"\n            [disable]=\"loading() || disable() || false\"\n            (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n            (outChange)=\"handlerCheckedOrUnCheckedAll($event.checked)\" />\n        </div>\n      }\n      @if (items() && items().length) {\n        <div class=\"w-full h-full relative flex\">\n          <div LibsUiComponentsScrollOverlayDirective\n            class=\"w-full h-full absolute top-0 left-0 {{ configTemplateGroup.classIncludeGroup ? configTemplateGroup.classIncludeGroup : '' }}\">\n            @for (item of items(); track item()[fieldKey()]; let first = $first; let last = $last) {\n              <div #itemRef\n                [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"\n                class=\"flex flex-col relative \">\n                <div class=\"flex items-center py-[6px] \"\n                  [class.libs-ui-bg-list-hover]=\"!configTemplateGroup.ignoreClickLabelGroup\"\n                  [class.libs-ui-bg-list-hover-active]=\"!configTemplateGroup.ignoreClickLabelGroup\"\n                  [class.!cursor-pointer]=\"!configTemplateGroup.ignoreClickLabelGroup  && (configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem)\"\n                  [style.paddingLeft.px]=\"level()*(configTemplateGroup.isViewTree ? 8 : 16)\"\n                  (click)=\"(configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem) ? handlerToggleExpand($event,item()) : undefined\">\n                  @if (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree) {\n                    <i class=\"cursor-pointer libs-ui-icon-chevron-right\"\n                      [class.rotate-90]=\"item().expand\"\n                      (click)=\"handlerToggleExpand($event,item)\">\n                    </i>\n                  }\n                  <div class=\"flex\"\n                    [class.w-[calc(100%-32px)]]=\"configTemplateGroup.iconExpand === 'right' && !configTemplateGroup.isViewTree && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)\"\n                    [class.w-[calc(100%-16px)]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\">\n                    @if (!configTemplateGroup.isViewRadio) {\n                      <libs_ui-components-checkbox-single [avatarConfig]=\"item().avatarConfig\"\n                        [class.ml-[8px]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\"\n                        [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem\"\n                        [class]=\"configTemplateGroup.classIncludeItem || ''\"\n                        [class.w-auto]=\"configTemplateGroup.isViewTree\"\n                        [class.w-full]=\"!item()[configTemplateGroup.fieldGetItems]?.()?.length && !((configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\"\n                        [class.max-w-[calc(100%-24px)]]=\"(configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length))\"\n                        [label]=\"item().fieldLabel\"\n                        [popover]=\"item().dataPopover\"\n                        [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n                        [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n                        [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n                        [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : (configTemplateGroup.isViewTree ? ' libs-ui-font-h6r ':' libs-ui-font-h6s ')) + ((configTemplateGroup.ignoreTextUppercaseLabelGroup || configTemplateGroup.isViewTree) ? '':' text-uppercase ')\"\n                        [disable]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n                        [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysStillOtherOptions():keysStillOtherOptions().length\"\n                        (outChange)=\"handlerChangeChecked($event.checked,item, true)\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outClickLabel)=\"handlerToggleExpand('clickLabel',item(),configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem)\" />\n                    }\n\n                    @if (configTemplateGroup.isViewRadio) {\n                      <libs_ui-components-radio-single [class.ml-[8px]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\"\n                        [avatarConfig]=\"item().avatarConfig\"\n                        [ignoreRadio]=\"configTemplateGroup.ignoreRadioGroup || configTemplateGroup.singleSelectItem\"\n                        [class]=\"configTemplateGroup.classIncludeItem || ''\"\n                        [class.w-auto]=\"configTemplateGroup.isViewTree\"\n                        [class.w-full]=\"!item()[configTemplateGroup.fieldGetItems]?.()?.length && !((configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\"\n                        [class.max-w-[calc(100%-24px)]]=\"(configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length))\"\n                        [label]=\"item().fieldLabel\"\n                        [popover]=\"item().dataPopover\"\n                        [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n                        [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n                        [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n                        [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : 'libs-ui-font-h6s ') + (configTemplateGroup.ignoreTextUppercaseLabelGroup ? '':' uppercase')\"\n                        [disable]=\"disable() || (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) || configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n                        (outChange)=\"handlerChangeChecked($event.active,item, true)\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outClickLabel)=\"handlerToggleExpand('clickLabel',item,configTemplateGroup.ignoreRadioGroup || configTemplateGroup.singleSelectItem)\" />\n                    }\n\n                    @if (item().buttonInGroup; as buttonInGroup) {\n                      <libs_ui-components-buttons-button [type]=\"buttonInGroup.type || 'button-link-primary'\"\n                        [label]=\"buttonInGroup.label || ' '\"\n                        [classIconLeft]=\"(buttonInGroup.classIconLeft || '')+' flex mr-[8px] !text-[8px]'\"\n                        [classInclude]=\"buttonInGroup.classInclude\"\n                        [classLabel]=\"buttonInGroup.classLabel || 'libs-ui-font-h5r'\"\n                        [disable]=\"buttonInGroup.disable || disable() || false\"\n                        (outClick)=\"handlerClickButtonGroup(buttonInGroup,item())\" />\n                    }\n                  </div>\n\n                  @if (configTemplateGroup.iconExpand === 'right' && !configTemplateGroup.isViewTree && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)) {\n                    <i class=\"flex items-center cursor-pointer mr-[16px] libs-ui-icon-chevron-right\"\n                      [class.!ml-[8px]]=\"item().dataPopover\"\n                      [class.rotate-90]=\"item().expand\"\n                      (click)=\"handlerToggleExpand($event,item)\">\n                    </i>\n                  }\n                </div>\n                @if (item().expand && calculatorHeighItemSuccess()) {\n                  <libs_ui-components-list-templates_group-item [keySearch]=\"keySearch()\"\n                    [items]=\"item()[configTemplateGroup.fieldGetItems]()\"\n                    [parentItem]=\"item()\"\n                    [fieldKey]=\"fieldKey()\"\n                    [keysChecked]=\"keysChecked()\"\n                    [disable]=\"disable()\"\n                    [keysDisableItem]=\"keysDisableItem() || []\"\n                    [configTemplateGroup]=\"configTemplateGroup\"\n                    [config]=\"config()\"\n                    [keysStillOtherOptions]=\"keysStillOtherOptions()\"\n                    (outChangeView)=\"handlerChangeView()\"\n                    (outChangStageFlagMouseTooltip)='handlerChangStageFlagMouse($event)'\n                    (outChange)=\"handlerChangeItemChecked($event.item)\" />\n                }\n                @if (!last && !configTemplateGroup.ignoreGroupLine && calculatorHeighItemSuccess()) {\n                  <div class=\"libs-ui-list-group-line\"\n                    [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\">\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      }\n      @if (!items() || !items().length) {\n        <div class=\"libs-ui-font-h5r text-[#c1c1c1] relative {{ configTemplateGroup.classIncludeNodata?configTemplateGroup.classIncludeNodata:'' }}\"\n          [style.marginLeft.px]=\"0 | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:2:(configTemplateGroup.isViewTree || configTemplateGroup.iconExpand === 'left'):configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n          [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n          [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n          @if (!keySearch() && !loading()) {\n            <div>{{ (config()?.textNoData ?? 'i18n_no_data_yet') | translate }}</div>\n          }\n          @if (keySearch() && !loading()) {\n            <div>{{ (config()?.textSearchNoData ??'i18n_no_result') | translate }}</div>\n          }\n        </div>\n      }\n      @if (loading()) {\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      }\n    </div>\n  </div>\n}\n", styles: [".libs-ui-list-group{display:flex;flex-direction:column;width:100%}.libs-ui-list-group .libs-ui-list-group-line{width:100%;height:1px;background-color:#e6e7ea}.libs-ui-list-group [class*=libs-ui-icon-chevron]:before{color:#6a7383}\n"], dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsCheckboxSingleComponent, selector: "libs_ui-components-checkbox-single", inputs: ["key", "checked", "label", "classLabelInclude", "ignoreShowPopoverLabel", "typeLabelPopover", "popover", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "classInclude", "clickExactly", "disable", "disableLabel", "ignoreCheckbox", "zIndexLabel", "stillOtherOptions", "error", "showBorderError", "description", "iconImageClass", "classIconInclude", "modeBorder"], outputs: ["checkedChange", "linkImageChange", "outChange", "outEventPopover", "outClickLabel", "outChangStageFlagMousePopover"] }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabe", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon"], outputs: ["activeChange", "outClickLabel", "outChange", "outChangStageFlagMousePopover"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }, { kind: "pipe", type: LibsUiComponentsListGroupCalculatorMarginLeftItemPipe, name: "LibsUiComponentsListGroupCalculatorMarginLeftItemPipe" }, { kind: "component", type: LibsUiComponentsListGroupItemComponent, selector: "libs_ui-components-list-templates_group-item", inputs: ["items", "configTemplateGroup", "keySearch", "fieldKey", "keysChecked", "keysDisableItem", "parentItem", "disable", "disableLabel", "config", "keysStillOtherOptions"], outputs: ["outChangeView", "outChange", "outChangStageFlagMouseTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupComponent, decorators: [{
             type: Component,
@@ -1694,8 +1699,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         LibsUiPipesCallFunctionInTemplatePipe,
                         LibsUiComponentsListGroupCalculatorMarginLeftItemPipe,
                         LibsUiComponentsListGroupItemComponent
-                    ], template: "@if (configTemplateGroup(); as configTemplateGroup) {\n  <div class=\"libs-ui-list-group overflow-[hidden]\"\n    [style.height]=\"heightViewPort() ? heightViewPort()+'px':'100%'\">\n    <div class=\"flex flex-col w-full h-full relative min-h-[28px]\">\n      @if (items().length && configTemplateGroup.configButtonSelectAndUndSelectItem?.(); as configButtonSelectItem) {\n        <div [class]=\"'flex items-center bg-[#ffffff] '+(configButtonSelectItem.classInclude ?? 'libs-ui-border-bottom-general')\">\n          <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonCheckAll?.type ?? 'button-link-primary'\"\n            [label]=\"configButtonSelectItem.buttonCheckAll?.label ?? 'i18n_select_all_searched_results'\"\n            [classInclude]=\"configButtonSelectItem.buttonCheckAll?.classInclude || 'pr-[8px]'\"\n            [classLabel]=\"configButtonSelectItem.buttonCheckAll?.classLabel || 'libs-ui-font-h6r'\"\n            [disable]=\"loading() || disable() || false\"\n            (outClick)=\"handlerCheckedOrUnCheckedAll(true)\" />\n          <div class=\"text-[#999999]\">|</div>\n          <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonUncheckAll?.type ?? 'button-link-primary'\"\n            [label]=\"configButtonSelectItem.buttonUncheckAll?.label ?? 'i18n_unselect_all_searched_results'\"\n            [classInclude]=\"configButtonSelectItem.buttonUncheckAll?.classInclude || 'pl-[8px]'\"\n            [classLabel]=\"configButtonSelectItem.buttonUncheckAll?.classLabel || 'libs-ui-font-h6s'\"\n            [disable]=\"loading() || disable() || false\"\n            (outClick)=\"handlerCheckedOrUnCheckedAll(false)\" />\n        </div>\n      }\n      @if (items().length && configTemplateGroup.configCheckboxCheckAll?.(); as configCheckBox) {\n        <div [class]=\"'flex libs-ui-border-bottom-general '+(configTemplateGroup.classIncludeHasConfigCheckBoxAll ?? ' bg-[#ffffff]')\">\n          <libs_ui-components-checkbox-single [label]=\"configCheckBox.label ?? 'i18n_all'\"\n            [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n            [checked]=\"totalItemChecked() >= totalItem() && totalItem() > 0\"\n            [disable]=\"loading() || disable() || false\"\n            (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n            (outChange)=\"handlerCheckedOrUnCheckedAll($event.checked)\" />\n        </div>\n      }\n      @if (items() && items().length) {\n        <div class=\"w-full h-full relative flex\">\n          <div LibsUiComponentsScrollOverlayDirective\n            class=\"w-full h-full absolute top-0 left-0 {{ configTemplateGroup.classIncludeGroup ? configTemplateGroup.classIncludeGroup : '' }}\">\n            @for (item of items(); track item()[fieldKey()]; let first = $first; let last = $last) {\n              <div #itemRef\n                [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"\n                class=\"flex flex-col relative \">\n                <div class=\"flex items-center py-[6px] \"\n                  [class.libs-ui-bg-list-hover]=\"!configTemplateGroup.ignoreClickLabelGroup\"\n                  [class.libs-ui-bg-list-hover-active]=\"!configTemplateGroup.ignoreClickLabelGroup\"\n                  [class.!cursor-pointer]=\"!configTemplateGroup.ignoreClickLabelGroup  && (configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem)\"\n                  [style.paddingLeft.px]=\"level()*(configTemplateGroup.isViewTree ? 8 : 16)\"\n                  (click)=\"(configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem) ? handlerToggleExpand($event,item()) : undefined\">\n                  @if (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree) {\n                    <i class=\"cursor-pointer libs-ui-icon-chevron-right\"\n                      [class.rotate-90]=\"item().expand\"\n                      (click)=\"handlerToggleExpand($event,item())\">\n                    </i>\n                  }\n                  <div class=\"flex\"\n                    [class.mo-lib-calc-w-32px]=\"configTemplateGroup.iconExpand === 'right' && !configTemplateGroup.isViewTree && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length)\"\n                    [class.mo-lib-calc-w-16px]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\">\n                    @if (!configTemplateGroup.isViewRadio) {\n                      <libs_ui-components-checkbox-single [avatarConfig]=\"item().avatarConfig\"\n                        [class.ml-[8px]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\"\n                        [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem\"\n                        [class]=\"configTemplateGroup.classIncludeItem || ''\"\n                        [class.w-auto]=\"configTemplateGroup.isViewTree\"\n                        [class.w-full]=\"!item()[configTemplateGroup.fieldGetItems]?.length && !((configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length)))\"\n                        [class.max-w-[calc(100%-24px)]]=\"(configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length))\"\n                        [label]=\"item().fieldLabel\"\n                        [popover]=\"item().dataPopover\"\n                        [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n                        [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n                        [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n                        [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : (configTemplateGroup.isViewTree ? ' mo-lib-font-head-6 ':' mo-lib-font-head-6s ')) + ((configTemplateGroup.ignoreTextUppercaseLabelGroup || configTemplateGroup.isViewTree) ? '':' text-uppercase ')\"\n                        [disable]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n                        [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysStillOtherOptions():keysStillOtherOptions().length\"\n                        (outChange)=\"handlerChangeChecked($event.checked,item())\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outClickLabel)=\"handlerToggleExpand('clickLabel',item(),configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem)\" />\n                    }\n\n                    @if (configTemplateGroup.isViewRadio) {\n                      <libs_ui-components-radio-single [class.ml-[8px]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\"\n                        [avatarConfig]=\"item().avatarConfig\"\n                        [ignoreRadio]=\"configTemplateGroup.ignoreRadioGroup || configTemplateGroup.singleSelectItem\"\n                        [class]=\"configTemplateGroup.classIncludeItem || ''\"\n                        [class.w-auto]=\"configTemplateGroup.isViewTree\"\n                        [class.w-full]=\"!item()[configTemplateGroup.fieldGetItems]?.length && !((configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length)))\"\n                        [class.max-w-[calc(100%-24px)]]=\"(configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length))\"\n                        [label]=\"item().fieldLabel\"\n                        [popover]=\"item().dataPopover\"\n                        [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n                        [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n                        [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n                        [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : 'libs-ui-font-h6s ') + (configTemplateGroup.ignoreTextUppercaseLabelGroup ? '':' uppercase')\"\n                        [disable]=\"disable() || (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.length) || configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n                        (outChange)=\"handlerChangeChecked($event.active,item())\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outClickLabel)=\"handlerToggleExpand('clickLabel',item(),configTemplateGroup.ignoreRadioGroup || configTemplateGroup.singleSelectItem)\" />\n                    }\n\n                    @if (item().buttonInGroup; as buttonInGroup) {\n                      <libs_ui-components-buttons-button [type]=\"buttonInGroup.type || 'button-link-primary'\"\n                        [label]=\"buttonInGroup.label || ' '\"\n                        [classIconLeft]=\"(buttonInGroup.classIconLeft || '')+' flex mr-[8px] !text-[8px]'\"\n                        [classInclude]=\"buttonInGroup.classInclude\"\n                        [classLabel]=\"buttonInGroup.classLabel || 'libs-ui-font-h5r'\"\n                        [disable]=\"buttonInGroup.disable || disable() || false\"\n                        (outClick)=\"handlerClickButtonGroup(buttonInGroup,item())\" />\n                    }\n                  </div>\n\n                  @if (configTemplateGroup.iconExpand === 'right' && !configTemplateGroup.isViewTree && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.length)) {\n                    <i class=\"flex items-center cursor-pointer mr-[16px] libs-ui-icon-chevron-right\"\n                      [class.ml-[8px]]=\"item().dataPopover\"\n                      [class.rotate-90]=\"item().expand\"\n                      (click)=\"handlerToggleExpand($event,item)\">\n                    </i>\n                  }\n                </div>\n                @if (item().expand && calculatorHeighItemSuccess()) {\n                  <libs_ui-components-list-templates_group-item [keySearch]=\"keySearch()\"\n                    [items]=\"item()[configTemplateGroup.fieldGetItems]\"\n                    [parentItem]=\"item()\"\n                    [fieldKey]=\"fieldKey()\"\n                    [keysChecked]=\"keysChecked()\"\n                    [disable]=\"disable()\"\n                    [keysDisableItem]=\"keysDisableItem() || []\"\n                    [configTemplateGroup]=\"configTemplateGroup\"\n                    [config]=\"config()\"\n                    [keysStillOtherOptions]=\"keysStillOtherOptions()\"\n                    (outChangeView)=\"handlerChangeView()\"\n                    (outChangStageFlagMouseTooltip)='handlerChangStageFlagMouse($event)'\n                    (outChange)=\"handlerChangeItemChecked($event.item)\" />\n                }\n                @if (!last && !configTemplateGroup.ignoreGroupLine && calculatorHeighItemSuccess()) {\n                  <div class=\"libs-ui-list-group-line\"\n                    [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\">\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      }\n      @if (!items() || !items().length) {\n        <div class=\"libs-ui-font-h5r text-[#c1c1c1] relative {{ configTemplateGroup.classIncludeNodata?configTemplateGroup.classIncludeNodata:'' }}\"\n          [style.marginLeft.px]=\"0 | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:2:(configTemplateGroup.isViewTree || configTemplateGroup.iconExpand === 'left'):configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n          [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n          [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n          @if (!keySearch() && !loading()) {\n            <div>{{ (config()?.textNoData ?? 'i18n_no_data_yet') | translate }}</div>\n          }\n          @if (keySearch() && !loading()) {\n            <div>{{ (config()?.textSearchNoData ??'i18n_no_result') | translate }}</div>\n          }\n        </div>\n      }\n      @if (loading()) {\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      }\n    </div>\n  </div>\n}\n", styles: [".libs-ui-list-group{display:flex;flex-direction:column;width:100%}.libs-ui-list-group .libs-ui-list-group-line{width:100%;height:1px;background-color:#e6e7ea}.libs-ui-list-group [class*=libs-ui-icon-chevron]:before{color:#6a7383}\n"] }]
-        }], ctorParameters: () => [] });
+                    ], template: "@if (configTemplateGroup(); as configTemplateGroup) {\n  <div class=\"libs-ui-list-group overflow-[hidden]\"\n    [style.height]=\"heightViewPort() ? heightViewPort()+'px':'100%'\">\n    <div class=\"flex flex-col w-full h-full relative min-h-[28px]\">\n      @if (items().length && configTemplateGroup.configButtonSelectAndUndSelectItem?.(); as configButtonSelectItem) {\n        <div [class]=\"'flex items-center bg-[#ffffff] '+(configButtonSelectItem.classInclude ?? 'libs-ui-border-bottom-general')\">\n          <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonCheckAll?.type ?? 'button-link-primary'\"\n            [label]=\"configButtonSelectItem.buttonCheckAll?.label ?? 'i18n_select_all_searched_results'\"\n            [classInclude]=\"configButtonSelectItem.buttonCheckAll?.classInclude || 'pr-[8px]'\"\n            [classLabel]=\"configButtonSelectItem.buttonCheckAll?.classLabel || 'libs-ui-font-h6r'\"\n            [disable]=\"loading() || disable() || false\"\n            (outClick)=\"handlerCheckedOrUnCheckedAll(true)\" />\n          <div class=\"text-[#999999]\">|</div>\n          <libs_ui-components-buttons-button [type]=\"configButtonSelectItem.buttonUncheckAll?.type ?? 'button-link-primary'\"\n            [label]=\"configButtonSelectItem.buttonUncheckAll?.label ?? 'i18n_unselect_all_searched_results'\"\n            [classInclude]=\"configButtonSelectItem.buttonUncheckAll?.classInclude || 'pl-[8px]'\"\n            [classLabel]=\"configButtonSelectItem.buttonUncheckAll?.classLabel || 'libs-ui-font-h6s'\"\n            [disable]=\"loading() || disable() || false\"\n            (outClick)=\"handlerCheckedOrUnCheckedAll(false)\" />\n        </div>\n      }\n      @if (items().length && configTemplateGroup.configCheckboxCheckAll?.(); as configCheckBox) {\n        <div [class]=\"'flex libs-ui-border-bottom-general '+(configTemplateGroup.classIncludeHasConfigCheckBoxAll ?? ' bg-[#ffffff]')\">\n          <libs_ui-components-checkbox-single [label]=\"configCheckBox.label ?? 'i18n_all'\"\n            [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n            [checked]=\"totalItemChecked() >= totalItem() && totalItem() > 0\"\n            [disable]=\"loading() || disable() || false\"\n            (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n            (outChange)=\"handlerCheckedOrUnCheckedAll($event.checked)\" />\n        </div>\n      }\n      @if (items() && items().length) {\n        <div class=\"w-full h-full relative flex\">\n          <div LibsUiComponentsScrollOverlayDirective\n            class=\"w-full h-full absolute top-0 left-0 {{ configTemplateGroup.classIncludeGroup ? configTemplateGroup.classIncludeGroup : '' }}\">\n            @for (item of items(); track item()[fieldKey()]; let first = $first; let last = $last) {\n              <div #itemRef\n                [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"\n                class=\"flex flex-col relative \">\n                <div class=\"flex items-center py-[6px] \"\n                  [class.libs-ui-bg-list-hover]=\"!configTemplateGroup.ignoreClickLabelGroup\"\n                  [class.libs-ui-bg-list-hover-active]=\"!configTemplateGroup.ignoreClickLabelGroup\"\n                  [class.!cursor-pointer]=\"!configTemplateGroup.ignoreClickLabelGroup  && (configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem)\"\n                  [style.paddingLeft.px]=\"level()*(configTemplateGroup.isViewTree ? 8 : 16)\"\n                  (click)=\"(configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem) ? handlerToggleExpand($event,item()) : undefined\">\n                  @if (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree) {\n                    <i class=\"cursor-pointer libs-ui-icon-chevron-right\"\n                      [class.rotate-90]=\"item().expand\"\n                      (click)=\"handlerToggleExpand($event,item)\">\n                    </i>\n                  }\n                  <div class=\"flex\"\n                    [class.w-[calc(100%-32px)]]=\"configTemplateGroup.iconExpand === 'right' && !configTemplateGroup.isViewTree && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)\"\n                    [class.w-[calc(100%-16px)]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\">\n                    @if (!configTemplateGroup.isViewRadio) {\n                      <libs_ui-components-checkbox-single [avatarConfig]=\"item().avatarConfig\"\n                        [class.ml-[8px]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\"\n                        [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem\"\n                        [class]=\"configTemplateGroup.classIncludeItem || ''\"\n                        [class.w-auto]=\"configTemplateGroup.isViewTree\"\n                        [class.w-full]=\"!item()[configTemplateGroup.fieldGetItems]?.()?.length && !((configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\"\n                        [class.max-w-[calc(100%-24px)]]=\"(configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length))\"\n                        [label]=\"item().fieldLabel\"\n                        [popover]=\"item().dataPopover\"\n                        [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n                        [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n                        [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n                        [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : (configTemplateGroup.isViewTree ? ' libs-ui-font-h6r ':' libs-ui-font-h6s ')) + ((configTemplateGroup.ignoreTextUppercaseLabelGroup || configTemplateGroup.isViewTree) ? '':' text-uppercase ')\"\n                        [disable]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n                        [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysStillOtherOptions():keysStillOtherOptions().length\"\n                        (outChange)=\"handlerChangeChecked($event.checked,item, true)\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outClickLabel)=\"handlerToggleExpand('clickLabel',item(),configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem)\" />\n                    }\n\n                    @if (configTemplateGroup.isViewRadio) {\n                      <libs_ui-components-radio-single [class.ml-[8px]]=\"configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree\"\n                        [avatarConfig]=\"item().avatarConfig\"\n                        [ignoreRadio]=\"configTemplateGroup.ignoreRadioGroup || configTemplateGroup.singleSelectItem\"\n                        [class]=\"configTemplateGroup.classIncludeItem || ''\"\n                        [class.w-auto]=\"configTemplateGroup.isViewTree\"\n                        [class.w-full]=\"!item()[configTemplateGroup.fieldGetItems]?.()?.length && !((configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\"\n                        [class.max-w-[calc(100%-24px)]]=\"(configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) && (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length))\"\n                        [label]=\"item().fieldLabel\"\n                        [popover]=\"item().dataPopover\"\n                        [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n                        [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n                        [linkImage]=\"configTemplateGroup.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage):item()) | async) : item()[configTemplateGroup.fieldGetAvatarItem || '']\"\n                        [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : 'libs-ui-font-h6s ') + (configTemplateGroup.ignoreTextUppercaseLabelGroup ? '':' uppercase')\"\n                        [disable]=\"disable() || (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) || configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                        [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysChecked():keysChecked().length\"\n                        (outChange)=\"handlerChangeChecked($event.active,item, true)\"\n                        (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                        (outClickLabel)=\"handlerToggleExpand('clickLabel',item,configTemplateGroup.ignoreRadioGroup || configTemplateGroup.singleSelectItem)\" />\n                    }\n\n                    @if (item().buttonInGroup; as buttonInGroup) {\n                      <libs_ui-components-buttons-button [type]=\"buttonInGroup.type || 'button-link-primary'\"\n                        [label]=\"buttonInGroup.label || ' '\"\n                        [classIconLeft]=\"(buttonInGroup.classIconLeft || '')+' flex mr-[8px] !text-[8px]'\"\n                        [classInclude]=\"buttonInGroup.classInclude\"\n                        [classLabel]=\"buttonInGroup.classLabel || 'libs-ui-font-h5r'\"\n                        [disable]=\"buttonInGroup.disable || disable() || false\"\n                        (outClick)=\"handlerClickButtonGroup(buttonInGroup,item())\" />\n                    }\n                  </div>\n\n                  @if (configTemplateGroup.iconExpand === 'right' && !configTemplateGroup.isViewTree && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)) {\n                    <i class=\"flex items-center cursor-pointer mr-[16px] libs-ui-icon-chevron-right\"\n                      [class.!ml-[8px]]=\"item().dataPopover\"\n                      [class.rotate-90]=\"item().expand\"\n                      (click)=\"handlerToggleExpand($event,item)\">\n                    </i>\n                  }\n                </div>\n                @if (item().expand && calculatorHeighItemSuccess()) {\n                  <libs_ui-components-list-templates_group-item [keySearch]=\"keySearch()\"\n                    [items]=\"item()[configTemplateGroup.fieldGetItems]()\"\n                    [parentItem]=\"item()\"\n                    [fieldKey]=\"fieldKey()\"\n                    [keysChecked]=\"keysChecked()\"\n                    [disable]=\"disable()\"\n                    [keysDisableItem]=\"keysDisableItem() || []\"\n                    [configTemplateGroup]=\"configTemplateGroup\"\n                    [config]=\"config()\"\n                    [keysStillOtherOptions]=\"keysStillOtherOptions()\"\n                    (outChangeView)=\"handlerChangeView()\"\n                    (outChangStageFlagMouseTooltip)='handlerChangStageFlagMouse($event)'\n                    (outChange)=\"handlerChangeItemChecked($event.item)\" />\n                }\n                @if (!last && !configTemplateGroup.ignoreGroupLine && calculatorHeighItemSuccess()) {\n                  <div class=\"libs-ui-list-group-line\"\n                    [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\">\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      }\n      @if (!items() || !items().length) {\n        <div class=\"libs-ui-font-h5r text-[#c1c1c1] relative {{ configTemplateGroup.classIncludeNodata?configTemplateGroup.classIncludeNodata:'' }}\"\n          [style.marginLeft.px]=\"0 | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe:2:(configTemplateGroup.isViewTree || configTemplateGroup.iconExpand === 'left'):configTemplateGroup.isViewTreeJson:!(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem):true\"\n          [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n          [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n          @if (!keySearch() && !loading()) {\n            <div>{{ (config()?.textNoData ?? 'i18n_no_data_yet') | translate }}</div>\n          }\n          @if (keySearch() && !loading()) {\n            <div>{{ (config()?.textSearchNoData ??'i18n_no_result') | translate }}</div>\n          }\n        </div>\n      }\n      @if (loading()) {\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      }\n    </div>\n  </div>\n}\n", styles: [".libs-ui-list-group{display:flex;flex-direction:column;width:100%}.libs-ui-list-group .libs-ui-list-group-line{width:100%;height:1px;background-color:#e6e7ea}.libs-ui-list-group [class*=libs-ui-icon-chevron]:before{color:#6a7383}\n"] }]
+        }] });
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 class LibsUiComponentsListRadioComponent extends LibsUiComponentsListTemplatesComponentAbstract {
@@ -1856,7 +1861,7 @@ class LibsUiComponentsListRadioComponent extends LibsUiComponentsListTemplatesCo
         return this.items().length;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListRadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListRadioComponent, isStandalone: true, selector: "libs_ui-components-list-templates_radio", viewQueries: [{ propertyName: "virtualScrollerComponent", first: true, predicate: VirtualScrollerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (configTemplateRadio(); as configTemplateRadio) {\n  <div class=\"relative h-full w-full\">\n    @if (items().length) {\n      <div #elementScroll\n        LibsUiComponentsScrollOverlayDirective\n        class=\"w-full\"\n        [style.height]=\"heightViewPort() ? heightViewPort()+'px':'100%'\"\n        (moScrollBottom)=\"handlerScrollBottom()\">\n        <virtual-scroller #scroll\n          [parentScroll]=\"elementScroll\"\n          [items]=\"items()\"\n          class=\"h-full\">\n          @for (item of scroll.viewPortItems; track item()[fieldKey()]) {\n            <div #itemRef\n              [class]=\"'libs-ui-list-template-radio-item flex ' + (configTemplateRadio.classItemInclude || '')\"\n              [class.libs-ui-bg-list-hover]=\"!clickExactly()\"\n              [class.libs-ui-bg-list-hover-active]=\"!clickExactly()\"\n              [class.pl-[12px]]=\"paddingLeftItem()\"\n              [class.bg-[#ffffff]]=\"clickExactly()\"\n              [class.py-[2px]]=\"clickExactly()\"\n              (click)=\"handlerChange($event,item())\">\n              <div class=\"flex flex-col w-full\">\n                @if (item().fieldLabel) {\n                  <libs_ui-components-radio-single [label]=\"item().fieldLabel\"\n                    [avatarConfig]=\"item().avatarConfig\"\n                    [active]=\"keySelected() === item()[fieldKey()]\"\n                    [key]=\"item()[fieldKey()]\"\n                    [imgTypeIcon]=\"configTemplateRadio.hasAvatarGroupSocial\"\n                    [linkImage]=\"configTemplateRadio.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateRadio.getImageError ? configTemplateRadio.getImageError : configTemplateRadio.getImage):item()) | async) : item()[configTemplateRadio.fieldGetImage || '']\"\n                    [classImageInclude]=\"configTemplateRadio.classIncludeImage || ''\"\n                    [bullet]=\"item().bullet\"\n                    [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                    [classLabelInclude]=\"item().classLabelInclude || ''\"\n                    [popover]=\"item().dataPopover\"\n                    [clickExactly]=\"clickExactly()\"\n                    [disableLabel]=\"disableLabel()\"\n                    [zIndexLabel]=\"configTemplateRadio.zIndexPopover ?? 1200\"\n                    (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                    (outChange)=\"handlerChange('radio',item())\"\n                    (outClickLabel)=\"handlerChange('radio',item())\" />\n                }\n                @if (configTemplateRadio?.rows?.()) {\n                  <libs_ui-components-list-templates_rows class=\"w-full {{ configTemplateRadio.classRows ?? '' }}\"\n                    [item]=\"item()\"\n                    [fieldKey]=\"fieldKey()\"\n                    [keySelected]=\"keySelected()\"\n                    [configTemplate]=\"configTemplateRadio\"\n                    (outEvent)=\"handlerChange('radio',$event.item)\" />\n                }\n              </div>\n            </div>\n          }\n        </virtual-scroller>\n      </div>\n    }\n    @if (!items().length) {\n      <div [class]=\"'libs-ui-font-h4r text-[#c1c1c1] '+ (config()?.textNoDataClassInclude ?? 'py-[4px] px-[12px]')\">\n        @if (!keySearch() && !loading()) {\n          <span>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</span>\n        }\n        @if (templateRefSearchNoData() && keySearch() && !loading()) {\n          <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n        }\n        @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n          <span>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</span>\n        }\n        @if (loading()) {\n          <span>&nbsp;</span>\n        }\n      </div>\n    }\n\n    @if (loading()) {\n      <libs_ui-components-spinner [size]=\"'medium'\" />\n    }\n  </div>\n}\n", styles: [".libs-ui-list-template-radio-item{padding:4px 22px 4px 1px;font-size:12px;line-height:18px;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "component", type: i1$1.VirtualScrollerComponent, selector: "virtual-scroller,[virtualScroller]", inputs: ["executeRefreshOutsideAngularZone", "enableUnequalChildrenSizes", "RTL", "useMarginInsteadOfTranslate", "modifyOverflowStyleOfParentScroll", "stripedTable", "scrollbarWidth", "scrollbarHeight", "childWidth", "childHeight", "ssrChildWidth", "ssrChildHeight", "ssrViewportWidth", "ssrViewportHeight", "bufferAmount", "scrollAnimationTime", "resizeBypassRefreshThreshold", "scrollThrottlingTime", "scrollDebounceTime", "checkResizeInterval", "items", "compareItems", "horizontal", "parentScroll"], outputs: ["vsUpdate", "vsChange", "vsStart", "vsEnd"], exportAs: ["virtualScroller"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabe", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon"], outputs: ["activeChange", "outClickLabel", "outChange", "outChangStageFlagMousePopover"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "component", type: LibsUiComponentsListRowsComponent, selector: "libs_ui-components-list-templates_rows", inputs: ["configTemplate", "item", "keySelected", "fieldKey", "zIndex"], outputs: ["outChangStageFlagMousePopover", "outEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListRadioComponent, isStandalone: true, selector: "libs_ui-components-list-templates_radio", viewQueries: [{ propertyName: "virtualScrollerComponent", first: true, predicate: VirtualScrollerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (configTemplateRadio(); as configTemplateRadio) {\n  <div class=\"relative h-full w-full\">\n    @if (items().length) {\n      <div #elementScroll\n        LibsUiComponentsScrollOverlayDirective\n        class=\"w-full\"\n        [style.height]=\"heightViewPort() ? heightViewPort()+'px':'100%'\"\n        (moScrollBottom)=\"handlerScrollBottom()\">\n        <virtual-scroller #scroll\n          [parentScroll]=\"elementScroll\"\n          [items]=\"items()\"\n          class=\"h-full\">\n          @for (item of scroll.viewPortItems; track item()[fieldKey()]) {\n            <div #itemRef\n              [class]=\"'libs-ui-list-template-radio-item flex ' + (configTemplateRadio.classItemInclude || '')\"\n              [class.libs-ui-bg-list-hover]=\"!clickExactly()\"\n              [class.libs-ui-bg-list-hover-active]=\"!clickExactly()\"\n              [class.!pl-[12px]]=\"paddingLeftItem()\"\n              [class.bg-[#ffffff]]=\"clickExactly()\"\n              [class.!py-[2px]]=\"clickExactly()\"\n              (click)=\"handlerChange($event,item())\">\n              <div class=\"flex flex-col w-full\">\n                @if (item().fieldLabel) {\n                  <libs_ui-components-radio-single [label]=\"item().fieldLabel\"\n                    [avatarConfig]=\"item().avatarConfig\"\n                    [active]=\"keySelected() === item()[fieldKey()]\"\n                    [key]=\"item()[fieldKey()]\"\n                    [imgTypeIcon]=\"configTemplateRadio.hasAvatarGroupSocial\"\n                    [linkImage]=\"configTemplateRadio.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateRadio.getImageError ? configTemplateRadio.getImageError : configTemplateRadio.getImage):item()) | async) : item()[configTemplateRadio.fieldGetImage || '']\"\n                    [classImageInclude]=\"configTemplateRadio.classIncludeImage || ''\"\n                    [bullet]=\"item().bullet\"\n                    [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                    [classLabelInclude]=\"item().classLabelInclude || ''\"\n                    [popover]=\"item().dataPopover\"\n                    [clickExactly]=\"clickExactly()\"\n                    [disableLabel]=\"disableLabel()\"\n                    [zIndexLabel]=\"configTemplateRadio.zIndexPopover ?? 1200\"\n                    (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                    (outChange)=\"handlerChange('radio',item())\"\n                    (outClickLabel)=\"handlerChange('radio',item())\" />\n                }\n                @if (configTemplateRadio?.rows?.()) {\n                  <libs_ui-components-list-templates_rows class=\"w-full {{ configTemplateRadio.classRows ?? '' }}\"\n                    [item]=\"item()\"\n                    [fieldKey]=\"fieldKey()\"\n                    [keySelected]=\"keySelected()\"\n                    [configTemplate]=\"configTemplateRadio\"\n                    (outEvent)=\"handlerChange('radio',$event.item)\" />\n                }\n              </div>\n            </div>\n          }\n        </virtual-scroller>\n      </div>\n    }\n    @if (!items().length) {\n      <div [class]=\"'libs-ui-font-h4r text-[#c1c1c1] '+ (config()?.textNoDataClassInclude ?? 'py-[4px] px-[12px]')\">\n        @if (!keySearch() && !loading()) {\n          <span>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</span>\n        }\n        @if (templateRefSearchNoData() && keySearch() && !loading()) {\n          <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n        }\n        @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n          <span>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</span>\n        }\n        @if (loading()) {\n          <span>&nbsp;</span>\n        }\n      </div>\n    }\n\n    @if (loading()) {\n      <libs_ui-components-spinner [size]=\"'medium'\" />\n    }\n  </div>\n}\n", styles: [".libs-ui-list-template-radio-item{padding:4px 22px 4px 1px;font-size:12px;line-height:18px;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "component", type: i1$1.VirtualScrollerComponent, selector: "virtual-scroller,[virtualScroller]", inputs: ["executeRefreshOutsideAngularZone", "enableUnequalChildrenSizes", "RTL", "useMarginInsteadOfTranslate", "modifyOverflowStyleOfParentScroll", "stripedTable", "scrollbarWidth", "scrollbarHeight", "childWidth", "childHeight", "ssrChildWidth", "ssrChildHeight", "ssrViewportWidth", "ssrViewportHeight", "bufferAmount", "scrollAnimationTime", "resizeBypassRefreshThreshold", "scrollThrottlingTime", "scrollDebounceTime", "checkResizeInterval", "items", "compareItems", "horizontal", "parentScroll"], outputs: ["vsUpdate", "vsChange", "vsStart", "vsEnd"], exportAs: ["virtualScroller"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabe", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon"], outputs: ["activeChange", "outClickLabel", "outChange", "outChangStageFlagMousePopover"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "component", type: LibsUiComponentsListRowsComponent, selector: "libs_ui-components-list-templates_rows", inputs: ["configTemplate", "item", "keySelected", "fieldKey", "zIndex"], outputs: ["outChangStageFlagMousePopover", "outEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListRadioComponent, decorators: [{
             type: Component,
@@ -1868,7 +1873,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         LibsUiPipesCallFunctionInTemplatePipe,
                         LibsUiCheckSelectedByKeyPipe,
                         LibsUiComponentsListRowsComponent
-                    ], template: "@if (configTemplateRadio(); as configTemplateRadio) {\n  <div class=\"relative h-full w-full\">\n    @if (items().length) {\n      <div #elementScroll\n        LibsUiComponentsScrollOverlayDirective\n        class=\"w-full\"\n        [style.height]=\"heightViewPort() ? heightViewPort()+'px':'100%'\"\n        (moScrollBottom)=\"handlerScrollBottom()\">\n        <virtual-scroller #scroll\n          [parentScroll]=\"elementScroll\"\n          [items]=\"items()\"\n          class=\"h-full\">\n          @for (item of scroll.viewPortItems; track item()[fieldKey()]) {\n            <div #itemRef\n              [class]=\"'libs-ui-list-template-radio-item flex ' + (configTemplateRadio.classItemInclude || '')\"\n              [class.libs-ui-bg-list-hover]=\"!clickExactly()\"\n              [class.libs-ui-bg-list-hover-active]=\"!clickExactly()\"\n              [class.pl-[12px]]=\"paddingLeftItem()\"\n              [class.bg-[#ffffff]]=\"clickExactly()\"\n              [class.py-[2px]]=\"clickExactly()\"\n              (click)=\"handlerChange($event,item())\">\n              <div class=\"flex flex-col w-full\">\n                @if (item().fieldLabel) {\n                  <libs_ui-components-radio-single [label]=\"item().fieldLabel\"\n                    [avatarConfig]=\"item().avatarConfig\"\n                    [active]=\"keySelected() === item()[fieldKey()]\"\n                    [key]=\"item()[fieldKey()]\"\n                    [imgTypeIcon]=\"configTemplateRadio.hasAvatarGroupSocial\"\n                    [linkImage]=\"configTemplateRadio.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateRadio.getImageError ? configTemplateRadio.getImageError : configTemplateRadio.getImage):item()) | async) : item()[configTemplateRadio.fieldGetImage || '']\"\n                    [classImageInclude]=\"configTemplateRadio.classIncludeImage || ''\"\n                    [bullet]=\"item().bullet\"\n                    [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                    [classLabelInclude]=\"item().classLabelInclude || ''\"\n                    [popover]=\"item().dataPopover\"\n                    [clickExactly]=\"clickExactly()\"\n                    [disableLabel]=\"disableLabel()\"\n                    [zIndexLabel]=\"configTemplateRadio.zIndexPopover ?? 1200\"\n                    (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                    (outChange)=\"handlerChange('radio',item())\"\n                    (outClickLabel)=\"handlerChange('radio',item())\" />\n                }\n                @if (configTemplateRadio?.rows?.()) {\n                  <libs_ui-components-list-templates_rows class=\"w-full {{ configTemplateRadio.classRows ?? '' }}\"\n                    [item]=\"item()\"\n                    [fieldKey]=\"fieldKey()\"\n                    [keySelected]=\"keySelected()\"\n                    [configTemplate]=\"configTemplateRadio\"\n                    (outEvent)=\"handlerChange('radio',$event.item)\" />\n                }\n              </div>\n            </div>\n          }\n        </virtual-scroller>\n      </div>\n    }\n    @if (!items().length) {\n      <div [class]=\"'libs-ui-font-h4r text-[#c1c1c1] '+ (config()?.textNoDataClassInclude ?? 'py-[4px] px-[12px]')\">\n        @if (!keySearch() && !loading()) {\n          <span>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</span>\n        }\n        @if (templateRefSearchNoData() && keySearch() && !loading()) {\n          <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n        }\n        @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n          <span>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</span>\n        }\n        @if (loading()) {\n          <span>&nbsp;</span>\n        }\n      </div>\n    }\n\n    @if (loading()) {\n      <libs_ui-components-spinner [size]=\"'medium'\" />\n    }\n  </div>\n}\n", styles: [".libs-ui-list-template-radio-item{padding:4px 22px 4px 1px;font-size:12px;line-height:18px;position:relative}\n"] }]
+                    ], template: "@if (configTemplateRadio(); as configTemplateRadio) {\n  <div class=\"relative h-full w-full\">\n    @if (items().length) {\n      <div #elementScroll\n        LibsUiComponentsScrollOverlayDirective\n        class=\"w-full\"\n        [style.height]=\"heightViewPort() ? heightViewPort()+'px':'100%'\"\n        (moScrollBottom)=\"handlerScrollBottom()\">\n        <virtual-scroller #scroll\n          [parentScroll]=\"elementScroll\"\n          [items]=\"items()\"\n          class=\"h-full\">\n          @for (item of scroll.viewPortItems; track item()[fieldKey()]) {\n            <div #itemRef\n              [class]=\"'libs-ui-list-template-radio-item flex ' + (configTemplateRadio.classItemInclude || '')\"\n              [class.libs-ui-bg-list-hover]=\"!clickExactly()\"\n              [class.libs-ui-bg-list-hover-active]=\"!clickExactly()\"\n              [class.!pl-[12px]]=\"paddingLeftItem()\"\n              [class.bg-[#ffffff]]=\"clickExactly()\"\n              [class.!py-[2px]]=\"clickExactly()\"\n              (click)=\"handlerChange($event,item())\">\n              <div class=\"flex flex-col w-full\">\n                @if (item().fieldLabel) {\n                  <libs_ui-components-radio-single [label]=\"item().fieldLabel\"\n                    [avatarConfig]=\"item().avatarConfig\"\n                    [active]=\"keySelected() === item()[fieldKey()]\"\n                    [key]=\"item()[fieldKey()]\"\n                    [imgTypeIcon]=\"configTemplateRadio.hasAvatarGroupSocial\"\n                    [linkImage]=\"configTemplateRadio.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateRadio.getImageError ? configTemplateRadio.getImageError : configTemplateRadio.getImage):item()) | async) : item()[configTemplateRadio.fieldGetImage || '']\"\n                    [classImageInclude]=\"configTemplateRadio.classIncludeImage || ''\"\n                    [bullet]=\"item().bullet\"\n                    [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length)\"\n                    [classLabelInclude]=\"item().classLabelInclude || ''\"\n                    [popover]=\"item().dataPopover\"\n                    [clickExactly]=\"clickExactly()\"\n                    [disableLabel]=\"disableLabel()\"\n                    [zIndexLabel]=\"configTemplateRadio.zIndexPopover ?? 1200\"\n                    (outChangStageFlagMousePopover)='handlerChangStageFlagMouse($event)'\n                    (outChange)=\"handlerChange('radio',item())\"\n                    (outClickLabel)=\"handlerChange('radio',item())\" />\n                }\n                @if (configTemplateRadio?.rows?.()) {\n                  <libs_ui-components-list-templates_rows class=\"w-full {{ configTemplateRadio.classRows ?? '' }}\"\n                    [item]=\"item()\"\n                    [fieldKey]=\"fieldKey()\"\n                    [keySelected]=\"keySelected()\"\n                    [configTemplate]=\"configTemplateRadio\"\n                    (outEvent)=\"handlerChange('radio',$event.item)\" />\n                }\n              </div>\n            </div>\n          }\n        </virtual-scroller>\n      </div>\n    }\n    @if (!items().length) {\n      <div [class]=\"'libs-ui-font-h4r text-[#c1c1c1] '+ (config()?.textNoDataClassInclude ?? 'py-[4px] px-[12px]')\">\n        @if (!keySearch() && !loading()) {\n          <span>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</span>\n        }\n        @if (templateRefSearchNoData() && keySearch() && !loading()) {\n          <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n        }\n        @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n          <span>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</span>\n        }\n        @if (loading()) {\n          <span>&nbsp;</span>\n        }\n      </div>\n    }\n\n    @if (loading()) {\n      <libs_ui-components-spinner [size]=\"'medium'\" />\n    }\n  </div>\n}\n", styles: [".libs-ui-list-template-radio-item{padding:4px 22px 4px 1px;font-size:12px;line-height:18px;position:relative}\n"] }]
         }] });
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
@@ -1999,7 +2004,7 @@ class LibsUiComponentsListTagComponent extends LibsUiComponentsListTemplatesComp
         this.outSelectKey.emit(undefined);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListTagComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListTagComponent, isStandalone: true, selector: "libs_ui-components-list-templates_tag", usesInheritance: true, ngImport: i0, template: "@if (configTemplateTag(); as configTemplateTag) {\n  <div class=\"w-full h-full relative\"\n    LibsUiComponentsScrollOverlayDirective\n    (moScrollBottom)=\"handlerScrollBottom()\">\n    <div class=\"relative max-h-[150px] h-full {{ configTemplateTag.classIncludeContainer }}\"\n      [ngClass]=\"{'flex flex-wrap': !configTemplateTag.ignoreItemFlexWrap}\"\n      [class.min-h-[45px]]=\"!loading() && (!items() || !items().length)\"\n      [class.min-h-[104px]]=\"loading() && items()\">\n      @for (item of items(); track item()[fieldKey()]) {\n        <div [class.libs-ui-disable]=\"loading() || disable()\"\n          [class.pointer-events-none]=\"loading() || disable()\"\n          [class]=\"item().classContainerItem\">\n          @if (!item().bullet) {\n            <div (click)=\"handlerSelectItem($event, item())\"\n              [class]=\"item().classItem || 'rounded-[20px] mb-[8px] mr-[8px] py-[4px] px-[8px] flex items-center cursor-pointer'\"\n              [class.bg-[#e9f1fe]]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length\"\n              [class.libs-ui-color-global]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length\">\n              @if (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) {\n                <div class=\"mr-[8px] text-[12px] libs-ui-icon-check libs-ui-color-global\"></div>\n              }\n              <span class=\"mo-lib-font-h6r\"\n                [innerHTML]=\"item().fieldLabel\"></span>\n            </div>\n          }\n          @if (item().bullet) {\n            <div [class]=\"item().classItem || 'rounded-[10px] px-[8px] py-[1px] mb-[8px] mr-[8px]'\"\n              [class.w-max]=\"configTemplateTag?.ignoreItemFlexWrap\"\n              [style.background-color]=\"item().bullet?.backgroundColor\"\n              [style.color]=\"item().bullet?.color\"\n              (click)=\"handlerSelectItem($event,item())\">\n              <span [innerHTML]=\"item().fieldLabel\"></span>\n            </div>\n          }\n        </div>\n      }\n      @if (!items() || !items().length) {\n        <div [class]=\"'libs-ui-font-h4r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[4px]')\">\n          @if (!keySearch() && !loading()) {\n            <ng-container>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</ng-container>\n          }\n          @if (templateRefSearchNoData() && keySearch() && !loading()) {\n            <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n          }\n          @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n            <ng-container>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</ng-container>\n          }\n          @if (loading()) {\n            <ng-container>&nbsp;</ng-container>\n          }\n        </div>\n      }\n    </div>\n    @if (loading()) {\n      <div class=\"w-full h-full absolute top-0\">\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      </div>\n    }\n  </div>\n}\n", dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListTagComponent, isStandalone: true, selector: "libs_ui-components-list-templates_tag", usesInheritance: true, ngImport: i0, template: "@if (configTemplateTag(); as configTemplateTag) {\n  <div class=\"w-full h-full relative\"\n    LibsUiComponentsScrollOverlayDirective\n    (moScrollBottom)=\"handlerScrollBottom()\">\n    <div class=\"relative max-h-[150px] h-full {{ configTemplateTag.classIncludeContainer }}\"\n      [ngClass]=\"{'flex flex-wrap': !configTemplateTag.ignoreItemFlexWrap}\"\n      [class.min-h-[45px]]=\"!loading() && (!items() || !items().length)\"\n      [class.min-h-[104px]]=\"loading() && items()\">\n      @for (item of items(); track item()[fieldKey()]) {\n        <div [class.libs-ui-disable]=\"loading() || disable()\"\n          [class.pointer-events-none]=\"loading() || disable()\"\n          [class]=\"item().classContainerItem\">\n          @if (!item().bullet) {\n            <div (click)=\"handlerSelectItem($event, item())\"\n              [class]=\"item().classItem || 'rounded-[20px] mb-[8px] mr-[8px] py-[4px] px-[8px] flex items-center cursor-pointer'\"\n              [class.bg-[#e9f1fe]]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length\"\n              [class.libs-ui-color-global]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length\">\n              @if (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) {\n                <div class=\"mr-[8px] text-[12px] libs-ui-icon-check libs-ui-color-global\"></div>\n              }\n              <span class=\"mo-lib-font-h6r\"\n                [innerHTML]=\"item().fieldLabel\"></span>\n            </div>\n          }\n          @if (item().bullet) {\n            <div [class]=\"item().classItem || 'rounded-[10px] px-[8px] py-[1px] mb-[8px] mr-[8px]'\"\n              [class.w-max]=\"configTemplateTag?.ignoreItemFlexWrap\"\n              [style.background-color]=\"item().bullet?.backgroundColor\"\n              [style.color]=\"item().bullet?.color\"\n              (click)=\"handlerSelectItem($event,item())\">\n              <span [innerHTML]=\"item().fieldLabel\"></span>\n            </div>\n          }\n        </div>\n      }\n      @if (!items() || !items().length) {\n        <div [class]=\"'libs-ui-font-h4r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[4px]')\">\n          @if (!keySearch() && !loading()) {\n            <ng-container>{{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}</ng-container>\n          }\n          @if (templateRefSearchNoData() && keySearch() && !loading()) {\n            <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n          }\n          @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n            <ng-container>{{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}</ng-container>\n          }\n          @if (loading()) {\n            <ng-container>&nbsp;</ng-container>\n          }\n        </div>\n      }\n    </div>\n    @if (loading()) {\n      <div class=\"w-full h-full absolute top-0\">\n        <libs_ui-components-spinner [size]=\"'medium'\" />\n      </div>\n    }\n  </div>\n}\n", dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListTagComponent, decorators: [{
             type: Component,
@@ -2219,7 +2224,7 @@ class LibsUiComponentsListTextComponent extends LibsUiComponentsListTemplatesCom
         item.specific_loadImgError = true;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListTextComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListTextComponent, isStandalone: true, selector: "libs_ui-components-list-templates_text", viewQueries: [{ propertyName: "virtualScrollerComponent", first: true, predicate: VirtualScrollerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (configTemplateText(); as configTemplateText) {\n  <div class=\"relative h-full w-full\">\n    @if (items() && items().length) {\n      <div #elementScroll\n        [style.height]=\"!configTemplateText.notUseVirtualScroll && heightViewPort() && (!config()?.ignoreShowDataWhenNotSearch || (config()?.ignoreShowDataWhenNotSearch && config()?.ignoreFixHeightShowDataWhenNotSearch))  ? heightViewPort()+'px':'100%'\"\n        class=\"w-full\"\n        LibsUiComponentsScrollOverlayDirective\n        (outScrollBottom)=\"handlerScrollBottom()\">\n        @if (!configTemplateText.notUseVirtualScroll) {\n          <virtual-scroller #scroll\n            [parentScroll]=\"elementScroll\"\n            [items]=\"items()\"\n            class=\"h-full\">\n            <ng-container *ngTemplateOutlet='listRef;context:{itemsView:scroll.viewPortItems}' />\n          </virtual-scroller>\n        }\n        @if (configTemplateText.notUseVirtualScroll) {\n          <ng-container *ngTemplateOutlet='listRef;context:{itemsView:items()}' />\n        }\n      </div>\n    }\n    @if ((!items() || !items().length) && (!config()?.ignoreShowDataWhenNotSearch || keySearch())) {\n      <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[6px] px-[16px]')\">\n        @if (!keySearch() && !loading()) {\n          {{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}\n        }\n        @if (templateRefSearchNoData() && keySearch() && !loading()) {\n          <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n        }\n        @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n          {{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}\n        }\n        @if (loading()) {\n          &nbsp;\n        }\n      </div>\n    }\n    @if (loading()) {\n      <libs_ui-components-spinner [size]=\"loadingIconSize() || 'medium'\" />\n    }\n  </div>\n  <ng-template #listRef\n    let-itemsView='itemsView'>\n    @for (item of itemsView; track item()[fieldKey()]) {\n      <div #itemRef\n        [class]=\"item().classItemWrapper || ''\">\n        <div LibsUiComponentsListHighlightKeySearchDirective\n          [isHighlight]=\"config()?.highlightTextSearchInResult\"\n          [keySearch]=\"keySearch()\"\n          [class]=\"'libs-ui-list-template-text-item flex '+(item().classItem || '')\"\n          [class.items-center]=\"!item().itemAlignStart\"\n          [class.items-start]=\"item().itemAlignStart\"\n          [class.libs-ui-bg-list-hover-danger]=\"!clickExactly() && item().hoverDanger\"\n          [class.libs-ui-bg-list-hover]=\"!clickExactly()  && !item().hoverDanger\"\n          [class.libs-ui-bg-list-active]=\"!clickExactly() && keySelected() === item()[fieldKey()]\"\n          [class.!pl-[16px]]=\"paddingLeftItem()\"\n          [class.bg-[#ffffff]]=\"clickExactly()\"\n          [class.libs-ui-bg-list-hover-ffffff]=\"item().disable\"\n          [class.cursor-default]=\"item().disable\"\n          [class.py-[2px]]=\"clickExactly()\"\n          [class.pr-[48px]]=\"keySelected() === item()[fieldKey()] && (!configTemplateText?.ignoreIconSelected || configTemplateText?.actionSort)&& !configTemplateText?.stylePaddingRightItemOther\"\n          [ngClass]=\"{'pointer-events-none libs-ui-disable':loading() || disable() || ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) && !ignoreClassDisableDefaultWhenUseKeysDisableItem())}\"\n          (click)=\"handlerClickRelative($event,item())\">\n          @if (item().bullet) {\n            <span class=\"libs-ui-list-template-text-item-bullet flex flex-shrink-0\"\n              [style.background-color]=\"item().bullet.backgroundColor\"\n              (click)=\"handlerSelectItem($event,item())\">\n            </span>\n          }\n\n          @if (item().avatarConfig; as avatarConfig) {\n            <libs_ui-components-avatar [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n              [classInclude]=\"avatarConfig.classInclude\"\n              [classImageInclude]=\"avatarConfig.classImageInclude\"\n              [size]='avatarConfig.size || 32'\n              [linkAvatar]=\"avatarConfig.linkAvatar\"\n              [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n              [idGenColor]=\"avatarConfig.idGenColor\"\n              [textAvatar]=\"avatarConfig.textAvatar\"\n              [classImageInclude]=\"avatarConfig.classImageInclude\" />\n          }\n          @if (configTemplateText.getImage || configTemplateText.fieldGetImage) {\n            <img\n              [src]=\"configTemplateText.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateText.getImageError ? configTemplateText.getImageError : configTemplateText.getImage):item()) | async) : item()[configTemplateText.fieldGetImage || '']\"\n              [class]=\"'libs-ui-list-template-text-item-avatar ' + (configTemplateText.classIncludeImage ?? '')\"\n              [class.w-[18px]]=\"configTemplateText.imgTypeIcon\"\n              [class.h-[18px]]=\"configTemplateText.imgTypeIcon\"\n              (error)=\"handlerImageError($event, item())\"\n              (click)=\"handlerSelectItem($event,item())\" />\n          }\n          @if (item().buttonLeftConfig; as buttonLeft) {\n            @if (item().hrefButton) {\n              <a [class.w-full]=\"!buttonLeft.ignoreWidth100\"\n                [href]=\"item().hrefButton\">\n                <ng-container *ngTemplateOutlet=\"buttonLeftTemplate\" />\n              </a>\n            }\n            @if (!item().hrefButton) {\n              <div [class.w-full]=\"!buttonLeft.ignoreWidth100\">\n                <ng-container *ngTemplateOutlet=\"buttonLeftTemplate\" />\n              </div>\n            }\n            <ng-template #buttonLeftTemplate>\n              <libs_ui-components-buttons-button class=\"w-full\"\n                [type]=\"buttonLeft.type || 'button-link-primary'\"\n                [label]=\"buttonLeft.label || ' '\"\n                [zIndex]=\"buttonLeft.zIndex\"\n                [disable]=\"buttonLeft.disable\"\n                [classIconLeft]=\"buttonLeft.classIconLeft ? ((buttonLeft.classIconLeft || '')+' flex mr-[8px] text-[12px]') : ''\"\n                [classInclude]=\"(buttonLeft.classInclude|| '')+' w-full'\"\n                [classLabel]=\"(buttonLeft.classLabel ?? 'libs-ui-font-h4r')\"\n                [ignoreStopPropagationEvent]=\"buttonLeft.ignoreStopPropagationEvent\"\n                [styleIconLeft]=\"buttonLeft.styleIconLeft\"\n                [styleButton]=\"buttonLeft.styleButton\"\n                (moClick)=\"handlerSelectItem($event,item())\" />\n            </ng-template>\n          }\n          @if (item().switchConfig) {\n            <libs_ui-components-switch [active]=\"item().switchConfig.active\"\n              (moSwitch)=\"handlerSelectItem('click',item())\" />\n          }\n          @if (item().classIconLeft) {\n            <i [class]=\"item().classIconLeft + ' mr-[8px] text-[14px]'\"></i>\n          }\n          @if (!item().ignoreShowFieldLabel && !configTemplateText.rows) {\n            <libs_ui-components-popover [type]=\"item().popoverLabel?.type || 'text'\"\n              [elementRefCustom]=\"item().popoverLabel?.type === 'text'? undefined:itemRef\"\n              [ignoreShowPopover]=\"item().popoverLabel?.ignoreShowPopover\"\n              [config]=\"item().popoverLabel?.config || (configTemplateText.configLabelPopover || {})\"\n              [innerHtml]=\"item().fieldLabel\"\n              [classInclude]=\"item().classInclude\"\n              (moEvent)=\"handlerSelectItem($event,item())\" />\n          }\n          @if (item().fieldPopover; as popover) {\n            <libs_ui-components-popover class=\"{{ popover.classInclude || '' }}\"\n              [config]=\"popover?.config\">\n              @if (!popover.dataView) {\n                <i class=\"libs-ui-icon-tooltip-outline\"></i>\n              }\n              @if (popover.dataView) {\n                <div [innerHtml]=\"popover.dataView | translate\"></div>\n              }\n            </libs_ui-components-popover>\n          }\n          @if (configTemplateText?.rows) {\n            <libs_ui-components-list-templates_rows class=\"w-full {{ configTemplateText.classRowsWrapper || configTemplateText.classRows || '' }}\"\n              [item]=\"item()\"\n              [fieldKey]=\"fieldKey()\"\n              [keySelected]=\"keySelected()\"\n              [configTemplate]=\"configTemplateText\"\n              [zIndex]=\"zIndex()\"\n              (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n              (outEvent)=\"handlerSelectItem($event.event,$event.item,$event.action)\" />\n          }\n          @if ((keySelected() === item()[fieldKey()] || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) ? item()[fieldKey()] : undefined) && !configTemplateText.ignoreIconSelected && !configTemplateText.actionSort) {\n            <i [class]=\"'libs-ui-icon-check '+(configTemplateText.classIncludeIconSelected || 'right-[12px]')\">\n            </i>\n          }\n          @if (keySelected() === item()[fieldKey()] && configTemplateText.actionSort) {\n            <div class=\"libs-ui-list-template-text-sort\">\n              <libs_ui-components-buttons-sort-arrow [disable]=\"loading() || disable() || false\"\n                [mode]=\"configTemplateText.itemSort?.mode || ''\"\n                [fieldSort]=\"item()[fieldKey()]\"\n                (outChange)=\"handlerSort($event)\" />\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </ng-template>\n}\n", styles: [".libs-ui-list-template-text-item{padding:6px 16px 6px 1px;font-size:12px;line-height:18px;position:relative;cursor:pointer}.libs-ui-list-template-text-item>.libs-ui-icon-check,.libs-ui-list-template-text-item .libs-ui-list-template-text-sort{position:absolute;right:16px}.libs-ui-list-template-text-item>.libs-ui-icon-check:before,.libs-ui-list-template-text-item .libs-ui-list-template-text-sort:before{font-size:16px;color:var(--libs-ui-color-default, #226FF5)}.libs-ui-list-template-text-item-bullet{width:10px;height:10px;border-radius:50%;margin-right:8px;cursor:pointer}.libs-ui-list-template-text-item-avatar{width:24px;height:24px;border-radius:50%;margin-right:8px;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "component", type: i1$1.VirtualScrollerComponent, selector: "virtual-scroller,[virtualScroller]", inputs: ["executeRefreshOutsideAngularZone", "enableUnequalChildrenSizes", "RTL", "useMarginInsteadOfTranslate", "modifyOverflowStyleOfParentScroll", "stripedTable", "scrollbarWidth", "scrollbarHeight", "childWidth", "childHeight", "ssrChildWidth", "ssrChildHeight", "ssrViewportWidth", "ssrViewportHeight", "bufferAmount", "scrollAnimationTime", "resizeBypassRefreshThreshold", "scrollThrottlingTime", "scrollDebounceTime", "checkResizeInterval", "items", "compareItems", "horizontal", "parentScroll"], outputs: ["vsUpdate", "vsChange", "vsStart", "vsEnd"], exportAs: ["virtualScroller"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "component", type: LibsUiComponentsAvatarComponent, selector: "libs_ui-components-avatar", inputs: ["getLastTextAfterSpace", "typeShape", "classInclude", "size", "linkAvatar", "linkAvatarError", "idGenColor", "textAvatar", "classImageInclude"], outputs: ["outAvatarError"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "component", type: LibsUiComponentsSwitchComponent, selector: "libs_ui-components-switch", inputs: ["size", "disable", "active"], outputs: ["activeChange", "outSwitch"] }, { kind: "component", type: LibsUiComponentsButtonsSortArrowComponent, selector: "libs_ui-components-buttons-sort-arrow", inputs: ["size", "mode", "fieldSort", "disable", "ignorePopoverContent", "popoverContentAsc", "popoverContentDesc", "defaultMode", "zIndex"], outputs: ["modeChange", "outChange"] }, { kind: "directive", type: LibsUiComponentsListHighlightKeySearchDirective, selector: "[LibsUiComponentsListHighlightKeySearchDirective]", inputs: ["isHighlight", "keySearch", "classHighlight"] }, { kind: "component", type: LibsUiComponentsListRowsComponent, selector: "libs_ui-components-list-templates_rows", inputs: ["configTemplate", "item", "keySelected", "fieldKey", "zIndex"], outputs: ["outChangStageFlagMousePopover", "outEvent"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListTextComponent, isStandalone: true, selector: "libs_ui-components-list-templates_text", viewQueries: [{ propertyName: "virtualScrollerComponent", first: true, predicate: VirtualScrollerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (configTemplateText(); as configTemplateText) {\n  <div class=\"relative h-full w-full\">\n    @if (items() && items().length) {\n      <div #elementScroll\n        [style.height]=\"!configTemplateText.notUseVirtualScroll && heightViewPort() && (!config()?.ignoreShowDataWhenNotSearch || (config()?.ignoreShowDataWhenNotSearch && config()?.ignoreFixHeightShowDataWhenNotSearch))  ? heightViewPort()+'px':'100%'\"\n        class=\"w-full\"\n        LibsUiComponentsScrollOverlayDirective\n        (outScrollBottom)=\"handlerScrollBottom()\">\n        @if (!configTemplateText.notUseVirtualScroll) {\n          <virtual-scroller #scroll\n            [parentScroll]=\"elementScroll\"\n            [items]=\"items()\"\n            class=\"h-full\">\n            <ng-container *ngTemplateOutlet='listRef;context:{itemsView:scroll.viewPortItems}' />\n          </virtual-scroller>\n        }\n        @if (configTemplateText.notUseVirtualScroll) {\n          <ng-container *ngTemplateOutlet='listRef;context:{itemsView:items()}' />\n        }\n      </div>\n    }\n    @if ((!items() || !items().length) && (!config()?.ignoreShowDataWhenNotSearch || keySearch())) {\n      <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[6px] px-[16px]')\">\n        @if (!keySearch() && !loading()) {\n          {{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}\n        }\n        @if (templateRefSearchNoData() && keySearch() && !loading()) {\n          <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n        }\n        @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n          {{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}\n        }\n        @if (loading()) {\n          &nbsp;\n        }\n      </div>\n    }\n    @if (loading()) {\n      <libs_ui-components-spinner [size]=\"loadingIconSize() || 'medium'\" />\n    }\n  </div>\n  <ng-template #listRef\n    let-itemsView='itemsView'>\n    @for (item of itemsView; track item()[fieldKey()]) {\n      <div #itemRef\n        [class]=\"item().classItemWrapper || ''\">\n        <div LibsUiComponentsListHighlightKeySearchDirective\n          [isHighlight]=\"config()?.highlightTextSearchInResult\"\n          [keySearch]=\"keySearch()\"\n          [class]=\"'libs-ui-list-template-text-item flex '+(item().classItem || '')\"\n          [class.items-center]=\"!item().itemAlignStart\"\n          [class.items-start]=\"item().itemAlignStart\"\n          [class.libs-ui-bg-list-hover-danger]=\"!clickExactly() && item().hoverDanger\"\n          [class.libs-ui-bg-list-hover]=\"!clickExactly()  && !item().hoverDanger\"\n          [class.libs-ui-bg-list-active]=\"!clickExactly() && keySelected() === item()[fieldKey()]\"\n          [class.!pl-[16px]]=\"paddingLeftItem()\"\n          [class.bg-[#ffffff]]=\"clickExactly()\"\n          [class.libs-ui-bg-list-hover-ffffff]=\"item().disable\"\n          [class.cursor-default]=\"item().disable\"\n          [class.!py-[2px]]=\"clickExactly()\"\n          [class.!pr-[48px]]=\"keySelected() === item()[fieldKey()] && (!configTemplateText?.ignoreIconSelected || configTemplateText?.actionSort)&& !configTemplateText?.stylePaddingRightItemOther\"\n          [ngClass]=\"{'pointer-events-none libs-ui-disable':loading() || disable() || ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) && !ignoreClassDisableDefaultWhenUseKeysDisableItem())}\"\n          (click)=\"handlerClickRelative($event,item())\">\n          @if (item().bullet) {\n            <span class=\"libs-ui-list-template-text-item-bullet flex flex-shrink-0\"\n              [style.background-color]=\"item().bullet.backgroundColor\"\n              (click)=\"handlerSelectItem($event,item())\">\n            </span>\n          }\n\n          @if (item().avatarConfig; as avatarConfig) {\n            <libs_ui-components-avatar [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n              [classInclude]=\"avatarConfig.classInclude\"\n              [classImageInclude]=\"avatarConfig.classImageInclude\"\n              [size]='avatarConfig.size || 32'\n              [linkAvatar]=\"avatarConfig.linkAvatar\"\n              [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n              [idGenColor]=\"avatarConfig.idGenColor\"\n              [textAvatar]=\"avatarConfig.textAvatar\"\n              [classImageInclude]=\"avatarConfig.classImageInclude\" />\n          }\n          @if (configTemplateText.getImage || configTemplateText.fieldGetImage) {\n            <img\n              [src]=\"configTemplateText.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateText.getImageError ? configTemplateText.getImageError : configTemplateText.getImage):item()) | async) : item()[configTemplateText.fieldGetImage || '']\"\n              [class]=\"'libs-ui-list-template-text-item-avatar ' + (configTemplateText.classIncludeImage ?? '')\"\n              [class.w-[18px]]=\"configTemplateText.imgTypeIcon\"\n              [class.h-[18px]]=\"configTemplateText.imgTypeIcon\"\n              (error)=\"handlerImageError($event, item())\"\n              (click)=\"handlerSelectItem($event,item())\" />\n          }\n          @if (item().buttonLeftConfig; as buttonLeft) {\n            @if (item().hrefButton) {\n              <a [class.w-full]=\"!buttonLeft.ignoreWidth100\"\n                [href]=\"item().hrefButton\">\n                <ng-container *ngTemplateOutlet=\"buttonLeftTemplate\" />\n              </a>\n            }\n            @if (!item().hrefButton) {\n              <div [class.w-full]=\"!buttonLeft.ignoreWidth100\">\n                <ng-container *ngTemplateOutlet=\"buttonLeftTemplate\" />\n              </div>\n            }\n            <ng-template #buttonLeftTemplate>\n              <libs_ui-components-buttons-button class=\"w-full\"\n                [type]=\"buttonLeft.type || 'button-link-primary'\"\n                [label]=\"buttonLeft.label || ' '\"\n                [zIndex]=\"buttonLeft.zIndex\"\n                [disable]=\"buttonLeft.disable\"\n                [classIconLeft]=\"buttonLeft.classIconLeft ? ((buttonLeft.classIconLeft || '')+' flex mr-[8px] text-[12px]') : ''\"\n                [classInclude]=\"(buttonLeft.classInclude|| '')+' w-full'\"\n                [classLabel]=\"(buttonLeft.classLabel ?? 'libs-ui-font-h4r')\"\n                [ignoreStopPropagationEvent]=\"buttonLeft.ignoreStopPropagationEvent\"\n                [styleIconLeft]=\"buttonLeft.styleIconLeft\"\n                [styleButton]=\"buttonLeft.styleButton\"\n                (moClick)=\"handlerSelectItem($event,item())\" />\n            </ng-template>\n          }\n          @if (item().switchConfig) {\n            <libs_ui-components-switch [active]=\"item().switchConfig.active\"\n              (moSwitch)=\"handlerSelectItem('click',item())\" />\n          }\n          @if (item().classIconLeft) {\n            <i [class]=\"item().classIconLeft + ' mr-[8px] text-[14px]'\"></i>\n          }\n          @if (!item().ignoreShowFieldLabel && !configTemplateText.rows) {\n            <libs_ui-components-popover [type]=\"item().popoverLabel?.type || 'text'\"\n              [elementRefCustom]=\"item().popoverLabel?.type === 'text'? undefined:itemRef\"\n              [ignoreShowPopover]=\"item().popoverLabel?.ignoreShowPopover\"\n              [config]=\"item().popoverLabel?.config || (configTemplateText.configLabelPopover || {})\"\n              [innerHtml]=\"item().fieldLabel\"\n              [classInclude]=\"item().classInclude\"\n              (moEvent)=\"handlerSelectItem($event,item())\" />\n          }\n          @if (item().fieldPopover; as popover) {\n            <libs_ui-components-popover class=\"{{ popover.classInclude || '' }}\"\n              [config]=\"popover?.config\">\n              @if (!popover.dataView) {\n                <i class=\"libs-ui-icon-tooltip-outline\"></i>\n              }\n              @if (popover.dataView) {\n                <div [innerHtml]=\"popover.dataView | translate\"></div>\n              }\n            </libs_ui-components-popover>\n          }\n          @if (configTemplateText?.rows) {\n            <libs_ui-components-list-templates_rows class=\"w-full {{ configTemplateText.classRowsWrapper || configTemplateText.classRows || '' }}\"\n              [item]=\"item()\"\n              [fieldKey]=\"fieldKey()\"\n              [keySelected]=\"keySelected()\"\n              [configTemplate]=\"configTemplateText\"\n              [zIndex]=\"zIndex()\"\n              (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n              (outEvent)=\"handlerSelectItem($event.event,$event.item,$event.action)\" />\n          }\n          @if ((keySelected() === item()[fieldKey()] || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) ? item()[fieldKey()] : undefined) && !configTemplateText.ignoreIconSelected && !configTemplateText.actionSort) {\n            <i [class]=\"'libs-ui-icon-check '+(configTemplateText.classIncludeIconSelected || 'right-[12px]')\">\n            </i>\n          }\n          @if (keySelected() === item()[fieldKey()] && configTemplateText.actionSort) {\n            <div class=\"libs-ui-list-template-text-sort\">\n              <libs_ui-components-buttons-sort-arrow [disable]=\"loading() || disable() || false\"\n                [mode]=\"configTemplateText.itemSort?.mode || ''\"\n                [fieldSort]=\"item()[fieldKey()]\"\n                (outChange)=\"handlerSort($event)\" />\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </ng-template>\n}\n", styles: [".libs-ui-list-template-text-item{padding:6px 16px 6px 1px;font-size:12px;line-height:18px;position:relative;cursor:pointer}.libs-ui-list-template-text-item>.libs-ui-icon-check,.libs-ui-list-template-text-item .libs-ui-list-template-text-sort{position:absolute;right:16px}.libs-ui-list-template-text-item>.libs-ui-icon-check:before,.libs-ui-list-template-text-item .libs-ui-list-template-text-sort:before{font-size:16px;color:var(--libs-ui-color-default, #226FF5)}.libs-ui-list-template-text-item-bullet{width:10px;height:10px;border-radius:50%;margin-right:8px;cursor:pointer}.libs-ui-list-template-text-item-avatar{width:24px;height:24px;border-radius:50%;margin-right:8px;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: VirtualScrollerModule }, { kind: "component", type: i1$1.VirtualScrollerComponent, selector: "virtual-scroller,[virtualScroller]", inputs: ["executeRefreshOutsideAngularZone", "enableUnequalChildrenSizes", "RTL", "useMarginInsteadOfTranslate", "modifyOverflowStyleOfParentScroll", "stripedTable", "scrollbarWidth", "scrollbarHeight", "childWidth", "childHeight", "ssrChildWidth", "ssrChildHeight", "ssrViewportWidth", "ssrViewportHeight", "bufferAmount", "scrollAnimationTime", "resizeBypassRefreshThreshold", "scrollThrottlingTime", "scrollDebounceTime", "checkResizeInterval", "items", "compareItems", "horizontal", "parentScroll"], outputs: ["vsUpdate", "vsChange", "vsStart", "vsEnd"], exportAs: ["virtualScroller"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "component", type: LibsUiComponentsAvatarComponent, selector: "libs_ui-components-avatar", inputs: ["getLastTextAfterSpace", "typeShape", "classInclude", "size", "linkAvatar", "linkAvatarError", "idGenColor", "textAvatar", "classImageInclude"], outputs: ["outAvatarError"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "classContainer", "options"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }, { kind: "component", type: LibsUiComponentsSwitchComponent, selector: "libs_ui-components-switch", inputs: ["size", "disable", "active"], outputs: ["activeChange", "outSwitch"] }, { kind: "component", type: LibsUiComponentsButtonsSortArrowComponent, selector: "libs_ui-components-buttons-sort-arrow", inputs: ["size", "mode", "fieldSort", "disable", "ignorePopoverContent", "popoverContentAsc", "popoverContentDesc", "defaultMode", "zIndex"], outputs: ["modeChange", "outChange"] }, { kind: "directive", type: LibsUiComponentsListHighlightKeySearchDirective, selector: "[LibsUiComponentsListHighlightKeySearchDirective]", inputs: ["isHighlight", "keySearch", "classHighlight"] }, { kind: "component", type: LibsUiComponentsListRowsComponent, selector: "libs_ui-components-list-templates_rows", inputs: ["configTemplate", "item", "keySelected", "fieldKey", "zIndex"], outputs: ["outChangStageFlagMousePopover", "outEvent"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListTextComponent, decorators: [{
             type: Component,
@@ -2236,7 +2241,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         LibsUiComponentsListHighlightKeySearchDirective,
                         LibsUiComponentsListRowsComponent,
                         LibsUiPipesCallFunctionInTemplatePipe
-                    ], template: "@if (configTemplateText(); as configTemplateText) {\n  <div class=\"relative h-full w-full\">\n    @if (items() && items().length) {\n      <div #elementScroll\n        [style.height]=\"!configTemplateText.notUseVirtualScroll && heightViewPort() && (!config()?.ignoreShowDataWhenNotSearch || (config()?.ignoreShowDataWhenNotSearch && config()?.ignoreFixHeightShowDataWhenNotSearch))  ? heightViewPort()+'px':'100%'\"\n        class=\"w-full\"\n        LibsUiComponentsScrollOverlayDirective\n        (outScrollBottom)=\"handlerScrollBottom()\">\n        @if (!configTemplateText.notUseVirtualScroll) {\n          <virtual-scroller #scroll\n            [parentScroll]=\"elementScroll\"\n            [items]=\"items()\"\n            class=\"h-full\">\n            <ng-container *ngTemplateOutlet='listRef;context:{itemsView:scroll.viewPortItems}' />\n          </virtual-scroller>\n        }\n        @if (configTemplateText.notUseVirtualScroll) {\n          <ng-container *ngTemplateOutlet='listRef;context:{itemsView:items()}' />\n        }\n      </div>\n    }\n    @if ((!items() || !items().length) && (!config()?.ignoreShowDataWhenNotSearch || keySearch())) {\n      <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[6px] px-[16px]')\">\n        @if (!keySearch() && !loading()) {\n          {{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}\n        }\n        @if (templateRefSearchNoData() && keySearch() && !loading()) {\n          <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n        }\n        @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n          {{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}\n        }\n        @if (loading()) {\n          &nbsp;\n        }\n      </div>\n    }\n    @if (loading()) {\n      <libs_ui-components-spinner [size]=\"loadingIconSize() || 'medium'\" />\n    }\n  </div>\n  <ng-template #listRef\n    let-itemsView='itemsView'>\n    @for (item of itemsView; track item()[fieldKey()]) {\n      <div #itemRef\n        [class]=\"item().classItemWrapper || ''\">\n        <div LibsUiComponentsListHighlightKeySearchDirective\n          [isHighlight]=\"config()?.highlightTextSearchInResult\"\n          [keySearch]=\"keySearch()\"\n          [class]=\"'libs-ui-list-template-text-item flex '+(item().classItem || '')\"\n          [class.items-center]=\"!item().itemAlignStart\"\n          [class.items-start]=\"item().itemAlignStart\"\n          [class.libs-ui-bg-list-hover-danger]=\"!clickExactly() && item().hoverDanger\"\n          [class.libs-ui-bg-list-hover]=\"!clickExactly()  && !item().hoverDanger\"\n          [class.libs-ui-bg-list-active]=\"!clickExactly() && keySelected() === item()[fieldKey()]\"\n          [class.!pl-[16px]]=\"paddingLeftItem()\"\n          [class.bg-[#ffffff]]=\"clickExactly()\"\n          [class.libs-ui-bg-list-hover-ffffff]=\"item().disable\"\n          [class.cursor-default]=\"item().disable\"\n          [class.py-[2px]]=\"clickExactly()\"\n          [class.pr-[48px]]=\"keySelected() === item()[fieldKey()] && (!configTemplateText?.ignoreIconSelected || configTemplateText?.actionSort)&& !configTemplateText?.stylePaddingRightItemOther\"\n          [ngClass]=\"{'pointer-events-none libs-ui-disable':loading() || disable() || ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) && !ignoreClassDisableDefaultWhenUseKeysDisableItem())}\"\n          (click)=\"handlerClickRelative($event,item())\">\n          @if (item().bullet) {\n            <span class=\"libs-ui-list-template-text-item-bullet flex flex-shrink-0\"\n              [style.background-color]=\"item().bullet.backgroundColor\"\n              (click)=\"handlerSelectItem($event,item())\">\n            </span>\n          }\n\n          @if (item().avatarConfig; as avatarConfig) {\n            <libs_ui-components-avatar [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n              [classInclude]=\"avatarConfig.classInclude\"\n              [classImageInclude]=\"avatarConfig.classImageInclude\"\n              [size]='avatarConfig.size || 32'\n              [linkAvatar]=\"avatarConfig.linkAvatar\"\n              [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n              [idGenColor]=\"avatarConfig.idGenColor\"\n              [textAvatar]=\"avatarConfig.textAvatar\"\n              [classImageInclude]=\"avatarConfig.classImageInclude\" />\n          }\n          @if (configTemplateText.getImage || configTemplateText.fieldGetImage) {\n            <img\n              [src]=\"configTemplateText.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateText.getImageError ? configTemplateText.getImageError : configTemplateText.getImage):item()) | async) : item()[configTemplateText.fieldGetImage || '']\"\n              [class]=\"'libs-ui-list-template-text-item-avatar ' + (configTemplateText.classIncludeImage ?? '')\"\n              [class.w-[18px]]=\"configTemplateText.imgTypeIcon\"\n              [class.h-[18px]]=\"configTemplateText.imgTypeIcon\"\n              (error)=\"handlerImageError($event, item())\"\n              (click)=\"handlerSelectItem($event,item())\" />\n          }\n          @if (item().buttonLeftConfig; as buttonLeft) {\n            @if (item().hrefButton) {\n              <a [class.w-full]=\"!buttonLeft.ignoreWidth100\"\n                [href]=\"item().hrefButton\">\n                <ng-container *ngTemplateOutlet=\"buttonLeftTemplate\" />\n              </a>\n            }\n            @if (!item().hrefButton) {\n              <div [class.w-full]=\"!buttonLeft.ignoreWidth100\">\n                <ng-container *ngTemplateOutlet=\"buttonLeftTemplate\" />\n              </div>\n            }\n            <ng-template #buttonLeftTemplate>\n              <libs_ui-components-buttons-button class=\"w-full\"\n                [type]=\"buttonLeft.type || 'button-link-primary'\"\n                [label]=\"buttonLeft.label || ' '\"\n                [zIndex]=\"buttonLeft.zIndex\"\n                [disable]=\"buttonLeft.disable\"\n                [classIconLeft]=\"buttonLeft.classIconLeft ? ((buttonLeft.classIconLeft || '')+' flex mr-[8px] text-[12px]') : ''\"\n                [classInclude]=\"(buttonLeft.classInclude|| '')+' w-full'\"\n                [classLabel]=\"(buttonLeft.classLabel ?? 'libs-ui-font-h4r')\"\n                [ignoreStopPropagationEvent]=\"buttonLeft.ignoreStopPropagationEvent\"\n                [styleIconLeft]=\"buttonLeft.styleIconLeft\"\n                [styleButton]=\"buttonLeft.styleButton\"\n                (moClick)=\"handlerSelectItem($event,item())\" />\n            </ng-template>\n          }\n          @if (item().switchConfig) {\n            <libs_ui-components-switch [active]=\"item().switchConfig.active\"\n              (moSwitch)=\"handlerSelectItem('click',item())\" />\n          }\n          @if (item().classIconLeft) {\n            <i [class]=\"item().classIconLeft + ' mr-[8px] text-[14px]'\"></i>\n          }\n          @if (!item().ignoreShowFieldLabel && !configTemplateText.rows) {\n            <libs_ui-components-popover [type]=\"item().popoverLabel?.type || 'text'\"\n              [elementRefCustom]=\"item().popoverLabel?.type === 'text'? undefined:itemRef\"\n              [ignoreShowPopover]=\"item().popoverLabel?.ignoreShowPopover\"\n              [config]=\"item().popoverLabel?.config || (configTemplateText.configLabelPopover || {})\"\n              [innerHtml]=\"item().fieldLabel\"\n              [classInclude]=\"item().classInclude\"\n              (moEvent)=\"handlerSelectItem($event,item())\" />\n          }\n          @if (item().fieldPopover; as popover) {\n            <libs_ui-components-popover class=\"{{ popover.classInclude || '' }}\"\n              [config]=\"popover?.config\">\n              @if (!popover.dataView) {\n                <i class=\"libs-ui-icon-tooltip-outline\"></i>\n              }\n              @if (popover.dataView) {\n                <div [innerHtml]=\"popover.dataView | translate\"></div>\n              }\n            </libs_ui-components-popover>\n          }\n          @if (configTemplateText?.rows) {\n            <libs_ui-components-list-templates_rows class=\"w-full {{ configTemplateText.classRowsWrapper || configTemplateText.classRows || '' }}\"\n              [item]=\"item()\"\n              [fieldKey]=\"fieldKey()\"\n              [keySelected]=\"keySelected()\"\n              [configTemplate]=\"configTemplateText\"\n              [zIndex]=\"zIndex()\"\n              (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n              (outEvent)=\"handlerSelectItem($event.event,$event.item,$event.action)\" />\n          }\n          @if ((keySelected() === item()[fieldKey()] || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) ? item()[fieldKey()] : undefined) && !configTemplateText.ignoreIconSelected && !configTemplateText.actionSort) {\n            <i [class]=\"'libs-ui-icon-check '+(configTemplateText.classIncludeIconSelected || 'right-[12px]')\">\n            </i>\n          }\n          @if (keySelected() === item()[fieldKey()] && configTemplateText.actionSort) {\n            <div class=\"libs-ui-list-template-text-sort\">\n              <libs_ui-components-buttons-sort-arrow [disable]=\"loading() || disable() || false\"\n                [mode]=\"configTemplateText.itemSort?.mode || ''\"\n                [fieldSort]=\"item()[fieldKey()]\"\n                (outChange)=\"handlerSort($event)\" />\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </ng-template>\n}\n", styles: [".libs-ui-list-template-text-item{padding:6px 16px 6px 1px;font-size:12px;line-height:18px;position:relative;cursor:pointer}.libs-ui-list-template-text-item>.libs-ui-icon-check,.libs-ui-list-template-text-item .libs-ui-list-template-text-sort{position:absolute;right:16px}.libs-ui-list-template-text-item>.libs-ui-icon-check:before,.libs-ui-list-template-text-item .libs-ui-list-template-text-sort:before{font-size:16px;color:var(--libs-ui-color-default, #226FF5)}.libs-ui-list-template-text-item-bullet{width:10px;height:10px;border-radius:50%;margin-right:8px;cursor:pointer}.libs-ui-list-template-text-item-avatar{width:24px;height:24px;border-radius:50%;margin-right:8px;cursor:pointer}\n"] }]
+                    ], template: "@if (configTemplateText(); as configTemplateText) {\n  <div class=\"relative h-full w-full\">\n    @if (items() && items().length) {\n      <div #elementScroll\n        [style.height]=\"!configTemplateText.notUseVirtualScroll && heightViewPort() && (!config()?.ignoreShowDataWhenNotSearch || (config()?.ignoreShowDataWhenNotSearch && config()?.ignoreFixHeightShowDataWhenNotSearch))  ? heightViewPort()+'px':'100%'\"\n        class=\"w-full\"\n        LibsUiComponentsScrollOverlayDirective\n        (outScrollBottom)=\"handlerScrollBottom()\">\n        @if (!configTemplateText.notUseVirtualScroll) {\n          <virtual-scroller #scroll\n            [parentScroll]=\"elementScroll\"\n            [items]=\"items()\"\n            class=\"h-full\">\n            <ng-container *ngTemplateOutlet='listRef;context:{itemsView:scroll.viewPortItems}' />\n          </virtual-scroller>\n        }\n        @if (configTemplateText.notUseVirtualScroll) {\n          <ng-container *ngTemplateOutlet='listRef;context:{itemsView:items()}' />\n        }\n      </div>\n    }\n    @if ((!items() || !items().length) && (!config()?.ignoreShowDataWhenNotSearch || keySearch())) {\n      <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] '+ (config()?.textNoDataClassInclude ?? 'py-[6px] px-[16px]')\">\n        @if (!keySearch() && !loading()) {\n          {{ (config()?.textNoData ?? 'i18n_have_no_selection') | translate }}\n        }\n        @if (templateRefSearchNoData() && keySearch() && !loading()) {\n          <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null;context:{keySearch:keySearch()}\" />\n        }\n        @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n          {{ (config()?.textSearchNoData ?? 'i18n_no_result') | translate }}\n        }\n        @if (loading()) {\n          &nbsp;\n        }\n      </div>\n    }\n    @if (loading()) {\n      <libs_ui-components-spinner [size]=\"loadingIconSize() || 'medium'\" />\n    }\n  </div>\n  <ng-template #listRef\n    let-itemsView='itemsView'>\n    @for (item of itemsView; track item()[fieldKey()]) {\n      <div #itemRef\n        [class]=\"item().classItemWrapper || ''\">\n        <div LibsUiComponentsListHighlightKeySearchDirective\n          [isHighlight]=\"config()?.highlightTextSearchInResult\"\n          [keySearch]=\"keySearch()\"\n          [class]=\"'libs-ui-list-template-text-item flex '+(item().classItem || '')\"\n          [class.items-center]=\"!item().itemAlignStart\"\n          [class.items-start]=\"item().itemAlignStart\"\n          [class.libs-ui-bg-list-hover-danger]=\"!clickExactly() && item().hoverDanger\"\n          [class.libs-ui-bg-list-hover]=\"!clickExactly()  && !item().hoverDanger\"\n          [class.libs-ui-bg-list-active]=\"!clickExactly() && keySelected() === item()[fieldKey()]\"\n          [class.!pl-[16px]]=\"paddingLeftItem()\"\n          [class.bg-[#ffffff]]=\"clickExactly()\"\n          [class.libs-ui-bg-list-hover-ffffff]=\"item().disable\"\n          [class.cursor-default]=\"item().disable\"\n          [class.!py-[2px]]=\"clickExactly()\"\n          [class.!pr-[48px]]=\"keySelected() === item()[fieldKey()] && (!configTemplateText?.ignoreIconSelected || configTemplateText?.actionSort)&& !configTemplateText?.stylePaddingRightItemOther\"\n          [ngClass]=\"{'pointer-events-none libs-ui-disable':loading() || disable() || ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:keysDisableItem():keysDisableItem()?.length) && !ignoreClassDisableDefaultWhenUseKeysDisableItem())}\"\n          (click)=\"handlerClickRelative($event,item())\">\n          @if (item().bullet) {\n            <span class=\"libs-ui-list-template-text-item-bullet flex flex-shrink-0\"\n              [style.background-color]=\"item().bullet.backgroundColor\"\n              (click)=\"handlerSelectItem($event,item())\">\n            </span>\n          }\n\n          @if (item().avatarConfig; as avatarConfig) {\n            <libs_ui-components-avatar [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n              [classInclude]=\"avatarConfig.classInclude\"\n              [classImageInclude]=\"avatarConfig.classImageInclude\"\n              [size]='avatarConfig.size || 32'\n              [linkAvatar]=\"avatarConfig.linkAvatar\"\n              [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n              [idGenColor]=\"avatarConfig.idGenColor\"\n              [textAvatar]=\"avatarConfig.textAvatar\"\n              [classImageInclude]=\"avatarConfig.classImageInclude\" />\n          }\n          @if (configTemplateText.getImage || configTemplateText.fieldGetImage) {\n            <img\n              [src]=\"configTemplateText.getImage ? (('avatar' | LibsUiPipesCallFunctionInTemplatePipe:(item().specific_loadImgError && configTemplateText.getImageError ? configTemplateText.getImageError : configTemplateText.getImage):item()) | async) : item()[configTemplateText.fieldGetImage || '']\"\n              [class]=\"'libs-ui-list-template-text-item-avatar ' + (configTemplateText.classIncludeImage ?? '')\"\n              [class.w-[18px]]=\"configTemplateText.imgTypeIcon\"\n              [class.h-[18px]]=\"configTemplateText.imgTypeIcon\"\n              (error)=\"handlerImageError($event, item())\"\n              (click)=\"handlerSelectItem($event,item())\" />\n          }\n          @if (item().buttonLeftConfig; as buttonLeft) {\n            @if (item().hrefButton) {\n              <a [class.w-full]=\"!buttonLeft.ignoreWidth100\"\n                [href]=\"item().hrefButton\">\n                <ng-container *ngTemplateOutlet=\"buttonLeftTemplate\" />\n              </a>\n            }\n            @if (!item().hrefButton) {\n              <div [class.w-full]=\"!buttonLeft.ignoreWidth100\">\n                <ng-container *ngTemplateOutlet=\"buttonLeftTemplate\" />\n              </div>\n            }\n            <ng-template #buttonLeftTemplate>\n              <libs_ui-components-buttons-button class=\"w-full\"\n                [type]=\"buttonLeft.type || 'button-link-primary'\"\n                [label]=\"buttonLeft.label || ' '\"\n                [zIndex]=\"buttonLeft.zIndex\"\n                [disable]=\"buttonLeft.disable\"\n                [classIconLeft]=\"buttonLeft.classIconLeft ? ((buttonLeft.classIconLeft || '')+' flex mr-[8px] text-[12px]') : ''\"\n                [classInclude]=\"(buttonLeft.classInclude|| '')+' w-full'\"\n                [classLabel]=\"(buttonLeft.classLabel ?? 'libs-ui-font-h4r')\"\n                [ignoreStopPropagationEvent]=\"buttonLeft.ignoreStopPropagationEvent\"\n                [styleIconLeft]=\"buttonLeft.styleIconLeft\"\n                [styleButton]=\"buttonLeft.styleButton\"\n                (moClick)=\"handlerSelectItem($event,item())\" />\n            </ng-template>\n          }\n          @if (item().switchConfig) {\n            <libs_ui-components-switch [active]=\"item().switchConfig.active\"\n              (moSwitch)=\"handlerSelectItem('click',item())\" />\n          }\n          @if (item().classIconLeft) {\n            <i [class]=\"item().classIconLeft + ' mr-[8px] text-[14px]'\"></i>\n          }\n          @if (!item().ignoreShowFieldLabel && !configTemplateText.rows) {\n            <libs_ui-components-popover [type]=\"item().popoverLabel?.type || 'text'\"\n              [elementRefCustom]=\"item().popoverLabel?.type === 'text'? undefined:itemRef\"\n              [ignoreShowPopover]=\"item().popoverLabel?.ignoreShowPopover\"\n              [config]=\"item().popoverLabel?.config || (configTemplateText.configLabelPopover || {})\"\n              [innerHtml]=\"item().fieldLabel\"\n              [classInclude]=\"item().classInclude\"\n              (moEvent)=\"handlerSelectItem($event,item())\" />\n          }\n          @if (item().fieldPopover; as popover) {\n            <libs_ui-components-popover class=\"{{ popover.classInclude || '' }}\"\n              [config]=\"popover?.config\">\n              @if (!popover.dataView) {\n                <i class=\"libs-ui-icon-tooltip-outline\"></i>\n              }\n              @if (popover.dataView) {\n                <div [innerHtml]=\"popover.dataView | translate\"></div>\n              }\n            </libs_ui-components-popover>\n          }\n          @if (configTemplateText?.rows) {\n            <libs_ui-components-list-templates_rows class=\"w-full {{ configTemplateText.classRowsWrapper || configTemplateText.classRows || '' }}\"\n              [item]=\"item()\"\n              [fieldKey]=\"fieldKey()\"\n              [keySelected]=\"keySelected()\"\n              [configTemplate]=\"configTemplateText\"\n              [zIndex]=\"zIndex()\"\n              (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n              (outEvent)=\"handlerSelectItem($event.event,$event.item,$event.action)\" />\n          }\n          @if ((keySelected() === item()[fieldKey()] || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe:multiKeySelected():multiKeySelected()?.length) ? item()[fieldKey()] : undefined) && !configTemplateText.ignoreIconSelected && !configTemplateText.actionSort) {\n            <i [class]=\"'libs-ui-icon-check '+(configTemplateText.classIncludeIconSelected || 'right-[12px]')\">\n            </i>\n          }\n          @if (keySelected() === item()[fieldKey()] && configTemplateText.actionSort) {\n            <div class=\"libs-ui-list-template-text-sort\">\n              <libs_ui-components-buttons-sort-arrow [disable]=\"loading() || disable() || false\"\n                [mode]=\"configTemplateText.itemSort?.mode || ''\"\n                [fieldSort]=\"item()[fieldKey()]\"\n                (outChange)=\"handlerSort($event)\" />\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </ng-template>\n}\n", styles: [".libs-ui-list-template-text-item{padding:6px 16px 6px 1px;font-size:12px;line-height:18px;position:relative;cursor:pointer}.libs-ui-list-template-text-item>.libs-ui-icon-check,.libs-ui-list-template-text-item .libs-ui-list-template-text-sort{position:absolute;right:16px}.libs-ui-list-template-text-item>.libs-ui-icon-check:before,.libs-ui-list-template-text-item .libs-ui-list-template-text-sort:before{font-size:16px;color:var(--libs-ui-color-default, #226FF5)}.libs-ui-list-template-text-item-bullet{width:10px;height:10px;border-radius:50%;margin-right:8px;cursor:pointer}.libs-ui-list-template-text-item-avatar{width:24px;height:24px;border-radius:50%;margin-right:8px;cursor:pointer}\n"] }]
         }] });
 
 const getComponentByType = (typeTemplate) => {
@@ -2320,6 +2325,7 @@ class LibsUiComponentsListComponent {
     onUpdateMultiKeySelectedGroup = new Subject();
     onRemoveItems = new Subject();
     onUpdateData = new Subject();
+    cleanUpEffect;
     componentRef;
     configData = signal({
         type: 'text',
@@ -2383,10 +2389,47 @@ class LibsUiComponentsListComponent {
     /* INJECT */
     dynamicComponentService = inject(LibsUiDynamicComponentService);
     constructor() {
-        effect(() => untracked(this.changeSignal.bind(this)));
+        this.cleanUpEffect = effect(() => {
+            if (this.keySearchStore() === this.keySearch()) {
+                return;
+            }
+            const value = this.keySearch();
+            untracked(() => {
+                this.keySearchStore.set(value);
+                this.onSearch.next(value);
+            });
+        });
         effect(() => {
-            untracked(() => this.refresh());
+            const itemChangeUnSelect = this.itemChangeUnSelect();
+            const keysDisableItem = this.keysDisableItem();
+            const keysHiddenItem = this.keysHiddenItem();
+            const disable = this.disable();
+            untracked(() => {
+                const keySelected = this.keySelected();
+                const multiKeySelected = this.multiKeySelected();
+                this.onItemChangeUnSelect.next(itemChangeUnSelect);
+                if (!this.componentRef) {
+                    return;
+                }
+                if (!isEmpty(keysDisableItem)) {
+                    this.componentRef.setInput('keysDisableItem', keysDisableItem);
+                }
+                if (!isEmpty(keysHiddenItem)) {
+                    this.onSetHiddenItemByKey.next(keysHiddenItem || []);
+                }
+                if (!isEmpty(disable)) {
+                    this.componentRef.setInput('disable', disable);
+                }
+                if (!isEmpty(keySelected)) {
+                    this.componentRef.setInput('keySelected', keySelected);
+                }
+                if (this.configData()?.type === 'group' && !isEmpty(multiKeySelected)) {
+                    this.componentRef.setInput('multiKeySelected', multiKeySelected);
+                    this.onUpdateMultiKeySelectedGroup.next();
+                }
+            });
         });
+        effect(this.refresh.bind(this));
     }
     ngOnInit() {
         this.outFunctionsControl.emit({
@@ -2447,7 +2490,7 @@ class LibsUiComponentsListComponent {
         const instance = this.componentRef.instance;
         instance.outChangeView.subscribe(data => {
             this.outChangeView.emit(data);
-            if (this.skipFocusInputWhenKeySearchStoreUndefined() && isNil(this.keySearchStore)) {
+            if (this.skipFocusInputWhenKeySearchStoreUndefined() && isNil(this.keySearchStore())) {
                 return;
             }
             if (this.focusInputSearch() && this.keySearchStore() !== keySearch) {
@@ -2494,39 +2537,11 @@ class LibsUiComponentsListComponent {
             if (type === 'group') {
                 this.groupMultiKeySelected.set(data.keys);
             }
-            console.log('4');
             this.outSelectMultiKey.emit(data);
             this.checkIsValid();
         });
     }
     /* FUNCTIONS */
-    changeSignal() {
-        this.keySearchStore.set(this.keySearch());
-        this.onSearch.next(this.keySearch());
-        this.onItemChangeUnSelect.next(this.itemChangeUnSelect());
-        if (!this.componentRef) {
-            return;
-        }
-        if (!isEmpty(this.keysDisableItem())) {
-            this.componentRef.setInput('keysDisableItem', this.keysDisableItem());
-        }
-        if (!isEmpty(this.keysHiddenItem())) {
-            this.onSetHiddenItemByKey.next(this.keysHiddenItem() || []);
-        }
-        if (!isEmpty(this.disable())) {
-            this.componentRef.setInput('disable', this.disable());
-        }
-        if (!isEmpty(this.keySelected())) {
-            this.componentRef.setInput('keySelected', this.keySelected());
-        }
-        if (this.configData()?.type !== 'group' && !isEmpty(this.multiKeySelected())) {
-            this.componentRef.setInput('multiKeySelected', this.multiKeySelected());
-        }
-        if (this.configData()?.type === 'group' && !isEmpty(this.multiKeySelected())) {
-            this.componentRef.setInput('multiKeySelected', this.multiKeySelected());
-            this.onUpdateMultiKeySelectedGroup.next();
-        }
-    }
     handlerSearch(keySearch) {
         this.keySearchStore.set(keySearch);
         this.onSearch.next(keySearch);
@@ -2536,7 +2551,6 @@ class LibsUiComponentsListComponent {
             return;
         }
         this.outSelectKey.emit(undefined);
-        console.log('5');
         this.outSelectMultiKey.emit(undefined);
         this.componentRef.setInput('keySelected', '');
         this.componentRef.setInput('multiKeySelected', undefined);
@@ -2571,8 +2585,10 @@ class LibsUiComponentsListComponent {
             return;
         }
         this.dropdownTabKeyActive();
-        this.configData.set(this.cloneConfig(config));
-        this.onRefresh.next();
+        untracked(() => {
+            this.configData.set(this.cloneConfig(config));
+            this.onRefresh.next();
+        });
     }
     cloneConfig(configInput) {
         if (!configInput) {
@@ -2608,6 +2624,7 @@ class LibsUiComponentsListComponent {
         return config;
     }
     ngOnDestroy() {
+        this.cleanUpEffect.destroy();
         this.outLoading.emit(false);
         this.dynamicComponentService.remove(this.componentRef);
         this.onRefresh.complete();