@libs-ui/components-buttons-tab 0.2.126 → 0.2.128
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.
|
@@ -7,12 +7,12 @@ import * as i0 from "@angular/core";
|
|
|
7
7
|
import * as i1 from "@ngx-translate/core";
|
|
8
8
|
export class LibsUiComponentsButtonsTabComponent {
|
|
9
9
|
otherStyleClassButtonTabEl = document.createElement('style');
|
|
10
|
-
|
|
10
|
+
// #region INPUT
|
|
11
11
|
items = input.required({ transform: data => data.map(item => ({ ...item, label: escapeHtml(item.label) })) });
|
|
12
12
|
disable = input(false);
|
|
13
13
|
keySelected = model('');
|
|
14
14
|
otherConfig = input(); // required and only apply when type is other
|
|
15
|
-
|
|
15
|
+
// #region OUTPUT
|
|
16
16
|
outKeySelected = output();
|
|
17
17
|
/* VIEW CHILD */
|
|
18
18
|
buttonEl = viewChild('buttonEl');
|
|
@@ -26,11 +26,11 @@ export class LibsUiComponentsButtonsTabComponent {
|
|
|
26
26
|
background-color: ${background} !important;
|
|
27
27
|
}
|
|
28
28
|
|
|
29
|
-
.libs-ui-button-tab-other[active="true"] > .label {
|
|
29
|
+
.libs-ui-button-tab-other[active="true"] > .libs-ui-button-tab-label {
|
|
30
30
|
color: ${config.color} !important;
|
|
31
31
|
}
|
|
32
32
|
|
|
33
|
-
.libs-ui-button-tab-other[active="true"] > .badge > .
|
|
33
|
+
.libs-ui-button-tab-other[active="true"] > .libs-ui-button-tab-badge > .libs-ui-button-tab-badge-circle {
|
|
34
34
|
color: ${config.color} !important;
|
|
35
35
|
background-color: ${backgroundBadge} !important;
|
|
36
36
|
}`;
|
|
@@ -49,7 +49,7 @@ export class LibsUiComponentsButtonsTabComponent {
|
|
|
49
49
|
this.outKeySelected.emit(this.keySelected());
|
|
50
50
|
}
|
|
51
51
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsButtonsTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
52
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsButtonsTabComponent, isStandalone: true, selector: "libs_ui-components-buttons-tab", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, keySelected: { classPropertyName: "keySelected", publicName: "keySelected", isSignal: true, isRequired: false, transformFunction: null }, otherConfig: { classPropertyName: "otherConfig", publicName: "otherConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { keySelected: "keySelectedChange", outKeySelected: "outKeySelected" }, viewQueries: [{ propertyName: "buttonEl", first: true, predicate: ["buttonEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'
|
|
52
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsButtonsTabComponent, isStandalone: true, selector: "libs_ui-components-buttons-tab", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, keySelected: { classPropertyName: "keySelected", publicName: "keySelected", isSignal: true, isRequired: false, transformFunction: null }, otherConfig: { classPropertyName: "otherConfig", publicName: "otherConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { keySelected: "keySelectedChange", outKeySelected: "outKeySelected" }, viewQueries: [{ propertyName: "buttonEl", first: true, predicate: ["buttonEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full libs-ui-button-tab-label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"libs-ui-button-tab-badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'libs-ui-button-tab-badge-circle libs-ui-font-h6r'\" />\n }\n </div>\n }\n</div>\n", styles: [":host ::ng-deep .libs-ui-button-tab{border-radius:4px}:host ::ng-deep .libs-ui-button-tab>[class*=libs-ui-button-tab-label]{color:#6a7383}:host ::ng-deep .libs-ui-button-tab>[class*=libs-ui-button-tab-badge]>[class*=libs-ui-button-tab-badge-circle]{color:#6a7383;background-color:#f8f9fa}:host ::ng-deep .libs-ui-button-tab:hover{background:#f8f9fa}:host ::ng-deep .libs-ui-button-tab:hover>[class*=libs-ui-button-tab-label]{color:#6a7383}:host ::ng-deep .libs-ui-button-tab:hover>[class*=libs-ui-button-tab-badge]>[class*=libs-ui-button-tab-badge-circle]{color:#6a7383;background-color:#e6e7ea}\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", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsBadgeComponent, selector: "libs_ui-components-badge", inputs: ["popoverConfig", "active", "count", "mode", "maxCount", "ignoreMarginDefault", "classCircle", "ignoreStopPropagationEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
53
53
|
}
|
|
54
54
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsButtonsTabComponent, decorators: [{
|
|
55
55
|
type: Component,
|
|
@@ -57,6 +57,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
57
57
|
TranslateModule,
|
|
58
58
|
LibsUiComponentsPopoverComponent,
|
|
59
59
|
LibsUiComponentsBadgeComponent
|
|
60
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'
|
|
60
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full libs-ui-button-tab-label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"libs-ui-button-tab-badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'libs-ui-button-tab-badge-circle libs-ui-font-h6r'\" />\n }\n </div>\n }\n</div>\n", styles: [":host ::ng-deep .libs-ui-button-tab{border-radius:4px}:host ::ng-deep .libs-ui-button-tab>[class*=libs-ui-button-tab-label]{color:#6a7383}:host ::ng-deep .libs-ui-button-tab>[class*=libs-ui-button-tab-badge]>[class*=libs-ui-button-tab-badge-circle]{color:#6a7383;background-color:#f8f9fa}:host ::ng-deep .libs-ui-button-tab:hover{background:#f8f9fa}:host ::ng-deep .libs-ui-button-tab:hover>[class*=libs-ui-button-tab-label]{color:#6a7383}:host ::ng-deep .libs-ui-button-tab:hover>[class*=libs-ui-button-tab-badge]>[class*=libs-ui-button-tab-badge-circle]{color:#6a7383;background-color:#e6e7ea}\n"] }]
|
|
61
61
|
}], ctorParameters: () => [] });
|
|
62
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
62
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFiLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9idXR0b25zL3RhYi9zcmMvdGFiLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9idXR0b25zL3RhYi9zcmMvdGFiLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFjLEtBQUssRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN4SCxPQUFPLEVBQUUsOEJBQThCLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMzRSxPQUFPLEVBQUUsZ0NBQWdDLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUMvRSxPQUFPLEVBQUUsMkJBQTJCLEVBQUUsVUFBVSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDekUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7QUFnQnRELE1BQU0sT0FBTyxtQ0FBbUM7SUFFN0IsMEJBQTBCLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUU5RSxnQkFBZ0I7SUFDUCxLQUFLLEdBQUcsS0FBSyxDQUFDLFFBQVEsQ0FBdUMsRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDLEVBQUUsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsQ0FBQyxFQUFFLEdBQUcsSUFBSSxFQUFFLEtBQUssRUFBRSxVQUFVLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQztJQUNwSixPQUFPLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO0lBQ2hDLFdBQVcsR0FBRyxLQUFLLENBQVMsRUFBRSxDQUFDLENBQUM7SUFDaEMsV0FBVyxHQUFHLEtBQUssRUFBZ0IsQ0FBQyxDQUFDLDZDQUE2QztJQUUzRixpQkFBaUI7SUFDUixjQUFjLEdBQUcsTUFBTSxFQUFVLENBQUM7SUFFM0MsZ0JBQWdCO0lBQ0MsUUFBUSxHQUFHLFNBQVMsQ0FBYSxVQUFVLENBQUMsQ0FBQztJQUU5RDtRQUNFLE1BQU0sQ0FBQyxHQUFHLEVBQUU7WUFDVixNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7WUFFbEMsSUFBSSxNQUFNLEVBQUUsQ0FBQztnQkFDWCxNQUFNLFVBQVUsR0FBRyxNQUFNLENBQUMsVUFBVSxJQUFJLDJCQUEyQixDQUFDLE1BQU0sQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLEVBQUUsS0FBSyxDQUFDO2dCQUM3RixNQUFNLGVBQWUsR0FBRyxNQUFNLENBQUMsZ0JBQWdCLElBQUksMkJBQTJCLENBQUMsTUFBTSxDQUFDLEtBQUssRUFBRSxFQUFFLENBQUMsRUFBRSxLQUFLLENBQUM7Z0JBQ3hHLE1BQU0sTUFBTSxHQUFHO2tDQUNXLFVBQVU7Ozs7dUJBSXJCLE1BQU0sQ0FBQyxLQUFLOzs7O3VCQUlaLE1BQU0sQ0FBQyxLQUFLO2tDQUNELGVBQWU7Y0FDbkMsQ0FBQztnQkFDUCxJQUFJLENBQUMsMEJBQTBCLENBQUMsU0FBUyxHQUFHLE1BQU0sQ0FBQztnQkFDbkQsSUFBSSxDQUFDLFFBQVEsRUFBRSxFQUFFLGFBQWEsQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLDBCQUEwQixDQUFDLENBQUM7WUFDekUsQ0FBQztRQUNILENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVELGVBQWU7SUFDTCxLQUFLLENBQUMsaUJBQWlCLENBQUMsS0FBaUIsRUFBRSxJQUFnQjtRQUNuRSxLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7UUFDeEIsSUFBSSxJQUFJLENBQUMsT0FBTyxFQUFFLElBQUksSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1lBQ25DLE9BQU87UUFDVCxDQUFDO1FBQ0QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBQy9CLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQyxDQUFDO0lBQy9DLENBQUM7d0dBakRVLG1DQUFtQzs0RkFBbkMsbUNBQW1DLHN6QkNwQmhELHFvQ0F1QkEsOG9CRFRJLGVBQWUsNEZBQ2YsZ0NBQWdDLHFlQUNoQyw4QkFBOEI7OzRGQUlyQixtQ0FBbUM7a0JBYi9DLFNBQVM7K0JBRUUsZ0NBQWdDLGNBRzlCLElBQUksV0FDUDt3QkFDUCxlQUFlO3dCQUNmLGdDQUFnQzt3QkFDaEMsOEJBQThCO3FCQUMvQixtQkFDZ0IsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGVmZmVjdCwgRWxlbWVudFJlZiwgaW5wdXQsIG1vZGVsLCBvdXRwdXQsIHZpZXdDaGlsZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTGlic1VpQ29tcG9uZW50c0JhZGdlQ29tcG9uZW50IH0gZnJvbSAnQGxpYnMtdWkvY29tcG9uZW50cy1iYWRnZSc7XG5pbXBvcnQgeyBMaWJzVWlDb21wb25lbnRzUG9wb3ZlckNvbXBvbmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtcG9wb3Zlcic7XG5pbXBvcnQgeyBjb2xvclN0ZXBDb250cmFzdEZyb21PcmlnaW4sIGVzY2FwZUh0bWwgfSBmcm9tICdAbGlicy11aS91dGlscyc7XG5pbXBvcnQgeyBUcmFuc2xhdGVNb2R1bGUgfSBmcm9tICdAbmd4LXRyYW5zbGF0ZS9jb3JlJztcbmltcG9ydCB7IElCdXR0b25UYWIsIElPdGhlckNvbmZpZyB9IGZyb20gJy4vaW50ZXJmYWNlcy90YWIuaW50ZXJmYWNlJztcblxuQENvbXBvbmVudCh7XG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAYW5ndWxhci1lc2xpbnQvY29tcG9uZW50LXNlbGVjdG9yXG4gIHNlbGVjdG9yOiAnbGlic191aS1jb21wb25lbnRzLWJ1dHRvbnMtdGFiJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3RhYi5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi90YWIuY29tcG9uZW50LnNjc3MnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbXG4gICAgVHJhbnNsYXRlTW9kdWxlLFxuICAgIExpYnNVaUNvbXBvbmVudHNQb3BvdmVyQ29tcG9uZW50LFxuICAgIExpYnNVaUNvbXBvbmVudHNCYWRnZUNvbXBvbmVudFxuICBdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxufSlcbmV4cG9ydCBjbGFzcyBMaWJzVWlDb21wb25lbnRzQnV0dG9uc1RhYkNvbXBvbmVudCB7XG5cbiAgcHJpdmF0ZSByZWFkb25seSBvdGhlclN0eWxlQ2xhc3NCdXR0b25UYWJFbCA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ3N0eWxlJyk7XG5cbiAgLy8gI3JlZ2lvbiBJTlBVVFxuICByZWFkb25seSBpdGVtcyA9IGlucHV0LnJlcXVpcmVkPEFycmF5PElCdXR0b25UYWI+LCBBcnJheTxJQnV0dG9uVGFiPj4oeyB0cmFuc2Zvcm06IGRhdGEgPT4gZGF0YS5tYXAoaXRlbSA9PiAoeyAuLi5pdGVtLCBsYWJlbDogZXNjYXBlSHRtbChpdGVtLmxhYmVsKSB9KSkgfSk7XG4gIHJlYWRvbmx5IGRpc2FibGUgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XG4gIHJlYWRvbmx5IGtleVNlbGVjdGVkID0gbW9kZWw8c3RyaW5nPignJyk7XG4gIHJlYWRvbmx5IG90aGVyQ29uZmlnID0gaW5wdXQ8SU90aGVyQ29uZmlnPigpOyAvLyByZXF1aXJlZCBhbmQgb25seSBhcHBseSB3aGVuIHR5cGUgaXMgb3RoZXJcblxuICAvLyAjcmVnaW9uIE9VVFBVVFxuICByZWFkb25seSBvdXRLZXlTZWxlY3RlZCA9IG91dHB1dDxzdHJpbmc+KCk7XG5cbiAgLyogVklFVyBDSElMRCAqL1xuICBwcml2YXRlIHJlYWRvbmx5IGJ1dHRvbkVsID0gdmlld0NoaWxkPEVsZW1lbnRSZWY+KCdidXR0b25FbCcpO1xuXG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIGVmZmVjdCgoKSA9PiB7XG4gICAgICBjb25zdCBjb25maWcgPSB0aGlzLm90aGVyQ29uZmlnKCk7XG5cbiAgICAgIGlmIChjb25maWcpIHtcbiAgICAgICAgY29uc3QgYmFja2dyb3VuZCA9IGNvbmZpZy5iYWNrZ3JvdW5kIHx8IGNvbG9yU3RlcENvbnRyYXN0RnJvbU9yaWdpbihjb25maWcuY29sb3IsIDk1KT8ubGlnaHQ7XG4gICAgICAgIGNvbnN0IGJhY2tncm91bmRCYWRnZSA9IGNvbmZpZy5iYWNrZ3JvdW5kX2JhZGdlIHx8IGNvbG9yU3RlcENvbnRyYXN0RnJvbU9yaWdpbihjb25maWcuY29sb3IsIDkwKT8ubGlnaHQ7XG4gICAgICAgIGNvbnN0IHN0eWxlcyA9IGAubGlicy11aS1idXR0b24tdGFiLW90aGVyW2FjdGl2ZT1cInRydWVcIl0ge1xuICAgICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke2JhY2tncm91bmR9ICFpbXBvcnRhbnQ7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgXG4gICAgICAgICAgICAubGlicy11aS1idXR0b24tdGFiLW90aGVyW2FjdGl2ZT1cInRydWVcIl0gPiAubGlicy11aS1idXR0b24tdGFiLWxhYmVsIHtcbiAgICAgICAgICAgICAgY29sb3I6ICR7Y29uZmlnLmNvbG9yfSAhaW1wb3J0YW50O1xuICAgICAgICAgICAgfVxuICAgICAgICAgIFxuICAgICAgICAgICAgLmxpYnMtdWktYnV0dG9uLXRhYi1vdGhlclthY3RpdmU9XCJ0cnVlXCJdID4gLmxpYnMtdWktYnV0dG9uLXRhYi1iYWRnZSA+IC5saWJzLXVpLWJ1dHRvbi10YWItYmFkZ2UtY2lyY2xlIHtcbiAgICAgICAgICAgICAgY29sb3I6ICR7Y29uZmlnLmNvbG9yfSAhaW1wb3J0YW50O1xuICAgICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke2JhY2tncm91bmRCYWRnZX0gIWltcG9ydGFudDtcbiAgICAgICAgICAgIH1gO1xuICAgICAgICB0aGlzLm90aGVyU3R5bGVDbGFzc0J1dHRvblRhYkVsLmlubmVySFRNTCA9IHN0eWxlcztcbiAgICAgICAgdGhpcy5idXR0b25FbCgpPy5uYXRpdmVFbGVtZW50LmFwcGVuZCh0aGlzLm90aGVyU3R5bGVDbGFzc0J1dHRvblRhYkVsKTtcbiAgICAgIH1cbiAgICB9KTtcbiAgfVxuXG4gIC8qIEZVTkNUSU9OUyAqL1xuICBwcm90ZWN0ZWQgYXN5bmMgaGFuZGxlclNlbGVjdEl0ZW0oZXZlbnQ6IE1vdXNlRXZlbnQsIGl0ZW06IElCdXR0b25UYWIpIHtcbiAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICBpZiAodGhpcy5kaXNhYmxlKCkgfHwgaXRlbS5kaXNhYmxlKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIHRoaXMua2V5U2VsZWN0ZWQuc2V0KGl0ZW0ua2V5KTtcbiAgICB0aGlzLm91dEtleVNlbGVjdGVkLmVtaXQodGhpcy5rZXlTZWxlY3RlZCgpKTtcbiAgfVxuXG59XG4iLCI8ZGl2ICNidXR0b25FbFxuICBjbGFzcz1cImZsZXhcIj5cbiAgQGZvciAoaXRlbSBvZiBpdGVtcygpOyB0cmFjayBpdGVtKSB7XG4gICAgPGRpdiBjbGFzcz1cImZsZXggaXRlbXMtY2VudGVyIGxpYnMtdWktYnV0dG9uLXRhYiB7eyAnbGlicy11aS1idXR0b24tdGFiLScraXRlbS50eXBlIH19IHt7IGl0ZW0uY2xhc3MgfHwgJ3B4LVs4cHhdIG14LVs4cHhdIHB5LVs0cHhdJyB9fSB7eyAoZGlzYWJsZSgpIHx8IGl0ZW0uZGlzYWJsZSkgPyAncG9pbnRlci1ldmVudHMtbm9uZSBjdXJzb3ItZGVmYXVsdCcgOiAnY3Vyc29yLXBvaW50ZXInIH19XCJcbiAgICAgIFthdHRyLmFjdGl2ZV09XCJpdGVtLmtleSA9PT0ga2V5U2VsZWN0ZWQoKVwiXG4gICAgICAoY2xpY2spPVwiaGFuZGxlclNlbGVjdEl0ZW0oJGV2ZW50LCBpdGVtKVwiPlxuICAgICAgPHNwYW4gTGlic1VpQ29tcG9uZW50c1BvcG92ZXJEaXJlY3RpdmVcbiAgICAgICAgY2xhc3M9XCJ3LWZ1bGwgbGlicy11aS1idXR0b24tdGFiLWxhYmVsIHt7IGl0ZW0uY2xhc3NMYWJlbCB8fCAnbGlicy11aS1mb250LWg2cicgfX1cIlxuICAgICAgICBbY2xhc3MubGlicy11aS1kaXNhYmxlXT1cImRpc2FibGUoKSB8fCBpdGVtLmRpc2FibGVcIlxuICAgICAgICBbdHlwZV09XCIndGV4dCdcIlxuICAgICAgICBbYXR0ci5hY3RpdmVdPVwiaXRlbS5rZXkgPT09IGtleVNlbGVjdGVkKClcIlxuICAgICAgICBbaWdub3JlU3RvcFByb3BhZ2F0aW9uRXZlbnRdPVwidHJ1ZVwiXG4gICAgICAgIFtpbm5lckh0bWxdPVwiaXRlbS5sYWJlbCB8IHRyYW5zbGF0ZVwiPjwvc3Bhbj5cbiAgICAgIEBpZiAoaXRlbS5jb3VudCAhPT0gdW5kZWZpbmVkKSB7XG4gICAgICAgIDxsaWJzX3VpLWNvbXBvbmVudHMtYmFkZ2UgY2xhc3M9XCJsaWJzLXVpLWJ1dHRvbi10YWItYmFkZ2VcIlxuICAgICAgICAgIFttb2RlXT1cIml0ZW0ubW9kZUNvdW50IHx8ICd4KydcIlxuICAgICAgICAgIFtjb3VudF09XCJpdGVtLmNvdW50XCJcbiAgICAgICAgICBbbWF4Q291bnRdPVwiaXRlbS5tYXhDb3VudCB8fCA5OVwiXG4gICAgICAgICAgW2NsYXNzQ2lyY2xlXT1cIidsaWJzLXVpLWJ1dHRvbi10YWItYmFkZ2UtY2lyY2xlIGxpYnMtdWktZm9udC1oNnInXCIgLz5cbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgfVxuPC9kaXY+XG4iXX0=
|
|
@@ -8,12 +8,12 @@ import { TranslateModule } from '@ngx-translate/core';
|
|
|
8
8
|
|
|
9
9
|
class LibsUiComponentsButtonsTabComponent {
|
|
10
10
|
otherStyleClassButtonTabEl = document.createElement('style');
|
|
11
|
-
|
|
11
|
+
// #region INPUT
|
|
12
12
|
items = input.required({ transform: data => data.map(item => ({ ...item, label: escapeHtml(item.label) })) });
|
|
13
13
|
disable = input(false);
|
|
14
14
|
keySelected = model('');
|
|
15
15
|
otherConfig = input(); // required and only apply when type is other
|
|
16
|
-
|
|
16
|
+
// #region OUTPUT
|
|
17
17
|
outKeySelected = output();
|
|
18
18
|
/* VIEW CHILD */
|
|
19
19
|
buttonEl = viewChild('buttonEl');
|
|
@@ -27,11 +27,11 @@ class LibsUiComponentsButtonsTabComponent {
|
|
|
27
27
|
background-color: ${background} !important;
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
-
.libs-ui-button-tab-other[active="true"] > .label {
|
|
30
|
+
.libs-ui-button-tab-other[active="true"] > .libs-ui-button-tab-label {
|
|
31
31
|
color: ${config.color} !important;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
|
-
.libs-ui-button-tab-other[active="true"] > .badge > .
|
|
34
|
+
.libs-ui-button-tab-other[active="true"] > .libs-ui-button-tab-badge > .libs-ui-button-tab-badge-circle {
|
|
35
35
|
color: ${config.color} !important;
|
|
36
36
|
background-color: ${backgroundBadge} !important;
|
|
37
37
|
}`;
|
|
@@ -50,7 +50,7 @@ class LibsUiComponentsButtonsTabComponent {
|
|
|
50
50
|
this.outKeySelected.emit(this.keySelected());
|
|
51
51
|
}
|
|
52
52
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsButtonsTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
53
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsButtonsTabComponent, isStandalone: true, selector: "libs_ui-components-buttons-tab", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, keySelected: { classPropertyName: "keySelected", publicName: "keySelected", isSignal: true, isRequired: false, transformFunction: null }, otherConfig: { classPropertyName: "otherConfig", publicName: "otherConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { keySelected: "keySelectedChange", outKeySelected: "outKeySelected" }, viewQueries: [{ propertyName: "buttonEl", first: true, predicate: ["buttonEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'
|
|
53
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsButtonsTabComponent, isStandalone: true, selector: "libs_ui-components-buttons-tab", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, keySelected: { classPropertyName: "keySelected", publicName: "keySelected", isSignal: true, isRequired: false, transformFunction: null }, otherConfig: { classPropertyName: "otherConfig", publicName: "otherConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { keySelected: "keySelectedChange", outKeySelected: "outKeySelected" }, viewQueries: [{ propertyName: "buttonEl", first: true, predicate: ["buttonEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full libs-ui-button-tab-label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"libs-ui-button-tab-badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'libs-ui-button-tab-badge-circle libs-ui-font-h6r'\" />\n }\n </div>\n }\n</div>\n", styles: [":host ::ng-deep .libs-ui-button-tab{border-radius:4px}:host ::ng-deep .libs-ui-button-tab>[class*=libs-ui-button-tab-label]{color:#6a7383}:host ::ng-deep .libs-ui-button-tab>[class*=libs-ui-button-tab-badge]>[class*=libs-ui-button-tab-badge-circle]{color:#6a7383;background-color:#f8f9fa}:host ::ng-deep .libs-ui-button-tab:hover{background:#f8f9fa}:host ::ng-deep .libs-ui-button-tab:hover>[class*=libs-ui-button-tab-label]{color:#6a7383}:host ::ng-deep .libs-ui-button-tab:hover>[class*=libs-ui-button-tab-badge]>[class*=libs-ui-button-tab-badge-circle]{color:#6a7383;background-color:#e6e7ea}\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", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsBadgeComponent, selector: "libs_ui-components-badge", inputs: ["popoverConfig", "active", "count", "mode", "maxCount", "ignoreMarginDefault", "classCircle", "ignoreStopPropagationEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
54
54
|
}
|
|
55
55
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsButtonsTabComponent, decorators: [{
|
|
56
56
|
type: Component,
|
|
@@ -58,7 +58,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
58
58
|
TranslateModule,
|
|
59
59
|
LibsUiComponentsPopoverComponent,
|
|
60
60
|
LibsUiComponentsBadgeComponent
|
|
61
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'
|
|
61
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full libs-ui-button-tab-label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"libs-ui-button-tab-badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'libs-ui-button-tab-badge-circle libs-ui-font-h6r'\" />\n }\n </div>\n }\n</div>\n", styles: [":host ::ng-deep .libs-ui-button-tab{border-radius:4px}:host ::ng-deep .libs-ui-button-tab>[class*=libs-ui-button-tab-label]{color:#6a7383}:host ::ng-deep .libs-ui-button-tab>[class*=libs-ui-button-tab-badge]>[class*=libs-ui-button-tab-badge-circle]{color:#6a7383;background-color:#f8f9fa}:host ::ng-deep .libs-ui-button-tab:hover{background:#f8f9fa}:host ::ng-deep .libs-ui-button-tab:hover>[class*=libs-ui-button-tab-label]{color:#6a7383}:host ::ng-deep .libs-ui-button-tab:hover>[class*=libs-ui-button-tab-badge]>[class*=libs-ui-button-tab-badge-circle]{color:#6a7383;background-color:#e6e7ea}\n"] }]
|
|
62
62
|
}], ctorParameters: () => [] });
|
|
63
63
|
|
|
64
64
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"libs-ui-components-buttons-tab.mjs","sources":["../../../../../../libs-ui/components/buttons/tab/src/tab.component.ts","../../../../../../libs-ui/components/buttons/tab/src/tab.component.html","../../../../../../libs-ui/components/buttons/tab/src/libs-ui-components-buttons-tab.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, effect, ElementRef, input, model, output, viewChild } from '@angular/core';\nimport { LibsUiComponentsBadgeComponent } from '@libs-ui/components-badge';\nimport { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';\nimport { colorStepContrastFromOrigin, escapeHtml } from '@libs-ui/utils';\nimport { TranslateModule } from '@ngx-translate/core';\nimport { IButtonTab, IOtherConfig } from './interfaces/tab.interface';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-buttons-tab',\n templateUrl: './tab.component.html',\n styleUrl: './tab.component.scss',\n standalone: true,\n imports: [\n TranslateModule,\n LibsUiComponentsPopoverComponent,\n LibsUiComponentsBadgeComponent\n ],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LibsUiComponentsButtonsTabComponent {\n\n private readonly otherStyleClassButtonTabEl = document.createElement('style');\n\n
|
|
1
|
+
{"version":3,"file":"libs-ui-components-buttons-tab.mjs","sources":["../../../../../../libs-ui/components/buttons/tab/src/tab.component.ts","../../../../../../libs-ui/components/buttons/tab/src/tab.component.html","../../../../../../libs-ui/components/buttons/tab/src/libs-ui-components-buttons-tab.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, effect, ElementRef, input, model, output, viewChild } from '@angular/core';\nimport { LibsUiComponentsBadgeComponent } from '@libs-ui/components-badge';\nimport { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';\nimport { colorStepContrastFromOrigin, escapeHtml } from '@libs-ui/utils';\nimport { TranslateModule } from '@ngx-translate/core';\nimport { IButtonTab, IOtherConfig } from './interfaces/tab.interface';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-buttons-tab',\n templateUrl: './tab.component.html',\n styleUrl: './tab.component.scss',\n standalone: true,\n imports: [\n TranslateModule,\n LibsUiComponentsPopoverComponent,\n LibsUiComponentsBadgeComponent\n ],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LibsUiComponentsButtonsTabComponent {\n\n private readonly otherStyleClassButtonTabEl = document.createElement('style');\n\n // #region INPUT\n readonly items = input.required<Array<IButtonTab>, Array<IButtonTab>>({ transform: data => data.map(item => ({ ...item, label: escapeHtml(item.label) })) });\n readonly disable = input<boolean>(false);\n readonly keySelected = model<string>('');\n readonly otherConfig = input<IOtherConfig>(); // required and only apply when type is other\n\n // #region OUTPUT\n readonly outKeySelected = output<string>();\n\n /* VIEW CHILD */\n private readonly buttonEl = viewChild<ElementRef>('buttonEl');\n\n constructor() {\n effect(() => {\n const config = this.otherConfig();\n\n if (config) {\n const background = config.background || colorStepContrastFromOrigin(config.color, 95)?.light;\n const backgroundBadge = config.background_badge || colorStepContrastFromOrigin(config.color, 90)?.light;\n const styles = `.libs-ui-button-tab-other[active=\"true\"] {\n background-color: ${background} !important;\n }\n \n .libs-ui-button-tab-other[active=\"true\"] > .libs-ui-button-tab-label {\n color: ${config.color} !important;\n }\n \n .libs-ui-button-tab-other[active=\"true\"] > .libs-ui-button-tab-badge > .libs-ui-button-tab-badge-circle {\n color: ${config.color} !important;\n background-color: ${backgroundBadge} !important;\n }`;\n this.otherStyleClassButtonTabEl.innerHTML = styles;\n this.buttonEl()?.nativeElement.append(this.otherStyleClassButtonTabEl);\n }\n });\n }\n\n /* FUNCTIONS */\n protected async handlerSelectItem(event: MouseEvent, item: IButtonTab) {\n event.stopPropagation();\n if (this.disable() || item.disable) {\n return;\n }\n this.keySelected.set(item.key);\n this.outKeySelected.emit(this.keySelected());\n }\n\n}\n","<div #buttonEl\n class=\"flex\">\n @for (item of items(); track item) {\n <div class=\"flex items-center libs-ui-button-tab {{ 'libs-ui-button-tab-'+item.type }} {{ item.class || 'px-[8px] mx-[8px] py-[4px]' }} {{ (disable() || item.disable) ? 'pointer-events-none cursor-default' : 'cursor-pointer' }}\"\n [attr.active]=\"item.key === keySelected()\"\n (click)=\"handlerSelectItem($event, item)\">\n <span LibsUiComponentsPopoverDirective\n class=\"w-full libs-ui-button-tab-label {{ item.classLabel || 'libs-ui-font-h6r' }}\"\n [class.libs-ui-disable]=\"disable() || item.disable\"\n [type]=\"'text'\"\n [attr.active]=\"item.key === keySelected()\"\n [ignoreStopPropagationEvent]=\"true\"\n [innerHtml]=\"item.label | translate\"></span>\n @if (item.count !== undefined) {\n <libs_ui-components-badge class=\"libs-ui-button-tab-badge\"\n [mode]=\"item.modeCount || 'x+'\"\n [count]=\"item.count\"\n [maxCount]=\"item.maxCount || 99\"\n [classCircle]=\"'libs-ui-button-tab-badge-circle libs-ui-font-h6r'\" />\n }\n </div>\n }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|