@libs-ui/components-list 0.2.319-0 → 0.2.321-0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/defines/list.define.d.ts +1 -1
- package/esm2022/list.component.mjs +3 -3
- package/esm2022/templates/checkbox/checkbox.component.mjs +3 -3
- package/esm2022/templates/group/group.component.mjs +3 -3
- package/esm2022/templates/group/item/item.component.mjs +3 -3
- package/esm2022/templates/radio/radio.component.mjs +3 -3
- package/esm2022/templates/rows/rows.component.mjs +3 -3
- package/esm2022/templates/tag/tag.component.mjs +3 -3
- package/esm2022/templates/text/text.component.mjs +3 -3
- package/fesm2022/libs-ui-components-list.mjs +16 -16
- package/fesm2022/libs-ui-components-list.mjs.map +1 -1
- package/list.component.d.ts +1 -1
- package/package.json +23 -23
- package/templates/templates.component.abstract.d.ts +1 -1
|
@@ -168,7 +168,7 @@ class LibsUiComponentsListRowsComponent {
|
|
|
168
168
|
this.outChangStageFlagMousePopover.emit(flag);
|
|
169
169
|
}
|
|
170
170
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListRowsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
171
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListRowsComponent, isStandalone: true, selector: "libs_ui-components-list-templates_rows", inputs: { configTemplate: { classPropertyName: "configTemplate", publicName: "configTemplate", isSignal: true, isRequired: true, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, keySelected: { classPropertyName: "keySelected", publicName: "keySelected", isSignal: true, isRequired: false, transformFunction: null }, fieldKey: { classPropertyName: "fieldKey", publicName: "fieldKey", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outChangStageFlagMousePopover: "outChangStageFlagMousePopover", outEvent: "outEvent" }, ngImport: i0, template: "@if (configTemplate() && configItemTextRows(); as configItemTextRows) {\n <div class=\"flex flex-col w-full {{ configTemplate().classRows ?? '' }}\">\n @for (row of configItemTextRows; track $index; let indexRow = $index) {\n <div [class]=\"row().classRow\">\n @if (row().getImage && (item() | LibsUiPipesCallFunctionInTemplatePipe: row().getImage : item() | async); as imgUrl) {\n <img\n [class]=\"item() | LibsUiPipesCallFunctionInTemplatePipe: row().getClassImage : item() | async\"\n src=\"{{ imgUrl }}\"\n (error)=\"handlerErrorImage($event, row().getImageError)\" />\n }\n @if (item()['fieldRowAvatarConfig' + indexRow]; as avatarConfig) {\n <libs_ui-components-avatar\n [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n [classInclude]=\"avatarConfig.classInclude\"\n [size]=\"avatarConfig.size || 32\"\n [linkAvatar]=\"avatarConfig.linkAvatar\"\n [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n [idGenColor]=\"avatarConfig.idGenColor\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (fieldKey() && item()['fieldLabelRow' + indexRow] | async; as labelRow) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"row().getPopoverConfig ? ('popover' | LibsUiPipesCallFunctionInTemplatePipe: row().getPopoverConfig : item() | async) : { zIndex: zIndex() }\"\n [classInclude]=\"keySelected() === item()[fieldKey()] ? row().classItemSelected || row().classGetValue || '' : row().classGetValue || ''\"\n [innerHtml]=\"labelRow\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), row().action)\" />\n }\n\n @if (fieldKey() && row().getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n 'row:' + indexRow | LibsUiPipesCallFunctionInTemplatePipe: row().getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: row().getDataComponentOutlet : item() : 'row:' + indexRow : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n @if (row().cols?.()?.length) {\n <div\n [class]=\"row().classCols || 'flex'\"\n [style]=\"item()[item()['fieldRowStylesDynamicCols' + indexRow]]\">\n @for (col of row().cols?.(); track $index; let colIndex = $index) {\n @if (col().getImage && (item() | LibsUiPipesCallFunctionInTemplatePipe: col().getImage : item() | async); as imgUrl) {\n <img\n [class]=\"item() | LibsUiPipesCallFunctionInTemplatePipe: col().getClassImage : item() | async\"\n src=\"{{ imgUrl }}\"\n (error)=\"handlerErrorImage($event, col().getImageError)\" />\n }\n @if (item()['fieldColAvatarConfig' + indexRow + colIndex]; as avatarConfig) {\n <libs_ui-components-avatar\n [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n [classInclude]=\"avatarConfig.classInclude\"\n [size]=\"avatarConfig.size || 32\"\n [linkAvatar]=\"avatarConfig.linkAvatar\"\n [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n [idGenColor]=\"avatarConfig.idGenColor\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (item()['fieldLabelCol' + indexRow + colIndex]; as labelColFunc) {\n <libs_ui-components-popover\n type=\"text\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [classInclude]=\"keySelected() === item()[fieldKey()] ? row().classItemSelected || item()['fieldColClass' + indexRow + colIndex] || '' : item()['fieldColClass' + indexRow + colIndex] || ''\"\n [innerHtml]=\"'fieldLabelCol' | LibsUiPipesCallFunctionInTemplatePipe: labelColFunc : item() | async\"\n [config]=\"{ zIndex: zIndex() }\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), col().action)\" />\n }\n @if (item()['fieldColPopover' + indexRow + colIndex]; as popover) {\n <libs_ui-components-popover\n [type]=\"popover.type ?? 'other'\"\n [config]=\"popover?.config\"\n [classInclude]=\"item()['fieldColClass' + indexRow + colIndex]\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), col().action)\">\n <span\n [class]=\"popover.classInclude || ''\"\n [innerHtml]=\"popover.dataView ?? popoverIcon | translate\"></span>\n </libs_ui-components-popover>\n }\n @if (fieldKey() && col().getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n 'row:' + indexRow + '-col:' + colIndex | LibsUiPipesCallFunctionInTemplatePipe: col().getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: col().getDataComponentOutlet : item() : 'row:' + indexRow + '-col:' + colIndex : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n @if (item()['fieldColToggle' + indexRow + colIndex]; as toggle) {\n <libs_ui-components-label\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [hasToggle]=\"toggle.hasToggle\"\n [toggleActive]=\"toggle.toggleActive\"\n [toggleDisable]=\"toggle.toggleDisable\"\n [popover]=\"toggle.popover\"\n [classInclude]=\"toggle.classInclude\"\n [labelLeft]=\"toggle.labelLeft\"\n [labelRight]=\"toggle.labelRight\"\n (outSwitchEvent)=\"handlerSelectItem('click', item(), col().action)\" />\n }\n @if (item()['fieldColButton' + indexRow + colIndex]; as button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type\"\n [classIconLeft]=\"button.classIconLeft\"\n [classIconRight]=\"button.classIconRight\"\n [classLabel]=\"button.classLabel\"\n [iconOnlyType]=\"button.iconOnlyType\"\n [popover]=\"button.popover\"\n [disable]=\"button.disable\"\n [ignorePointerEvent]=\"button.ignorePointerEvent\"\n [classInclude]=\"item()['fieldColClass' + indexRow + colIndex] ?? ' '\"\n [ignoreStopPropagationEvent]=\"false\"\n (outClick)=\"handlerSelectItem('click', item(), col().action)\" />\n }\n @if (item()['fieldBadge' + indexRow + colIndex]; as badge) {\n <libs_ui-components-badge\n [mode]=\"badge.mode || 'x+'\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [count]=\"badge.count\"\n [maxCount]=\"badge.maxCount || 99\"\n [classCircle]=\"badge.classCircle || 'libs-ui-font-h4r'\" />\n }\n }\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "component", type: LibsUiComponentsAvatarComponent, selector: "libs_ui-components-avatar", inputs: ["typeShape", "classInclude", "size", "linkAvatar", "linkAvatarError", "classImageInclude", "zIndexPreviewImage", "clickPreviewImage", "idGenColor", "getLastTextAfterSpace", "textAvatar", "textAvatarClassInclude", "containertextAvatarClassInclude"], outputs: ["outAvatarError", "outEventPreviewImage"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: 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", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsLabelComponent, selector: "libs_ui-components-label", inputs: ["iconPopoverClass", "classInclude", "labelLeft", "labelLeftClass", "labelLeftBehindToggleButton", "popover", "required", "buttonsLeft", "disableButtonsLeft", "buttonsRight", "disableButtonsRight", "labelRight", "labelRightClass", "labelRightRequired", "hasToggle", "toggleSize", "toggleActive", "toggleDisable", "description", "descriptionClass", "buttonsDescription", "disableButtonsDescription", "buttonsDescriptionContainerClass", "onlyShowCount", "zIndexPopover", "timerDestroyPopover", "count", "limitLength"], outputs: ["outClickButton", "outSwitchEvent", "outLabelRightClick", "outLabelLeftClick"] }, { kind: "component", type: LibsUiComponentsBadgeComponent, selector: "libs_ui-components-badge", inputs: ["popoverConfig", "active", "count", "mode", "maxCount", "ignoreMarginDefault", "classCircle", "ignoreStopPropagationEvent"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
171
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListRowsComponent, isStandalone: true, selector: "libs_ui-components-list-templates_rows", inputs: { configTemplate: { classPropertyName: "configTemplate", publicName: "configTemplate", isSignal: true, isRequired: true, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, keySelected: { classPropertyName: "keySelected", publicName: "keySelected", isSignal: true, isRequired: false, transformFunction: null }, fieldKey: { classPropertyName: "fieldKey", publicName: "fieldKey", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outChangStageFlagMousePopover: "outChangStageFlagMousePopover", outEvent: "outEvent" }, ngImport: i0, template: "@if (configTemplate() && configItemTextRows(); as configItemTextRows) {\n <div class=\"flex flex-col w-full {{ configTemplate().classRows ?? '' }}\">\n @for (row of configItemTextRows; track $index; let indexRow = $index) {\n <div [class]=\"row().classRow\">\n @if (row().getImage && (item() | LibsUiPipesCallFunctionInTemplatePipe: row().getImage : item() | async); as imgUrl) {\n <img\n [class]=\"item() | LibsUiPipesCallFunctionInTemplatePipe: row().getClassImage : item() | async\"\n src=\"{{ imgUrl }}\"\n (error)=\"handlerErrorImage($event, row().getImageError)\" />\n }\n @if (item()['fieldRowAvatarConfig' + indexRow]; as avatarConfig) {\n <libs_ui-components-avatar\n [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n [classInclude]=\"avatarConfig.classInclude\"\n [size]=\"avatarConfig.size || 32\"\n [linkAvatar]=\"avatarConfig.linkAvatar\"\n [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n [idGenColor]=\"avatarConfig.idGenColor\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (fieldKey() && item()['fieldLabelRow' + indexRow] | async; as labelRow) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"row().getPopoverConfig ? ('popover' | LibsUiPipesCallFunctionInTemplatePipe: row().getPopoverConfig : item() | async) : { zIndex: zIndex() }\"\n [classInclude]=\"keySelected() === item()[fieldKey()] ? row().classItemSelected || row().classGetValue || '' : row().classGetValue || ''\"\n [innerHtml]=\"labelRow\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), row().action)\" />\n }\n\n @if (fieldKey() && row().getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n 'row:' + indexRow | LibsUiPipesCallFunctionInTemplatePipe: row().getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: row().getDataComponentOutlet : item() : 'row:' + indexRow : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n @if (row().cols?.()?.length) {\n <div\n [class]=\"row().classCols || 'flex'\"\n [style]=\"item()[item()['fieldRowStylesDynamicCols' + indexRow]]\">\n @for (col of row().cols?.(); track $index; let colIndex = $index) {\n @if (col().getImage && (item() | LibsUiPipesCallFunctionInTemplatePipe: col().getImage : item() | async); as imgUrl) {\n <img\n [class]=\"item() | LibsUiPipesCallFunctionInTemplatePipe: col().getClassImage : item() | async\"\n src=\"{{ imgUrl }}\"\n (error)=\"handlerErrorImage($event, col().getImageError)\" />\n }\n @if (item()['fieldColAvatarConfig' + indexRow + colIndex]; as avatarConfig) {\n <libs_ui-components-avatar\n [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n [classInclude]=\"avatarConfig.classInclude\"\n [size]=\"avatarConfig.size || 32\"\n [linkAvatar]=\"avatarConfig.linkAvatar\"\n [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n [idGenColor]=\"avatarConfig.idGenColor\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (item()['fieldLabelCol' + indexRow + colIndex]; as labelColFunc) {\n <libs_ui-components-popover\n type=\"text\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [classInclude]=\"keySelected() === item()[fieldKey()] ? row().classItemSelected || item()['fieldColClass' + indexRow + colIndex] || '' : item()['fieldColClass' + indexRow + colIndex] || ''\"\n [innerHtml]=\"'fieldLabelCol' | LibsUiPipesCallFunctionInTemplatePipe: labelColFunc : item() | async\"\n [config]=\"{ zIndex: zIndex() }\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), col().action)\" />\n }\n @if (item()['fieldColPopover' + indexRow + colIndex]; as popover) {\n <libs_ui-components-popover\n [type]=\"popover.type ?? 'other'\"\n [config]=\"popover?.config\"\n [classInclude]=\"item()['fieldColClass' + indexRow + colIndex]\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), col().action)\">\n @let constHtmlDataView = popover.dataView || popoverIcon;\n <span\n [class]=\"popover.classInclude || ''\"\n [innerHtml]=\"constHtmlDataView | translate\"></span>\n </libs_ui-components-popover>\n }\n @if (fieldKey() && col().getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n 'row:' + indexRow + '-col:' + colIndex | LibsUiPipesCallFunctionInTemplatePipe: col().getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: col().getDataComponentOutlet : item() : 'row:' + indexRow + '-col:' + colIndex : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n @if (item()['fieldColToggle' + indexRow + colIndex]; as toggle) {\n <libs_ui-components-label\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [hasToggle]=\"toggle.hasToggle\"\n [toggleActive]=\"toggle.toggleActive\"\n [toggleDisable]=\"toggle.toggleDisable\"\n [popover]=\"toggle.popover\"\n [classInclude]=\"toggle.classInclude\"\n [labelLeft]=\"toggle.labelLeft\"\n [labelRight]=\"toggle.labelRight\"\n (outSwitchEvent)=\"handlerSelectItem('click', item(), col().action)\" />\n }\n @if (item()['fieldColButton' + indexRow + colIndex]; as button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type\"\n [classIconLeft]=\"button.classIconLeft\"\n [classIconRight]=\"button.classIconRight\"\n [classLabel]=\"button.classLabel\"\n [iconOnlyType]=\"button.iconOnlyType\"\n [popover]=\"button.popover\"\n [disable]=\"button.disable\"\n [ignorePointerEvent]=\"button.ignorePointerEvent\"\n [classInclude]=\"item()['fieldColClass' + indexRow + colIndex] ?? ' '\"\n [ignoreStopPropagationEvent]=\"false\"\n (outClick)=\"handlerSelectItem('click', item(), col().action)\" />\n }\n @if (item()['fieldBadge' + indexRow + colIndex]; as badge) {\n <libs_ui-components-badge\n [mode]=\"badge.mode || 'x+'\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [count]=\"badge.count\"\n [maxCount]=\"badge.maxCount || 99\"\n [classCircle]=\"badge.classCircle || 'libs-ui-font-h4r'\" />\n }\n }\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "component", type: LibsUiComponentsAvatarComponent, selector: "libs_ui-components-avatar", inputs: ["typeShape", "classInclude", "size", "linkAvatar", "linkAvatarError", "classImageInclude", "zIndexPreviewImage", "clickPreviewImage", "idGenColor", "getLastTextAfterSpace", "textAvatar", "textAvatarClassInclude", "containertextAvatarClassInclude"], outputs: ["outAvatarError", "outEventPreviewImage"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: 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", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsLabelComponent, selector: "libs_ui-components-label", inputs: ["iconPopoverClass", "classInclude", "labelLeft", "labelLeftClass", "labelLeftBehindToggleButton", "popover", "required", "buttonsLeft", "disableButtonsLeft", "buttonsRight", "disableButtonsRight", "labelRight", "labelRightClass", "labelRightRequired", "hasToggle", "toggleSize", "toggleActive", "toggleDisable", "description", "descriptionClass", "buttonsDescription", "disableButtonsDescription", "buttonsDescriptionContainerClass", "onlyShowCount", "zIndexPopover", "timerDestroyPopover", "count", "limitLength"], outputs: ["outClickButton", "outSwitchEvent", "outLabelRightClick", "outLabelLeftClick"] }, { kind: "component", type: LibsUiComponentsBadgeComponent, selector: "libs_ui-components-badge", inputs: ["popoverConfig", "active", "count", "mode", "maxCount", "ignoreMarginDefault", "classCircle", "ignoreStopPropagationEvent"] }, { kind: "pipe", type: LibsUiPipesCallFunctionInTemplatePipe, name: "LibsUiPipesCallFunctionInTemplatePipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
172
172
|
}
|
|
173
173
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListRowsComponent, decorators: [{
|
|
174
174
|
type: Component,
|
|
@@ -182,7 +182,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
182
182
|
LibsUiComponentsLabelComponent,
|
|
183
183
|
LibsUiComponentsBadgeComponent,
|
|
184
184
|
LibsUiPipesCallFunctionInTemplatePipe,
|
|
185
|
-
], template: "@if (configTemplate() && configItemTextRows(); as configItemTextRows) {\n <div class=\"flex flex-col w-full {{ configTemplate().classRows ?? '' }}\">\n @for (row of configItemTextRows; track $index; let indexRow = $index) {\n <div [class]=\"row().classRow\">\n @if (row().getImage && (item() | LibsUiPipesCallFunctionInTemplatePipe: row().getImage : item() | async); as imgUrl) {\n <img\n [class]=\"item() | LibsUiPipesCallFunctionInTemplatePipe: row().getClassImage : item() | async\"\n src=\"{{ imgUrl }}\"\n (error)=\"handlerErrorImage($event, row().getImageError)\" />\n }\n @if (item()['fieldRowAvatarConfig' + indexRow]; as avatarConfig) {\n <libs_ui-components-avatar\n [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n [classInclude]=\"avatarConfig.classInclude\"\n [size]=\"avatarConfig.size || 32\"\n [linkAvatar]=\"avatarConfig.linkAvatar\"\n [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n [idGenColor]=\"avatarConfig.idGenColor\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (fieldKey() && item()['fieldLabelRow' + indexRow] | async; as labelRow) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"row().getPopoverConfig ? ('popover' | LibsUiPipesCallFunctionInTemplatePipe: row().getPopoverConfig : item() | async) : { zIndex: zIndex() }\"\n [classInclude]=\"keySelected() === item()[fieldKey()] ? row().classItemSelected || row().classGetValue || '' : row().classGetValue || ''\"\n [innerHtml]=\"labelRow\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), row().action)\" />\n }\n\n @if (fieldKey() && row().getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n 'row:' + indexRow | LibsUiPipesCallFunctionInTemplatePipe: row().getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: row().getDataComponentOutlet : item() : 'row:' + indexRow : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n @if (row().cols?.()?.length) {\n <div\n [class]=\"row().classCols || 'flex'\"\n [style]=\"item()[item()['fieldRowStylesDynamicCols' + indexRow]]\">\n @for (col of row().cols?.(); track $index; let colIndex = $index) {\n @if (col().getImage && (item() | LibsUiPipesCallFunctionInTemplatePipe: col().getImage : item() | async); as imgUrl) {\n <img\n [class]=\"item() | LibsUiPipesCallFunctionInTemplatePipe: col().getClassImage : item() | async\"\n src=\"{{ imgUrl }}\"\n (error)=\"handlerErrorImage($event, col().getImageError)\" />\n }\n @if (item()['fieldColAvatarConfig' + indexRow + colIndex]; as avatarConfig) {\n <libs_ui-components-avatar\n [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n [classInclude]=\"avatarConfig.classInclude\"\n [size]=\"avatarConfig.size || 32\"\n [linkAvatar]=\"avatarConfig.linkAvatar\"\n [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n [idGenColor]=\"avatarConfig.idGenColor\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (item()['fieldLabelCol' + indexRow + colIndex]; as labelColFunc) {\n <libs_ui-components-popover\n type=\"text\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [classInclude]=\"keySelected() === item()[fieldKey()] ? row().classItemSelected || item()['fieldColClass' + indexRow + colIndex] || '' : item()['fieldColClass' + indexRow + colIndex] || ''\"\n [innerHtml]=\"'fieldLabelCol' | LibsUiPipesCallFunctionInTemplatePipe: labelColFunc : item() | async\"\n [config]=\"{ zIndex: zIndex() }\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), col().action)\" />\n }\n @if (item()['fieldColPopover' + indexRow + colIndex]; as popover) {\n <libs_ui-components-popover\n [type]=\"popover.type ?? 'other'\"\n [config]=\"popover?.config\"\n [classInclude]=\"item()['fieldColClass' + indexRow + colIndex]\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), col().action)\">\n <span\n [class]=\"popover.classInclude || ''\"\n [innerHtml]=\"
|
|
185
|
+
], template: "@if (configTemplate() && configItemTextRows(); as configItemTextRows) {\n <div class=\"flex flex-col w-full {{ configTemplate().classRows ?? '' }}\">\n @for (row of configItemTextRows; track $index; let indexRow = $index) {\n <div [class]=\"row().classRow\">\n @if (row().getImage && (item() | LibsUiPipesCallFunctionInTemplatePipe: row().getImage : item() | async); as imgUrl) {\n <img\n [class]=\"item() | LibsUiPipesCallFunctionInTemplatePipe: row().getClassImage : item() | async\"\n src=\"{{ imgUrl }}\"\n (error)=\"handlerErrorImage($event, row().getImageError)\" />\n }\n @if (item()['fieldRowAvatarConfig' + indexRow]; as avatarConfig) {\n <libs_ui-components-avatar\n [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n [classInclude]=\"avatarConfig.classInclude\"\n [size]=\"avatarConfig.size || 32\"\n [linkAvatar]=\"avatarConfig.linkAvatar\"\n [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n [idGenColor]=\"avatarConfig.idGenColor\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (fieldKey() && item()['fieldLabelRow' + indexRow] | async; as labelRow) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"row().getPopoverConfig ? ('popover' | LibsUiPipesCallFunctionInTemplatePipe: row().getPopoverConfig : item() | async) : { zIndex: zIndex() }\"\n [classInclude]=\"keySelected() === item()[fieldKey()] ? row().classItemSelected || row().classGetValue || '' : row().classGetValue || ''\"\n [innerHtml]=\"labelRow\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), row().action)\" />\n }\n\n @if (fieldKey() && row().getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n 'row:' + indexRow | LibsUiPipesCallFunctionInTemplatePipe: row().getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: row().getDataComponentOutlet : item() : 'row:' + indexRow : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n @if (row().cols?.()?.length) {\n <div\n [class]=\"row().classCols || 'flex'\"\n [style]=\"item()[item()['fieldRowStylesDynamicCols' + indexRow]]\">\n @for (col of row().cols?.(); track $index; let colIndex = $index) {\n @if (col().getImage && (item() | LibsUiPipesCallFunctionInTemplatePipe: col().getImage : item() | async); as imgUrl) {\n <img\n [class]=\"item() | LibsUiPipesCallFunctionInTemplatePipe: col().getClassImage : item() | async\"\n src=\"{{ imgUrl }}\"\n (error)=\"handlerErrorImage($event, col().getImageError)\" />\n }\n @if (item()['fieldColAvatarConfig' + indexRow + colIndex]; as avatarConfig) {\n <libs_ui-components-avatar\n [typeShape]=\"avatarConfig.typeShape || 'circle'\"\n [classInclude]=\"avatarConfig.classInclude\"\n [size]=\"avatarConfig.size || 32\"\n [linkAvatar]=\"avatarConfig.linkAvatar\"\n [linkAvatarError]=\"avatarConfig.linkAvatarError\"\n [idGenColor]=\"avatarConfig.idGenColor\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (item()['fieldLabelCol' + indexRow + colIndex]; as labelColFunc) {\n <libs_ui-components-popover\n type=\"text\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [classInclude]=\"keySelected() === item()[fieldKey()] ? row().classItemSelected || item()['fieldColClass' + indexRow + colIndex] || '' : item()['fieldColClass' + indexRow + colIndex] || ''\"\n [innerHtml]=\"'fieldLabelCol' | LibsUiPipesCallFunctionInTemplatePipe: labelColFunc : item() | async\"\n [config]=\"{ zIndex: zIndex() }\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), col().action)\" />\n }\n @if (item()['fieldColPopover' + indexRow + colIndex]; as popover) {\n <libs_ui-components-popover\n [type]=\"popover.type ?? 'other'\"\n [config]=\"popover?.config\"\n [classInclude]=\"item()['fieldColClass' + indexRow + colIndex]\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outEvent)=\"handlerSelectItem($event, item(), col().action)\">\n @let constHtmlDataView = popover.dataView || popoverIcon;\n <span\n [class]=\"popover.classInclude || ''\"\n [innerHtml]=\"constHtmlDataView | translate\"></span>\n </libs_ui-components-popover>\n }\n @if (fieldKey() && col().getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n 'row:' + indexRow + '-col:' + colIndex | LibsUiPipesCallFunctionInTemplatePipe: col().getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: col().getDataComponentOutlet : item() : 'row:' + indexRow + '-col:' + colIndex : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n @if (item()['fieldColToggle' + indexRow + colIndex]; as toggle) {\n <libs_ui-components-label\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [hasToggle]=\"toggle.hasToggle\"\n [toggleActive]=\"toggle.toggleActive\"\n [toggleDisable]=\"toggle.toggleDisable\"\n [popover]=\"toggle.popover\"\n [classInclude]=\"toggle.classInclude\"\n [labelLeft]=\"toggle.labelLeft\"\n [labelRight]=\"toggle.labelRight\"\n (outSwitchEvent)=\"handlerSelectItem('click', item(), col().action)\" />\n }\n @if (item()['fieldColButton' + indexRow + colIndex]; as button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type\"\n [classIconLeft]=\"button.classIconLeft\"\n [classIconRight]=\"button.classIconRight\"\n [classLabel]=\"button.classLabel\"\n [iconOnlyType]=\"button.iconOnlyType\"\n [popover]=\"button.popover\"\n [disable]=\"button.disable\"\n [ignorePointerEvent]=\"button.ignorePointerEvent\"\n [classInclude]=\"item()['fieldColClass' + indexRow + colIndex] ?? ' '\"\n [ignoreStopPropagationEvent]=\"false\"\n (outClick)=\"handlerSelectItem('click', item(), col().action)\" />\n }\n @if (item()['fieldBadge' + indexRow + colIndex]; as badge) {\n <libs_ui-components-badge\n [mode]=\"badge.mode || 'x+'\"\n [style]=\"' ' | LibsUiPipesCallFunctionInTemplatePipe: item()['fieldColStylesDynamic' + indexRow + colIndex] : item() | async\"\n [count]=\"badge.count\"\n [maxCount]=\"badge.maxCount || 99\"\n [classCircle]=\"badge.classCircle || 'libs-ui-font-h4r'\" />\n }\n }\n </div>\n }\n </div>\n }\n </div>\n}\n" }]
|
|
186
186
|
}], ctorParameters: () => [] });
|
|
187
187
|
|
|
188
188
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
@@ -787,7 +787,7 @@ class LibsUiComponentsListCheckboxComponent extends LibsUiComponentsListTemplate
|
|
|
787
787
|
return this.items().length;
|
|
788
788
|
}
|
|
789
789
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
790
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListCheckboxComponent, isStandalone: true, selector: "libs_ui-components-list-templates_checkbox", viewQueries: [{ propertyName: "virtualScrollerComponent", first: true, predicate: VirtualScrollerComponent, descendants: true, isSignal: true }], 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\n [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-h6ri'\"\n [disable]=\"loading() || disable() || false\"\n (outClick)=\"handlerSelect(true)\" />\n <div class=\"text-[#e6e7ea]\">|</div>\n <libs_ui-components-buttons-button\n [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-h6ri'\"\n [disable]=\"loading() || disable() || false\"\n (outClick)=\"handlerSelect(false)\" />\n </div>\n }\n @if (items().length && configTemplateCheckbox.configCheckboxCheckAll?.(); as configCheckBox) {\n @let constHtmlLengthMultiKeySelected = multiKeySelected()?.length || 0;\n @let constHtmlLengthStore = store().length || -1;\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\n [label]=\"configCheckBox.label ?? 'i18n_all'\"\n [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n [checked]=\"(constHtmlLengthMultiKeySelected && constHtmlLengthMultiKeySelected >= constHtmlLengthStore) || false\"\n [stillOtherOptions]=\"!!constHtmlLengthMultiKeySelected && constHtmlLengthMultiKeySelected < constHtmlLengthStore\"\n [disable]=\"loading() || disable() || false\"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerSelect($event.checked, true)\" />\n </div>\n }\n <div [class]=\"'relative h-full w-full ' + (!items() || !items().length ? 'bg-[#ffffff]' : configTemplateCheckbox.classListInclude || '')\">\n @if (items() && items().length) {\n <div\n #elementScroll\n LibsUiComponentsScrollOverlayDirective\n class=\"w-full\"\n [class.h-full]=\"!(heightViewPort() && !config()?.ignoreShowDataWhenNotSearch)\"\n [style.height]=\"heightViewPort() && !config()?.ignoreShowDataWhenNotSearch ? heightViewPort() + 'px' : '100%'\"\n (outScrollBottom)=\"handlerScrollBottom()\">\n <virtual-scroller\n #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\n #itemRef\n LibsUiComponentsListHighlightKeySearchDirective\n [isHighlight]=\"config()?.highlightTextSearchInResult\"\n [keySearch]=\"keySearch()\"\n [attr.clickExactly]=\"clickExactly()\"\n [class]=\"'libs-ui-list-template-checkbox-item libs-ui-font-h5r 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\n class=\"flex flex-col w-full\"\n [class.!flex-row]=\"configTemplateCheckbox.rowSameLineCheckbox\">\n @if (item().fieldLabel) {\n <libs_ui-components-checkbox-single\n [label]=\"item().fieldLabel\"\n [avatarConfig]=\"(item().avatarConfig | LibsUiPipesConvertObjectToSignalPipe)?.()\"\n [linkImage]=\"configTemplateCheckbox.getImage ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getImage : item() | async) : item()[configTemplateCheckbox.fieldGetImage || '']\"\n [linkImageError]=\"\n configTemplateCheckbox.getImageError ? ('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getImageError : item() | async) : item()[configTemplateCheckbox.fieldGetLinkImageError || '']\n \"\n [classLabelInclude]=\"item().classLabelInclude || configTemplateCheckbox.classLabelInclude || 'libs-ui-font-h5r'\"\n [zIndexLabel]=\"configTemplateCheckbox.zIndexPopover ?? 1200\"\n [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected()?.length\"\n [key]=\"item()[fieldKey()]\"\n [imgTypeIcon]=\"configTemplateCheckbox.hasAvatarGroupSocial\"\n [classInclude]=\"configTemplateCheckbox.classInclude || ''\"\n [classImageInclude]=\"configTemplateCheckbox.classIncludeImage || ''\"\n [bullet]=\"(item().bullet | LibsUiPipesConvertObjectToSignalPipe)?.()\"\n [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length)\"\n [popover]=\"(item().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe\"\n [clickExactly]=\"clickExactly()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getComponentOutlet : item() : fieldKey() : { valueIs0: 0 } | async\"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChange('checkbox', item())\" />\n }\n @if (configTemplateCheckbox?.rows) {\n <libs_ui-components-list-templates_rows\n 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> </span>\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 16px;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", "isHandlerEnterDocumentClickButton"], 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", "dataComponentOutlet", "componentOutlet"], 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", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], 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" }, { kind: "pipe", type: LibsUiPipesConvertObjectToSignalPipe, name: "LibsUiPipesConvertObjectToSignalPipe" }, { kind: "pipe", type: LibsUiPipesConvertSignalToObjectPipe, name: "LibsUiPipesConvertSignalToObjectPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
790
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListCheckboxComponent, isStandalone: true, selector: "libs_ui-components-list-templates_checkbox", viewQueries: [{ propertyName: "virtualScrollerComponent", first: true, predicate: VirtualScrollerComponent, descendants: true, isSignal: true }], 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\n [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-h6ri'\"\n [disable]=\"loading() || disable() || false\"\n (outClick)=\"handlerSelect(true)\" />\n <div class=\"text-[#e6e7ea]\">|</div>\n <libs_ui-components-buttons-button\n [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-h6ri'\"\n [disable]=\"loading() || disable() || false\"\n (outClick)=\"handlerSelect(false)\" />\n </div>\n }\n @if (items().length && configTemplateCheckbox.configCheckboxCheckAll?.(); as configCheckBox) {\n @let constHtmlLengthMultiKeySelected = multiKeySelected().length || 0;\n @let constHtmlLengthStore = store().length || -1;\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\n [label]=\"configCheckBox.label ?? 'i18n_all'\"\n [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n [checked]=\"(constHtmlLengthMultiKeySelected && constHtmlLengthMultiKeySelected >= constHtmlLengthStore) || false\"\n [stillOtherOptions]=\"!!constHtmlLengthMultiKeySelected && constHtmlLengthMultiKeySelected < constHtmlLengthStore\"\n [disable]=\"loading() || disable() || false\"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerSelect($event.checked, true)\" />\n </div>\n }\n <div [class]=\"'relative h-full w-full ' + (!items() || !items().length ? 'bg-[#ffffff]' : configTemplateCheckbox.classListInclude || '')\">\n @if (items() && items().length) {\n <div\n #elementScroll\n LibsUiComponentsScrollOverlayDirective\n class=\"w-full\"\n [class.h-full]=\"!(heightViewPort() && !config()?.ignoreShowDataWhenNotSearch)\"\n [style.height]=\"heightViewPort() && !config()?.ignoreShowDataWhenNotSearch ? heightViewPort() + 'px' : '100%'\"\n (outScrollBottom)=\"handlerScrollBottom()\">\n <virtual-scroller\n #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\n #itemRef\n LibsUiComponentsListHighlightKeySearchDirective\n [isHighlight]=\"config()?.highlightTextSearchInResult\"\n [keySearch]=\"keySearch()\"\n [attr.clickExactly]=\"clickExactly()\"\n [class]=\"'libs-ui-list-template-checkbox-item libs-ui-font-h5r 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\n class=\"flex flex-col w-full\"\n [class.!flex-row]=\"configTemplateCheckbox.rowSameLineCheckbox\">\n @if (item().fieldLabel) {\n <libs_ui-components-checkbox-single\n [label]=\"item().fieldLabel\"\n [avatarConfig]=\"(item().avatarConfig | LibsUiPipesConvertObjectToSignalPipe)?.()\"\n [linkImage]=\"configTemplateCheckbox.getImage ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getImage : item() | async) : item()[configTemplateCheckbox.fieldGetImage || '']\"\n [linkImageError]=\"\n configTemplateCheckbox.getImageError ? ('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getImageError : item() | async) : item()[configTemplateCheckbox.fieldGetLinkImageError || '']\n \"\n [classLabelInclude]=\"item().classLabelInclude || configTemplateCheckbox.classLabelInclude || 'libs-ui-font-h5r'\"\n [zIndexLabel]=\"configTemplateCheckbox.zIndexPopover ?? 1200\"\n [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected().length\"\n [key]=\"item()[fieldKey()]\"\n [imgTypeIcon]=\"configTemplateCheckbox.hasAvatarGroupSocial\"\n [classInclude]=\"configTemplateCheckbox.classInclude || ''\"\n [classImageInclude]=\"configTemplateCheckbox.classIncludeImage || ''\"\n [bullet]=\"(item().bullet | LibsUiPipesConvertObjectToSignalPipe)?.()\"\n [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length)\"\n [popover]=\"(item().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe\"\n [clickExactly]=\"clickExactly()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getComponentOutlet : item() : fieldKey() : { valueIs0: 0 } | async\"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChange('checkbox', item())\" />\n }\n @if (configTemplateCheckbox?.rows) {\n <libs_ui-components-list-templates_rows\n 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 @let constHtmlTextNoData = config()?.textNoData || 'i18n_have_no_selection';\n <span>{{ constHtmlTextNoData | translate }}</span>\n }\n @if (templateRefSearchNoData() && keySearch() && !loading()) {\n <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null; context: { keySearch: keySearch() }\" />\n }\n @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n <span>{{ constHtmlTextSearchNoData | translate }}</span>\n }\n @if (loading()) {\n <span> </span>\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 16px;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", "isHandlerEnterDocumentClickButton"], 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", "dataComponentOutlet", "componentOutlet"], 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", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], 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" }, { kind: "pipe", type: LibsUiPipesConvertObjectToSignalPipe, name: "LibsUiPipesConvertObjectToSignalPipe" }, { kind: "pipe", type: LibsUiPipesConvertSignalToObjectPipe, name: "LibsUiPipesConvertSignalToObjectPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
791
791
|
}
|
|
792
792
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListCheckboxComponent, decorators: [{
|
|
793
793
|
type: Component,
|
|
@@ -808,7 +808,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
808
808
|
LibsUiPipesCallFunctionInTemplatePipe,
|
|
809
809
|
LibsUiPipesConvertObjectToSignalPipe,
|
|
810
810
|
LibsUiPipesConvertSignalToObjectPipe,
|
|
811
|
-
], 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\n [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-h6ri'\"\n [disable]=\"loading() || disable() || false\"\n (outClick)=\"handlerSelect(true)\" />\n <div class=\"text-[#e6e7ea]\">|</div>\n <libs_ui-components-buttons-button\n [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-h6ri'\"\n [disable]=\"loading() || disable() || false\"\n (outClick)=\"handlerSelect(false)\" />\n </div>\n }\n @if (items().length && configTemplateCheckbox.configCheckboxCheckAll?.(); as configCheckBox) {\n @let constHtmlLengthMultiKeySelected = multiKeySelected()
|
|
811
|
+
], 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\n [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-h6ri'\"\n [disable]=\"loading() || disable() || false\"\n (outClick)=\"handlerSelect(true)\" />\n <div class=\"text-[#e6e7ea]\">|</div>\n <libs_ui-components-buttons-button\n [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-h6ri'\"\n [disable]=\"loading() || disable() || false\"\n (outClick)=\"handlerSelect(false)\" />\n </div>\n }\n @if (items().length && configTemplateCheckbox.configCheckboxCheckAll?.(); as configCheckBox) {\n @let constHtmlLengthMultiKeySelected = multiKeySelected().length || 0;\n @let constHtmlLengthStore = store().length || -1;\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\n [label]=\"configCheckBox.label ?? 'i18n_all'\"\n [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n [checked]=\"(constHtmlLengthMultiKeySelected && constHtmlLengthMultiKeySelected >= constHtmlLengthStore) || false\"\n [stillOtherOptions]=\"!!constHtmlLengthMultiKeySelected && constHtmlLengthMultiKeySelected < constHtmlLengthStore\"\n [disable]=\"loading() || disable() || false\"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerSelect($event.checked, true)\" />\n </div>\n }\n <div [class]=\"'relative h-full w-full ' + (!items() || !items().length ? 'bg-[#ffffff]' : configTemplateCheckbox.classListInclude || '')\">\n @if (items() && items().length) {\n <div\n #elementScroll\n LibsUiComponentsScrollOverlayDirective\n class=\"w-full\"\n [class.h-full]=\"!(heightViewPort() && !config()?.ignoreShowDataWhenNotSearch)\"\n [style.height]=\"heightViewPort() && !config()?.ignoreShowDataWhenNotSearch ? heightViewPort() + 'px' : '100%'\"\n (outScrollBottom)=\"handlerScrollBottom()\">\n <virtual-scroller\n #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\n #itemRef\n LibsUiComponentsListHighlightKeySearchDirective\n [isHighlight]=\"config()?.highlightTextSearchInResult\"\n [keySearch]=\"keySearch()\"\n [attr.clickExactly]=\"clickExactly()\"\n [class]=\"'libs-ui-list-template-checkbox-item libs-ui-font-h5r 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\n class=\"flex flex-col w-full\"\n [class.!flex-row]=\"configTemplateCheckbox.rowSameLineCheckbox\">\n @if (item().fieldLabel) {\n <libs_ui-components-checkbox-single\n [label]=\"item().fieldLabel\"\n [avatarConfig]=\"(item().avatarConfig | LibsUiPipesConvertObjectToSignalPipe)?.()\"\n [linkImage]=\"configTemplateCheckbox.getImage ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getImage : item() | async) : item()[configTemplateCheckbox.fieldGetImage || '']\"\n [linkImageError]=\"\n configTemplateCheckbox.getImageError ? ('avatar_error' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getImageError : item() | async) : item()[configTemplateCheckbox.fieldGetLinkImageError || '']\n \"\n [classLabelInclude]=\"item().classLabelInclude || configTemplateCheckbox.classLabelInclude || 'libs-ui-font-h5r'\"\n [zIndexLabel]=\"configTemplateCheckbox.zIndexPopover ?? 1200\"\n [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected().length\"\n [key]=\"item()[fieldKey()]\"\n [imgTypeIcon]=\"configTemplateCheckbox.hasAvatarGroupSocial\"\n [classInclude]=\"configTemplateCheckbox.classInclude || ''\"\n [classImageInclude]=\"configTemplateCheckbox.classIncludeImage || ''\"\n [bullet]=\"(item().bullet | LibsUiPipesConvertObjectToSignalPipe)?.()\"\n [disable]=\"loading() || disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length)\"\n [popover]=\"(item().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe\"\n [clickExactly]=\"clickExactly()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateCheckbox.getComponentOutlet : item() : fieldKey() : { valueIs0: 0 } | async\"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChange('checkbox', item())\" />\n }\n @if (configTemplateCheckbox?.rows) {\n <libs_ui-components-list-templates_rows\n 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 @let constHtmlTextNoData = config()?.textNoData || 'i18n_have_no_selection';\n <span>{{ constHtmlTextNoData | translate }}</span>\n }\n @if (templateRefSearchNoData() && keySearch() && !loading()) {\n <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null; context: { keySearch: keySearch() }\" />\n }\n @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n <span>{{ constHtmlTextSearchNoData | translate }}</span>\n }\n @if (loading()) {\n <span> </span>\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 16px;position:relative}\n"] }]
|
|
812
812
|
}] });
|
|
813
813
|
|
|
814
814
|
class LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe {
|
|
@@ -959,7 +959,7 @@ class LibsUiComponentsListGroupItemComponent {
|
|
|
959
959
|
this.outChangStageFlagMousePopover.emit(flag);
|
|
960
960
|
}
|
|
961
961
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
962
|
-
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", outChangStageFlagMousePopover: "outChangStageFlagMousePopover" }, ngImport: i0, template: "@if (configTemplateGroup(); as configTemplateGroup) {\n @if ((configTemplateGroup.isViewTree && !!items().length) || (parentItem().maxLevelGroup > 2 && parentItem().level > 1)) {\n <div\n class=\"libs-ui-list-group-item-line-vertical\"\n [style.left.px]=\"\n parentItem().level\n | LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe\n : parentItem().maxLevelGroup\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(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]=\"\n item().level\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : item().maxLevelGroup\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n \"\n [style.paddingLeft.px]=\"\n item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe: item().maxLevelGroup : configTemplateGroup.isViewTree : configTemplateGroup.isViewTreeJson : !!item()[configTemplateGroup.fieldGetItems]?.()?.length\n \"\n [style.paddingRight.px]=\"\n item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe: item().maxLevelGroup : configTemplateGroup.isViewTree : configTemplateGroup.isViewTreeJson : !!item()[configTemplateGroup.fieldGetItems]?.()?.length\n \"\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\n class=\"libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]()?.length) {\n <div [class]=\"'p-[5px]'\">\n <div\n [class]=\"'libs-ui-list-group-json_icon-item-parent'\"\n [attr.disabled]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) || false\"></div>\n </div>\n }\n <div class=\"flex w-full relative\">\n <div\n #labelRef\n class=\"invisible\"\n [class.hidden]=\"configTemplateGroup.ignoreFixHeightItem\">\n .\n </div>\n <div\n class=\"flex items-center w-full\"\n [class.absolute]=\"!configTemplateGroup.ignoreFixHeightItem\"\n [style.height.px]=\"!configTemplateGroup.ignoreFixHeightItem ? labelRef.clientHeight : 'auto'\">\n @let constHtmlClassIncludeItem = (configTemplateGroup.classIncludeItem || '') + ' w-full';\n @if (!configTemplateGroup.isViewRadio) {\n <libs_ui-components-checkbox-single\n [avatarConfig]=\"item().avatarConfig\"\n [class.ml-[8px]]=\"configTemplateGroup.isViewTree || (configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.()?.length)\"\n [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.singleSelectItem\"\n [class]=\"constHtmlClassIncludeItem\"\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)]]=\"\n ((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) ||\n (configTemplateGroup.widthLabelSub24WhenNotTreeView &&\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) &&\n configTemplateGroup.singleSelectItem &&\n (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey))) &&\n !configTemplateGroup.ignoreIconExpandMarginRight\n \"\n [clickExactly]=\"false\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n [disable]=\"\n disable() ||\n (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup && !configTemplateGroup.isViewTreeJson) ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) ||\n false\n \"\n [label]=\"item().fieldLabel\"\n [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length\"\n [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysStillOtherOptions() : keysStillOtherOptions().length\"\n [classLabelInclude]=\"\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\n ? 'libs-ui-color-default libs-ui-font-h5r'\n : 'libs-ui-font-h5r'\n \"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletItem : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletItem : item() : fieldKey() : { valueIs0: 0 } | async\"\n [popover]=\"item().dataPopover\"\n [linkImage]=\"configTemplateGroup.getImage ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getImage : item() | async) : (item()[configTemplateGroup.fieldGetAvatarItem || ''] | async)\"\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\n [avatarConfig]=\"item().avatarConfig\"\n [class.!ml-[8px]]=\"configTemplateGroup.isViewTree\"\n [ignoreRadio]=\"configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem\"\n [class]=\"constHtmlClassIncludeItem\"\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]=\"\n disable() ||\n (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) ||\n (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) ||\n false\n \"\n [label]=\"item().fieldLabel\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length\"\n [classLabelInclude]=\"\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\n ? 'text-[#009cdb] libs-ui-font-h5r '\n : ' libs-ui-font-h5r '\n \"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletItem : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletItem : item() : fieldKey() : { valueIs0: 0 } | async\"\n [popover]=\"item().dataPopover\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChangeChecked(item())\" />\n }\n </div>\n </div>\n @if ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey)) {\n <i\n class=\"libs-ui-icon-check before:!text-[16px]\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n [class.libs-ui-icon-check]=\"configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\"></i>\n }\n @if (!!item()[configTemplateGroup.fieldGetItems]?.()?.length && !configTemplateGroup.isViewTree && !configTemplateGroup.isViewTreeJson) {\n <i\n class=\"libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n </div>\n @if (item().expand || configTemplateGroup.isViewTreeJson) {\n @if (item().level < item().maxLevelGroup && !item()[configTemplateGroup.fieldGetItems]?.()?.length && configTemplateGroup.isViewTree) {\n <div\n class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n [style.marginLeft.px]=\"\n item().level + 1\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : item().maxLevelGroup + 1\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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\n [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 (outChangStageFlagMousePopover)=\"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\n class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n [style.marginLeft.px]=\"\n parentItem().level + 1\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : parentItem().maxLevelGroup + 1\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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", "outChangStageFlagMousePopover"] }, { 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", "dataComponentOutlet", "componentOutlet"], 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", "ignorePopoverLabel", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon", "dataComponentOutlet", "componentOutlet"], outputs: ["activeChange", "outClickLabel", "outChange", "outChangStageFlagMousePopover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
962
|
+
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", outChangStageFlagMousePopover: "outChangStageFlagMousePopover" }, ngImport: i0, template: "@if (configTemplateGroup(); as configTemplateGroup) {\n @if ((configTemplateGroup.isViewTree && !!items().length) || (parentItem().maxLevelGroup > 2 && parentItem().level > 1)) {\n <div\n class=\"libs-ui-list-group-item-line-vertical\"\n [style.left.px]=\"\n parentItem().level\n | LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe\n : parentItem().maxLevelGroup\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(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]=\"\n item().level\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : item().maxLevelGroup\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n \"\n [style.paddingLeft.px]=\"\n item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe: item().maxLevelGroup : configTemplateGroup.isViewTree : configTemplateGroup.isViewTreeJson : !!item()[configTemplateGroup.fieldGetItems]?.()?.length\n \"\n [style.paddingRight.px]=\"\n item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe: item().maxLevelGroup : configTemplateGroup.isViewTree : configTemplateGroup.isViewTreeJson : !!item()[configTemplateGroup.fieldGetItems]?.()?.length\n \"\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\n class=\"libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]()?.length) {\n <div [class]=\"'p-[5px]'\">\n <div\n [class]=\"'libs-ui-list-group-json_icon-item-parent'\"\n [attr.disabled]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) || false\"></div>\n </div>\n }\n <div class=\"flex w-full relative\">\n <div\n #labelRef\n class=\"invisible\"\n [class.hidden]=\"configTemplateGroup.ignoreFixHeightItem\">\n .\n </div>\n <div\n class=\"flex items-center w-full\"\n [class.absolute]=\"!configTemplateGroup.ignoreFixHeightItem\"\n [style.height.px]=\"!configTemplateGroup.ignoreFixHeightItem ? labelRef.clientHeight : 'auto'\">\n @let constHtmlClassIncludeItem = (configTemplateGroup.classIncludeItem || '') + ' w-full';\n @if (!configTemplateGroup.isViewRadio) {\n <libs_ui-components-checkbox-single\n [avatarConfig]=\"item().avatarConfig\"\n [class.ml-[8px]]=\"configTemplateGroup.isViewTree || (configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.()?.length)\"\n [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.singleSelectItem\"\n [class]=\"constHtmlClassIncludeItem\"\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)]]=\"\n ((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) ||\n (configTemplateGroup.widthLabelSub24WhenNotTreeView &&\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) &&\n configTemplateGroup.singleSelectItem &&\n (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey))) &&\n !configTemplateGroup.ignoreIconExpandMarginRight\n \"\n [clickExactly]=\"false\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n [disable]=\"\n disable() ||\n (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup && !configTemplateGroup.isViewTreeJson) ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) ||\n false\n \"\n [label]=\"item().fieldLabel\"\n [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length\"\n [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysStillOtherOptions() : keysStillOtherOptions().length\"\n [classLabelInclude]=\"\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\n ? 'libs-ui-color-default libs-ui-font-h5r'\n : 'libs-ui-font-h5r'\n \"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletItem : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletItem : item() : fieldKey() : { valueIs0: 0 } | async\"\n [popover]=\"item().dataPopover\"\n [linkImage]=\"configTemplateGroup.getImage ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getImage : item() | async) : (item()[configTemplateGroup.fieldGetAvatarItem || ''] | async)\"\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\n [avatarConfig]=\"item().avatarConfig\"\n [class.!ml-[8px]]=\"configTemplateGroup.isViewTree\"\n [ignoreRadio]=\"configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem\"\n [class]=\"constHtmlClassIncludeItem\"\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]=\"\n disable() ||\n (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) ||\n (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) ||\n false\n \"\n [label]=\"item().fieldLabel\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length\"\n [classLabelInclude]=\"\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\n ? 'text-[#009cdb] libs-ui-font-h5r '\n : ' libs-ui-font-h5r '\n \"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletItem : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletItem : item() : fieldKey() : { valueIs0: 0 } | async\"\n [popover]=\"item().dataPopover\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChangeChecked(item())\" />\n }\n </div>\n </div>\n @if ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey)) {\n <i\n class=\"libs-ui-icon-check before:!text-[16px]\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n [class.libs-ui-icon-check]=\"configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\"></i>\n }\n @if (!!item()[configTemplateGroup.fieldGetItems]?.()?.length && !configTemplateGroup.isViewTree && !configTemplateGroup.isViewTreeJson) {\n <i\n class=\"libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n </div>\n @if (item().expand || configTemplateGroup.isViewTreeJson) {\n @if (item().level < item().maxLevelGroup && !item()[configTemplateGroup.fieldGetItems]?.()?.length && configTemplateGroup.isViewTree) {\n <div\n class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n [style.marginLeft.px]=\"\n item().level + 1\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : item().maxLevelGroup + 1\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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\n [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 (outChangStageFlagMousePopover)=\"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\n class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n [style.marginLeft.px]=\"\n parentItem().level + 1\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : parentItem().maxLevelGroup + 1\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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 @let constHtmlTextNoData = parentItem().textDescriptionGroupWhenNoData || config()?.textNoData || 'i18n_no_result';\n <span>{{ constHtmlTextNoData | 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", "outChangStageFlagMousePopover"] }, { 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", "dataComponentOutlet", "componentOutlet"], 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", "ignorePopoverLabel", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon", "dataComponentOutlet", "componentOutlet"], outputs: ["activeChange", "outClickLabel", "outChange", "outChangStageFlagMousePopover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
963
963
|
}
|
|
964
964
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupItemComponent, decorators: [{
|
|
965
965
|
type: Component,
|
|
@@ -975,7 +975,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
975
975
|
LibsUiComponentsCheckboxSingleComponent,
|
|
976
976
|
LibsUiPipesCallFunctionInTemplatePipe,
|
|
977
977
|
LibsUiComponentsRadioSingleComponent,
|
|
978
|
-
], template: "@if (configTemplateGroup(); as configTemplateGroup) {\n @if ((configTemplateGroup.isViewTree && !!items().length) || (parentItem().maxLevelGroup > 2 && parentItem().level > 1)) {\n <div\n class=\"libs-ui-list-group-item-line-vertical\"\n [style.left.px]=\"\n parentItem().level\n | LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe\n : parentItem().maxLevelGroup\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(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]=\"\n item().level\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : item().maxLevelGroup\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n \"\n [style.paddingLeft.px]=\"\n item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe: item().maxLevelGroup : configTemplateGroup.isViewTree : configTemplateGroup.isViewTreeJson : !!item()[configTemplateGroup.fieldGetItems]?.()?.length\n \"\n [style.paddingRight.px]=\"\n item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe: item().maxLevelGroup : configTemplateGroup.isViewTree : configTemplateGroup.isViewTreeJson : !!item()[configTemplateGroup.fieldGetItems]?.()?.length\n \"\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\n class=\"libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]()?.length) {\n <div [class]=\"'p-[5px]'\">\n <div\n [class]=\"'libs-ui-list-group-json_icon-item-parent'\"\n [attr.disabled]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) || false\"></div>\n </div>\n }\n <div class=\"flex w-full relative\">\n <div\n #labelRef\n class=\"invisible\"\n [class.hidden]=\"configTemplateGroup.ignoreFixHeightItem\">\n .\n </div>\n <div\n class=\"flex items-center w-full\"\n [class.absolute]=\"!configTemplateGroup.ignoreFixHeightItem\"\n [style.height.px]=\"!configTemplateGroup.ignoreFixHeightItem ? labelRef.clientHeight : 'auto'\">\n @let constHtmlClassIncludeItem = (configTemplateGroup.classIncludeItem || '') + ' w-full';\n @if (!configTemplateGroup.isViewRadio) {\n <libs_ui-components-checkbox-single\n [avatarConfig]=\"item().avatarConfig\"\n [class.ml-[8px]]=\"configTemplateGroup.isViewTree || (configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.()?.length)\"\n [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.singleSelectItem\"\n [class]=\"constHtmlClassIncludeItem\"\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)]]=\"\n ((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) ||\n (configTemplateGroup.widthLabelSub24WhenNotTreeView &&\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) &&\n configTemplateGroup.singleSelectItem &&\n (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey))) &&\n !configTemplateGroup.ignoreIconExpandMarginRight\n \"\n [clickExactly]=\"false\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n [disable]=\"\n disable() ||\n (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup && !configTemplateGroup.isViewTreeJson) ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) ||\n false\n \"\n [label]=\"item().fieldLabel\"\n [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length\"\n [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysStillOtherOptions() : keysStillOtherOptions().length\"\n [classLabelInclude]=\"\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\n ? 'libs-ui-color-default libs-ui-font-h5r'\n : 'libs-ui-font-h5r'\n \"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletItem : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletItem : item() : fieldKey() : { valueIs0: 0 } | async\"\n [popover]=\"item().dataPopover\"\n [linkImage]=\"configTemplateGroup.getImage ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getImage : item() | async) : (item()[configTemplateGroup.fieldGetAvatarItem || ''] | async)\"\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\n [avatarConfig]=\"item().avatarConfig\"\n [class.!ml-[8px]]=\"configTemplateGroup.isViewTree\"\n [ignoreRadio]=\"configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem\"\n [class]=\"constHtmlClassIncludeItem\"\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]=\"\n disable() ||\n (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) ||\n (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) ||\n false\n \"\n [label]=\"item().fieldLabel\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length\"\n [classLabelInclude]=\"\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\n ? 'text-[#009cdb] libs-ui-font-h5r '\n : ' libs-ui-font-h5r '\n \"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletItem : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletItem : item() : fieldKey() : { valueIs0: 0 } | async\"\n [popover]=\"item().dataPopover\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChangeChecked(item())\" />\n }\n </div>\n </div>\n @if ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey)) {\n <i\n class=\"libs-ui-icon-check before:!text-[16px]\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n [class.libs-ui-icon-check]=\"configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\"></i>\n }\n @if (!!item()[configTemplateGroup.fieldGetItems]?.()?.length && !configTemplateGroup.isViewTree && !configTemplateGroup.isViewTreeJson) {\n <i\n class=\"libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n </div>\n @if (item().expand || configTemplateGroup.isViewTreeJson) {\n @if (item().level < item().maxLevelGroup && !item()[configTemplateGroup.fieldGetItems]?.()?.length && configTemplateGroup.isViewTree) {\n <div\n class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n [style.marginLeft.px]=\"\n item().level + 1\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : item().maxLevelGroup + 1\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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\n [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 (outChangStageFlagMousePopover)=\"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\n class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n [style.marginLeft.px]=\"\n parentItem().level + 1\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : parentItem().maxLevelGroup + 1\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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"] }]
|
|
978
|
+
], template: "@if (configTemplateGroup(); as configTemplateGroup) {\n @if ((configTemplateGroup.isViewTree && !!items().length) || (parentItem().maxLevelGroup > 2 && parentItem().level > 1)) {\n <div\n class=\"libs-ui-list-group-item-line-vertical\"\n [style.left.px]=\"\n parentItem().level\n | LibsUiComponentsListGroupCalculatorLeftLineVerticalItemPipe\n : parentItem().maxLevelGroup\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(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]=\"\n item().level\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : item().maxLevelGroup\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n \"\n [style.paddingLeft.px]=\"\n item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe: item().maxLevelGroup : configTemplateGroup.isViewTree : configTemplateGroup.isViewTreeJson : !!item()[configTemplateGroup.fieldGetItems]?.()?.length\n \"\n [style.paddingRight.px]=\"\n item().level | LibsUiComponentsListGroupCalculatorPaddingLeftItemPipe: item().maxLevelGroup : configTemplateGroup.isViewTree : configTemplateGroup.isViewTreeJson : !!item()[configTemplateGroup.fieldGetItems]?.()?.length\n \"\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\n class=\"libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n @if (item().level < item().maxLevelGroup && configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]()?.length) {\n <div [class]=\"'p-[5px]'\">\n <div\n [class]=\"'libs-ui-list-group-json_icon-item-parent'\"\n [attr.disabled]=\"disable() || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) || false\"></div>\n </div>\n }\n <div class=\"flex w-full relative\">\n <div\n #labelRef\n class=\"invisible\"\n [class.hidden]=\"configTemplateGroup.ignoreFixHeightItem\">\n .\n </div>\n <div\n class=\"flex items-center w-full\"\n [class.absolute]=\"!configTemplateGroup.ignoreFixHeightItem\"\n [style.height.px]=\"!configTemplateGroup.ignoreFixHeightItem ? labelRef.clientHeight : 'auto'\">\n @let constHtmlClassIncludeItem = (configTemplateGroup.classIncludeItem || '') + ' w-full';\n @if (!configTemplateGroup.isViewRadio) {\n <libs_ui-components-checkbox-single\n [avatarConfig]=\"item().avatarConfig\"\n [class.ml-[8px]]=\"configTemplateGroup.isViewTree || (configTemplateGroup.isViewTreeJson && !!item()[configTemplateGroup.fieldGetItems]?.()?.length)\"\n [ignoreCheckbox]=\"configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.singleSelectItem\"\n [class]=\"constHtmlClassIncludeItem\"\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)]]=\"\n ((configTemplateGroup.isViewTree && !configTemplateGroup.hasIconCheckSingleSelectItem) ||\n (configTemplateGroup.widthLabelSub24WhenNotTreeView &&\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) &&\n configTemplateGroup.singleSelectItem &&\n (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey))) &&\n !configTemplateGroup.ignoreIconExpandMarginRight\n \"\n [clickExactly]=\"false\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n [disable]=\"\n disable() ||\n (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup && !configTemplateGroup.isViewTreeJson) ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) ||\n false\n \"\n [label]=\"item().fieldLabel\"\n [checked]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length\"\n [stillOtherOptions]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysStillOtherOptions() : keysStillOtherOptions().length\"\n [classLabelInclude]=\"\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\n ? 'libs-ui-color-default libs-ui-font-h5r'\n : 'libs-ui-font-h5r'\n \"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletItem : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletItem : item() : fieldKey() : { valueIs0: 0 } | async\"\n [popover]=\"item().dataPopover\"\n [linkImage]=\"configTemplateGroup.getImage ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getImage : item() | async) : (item()[configTemplateGroup.fieldGetAvatarItem || ''] | async)\"\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\n [avatarConfig]=\"item().avatarConfig\"\n [class.!ml-[8px]]=\"configTemplateGroup.isViewTree\"\n [ignoreRadio]=\"configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem\"\n [class]=\"constHtmlClassIncludeItem\"\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]=\"\n disable() ||\n (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) ||\n (configTemplateGroup.singleSelectItem && item().level < item().maxLevelGroup) ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length) ||\n false\n \"\n [label]=\"item().fieldLabel\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? 1\"\n [active]=\"item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length\"\n [classLabelInclude]=\"\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\n ? 'text-[#009cdb] libs-ui-font-h5r '\n : ' libs-ui-font-h5r '\n \"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletItem : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletItem : item() : fieldKey() : { valueIs0: 0 } | async\"\n [popover]=\"item().dataPopover\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChangeChecked(item())\" />\n }\n </div>\n </div>\n @if ((item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysChecked() : keysChecked().length) && configTemplateGroup.singleSelectItem && (configTemplateGroup.hasIconCheckSingleSelectItem || item().isCheckedByDefaultKey)) {\n <i\n class=\"libs-ui-icon-check before:!text-[16px]\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n [class.libs-ui-icon-check]=\"configTemplateGroup.colorBlueWhenItemSelected && item().isCheckManual\"></i>\n }\n @if (!!item()[configTemplateGroup.fieldGetItems]?.()?.length && !configTemplateGroup.isViewTree && !configTemplateGroup.isViewTreeJson) {\n <i\n class=\"libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n </div>\n @if (item().expand || configTemplateGroup.isViewTreeJson) {\n @if (item().level < item().maxLevelGroup && !item()[configTemplateGroup.fieldGetItems]?.()?.length && configTemplateGroup.isViewTree) {\n <div\n class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n [style.marginLeft.px]=\"\n item().level + 1\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : item().maxLevelGroup + 1\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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\n [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 (outChangStageFlagMousePopover)=\"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\n class=\"libs-ui-font-h5r text-[#9ca2ad] relative\"\n [style.marginLeft.px]=\"\n parentItem().level + 1\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : parentItem().maxLevelGroup + 1\n : configTemplateGroup.isViewTree\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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 @let constHtmlTextNoData = parentItem().textDescriptionGroupWhenNoData || config()?.textNoData || 'i18n_no_result';\n <span>{{ constHtmlTextNoData | 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"] }]
|
|
979
979
|
}] });
|
|
980
980
|
|
|
981
981
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
@@ -1727,7 +1727,7 @@ class LibsUiComponentsListGroupComponent extends LibsUiComponentsListTemplatesCo
|
|
|
1727
1727
|
return labelSearch ?? item().fieldLabel;
|
|
1728
1728
|
}
|
|
1729
1729
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1730
|
-
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 @let constHtmlHeightViewPort = heightViewPort() ? heightViewPort() + 'px' : '100%';\n @let constHtmlDisable = loading() || disable() || false;\n <div\n class=\"libs-ui-list-group overflow-[hidden]\"\n [style.height]=\"constHtmlHeightViewPort\">\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\n [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]=\"constHtmlDisable\"\n (outClick)=\"handlerCheckedOrUnCheckedAll(true)\" />\n <div class=\"text-[#999999]\">|</div>\n <libs_ui-components-buttons-button\n [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]=\"constHtmlDisable\"\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\n [label]=\"configCheckBox.label ?? 'i18n_all'\"\n [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n [checked]=\"totalItemChecked() >= totalItem() && totalItem() > 0\"\n [disable]=\"constHtmlDisable\"\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\n 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\n #itemRef\n [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"\n class=\"flex flex-col relative\">\n @let constHtmlPadding = level() * (configTemplateGroup.isViewTree ? 8 : 16);\n <div\n 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]=\"constHtmlPadding\"\n [style.paddingRight.px]=\"constHtmlPadding\"\n (click)=\"configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem ? handlerToggleExpand($event, item) : undefined\">\n @if (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree) {\n <i\n class=\"cursor-pointer libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n <div\n class=\"flex\"\n [class.w-full]=\"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\n [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]=\"\n !item()[configTemplateGroup.fieldGetItems]?.()?.length &&\n !(\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n )\n \"\n [class.max-w-[calc(100%-24px)]]=\"\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n \"\n [label]=\"item().fieldLabel\"\n [popover]=\"item().dataPopover\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletGroup : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletGroup : item() : fieldKey() : { valueIs0: 0 } | async\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n [classLabelInclude]=\"\n (configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : configTemplateGroup.isViewTree ? ' libs-ui-font-h6r ' : ' libs-ui-font-h6s ') +\n (configTemplateGroup.ignoreTextUppercaseLabelGroup || configTemplateGroup.isViewTree ? '' : ' text-uppercase ')\n \"\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\n [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]=\"\n !item()[configTemplateGroup.fieldGetItems]?.()?.length &&\n !(\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n )\n \"\n [class.max-w-[calc(100%-24px)]]=\"\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n \"\n [label]=\"item().fieldLabel\"\n [popover]=\"item().dataPopover\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletGroup : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletGroup : item() : fieldKey() : { valueIs0: 0 } | async\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : 'libs-ui-font-h6s ') + (configTemplateGroup.ignoreTextUppercaseLabelGroup ? '' : ' uppercase')\"\n [disable]=\"\n disable() ||\n (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) ||\n configTemplateGroup.ignoreCheckboxGroup ||\n configTemplateGroup.singleSelectItem ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length)\n \"\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\n [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\n class=\"flex items-center cursor-pointer libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n </div>\n @if (item().expand && calculatorHeighItemSuccess()) {\n <libs_ui-components-list-templates_group-item\n [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 (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChangeItemChecked($event.item)\" />\n }\n @if (!last && !configTemplateGroup.ignoreGroupLine && calculatorHeighItemSuccess()) {\n <div\n class=\"libs-ui-list-group-line\"\n [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"></div>\n }\n </div>\n }\n </div>\n </div>\n }\n @if (!items() || !items().length) {\n <div\n class=\"libs-ui-font-h5r text-[#c1c1c1] relative {{ configTemplateGroup.classIncludeNodata ? configTemplateGroup.classIncludeNodata : '' }}\"\n [style.marginLeft.px]=\"\n 0\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : 2\n : configTemplateGroup.isViewTree || configTemplateGroup.iconExpand === 'left'\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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", "isHandlerEnterDocumentClickButton"], 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", "dataComponentOutlet", "componentOutlet"], outputs: ["checkedChange", "linkImageChange", "outChange", "outEventPopover", "outClickLabel", "outChangStageFlagMousePopover"] }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabel", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon", "dataComponentOutlet", "componentOutlet"], 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", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], 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", "outChangStageFlagMousePopover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1730
|
+
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 @let constHtmlHeightViewPort = heightViewPort() ? heightViewPort() + 'px' : '100%';\n @let constHtmlDisable = loading() || disable() || false;\n <div\n class=\"libs-ui-list-group overflow-[hidden]\"\n [style.height]=\"constHtmlHeightViewPort\">\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\n [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]=\"constHtmlDisable\"\n (outClick)=\"handlerCheckedOrUnCheckedAll(true)\" />\n <div class=\"text-[#999999]\">|</div>\n <libs_ui-components-buttons-button\n [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]=\"constHtmlDisable\"\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\n [label]=\"configCheckBox.label ?? 'i18n_all'\"\n [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n [checked]=\"totalItemChecked() >= totalItem() && totalItem() > 0\"\n [disable]=\"constHtmlDisable\"\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\n 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\n #itemRef\n [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"\n class=\"flex flex-col relative\">\n @let constHtmlPadding = level() * (configTemplateGroup.isViewTree ? 8 : 16);\n <div\n 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]=\"constHtmlPadding\"\n [style.paddingRight.px]=\"constHtmlPadding\"\n (click)=\"configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem ? handlerToggleExpand($event, item) : undefined\">\n @if (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree) {\n <i\n class=\"cursor-pointer libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n <div\n class=\"flex\"\n [class.w-full]=\"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\n [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]=\"\n !item()[configTemplateGroup.fieldGetItems]?.()?.length &&\n !(\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n )\n \"\n [class.max-w-[calc(100%-24px)]]=\"\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n \"\n [label]=\"item().fieldLabel\"\n [popover]=\"item().dataPopover\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletGroup : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletGroup : item() : fieldKey() : { valueIs0: 0 } | async\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n [classLabelInclude]=\"\n (configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : configTemplateGroup.isViewTree ? ' libs-ui-font-h6r ' : ' libs-ui-font-h6s ') +\n (configTemplateGroup.ignoreTextUppercaseLabelGroup || configTemplateGroup.isViewTree ? '' : ' text-uppercase ')\n \"\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\n [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]=\"\n !item()[configTemplateGroup.fieldGetItems]?.()?.length &&\n !(\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n )\n \"\n [class.max-w-[calc(100%-24px)]]=\"\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n \"\n [label]=\"item().fieldLabel\"\n [popover]=\"item().dataPopover\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletGroup : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletGroup : item() : fieldKey() : { valueIs0: 0 } | async\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : 'libs-ui-font-h6s ') + (configTemplateGroup.ignoreTextUppercaseLabelGroup ? '' : ' uppercase')\"\n [disable]=\"\n disable() ||\n (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) ||\n configTemplateGroup.ignoreCheckboxGroup ||\n configTemplateGroup.singleSelectItem ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length)\n \"\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\n [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\n class=\"flex items-center cursor-pointer libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n </div>\n @if (item().expand && calculatorHeighItemSuccess()) {\n <libs_ui-components-list-templates_group-item\n [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 (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChangeItemChecked($event.item)\" />\n }\n @if (!last && !configTemplateGroup.ignoreGroupLine && calculatorHeighItemSuccess()) {\n <div\n class=\"libs-ui-list-group-line\"\n [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"></div>\n }\n </div>\n }\n </div>\n </div>\n }\n @if (!items() || !items().length) {\n <div\n class=\"libs-ui-font-h5r text-[#c1c1c1] relative {{ configTemplateGroup.classIncludeNodata ? configTemplateGroup.classIncludeNodata : '' }}\"\n [style.marginLeft.px]=\"\n 0\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : 2\n : configTemplateGroup.isViewTree || configTemplateGroup.iconExpand === 'left'\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\n [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n @if (!keySearch() && !loading()) {\n @let constHtmlTextNoData = config()?.textNoData || 'i18n_no_data_yet';\n <div>{{ constHtmlTextNoData | translate }}</div>\n }\n @if (keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n <div>{{ constHtmlTextSearchNoData | 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", "isHandlerEnterDocumentClickButton"], 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", "dataComponentOutlet", "componentOutlet"], outputs: ["checkedChange", "linkImageChange", "outChange", "outEventPopover", "outClickLabel", "outChangStageFlagMousePopover"] }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabel", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon", "dataComponentOutlet", "componentOutlet"], 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", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], 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", "outChangStageFlagMousePopover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1731
1731
|
}
|
|
1732
1732
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListGroupComponent, decorators: [{
|
|
1733
1733
|
type: Component,
|
|
@@ -1744,7 +1744,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1744
1744
|
LibsUiPipesCallFunctionInTemplatePipe,
|
|
1745
1745
|
LibsUiComponentsListGroupCalculatorMarginLeftItemPipe,
|
|
1746
1746
|
LibsUiComponentsListGroupItemComponent,
|
|
1747
|
-
], template: "@if (configTemplateGroup(); as configTemplateGroup) {\n @let constHtmlHeightViewPort = heightViewPort() ? heightViewPort() + 'px' : '100%';\n @let constHtmlDisable = loading() || disable() || false;\n <div\n class=\"libs-ui-list-group overflow-[hidden]\"\n [style.height]=\"constHtmlHeightViewPort\">\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\n [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]=\"constHtmlDisable\"\n (outClick)=\"handlerCheckedOrUnCheckedAll(true)\" />\n <div class=\"text-[#999999]\">|</div>\n <libs_ui-components-buttons-button\n [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]=\"constHtmlDisable\"\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\n [label]=\"configCheckBox.label ?? 'i18n_all'\"\n [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n [checked]=\"totalItemChecked() >= totalItem() && totalItem() > 0\"\n [disable]=\"constHtmlDisable\"\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\n 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\n #itemRef\n [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"\n class=\"flex flex-col relative\">\n @let constHtmlPadding = level() * (configTemplateGroup.isViewTree ? 8 : 16);\n <div\n 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]=\"constHtmlPadding\"\n [style.paddingRight.px]=\"constHtmlPadding\"\n (click)=\"configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem ? handlerToggleExpand($event, item) : undefined\">\n @if (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree) {\n <i\n class=\"cursor-pointer libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n <div\n class=\"flex\"\n [class.w-full]=\"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\n [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]=\"\n !item()[configTemplateGroup.fieldGetItems]?.()?.length &&\n !(\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n )\n \"\n [class.max-w-[calc(100%-24px)]]=\"\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n \"\n [label]=\"item().fieldLabel\"\n [popover]=\"item().dataPopover\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletGroup : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletGroup : item() : fieldKey() : { valueIs0: 0 } | async\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n [classLabelInclude]=\"\n (configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : configTemplateGroup.isViewTree ? ' libs-ui-font-h6r ' : ' libs-ui-font-h6s ') +\n (configTemplateGroup.ignoreTextUppercaseLabelGroup || configTemplateGroup.isViewTree ? '' : ' text-uppercase ')\n \"\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\n [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]=\"\n !item()[configTemplateGroup.fieldGetItems]?.()?.length &&\n !(\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n )\n \"\n [class.max-w-[calc(100%-24px)]]=\"\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n \"\n [label]=\"item().fieldLabel\"\n [popover]=\"item().dataPopover\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletGroup : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletGroup : item() : fieldKey() : { valueIs0: 0 } | async\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : 'libs-ui-font-h6s ') + (configTemplateGroup.ignoreTextUppercaseLabelGroup ? '' : ' uppercase')\"\n [disable]=\"\n disable() ||\n (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) ||\n configTemplateGroup.ignoreCheckboxGroup ||\n configTemplateGroup.singleSelectItem ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length)\n \"\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\n [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\n class=\"flex items-center cursor-pointer libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n </div>\n @if (item().expand && calculatorHeighItemSuccess()) {\n <libs_ui-components-list-templates_group-item\n [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 (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChangeItemChecked($event.item)\" />\n }\n @if (!last && !configTemplateGroup.ignoreGroupLine && calculatorHeighItemSuccess()) {\n <div\n class=\"libs-ui-list-group-line\"\n [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"></div>\n }\n </div>\n }\n </div>\n </div>\n }\n @if (!items() || !items().length) {\n <div\n class=\"libs-ui-font-h5r text-[#c1c1c1] relative {{ configTemplateGroup.classIncludeNodata ? configTemplateGroup.classIncludeNodata : '' }}\"\n [style.marginLeft.px]=\"\n 0\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : 2\n : configTemplateGroup.isViewTree || configTemplateGroup.iconExpand === 'left'\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\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"] }]
|
|
1747
|
+
], template: "@if (configTemplateGroup(); as configTemplateGroup) {\n @let constHtmlHeightViewPort = heightViewPort() ? heightViewPort() + 'px' : '100%';\n @let constHtmlDisable = loading() || disable() || false;\n <div\n class=\"libs-ui-list-group overflow-[hidden]\"\n [style.height]=\"constHtmlHeightViewPort\">\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\n [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]=\"constHtmlDisable\"\n (outClick)=\"handlerCheckedOrUnCheckedAll(true)\" />\n <div class=\"text-[#999999]\">|</div>\n <libs_ui-components-buttons-button\n [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]=\"constHtmlDisable\"\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\n [label]=\"configCheckBox.label ?? 'i18n_all'\"\n [classLabelInclude]=\"configCheckBox.classLabelInclude || ''\"\n [checked]=\"totalItemChecked() >= totalItem() && totalItem() > 0\"\n [disable]=\"constHtmlDisable\"\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\n 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\n #itemRef\n [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"\n class=\"flex flex-col relative\">\n @let constHtmlPadding = level() * (configTemplateGroup.isViewTree ? 8 : 16);\n <div\n 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]=\"constHtmlPadding\"\n [style.paddingRight.px]=\"constHtmlPadding\"\n (click)=\"configTemplateGroup.ignoreCheckboxGroup || configTemplateGroup.singleSelectItem ? handlerToggleExpand($event, item) : undefined\">\n @if (configTemplateGroup.iconExpand === 'left' || configTemplateGroup.isViewTree) {\n <i\n class=\"cursor-pointer libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n <div\n class=\"flex\"\n [class.w-full]=\"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\n [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]=\"\n !item()[configTemplateGroup.fieldGetItems]?.()?.length &&\n !(\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n )\n \"\n [class.max-w-[calc(100%-24px)]]=\"\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n \"\n [label]=\"item().fieldLabel\"\n [popover]=\"item().dataPopover\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletGroup : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletGroup : item() : fieldKey() : { valueIs0: 0 } | async\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n [classLabelInclude]=\"\n (configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : configTemplateGroup.isViewTree ? ' libs-ui-font-h6r ' : ' libs-ui-font-h6s ') +\n (configTemplateGroup.ignoreTextUppercaseLabelGroup || configTemplateGroup.isViewTree ? '' : ' text-uppercase ')\n \"\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\n [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]=\"\n !item()[configTemplateGroup.fieldGetItems]?.()?.length &&\n !(\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n )\n \"\n [class.max-w-[calc(100%-24px)]]=\"\n (configTemplateGroup.isViewTree || configTemplateGroup.widthLabelSub24WhenNotTreeView) &&\n (configTemplateGroup.iconExpand === 'left' || (configTemplateGroup.iconExpand === 'right' && (!configTemplateGroup.searchAllLevel || !!item()[configTemplateGroup.fieldGetItems]?.()?.length)))\n \"\n [label]=\"item().fieldLabel\"\n [popover]=\"item().dataPopover\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getDataComponentOutletGroup : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateGroup.getComponentOutletGroup : item() : fieldKey() : { valueIs0: 0 } | async\"\n [zIndexLabel]=\"configTemplateGroup.zIndexLabel ?? zIndex()\"\n [imgTypeIcon]=\"configTemplateGroup.imgTypeIcon\"\n [linkImage]=\"\n configTemplateGroup.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateGroup.getLinkImageError ? configTemplateGroup.getLinkImageError : configTemplateGroup.getImage) : item() | async)\n : item()[configTemplateGroup.fieldGetAvatarItem || '']\n \"\n [classLabelInclude]=\"(configTemplateGroup.classLabelItem ? configTemplateGroup.classLabelItem : 'libs-ui-font-h6s ') + (configTemplateGroup.ignoreTextUppercaseLabelGroup ? '' : ' uppercase')\"\n [disable]=\"\n disable() ||\n (configTemplateGroup.disableItemNotLastLevel && !!item()[configTemplateGroup.fieldGetItems]?.()?.length) ||\n configTemplateGroup.ignoreCheckboxGroup ||\n configTemplateGroup.singleSelectItem ||\n (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: keysDisableItem() : keysDisableItem()?.length)\n \"\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\n [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\n class=\"flex items-center cursor-pointer libs-ui-icon-chevron-right before:!text-[16px]\"\n [class.!ml-[8px]]=\"item().dataPopover\"\n [class.rotate-90]=\"item().expand\"\n (click)=\"handlerToggleExpand($event, item)\"></i>\n }\n </div>\n @if (item().expand && calculatorHeighItemSuccess()) {\n <libs_ui-components-list-templates_group-item\n [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 (outChangStageFlagMousePopover)=\"handlerChangStageFlagMouse($event)\"\n (outChange)=\"handlerChangeItemChecked($event.item)\" />\n }\n @if (!last && !configTemplateGroup.ignoreGroupLine && calculatorHeighItemSuccess()) {\n <div\n class=\"libs-ui-list-group-line\"\n [style.marginTop.px]=\"!configTemplateGroup.ignoreGroupLine ? configTemplateGroup.marginTopHasLine || 4 : 0\"></div>\n }\n </div>\n }\n </div>\n </div>\n }\n @if (!items() || !items().length) {\n <div\n class=\"libs-ui-font-h5r text-[#c1c1c1] relative {{ configTemplateGroup.classIncludeNodata ? configTemplateGroup.classIncludeNodata : '' }}\"\n [style.marginLeft.px]=\"\n 0\n | LibsUiComponentsListGroupCalculatorMarginLeftItemPipe\n : 2\n : configTemplateGroup.isViewTree || configTemplateGroup.iconExpand === 'left'\n : configTemplateGroup.isViewTreeJson\n : !(configTemplateGroup.ignoreCheckboxItem || configTemplateGroup.ignoreRadioItem || configTemplateGroup.singleSelectItem)\n : true\n \"\n [class.py-[8px]]=\"configTemplateGroup.fieldGetAvatarItem\"\n [class.py-[4px]]=\"!configTemplateGroup.fieldGetAvatarItem\">\n @if (!keySearch() && !loading()) {\n @let constHtmlTextNoData = config()?.textNoData || 'i18n_no_data_yet';\n <div>{{ constHtmlTextNoData | translate }}</div>\n }\n @if (keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n <div>{{ constHtmlTextSearchNoData | 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"] }]
|
|
1748
1748
|
}] });
|
|
1749
1749
|
|
|
1750
1750
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
@@ -1903,7 +1903,7 @@ class LibsUiComponentsListRadioComponent extends LibsUiComponentsListTemplatesCo
|
|
|
1903
1903
|
return this.items().length;
|
|
1904
1904
|
}
|
|
1905
1905
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListRadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1906
|
-
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\n #elementScroll\n LibsUiComponentsScrollOverlayDirective\n class=\"w-full\"\n [class.h-full]=\"!heightViewPort()\"\n [style.height]=\"heightViewPort() ? heightViewPort() + 'px' : '100%'\"\n (outScrollBottom)=\"handlerScrollBottom()\">\n <virtual-scroller\n #scroll\n [parentScroll]=\"elementScroll\"\n [items]=\"items()\"\n class=\"h-full\">\n @for (item of scroll.viewPortItems; track item()[fieldKey()]) {\n <div\n #itemRef\n [class]=\"'libs-ui-list-template-radio-item libs-ui-font-h5r 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\n class=\"flex flex-col w-full\"\n [class.!flex-row]=\"configTemplateRadio.rowSameLineRadio\">\n @if (item().fieldLabel) {\n <libs_ui-components-radio-single\n [label]=\"item().fieldLabel\"\n [avatarConfig]=\"item().avatarConfig\"\n [active]=\"keySelected() === item()[fieldKey()]\"\n [key]=\"item()[fieldKey()]\"\n [imgTypeIcon]=\"configTemplateRadio.hasAvatarGroupSocial\"\n [linkImage]=\"\n configTemplateRadio.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateRadio.getImageError ? configTemplateRadio.getImageError : configTemplateRadio.getImage) : item() | async)\n : item()[configTemplateRadio.fieldGetImage || '']\n \"\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().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe\"\n [clickExactly]=\"clickExactly()\"\n [disableLabel]=\"disableLabel()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateRadio.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateRadio.getComponentOutlet : item() : fieldKey() : { valueIs0: 0 } | async\"\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\n class=\"w-full {{ (configTemplateRadio.classRowsWrapper || 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
|
|
1906
|
+
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\n #elementScroll\n LibsUiComponentsScrollOverlayDirective\n class=\"w-full\"\n [class.h-full]=\"!heightViewPort()\"\n [style.height]=\"heightViewPort() ? heightViewPort() + 'px' : '100%'\"\n (outScrollBottom)=\"handlerScrollBottom()\">\n <virtual-scroller\n #scroll\n [parentScroll]=\"elementScroll\"\n [items]=\"items()\"\n class=\"h-full\">\n @for (item of scroll.viewPortItems; track item()[fieldKey()]) {\n <div\n #itemRef\n [class]=\"'libs-ui-list-template-radio-item libs-ui-font-h5r 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\n class=\"flex flex-col w-full\"\n [class.!flex-row]=\"configTemplateRadio.rowSameLineRadio\">\n @if (item().fieldLabel) {\n <libs_ui-components-radio-single\n [label]=\"item().fieldLabel\"\n [avatarConfig]=\"item().avatarConfig\"\n [active]=\"keySelected() === item()[fieldKey()]\"\n [key]=\"item()[fieldKey()]\"\n [imgTypeIcon]=\"configTemplateRadio.hasAvatarGroupSocial\"\n [linkImage]=\"\n configTemplateRadio.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateRadio.getImageError ? configTemplateRadio.getImageError : configTemplateRadio.getImage) : item() | async)\n : item()[configTemplateRadio.fieldGetImage || '']\n \"\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().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe\"\n [clickExactly]=\"clickExactly()\"\n [disableLabel]=\"disableLabel()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateRadio.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateRadio.getComponentOutlet : item() : fieldKey() : { valueIs0: 0 } | async\"\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\n class=\"w-full {{ (configTemplateRadio.classRowsWrapper || 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 @let constHtmlTextNoData = config()?.textNoData || 'i18n_have_no_selection';\n <span>{{ constHtmlTextNoData | translate }}</span>\n }\n @if (templateRefSearchNoData() && keySearch() && !loading()) {\n <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null; context: { keySearch: keySearch() }\" />\n }\n @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n <span>{{ constHtmlTextSearchNoData | translate }}</span>\n }\n @if (loading()) {\n <span> </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:6px 16px;position:relative}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "component", type: LibsUiComponentsRadioSingleComponent, selector: "libs_ui-components-radio-single", inputs: ["key", "active", "classInclude", "label", "labelInterpolateParams", "ignorePopoverLabel", "classLabelInclude", "linkImage", "linkImageError", "avatarConfig", "classImageInclude", "imgTypeIcon", "bullet", "popover", "disable", "disableLabel", "clickExactly", "typeRadio", "ignoreRadio", "zIndexLabel", "classIncludeIcon", "dataComponentOutlet", "componentOutlet"], 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"] }, { kind: "pipe", type: LibsUiPipesConvertObjectToSignalPipe, name: "LibsUiPipesConvertObjectToSignalPipe" }, { kind: "pipe", type: LibsUiPipesConvertSignalToObjectPipe, name: "LibsUiPipesConvertSignalToObjectPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1907
1907
|
}
|
|
1908
1908
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListRadioComponent, decorators: [{
|
|
1909
1909
|
type: Component,
|
|
@@ -1920,7 +1920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1920
1920
|
LibsUiComponentsListRowsComponent,
|
|
1921
1921
|
LibsUiPipesConvertObjectToSignalPipe,
|
|
1922
1922
|
LibsUiPipesConvertSignalToObjectPipe,
|
|
1923
|
-
], template: "@if (configTemplateRadio(); as configTemplateRadio) {\n <div class=\"relative h-full w-full\">\n @if (items().length) {\n <div\n #elementScroll\n LibsUiComponentsScrollOverlayDirective\n class=\"w-full\"\n [class.h-full]=\"!heightViewPort()\"\n [style.height]=\"heightViewPort() ? heightViewPort() + 'px' : '100%'\"\n (outScrollBottom)=\"handlerScrollBottom()\">\n <virtual-scroller\n #scroll\n [parentScroll]=\"elementScroll\"\n [items]=\"items()\"\n class=\"h-full\">\n @for (item of scroll.viewPortItems; track item()[fieldKey()]) {\n <div\n #itemRef\n [class]=\"'libs-ui-list-template-radio-item libs-ui-font-h5r 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\n class=\"flex flex-col w-full\"\n [class.!flex-row]=\"configTemplateRadio.rowSameLineRadio\">\n @if (item().fieldLabel) {\n <libs_ui-components-radio-single\n [label]=\"item().fieldLabel\"\n [avatarConfig]=\"item().avatarConfig\"\n [active]=\"keySelected() === item()[fieldKey()]\"\n [key]=\"item()[fieldKey()]\"\n [imgTypeIcon]=\"configTemplateRadio.hasAvatarGroupSocial\"\n [linkImage]=\"\n configTemplateRadio.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateRadio.getImageError ? configTemplateRadio.getImageError : configTemplateRadio.getImage) : item() | async)\n : item()[configTemplateRadio.fieldGetImage || '']\n \"\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().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe\"\n [clickExactly]=\"clickExactly()\"\n [disableLabel]=\"disableLabel()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateRadio.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateRadio.getComponentOutlet : item() : fieldKey() : { valueIs0: 0 } | async\"\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\n class=\"w-full {{ (configTemplateRadio.classRowsWrapper || 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
|
|
1923
|
+
], template: "@if (configTemplateRadio(); as configTemplateRadio) {\n <div class=\"relative h-full w-full\">\n @if (items().length) {\n <div\n #elementScroll\n LibsUiComponentsScrollOverlayDirective\n class=\"w-full\"\n [class.h-full]=\"!heightViewPort()\"\n [style.height]=\"heightViewPort() ? heightViewPort() + 'px' : '100%'\"\n (outScrollBottom)=\"handlerScrollBottom()\">\n <virtual-scroller\n #scroll\n [parentScroll]=\"elementScroll\"\n [items]=\"items()\"\n class=\"h-full\">\n @for (item of scroll.viewPortItems; track item()[fieldKey()]) {\n <div\n #itemRef\n [class]=\"'libs-ui-list-template-radio-item libs-ui-font-h5r 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\n class=\"flex flex-col w-full\"\n [class.!flex-row]=\"configTemplateRadio.rowSameLineRadio\">\n @if (item().fieldLabel) {\n <libs_ui-components-radio-single\n [label]=\"item().fieldLabel\"\n [avatarConfig]=\"item().avatarConfig\"\n [active]=\"keySelected() === item()[fieldKey()]\"\n [key]=\"item()[fieldKey()]\"\n [imgTypeIcon]=\"configTemplateRadio.hasAvatarGroupSocial\"\n [linkImage]=\"\n configTemplateRadio.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateRadio.getImageError ? configTemplateRadio.getImageError : configTemplateRadio.getImage) : item() | async)\n : item()[configTemplateRadio.fieldGetImage || '']\n \"\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().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe\"\n [clickExactly]=\"clickExactly()\"\n [disableLabel]=\"disableLabel()\"\n [dataComponentOutlet]=\"undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateRadio.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\"\n [componentOutlet]=\"0 | LibsUiPipesCallFunctionInTemplatePipe: configTemplateRadio.getComponentOutlet : item() : fieldKey() : { valueIs0: 0 } | async\"\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\n class=\"w-full {{ (configTemplateRadio.classRowsWrapper || 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 @let constHtmlTextNoData = config()?.textNoData || 'i18n_have_no_selection';\n <span>{{ constHtmlTextNoData | translate }}</span>\n }\n @if (templateRefSearchNoData() && keySearch() && !loading()) {\n <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null; context: { keySearch: keySearch() }\" />\n }\n @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n <span>{{ constHtmlTextSearchNoData | translate }}</span>\n }\n @if (loading()) {\n <span> </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:6px 16px;position:relative}\n"] }]
|
|
1924
1924
|
}] });
|
|
1925
1925
|
|
|
1926
1926
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
@@ -2044,11 +2044,11 @@ class LibsUiComponentsListTagComponent extends LibsUiComponentsListTemplatesComp
|
|
|
2044
2044
|
return this.items().length;
|
|
2045
2045
|
}
|
|
2046
2046
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListTagComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2047
|
-
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\n class=\"w-full h-full relative\"\n LibsUiComponentsScrollOverlayDirective\n (outScrollBottom)=\"handlerScrollBottom()\">\n <div\n 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-[94px]]=\"loading() && items()\">\n @for (item of items(); track item()[fieldKey()]) {\n <div\n [class.libs-ui-disable]=\"loading() || disable()\"\n [class.pointer-events-none]=\"loading() || disable()\"\n [class]=\"item().classContainerItem\">\n @if (item().bullet; as bullet) {\n <div\n [class]=\"item().classItem || 'rounded-[10px] px-[8px] py-[1px] mb-[8px] mr-[8px]'\"\n [class.w-max]=\"configTemplateTag?.ignoreItemFlexWrap\"\n [style.background-color]=\"bullet().backgroundColor\"\n [style.color]=\"bullet().color\"\n (click)=\"handlerSelectItem($event, item())\">\n <span [innerHTML]=\"item().fieldLabel\"></span>\n </div>\n } @else {\n @let constHtmlIsSelected = item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected()
|
|
2047
|
+
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\n class=\"w-full h-full relative\"\n LibsUiComponentsScrollOverlayDirective\n (outScrollBottom)=\"handlerScrollBottom()\">\n <div\n 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-[94px]]=\"loading() && items()\">\n @for (item of items(); track item()[fieldKey()]) {\n <div\n [class.libs-ui-disable]=\"loading() || disable()\"\n [class.pointer-events-none]=\"loading() || disable()\"\n [class]=\"item().classContainerItem\">\n @if (item().bullet; as bullet) {\n <div\n [class]=\"item().classItem || 'rounded-[10px] px-[8px] py-[1px] mb-[8px] mr-[8px]'\"\n [class.w-max]=\"configTemplateTag?.ignoreItemFlexWrap\"\n [style.background-color]=\"bullet().backgroundColor\"\n [style.color]=\"bullet().color\"\n (click)=\"handlerSelectItem($event, item())\">\n <span [innerHTML]=\"item().fieldLabel\"></span>\n </div>\n } @else {\n @let constHtmlIsSelected = item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected().length;\n <div\n (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-[var(--libs-ui-color-light-2)]]=\"constHtmlIsSelected\"\n [class.text-[var(--libs-ui-color-default)]]=\"constHtmlIsSelected\"\n [class.bg-white]=\"!constHtmlIsSelected\"\n [class.text-[#6a7383]]=\"!constHtmlIsSelected\"\n [class.libs-ui-border-general]=\"!constHtmlIsSelected\">\n @if (constHtmlIsSelected) {\n <div class=\"mr-[8px] text-[12px] libs-ui-icon-check before:text-[var(--libs-ui-color-default)]\"></div>\n }\n <span\n class=\"libs-ui-font-h6r break-word\"\n [innerHTML]=\"item().fieldLabel\"></span>\n </div>\n }\n </div>\n }\n @if (!items() || !items().length) {\n <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] ' + (config()?.textNoDataClassInclude ?? 'py-[4px] flex items-center justify-center w-full')\">\n @if (!keySearch() && !loading()) {\n @let constHtmlTextNoData = config()?.textNoData || 'i18n_have_no_selection';\n {{ constHtmlTextNoData | translate }}\n }\n @if (templateRefSearchNoData() && keySearch() && !loading()) {\n <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null; context: { keySearch: keySearch() }\" />\n }\n @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n {{ constHtmlTextSearchNoData | translate }}\n }\n @if (loading()) {\n \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", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], outputs: ["outScroll", "outScrollX", "outScrollY", "outScrollTop", "outScrollBottom"] }, { kind: "pipe", type: LibsUiCheckSelectedByKeyPipe, name: "LibsUiCheckSelectedByKeyPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2048
2048
|
}
|
|
2049
2049
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListTagComponent, decorators: [{
|
|
2050
2050
|
type: Component,
|
|
2051
|
-
args: [{ selector: 'libs_ui-components-list-templates_tag', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [VirtualScrollerModule, NgTemplateOutlet, TranslateModule, NgClass, LibsUiComponentsSpinnerComponent, LibsUiComponentsScrollOverlayDirective, LibsUiCheckSelectedByKeyPipe], template: "@if (configTemplateTag(); as configTemplateTag) {\n <div\n class=\"w-full h-full relative\"\n LibsUiComponentsScrollOverlayDirective\n (outScrollBottom)=\"handlerScrollBottom()\">\n <div\n 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-[94px]]=\"loading() && items()\">\n @for (item of items(); track item()[fieldKey()]) {\n <div\n [class.libs-ui-disable]=\"loading() || disable()\"\n [class.pointer-events-none]=\"loading() || disable()\"\n [class]=\"item().classContainerItem\">\n @if (item().bullet; as bullet) {\n <div\n [class]=\"item().classItem || 'rounded-[10px] px-[8px] py-[1px] mb-[8px] mr-[8px]'\"\n [class.w-max]=\"configTemplateTag?.ignoreItemFlexWrap\"\n [style.background-color]=\"bullet().backgroundColor\"\n [style.color]=\"bullet().color\"\n (click)=\"handlerSelectItem($event, item())\">\n <span [innerHTML]=\"item().fieldLabel\"></span>\n </div>\n } @else {\n @let constHtmlIsSelected = item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected()
|
|
2051
|
+
args: [{ selector: 'libs_ui-components-list-templates_tag', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [VirtualScrollerModule, NgTemplateOutlet, TranslateModule, NgClass, LibsUiComponentsSpinnerComponent, LibsUiComponentsScrollOverlayDirective, LibsUiCheckSelectedByKeyPipe], template: "@if (configTemplateTag(); as configTemplateTag) {\n <div\n class=\"w-full h-full relative\"\n LibsUiComponentsScrollOverlayDirective\n (outScrollBottom)=\"handlerScrollBottom()\">\n <div\n 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-[94px]]=\"loading() && items()\">\n @for (item of items(); track item()[fieldKey()]) {\n <div\n [class.libs-ui-disable]=\"loading() || disable()\"\n [class.pointer-events-none]=\"loading() || disable()\"\n [class]=\"item().classContainerItem\">\n @if (item().bullet; as bullet) {\n <div\n [class]=\"item().classItem || 'rounded-[10px] px-[8px] py-[1px] mb-[8px] mr-[8px]'\"\n [class.w-max]=\"configTemplateTag?.ignoreItemFlexWrap\"\n [style.background-color]=\"bullet().backgroundColor\"\n [style.color]=\"bullet().color\"\n (click)=\"handlerSelectItem($event, item())\">\n <span [innerHTML]=\"item().fieldLabel\"></span>\n </div>\n } @else {\n @let constHtmlIsSelected = item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected().length;\n <div\n (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-[var(--libs-ui-color-light-2)]]=\"constHtmlIsSelected\"\n [class.text-[var(--libs-ui-color-default)]]=\"constHtmlIsSelected\"\n [class.bg-white]=\"!constHtmlIsSelected\"\n [class.text-[#6a7383]]=\"!constHtmlIsSelected\"\n [class.libs-ui-border-general]=\"!constHtmlIsSelected\">\n @if (constHtmlIsSelected) {\n <div class=\"mr-[8px] text-[12px] libs-ui-icon-check before:text-[var(--libs-ui-color-default)]\"></div>\n }\n <span\n class=\"libs-ui-font-h6r break-word\"\n [innerHTML]=\"item().fieldLabel\"></span>\n </div>\n }\n </div>\n }\n @if (!items() || !items().length) {\n <div [class]=\"'libs-ui-font-h5r text-[#9ca2ad] ' + (config()?.textNoDataClassInclude ?? 'py-[4px] flex items-center justify-center w-full')\">\n @if (!keySearch() && !loading()) {\n @let constHtmlTextNoData = config()?.textNoData || 'i18n_have_no_selection';\n {{ constHtmlTextNoData | translate }}\n }\n @if (templateRefSearchNoData() && keySearch() && !loading()) {\n <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null; context: { keySearch: keySearch() }\" />\n }\n @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n {{ constHtmlTextSearchNoData | translate }}\n }\n @if (loading()) {\n \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" }]
|
|
2052
2052
|
}] });
|
|
2053
2053
|
|
|
2054
2054
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
@@ -2247,7 +2247,7 @@ class LibsUiComponentsListTextComponent extends LibsUiComponentsListTemplatesCom
|
|
|
2247
2247
|
item.specific_loadImgError = true;
|
|
2248
2248
|
}
|
|
2249
2249
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListTextComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2250
|
-
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\n #elementScroll\n [style.height]=\"isShowHeightCalculate() ? heightViewPort() + 'px' : '100%'\"\n class=\"w-full\"\n [class.h-full]=\"!isShowHeightCalculate()\"\n LibsUiComponentsScrollOverlayDirective\n (outScrollBottom)=\"handlerScrollBottom()\">\n @if (!configTemplateText.notUseVirtualScroll) {\n <virtual-scroller\n #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 \n }\n </div>\n }\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"loadingIconSize() || 'medium'\" />\n }\n </div>\n <ng-template\n #listRef\n let-itemsView=\"itemsView\">\n @for (item of itemsView; track item()[fieldKey()]) {\n <div\n #itemRef\n [class]=\"item().classItemWrapper || ''\">\n <div\n LibsUiComponentsListHighlightKeySearchDirective\n [isHighlight]=\"config()?.highlightTextSearchInResult\"\n [keySearch]=\"keySearch()\"\n [class]=\"'libs-ui-list-template-text-item libs-ui-font-h5r 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 | LibsUiPipesConvertObjectToSignalPipe)?.(); as bullet) {\n <span\n class=\"libs-ui-list-template-text-item-bullet flex flex-shrink-0\"\n [style.backgroundColor]=\"bullet.backgroundColor\"\n (click)=\"handlerSelectItem($event, item())\"></span>\n }\n @if ((item().avatarConfig | LibsUiPipesConvertObjectToSignalPipe)?.(); as avatarConfig) {\n <libs_ui-components-avatar\n [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 [getLastTextAfterSpace]=\"avatarConfig.getLastTextAfterSpace\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (configTemplateText.getImage || configTemplateText.fieldGetImage) {\n <img\n [src]=\"\n configTemplateText.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateText.getImageError ? configTemplateText.getImageError : configTemplateText.getImage) : item() | async)\n : item()[configTemplateText.fieldGetImage || '']\n \"\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 | LibsUiPipesConvertObjectToSignalPipe)?.(); as buttonLeft) {\n @if (item().hrefButton) {\n <a\n [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\n class=\"w-full\"\n [type]=\"buttonLeft.type ?? 'button-link-primary'\"\n [label]=\"buttonLeft.label ?? ' '\"\n [zIndex]=\"buttonLeft.zIndex\"\n [disable]=\"buttonLeft.disable ?? false\"\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 | LibsUiPipesConvertSignalToObjectPipe\"\n [styleButton]=\"buttonLeft.styleButton | LibsUiPipesConvertSignalToObjectPipe\"\n (outClick)=\"handlerSelectItem($event, item())\" />\n </ng-template>\n }\n @if ((item().switchConfig | LibsUiPipesConvertObjectToSignalPipe)?.(); as switchConfig) {\n <libs_ui-components-switch\n [active]=\"switchConfig.active\"\n (outSwitch)=\"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 @if (((item().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe) ?? { type: 'text' }; as popoverLabel) {\n <libs_ui-components-popover\n [type]=\"popoverLabel.type || 'text'\"\n [elementRefCustom]=\"popoverLabel.type === 'text' ? undefined : itemRef\"\n [ignoreShowPopover]=\"popoverLabel.ignoreShowPopover\"\n [config]=\"popoverLabel.config ?? configTemplateText.configLabelPopover?.() ?? {}\"\n [innerHtml]=\"item().fieldLabel\"\n [classInclude]=\"item().classInclude\"\n (outEvent)=\"handlerSelectItem($event, item())\" />\n }\n }\n @if ((item().fieldPopover | LibsUiPipesConvertObjectToSignalPipe)?.(); as popover) {\n <libs_ui-components-popover\n class=\"{{ popover.classInclude }}\"\n [config]=\"popover.config\">\n @if (popover.dataView) {\n <div [innerHtml]=\"popover.dataView | translate\"></div>\n } @else {\n <i class=\"libs-ui-icon-tooltip-outline\"></i>\n }\n </libs_ui-components-popover>\n }\n @if (configTemplateText?.rows) {\n <libs_ui-components-list-templates_rows\n 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 (configTemplateText.getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n item() | LibsUiPipesGetValueOfObjectPipe: fieldKey() : undefined : true | LibsUiPipesCallFunctionInTemplatePipe: configTemplateText.getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateText.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n\n @if ((keySelected() === item()[fieldKey()] || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected()?.length)) && !configTemplateText.ignoreIconSelected && !configTemplateText.actionSort) {\n <i [class]=\"'libs-ui-icon-check ' + (configTemplateText.classIncludeIconSelected || 'right-[12px]')\"></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\n [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;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: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "component", type: LibsUiComponentsAvatarComponent, selector: "libs_ui-components-avatar", inputs: ["typeShape", "classInclude", "size", "linkAvatar", "linkAvatarError", "classImageInclude", "zIndexPreviewImage", "clickPreviewImage", "idGenColor", "getLastTextAfterSpace", "textAvatar", "textAvatarClassInclude", "containertextAvatarClassInclude"], outputs: ["outAvatarError", "outEventPreviewImage"] }, { 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", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], 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" }, { kind: "pipe", type: LibsUiPipesGetValueOfObjectPipe, name: "LibsUiPipesGetValueOfObjectPipe" }, { kind: "pipe", type: LibsUiPipesConvertObjectToSignalPipe, name: "LibsUiPipesConvertObjectToSignalPipe" }, { kind: "pipe", type: LibsUiPipesConvertSignalToObjectPipe, name: "LibsUiPipesConvertSignalToObjectPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2250
|
+
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\n #elementScroll\n [style.height]=\"isShowHeightCalculate() ? heightViewPort() + 'px' : '100%'\"\n class=\"w-full\"\n [class.h-full]=\"!isShowHeightCalculate()\"\n LibsUiComponentsScrollOverlayDirective\n (outScrollBottom)=\"handlerScrollBottom()\">\n @if (!configTemplateText.notUseVirtualScroll) {\n <virtual-scroller\n #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 @let constHtmlTextNoData = config()?.textNoData || 'i18n_have_no_selection';\n {{ constHtmlTextNoData | translate }}\n }\n @if (templateRefSearchNoData() && keySearch() && !loading()) {\n <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null; context: { keySearch: keySearch() }\" />\n }\n @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n {{ constHtmlTextSearchNoData | translate }}\n }\n @if (loading()) {\n \n }\n </div>\n }\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"loadingIconSize() || 'medium'\" />\n }\n </div>\n <ng-template\n #listRef\n let-itemsView=\"itemsView\">\n @for (item of itemsView; track item()[fieldKey()]) {\n <div\n #itemRef\n [class]=\"item().classItemWrapper || ''\">\n <div\n LibsUiComponentsListHighlightKeySearchDirective\n [isHighlight]=\"config()?.highlightTextSearchInResult\"\n [keySearch]=\"keySearch()\"\n [class]=\"'libs-ui-list-template-text-item libs-ui-font-h5r 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 | LibsUiPipesConvertObjectToSignalPipe)?.(); as bullet) {\n <span\n class=\"libs-ui-list-template-text-item-bullet flex flex-shrink-0\"\n [style.backgroundColor]=\"bullet.backgroundColor\"\n (click)=\"handlerSelectItem($event, item())\"></span>\n }\n @if ((item().avatarConfig | LibsUiPipesConvertObjectToSignalPipe)?.(); as avatarConfig) {\n <libs_ui-components-avatar\n [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 [getLastTextAfterSpace]=\"avatarConfig.getLastTextAfterSpace\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (configTemplateText.getImage || configTemplateText.fieldGetImage) {\n <img\n [src]=\"\n configTemplateText.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateText.getImageError ? configTemplateText.getImageError : configTemplateText.getImage) : item() | async)\n : item()[configTemplateText.fieldGetImage || '']\n \"\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 | LibsUiPipesConvertObjectToSignalPipe)?.(); as buttonLeft) {\n @if (item().hrefButton) {\n <a\n [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\n class=\"w-full\"\n [type]=\"buttonLeft.type ?? 'button-link-primary'\"\n [label]=\"buttonLeft.label ?? ' '\"\n [zIndex]=\"buttonLeft.zIndex\"\n [disable]=\"buttonLeft.disable ?? false\"\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 | LibsUiPipesConvertSignalToObjectPipe\"\n [styleButton]=\"buttonLeft.styleButton | LibsUiPipesConvertSignalToObjectPipe\"\n (outClick)=\"handlerSelectItem($event, item())\" />\n </ng-template>\n }\n @if ((item().switchConfig | LibsUiPipesConvertObjectToSignalPipe)?.(); as switchConfig) {\n <libs_ui-components-switch\n [active]=\"switchConfig.active\"\n (outSwitch)=\"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 @if (((item().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe) ?? { type: 'text' }; as popoverLabel) {\n <libs_ui-components-popover\n [type]=\"popoverLabel.type || 'text'\"\n [elementRefCustom]=\"popoverLabel.type === 'text' ? undefined : itemRef\"\n [ignoreShowPopover]=\"popoverLabel.ignoreShowPopover\"\n [config]=\"popoverLabel.config ?? configTemplateText.configLabelPopover?.() ?? {}\"\n [innerHtml]=\"item().fieldLabel\"\n [classInclude]=\"item().classInclude\"\n (outEvent)=\"handlerSelectItem($event, item())\" />\n }\n }\n @if ((item().fieldPopover | LibsUiPipesConvertObjectToSignalPipe)?.(); as popover) {\n <libs_ui-components-popover\n class=\"{{ popover.classInclude }}\"\n [config]=\"popover.config\">\n @if (popover.dataView) {\n <div [innerHtml]=\"popover.dataView | translate\"></div>\n } @else {\n <i class=\"libs-ui-icon-tooltip-outline\"></i>\n }\n </libs_ui-components-popover>\n }\n @if (configTemplateText?.rows) {\n <libs_ui-components-list-templates_rows\n 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 (configTemplateText.getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n item() | LibsUiPipesGetValueOfObjectPipe: fieldKey() : undefined : true | LibsUiPipesCallFunctionInTemplatePipe: configTemplateText.getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateText.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n\n @if ((keySelected() === item()[fieldKey()] || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected().length)) && !configTemplateText.ignoreIconSelected && !configTemplateText.actionSort) {\n <i [class]=\"'libs-ui-icon-check ' + (configTemplateText.classIncludeIconSelected || 'right-[12px]')\"></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\n [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;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: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }, { kind: "component", type: LibsUiComponentsAvatarComponent, selector: "libs_ui-components-avatar", inputs: ["typeShape", "classInclude", "size", "linkAvatar", "linkAvatarError", "classImageInclude", "zIndexPreviewImage", "clickPreviewImage", "idGenColor", "getLastTextAfterSpace", "textAvatar", "textAvatarClassInclude", "containertextAvatarClassInclude"], outputs: ["outAvatarError", "outEventPreviewImage"] }, { 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", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "directive", type: LibsUiComponentsScrollOverlayDirective, selector: "[LibsUiComponentsScrollOverlayDirective]", inputs: ["debugMode", "ignoreInit", "classContainer", "options", "elementCheckScrollX", "elementCheckScrollY", "elementScroll"], 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" }, { kind: "pipe", type: LibsUiPipesGetValueOfObjectPipe, name: "LibsUiPipesGetValueOfObjectPipe" }, { kind: "pipe", type: LibsUiPipesConvertObjectToSignalPipe, name: "LibsUiPipesConvertObjectToSignalPipe" }, { kind: "pipe", type: LibsUiPipesConvertSignalToObjectPipe, name: "LibsUiPipesConvertSignalToObjectPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2251
2251
|
}
|
|
2252
2252
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListTextComponent, decorators: [{
|
|
2253
2253
|
type: Component,
|
|
@@ -2272,7 +2272,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2272
2272
|
LibsUiPipesGetValueOfObjectPipe,
|
|
2273
2273
|
LibsUiPipesConvertObjectToSignalPipe,
|
|
2274
2274
|
LibsUiPipesConvertSignalToObjectPipe,
|
|
2275
|
-
], template: "@if (configTemplateText(); as configTemplateText) {\n <div class=\"relative h-full w-full\">\n @if (items() && items().length) {\n <div\n #elementScroll\n [style.height]=\"isShowHeightCalculate() ? heightViewPort() + 'px' : '100%'\"\n class=\"w-full\"\n [class.h-full]=\"!isShowHeightCalculate()\"\n LibsUiComponentsScrollOverlayDirective\n (outScrollBottom)=\"handlerScrollBottom()\">\n @if (!configTemplateText.notUseVirtualScroll) {\n <virtual-scroller\n #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 \n }\n </div>\n }\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"loadingIconSize() || 'medium'\" />\n }\n </div>\n <ng-template\n #listRef\n let-itemsView=\"itemsView\">\n @for (item of itemsView; track item()[fieldKey()]) {\n <div\n #itemRef\n [class]=\"item().classItemWrapper || ''\">\n <div\n LibsUiComponentsListHighlightKeySearchDirective\n [isHighlight]=\"config()?.highlightTextSearchInResult\"\n [keySearch]=\"keySearch()\"\n [class]=\"'libs-ui-list-template-text-item libs-ui-font-h5r 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 | LibsUiPipesConvertObjectToSignalPipe)?.(); as bullet) {\n <span\n class=\"libs-ui-list-template-text-item-bullet flex flex-shrink-0\"\n [style.backgroundColor]=\"bullet.backgroundColor\"\n (click)=\"handlerSelectItem($event, item())\"></span>\n }\n @if ((item().avatarConfig | LibsUiPipesConvertObjectToSignalPipe)?.(); as avatarConfig) {\n <libs_ui-components-avatar\n [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 [getLastTextAfterSpace]=\"avatarConfig.getLastTextAfterSpace\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (configTemplateText.getImage || configTemplateText.fieldGetImage) {\n <img\n [src]=\"\n configTemplateText.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateText.getImageError ? configTemplateText.getImageError : configTemplateText.getImage) : item() | async)\n : item()[configTemplateText.fieldGetImage || '']\n \"\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 | LibsUiPipesConvertObjectToSignalPipe)?.(); as buttonLeft) {\n @if (item().hrefButton) {\n <a\n [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\n class=\"w-full\"\n [type]=\"buttonLeft.type ?? 'button-link-primary'\"\n [label]=\"buttonLeft.label ?? ' '\"\n [zIndex]=\"buttonLeft.zIndex\"\n [disable]=\"buttonLeft.disable ?? false\"\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 | LibsUiPipesConvertSignalToObjectPipe\"\n [styleButton]=\"buttonLeft.styleButton | LibsUiPipesConvertSignalToObjectPipe\"\n (outClick)=\"handlerSelectItem($event, item())\" />\n </ng-template>\n }\n @if ((item().switchConfig | LibsUiPipesConvertObjectToSignalPipe)?.(); as switchConfig) {\n <libs_ui-components-switch\n [active]=\"switchConfig.active\"\n (outSwitch)=\"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 @if (((item().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe) ?? { type: 'text' }; as popoverLabel) {\n <libs_ui-components-popover\n [type]=\"popoverLabel.type || 'text'\"\n [elementRefCustom]=\"popoverLabel.type === 'text' ? undefined : itemRef\"\n [ignoreShowPopover]=\"popoverLabel.ignoreShowPopover\"\n [config]=\"popoverLabel.config ?? configTemplateText.configLabelPopover?.() ?? {}\"\n [innerHtml]=\"item().fieldLabel\"\n [classInclude]=\"item().classInclude\"\n (outEvent)=\"handlerSelectItem($event, item())\" />\n }\n }\n @if ((item().fieldPopover | LibsUiPipesConvertObjectToSignalPipe)?.(); as popover) {\n <libs_ui-components-popover\n class=\"{{ popover.classInclude }}\"\n [config]=\"popover.config\">\n @if (popover.dataView) {\n <div [innerHtml]=\"popover.dataView | translate\"></div>\n } @else {\n <i class=\"libs-ui-icon-tooltip-outline\"></i>\n }\n </libs_ui-components-popover>\n }\n @if (configTemplateText?.rows) {\n <libs_ui-components-list-templates_rows\n 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 (configTemplateText.getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n item() | LibsUiPipesGetValueOfObjectPipe: fieldKey() : undefined : true | LibsUiPipesCallFunctionInTemplatePipe: configTemplateText.getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateText.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n\n @if ((keySelected() === item()[fieldKey()] || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected()?.length)) && !configTemplateText.ignoreIconSelected && !configTemplateText.actionSort) {\n <i [class]=\"'libs-ui-icon-check ' + (configTemplateText.classIncludeIconSelected || 'right-[12px]')\"></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\n [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;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"] }]
|
|
2275
|
+
], template: "@if (configTemplateText(); as configTemplateText) {\n <div class=\"relative h-full w-full\">\n @if (items() && items().length) {\n <div\n #elementScroll\n [style.height]=\"isShowHeightCalculate() ? heightViewPort() + 'px' : '100%'\"\n class=\"w-full\"\n [class.h-full]=\"!isShowHeightCalculate()\"\n LibsUiComponentsScrollOverlayDirective\n (outScrollBottom)=\"handlerScrollBottom()\">\n @if (!configTemplateText.notUseVirtualScroll) {\n <virtual-scroller\n #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 @let constHtmlTextNoData = config()?.textNoData || 'i18n_have_no_selection';\n {{ constHtmlTextNoData | translate }}\n }\n @if (templateRefSearchNoData() && keySearch() && !loading()) {\n <ng-container *ngTemplateOutlet=\"templateRefSearchNoData() || null; context: { keySearch: keySearch() }\" />\n }\n @if (!templateRefSearchNoData() && keySearch() && !loading()) {\n @let constHtmlTextSearchNoData = config()?.textSearchNoData || 'i18n_no_result';\n {{ constHtmlTextSearchNoData | translate }}\n }\n @if (loading()) {\n \n }\n </div>\n }\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"loadingIconSize() || 'medium'\" />\n }\n </div>\n <ng-template\n #listRef\n let-itemsView=\"itemsView\">\n @for (item of itemsView; track item()[fieldKey()]) {\n <div\n #itemRef\n [class]=\"item().classItemWrapper || ''\">\n <div\n LibsUiComponentsListHighlightKeySearchDirective\n [isHighlight]=\"config()?.highlightTextSearchInResult\"\n [keySearch]=\"keySearch()\"\n [class]=\"'libs-ui-list-template-text-item libs-ui-font-h5r 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 | LibsUiPipesConvertObjectToSignalPipe)?.(); as bullet) {\n <span\n class=\"libs-ui-list-template-text-item-bullet flex flex-shrink-0\"\n [style.backgroundColor]=\"bullet.backgroundColor\"\n (click)=\"handlerSelectItem($event, item())\"></span>\n }\n @if ((item().avatarConfig | LibsUiPipesConvertObjectToSignalPipe)?.(); as avatarConfig) {\n <libs_ui-components-avatar\n [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 [getLastTextAfterSpace]=\"avatarConfig.getLastTextAfterSpace\"\n [textAvatar]=\"avatarConfig.textAvatar\" />\n }\n @if (configTemplateText.getImage || configTemplateText.fieldGetImage) {\n <img\n [src]=\"\n configTemplateText.getImage\n ? ('avatar' | LibsUiPipesCallFunctionInTemplatePipe: (item().specific_loadImgError && configTemplateText.getImageError ? configTemplateText.getImageError : configTemplateText.getImage) : item() | async)\n : item()[configTemplateText.fieldGetImage || '']\n \"\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 | LibsUiPipesConvertObjectToSignalPipe)?.(); as buttonLeft) {\n @if (item().hrefButton) {\n <a\n [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\n class=\"w-full\"\n [type]=\"buttonLeft.type ?? 'button-link-primary'\"\n [label]=\"buttonLeft.label ?? ' '\"\n [zIndex]=\"buttonLeft.zIndex\"\n [disable]=\"buttonLeft.disable ?? false\"\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 | LibsUiPipesConvertSignalToObjectPipe\"\n [styleButton]=\"buttonLeft.styleButton | LibsUiPipesConvertSignalToObjectPipe\"\n (outClick)=\"handlerSelectItem($event, item())\" />\n </ng-template>\n }\n @if ((item().switchConfig | LibsUiPipesConvertObjectToSignalPipe)?.(); as switchConfig) {\n <libs_ui-components-switch\n [active]=\"switchConfig.active\"\n (outSwitch)=\"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 @if (((item().popoverLabel | LibsUiPipesConvertObjectToSignalPipe)?.() | LibsUiPipesConvertSignalToObjectPipe) ?? { type: 'text' }; as popoverLabel) {\n <libs_ui-components-popover\n [type]=\"popoverLabel.type || 'text'\"\n [elementRefCustom]=\"popoverLabel.type === 'text' ? undefined : itemRef\"\n [ignoreShowPopover]=\"popoverLabel.ignoreShowPopover\"\n [config]=\"popoverLabel.config ?? configTemplateText.configLabelPopover?.() ?? {}\"\n [innerHtml]=\"item().fieldLabel\"\n [classInclude]=\"item().classInclude\"\n (outEvent)=\"handlerSelectItem($event, item())\" />\n }\n }\n @if ((item().fieldPopover | LibsUiPipesConvertObjectToSignalPipe)?.(); as popover) {\n <libs_ui-components-popover\n class=\"{{ popover.classInclude }}\"\n [config]=\"popover.config\">\n @if (popover.dataView) {\n <div [innerHtml]=\"popover.dataView | translate\"></div>\n } @else {\n <i class=\"libs-ui-icon-tooltip-outline\"></i>\n }\n </libs_ui-components-popover>\n }\n @if (configTemplateText?.rows) {\n <libs_ui-components-list-templates_rows\n 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 (configTemplateText.getComponentOutlet) {\n <ng-container\n *ngComponentOutlet=\"\n item() | LibsUiPipesGetValueOfObjectPipe: fieldKey() : undefined : true | LibsUiPipesCallFunctionInTemplatePipe: configTemplateText.getComponentOutlet : item() | async;\n inputs: undefined | LibsUiPipesCallFunctionInTemplatePipe: configTemplateText.getDataComponentOutlet : item() : fieldKey() : { valueIsEmpty: { item: item() } } | async\n \" />\n }\n\n @if ((keySelected() === item()[fieldKey()] || (item()[fieldKey()] | LibsUiCheckSelectedByKeyPipe: multiKeySelected() : multiKeySelected().length)) && !configTemplateText.ignoreIconSelected && !configTemplateText.actionSort) {\n <i [class]=\"'libs-ui-icon-check ' + (configTemplateText.classIncludeIconSelected || 'right-[12px]')\"></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\n [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;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"] }]
|
|
2276
2276
|
}] });
|
|
2277
2277
|
|
|
2278
2278
|
const getComponentByType = (typeTemplate) => {
|
|
@@ -2740,11 +2740,11 @@ class LibsUiComponentsListComponent {
|
|
|
2740
2740
|
this.onDestroy.complete();
|
|
2741
2741
|
}
|
|
2742
2742
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2743
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListComponent, isStandalone: true, selector: "libs_ui-components-list", inputs: { hiddenInputSearch: { classPropertyName: "hiddenInputSearch", publicName: "hiddenInputSearch", isSignal: true, isRequired: false, transformFunction: null }, dropdownTabKeyActive: { classPropertyName: "dropdownTabKeyActive", publicName: "dropdownTabKeyActive", isSignal: true, isRequired: false, transformFunction: null }, keySearch: { classPropertyName: "keySearch", publicName: "keySearch", isSignal: true, isRequired: false, transformFunction: null }, paddingLeftItem: { classPropertyName: "paddingLeftItem", publicName: "paddingLeftItem", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, autoSelectedFirstItemCallOutsideBefore: { classPropertyName: "autoSelectedFirstItemCallOutsideBefore", publicName: "autoSelectedFirstItemCallOutsideBefore", isSignal: true, isRequired: false, transformFunction: null }, isSearchOnline: { classPropertyName: "isSearchOnline", publicName: "isSearchOnline", 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 }, labelConfig: { classPropertyName: "labelConfig", publicName: "labelConfig", isSignal: true, isRequired: false, transformFunction: null }, searchConfig: { classPropertyName: "searchConfig", publicName: "searchConfig", isSignal: true, isRequired: false, transformFunction: null }, searchPadding: { classPropertyName: "searchPadding", publicName: "searchPadding", isSignal: true, isRequired: false, transformFunction: null }, dividerClassInclude: { classPropertyName: "dividerClassInclude", publicName: "dividerClassInclude", isSignal: true, isRequired: false, transformFunction: null }, hasDivider: { classPropertyName: "hasDivider", publicName: "hasDivider", isSignal: true, isRequired: false, transformFunction: null }, buttonsOther: { classPropertyName: "buttonsOther", publicName: "buttonsOther", isSignal: true, isRequired: false, transformFunction: null }, hasButtonUnSelectOption: { classPropertyName: "hasButtonUnSelectOption", publicName: "hasButtonUnSelectOption", isSignal: true, isRequired: false, transformFunction: null }, clickExactly: { classPropertyName: "clickExactly", publicName: "clickExactly", isSignal: true, isRequired: false, transformFunction: null }, backgroundListCustom: { classPropertyName: "backgroundListCustom", publicName: "backgroundListCustom", isSignal: true, isRequired: false, transformFunction: null }, maxItemShow: { classPropertyName: "maxItemShow", publicName: "maxItemShow", isSignal: true, isRequired: false, transformFunction: null }, keySelected: { classPropertyName: "keySelected", publicName: "keySelected", isSignal: true, isRequired: false, transformFunction: null }, multiKeySelected: { classPropertyName: "multiKeySelected", publicName: "multiKeySelected", isSignal: true, isRequired: false, transformFunction: null }, keysDisableItem: { classPropertyName: "keysDisableItem", publicName: "keysDisableItem", isSignal: true, isRequired: false, transformFunction: null }, keysHiddenItem: { classPropertyName: "keysHiddenItem", publicName: "keysHiddenItem", isSignal: true, isRequired: false, transformFunction: null }, focusInputSearch: { classPropertyName: "focusInputSearch", publicName: "focusInputSearch", isSignal: true, isRequired: false, transformFunction: null }, skipFocusInputWhenKeySearchStoreUndefined: { classPropertyName: "skipFocusInputWhenKeySearchStoreUndefined", publicName: "skipFocusInputWhenKeySearchStoreUndefined", isSignal: true, isRequired: false, transformFunction: null }, functionGetItemsAutoAddList: { classPropertyName: "functionGetItemsAutoAddList", publicName: "functionGetItemsAutoAddList", isSignal: true, isRequired: false, transformFunction: null }, validRequired: { classPropertyName: "validRequired", publicName: "validRequired", isSignal: true, isRequired: false, transformFunction: null }, showValidateBottom: { classPropertyName: "showValidateBottom", publicName: "showValidateBottom", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, loadingIconSize: { classPropertyName: "loadingIconSize", publicName: "loadingIconSize", isSignal: true, isRequired: false, transformFunction: null }, templateRefSearchNoData: { classPropertyName: "templateRefSearchNoData", publicName: "templateRefSearchNoData", isSignal: true, isRequired: false, transformFunction: null }, resetKeyWhenSelectAllKeyDropdown: { classPropertyName: "resetKeyWhenSelectAllKeyDropdown", publicName: "resetKeyWhenSelectAllKeyDropdown", isSignal: true, isRequired: false, transformFunction: null }, ignoreClassDisableDefaultWhenUseKeysDisableItem: { classPropertyName: "ignoreClassDisableDefaultWhenUseKeysDisableItem", publicName: "ignoreClassDisableDefaultWhenUseKeysDisableItem", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outSelectKey: "outSelectKey", outSelectMultiKey: "outSelectMultiKey", outUnSelectMultiKey: "outUnSelectMultiKey", outClickButtonOther: "outClickButtonOther", outFieldKey: "outFieldKey", outChangeView: "outChangeView", outKeySearch: "outKeySearch", outLoading: "outLoading", outFunctionsControl: "outFunctionsControl", outChangStageFlagMousePopover: "outChangStageFlagMousePopover", outLoadItemsComplete: "outLoadItemsComplete" }, viewQueries: [{ propertyName: "listViewElementRef", first: true, predicate: ["listViewContainer"], descendants: true, isSignal: true }, { propertyName: "contentElementRef", first: true, predicate: ["contentContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n #listViewContainer\n class=\"flex flex-col\"\n [class.w-full]=\"!maxItemShow()\"\n [class.h-full]=\"!maxItemShow()\">\n @if (labelConfig(); as labelConfig) {\n <libs_ui-components-label\n [classInclude]=\"labelConfig.classInclude\"\n [labelLeft]=\"labelConfig.labelLeft\"\n [labelLeftClass]=\"labelConfig.labelLeftClass\"\n [required]=\"labelConfig.required\"\n [description]=\"labelConfig.description\"\n [descriptionClass]=\"labelConfig.descriptionClass\"\n [labelRight]=\"labelConfig.labelRight\"\n [labelRightClass]=\"labelConfig.labelRightClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [buttonsLeft]=\"labelConfig.buttonsLeft\"\n [buttonsRight]=\"labelConfig.buttonsRight\"\n [disableButtonsLeft]=\"labelConfig.disableButtonsLeft || disable()\"\n [disableButtonsRight]=\"labelConfig.disableButtonsRight || disable()\"\n [hasToggle]=\"labelConfig.hasToggle\"\n [toggleActive]=\"labelConfig.toggleActive\"\n [toggleDisable]=\"labelConfig.toggleDisable || loading() || disable()\"\n [popover]=\"labelConfig.popover\"\n [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [limitLength]=\"labelConfig.limitLength\"\n [buttonsDescription]=\"labelConfig.buttonsDescription\"\n [disableButtonsDescription]=\"labelConfig.disableButtonsDescription || disable()\"\n [buttonsDescriptionContainerClass]=\"labelConfig.buttonsDescriptionContainerClass\"\n [count]=\"labelConfig.count\" />\n }\n\n @if (!showValidateBottom()) {\n <ng-container *ngTemplateOutlet=\"templateValidate\" />\n }\n @if (!hiddenInputSearch()) {\n <libs_ui-components-inputs-search\n [searchConfig]=\"searchConfig()\"\n [class.px-[12px]]=\"searchPadding()\"\n [class]=\"searchConfig().classCoverInputSearch\"\n [disable]=\"disable() || loading() || false\"\n (outSearch)=\"handlerSearch($event)\"\n (outFunctionsControl)=\"handlerFunctionControlInputSearch($event)\" />\n }\n @if (config()?.configDescriptionGroup?.(); as description) {\n <div [class]=\"description?.classInclude\">\n <libs_ui-components-popover [config]=\"description?.tooltipDescription()\">\n <div [class]=\"description?.classTextDescriptionInclude\">{{ description.textDescription }}</div>\n </libs_ui-components-popover>\n </div>\n }\n @if (!hiddenInputSearch() && hasDivider() && (!config()?.ignoreShowDataWhenNotSearch || keySearchStore())) {\n <div\n class=\"libs-ui-border-top-general {{ dividerClassInclude() ? dividerClassInclude() : '' }}\"\n [class.libs-ui-divider-default]=\"!!searchPadding() && !dividerClassInclude()\"></div>\n }\n <div class=\"flex flex-col {{ config()?.ignoreShowDataWhenNotSearch && keySearchStore() && !config()?.ignoreFixHeightShowDataWhenNotSearch ? 'h-[353px]' : 'h-full' }}\">\n <div\n #contentContainer\n class=\"w-full h-full {{ backgroundListCustom() }}\"\n [class.libs-ui-disable]=\"disable() && disableLabel()\"\n [class.pointer-events-none]=\"disable() && disableLabel()\"></div>\n\n @for (buttonOther of buttonsOther(); track $index) {\n <div\n class=\"bg-[#ffffff] libs-ui-border-top-general\"\n [class.rounded-b-[4px]]=\"$last && !hasButtonUnSelectOption()\">\n <libs_ui-components-buttons-button\n [type]=\"buttonOther.type || 'button-link-primary'\"\n [label]=\"buttonOther.label || ' '\"\n [classIconLeft]=\"(buttonOther.classIconLeft || '') + ' flex mr-[8px] text-[16px]'\"\n classInclude=\"w-full text-left rounded-0 {{ buttonOther.classInclude ? buttonOther.classInclude : '' }}\"\n classLabel=\"libs-ui-font-h5r whitespace-normal\"\n [disable]=\"buttonOther.disable || disable() || loading() || false\"\n (outClick)=\"handlerClickButtonOther(buttonOther)\" />\n </div>\n }\n @if (hasButtonUnSelectOption()) {\n <div class=\"bg-[#ffffff] rounded-b-[4px] libs-ui-border-top-general\">\n <libs_ui-components-buttons-button\n label=\"i18n_unselect_option\"\n type=\"button-link-danger-high\"\n classIconLeft=\"flex mr-[8px] libs-ui-icon-close\"\n classInclude=\"w-full text-left rounded-0\"\n classLabel=\"libs-ui-font-h5r whitespace-normal\"\n [disable]=\"disableButtonUnSelectOption() || disable() || loading() || false\"\n (outClick)=\"handlerRemoveKeySelected()\" />\n </div>\n }\n </div>\n @if (showValidateBottom()) {\n <ng-container *ngTemplateOutlet=\"templateValidate\" />\n }\n</div>\n\n<ng-template #templateValidate>\n @if (isErrorRequired()) {\n <div\n [class.mb-[8px]]=\"!showValidateBottom()\"\n [class.mt-[8px]]=\"showValidateBottom()\">\n <span\n class=\"libs-ui-text-error libs-ui-font-h7r\"\n [innerHtml]=\"validRequired()?.message || ERROR_MESSAGE_EMPTY_VALID | translate: validRequired()?.interpolateParams\"></span>\n </div>\n }\n</ng-template>\n", styles: [":host{background-color:#fff}:host ::ng-deep .libs-ui-list-highlight-text-search{background-color:#ffdb80;border-radius:2px;display:inline-block;overflow:unset}.libs-ui-divider-default{width:calc(100% - 24px);margin:12px auto 0}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsLabelComponent, selector: "libs_ui-components-label", inputs: ["iconPopoverClass", "classInclude", "labelLeft", "labelLeftClass", "labelLeftBehindToggleButton", "popover", "required", "buttonsLeft", "disableButtonsLeft", "buttonsRight", "disableButtonsRight", "labelRight", "labelRightClass", "labelRightRequired", "hasToggle", "toggleSize", "toggleActive", "toggleDisable", "description", "descriptionClass", "buttonsDescription", "disableButtonsDescription", "buttonsDescriptionContainerClass", "onlyShowCount", "zIndexPopover", "timerDestroyPopover", "count", "limitLength"], outputs: ["outClickButton", "outSwitchEvent", "outLabelRightClick", "outLabelLeftClick"] }, { kind: "component", type: LibsUiComponentsInputsSearchComponent, selector: "libs_ui-components-inputs-search", inputs: ["disable", "readonly", "searchConfig", "ignoreAutoComplete", "debounceTime", "ignoreStopPropagationEvent", "focusTimeOut", "blurTimeOut"], outputs: ["outSearch", "outValueChange", "outIconLeft", "outIconRight", "outFocusAndBlur", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: 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", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2743
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsListComponent, isStandalone: true, selector: "libs_ui-components-list", inputs: { hiddenInputSearch: { classPropertyName: "hiddenInputSearch", publicName: "hiddenInputSearch", isSignal: true, isRequired: false, transformFunction: null }, dropdownTabKeyActive: { classPropertyName: "dropdownTabKeyActive", publicName: "dropdownTabKeyActive", isSignal: true, isRequired: false, transformFunction: null }, keySearch: { classPropertyName: "keySearch", publicName: "keySearch", isSignal: true, isRequired: false, transformFunction: null }, paddingLeftItem: { classPropertyName: "paddingLeftItem", publicName: "paddingLeftItem", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, autoSelectedFirstItemCallOutsideBefore: { classPropertyName: "autoSelectedFirstItemCallOutsideBefore", publicName: "autoSelectedFirstItemCallOutsideBefore", isSignal: true, isRequired: false, transformFunction: null }, isSearchOnline: { classPropertyName: "isSearchOnline", publicName: "isSearchOnline", 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 }, labelConfig: { classPropertyName: "labelConfig", publicName: "labelConfig", isSignal: true, isRequired: false, transformFunction: null }, searchConfig: { classPropertyName: "searchConfig", publicName: "searchConfig", isSignal: true, isRequired: false, transformFunction: null }, searchPadding: { classPropertyName: "searchPadding", publicName: "searchPadding", isSignal: true, isRequired: false, transformFunction: null }, dividerClassInclude: { classPropertyName: "dividerClassInclude", publicName: "dividerClassInclude", isSignal: true, isRequired: false, transformFunction: null }, hasDivider: { classPropertyName: "hasDivider", publicName: "hasDivider", isSignal: true, isRequired: false, transformFunction: null }, buttonsOther: { classPropertyName: "buttonsOther", publicName: "buttonsOther", isSignal: true, isRequired: false, transformFunction: null }, hasButtonUnSelectOption: { classPropertyName: "hasButtonUnSelectOption", publicName: "hasButtonUnSelectOption", isSignal: true, isRequired: false, transformFunction: null }, clickExactly: { classPropertyName: "clickExactly", publicName: "clickExactly", isSignal: true, isRequired: false, transformFunction: null }, backgroundListCustom: { classPropertyName: "backgroundListCustom", publicName: "backgroundListCustom", isSignal: true, isRequired: false, transformFunction: null }, maxItemShow: { classPropertyName: "maxItemShow", publicName: "maxItemShow", isSignal: true, isRequired: false, transformFunction: null }, keySelected: { classPropertyName: "keySelected", publicName: "keySelected", isSignal: true, isRequired: false, transformFunction: null }, multiKeySelected: { classPropertyName: "multiKeySelected", publicName: "multiKeySelected", isSignal: true, isRequired: false, transformFunction: null }, keysDisableItem: { classPropertyName: "keysDisableItem", publicName: "keysDisableItem", isSignal: true, isRequired: false, transformFunction: null }, keysHiddenItem: { classPropertyName: "keysHiddenItem", publicName: "keysHiddenItem", isSignal: true, isRequired: false, transformFunction: null }, focusInputSearch: { classPropertyName: "focusInputSearch", publicName: "focusInputSearch", isSignal: true, isRequired: false, transformFunction: null }, skipFocusInputWhenKeySearchStoreUndefined: { classPropertyName: "skipFocusInputWhenKeySearchStoreUndefined", publicName: "skipFocusInputWhenKeySearchStoreUndefined", isSignal: true, isRequired: false, transformFunction: null }, functionGetItemsAutoAddList: { classPropertyName: "functionGetItemsAutoAddList", publicName: "functionGetItemsAutoAddList", isSignal: true, isRequired: false, transformFunction: null }, validRequired: { classPropertyName: "validRequired", publicName: "validRequired", isSignal: true, isRequired: false, transformFunction: null }, showValidateBottom: { classPropertyName: "showValidateBottom", publicName: "showValidateBottom", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, loadingIconSize: { classPropertyName: "loadingIconSize", publicName: "loadingIconSize", isSignal: true, isRequired: false, transformFunction: null }, templateRefSearchNoData: { classPropertyName: "templateRefSearchNoData", publicName: "templateRefSearchNoData", isSignal: true, isRequired: false, transformFunction: null }, resetKeyWhenSelectAllKeyDropdown: { classPropertyName: "resetKeyWhenSelectAllKeyDropdown", publicName: "resetKeyWhenSelectAllKeyDropdown", isSignal: true, isRequired: false, transformFunction: null }, ignoreClassDisableDefaultWhenUseKeysDisableItem: { classPropertyName: "ignoreClassDisableDefaultWhenUseKeysDisableItem", publicName: "ignoreClassDisableDefaultWhenUseKeysDisableItem", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outSelectKey: "outSelectKey", outSelectMultiKey: "outSelectMultiKey", outUnSelectMultiKey: "outUnSelectMultiKey", outClickButtonOther: "outClickButtonOther", outFieldKey: "outFieldKey", outChangeView: "outChangeView", outKeySearch: "outKeySearch", outLoading: "outLoading", outFunctionsControl: "outFunctionsControl", outChangStageFlagMousePopover: "outChangStageFlagMousePopover", outLoadItemsComplete: "outLoadItemsComplete" }, viewQueries: [{ propertyName: "listViewElementRef", first: true, predicate: ["listViewContainer"], descendants: true, isSignal: true }, { propertyName: "contentElementRef", first: true, predicate: ["contentContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n #listViewContainer\n class=\"flex flex-col\"\n [class.w-full]=\"!maxItemShow()\"\n [class.h-full]=\"!maxItemShow()\">\n @if (labelConfig(); as labelConfig) {\n <libs_ui-components-label\n [classInclude]=\"labelConfig.classInclude\"\n [labelLeft]=\"labelConfig.labelLeft\"\n [labelLeftClass]=\"labelConfig.labelLeftClass\"\n [required]=\"labelConfig.required\"\n [description]=\"labelConfig.description\"\n [descriptionClass]=\"labelConfig.descriptionClass\"\n [labelRight]=\"labelConfig.labelRight\"\n [labelRightClass]=\"labelConfig.labelRightClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [buttonsLeft]=\"labelConfig.buttonsLeft\"\n [buttonsRight]=\"labelConfig.buttonsRight\"\n [disableButtonsLeft]=\"labelConfig.disableButtonsLeft || disable()\"\n [disableButtonsRight]=\"labelConfig.disableButtonsRight || disable()\"\n [hasToggle]=\"labelConfig.hasToggle\"\n [toggleActive]=\"labelConfig.toggleActive\"\n [toggleDisable]=\"labelConfig.toggleDisable || loading() || disable()\"\n [popover]=\"labelConfig.popover\"\n [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [limitLength]=\"labelConfig.limitLength\"\n [buttonsDescription]=\"labelConfig.buttonsDescription\"\n [disableButtonsDescription]=\"labelConfig.disableButtonsDescription || disable()\"\n [buttonsDescriptionContainerClass]=\"labelConfig.buttonsDescriptionContainerClass\"\n [count]=\"labelConfig.count\" />\n }\n\n @if (!showValidateBottom()) {\n <ng-container *ngTemplateOutlet=\"templateValidate\" />\n }\n @if (!hiddenInputSearch()) {\n <libs_ui-components-inputs-search\n [searchConfig]=\"searchConfig()\"\n [class.px-[12px]]=\"searchPadding()\"\n [class]=\"searchConfig().classCoverInputSearch\"\n [disable]=\"disable() || loading() || false\"\n (outSearch)=\"handlerSearch($event)\"\n (outFunctionsControl)=\"handlerFunctionControlInputSearch($event)\" />\n }\n @if (config()?.configDescriptionGroup?.(); as description) {\n <div [class]=\"description?.classInclude\">\n <libs_ui-components-popover [config]=\"description?.tooltipDescription()\">\n <div [class]=\"description?.classTextDescriptionInclude\">{{ description.textDescription }}</div>\n </libs_ui-components-popover>\n </div>\n }\n @if (!hiddenInputSearch() && hasDivider() && (!config()?.ignoreShowDataWhenNotSearch || keySearchStore())) {\n <div\n class=\"libs-ui-border-top-general {{ dividerClassInclude() ? dividerClassInclude() : '' }}\"\n [class.libs-ui-divider-default]=\"!!searchPadding() && !dividerClassInclude()\"></div>\n }\n <div class=\"flex flex-col {{ config()?.ignoreShowDataWhenNotSearch && keySearchStore() && !config()?.ignoreFixHeightShowDataWhenNotSearch ? 'h-[353px]' : 'h-full' }}\">\n <div\n #contentContainer\n class=\"w-full h-full {{ backgroundListCustom() }}\"\n [class.libs-ui-disable]=\"disable() && disableLabel()\"\n [class.pointer-events-none]=\"disable() && disableLabel()\"></div>\n\n @for (buttonOther of buttonsOther(); track $index) {\n <div\n class=\"bg-[#ffffff] libs-ui-border-top-general\"\n [class.rounded-b-[4px]]=\"$last && !hasButtonUnSelectOption()\">\n <libs_ui-components-buttons-button\n [type]=\"buttonOther.type || 'button-link-primary'\"\n [label]=\"buttonOther.label || ' '\"\n [classIconLeft]=\"(buttonOther.classIconLeft || '') + ' flex mr-[8px] text-[16px]'\"\n classInclude=\"w-full text-left rounded-0 {{ buttonOther.classInclude ? buttonOther.classInclude : '' }}\"\n classLabel=\"libs-ui-font-h5r whitespace-normal\"\n [disable]=\"buttonOther.disable || disable() || loading() || false\"\n (outClick)=\"handlerClickButtonOther(buttonOther)\" />\n </div>\n }\n @if (hasButtonUnSelectOption()) {\n <div class=\"bg-[#ffffff] rounded-b-[4px] libs-ui-border-top-general\">\n <libs_ui-components-buttons-button\n label=\"i18n_unselect_option\"\n type=\"button-link-danger-high\"\n classIconLeft=\"flex mr-[8px] libs-ui-icon-close\"\n classInclude=\"w-full text-left rounded-0\"\n classLabel=\"libs-ui-font-h5r whitespace-normal\"\n [disable]=\"disableButtonUnSelectOption() || disable() || loading() || false\"\n (outClick)=\"handlerRemoveKeySelected()\" />\n </div>\n }\n </div>\n @if (showValidateBottom()) {\n <ng-container *ngTemplateOutlet=\"templateValidate\" />\n }\n</div>\n\n<ng-template #templateValidate>\n @if (isErrorRequired()) {\n <div\n [class.mb-[8px]]=\"!showValidateBottom()\"\n [class.mt-[8px]]=\"showValidateBottom()\">\n @let constHtmlMessage = validRequired()?.message || ERROR_MESSAGE_EMPTY_VALID;\n <span\n class=\"libs-ui-text-error libs-ui-font-h7r\"\n [innerHtml]=\"constHtmlMessage | translate: validRequired()?.interpolateParams\"></span>\n </div>\n }\n</ng-template>\n", styles: [":host{background-color:#fff}:host ::ng-deep .libs-ui-list-highlight-text-search{background-color:#ffdb80;border-radius:2px;display:inline-block;overflow:unset}.libs-ui-divider-default{width:calc(100% - 24px);margin:12px auto 0}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsLabelComponent, selector: "libs_ui-components-label", inputs: ["iconPopoverClass", "classInclude", "labelLeft", "labelLeftClass", "labelLeftBehindToggleButton", "popover", "required", "buttonsLeft", "disableButtonsLeft", "buttonsRight", "disableButtonsRight", "labelRight", "labelRightClass", "labelRightRequired", "hasToggle", "toggleSize", "toggleActive", "toggleDisable", "description", "descriptionClass", "buttonsDescription", "disableButtonsDescription", "buttonsDescriptionContainerClass", "onlyShowCount", "zIndexPopover", "timerDestroyPopover", "count", "limitLength"], outputs: ["outClickButton", "outSwitchEvent", "outLabelRightClick", "outLabelLeftClick"] }, { kind: "component", type: LibsUiComponentsInputsSearchComponent, selector: "libs_ui-components-inputs-search", inputs: ["disable", "readonly", "searchConfig", "ignoreAutoComplete", "debounceTime", "ignoreStopPropagationEvent", "focusTimeOut", "blurTimeOut"], outputs: ["outSearch", "outValueChange", "outIconLeft", "outIconRight", "outFocusAndBlur", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: 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", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2744
2744
|
}
|
|
2745
2745
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsListComponent, decorators: [{
|
|
2746
2746
|
type: Component,
|
|
2747
|
-
args: [{ selector: 'libs_ui-components-list', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, TranslateModule, LibsUiComponentsLabelComponent, LibsUiComponentsInputsSearchComponent, LibsUiComponentsPopoverComponent, LibsUiComponentsButtonsButtonComponent], template: "<div\n #listViewContainer\n class=\"flex flex-col\"\n [class.w-full]=\"!maxItemShow()\"\n [class.h-full]=\"!maxItemShow()\">\n @if (labelConfig(); as labelConfig) {\n <libs_ui-components-label\n [classInclude]=\"labelConfig.classInclude\"\n [labelLeft]=\"labelConfig.labelLeft\"\n [labelLeftClass]=\"labelConfig.labelLeftClass\"\n [required]=\"labelConfig.required\"\n [description]=\"labelConfig.description\"\n [descriptionClass]=\"labelConfig.descriptionClass\"\n [labelRight]=\"labelConfig.labelRight\"\n [labelRightClass]=\"labelConfig.labelRightClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [buttonsLeft]=\"labelConfig.buttonsLeft\"\n [buttonsRight]=\"labelConfig.buttonsRight\"\n [disableButtonsLeft]=\"labelConfig.disableButtonsLeft || disable()\"\n [disableButtonsRight]=\"labelConfig.disableButtonsRight || disable()\"\n [hasToggle]=\"labelConfig.hasToggle\"\n [toggleActive]=\"labelConfig.toggleActive\"\n [toggleDisable]=\"labelConfig.toggleDisable || loading() || disable()\"\n [popover]=\"labelConfig.popover\"\n [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [limitLength]=\"labelConfig.limitLength\"\n [buttonsDescription]=\"labelConfig.buttonsDescription\"\n [disableButtonsDescription]=\"labelConfig.disableButtonsDescription || disable()\"\n [buttonsDescriptionContainerClass]=\"labelConfig.buttonsDescriptionContainerClass\"\n [count]=\"labelConfig.count\" />\n }\n\n @if (!showValidateBottom()) {\n <ng-container *ngTemplateOutlet=\"templateValidate\" />\n }\n @if (!hiddenInputSearch()) {\n <libs_ui-components-inputs-search\n [searchConfig]=\"searchConfig()\"\n [class.px-[12px]]=\"searchPadding()\"\n [class]=\"searchConfig().classCoverInputSearch\"\n [disable]=\"disable() || loading() || false\"\n (outSearch)=\"handlerSearch($event)\"\n (outFunctionsControl)=\"handlerFunctionControlInputSearch($event)\" />\n }\n @if (config()?.configDescriptionGroup?.(); as description) {\n <div [class]=\"description?.classInclude\">\n <libs_ui-components-popover [config]=\"description?.tooltipDescription()\">\n <div [class]=\"description?.classTextDescriptionInclude\">{{ description.textDescription }}</div>\n </libs_ui-components-popover>\n </div>\n }\n @if (!hiddenInputSearch() && hasDivider() && (!config()?.ignoreShowDataWhenNotSearch || keySearchStore())) {\n <div\n class=\"libs-ui-border-top-general {{ dividerClassInclude() ? dividerClassInclude() : '' }}\"\n [class.libs-ui-divider-default]=\"!!searchPadding() && !dividerClassInclude()\"></div>\n }\n <div class=\"flex flex-col {{ config()?.ignoreShowDataWhenNotSearch && keySearchStore() && !config()?.ignoreFixHeightShowDataWhenNotSearch ? 'h-[353px]' : 'h-full' }}\">\n <div\n #contentContainer\n class=\"w-full h-full {{ backgroundListCustom() }}\"\n [class.libs-ui-disable]=\"disable() && disableLabel()\"\n [class.pointer-events-none]=\"disable() && disableLabel()\"></div>\n\n @for (buttonOther of buttonsOther(); track $index) {\n <div\n class=\"bg-[#ffffff] libs-ui-border-top-general\"\n [class.rounded-b-[4px]]=\"$last && !hasButtonUnSelectOption()\">\n <libs_ui-components-buttons-button\n [type]=\"buttonOther.type || 'button-link-primary'\"\n [label]=\"buttonOther.label || ' '\"\n [classIconLeft]=\"(buttonOther.classIconLeft || '') + ' flex mr-[8px] text-[16px]'\"\n classInclude=\"w-full text-left rounded-0 {{ buttonOther.classInclude ? buttonOther.classInclude : '' }}\"\n classLabel=\"libs-ui-font-h5r whitespace-normal\"\n [disable]=\"buttonOther.disable || disable() || loading() || false\"\n (outClick)=\"handlerClickButtonOther(buttonOther)\" />\n </div>\n }\n @if (hasButtonUnSelectOption()) {\n <div class=\"bg-[#ffffff] rounded-b-[4px] libs-ui-border-top-general\">\n <libs_ui-components-buttons-button\n label=\"i18n_unselect_option\"\n type=\"button-link-danger-high\"\n classIconLeft=\"flex mr-[8px] libs-ui-icon-close\"\n classInclude=\"w-full text-left rounded-0\"\n classLabel=\"libs-ui-font-h5r whitespace-normal\"\n [disable]=\"disableButtonUnSelectOption() || disable() || loading() || false\"\n (outClick)=\"handlerRemoveKeySelected()\" />\n </div>\n }\n </div>\n @if (showValidateBottom()) {\n <ng-container *ngTemplateOutlet=\"templateValidate\" />\n }\n</div>\n\n<ng-template #templateValidate>\n @if (isErrorRequired()) {\n <div\n [class.mb-[8px]]=\"!showValidateBottom()\"\n [class.mt-[8px]]=\"showValidateBottom()\">\n <span\n class=\"libs-ui-text-error libs-ui-font-h7r\"\n [innerHtml]=\"
|
|
2747
|
+
args: [{ selector: 'libs_ui-components-list', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, TranslateModule, LibsUiComponentsLabelComponent, LibsUiComponentsInputsSearchComponent, LibsUiComponentsPopoverComponent, LibsUiComponentsButtonsButtonComponent], template: "<div\n #listViewContainer\n class=\"flex flex-col\"\n [class.w-full]=\"!maxItemShow()\"\n [class.h-full]=\"!maxItemShow()\">\n @if (labelConfig(); as labelConfig) {\n <libs_ui-components-label\n [classInclude]=\"labelConfig.classInclude\"\n [labelLeft]=\"labelConfig.labelLeft\"\n [labelLeftClass]=\"labelConfig.labelLeftClass\"\n [required]=\"labelConfig.required\"\n [description]=\"labelConfig.description\"\n [descriptionClass]=\"labelConfig.descriptionClass\"\n [labelRight]=\"labelConfig.labelRight\"\n [labelRightClass]=\"labelConfig.labelRightClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [buttonsLeft]=\"labelConfig.buttonsLeft\"\n [buttonsRight]=\"labelConfig.buttonsRight\"\n [disableButtonsLeft]=\"labelConfig.disableButtonsLeft || disable()\"\n [disableButtonsRight]=\"labelConfig.disableButtonsRight || disable()\"\n [hasToggle]=\"labelConfig.hasToggle\"\n [toggleActive]=\"labelConfig.toggleActive\"\n [toggleDisable]=\"labelConfig.toggleDisable || loading() || disable()\"\n [popover]=\"labelConfig.popover\"\n [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [limitLength]=\"labelConfig.limitLength\"\n [buttonsDescription]=\"labelConfig.buttonsDescription\"\n [disableButtonsDescription]=\"labelConfig.disableButtonsDescription || disable()\"\n [buttonsDescriptionContainerClass]=\"labelConfig.buttonsDescriptionContainerClass\"\n [count]=\"labelConfig.count\" />\n }\n\n @if (!showValidateBottom()) {\n <ng-container *ngTemplateOutlet=\"templateValidate\" />\n }\n @if (!hiddenInputSearch()) {\n <libs_ui-components-inputs-search\n [searchConfig]=\"searchConfig()\"\n [class.px-[12px]]=\"searchPadding()\"\n [class]=\"searchConfig().classCoverInputSearch\"\n [disable]=\"disable() || loading() || false\"\n (outSearch)=\"handlerSearch($event)\"\n (outFunctionsControl)=\"handlerFunctionControlInputSearch($event)\" />\n }\n @if (config()?.configDescriptionGroup?.(); as description) {\n <div [class]=\"description?.classInclude\">\n <libs_ui-components-popover [config]=\"description?.tooltipDescription()\">\n <div [class]=\"description?.classTextDescriptionInclude\">{{ description.textDescription }}</div>\n </libs_ui-components-popover>\n </div>\n }\n @if (!hiddenInputSearch() && hasDivider() && (!config()?.ignoreShowDataWhenNotSearch || keySearchStore())) {\n <div\n class=\"libs-ui-border-top-general {{ dividerClassInclude() ? dividerClassInclude() : '' }}\"\n [class.libs-ui-divider-default]=\"!!searchPadding() && !dividerClassInclude()\"></div>\n }\n <div class=\"flex flex-col {{ config()?.ignoreShowDataWhenNotSearch && keySearchStore() && !config()?.ignoreFixHeightShowDataWhenNotSearch ? 'h-[353px]' : 'h-full' }}\">\n <div\n #contentContainer\n class=\"w-full h-full {{ backgroundListCustom() }}\"\n [class.libs-ui-disable]=\"disable() && disableLabel()\"\n [class.pointer-events-none]=\"disable() && disableLabel()\"></div>\n\n @for (buttonOther of buttonsOther(); track $index) {\n <div\n class=\"bg-[#ffffff] libs-ui-border-top-general\"\n [class.rounded-b-[4px]]=\"$last && !hasButtonUnSelectOption()\">\n <libs_ui-components-buttons-button\n [type]=\"buttonOther.type || 'button-link-primary'\"\n [label]=\"buttonOther.label || ' '\"\n [classIconLeft]=\"(buttonOther.classIconLeft || '') + ' flex mr-[8px] text-[16px]'\"\n classInclude=\"w-full text-left rounded-0 {{ buttonOther.classInclude ? buttonOther.classInclude : '' }}\"\n classLabel=\"libs-ui-font-h5r whitespace-normal\"\n [disable]=\"buttonOther.disable || disable() || loading() || false\"\n (outClick)=\"handlerClickButtonOther(buttonOther)\" />\n </div>\n }\n @if (hasButtonUnSelectOption()) {\n <div class=\"bg-[#ffffff] rounded-b-[4px] libs-ui-border-top-general\">\n <libs_ui-components-buttons-button\n label=\"i18n_unselect_option\"\n type=\"button-link-danger-high\"\n classIconLeft=\"flex mr-[8px] libs-ui-icon-close\"\n classInclude=\"w-full text-left rounded-0\"\n classLabel=\"libs-ui-font-h5r whitespace-normal\"\n [disable]=\"disableButtonUnSelectOption() || disable() || loading() || false\"\n (outClick)=\"handlerRemoveKeySelected()\" />\n </div>\n }\n </div>\n @if (showValidateBottom()) {\n <ng-container *ngTemplateOutlet=\"templateValidate\" />\n }\n</div>\n\n<ng-template #templateValidate>\n @if (isErrorRequired()) {\n <div\n [class.mb-[8px]]=\"!showValidateBottom()\"\n [class.mt-[8px]]=\"showValidateBottom()\">\n @let constHtmlMessage = validRequired()?.message || ERROR_MESSAGE_EMPTY_VALID;\n <span\n class=\"libs-ui-text-error libs-ui-font-h7r\"\n [innerHtml]=\"constHtmlMessage | translate: validRequired()?.interpolateParams\"></span>\n </div>\n }\n</ng-template>\n", styles: [":host{background-color:#fff}:host ::ng-deep .libs-ui-list-highlight-text-search{background-color:#ffdb80;border-radius:2px;display:inline-block;overflow:unset}.libs-ui-divider-default{width:calc(100% - 24px);margin:12px auto 0}\n"] }]
|
|
2748
2748
|
}], ctorParameters: () => [] });
|
|
2749
2749
|
|
|
2750
2750
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|