@libs-ui/components-buttons-status 0.2.5

package/README.md

@@ -0,0 +1,3 @@
+# buttons-status
+
+This library was generated with [Nx](https://nx.dev).

package/esm2022/index.mjs

@@ -0,0 +1,3 @@
+export * from './status.component';
+export * from './interfaces';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvYnV0dG9ucy9zdGF0dXMvc3JjL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsb0JBQW9CLENBQUM7QUFDbkMsY0FBYyxjQUFjLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL3N0YXR1cy5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9pbnRlcmZhY2VzJzsiXX0=

package/esm2022/interfaces/index.mjs

@@ -0,0 +1,2 @@
+export * from './status.interface';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvYnV0dG9ucy9zdGF0dXMvc3JjL2ludGVyZmFjZXMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxvQkFBb0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vc3RhdHVzLmludGVyZmFjZSc7XG4iXX0=

package/esm2022/interfaces/status.interface.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RhdHVzLmludGVyZmFjZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9idXR0b25zL3N0YXR1cy9zcmMvaW50ZXJmYWNlcy9zdGF0dXMuaW50ZXJmYWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgaW50ZXJmYWNlIElCdXR0b25TdGF0dXMge1xuICBsYWJlbDogc3RyaW5nO1xuICB0eXBlOiBUWVBFX0JVVFRPTl9TVEFUVVM7XG4gIG90aGVyQ29uZmlnPzoge1xuICAgIGNvbG9yOiBzdHJpbmc7XG4gICAgYmFja2dyb3VuZDogc3RyaW5nO1xuICB9OyAvLyByZXF1aXJlZCBhbmQgb25seSBhcHBseSB3aGVuIHR5cGUgaXMgb3RoZXJcbiAgY2xhc3NJbmNsdWRlPzogc3RyaW5nO1xuICBjbGFzc0xhYmVsSW5jbHVkZT86IHN0cmluZztcbiAgY2xhc3NJY29uTGVmdD86IHN0cmluZztcbn1cblxuZXhwb3J0IHR5cGUgVFlQRV9CVVRUT05fU1RBVFVTID0gJ2JsdWUnIHwgJ2dyZWVuJyB8ICdyZWQnIHwgJ29yYW5nZScgfCAneWVsbG93JyB8ICdjeWFuJyB8ICdwdXJwbGUnIHwgJ2Jyb3duJyB8ICdvdGhlcic7Il19

package/esm2022/libs-ui-components-buttons-status.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlicy11aS1jb21wb25lbnRzLWJ1dHRvbnMtc3RhdHVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2J1dHRvbnMvc3RhdHVzL3NyYy9saWJzLXVpLWNvbXBvbmVudHMtYnV0dG9ucy1zdGF0dXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLFNBQVMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9pbmRleCc7XG4iXX0=

package/esm2022/status.component.mjs

@@ -0,0 +1,39 @@
+import { ChangeDetectionStrategy, Component, effect, inject, input, signal, untracked, viewChild } from '@angular/core';
+import { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';
+import { LibsUiConfigProjectService } from '@libs-ui/services-config-project';
+import { colorStepContrastFromOrigin, get } from '@libs-ui/utils';
+import { TranslateModule } from '@ngx-translate/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@ngx-translate/core";
+export class LibsUiComponentsButtonsStatusComponent {
+    /* PROPERTY */
+    classBinding = signal('');
+    configProjectService = inject(LibsUiConfigProjectService);
+    /* INPUT */
+    config = input.required();
+    /* VIEW CHILD */
+    buttonEl = viewChild('buttonEl');
+    constructor() {
+        effect(() => this.setClassByType());
+    }
+    /* FUNCTIONS */
+    async setClassByType() {
+        untracked(() => this.classBinding.set(`libs-ui-buttons-status ${this.config().classInclude}`));
+        const keys = ['color', 'background'];
+        const config = this.config().type === 'other' ? this.config().otherConfig : get(this.configProjectService.ConfigButtonStatus, this.config().type);
+        keys.forEach(key => {
+            const color = get(config, key) || colorStepContrastFromOrigin(get(config, 'color'), 90)?.light;
+            this.buttonEl()?.nativeElement.style.setProperty(`--libs-ui-button-status-${key}`, color);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsButtonsStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsButtonsStatusComponent, isStandalone: true, selector: "libs_ui-components-buttons-status", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "buttonEl", first: true, predicate: ["buttonEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<button #buttonEl\n  [class]=\"classBinding()\">\n  @if (config().classIconLeft) {\n    <i class=\"{{ config().classIconLeft }}\"></i>\n  }\n  <span LibsUiComponentsPopoverDirective\n    [type]=\"'text'\"\n    [class]=\"config().classLabelInclude || 'libs-ui-font-h6r'\"\n    [innerHtml]=\"config().label | translate\"></span>\n</button>\n", styles: [".libs-ui-buttons-status{display:flex;align-items:center;justify-content:center;padding:1px 6px;border:none;border-radius:10px;cursor:text;width:max-content;background-color:var(--libs-ui-button-status-background, #E9F1FE)}.libs-ui-buttons-status span,.libs-ui-buttons-status i{color:var(--libs-ui-button-status-color, #2B80FF)}.libs-ui-buttons-status span:before,.libs-ui-buttons-status i:before{color:var(--libs-ui-button-status-color, #2B80FF)}.libs-ui-buttons-status:focus{outline:none;box-shadow:none}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsButtonsStatusComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'libs_ui-components-buttons-status', standalone: true, imports: [
+                        TranslateModule,
+                        LibsUiComponentsPopoverComponent
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #buttonEl\n  [class]=\"classBinding()\">\n  @if (config().classIconLeft) {\n    <i class=\"{{ config().classIconLeft }}\"></i>\n  }\n  <span LibsUiComponentsPopoverDirective\n    [type]=\"'text'\"\n    [class]=\"config().classLabelInclude || 'libs-ui-font-h6r'\"\n    [innerHtml]=\"config().label | translate\"></span>\n</button>\n", styles: [".libs-ui-buttons-status{display:flex;align-items:center;justify-content:center;padding:1px 6px;border:none;border-radius:10px;cursor:text;width:max-content;background-color:var(--libs-ui-button-status-background, #E9F1FE)}.libs-ui-buttons-status span,.libs-ui-buttons-status i{color:var(--libs-ui-button-status-color, #2B80FF)}.libs-ui-buttons-status span:before,.libs-ui-buttons-status i:before{color:var(--libs-ui-button-status-color, #2B80FF)}.libs-ui-buttons-status:focus{outline:none;box-shadow:none}\n"] }]
+        }], ctorParameters: () => [] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RhdHVzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9idXR0b25zL3N0YXR1cy9zcmMvc3RhdHVzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9idXR0b25zL3N0YXR1cy9zcmMvc3RhdHVzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFjLE1BQU0sRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDcEksT0FBTyxFQUFFLGdDQUFnQyxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDL0UsT0FBTyxFQUFFLDBCQUEwQixFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFDOUUsT0FBTyxFQUFFLDJCQUEyQixFQUFFLEdBQUcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ2xFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQzs7O0FBZXRELE1BQU0sT0FBTyxzQ0FBc0M7SUFFakQsY0FBYztJQUNKLFlBQVksR0FBRyxNQUFNLENBQUMsRUFBRSxDQUFDLENBQUM7SUFFNUIsb0JBQW9CLEdBQUcsTUFBTSxDQUFDLDBCQUEwQixDQUFDLENBQUM7SUFFbEUsV0FBVztJQUNGLE1BQU0sR0FBRyxLQUFLLENBQUMsUUFBUSxFQUFpQixDQUFDO0lBRWxELGdCQUFnQjtJQUNDLFFBQVEsR0FBRyxTQUFTLENBQWEsVUFBVSxDQUFDLENBQUM7SUFFOUQ7UUFDRSxNQUFNLENBQUMsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDLENBQUM7SUFDdEMsQ0FBQztJQUVELGVBQWU7SUFDUCxLQUFLLENBQUMsY0FBYztRQUMxQixTQUFTLENBQUMsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxHQUFHLENBQUMsMEJBQTBCLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxZQUFZLEVBQUUsQ0FBQyxDQUFDLENBQUM7UUFDL0YsTUFBTSxJQUFJLEdBQUcsQ0FBQyxPQUFPLEVBQUUsWUFBWSxDQUFDLENBQUM7UUFDckMsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLElBQUksS0FBSyxPQUFPLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsb0JBQW9CLENBQUMsa0JBQWtCLEVBQUUsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBRWxKLElBQUksQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLEVBQUU7WUFDakIsTUFBTSxLQUFLLEdBQUcsR0FBRyxDQUFDLE1BQU0sRUFBRSxHQUFHLENBQUMsSUFBSSwyQkFBMkIsQ0FBQyxHQUFHLENBQUMsTUFBTSxFQUFFLE9BQU8sQ0FBQyxFQUFFLEVBQUUsQ0FBQyxFQUFFLEtBQUssQ0FBQztZQUUvRixJQUFJLENBQUMsUUFBUSxFQUFFLEVBQUUsYUFBYSxDQUFDLEtBQUssQ0FBQyxXQUFXLENBQUMsMkJBQTJCLEdBQUcsRUFBRSxFQUFFLEtBQUssQ0FBQyxDQUFDO1FBQzVGLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzt3R0E1QlUsc0NBQXNDOzRGQUF0QyxzQ0FBc0MseVZDbkJuRCxxVkFVQSxvakJESUksZUFBZSw0RkFDZixnQ0FBZ0M7OzRGQUl2QixzQ0FBc0M7a0JBWmxELFNBQVM7K0JBRUUsbUNBQW1DLGNBR2pDLElBQUksV0FDUDt3QkFDUCxlQUFlO3dCQUNmLGdDQUFnQztxQkFDakMsbUJBQ2dCLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBlZmZlY3QsIEVsZW1lbnRSZWYsIGluamVjdCwgaW5wdXQsIHNpZ25hbCwgdW50cmFja2VkLCB2aWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IExpYnNVaUNvbXBvbmVudHNQb3BvdmVyQ29tcG9uZW50IH0gZnJvbSAnQGxpYnMtdWkvY29tcG9uZW50cy1wb3BvdmVyJztcbmltcG9ydCB7IExpYnNVaUNvbmZpZ1Byb2plY3RTZXJ2aWNlIH0gZnJvbSAnQGxpYnMtdWkvc2VydmljZXMtY29uZmlnLXByb2plY3QnO1xuaW1wb3J0IHsgY29sb3JTdGVwQ29udHJhc3RGcm9tT3JpZ2luLCBnZXQgfSBmcm9tICdAbGlicy11aS91dGlscyc7XG5pbXBvcnQgeyBUcmFuc2xhdGVNb2R1bGUgfSBmcm9tICdAbmd4LXRyYW5zbGF0ZS9jb3JlJztcbmltcG9ydCB7IElCdXR0b25TdGF0dXMgfSBmcm9tICcuL2ludGVyZmFjZXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEBhbmd1bGFyLWVzbGludC9jb21wb25lbnQtc2VsZWN0b3JcbiAgc2VsZWN0b3I6ICdsaWJzX3VpLWNvbXBvbmVudHMtYnV0dG9ucy1zdGF0dXMnLFxuICB0ZW1wbGF0ZVVybDogJy4vc3RhdHVzLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL3N0YXR1cy5jb21wb25lbnQuc2NzcycsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtcbiAgICBUcmFuc2xhdGVNb2R1bGUsXG4gICAgTGlic1VpQ29tcG9uZW50c1BvcG92ZXJDb21wb25lbnRcbiAgXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2hcbn0pXG5leHBvcnQgY2xhc3MgTGlic1VpQ29tcG9uZW50c0J1dHRvbnNTdGF0dXNDb21wb25lbnQge1xuXG4gIC8qIFBST1BFUlRZICovXG4gIHByb3RlY3RlZCBjbGFzc0JpbmRpbmcgPSBzaWduYWwoJycpO1xuXG4gIHByaXZhdGUgY29uZmlnUHJvamVjdFNlcnZpY2UgPSBpbmplY3QoTGlic1VpQ29uZmlnUHJvamVjdFNlcnZpY2UpO1xuXG4gIC8qIElOUFVUICovXG4gIHJlYWRvbmx5IGNvbmZpZyA9IGlucHV0LnJlcXVpcmVkPElCdXR0b25TdGF0dXM+KCk7XG5cbiAgLyogVklFVyBDSElMRCAqL1xuICBwcml2YXRlIHJlYWRvbmx5IGJ1dHRvbkVsID0gdmlld0NoaWxkPEVsZW1lbnRSZWY+KCdidXR0b25FbCcpO1xuXG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIGVmZmVjdCgoKSA9PiB0aGlzLnNldENsYXNzQnlUeXBlKCkpO1xuICB9XG5cbiAgLyogRlVOQ1RJT05TICovXG4gIHByaXZhdGUgYXN5bmMgc2V0Q2xhc3NCeVR5cGUoKSB7XG4gICAgdW50cmFja2VkKCgpID0+IHRoaXMuY2xhc3NCaW5kaW5nLnNldChgbGlicy11aS1idXR0b25zLXN0YXR1cyAke3RoaXMuY29uZmlnKCkuY2xhc3NJbmNsdWRlfWApKTtcbiAgICBjb25zdCBrZXlzID0gWydjb2xvcicsICdiYWNrZ3JvdW5kJ107XG4gICAgY29uc3QgY29uZmlnID0gdGhpcy5jb25maWcoKS50eXBlID09PSAnb3RoZXInID8gdGhpcy5jb25maWcoKS5vdGhlckNvbmZpZyA6IGdldCh0aGlzLmNvbmZpZ1Byb2plY3RTZXJ2aWNlLkNvbmZpZ0J1dHRvblN0YXR1cywgdGhpcy5jb25maWcoKS50eXBlKTtcblxuICAgIGtleXMuZm9yRWFjaChrZXkgPT4ge1xuICAgICAgY29uc3QgY29sb3IgPSBnZXQoY29uZmlnLCBrZXkpIHx8IGNvbG9yU3RlcENvbnRyYXN0RnJvbU9yaWdpbihnZXQoY29uZmlnLCAnY29sb3InKSwgOTApPy5saWdodDtcblxuICAgICAgdGhpcy5idXR0b25FbCgpPy5uYXRpdmVFbGVtZW50LnN0eWxlLnNldFByb3BlcnR5KGAtLWxpYnMtdWktYnV0dG9uLXN0YXR1cy0ke2tleX1gLCBjb2xvcik7XG4gICAgfSk7XG4gIH1cblxufVxuIiwiPGJ1dHRvbiAjYnV0dG9uRWxcbiAgW2NsYXNzXT1cImNsYXNzQmluZGluZygpXCI+XG4gIEBpZiAoY29uZmlnKCkuY2xhc3NJY29uTGVmdCkge1xuICAgIDxpIGNsYXNzPVwie3sgY29uZmlnKCkuY2xhc3NJY29uTGVmdCB9fVwiPjwvaT5cbiAgfVxuICA8c3BhbiBMaWJzVWlDb21wb25lbnRzUG9wb3ZlckRpcmVjdGl2ZVxuICAgIFt0eXBlXT1cIid0ZXh0J1wiXG4gICAgW2NsYXNzXT1cImNvbmZpZygpLmNsYXNzTGFiZWxJbmNsdWRlIHx8ICdsaWJzLXVpLWZvbnQtaDZyJ1wiXG4gICAgW2lubmVySHRtbF09XCJjb25maWcoKS5sYWJlbCB8IHRyYW5zbGF0ZVwiPjwvc3Bhbj5cbjwvYnV0dG9uPlxuIl19

package/fesm2022/libs-ui-components-buttons-status.mjs

@@ -0,0 +1,46 @@
+import * as i0 from '@angular/core';
+import { signal, inject, input, viewChild, effect, untracked, Component, ChangeDetectionStrategy } from '@angular/core';
+import { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';
+import { LibsUiConfigProjectService } from '@libs-ui/services-config-project';
+import { get, colorStepContrastFromOrigin } from '@libs-ui/utils';
+import * as i1 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
+
+class LibsUiComponentsButtonsStatusComponent {
+    /* PROPERTY */
+    classBinding = signal('');
+    configProjectService = inject(LibsUiConfigProjectService);
+    /* INPUT */
+    config = input.required();
+    /* VIEW CHILD */
+    buttonEl = viewChild('buttonEl');
+    constructor() {
+        effect(() => this.setClassByType());
+    }
+    /* FUNCTIONS */
+    async setClassByType() {
+        untracked(() => this.classBinding.set(`libs-ui-buttons-status ${this.config().classInclude}`));
+        const keys = ['color', 'background'];
+        const config = this.config().type === 'other' ? this.config().otherConfig : get(this.configProjectService.ConfigButtonStatus, this.config().type);
+        keys.forEach(key => {
+            const color = get(config, key) || colorStepContrastFromOrigin(get(config, 'color'), 90)?.light;
+            this.buttonEl()?.nativeElement.style.setProperty(`--libs-ui-button-status-${key}`, color);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsButtonsStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsButtonsStatusComponent, isStandalone: true, selector: "libs_ui-components-buttons-status", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "buttonEl", first: true, predicate: ["buttonEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<button #buttonEl\n  [class]=\"classBinding()\">\n  @if (config().classIconLeft) {\n    <i class=\"{{ config().classIconLeft }}\"></i>\n  }\n  <span LibsUiComponentsPopoverDirective\n    [type]=\"'text'\"\n    [class]=\"config().classLabelInclude || 'libs-ui-font-h6r'\"\n    [innerHtml]=\"config().label | translate\"></span>\n</button>\n", styles: [".libs-ui-buttons-status{display:flex;align-items:center;justify-content:center;padding:1px 6px;border:none;border-radius:10px;cursor:text;width:max-content;background-color:var(--libs-ui-button-status-background, #E9F1FE)}.libs-ui-buttons-status span,.libs-ui-buttons-status i{color:var(--libs-ui-button-status-color, #2B80FF)}.libs-ui-buttons-status span:before,.libs-ui-buttons-status i:before{color:var(--libs-ui-button-status-color, #2B80FF)}.libs-ui-buttons-status:focus{outline:none;box-shadow:none}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsButtonsStatusComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'libs_ui-components-buttons-status', standalone: true, imports: [
+                        TranslateModule,
+                        LibsUiComponentsPopoverComponent
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #buttonEl\n  [class]=\"classBinding()\">\n  @if (config().classIconLeft) {\n    <i class=\"{{ config().classIconLeft }}\"></i>\n  }\n  <span LibsUiComponentsPopoverDirective\n    [type]=\"'text'\"\n    [class]=\"config().classLabelInclude || 'libs-ui-font-h6r'\"\n    [innerHtml]=\"config().label | translate\"></span>\n</button>\n", styles: [".libs-ui-buttons-status{display:flex;align-items:center;justify-content:center;padding:1px 6px;border:none;border-radius:10px;cursor:text;width:max-content;background-color:var(--libs-ui-button-status-background, #E9F1FE)}.libs-ui-buttons-status span,.libs-ui-buttons-status i{color:var(--libs-ui-button-status-color, #2B80FF)}.libs-ui-buttons-status span:before,.libs-ui-buttons-status i:before{color:var(--libs-ui-button-status-color, #2B80FF)}.libs-ui-buttons-status:focus{outline:none;box-shadow:none}\n"] }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LibsUiComponentsButtonsStatusComponent };
+//# sourceMappingURL=libs-ui-components-buttons-status.mjs.map

package/fesm2022/libs-ui-components-buttons-status.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"libs-ui-components-buttons-status.mjs","sources":["../../../../../../libs-ui/components/buttons/status/src/status.component.ts","../../../../../../libs-ui/components/buttons/status/src/status.component.html","../../../../../../libs-ui/components/buttons/status/src/libs-ui-components-buttons-status.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, effect, ElementRef, inject, input, signal, untracked, viewChild } from '@angular/core';\nimport { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';\nimport { LibsUiConfigProjectService } from '@libs-ui/services-config-project';\nimport { colorStepContrastFromOrigin, get } from '@libs-ui/utils';\nimport { TranslateModule } from '@ngx-translate/core';\nimport { IButtonStatus } from './interfaces';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'libs_ui-components-buttons-status',\n  templateUrl: './status.component.html',\n  styleUrl: './status.component.scss',\n  standalone: true,\n  imports: [\n    TranslateModule,\n    LibsUiComponentsPopoverComponent\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LibsUiComponentsButtonsStatusComponent {\n\n  /* PROPERTY */\n  protected classBinding = signal('');\n\n  private configProjectService = inject(LibsUiConfigProjectService);\n\n  /* INPUT */\n  readonly config = input.required<IButtonStatus>();\n\n  /* VIEW CHILD */\n  private readonly buttonEl = viewChild<ElementRef>('buttonEl');\n\n  constructor() {\n    effect(() => this.setClassByType());\n  }\n\n  /* FUNCTIONS */\n  private async setClassByType() {\n    untracked(() => this.classBinding.set(`libs-ui-buttons-status ${this.config().classInclude}`));\n    const keys = ['color', 'background'];\n    const config = this.config().type === 'other' ? this.config().otherConfig : get(this.configProjectService.ConfigButtonStatus, this.config().type);\n\n    keys.forEach(key => {\n      const color = get(config, key) || colorStepContrastFromOrigin(get(config, 'color'), 90)?.light;\n\n      this.buttonEl()?.nativeElement.style.setProperty(`--libs-ui-button-status-${key}`, color);\n    });\n  }\n\n}\n","<button #buttonEl\n  [class]=\"classBinding()\">\n  @if (config().classIconLeft) {\n    <i class=\"{{ config().classIconLeft }}\"></i>\n  }\n  <span LibsUiComponentsPopoverDirective\n    [type]=\"'text'\"\n    [class]=\"config().classLabelInclude || 'libs-ui-font-h6r'\"\n    [innerHtml]=\"config().label | translate\"></span>\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/index.d.ts

@@ -0,0 +1,2 @@
+export * from './status.component';
+export * from './interfaces';

package/interfaces/index.d.ts

@@ -0,0 +1 @@
+export * from './status.interface';

package/interfaces/status.interface.d.ts

@@ -0,0 +1,12 @@
+export interface IButtonStatus {
+    label: string;
+    type: TYPE_BUTTON_STATUS;
+    otherConfig?: {
+        color: string;
+        background: string;
+    };
+    classInclude?: string;
+    classLabelInclude?: string;
+    classIconLeft?: string;
+}
+export type TYPE_BUTTON_STATUS = 'blue' | 'green' | 'red' | 'orange' | 'yellow' | 'cyan' | 'purple' | 'brown' | 'other';

package/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@libs-ui/components-buttons-status",
+  "version": "0.2.5",
+  "peerDependencies": {
+    "@angular/common": "^18.2.0",
+    "@angular/core": "^18.2.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/libs-ui-components-buttons-status.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/libs-ui-components-buttons-status.mjs",
+      "esm": "./esm2022/libs-ui-components-buttons-status.mjs",
+      "default": "./fesm2022/libs-ui-components-buttons-status.mjs"
+    }
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
+}

package/status.component.d.ts

@@ -0,0 +1,12 @@
+import { IButtonStatus } from './interfaces';
+import * as i0 from "@angular/core";
+export declare class LibsUiComponentsButtonsStatusComponent {
+    protected classBinding: import("@angular/core").WritableSignal<string>;
+    private configProjectService;
+    readonly config: import("@angular/core").InputSignal<IButtonStatus>;
+    private readonly buttonEl;
+    constructor();
+    private setClassByType;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsButtonsStatusComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsButtonsStatusComponent, "libs_ui-components-buttons-status", never, { "config": { "alias": "config"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}