@libs-ui/components-label 0.2.312-0 → 0.2.312-2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -63,10 +63,10 @@ export class LibsUiComponentsLabelComponent {
|
|
|
63
63
|
event.stopPropagation();
|
|
64
64
|
this.outLabelLeftClick.emit(event);
|
|
65
65
|
}
|
|
66
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
67
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsLabelComponent, isStandalone: true, selector: "libs_ui-components-label", inputs: { iconPopoverClass: { classPropertyName: "iconPopoverClass", publicName: "iconPopoverClass", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, labelLeft: { classPropertyName: "labelLeft", publicName: "labelLeft", isSignal: true, isRequired: false, transformFunction: null }, labelLeftClass: { classPropertyName: "labelLeftClass", publicName: "labelLeftClass", isSignal: true, isRequired: false, transformFunction: null }, labelLeftBehindToggleButton: { classPropertyName: "labelLeftBehindToggleButton", publicName: "labelLeftBehindToggleButton", isSignal: true, isRequired: false, transformFunction: null }, popover: { classPropertyName: "popover", publicName: "popover", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, buttonsLeft: { classPropertyName: "buttonsLeft", publicName: "buttonsLeft", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsLeft: { classPropertyName: "disableButtonsLeft", publicName: "disableButtonsLeft", isSignal: true, isRequired: false, transformFunction: null }, buttonsRight: { classPropertyName: "buttonsRight", publicName: "buttonsRight", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsRight: { classPropertyName: "disableButtonsRight", publicName: "disableButtonsRight", isSignal: true, isRequired: false, transformFunction: null }, labelRight: { classPropertyName: "labelRight", publicName: "labelRight", isSignal: true, isRequired: false, transformFunction: null }, labelRightClass: { classPropertyName: "labelRightClass", publicName: "labelRightClass", isSignal: true, isRequired: false, transformFunction: null }, labelRightRequired: { classPropertyName: "labelRightRequired", publicName: "labelRightRequired", isSignal: true, isRequired: false, transformFunction: null }, hasToggle: { classPropertyName: "hasToggle", publicName: "hasToggle", isSignal: true, isRequired: false, transformFunction: null }, toggleSize: { classPropertyName: "toggleSize", publicName: "toggleSize", isSignal: true, isRequired: false, transformFunction: null }, toggleActive: { classPropertyName: "toggleActive", publicName: "toggleActive", isSignal: true, isRequired: false, transformFunction: null }, toggleDisable: { classPropertyName: "toggleDisable", publicName: "toggleDisable", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, descriptionClass: { classPropertyName: "descriptionClass", publicName: "descriptionClass", isSignal: true, isRequired: false, transformFunction: null }, buttonsDescription: { classPropertyName: "buttonsDescription", publicName: "buttonsDescription", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsDescription: { classPropertyName: "disableButtonsDescription", publicName: "disableButtonsDescription", isSignal: true, isRequired: false, transformFunction: null }, buttonsDescriptionContainerClass: { classPropertyName: "buttonsDescriptionContainerClass", publicName: "buttonsDescriptionContainerClass", isSignal: true, isRequired: false, transformFunction: null }, onlyShowCount: { classPropertyName: "onlyShowCount", publicName: "onlyShowCount", isSignal: true, isRequired: false, transformFunction: null }, zIndexPopover: { classPropertyName: "zIndexPopover", publicName: "zIndexPopover", isSignal: true, isRequired: false, transformFunction: null }, timerDestroyPopover: { classPropertyName: "timerDestroyPopover", publicName: "timerDestroyPopover", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, limitLength: { classPropertyName: "limitLength", publicName: "limitLength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outClickButton: "outClickButton", outSwitchEvent: "outSwitchEvent", outLabelRightClick: "outLabelRightClick", outLabelLeftClick: "outLabelLeftClick" }, ngImport: i0, template: "<div\n [class]=\"classInclude()\"\n [class.mb-[4px]]=\"description()\"\n [class.mb-[8px]]=\"!description()\">\n <div\n class=\"libs-ui-label-left\"\n [style.maxWidth.%]=\"labelRight() || limitLength() || onlyShowCount() ? 70 : 100\">\n @if (hasToggle() && labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [size]=\"toggleSize()\"\n [disable]=\"toggleDisable()\"\n [class]=\"'mr-[8px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n @if (labelLeft()) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"{ zIndex: zIndexPopover(), timerDestroy: timerDestroyPopover() }\"\n [innerHtml]=\"labelLeft() || ' ' | translate\"\n [classInclude]=\"labelLeftClass()\"\n (click)=\"handlerEventLabelLeft($event)\" />\n }\n @if (required() && labelLeft()) {\n <i class=\"flex libs-ui-icon-asterisk before:!text-[#ee2d41] before:!text-[8px] pb-[4px] h-full\"></i>\n }\n @if (popover()?.config && popover()?.config?.content) {\n <libs_ui-components-popover\n classInclude=\"ml-[4px] {{ popover()?.classInclude }}\"\n [config]=\"popover()?.config\">\n <i [class]=\"iconPopoverClass()\"></i>\n </libs_ui-components-popover>\n }\n @for (button of buttonsLeft(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsLeft() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (hasToggle() && !labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [disable]=\"toggleDisable()\"\n [size]=\"toggleSize()\"\n [class]=\"'ml-[20px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n </div>\n\n <div class=\"libs-ui-label-right\">\n @if (labelRight(); as labelRight) {\n <libs_ui-components-popover\n type=\"text\"\n [innerHtml]=\"labelRight | translate\"\n [classInclude]=\"labelRightClass()\"\n (outEvent)=\"handlerEventLabelRight($event)\" />\n }\n @for (button of buttonsRight(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsRight() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [classLabel]=\"button.classLabel || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (limitLength() || onlyShowCount()) {\n <div class=\"flex items-center ml-[12px] text-[#9ca2ad] libs-ui-font-h7r\">\n <span>{{ countDisplay() }}</span>\n @if (limitLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n <span> {{ 'i18n_character' | translate }}</span>\n </div>\n }\n </div>\n</div>\n@if (description(); as description) {\n <div\n [class]=\"descriptionClass()\"\n [innerHtml]=\"description | translate\"></div>\n}\n@if (buttonsDescription()?.length) {\n <div [class]=\"buttonsDescriptionContainerClass()\">\n @for (button of buttonsDescription(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsDescription() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n [classLabel]=\"button.classLabel || ''\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n </div>\n}\n<ng-content select=\"div.libs-ui-custom-description\" />\n", styles: [".libs-ui-label{display:flex;justify-content:space-between;width:100%}.libs-ui-label .libs-ui-label-left{display:flex;align-items:center}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-text{color:#6a7383}.libs-ui-label .libs-ui-label-left libs_ui-components-button{margin-left:12px}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-optional{margin-left:0;font-size:10px!important;color:#9ca2ad;line-height:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.libs-ui-label .libs-ui-label-right{display:flex;align-items:center;justify-content:flex-end}.libs-ui-label .libs-ui-label-right libs_ui-components-button{margin-left:12px}.libs-ui-label-description{color:#9ca2ad;margin-bottom:8px}.libs-ui-label-description-button{margin-bottom:4px}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { 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: LibsUiComponentsSwitchComponent, selector: "libs_ui-components-switch", inputs: ["size", "disable", "active"], outputs: ["activeChange", "outSwitch"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
66
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
67
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsLabelComponent, isStandalone: true, selector: "libs_ui-components-label", inputs: { iconPopoverClass: { classPropertyName: "iconPopoverClass", publicName: "iconPopoverClass", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, labelLeft: { classPropertyName: "labelLeft", publicName: "labelLeft", isSignal: true, isRequired: false, transformFunction: null }, labelLeftClass: { classPropertyName: "labelLeftClass", publicName: "labelLeftClass", isSignal: true, isRequired: false, transformFunction: null }, labelLeftBehindToggleButton: { classPropertyName: "labelLeftBehindToggleButton", publicName: "labelLeftBehindToggleButton", isSignal: true, isRequired: false, transformFunction: null }, popover: { classPropertyName: "popover", publicName: "popover", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, buttonsLeft: { classPropertyName: "buttonsLeft", publicName: "buttonsLeft", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsLeft: { classPropertyName: "disableButtonsLeft", publicName: "disableButtonsLeft", isSignal: true, isRequired: false, transformFunction: null }, buttonsRight: { classPropertyName: "buttonsRight", publicName: "buttonsRight", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsRight: { classPropertyName: "disableButtonsRight", publicName: "disableButtonsRight", isSignal: true, isRequired: false, transformFunction: null }, labelRight: { classPropertyName: "labelRight", publicName: "labelRight", isSignal: true, isRequired: false, transformFunction: null }, labelRightClass: { classPropertyName: "labelRightClass", publicName: "labelRightClass", isSignal: true, isRequired: false, transformFunction: null }, labelRightRequired: { classPropertyName: "labelRightRequired", publicName: "labelRightRequired", isSignal: true, isRequired: false, transformFunction: null }, hasToggle: { classPropertyName: "hasToggle", publicName: "hasToggle", isSignal: true, isRequired: false, transformFunction: null }, toggleSize: { classPropertyName: "toggleSize", publicName: "toggleSize", isSignal: true, isRequired: false, transformFunction: null }, toggleActive: { classPropertyName: "toggleActive", publicName: "toggleActive", isSignal: true, isRequired: false, transformFunction: null }, toggleDisable: { classPropertyName: "toggleDisable", publicName: "toggleDisable", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, descriptionClass: { classPropertyName: "descriptionClass", publicName: "descriptionClass", isSignal: true, isRequired: false, transformFunction: null }, buttonsDescription: { classPropertyName: "buttonsDescription", publicName: "buttonsDescription", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsDescription: { classPropertyName: "disableButtonsDescription", publicName: "disableButtonsDescription", isSignal: true, isRequired: false, transformFunction: null }, buttonsDescriptionContainerClass: { classPropertyName: "buttonsDescriptionContainerClass", publicName: "buttonsDescriptionContainerClass", isSignal: true, isRequired: false, transformFunction: null }, onlyShowCount: { classPropertyName: "onlyShowCount", publicName: "onlyShowCount", isSignal: true, isRequired: false, transformFunction: null }, zIndexPopover: { classPropertyName: "zIndexPopover", publicName: "zIndexPopover", isSignal: true, isRequired: false, transformFunction: null }, timerDestroyPopover: { classPropertyName: "timerDestroyPopover", publicName: "timerDestroyPopover", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, limitLength: { classPropertyName: "limitLength", publicName: "limitLength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outClickButton: "outClickButton", outSwitchEvent: "outSwitchEvent", outLabelRightClick: "outLabelRightClick", outLabelLeftClick: "outLabelLeftClick" }, ngImport: i0, template: "<div\n [class]=\"classInclude()\"\n [class.mb-[4px]]=\"description()\"\n [class.mb-[8px]]=\"!description()\">\n <div\n class=\"libs-ui-label-left\"\n [style.maxWidth.%]=\"labelRight() || limitLength() || onlyShowCount() ? 70 : 100\">\n @if (hasToggle() && labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [size]=\"toggleSize()\"\n [disable]=\"toggleDisable()\"\n [class]=\"'mr-[8px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n @if (labelLeft()) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"{ zIndex: zIndexPopover(), timerDestroy: timerDestroyPopover() }\"\n [innerHtml]=\"labelLeft() || ' ' | translate\"\n [classInclude]=\"labelLeftClass()\"\n (click)=\"handlerEventLabelLeft($event)\" />\n }\n @if (required() && labelLeft()) {\n <i class=\"flex libs-ui-icon-asterisk before:!text-[#ee2d41] before:!text-[8px] pb-[4px] h-full\"></i>\n }\n @if (popover()?.config && popover()?.config?.content) {\n <libs_ui-components-popover\n classInclude=\"ml-[4px] {{ popover()?.classInclude }}\"\n [config]=\"popover()?.config\">\n <i [class]=\"iconPopoverClass()\"></i>\n </libs_ui-components-popover>\n }\n @for (button of buttonsLeft(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsLeft() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (hasToggle() && !labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [disable]=\"toggleDisable()\"\n [size]=\"toggleSize()\"\n [class]=\"'ml-[20px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n </div>\n\n <div class=\"libs-ui-label-right\">\n @if (labelRight(); as labelRight) {\n <libs_ui-components-popover\n type=\"text\"\n [innerHtml]=\"labelRight | translate\"\n [classInclude]=\"labelRightClass()\"\n (outEvent)=\"handlerEventLabelRight($event)\" />\n }\n @for (button of buttonsRight(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsRight() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [classLabel]=\"button.classLabel || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (limitLength() || onlyShowCount()) {\n <div class=\"flex items-center ml-[12px] text-[#9ca2ad] libs-ui-font-h7r\">\n <span>{{ countDisplay() }}</span>\n @if (limitLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n <span> {{ 'i18n_character' | translate }}</span>\n </div>\n }\n </div>\n</div>\n@if (description(); as description) {\n <div\n [class]=\"descriptionClass()\"\n [innerHtml]=\"description | translate\"></div>\n}\n@if (buttonsDescription()?.length) {\n <div [class]=\"buttonsDescriptionContainerClass()\">\n @for (button of buttonsDescription(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsDescription() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n [classLabel]=\"button.classLabel || ''\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n </div>\n}\n<ng-content select=\"div.libs-ui-custom-description\" />\n", styles: [".libs-ui-label{display:flex;justify-content:space-between;width:100%}.libs-ui-label .libs-ui-label-left{display:flex;align-items:center}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-text{color:#6a7383}.libs-ui-label .libs-ui-label-left libs_ui-components-button{margin-left:12px}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-optional{margin-left:0;font-size:10px!important;color:#9ca2ad;line-height:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.libs-ui-label .libs-ui-label-right{display:flex;align-items:center;justify-content:flex-end}.libs-ui-label .libs-ui-label-right libs_ui-components-button{margin-left:12px}.libs-ui-label-description{color:#9ca2ad;margin-bottom:8px}.libs-ui-label-description-button{margin-bottom:4px}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { 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: LibsUiComponentsSwitchComponent, selector: "libs_ui-components-switch", inputs: ["size", "disable", "active"], outputs: ["activeChange", "outSwitch"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
68
68
|
}
|
|
69
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
69
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsLabelComponent, decorators: [{
|
|
70
70
|
type: Component,
|
|
71
71
|
args: [{ selector: 'libs_ui-components-label', standalone: true, imports: [TranslateModule, LibsUiComponentsPopoverComponent, LibsUiComponentsButtonsButtonComponent, LibsUiComponentsSwitchComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [class]=\"classInclude()\"\n [class.mb-[4px]]=\"description()\"\n [class.mb-[8px]]=\"!description()\">\n <div\n class=\"libs-ui-label-left\"\n [style.maxWidth.%]=\"labelRight() || limitLength() || onlyShowCount() ? 70 : 100\">\n @if (hasToggle() && labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [size]=\"toggleSize()\"\n [disable]=\"toggleDisable()\"\n [class]=\"'mr-[8px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n @if (labelLeft()) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"{ zIndex: zIndexPopover(), timerDestroy: timerDestroyPopover() }\"\n [innerHtml]=\"labelLeft() || ' ' | translate\"\n [classInclude]=\"labelLeftClass()\"\n (click)=\"handlerEventLabelLeft($event)\" />\n }\n @if (required() && labelLeft()) {\n <i class=\"flex libs-ui-icon-asterisk before:!text-[#ee2d41] before:!text-[8px] pb-[4px] h-full\"></i>\n }\n @if (popover()?.config && popover()?.config?.content) {\n <libs_ui-components-popover\n classInclude=\"ml-[4px] {{ popover()?.classInclude }}\"\n [config]=\"popover()?.config\">\n <i [class]=\"iconPopoverClass()\"></i>\n </libs_ui-components-popover>\n }\n @for (button of buttonsLeft(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsLeft() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (hasToggle() && !labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [disable]=\"toggleDisable()\"\n [size]=\"toggleSize()\"\n [class]=\"'ml-[20px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n </div>\n\n <div class=\"libs-ui-label-right\">\n @if (labelRight(); as labelRight) {\n <libs_ui-components-popover\n type=\"text\"\n [innerHtml]=\"labelRight | translate\"\n [classInclude]=\"labelRightClass()\"\n (outEvent)=\"handlerEventLabelRight($event)\" />\n }\n @for (button of buttonsRight(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsRight() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [classLabel]=\"button.classLabel || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (limitLength() || onlyShowCount()) {\n <div class=\"flex items-center ml-[12px] text-[#9ca2ad] libs-ui-font-h7r\">\n <span>{{ countDisplay() }}</span>\n @if (limitLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n <span> {{ 'i18n_character' | translate }}</span>\n </div>\n }\n </div>\n</div>\n@if (description(); as description) {\n <div\n [class]=\"descriptionClass()\"\n [innerHtml]=\"description | translate\"></div>\n}\n@if (buttonsDescription()?.length) {\n <div [class]=\"buttonsDescriptionContainerClass()\">\n @for (button of buttonsDescription(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsDescription() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n [classLabel]=\"button.classLabel || ''\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n </div>\n}\n<ng-content select=\"div.libs-ui-custom-description\" />\n", styles: [".libs-ui-label{display:flex;justify-content:space-between;width:100%}.libs-ui-label .libs-ui-label-left{display:flex;align-items:center}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-text{color:#6a7383}.libs-ui-label .libs-ui-label-left libs_ui-components-button{margin-left:12px}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-optional{margin-left:0;font-size:10px!important;color:#9ca2ad;line-height:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.libs-ui-label .libs-ui-label-right{display:flex;align-items:center;justify-content:flex-end}.libs-ui-label .libs-ui-label-right libs_ui-components-button{margin-left:12px}.libs-ui-label-description{color:#9ca2ad;margin-bottom:8px}.libs-ui-label-description-button{margin-bottom:4px}\n"] }]
|
|
72
72
|
}] });
|
|
@@ -64,10 +64,10 @@ class LibsUiComponentsLabelComponent {
|
|
|
64
64
|
event.stopPropagation();
|
|
65
65
|
this.outLabelLeftClick.emit(event);
|
|
66
66
|
}
|
|
67
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
68
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsLabelComponent, isStandalone: true, selector: "libs_ui-components-label", inputs: { iconPopoverClass: { classPropertyName: "iconPopoverClass", publicName: "iconPopoverClass", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, labelLeft: { classPropertyName: "labelLeft", publicName: "labelLeft", isSignal: true, isRequired: false, transformFunction: null }, labelLeftClass: { classPropertyName: "labelLeftClass", publicName: "labelLeftClass", isSignal: true, isRequired: false, transformFunction: null }, labelLeftBehindToggleButton: { classPropertyName: "labelLeftBehindToggleButton", publicName: "labelLeftBehindToggleButton", isSignal: true, isRequired: false, transformFunction: null }, popover: { classPropertyName: "popover", publicName: "popover", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, buttonsLeft: { classPropertyName: "buttonsLeft", publicName: "buttonsLeft", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsLeft: { classPropertyName: "disableButtonsLeft", publicName: "disableButtonsLeft", isSignal: true, isRequired: false, transformFunction: null }, buttonsRight: { classPropertyName: "buttonsRight", publicName: "buttonsRight", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsRight: { classPropertyName: "disableButtonsRight", publicName: "disableButtonsRight", isSignal: true, isRequired: false, transformFunction: null }, labelRight: { classPropertyName: "labelRight", publicName: "labelRight", isSignal: true, isRequired: false, transformFunction: null }, labelRightClass: { classPropertyName: "labelRightClass", publicName: "labelRightClass", isSignal: true, isRequired: false, transformFunction: null }, labelRightRequired: { classPropertyName: "labelRightRequired", publicName: "labelRightRequired", isSignal: true, isRequired: false, transformFunction: null }, hasToggle: { classPropertyName: "hasToggle", publicName: "hasToggle", isSignal: true, isRequired: false, transformFunction: null }, toggleSize: { classPropertyName: "toggleSize", publicName: "toggleSize", isSignal: true, isRequired: false, transformFunction: null }, toggleActive: { classPropertyName: "toggleActive", publicName: "toggleActive", isSignal: true, isRequired: false, transformFunction: null }, toggleDisable: { classPropertyName: "toggleDisable", publicName: "toggleDisable", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, descriptionClass: { classPropertyName: "descriptionClass", publicName: "descriptionClass", isSignal: true, isRequired: false, transformFunction: null }, buttonsDescription: { classPropertyName: "buttonsDescription", publicName: "buttonsDescription", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsDescription: { classPropertyName: "disableButtonsDescription", publicName: "disableButtonsDescription", isSignal: true, isRequired: false, transformFunction: null }, buttonsDescriptionContainerClass: { classPropertyName: "buttonsDescriptionContainerClass", publicName: "buttonsDescriptionContainerClass", isSignal: true, isRequired: false, transformFunction: null }, onlyShowCount: { classPropertyName: "onlyShowCount", publicName: "onlyShowCount", isSignal: true, isRequired: false, transformFunction: null }, zIndexPopover: { classPropertyName: "zIndexPopover", publicName: "zIndexPopover", isSignal: true, isRequired: false, transformFunction: null }, timerDestroyPopover: { classPropertyName: "timerDestroyPopover", publicName: "timerDestroyPopover", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, limitLength: { classPropertyName: "limitLength", publicName: "limitLength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outClickButton: "outClickButton", outSwitchEvent: "outSwitchEvent", outLabelRightClick: "outLabelRightClick", outLabelLeftClick: "outLabelLeftClick" }, ngImport: i0, template: "<div\n [class]=\"classInclude()\"\n [class.mb-[4px]]=\"description()\"\n [class.mb-[8px]]=\"!description()\">\n <div\n class=\"libs-ui-label-left\"\n [style.maxWidth.%]=\"labelRight() || limitLength() || onlyShowCount() ? 70 : 100\">\n @if (hasToggle() && labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [size]=\"toggleSize()\"\n [disable]=\"toggleDisable()\"\n [class]=\"'mr-[8px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n @if (labelLeft()) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"{ zIndex: zIndexPopover(), timerDestroy: timerDestroyPopover() }\"\n [innerHtml]=\"labelLeft() || ' ' | translate\"\n [classInclude]=\"labelLeftClass()\"\n (click)=\"handlerEventLabelLeft($event)\" />\n }\n @if (required() && labelLeft()) {\n <i class=\"flex libs-ui-icon-asterisk before:!text-[#ee2d41] before:!text-[8px] pb-[4px] h-full\"></i>\n }\n @if (popover()?.config && popover()?.config?.content) {\n <libs_ui-components-popover\n classInclude=\"ml-[4px] {{ popover()?.classInclude }}\"\n [config]=\"popover()?.config\">\n <i [class]=\"iconPopoverClass()\"></i>\n </libs_ui-components-popover>\n }\n @for (button of buttonsLeft(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsLeft() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (hasToggle() && !labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [disable]=\"toggleDisable()\"\n [size]=\"toggleSize()\"\n [class]=\"'ml-[20px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n </div>\n\n <div class=\"libs-ui-label-right\">\n @if (labelRight(); as labelRight) {\n <libs_ui-components-popover\n type=\"text\"\n [innerHtml]=\"labelRight | translate\"\n [classInclude]=\"labelRightClass()\"\n (outEvent)=\"handlerEventLabelRight($event)\" />\n }\n @for (button of buttonsRight(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsRight() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [classLabel]=\"button.classLabel || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (limitLength() || onlyShowCount()) {\n <div class=\"flex items-center ml-[12px] text-[#9ca2ad] libs-ui-font-h7r\">\n <span>{{ countDisplay() }}</span>\n @if (limitLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n <span> {{ 'i18n_character' | translate }}</span>\n </div>\n }\n </div>\n</div>\n@if (description(); as description) {\n <div\n [class]=\"descriptionClass()\"\n [innerHtml]=\"description | translate\"></div>\n}\n@if (buttonsDescription()?.length) {\n <div [class]=\"buttonsDescriptionContainerClass()\">\n @for (button of buttonsDescription(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsDescription() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n [classLabel]=\"button.classLabel || ''\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n </div>\n}\n<ng-content select=\"div.libs-ui-custom-description\" />\n", styles: [".libs-ui-label{display:flex;justify-content:space-between;width:100%}.libs-ui-label .libs-ui-label-left{display:flex;align-items:center}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-text{color:#6a7383}.libs-ui-label .libs-ui-label-left libs_ui-components-button{margin-left:12px}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-optional{margin-left:0;font-size:10px!important;color:#9ca2ad;line-height:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.libs-ui-label .libs-ui-label-right{display:flex;align-items:center;justify-content:flex-end}.libs-ui-label .libs-ui-label-right libs_ui-components-button{margin-left:12px}.libs-ui-label-description{color:#9ca2ad;margin-bottom:8px}.libs-ui-label-description-button{margin-bottom:4px}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { 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: LibsUiComponentsSwitchComponent, selector: "libs_ui-components-switch", inputs: ["size", "disable", "active"], outputs: ["activeChange", "outSwitch"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
67
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
68
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsLabelComponent, isStandalone: true, selector: "libs_ui-components-label", inputs: { iconPopoverClass: { classPropertyName: "iconPopoverClass", publicName: "iconPopoverClass", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, labelLeft: { classPropertyName: "labelLeft", publicName: "labelLeft", isSignal: true, isRequired: false, transformFunction: null }, labelLeftClass: { classPropertyName: "labelLeftClass", publicName: "labelLeftClass", isSignal: true, isRequired: false, transformFunction: null }, labelLeftBehindToggleButton: { classPropertyName: "labelLeftBehindToggleButton", publicName: "labelLeftBehindToggleButton", isSignal: true, isRequired: false, transformFunction: null }, popover: { classPropertyName: "popover", publicName: "popover", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, buttonsLeft: { classPropertyName: "buttonsLeft", publicName: "buttonsLeft", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsLeft: { classPropertyName: "disableButtonsLeft", publicName: "disableButtonsLeft", isSignal: true, isRequired: false, transformFunction: null }, buttonsRight: { classPropertyName: "buttonsRight", publicName: "buttonsRight", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsRight: { classPropertyName: "disableButtonsRight", publicName: "disableButtonsRight", isSignal: true, isRequired: false, transformFunction: null }, labelRight: { classPropertyName: "labelRight", publicName: "labelRight", isSignal: true, isRequired: false, transformFunction: null }, labelRightClass: { classPropertyName: "labelRightClass", publicName: "labelRightClass", isSignal: true, isRequired: false, transformFunction: null }, labelRightRequired: { classPropertyName: "labelRightRequired", publicName: "labelRightRequired", isSignal: true, isRequired: false, transformFunction: null }, hasToggle: { classPropertyName: "hasToggle", publicName: "hasToggle", isSignal: true, isRequired: false, transformFunction: null }, toggleSize: { classPropertyName: "toggleSize", publicName: "toggleSize", isSignal: true, isRequired: false, transformFunction: null }, toggleActive: { classPropertyName: "toggleActive", publicName: "toggleActive", isSignal: true, isRequired: false, transformFunction: null }, toggleDisable: { classPropertyName: "toggleDisable", publicName: "toggleDisable", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, descriptionClass: { classPropertyName: "descriptionClass", publicName: "descriptionClass", isSignal: true, isRequired: false, transformFunction: null }, buttonsDescription: { classPropertyName: "buttonsDescription", publicName: "buttonsDescription", isSignal: true, isRequired: false, transformFunction: null }, disableButtonsDescription: { classPropertyName: "disableButtonsDescription", publicName: "disableButtonsDescription", isSignal: true, isRequired: false, transformFunction: null }, buttonsDescriptionContainerClass: { classPropertyName: "buttonsDescriptionContainerClass", publicName: "buttonsDescriptionContainerClass", isSignal: true, isRequired: false, transformFunction: null }, onlyShowCount: { classPropertyName: "onlyShowCount", publicName: "onlyShowCount", isSignal: true, isRequired: false, transformFunction: null }, zIndexPopover: { classPropertyName: "zIndexPopover", publicName: "zIndexPopover", isSignal: true, isRequired: false, transformFunction: null }, timerDestroyPopover: { classPropertyName: "timerDestroyPopover", publicName: "timerDestroyPopover", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, limitLength: { classPropertyName: "limitLength", publicName: "limitLength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outClickButton: "outClickButton", outSwitchEvent: "outSwitchEvent", outLabelRightClick: "outLabelRightClick", outLabelLeftClick: "outLabelLeftClick" }, ngImport: i0, template: "<div\n [class]=\"classInclude()\"\n [class.mb-[4px]]=\"description()\"\n [class.mb-[8px]]=\"!description()\">\n <div\n class=\"libs-ui-label-left\"\n [style.maxWidth.%]=\"labelRight() || limitLength() || onlyShowCount() ? 70 : 100\">\n @if (hasToggle() && labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [size]=\"toggleSize()\"\n [disable]=\"toggleDisable()\"\n [class]=\"'mr-[8px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n @if (labelLeft()) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"{ zIndex: zIndexPopover(), timerDestroy: timerDestroyPopover() }\"\n [innerHtml]=\"labelLeft() || ' ' | translate\"\n [classInclude]=\"labelLeftClass()\"\n (click)=\"handlerEventLabelLeft($event)\" />\n }\n @if (required() && labelLeft()) {\n <i class=\"flex libs-ui-icon-asterisk before:!text-[#ee2d41] before:!text-[8px] pb-[4px] h-full\"></i>\n }\n @if (popover()?.config && popover()?.config?.content) {\n <libs_ui-components-popover\n classInclude=\"ml-[4px] {{ popover()?.classInclude }}\"\n [config]=\"popover()?.config\">\n <i [class]=\"iconPopoverClass()\"></i>\n </libs_ui-components-popover>\n }\n @for (button of buttonsLeft(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsLeft() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (hasToggle() && !labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [disable]=\"toggleDisable()\"\n [size]=\"toggleSize()\"\n [class]=\"'ml-[20px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n </div>\n\n <div class=\"libs-ui-label-right\">\n @if (labelRight(); as labelRight) {\n <libs_ui-components-popover\n type=\"text\"\n [innerHtml]=\"labelRight | translate\"\n [classInclude]=\"labelRightClass()\"\n (outEvent)=\"handlerEventLabelRight($event)\" />\n }\n @for (button of buttonsRight(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsRight() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [classLabel]=\"button.classLabel || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (limitLength() || onlyShowCount()) {\n <div class=\"flex items-center ml-[12px] text-[#9ca2ad] libs-ui-font-h7r\">\n <span>{{ countDisplay() }}</span>\n @if (limitLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n <span> {{ 'i18n_character' | translate }}</span>\n </div>\n }\n </div>\n</div>\n@if (description(); as description) {\n <div\n [class]=\"descriptionClass()\"\n [innerHtml]=\"description | translate\"></div>\n}\n@if (buttonsDescription()?.length) {\n <div [class]=\"buttonsDescriptionContainerClass()\">\n @for (button of buttonsDescription(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsDescription() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n [classLabel]=\"button.classLabel || ''\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n </div>\n}\n<ng-content select=\"div.libs-ui-custom-description\" />\n", styles: [".libs-ui-label{display:flex;justify-content:space-between;width:100%}.libs-ui-label .libs-ui-label-left{display:flex;align-items:center}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-text{color:#6a7383}.libs-ui-label .libs-ui-label-left libs_ui-components-button{margin-left:12px}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-optional{margin-left:0;font-size:10px!important;color:#9ca2ad;line-height:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.libs-ui-label .libs-ui-label-right{display:flex;align-items:center;justify-content:flex-end}.libs-ui-label .libs-ui-label-right libs_ui-components-button{margin-left:12px}.libs-ui-label-description{color:#9ca2ad;margin-bottom:8px}.libs-ui-label-description-button{margin-bottom:4px}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { 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: LibsUiComponentsSwitchComponent, selector: "libs_ui-components-switch", inputs: ["size", "disable", "active"], outputs: ["activeChange", "outSwitch"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
69
69
|
}
|
|
70
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
70
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsLabelComponent, decorators: [{
|
|
71
71
|
type: Component,
|
|
72
72
|
args: [{ selector: 'libs_ui-components-label', standalone: true, imports: [TranslateModule, LibsUiComponentsPopoverComponent, LibsUiComponentsButtonsButtonComponent, LibsUiComponentsSwitchComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [class]=\"classInclude()\"\n [class.mb-[4px]]=\"description()\"\n [class.mb-[8px]]=\"!description()\">\n <div\n class=\"libs-ui-label-left\"\n [style.maxWidth.%]=\"labelRight() || limitLength() || onlyShowCount() ? 70 : 100\">\n @if (hasToggle() && labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [size]=\"toggleSize()\"\n [disable]=\"toggleDisable()\"\n [class]=\"'mr-[8px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n @if (labelLeft()) {\n <libs_ui-components-popover\n type=\"text\"\n [config]=\"{ zIndex: zIndexPopover(), timerDestroy: timerDestroyPopover() }\"\n [innerHtml]=\"labelLeft() || ' ' | translate\"\n [classInclude]=\"labelLeftClass()\"\n (click)=\"handlerEventLabelLeft($event)\" />\n }\n @if (required() && labelLeft()) {\n <i class=\"flex libs-ui-icon-asterisk before:!text-[#ee2d41] before:!text-[8px] pb-[4px] h-full\"></i>\n }\n @if (popover()?.config && popover()?.config?.content) {\n <libs_ui-components-popover\n classInclude=\"ml-[4px] {{ popover()?.classInclude }}\"\n [config]=\"popover()?.config\">\n <i [class]=\"iconPopoverClass()\"></i>\n </libs_ui-components-popover>\n }\n @for (button of buttonsLeft(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsLeft() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (hasToggle() && !labelLeftBehindToggleButton()) {\n <libs_ui-components-switch\n [disable]=\"toggleDisable()\"\n [size]=\"toggleSize()\"\n [class]=\"'ml-[20px]'\"\n [active]=\"toggleActive() || false\"\n (outSwitch)=\"handlerSwitch($event)\" />\n }\n </div>\n\n <div class=\"libs-ui-label-right\">\n @if (labelRight(); as labelRight) {\n <libs_ui-components-popover\n type=\"text\"\n [innerHtml]=\"labelRight | translate\"\n [classInclude]=\"labelRightClass()\"\n (outEvent)=\"handlerEventLabelRight($event)\" />\n }\n @for (button of buttonsRight(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [sizeButton]=\"button.sizeButton\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsRight() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [classLabel]=\"button.classLabel || ''\"\n [popover]=\"button.popover || {}\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n @if (limitLength() || onlyShowCount()) {\n <div class=\"flex items-center ml-[12px] text-[#9ca2ad] libs-ui-font-h7r\">\n <span>{{ countDisplay() }}</span>\n @if (limitLength()) {\n <span>/{{ maxLengthDisplay() }}</span>\n }\n <span> {{ 'i18n_character' | translate }}</span>\n </div>\n }\n </div>\n</div>\n@if (description(); as description) {\n <div\n [class]=\"descriptionClass()\"\n [innerHtml]=\"description | translate\"></div>\n}\n@if (buttonsDescription()?.length) {\n <div [class]=\"buttonsDescriptionContainerClass()\">\n @for (button of buttonsDescription(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-link-primary'\"\n [label]=\"button.label || ' '\"\n [disable]=\"button.disable || disableButtonsDescription() || false\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classInclude]=\"button.classInclude || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [popover]=\"button.popover || {}\"\n [classLabel]=\"button.classLabel || ''\"\n (outClick)=\"handlerClickButton(button)\" />\n }\n </div>\n}\n<ng-content select=\"div.libs-ui-custom-description\" />\n", styles: [".libs-ui-label{display:flex;justify-content:space-between;width:100%}.libs-ui-label .libs-ui-label-left{display:flex;align-items:center}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-text{color:#6a7383}.libs-ui-label .libs-ui-label-left libs_ui-components-button{margin-left:12px}.libs-ui-label .libs-ui-label-left .libs-ui-label-left-optional{margin-left:0;font-size:10px!important;color:#9ca2ad;line-height:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.libs-ui-label .libs-ui-label-right{display:flex;align-items:center;justify-content:flex-end}.libs-ui-label .libs-ui-label-right libs_ui-components-button{margin-left:12px}.libs-ui-label-description{color:#9ca2ad;margin-bottom:8px}.libs-ui-label-description-button{margin-bottom:4px}\n"] }]
|
|
73
73
|
}] });
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@libs-ui/components-label",
|
|
3
|
-
"version": "0.2.312-
|
|
3
|
+
"version": "0.2.312-2",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/core": ">=18.0.0",
|
|
6
|
-
"@libs-ui/components-buttons-button": "0.2.312-
|
|
7
|
-
"@libs-ui/components-popover": "0.2.312-
|
|
8
|
-
"@libs-ui/components-switch": "0.2.312-
|
|
9
|
-
"@libs-ui/utils": "0.2.312-
|
|
6
|
+
"@libs-ui/components-buttons-button": "0.2.312-2",
|
|
7
|
+
"@libs-ui/components-popover": "0.2.312-2",
|
|
8
|
+
"@libs-ui/components-switch": "0.2.312-2",
|
|
9
|
+
"@libs-ui/utils": "0.2.312-2",
|
|
10
10
|
"@ngx-translate/core": "^15.0.0"
|
|
11
11
|
},
|
|
12
12
|
"sideEffects": false,
|