@c80/ui 1.0.51 → 1.0.52

package/esm2022/index.js

@@ -5,4 +5,5 @@ export * from './lib/card-level';
 export * from './lib/modal';
 export * from './lib/select';
 export * from './lib/snackbar';
+export * from './lib/tab';
 //# sourceMappingURL=index.js.map

package/esm2022/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../libs/ui/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC","sourcesContent":["export * from './lib/table';\nexport * from './lib/icon';\nexport * from './lib/stat-card';\nexport * from './lib/card-level';\nexport * from './lib/modal';\nexport * from './lib/select';\nexport * from './lib/snackbar';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../libs/ui/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC","sourcesContent":["export * from './lib/table';\nexport * from './lib/icon';\nexport * from './lib/stat-card';\nexport * from './lib/card-level';\nexport * from './lib/modal';\nexport * from './lib/select';\nexport * from './lib/snackbar';\nexport * from './lib/tab';\n"]}

package/esm2022/lib/card-level/card-level.component.js

@@ -45,10 +45,10 @@ export class CardLevelComponent {
         return 'var(--color-success)';
     }, ...(ngDevMode ? [{ debugName: "fillColor" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: CardLevelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: CardLevelComponent, isStandalone: true, selector: "c80-card-level", inputs: { cardLevelData: { classPropertyName: "cardLevelData", publicName: "cardLevelData", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\n<div class=\"card-level-container\" [style.width]=\"cardWidth()\">\n  <label [for]=\"generatedId()\">\n    <strong>{{ cardLevelData().label }}</strong>\n\n    <span class=\"value-display\">\n      @if (isBidirectional()) {\n      <!-- Barra bidireccional desde el centro -->\n      <div class=\"bidirectional-meter\">\n        <div class=\"meter-track\">\n          <div class=\"center-line\"></div>\n          <div class=\"meter-fill\" [class.fill-left]=\"fillDirection() === 'left'\" [class.fill-right]=\"fillDirection() === 'right'\" [style.width.%]=\"bidirectionalFillPercent()\" [style.background]=\"fillColor()\">\n          </div>\n        </div>\n      </div>\n      } @else {\n      <!-- Meter est\u00E1ndar para rangos unidireccionales -->\n      <meter [id]=\"generatedId()\" [optimum]=\"cardLevelData().optimum\" [min]=\"cardLevelData().min\" [max]=\"cardLevelData().max\" [low]=\"cardLevelData().low\" [high]=\"cardLevelData().high\" [value]=\"cardLevelData().value\">\n      </meter>\n      }\n\n      {{ cardLevelData().value }}{{ cardLevelData().unit }}\n    </span>\n  </label>\n</div>\n<!-- eslint-enable @angular-eslint/template/no-inline-styles -->", styles: [".card-level-container{background:#fff;border-radius:5px;padding:8px;margin:4px;box-shadow:0 4px 6px #0000001a,0 1px 3px #00000014;min-width:100px;flex:1}.card-level-container label{display:flex;flex-direction:column;margin:0}.card-level-container label strong{font-size:12px;font-weight:600;color:#2d3748;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.card-level-container label .value-display{font-size:12px;font-weight:600;color:#1a202c;text-align:center;padding:0 5px;background:#4299e11a;border-radius:5px}.card-level-container label .bidirectional-meter{width:100%;margin-bottom:4px}.card-level-container label .bidirectional-meter .meter-track{position:relative;width:100%;height:10px;background:#e2e8f0;border-radius:12px;box-shadow:inset 0 2px 4px #0000001a;overflow:hidden}.card-level-container label .bidirectional-meter .meter-track .center-line{position:absolute;left:50%;top:0;bottom:0;width:4px;background:#4a5568;transform:translate(-50%);z-index:1}.card-level-container label .bidirectional-meter .meter-track .meter-fill{position:absolute;top:0;bottom:0;border-radius:5px}.card-level-container label .bidirectional-meter .meter-track .meter-fill.fill-right{left:50%}.card-level-container label .bidirectional-meter .meter-track .meter-fill.fill-left{right:50%}.card-level-container label meter{width:100%;border-radius:12px;border:none;background:#e2e8f0;margin-bottom:4px}.card-level-container label meter::-webkit-meter-bar{background:#e2e8f0;border-radius:12px;box-shadow:inset 0 2px 4px #0000001a}.card-level-container label meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#48bb78,#38a169);border-radius:12px}.card-level-container label meter::-webkit-meter-suboptimum-value{background:linear-gradient(90deg,#ed8936,#dd6b20);border-radius:12px}.card-level-container label meter::-webkit-meter-even-less-good-value{background:linear-gradient(90deg,#f56565,#e53e3e);border-radius:12px}.card-level-container label meter::-moz-meter-bar{background:linear-gradient(90deg,#48bb78,#38a169);border-radius:12px}:host{--color-success: linear-gradient(90deg, #48bb78, #38a169);--color-warning: linear-gradient(90deg, #ed8936, #dd6b20);--color-danger: linear-gradient(90deg, #f56565, #e53e3e)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: CardLevelComponent, isStandalone: true, selector: "c80-card-level", inputs: { cardLevelData: { classPropertyName: "cardLevelData", publicName: "cardLevelData", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\n<div class=\"card-level-container\" [style.width]=\"cardWidth()\">\n  <label [for]=\"generatedId()\">\n    <strong>{{ cardLevelData().label }}</strong>\n\n    <span class=\"value-display\">\n      @if (isBidirectional()) {\n      <!-- Barra bidireccional desde el centro -->\n      <div class=\"bidirectional-meter\">\n        <div class=\"meter-track\">\n          <div class=\"center-line\"></div>\n          <div class=\"meter-fill\" [class.fill-left]=\"fillDirection() === 'left'\" [class.fill-right]=\"fillDirection() === 'right'\" [style.width.%]=\"bidirectionalFillPercent()\" [style.background]=\"fillColor()\">\n          </div>\n        </div>\n      </div>\n      } @else {\n      <!-- Meter est\u00E1ndar para rangos unidireccionales -->\n      <meter [id]=\"generatedId()\" [optimum]=\"cardLevelData().optimum\" [min]=\"cardLevelData().min\" [max]=\"cardLevelData().max\" [low]=\"cardLevelData().low\" [high]=\"cardLevelData().high\" [value]=\"cardLevelData().value\">\n      </meter>\n      }\n\n      {{ cardLevelData().value }}{{ cardLevelData().unit }}\n    </span>\n  </label>\n</div>\n<!-- eslint-enable @angular-eslint/template/no-inline-styles -->", styles: [".card-level-container{background:#fff;border-radius:5px;padding:8px;margin:4px;box-shadow:0 4px 6px #0000001a,0 1px 3px #00000014;min-width:100px;flex:1}.card-level-container label{display:flex;flex-direction:column;margin:0}.card-level-container label strong{font-size:12px;font-weight:600;color:#2d3748;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.card-level-container label .value-display{font-size:12px;font-weight:600;color:#1a202c;text-align:center;padding:0 5px;background:#4299e11a;border-radius:5px}.card-level-container label .bidirectional-meter{width:100%;margin-bottom:4px}.card-level-container label .bidirectional-meter .meter-track{position:relative;width:100%;height:10px;background:#e2e8f0;border-radius:12px;box-shadow:inset 0 2px 4px #0000001a;overflow:hidden}.card-level-container label .bidirectional-meter .meter-track .center-line{position:absolute;left:50%;top:0;bottom:0;width:4px;background:#4a5568;transform:translate(-50%);z-index:1}.card-level-container label .bidirectional-meter .meter-track .meter-fill{position:absolute;top:0;bottom:0;border-radius:5px}.card-level-container label .bidirectional-meter .meter-track .meter-fill.fill-right{left:50%}.card-level-container label .bidirectional-meter .meter-track .meter-fill.fill-left{right:50%}.card-level-container label meter{width:100%;border-radius:12px;border:none;background:#e2e8f0;margin-bottom:4px}.card-level-container label meter::-webkit-meter-bar{background:#e2e8f0;border-radius:12px;box-shadow:inset 0 2px 4px #0000001a}.card-level-container label meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#48bb78,#38a169);border-radius:12px}.card-level-container label meter::-webkit-meter-suboptimum-value{background:linear-gradient(90deg,#ed8936,#dd6b20);border-radius:12px}.card-level-container label meter::-webkit-meter-even-less-good-value{background:linear-gradient(90deg,#f56565,#e53e3e);border-radius:12px}.card-level-container label meter::-moz-meter-bar{background:linear-gradient(90deg,#48bb78,#38a169);border-radius:12px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: CardLevelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c80-card-level', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\n<div class=\"card-level-container\" [style.width]=\"cardWidth()\">\n  <label [for]=\"generatedId()\">\n    <strong>{{ cardLevelData().label }}</strong>\n\n    <span class=\"value-display\">\n      @if (isBidirectional()) {\n      <!-- Barra bidireccional desde el centro -->\n      <div class=\"bidirectional-meter\">\n        <div class=\"meter-track\">\n          <div class=\"center-line\"></div>\n          <div class=\"meter-fill\" [class.fill-left]=\"fillDirection() === 'left'\" [class.fill-right]=\"fillDirection() === 'right'\" [style.width.%]=\"bidirectionalFillPercent()\" [style.background]=\"fillColor()\">\n          </div>\n        </div>\n      </div>\n      } @else {\n      <!-- Meter est\u00E1ndar para rangos unidireccionales -->\n      <meter [id]=\"generatedId()\" [optimum]=\"cardLevelData().optimum\" [min]=\"cardLevelData().min\" [max]=\"cardLevelData().max\" [low]=\"cardLevelData().low\" [high]=\"cardLevelData().high\" [value]=\"cardLevelData().value\">\n      </meter>\n      }\n\n      {{ cardLevelData().value }}{{ cardLevelData().unit }}\n    </span>\n  </label>\n</div>\n<!-- eslint-enable @angular-eslint/template/no-inline-styles -->", styles: [".card-level-container{background:#fff;border-radius:5px;padding:8px;margin:4px;box-shadow:0 4px 6px #0000001a,0 1px 3px #00000014;min-width:100px;flex:1}.card-level-container label{display:flex;flex-direction:column;margin:0}.card-level-container label strong{font-size:12px;font-weight:600;color:#2d3748;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.card-level-container label .value-display{font-size:12px;font-weight:600;color:#1a202c;text-align:center;padding:0 5px;background:#4299e11a;border-radius:5px}.card-level-container label .bidirectional-meter{width:100%;margin-bottom:4px}.card-level-container label .bidirectional-meter .meter-track{position:relative;width:100%;height:10px;background:#e2e8f0;border-radius:12px;box-shadow:inset 0 2px 4px #0000001a;overflow:hidden}.card-level-container label .bidirectional-meter .meter-track .center-line{position:absolute;left:50%;top:0;bottom:0;width:4px;background:#4a5568;transform:translate(-50%);z-index:1}.card-level-container label .bidirectional-meter .meter-track .meter-fill{position:absolute;top:0;bottom:0;border-radius:5px}.card-level-container label .bidirectional-meter .meter-track .meter-fill.fill-right{left:50%}.card-level-container label .bidirectional-meter .meter-track .meter-fill.fill-left{right:50%}.card-level-container label meter{width:100%;border-radius:12px;border:none;background:#e2e8f0;margin-bottom:4px}.card-level-container label meter::-webkit-meter-bar{background:#e2e8f0;border-radius:12px;box-shadow:inset 0 2px 4px #0000001a}.card-level-container label meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#48bb78,#38a169);border-radius:12px}.card-level-container label meter::-webkit-meter-suboptimum-value{background:linear-gradient(90deg,#ed8936,#dd6b20);border-radius:12px}.card-level-container label meter::-webkit-meter-even-less-good-value{background:linear-gradient(90deg,#f56565,#e53e3e);border-radius:12px}.card-level-container label meter::-moz-meter-bar{background:linear-gradient(90deg,#48bb78,#38a169);border-radius:12px}:host{--color-success: linear-gradient(90deg, #48bb78, #38a169);--color-warning: linear-gradient(90deg, #ed8936, #dd6b20);--color-danger: linear-gradient(90deg, #f56565, #e53e3e)}\n"] }]
+            args: [{ selector: 'c80-card-level', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\n<div class=\"card-level-container\" [style.width]=\"cardWidth()\">\n  <label [for]=\"generatedId()\">\n    <strong>{{ cardLevelData().label }}</strong>\n\n    <span class=\"value-display\">\n      @if (isBidirectional()) {\n      <!-- Barra bidireccional desde el centro -->\n      <div class=\"bidirectional-meter\">\n        <div class=\"meter-track\">\n          <div class=\"center-line\"></div>\n          <div class=\"meter-fill\" [class.fill-left]=\"fillDirection() === 'left'\" [class.fill-right]=\"fillDirection() === 'right'\" [style.width.%]=\"bidirectionalFillPercent()\" [style.background]=\"fillColor()\">\n          </div>\n        </div>\n      </div>\n      } @else {\n      <!-- Meter est\u00E1ndar para rangos unidireccionales -->\n      <meter [id]=\"generatedId()\" [optimum]=\"cardLevelData().optimum\" [min]=\"cardLevelData().min\" [max]=\"cardLevelData().max\" [low]=\"cardLevelData().low\" [high]=\"cardLevelData().high\" [value]=\"cardLevelData().value\">\n      </meter>\n      }\n\n      {{ cardLevelData().value }}{{ cardLevelData().unit }}\n    </span>\n  </label>\n</div>\n<!-- eslint-enable @angular-eslint/template/no-inline-styles -->", styles: [".card-level-container{background:#fff;border-radius:5px;padding:8px;margin:4px;box-shadow:0 4px 6px #0000001a,0 1px 3px #00000014;min-width:100px;flex:1}.card-level-container label{display:flex;flex-direction:column;margin:0}.card-level-container label strong{font-size:12px;font-weight:600;color:#2d3748;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.card-level-container label .value-display{font-size:12px;font-weight:600;color:#1a202c;text-align:center;padding:0 5px;background:#4299e11a;border-radius:5px}.card-level-container label .bidirectional-meter{width:100%;margin-bottom:4px}.card-level-container label .bidirectional-meter .meter-track{position:relative;width:100%;height:10px;background:#e2e8f0;border-radius:12px;box-shadow:inset 0 2px 4px #0000001a;overflow:hidden}.card-level-container label .bidirectional-meter .meter-track .center-line{position:absolute;left:50%;top:0;bottom:0;width:4px;background:#4a5568;transform:translate(-50%);z-index:1}.card-level-container label .bidirectional-meter .meter-track .meter-fill{position:absolute;top:0;bottom:0;border-radius:5px}.card-level-container label .bidirectional-meter .meter-track .meter-fill.fill-right{left:50%}.card-level-container label .bidirectional-meter .meter-track .meter-fill.fill-left{right:50%}.card-level-container label meter{width:100%;border-radius:12px;border:none;background:#e2e8f0;margin-bottom:4px}.card-level-container label meter::-webkit-meter-bar{background:#e2e8f0;border-radius:12px;box-shadow:inset 0 2px 4px #0000001a}.card-level-container label meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#48bb78,#38a169);border-radius:12px}.card-level-container label meter::-webkit-meter-suboptimum-value{background:linear-gradient(90deg,#ed8936,#dd6b20);border-radius:12px}.card-level-container label meter::-webkit-meter-even-less-good-value{background:linear-gradient(90deg,#f56565,#e53e3e);border-radius:12px}.card-level-container label meter::-moz-meter-bar{background:linear-gradient(90deg,#48bb78,#38a169);border-radius:12px}\n"] }]
         }], propDecorators: { cardLevelData: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardLevelData", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
 //# sourceMappingURL=card-level.component.js.map

package/esm2022/lib/icon/icon.component.js

@@ -5,7 +5,7 @@ import { transformToBoolean } from './icon.utils';
 import * as i0 from "@angular/core";
 export class C80IconComponent {
     icon = input('check', ...(ngDevMode ? [{ debugName: "icon" }] : [])); // Tipo de icono a mostrar
-    color = input('primary', ...(ngDevMode ? [{ debugName: "color" }] : [])); // Color del icono (primary, secondary, warn, success)
+    color = input('dark', ...(ngDevMode ? [{ debugName: "color" }] : [])); // Color del icono (primary, secondary, warn, success, dark)
     customColor = input(undefined, ...(ngDevMode ? [{ debugName: "customColor" }] : [])); // Color personalizado (sobrescribe color)
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : [])); // Estado deshabilitado
     size = input(1, ...(ngDevMode ? [{ debugName: "size" }] : [])); // Multiplicador de tamaño (1 = 24px)
@@ -39,10 +39,10 @@ export class C80IconComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: C80IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: C80IconComponent, isStandalone: true, selector: "c80-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, customColor: { classPropertyName: "customColor", publicName: "customColor", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, button: { classPropertyName: "button", publicName: "button", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, textLeft: { classPropertyName: "textLeft", publicName: "textLeft", isSignal: true, isRequired: false, transformFunction: null }, textRight: { classPropertyName: "textRight", publicName: "textRight", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { iconClick: "iconClick" }, ngImport: i0, template: "<ng-template #svgContent>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <svg [attr.width]=\"iconSize()\" [attr.height]=\"iconSize()\" viewBox=\"0 0 24 24\" fill=\"none\" [style.opacity]=\"iconOpacity()\">\n    @for (shape of additionalShapes(); track $index) {\n    @if (shape.type === 'circle') {\n    <circle [attr.cx]=\"shape['cx']\" [attr.cy]=\"shape['cy']\" [attr.r]=\"shape['r']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" />\n    } @else if (shape.type === 'rect') {\n    <rect [attr.x]=\"shape['x']\" [attr.y]=\"shape['y']\" [attr.width]=\"shape['width']\" [attr.height]=\"shape['height']\" [attr.rx]=\"shape['rx']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" fill=\"none\" />\n    } @else if (shape.type === 'path') {\n    <path [attr.d]=\"shape['d']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n    }\n    }\n    <path [attr.d]=\"iconPath()\" [attr.stroke]=\"iconColor()\" [attr.fill]=\"icon() === 'delete' ? iconColor() : 'none'\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n  </svg>\n</ng-template>\n\n<ng-template #textContent>\n  @if (textLeft()) {\n  <span class=\"icon-text ms-3\">{{ textLeft() }}</span>\n  }\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <span class=\"icon-content\" [style.width.px]=\"iconSize() + 8\" [style.height.px]=\"iconSize() + 8\">\n    <ng-container *ngTemplateOutlet=\"svgContent\" />\n  </span>\n  @if (textRight()) {\n  <span class=\"icon-text me-3\">{{ textRight() }}</span>\n  }\n</ng-template>\n\n@if (button()) {\n<button [type]=\"type()\" [disabled]=\"disabled()\" class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\" (click)=\"onButtonClick($event)\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</button>\n} @else {\n<span class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</span>\n}", styles: [":host .icon-wrapper{display:inline-flex;align-items:center;gap:8px;background:transparent;padding:0;border:none;outline:none;cursor:pointer;transition:opacity .2s}:host button.icon-wrapper:focus-visible{outline:2px solid #1976d2;outline-offset:2px;border-radius:4px}:host button.icon-wrapper:disabled{opacity:.5;cursor:default}:host .icon-content{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;min-width:0;min-height:0;padding:4px;margin:0 4px;transition:background .2s;box-sizing:border-box}:host button.icon-wrapper:hover:not(:disabled) .icon-content{background:#1976d214}:host button.icon-wrapper:active:not(:disabled) .icon-content{background:#1976d229}:host .icon-text{font-size:14px;line-height:1;white-space:nowrap;-webkit-user-select:none;user-select:none}:host .icon-wrapper-border{border:1px solid rgba(0,0,0,.23);border-radius:4px;padding:4px 8px}:host button.icon-wrapper-border:hover:not(:disabled){border-color:#000000de}:host button.icon-wrapper-border:disabled{border-color:#0000001f}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: C80IconComponent, isStandalone: true, selector: "c80-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, customColor: { classPropertyName: "customColor", publicName: "customColor", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, button: { classPropertyName: "button", publicName: "button", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, textLeft: { classPropertyName: "textLeft", publicName: "textLeft", isSignal: true, isRequired: false, transformFunction: null }, textRight: { classPropertyName: "textRight", publicName: "textRight", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { iconClick: "iconClick" }, ngImport: i0, template: "<ng-template #svgContent>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <svg [attr.width]=\"iconSize()\" [attr.height]=\"iconSize()\" viewBox=\"0 0 24 24\" fill=\"none\" [style.opacity]=\"iconOpacity()\">\n    @for (shape of additionalShapes(); track $index) {\n    @if (shape.type === 'circle') {\n    <circle [attr.cx]=\"shape['cx']\" [attr.cy]=\"shape['cy']\" [attr.r]=\"shape['r']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" />\n    } @else if (shape.type === 'rect') {\n    <rect [attr.x]=\"shape['x']\" [attr.y]=\"shape['y']\" [attr.width]=\"shape['width']\" [attr.height]=\"shape['height']\" [attr.rx]=\"shape['rx']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" fill=\"none\" />\n    } @else if (shape.type === 'path') {\n    <path [attr.d]=\"shape['d']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n    }\n    }\n    <path [attr.d]=\"iconPath()\" [attr.stroke]=\"iconColor()\" [attr.fill]=\"icon() === 'delete' ? iconColor() : 'none'\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n  </svg>\n</ng-template>\n\n<ng-template #textContent>\n  @if (textLeft()) {\n  <span class=\"icon-text ms-3\">{{ textLeft() }}</span>\n  }\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <span class=\"icon-content\" [style.width.px]=\"iconSize() + 8\" [style.height.px]=\"iconSize() + 8\">\n    <ng-container *ngTemplateOutlet=\"svgContent\" />\n  </span>\n  @if (textRight()) {\n  <span class=\"icon-text me-3\">{{ textRight() }}</span>\n  }\n</ng-template>\n\n@if (button()) {\n<button [type]=\"type()\" [disabled]=\"disabled()\" class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\" (click)=\"onButtonClick($event)\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</button>\n} @else {\n<span class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</span>\n}", styles: [":host .icon-wrapper{display:inline-flex;align-items:center;gap:8px;background:transparent;padding:0;border:none;outline:none;cursor:pointer;transition:opacity .2s}:host button.icon-wrapper:focus-visible{outline:none;outline-offset:2px;border-radius:4px}:host button.icon-wrapper:disabled{opacity:.5;cursor:default}:host .icon-content{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;min-width:0;min-height:0;padding:4px;margin:0 4px;transition:background .2s;box-sizing:border-box}:host button.icon-wrapper:hover:not(:disabled) .icon-content{background:var(--color-bg-hover)}:host button.icon-wrapper:active:not(:disabled) .icon-content{background:var(--color-bg-tertiary)}:host .icon-text{font-size:14px;line-height:1;white-space:nowrap;-webkit-user-select:none;user-select:none;color:var(--color-text-primary)}:host .icon-wrapper-border{border:1px solid var(--color-border-default);border-radius:4px;padding:4px 8px}:host button.icon-wrapper-border:hover:not(:disabled){border-color:var(--color-border-medium)}:host button.icon-wrapper-border:disabled{border-color:var(--color-border-light)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: C80IconComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c80-icon', standalone: true, imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #svgContent>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <svg [attr.width]=\"iconSize()\" [attr.height]=\"iconSize()\" viewBox=\"0 0 24 24\" fill=\"none\" [style.opacity]=\"iconOpacity()\">\n    @for (shape of additionalShapes(); track $index) {\n    @if (shape.type === 'circle') {\n    <circle [attr.cx]=\"shape['cx']\" [attr.cy]=\"shape['cy']\" [attr.r]=\"shape['r']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" />\n    } @else if (shape.type === 'rect') {\n    <rect [attr.x]=\"shape['x']\" [attr.y]=\"shape['y']\" [attr.width]=\"shape['width']\" [attr.height]=\"shape['height']\" [attr.rx]=\"shape['rx']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" fill=\"none\" />\n    } @else if (shape.type === 'path') {\n    <path [attr.d]=\"shape['d']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n    }\n    }\n    <path [attr.d]=\"iconPath()\" [attr.stroke]=\"iconColor()\" [attr.fill]=\"icon() === 'delete' ? iconColor() : 'none'\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n  </svg>\n</ng-template>\n\n<ng-template #textContent>\n  @if (textLeft()) {\n  <span class=\"icon-text ms-3\">{{ textLeft() }}</span>\n  }\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <span class=\"icon-content\" [style.width.px]=\"iconSize() + 8\" [style.height.px]=\"iconSize() + 8\">\n    <ng-container *ngTemplateOutlet=\"svgContent\" />\n  </span>\n  @if (textRight()) {\n  <span class=\"icon-text me-3\">{{ textRight() }}</span>\n  }\n</ng-template>\n\n@if (button()) {\n<button [type]=\"type()\" [disabled]=\"disabled()\" class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\" (click)=\"onButtonClick($event)\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</button>\n} @else {\n<span class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</span>\n}", styles: [":host .icon-wrapper{display:inline-flex;align-items:center;gap:8px;background:transparent;padding:0;border:none;outline:none;cursor:pointer;transition:opacity .2s}:host button.icon-wrapper:focus-visible{outline:2px solid #1976d2;outline-offset:2px;border-radius:4px}:host button.icon-wrapper:disabled{opacity:.5;cursor:default}:host .icon-content{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;min-width:0;min-height:0;padding:4px;margin:0 4px;transition:background .2s;box-sizing:border-box}:host button.icon-wrapper:hover:not(:disabled) .icon-content{background:#1976d214}:host button.icon-wrapper:active:not(:disabled) .icon-content{background:#1976d229}:host .icon-text{font-size:14px;line-height:1;white-space:nowrap;-webkit-user-select:none;user-select:none}:host .icon-wrapper-border{border:1px solid rgba(0,0,0,.23);border-radius:4px;padding:4px 8px}:host button.icon-wrapper-border:hover:not(:disabled){border-color:#000000de}:host button.icon-wrapper-border:disabled{border-color:#0000001f}\n"] }]
+            args: [{ selector: 'c80-icon', standalone: true, imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #svgContent>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <svg [attr.width]=\"iconSize()\" [attr.height]=\"iconSize()\" viewBox=\"0 0 24 24\" fill=\"none\" [style.opacity]=\"iconOpacity()\">\n    @for (shape of additionalShapes(); track $index) {\n    @if (shape.type === 'circle') {\n    <circle [attr.cx]=\"shape['cx']\" [attr.cy]=\"shape['cy']\" [attr.r]=\"shape['r']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" />\n    } @else if (shape.type === 'rect') {\n    <rect [attr.x]=\"shape['x']\" [attr.y]=\"shape['y']\" [attr.width]=\"shape['width']\" [attr.height]=\"shape['height']\" [attr.rx]=\"shape['rx']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" fill=\"none\" />\n    } @else if (shape.type === 'path') {\n    <path [attr.d]=\"shape['d']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n    }\n    }\n    <path [attr.d]=\"iconPath()\" [attr.stroke]=\"iconColor()\" [attr.fill]=\"icon() === 'delete' ? iconColor() : 'none'\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n  </svg>\n</ng-template>\n\n<ng-template #textContent>\n  @if (textLeft()) {\n  <span class=\"icon-text ms-3\">{{ textLeft() }}</span>\n  }\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <span class=\"icon-content\" [style.width.px]=\"iconSize() + 8\" [style.height.px]=\"iconSize() + 8\">\n    <ng-container *ngTemplateOutlet=\"svgContent\" />\n  </span>\n  @if (textRight()) {\n  <span class=\"icon-text me-3\">{{ textRight() }}</span>\n  }\n</ng-template>\n\n@if (button()) {\n<button [type]=\"type()\" [disabled]=\"disabled()\" class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\" (click)=\"onButtonClick($event)\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</button>\n} @else {\n<span class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</span>\n}", styles: [":host .icon-wrapper{display:inline-flex;align-items:center;gap:8px;background:transparent;padding:0;border:none;outline:none;cursor:pointer;transition:opacity .2s}:host button.icon-wrapper:focus-visible{outline:none;outline-offset:2px;border-radius:4px}:host button.icon-wrapper:disabled{opacity:.5;cursor:default}:host .icon-content{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;min-width:0;min-height:0;padding:4px;margin:0 4px;transition:background .2s;box-sizing:border-box}:host button.icon-wrapper:hover:not(:disabled) .icon-content{background:var(--color-bg-hover)}:host button.icon-wrapper:active:not(:disabled) .icon-content{background:var(--color-bg-tertiary)}:host .icon-text{font-size:14px;line-height:1;white-space:nowrap;-webkit-user-select:none;user-select:none;color:var(--color-text-primary)}:host .icon-wrapper-border{border:1px solid var(--color-border-default);border-radius:4px;padding:4px 8px}:host button.icon-wrapper-border:hover:not(:disabled){border-color:var(--color-border-medium)}:host button.icon-wrapper-border:disabled{border-color:var(--color-border-light)}\n"] }]
         }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], customColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "customColor", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], button: [{ type: i0.Input, args: [{ isSignal: true, alias: "button", required: false }] }], border: [{ type: i0.Input, args: [{ isSignal: true, alias: "border", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], textLeft: [{ type: i0.Input, args: [{ isSignal: true, alias: "textLeft", required: false }] }], textRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "textRight", required: false }] }], iconClick: [{ type: i0.Output, args: ["iconClick"] }] } });
 //# sourceMappingURL=icon.component.js.map

package/esm2022/lib/icon/icon.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/icon/icon.component.ts","../../../../../libs/ui/src/lib/icon/icon.component.html"],"names":[],"mappings":"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","sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport { Component, input, output, computed, ChangeDetectionStrategy } from '@angular/core';\nimport {\n  BASE_ICON_SIZE,\n  BASE_ICON_COLORS,\n  DISABLED_COLOR,\n  DEFAULT_ICON_COLOR,\n  DISABLED_OPACITY,\n  SECONDARY_WARN_OPACITY,\n  DEFAULT_OPACITY,\n  ICON_PATHS,\n  ICON_ADDITIONAL_SHAPES,\n} from './icon.constants';\nimport type { IconType, ColorType, ButtonType } from './icon.types';\nimport { transformToBoolean } from './icon.utils';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'c80-icon',\n  standalone: true,\n  imports: [NgTemplateOutlet],\n  templateUrl: './icon.component.html',\n  styleUrls: ['./icon.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class C80IconComponent {\n  readonly icon = input<IconType>('check'); // Tipo de icono a mostrar\n  readonly color = input<ColorType>('primary'); // Color del icono (primary, secondary, warn, success)\n  readonly customColor = input<string | undefined>(undefined); // Color personalizado (sobrescribe color)\n  readonly disabled = input(false); // Estado deshabilitado\n  readonly size = input(1); // Multiplicador de tamaño (1 = 24px)\n  readonly button = input(false, { transform: transformToBoolean }); // Renderiza como botón clickeable\n  readonly border = input(false, { transform: transformToBoolean }); // Agrega borde al wrapper\n  readonly type = input<ButtonType>('button'); // Tipo de botón (button, submit, reset)\n  readonly textLeft = input<string | undefined>(undefined); // Texto a la izquierda del icono\n  readonly textRight = input<string | undefined>(undefined); // Texto a la derecha del icono\n\n  readonly iconClick = output<Event>(); // Evento emitido al hacer click (solo si button=true)\n\n  readonly iconSize = computed(() => BASE_ICON_SIZE * this.size());\n\n  readonly iconColor = computed(() => {\n    if (this.disabled()) return DISABLED_COLOR;\n\n    const custom = this.customColor();\n    if (custom) return custom;\n\n    return BASE_ICON_COLORS[this.color()] ?? DEFAULT_ICON_COLOR;\n  });\n\n  readonly iconOpacity = computed(() => {\n    if (this.disabled()) return DISABLED_OPACITY;\n\n    const hasCustomColor = this.customColor() !== undefined;\n    const isSecondaryOrWarn = ['secondary', 'warn'].includes(this.color());\n\n    return !hasCustomColor && isSecondaryOrWarn ? SECONDARY_WARN_OPACITY : DEFAULT_OPACITY;\n  });\n\n  readonly iconPath = computed(() => ICON_PATHS[this.icon()] ?? ICON_PATHS['default']);\n  readonly additionalShapes = computed(() => ICON_ADDITIONAL_SHAPES[this.icon()] ?? []);\n\n  onButtonClick(event: Event): void {\n    if (!this.disabled()) {\n      this.iconClick.emit(event);\n    }\n  }\n}\n","<ng-template #svgContent>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <svg [attr.width]=\"iconSize()\" [attr.height]=\"iconSize()\" viewBox=\"0 0 24 24\" fill=\"none\" [style.opacity]=\"iconOpacity()\">\n    @for (shape of additionalShapes(); track $index) {\n    @if (shape.type === 'circle') {\n    <circle [attr.cx]=\"shape['cx']\" [attr.cy]=\"shape['cy']\" [attr.r]=\"shape['r']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" />\n    } @else if (shape.type === 'rect') {\n    <rect [attr.x]=\"shape['x']\" [attr.y]=\"shape['y']\" [attr.width]=\"shape['width']\" [attr.height]=\"shape['height']\" [attr.rx]=\"shape['rx']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" fill=\"none\" />\n    } @else if (shape.type === 'path') {\n    <path [attr.d]=\"shape['d']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n    }\n    }\n    <path [attr.d]=\"iconPath()\" [attr.stroke]=\"iconColor()\" [attr.fill]=\"icon() === 'delete' ? iconColor() : 'none'\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n  </svg>\n</ng-template>\n\n<ng-template #textContent>\n  @if (textLeft()) {\n  <span class=\"icon-text ms-3\">{{ textLeft() }}</span>\n  }\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <span class=\"icon-content\" [style.width.px]=\"iconSize() + 8\" [style.height.px]=\"iconSize() + 8\">\n    <ng-container *ngTemplateOutlet=\"svgContent\" />\n  </span>\n  @if (textRight()) {\n  <span class=\"icon-text me-3\">{{ textRight() }}</span>\n  }\n</ng-template>\n\n@if (button()) {\n<button [type]=\"type()\" [disabled]=\"disabled()\" class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\" (click)=\"onButtonClick($event)\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</button>\n} @else {\n<span class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</span>\n}"]}
+{"version":3,"file":"icon.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/icon/icon.component.ts","../../../../../libs/ui/src/lib/icon/icon.component.html"],"names":[],"mappings":"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","sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport { Component, input, output, computed, ChangeDetectionStrategy } from '@angular/core';\nimport {\n  BASE_ICON_SIZE,\n  BASE_ICON_COLORS,\n  DISABLED_COLOR,\n  DEFAULT_ICON_COLOR,\n  DISABLED_OPACITY,\n  SECONDARY_WARN_OPACITY,\n  DEFAULT_OPACITY,\n  ICON_PATHS,\n  ICON_ADDITIONAL_SHAPES,\n} from './icon.constants';\nimport type { IconType, ColorType, ButtonType } from './icon.types';\nimport { transformToBoolean } from './icon.utils';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'c80-icon',\n  standalone: true,\n  imports: [NgTemplateOutlet],\n  templateUrl: './icon.component.html',\n  styleUrls: ['./icon.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class C80IconComponent {\n  readonly icon = input<IconType>('check'); // Tipo de icono a mostrar\n  readonly color = input<ColorType>('dark'); // Color del icono (primary, secondary, warn, success, dark)\n  readonly customColor = input<string | undefined>(undefined); // Color personalizado (sobrescribe color)\n  readonly disabled = input(false); // Estado deshabilitado\n  readonly size = input(1); // Multiplicador de tamaño (1 = 24px)\n  readonly button = input(false, { transform: transformToBoolean }); // Renderiza como botón clickeable\n  readonly border = input(false, { transform: transformToBoolean }); // Agrega borde al wrapper\n  readonly type = input<ButtonType>('button'); // Tipo de botón (button, submit, reset)\n  readonly textLeft = input<string | undefined>(undefined); // Texto a la izquierda del icono\n  readonly textRight = input<string | undefined>(undefined); // Texto a la derecha del icono\n\n  readonly iconClick = output<Event>(); // Evento emitido al hacer click (solo si button=true)\n\n  readonly iconSize = computed(() => BASE_ICON_SIZE * this.size());\n\n  readonly iconColor = computed(() => {\n    if (this.disabled()) return DISABLED_COLOR;\n\n    const custom = this.customColor();\n    if (custom) return custom;\n\n    return BASE_ICON_COLORS[this.color()] ?? DEFAULT_ICON_COLOR;\n  });\n\n  readonly iconOpacity = computed(() => {\n    if (this.disabled()) return DISABLED_OPACITY;\n\n    const hasCustomColor = this.customColor() !== undefined;\n    const isSecondaryOrWarn = ['secondary', 'warn'].includes(this.color());\n\n    return !hasCustomColor && isSecondaryOrWarn ? SECONDARY_WARN_OPACITY : DEFAULT_OPACITY;\n  });\n\n  readonly iconPath = computed(() => ICON_PATHS[this.icon()] ?? ICON_PATHS['default']);\n  readonly additionalShapes = computed(() => ICON_ADDITIONAL_SHAPES[this.icon()] ?? []);\n\n  onButtonClick(event: Event): void {\n    if (!this.disabled()) {\n      this.iconClick.emit(event);\n    }\n  }\n}\n","<ng-template #svgContent>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <svg [attr.width]=\"iconSize()\" [attr.height]=\"iconSize()\" viewBox=\"0 0 24 24\" fill=\"none\" [style.opacity]=\"iconOpacity()\">\n    @for (shape of additionalShapes(); track $index) {\n    @if (shape.type === 'circle') {\n    <circle [attr.cx]=\"shape['cx']\" [attr.cy]=\"shape['cy']\" [attr.r]=\"shape['r']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" />\n    } @else if (shape.type === 'rect') {\n    <rect [attr.x]=\"shape['x']\" [attr.y]=\"shape['y']\" [attr.width]=\"shape['width']\" [attr.height]=\"shape['height']\" [attr.rx]=\"shape['rx']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" fill=\"none\" />\n    } @else if (shape.type === 'path') {\n    <path [attr.d]=\"shape['d']\" [attr.stroke]=\"iconColor()\" stroke-width=\"1\" [attr.fill]=\"shape['fill'] === 'color' ? iconColor() : 'none'\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n    }\n    }\n    <path [attr.d]=\"iconPath()\" [attr.stroke]=\"iconColor()\" [attr.fill]=\"icon() === 'delete' ? iconColor() : 'none'\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n  </svg>\n</ng-template>\n\n<ng-template #textContent>\n  @if (textLeft()) {\n  <span class=\"icon-text ms-3\">{{ textLeft() }}</span>\n  }\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <span class=\"icon-content\" [style.width.px]=\"iconSize() + 8\" [style.height.px]=\"iconSize() + 8\">\n    <ng-container *ngTemplateOutlet=\"svgContent\" />\n  </span>\n  @if (textRight()) {\n  <span class=\"icon-text me-3\">{{ textRight() }}</span>\n  }\n</ng-template>\n\n@if (button()) {\n<button [type]=\"type()\" [disabled]=\"disabled()\" class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\" (click)=\"onButtonClick($event)\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</button>\n} @else {\n<span class=\"icon-wrapper\" [class.icon-wrapper-border]=\"border()\">\n  <ng-container *ngTemplateOutlet=\"textContent\" />\n</span>\n}"]}

package/esm2022/lib/icon/icon.constants.js

@@ -79,6 +79,8 @@ export const ICON_NAMES = [
     'directions',
     'category',
     'logout',
+    'sun',
+    'moon',
     'default',
 ];
 export const BASE_ICON_COLORS = {
@@ -86,6 +88,7 @@ export const BASE_ICON_COLORS = {
     secondary: '#6b7280',
     warn: '#e53935',
     success: '#4caf50',
+    dark: '#e9ecef',
 };
 export const DISABLED_COLOR = '#bdbdbd';
 export const DEFAULT_ICON_COLOR = '#222';
@@ -196,6 +199,14 @@ export const ICON_PATHS = {
     directions: 'm21.41 10.59-7.99-8c-.78-.78-2.05-.78-2.83 0l-8.01 8c-.78.78-.78 2.05 0 2.83l8.01 8c.78.78 2.05.78 2.83 0l7.99-8c.79-.79.79-2.05 0-2.83zM13.5 14.5V12H10v3H8v-4c0-.55.45-1 1-1h4.5V7.5L17 11l-3.5 3.5z',
     category: 'M12 2 6.5 11h11z',
     logout: 'M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4m7 14 5-5m0 0-5-5m5 5H9',
+    // Material Design: light_mode (sun icon)
+    sun: 'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zM2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1zm18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1z' +
+        'M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1zm0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1z' +
+        'M5.99 4.58c-.39-.39-1.03-.39-1.41 0-.39.39-.39 1.03 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41L5.99 4.58zm12.37 12.37c-.39-.39-1.03-.39-1.41 0-.39.39-.39 1.03 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0 .39-.39.39-1.03 0-1.41l-1.06-1.06z' +
+        'm1.06-10.96c.39-.39.39-1.03 0-1.41-.39-.39-1.03-.39-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0l1.06-1.06zM7.05 18.36c.39-.39.39-1.03 0-1.41-.39-.39-1.03-.39-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0l1.06-1.06z',
+    // Material Design: dark_mode (moon icon)
+    moon: 'M9.37 5.51C9.19 6.15 9.1 6.82 9.1 7.5c0 4.08 3.32 7.4 7.4 7.4.68 0 1.35-.09 1.99-.27C17.45 17.19 14.93 19 12 19c-3.86 0-7-3.14-7-7 0-2.93 1.81-5.45 4.37-6.49z' +
+        'M12 3c-4.97 0-9 4.03-9 9s4.03 9 9 9 9-4.03 9-9c0-.46-.04-.92-.1-1.36-.98 1.37-2.58 2.26-4.4 2.26-2.98 0-5.4-2.42-5.4-5.4 0-1.81.89-3.42 2.26-4.4-.44-.06-.9-.1-1.36-.1z',
     default: '',
 };
 export const ICON_ADDITIONAL_SHAPES = {
@@ -289,6 +300,8 @@ export const ICON_ADDITIONAL_SHAPES = {
         { type: 'rect', x: '3', y: '14', width: '7', height: '7', rx: '1' },
     ],
     logout: [],
+    sun: [],
+    moon: [],
     default: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],
     edit: [{ type: 'rect', x: '5', y: '19', width: '14', height: '2', rx: '1' }],
 };

package/esm2022/lib/icon/icon.constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.constants.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/icon/icon.constants.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ColorType, ShapeAttributes } from './icon.types';\n\nexport const ICON_NAMES = [\n  'check',\n  'cancel',\n  'edit',\n  'delete',\n  'add',\n  'view',\n  'get',\n  'settings',\n  'schedule',\n  'refresh',\n  'checkCircle',\n  'cancelCircle',\n  'error',\n  'queue',\n  'arrowUp',\n  'arrowDown',\n  'toggleOn',\n  'toggleOff',\n  'search',\n  'upload',\n  'pendingActions',\n  'playCircle',\n  'play',\n  'stop',\n  'tune',\n  'visibility',\n  'visibilityOff',\n  'close',\n  'record',\n  'star',\n  'xCircle',\n  'key',\n  'exclamationTriangle',\n  'clipboard',\n  'download',\n  'shield',\n  'person',\n  'envelope',\n  'infoCircle',\n  'checkSquare',\n  'square',\n  'dashSquare',\n  'people',\n  'boxSeam',\n  'personBadge',\n  'listTask',\n  'shuffle',\n  'motor',\n  'box',\n  'bell',\n  'message',\n  'send',\n  'file',\n  'folder',\n  'save',\n  'print',\n  'clock',\n  'calendar',\n  'timer',\n  'lock',\n  'unlock',\n  'chart',\n  'table',\n  'database',\n  'home',\n  'menu',\n  'arrowLeft',\n  'arrowRight',\n  'copy',\n  'filter',\n  'sort',\n  'help',\n  'warning',\n  'dashboard',\n  'settingsApplications',\n  'route',\n  'developerBoard',\n  'directions',\n  'category',\n  'logout',\n  'default',\n] as const;\n\nexport const BASE_ICON_COLORS: Readonly<Record<ColorType, string>> = {\n  primary: '#003775c8',\n  secondary: '#6b7280',\n  warn: '#e53935',\n  success: '#4caf50',\n};\n\nexport const DISABLED_COLOR = '#bdbdbd';\nexport const DEFAULT_ICON_COLOR = '#222';\nexport const DISABLED_OPACITY = 0.5;\nexport const SECONDARY_WARN_OPACITY = 0.7;\nexport const DEFAULT_OPACITY = 1;\nexport const BASE_ICON_SIZE = 24;\n\n/**\n * ICON PATHS - SVG path definitions\n *\n * IMPORTANTE: Al crear o modificar iconos, SIEMPRE buscar primero en Material Design Icons oficial:\n * - Repositorio: https://github.com/google/material-design-icons\n * - Navegador: https://fonts.google.com/icons\n * - Usar paths oficiales de Material Design siempre que sea posible\n * - ViewBox: 24x24 (compatible con BASE_ICON_SIZE)\n * - Máximo 300 caracteres por línea (usar concatenación con + si es necesario)\n */\nexport const ICON_PATHS: Readonly<Record<string, string>> = {\n  check: 'M5 13l4 4L19 7',\n  cancel: 'M6 6l12 12M6 18L18 6',\n  edit: 'M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4 12.5-12.5z',\n  delete: 'M6 19a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',\n  add: 'M12 5v14M5 12h14',\n  view: 'M12 5C7 5 2.73 8.11 1 12c1.73 3.89 6 7 11 7s9.27-3.11 11-7c-1.73-3.89-6-7-11-7z',\n  get: 'm8.5 8.5 7 7',\n  settings: 'M12 1v6m0 6v10M3.34 7l5.2 3M15.46 14l5.2 3M3.34 17l5.2-3M15.46 10l5.2-3',\n  schedule: 'M12 6v6l4 2',\n  refresh: 'M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8M21 3v5h-5M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16M3 21v-5h5',\n  checkCircle: 'm9 12 2 2 4-4',\n  cancelCircle: 'm15 9-6 6m0-6 6 6',\n  error: 'M15 9L9 15M9 9l6 6',\n  queue: 'M3 12h18m-9-9v18',\n  arrowUp: 'm18 15-6-6-6 6',\n  arrowDown: 'm6 9 6 6 6-6',\n  toggleOn: '',\n  toggleOff: '',\n  search: 'm21 21-6-6m2-5a7 7 0 1 1-14 0 7 7 0 0 1 14 0z',\n  upload: 'M12 15V3m0 0l-4 4m4-4l4 4M2 17l.621 2.485A2 2 0 0 0 4.561 21h14.878a2 2 0 0 0 1.94-1.515L22 17',\n  pendingActions: 'M12 8v4l3 3m6-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0z',\n  playCircle: 'M14.752 11.168l-3.197-2.132A1 1 0 0 0 10 9.87v4.263a1 1 0 0 0 1.555.832l3.197-2.132a1 1 0 0 0 0-1.664z',\n  play: 'M8 5v14l11-7z',\n  stop: 'M6 6h12v12H6z',\n  // Material Design: tune (adjustments/sliders)\n  tune: 'M3 17v2h6v-2H3zM3 5v2h10V5H3zm10 16v-2h8v-2h-8v-2h-2v6h2zM7 9v2H3v2h4v2h2V9H7zm14 4v-2H11v2h10zm-6-4h2V7h4V5h-4V3h-2v6z',\n  visibility: 'M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5z',\n  visibilityOff:\n    'M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7z' +\n    'M2 4.27l2.28 2.28.46.46A11.804 11.804 0 0 0 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27z' +\n    'M7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2z' +\n    'm4.31-.78 3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z',\n  close: 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z',\n  record: '',\n  star: 'M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z',\n  xCircle: 'M15 9l-6 6m0-6l6 6',\n  key: 'M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4',\n  exclamationTriangle: 'M12 9v4m0 4h.01',\n  clipboard: 'M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2',\n  download: 'M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4m4-5l5 5m0 0l5-5m-5 5V3',\n  shield: 'M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z',\n  // Material Design: person (single user)\n  person: 'M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z',\n  envelope: 'M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z',\n  infoCircle: 'M12 16v-4m0-4h.01',\n  checkSquare: 'm9 11 3 3L22 4',\n  square: '',\n  dashSquare: 'M8 12h8',\n  people:\n    'M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3z' +\n    'm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z',\n  boxSeam: 'M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z',\n  personBadge: 'M12 2L4 6v5c0 5.55 3.84 10.74 8 12 4.16-1.26 8-6.45 8-12V6l-8-4z',\n  listTask: 'M9 6h12M9 12h12M9 18h12',\n  shuffle: 'M16 3h5v5M4 20L21 3M21 16v5h-5M15 15l6 6M4 4l5 5',\n  motor: 'M9 3v3m6-3v3M9 18v3m6-3v3M3 9h3M3 15h3m12-6h3m-3 6h3',\n  box: 'M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16V8z',\n  bell: 'M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9M13.73 21a2 2 0 0 1-3.46 0',\n  message: 'M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z',\n  send: 'M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z',\n  file: 'M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z',\n  folder: 'M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z',\n  save: 'M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z',\n  print: 'M6 9V2h12v7M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2',\n  clock: 'M12 6v6l4 2',\n  calendar: 'M8 2v4m8-4v4M3 10h18',\n  timer: 'M12 8v4l2 2',\n  lock: 'M19 11H5a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7a2 2 0 0 0-2-2zM7 11V7a5 5 0 0 1 10 0v4',\n  unlock: 'M19 11H5a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7a2 2 0 0 0-2-2zM7 11V7a5 5 0 0 1 9.9-1',\n  chart: 'M3 3v18h18M7 16l4-4 4 4 6-6',\n  table: 'M3 3h18v18H3zM3 9h18M3 15h18M9 3v18',\n  database: 'M12 8c-4.97 0-9-1.34-9-3s4.03-3 9-3 9 1.34 9 3-4.03 3-9 3zM3 5v5c0 1.66 4.03 3 9 3s9-1.34 9-3V5M3 10v5c0 1.66 4.03 3 9 3s9-1.34 9-3v-5',\n  home: 'm3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z',\n  menu: 'M3 12h18M3 6h18M3 18h18',\n  arrowLeft: 'm19 12H5m0 0 7 7m-7-7 7-7',\n  arrowRight: 'm5 12 7 7m0 0 5-5m-5 5V5',\n  copy: 'M8 4v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V7.242a2 2 0 0 0-.602-1.43L16.083 2.57A2 2 0 0 0 14.685 2H10a2 2 0 0 0-2 2z',\n  filter: 'M22 3H2l8 9.46V19l4 2v-8.54L22 3z',\n  sort: 'M11 5h10M11 9h7M11 13h4M3 17l3 3m0 0l3-3m-3 3V4',\n  help: 'M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3m.08 4h.01',\n  warning: 'M12 9v4',\n  dashboard: 'M3 13h8V3H3zm0 8h8v-6H3zm10 0h8V11h-8zm0-18v6h8V3z',\n  // Material Design: settings_applications (system profiles/configuration)\n  settingsApplications:\n    'M12 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm7-7H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2z' +\n    'm-1.75 9c0 .23-.02.46-.05.68l1.48 1.16c.13.11.17.3.08.45l-1.4 2.42c-.09.15-.27.21-.43.15l-1.74-.7c-.36.28-.76.51-1.18.69l-.26 1.85c-.03.17-.18.3-.35.3h-2.8' +\n    'c-.17 0-.32-.13-.35-.29l-.26-1.85c-.43-.18-.82-.41-1.18-.69l-1.74.7c-.16.06-.34 0-.43-.15l-1.4-2.42c-.09-.15-.05-.34.08-.45l1.48-1.16c-.03-.23-.05-.46-.05-.69 0-.23.02-.46.05-.68' +\n    'l-1.48-1.16c-.13-.11-.17-.3-.08-.45l1.4-2.42c.09-.15.27-.21.43-.15l1.74.7c.36-.28.76-.51 1.18-.69l.26-1.85c.03-.17.18-.3.35-.3h2.8' +\n    'c.17 0 .32.13.35.29l.26 1.85c.43.18.82.41 1.18.69l1.74-.7c.16-.06.34 0 .43.15l1.4 2.42c.09.15.05.34-.08.45l-1.48 1.16c.03.23.05.46.05.69z',\n  route: 'M19 15.18V7c0-2.21-1.79-4-4-4s-4 1.79-4 4v10c0 1.1-.9 2-2 2s-2-.9-2-2V8.82C8.16 8.4 9 7.3 9 6c0-1.66-1.34-3-3-3S3 4.34 3 6c0 1.3.84 2.4 2 2.82V17c0 2.21 1.79 4 4 4s4-1.79 4-4V7c0-1.1.9-2 2-2s2 .9 2 2v8.18A2.996 2.996 0 0 0 15 18c0 1.66 1.34 3 3 3s3-1.34 3-3c0-1.3-.84-2.4-2-2.82z',\n  developerBoard: 'M9 2v4m6-4v4M9 18v4m6-18v4M2 9h4M2 15h4m16-6h4m-4 6h4',\n  // Material Design: directions (map navigation icon with arrow)\n  directions: 'm21.41 10.59-7.99-8c-.78-.78-2.05-.78-2.83 0l-8.01 8c-.78.78-.78 2.05 0 2.83l8.01 8c.78.78 2.05.78 2.83 0l7.99-8c.79-.79.79-2.05 0-2.83zM13.5 14.5V12H10v3H8v-4c0-.55.45-1 1-1h4.5V7.5L17 11l-3.5 3.5z',\n  category: 'M12 2 6.5 11h11z',\n  logout: 'M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4m7 14 5-5m0 0-5-5m5 5H9',\n  default: '',\n};\n\nexport const ICON_ADDITIONAL_SHAPES: Readonly<Record<string, ShapeAttributes[]>> = {\n  view: [{ type: 'circle', cx: '12', cy: '12', r: '3' }],\n  get: [\n    { type: 'circle', cx: '6', cy: '6', r: '3' },\n    { type: 'circle', cx: '18', cy: '18', r: '3' },\n    { type: 'path', d: 'm13 11 2 2-2 2' },\n  ],\n  settings: [{ type: 'circle', cx: '12', cy: '12', r: '3' }],\n  schedule: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  checkCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  cancelCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  error: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  queue: [\n    { type: 'rect', x: '2', y: '3', width: '20', height: '6', rx: '1' },\n    { type: 'rect', x: '2', y: '15', width: '20', height: '6', rx: '1' },\n  ],\n  toggleOn: [\n    { type: 'rect', x: '2', y: '7', width: '20', height: '10', rx: '5' },\n    { type: 'circle', cx: '18', cy: '12', r: '4', fill: 'color' },\n  ],\n  toggleOff: [\n    { type: 'rect', x: '2', y: '7', width: '20', height: '10', rx: '5' },\n    { type: 'circle', cx: '6', cy: '12', r: '4', fill: 'color' },\n  ],\n  playCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  visibility: [{ type: 'circle', cx: '12', cy: '12', r: '3' }],\n  record: [{ type: 'circle', cx: '12', cy: '12', r: '5', fill: 'color' }],\n  xCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  exclamationTriangle: [{ type: 'path', d: 'M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z' }],\n  person: [],\n  envelope: [{ type: 'path', d: 'm22 6-10 7L2 6' }],\n  infoCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  checkSquare: [{ type: 'rect', x: '3', y: '3', width: '18', height: '18', rx: '2' }],\n  square: [{ type: 'rect', x: '3', y: '3', width: '18', height: '18', rx: '2' }],\n  dashSquare: [{ type: 'rect', x: '3', y: '3', width: '18', height: '18', rx: '2' }],\n  people: [],\n  boxSeam: [{ type: 'path', d: 'M21 8.5v7c0 .6-.2 1.2-.6 1.7l-7 4c-.3.2-.6.3-1 .3-.3 0-.7-.1-1-.3l-7-4c-.4-.5-.6-1.1-.6-1.7v-7c0-.6.2-1.2.6-1.7l7-4c.6-.4 1.4-.4 2 0l7 4c.4.5.6 1.1.6 1.7z' }, { type: 'path', d: 'M3.3 7L12 12l8.7-5M12 22.5V12' }],\n  personBadge: [\n    { type: 'circle', cx: '12', cy: '12', r: '1.5' },\n    { type: 'path', d: 'M12 9.5v1m0 3v1m2.5-2.5h-1m-3 0h-1' }\n  ],\n  listTask: [\n    { type: 'path', d: 'M3 5l1.5 1.5L7 4' },\n    { type: 'path', d: 'M3 11l1.5 1.5L7 10' },\n    { type: 'path', d: 'M3 17l1.5 1.5L7 16' },\n  ],\n  shuffle: [],\n  motor: [\n    { type: 'circle', cx: '12', cy: '12', r: '8' },\n    { type: 'circle', cx: '12', cy: '12', r: '3', fill: 'color' },\n    { type: 'path', d: 'M12 4v2m0 12v2M4 12h2m12 0h2M7.05 7.05l1.42 1.42m7.07 7.07l1.41 1.41M7.05 16.95l1.42-1.42m7.07-7.07l1.41-1.41' }\n  ],\n  box: [{ type: 'path', d: 'M12 2.7L3.3 7v9.3l8.7 5 8.7-5V7L12 2.7z' }, { type: 'path', d: 'M12 22V12M3.3 7L12 12l8.7-5' }],\n  bell: [],\n  message: [],\n  send: [],\n  file: [{ type: 'path', d: 'M13 2v7h7' }],\n  folder: [],\n  save: [{ type: 'path', d: 'M15 3v6h4M9 21v-8h6v8' }],\n  print: [{ type: 'rect', x: '6', y: '14', width: '12', height: '8', rx: '1' }],\n  clock: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  calendar: [{ type: 'rect', x: '3', y: '4', width: '18', height: '18', rx: '2' }],\n  timer: [{ type: 'circle', cx: '12', cy: '13', r: '9' }, { type: 'path', d: 'M9 2h6' }],\n  lock: [],\n  unlock: [],\n  chart: [],\n  table: [],\n  database: [],\n  home: [{ type: 'path', d: 'M9 22V12h6v10' }],\n  menu: [],\n  arrowLeft: [],\n  arrowRight: [],\n  copy: [{ type: 'rect', x: '4', y: '8', width: '12', height: '12', rx: '2' }],\n  filter: [],\n  sort: [],\n  help: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  warning: [{ type: 'circle', cx: '12', cy: '12', r: '10' }, { type: 'circle', cx: '12', cy: '17', r: '0.5', fill: 'color' }],\n  dashboard: [],\n  settingsApplications: [],\n  route: [],\n  developerBoard: [\n    { type: 'rect', x: '5', y: '5', width: '14', height: '14', rx: '2' },\n    { type: 'rect', x: '9', y: '9', width: '6', height: '6', rx: '0.5' },\n    { type: 'circle', cx: '12', cy: '12', r: '1.5', fill: 'color' },\n  ],\n  directions: [],\n  category: [\n    { type: 'circle', cx: '17.5', cy: '17.5', r: '3.5' },\n    { type: 'rect', x: '3', y: '14', width: '7', height: '7', rx: '1' },\n  ],\n  logout: [],\n  default: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  edit: [{ type: 'rect', x: '5', y: '19', width: '14', height: '2', rx: '1' }],\n};\n"]}
+{"version":3,"file":"icon.constants.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/icon/icon.constants.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ColorType, ShapeAttributes } from './icon.types';\n\nexport const ICON_NAMES = [\n  'check',\n  'cancel',\n  'edit',\n  'delete',\n  'add',\n  'view',\n  'get',\n  'settings',\n  'schedule',\n  'refresh',\n  'checkCircle',\n  'cancelCircle',\n  'error',\n  'queue',\n  'arrowUp',\n  'arrowDown',\n  'toggleOn',\n  'toggleOff',\n  'search',\n  'upload',\n  'pendingActions',\n  'playCircle',\n  'play',\n  'stop',\n  'tune',\n  'visibility',\n  'visibilityOff',\n  'close',\n  'record',\n  'star',\n  'xCircle',\n  'key',\n  'exclamationTriangle',\n  'clipboard',\n  'download',\n  'shield',\n  'person',\n  'envelope',\n  'infoCircle',\n  'checkSquare',\n  'square',\n  'dashSquare',\n  'people',\n  'boxSeam',\n  'personBadge',\n  'listTask',\n  'shuffle',\n  'motor',\n  'box',\n  'bell',\n  'message',\n  'send',\n  'file',\n  'folder',\n  'save',\n  'print',\n  'clock',\n  'calendar',\n  'timer',\n  'lock',\n  'unlock',\n  'chart',\n  'table',\n  'database',\n  'home',\n  'menu',\n  'arrowLeft',\n  'arrowRight',\n  'copy',\n  'filter',\n  'sort',\n  'help',\n  'warning',\n  'dashboard',\n  'settingsApplications',\n  'route',\n  'developerBoard',\n  'directions',\n  'category',\n  'logout',\n  'sun',\n  'moon',\n  'default',\n] as const;\n\nexport const BASE_ICON_COLORS: Readonly<Record<ColorType, string>> = {\n  primary: '#003775c8',\n  secondary: '#6b7280',\n  warn: '#e53935',\n  success: '#4caf50',\n  dark: '#e9ecef',\n};\n\nexport const DISABLED_COLOR = '#bdbdbd';\nexport const DEFAULT_ICON_COLOR = '#222';\nexport const DISABLED_OPACITY = 0.5;\nexport const SECONDARY_WARN_OPACITY = 0.7;\nexport const DEFAULT_OPACITY = 1;\nexport const BASE_ICON_SIZE = 24;\n\n/**\n * ICON PATHS - SVG path definitions\n *\n * IMPORTANTE: Al crear o modificar iconos, SIEMPRE buscar primero en Material Design Icons oficial:\n * - Repositorio: https://github.com/google/material-design-icons\n * - Navegador: https://fonts.google.com/icons\n * - Usar paths oficiales de Material Design siempre que sea posible\n * - ViewBox: 24x24 (compatible con BASE_ICON_SIZE)\n * - Máximo 300 caracteres por línea (usar concatenación con + si es necesario)\n */\nexport const ICON_PATHS: Readonly<Record<string, string>> = {\n  check: 'M5 13l4 4L19 7',\n  cancel: 'M6 6l12 12M6 18L18 6',\n  edit: 'M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4 12.5-12.5z',\n  delete: 'M6 19a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',\n  add: 'M12 5v14M5 12h14',\n  view: 'M12 5C7 5 2.73 8.11 1 12c1.73 3.89 6 7 11 7s9.27-3.11 11-7c-1.73-3.89-6-7-11-7z',\n  get: 'm8.5 8.5 7 7',\n  settings: 'M12 1v6m0 6v10M3.34 7l5.2 3M15.46 14l5.2 3M3.34 17l5.2-3M15.46 10l5.2-3',\n  schedule: 'M12 6v6l4 2',\n  refresh: 'M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8M21 3v5h-5M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16M3 21v-5h5',\n  checkCircle: 'm9 12 2 2 4-4',\n  cancelCircle: 'm15 9-6 6m0-6 6 6',\n  error: 'M15 9L9 15M9 9l6 6',\n  queue: 'M3 12h18m-9-9v18',\n  arrowUp: 'm18 15-6-6-6 6',\n  arrowDown: 'm6 9 6 6 6-6',\n  toggleOn: '',\n  toggleOff: '',\n  search: 'm21 21-6-6m2-5a7 7 0 1 1-14 0 7 7 0 0 1 14 0z',\n  upload: 'M12 15V3m0 0l-4 4m4-4l4 4M2 17l.621 2.485A2 2 0 0 0 4.561 21h14.878a2 2 0 0 0 1.94-1.515L22 17',\n  pendingActions: 'M12 8v4l3 3m6-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0z',\n  playCircle: 'M14.752 11.168l-3.197-2.132A1 1 0 0 0 10 9.87v4.263a1 1 0 0 0 1.555.832l3.197-2.132a1 1 0 0 0 0-1.664z',\n  play: 'M8 5v14l11-7z',\n  stop: 'M6 6h12v12H6z',\n  // Material Design: tune (adjustments/sliders)\n  tune: 'M3 17v2h6v-2H3zM3 5v2h10V5H3zm10 16v-2h8v-2h-8v-2h-2v6h2zM7 9v2H3v2h4v2h2V9H7zm14 4v-2H11v2h10zm-6-4h2V7h4V5h-4V3h-2v6z',\n  visibility: 'M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5z',\n  visibilityOff:\n    'M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7z' +\n    'M2 4.27l2.28 2.28.46.46A11.804 11.804 0 0 0 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27z' +\n    'M7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2z' +\n    'm4.31-.78 3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z',\n  close: 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z',\n  record: '',\n  star: 'M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z',\n  xCircle: 'M15 9l-6 6m0-6l6 6',\n  key: 'M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4',\n  exclamationTriangle: 'M12 9v4m0 4h.01',\n  clipboard: 'M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2',\n  download: 'M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4m4-5l5 5m0 0l5-5m-5 5V3',\n  shield: 'M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z',\n  // Material Design: person (single user)\n  person: 'M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z',\n  envelope: 'M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z',\n  infoCircle: 'M12 16v-4m0-4h.01',\n  checkSquare: 'm9 11 3 3L22 4',\n  square: '',\n  dashSquare: 'M8 12h8',\n  people:\n    'M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3z' +\n    'm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z',\n  boxSeam: 'M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z',\n  personBadge: 'M12 2L4 6v5c0 5.55 3.84 10.74 8 12 4.16-1.26 8-6.45 8-12V6l-8-4z',\n  listTask: 'M9 6h12M9 12h12M9 18h12',\n  shuffle: 'M16 3h5v5M4 20L21 3M21 16v5h-5M15 15l6 6M4 4l5 5',\n  motor: 'M9 3v3m6-3v3M9 18v3m6-3v3M3 9h3M3 15h3m12-6h3m-3 6h3',\n  box: 'M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16V8z',\n  bell: 'M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9M13.73 21a2 2 0 0 1-3.46 0',\n  message: 'M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z',\n  send: 'M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z',\n  file: 'M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z',\n  folder: 'M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z',\n  save: 'M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z',\n  print: 'M6 9V2h12v7M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2',\n  clock: 'M12 6v6l4 2',\n  calendar: 'M8 2v4m8-4v4M3 10h18',\n  timer: 'M12 8v4l2 2',\n  lock: 'M19 11H5a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7a2 2 0 0 0-2-2zM7 11V7a5 5 0 0 1 10 0v4',\n  unlock: 'M19 11H5a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7a2 2 0 0 0-2-2zM7 11V7a5 5 0 0 1 9.9-1',\n  chart: 'M3 3v18h18M7 16l4-4 4 4 6-6',\n  table: 'M3 3h18v18H3zM3 9h18M3 15h18M9 3v18',\n  database: 'M12 8c-4.97 0-9-1.34-9-3s4.03-3 9-3 9 1.34 9 3-4.03 3-9 3zM3 5v5c0 1.66 4.03 3 9 3s9-1.34 9-3V5M3 10v5c0 1.66 4.03 3 9 3s9-1.34 9-3v-5',\n  home: 'm3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z',\n  menu: 'M3 12h18M3 6h18M3 18h18',\n  arrowLeft: 'm19 12H5m0 0 7 7m-7-7 7-7',\n  arrowRight: 'm5 12 7 7m0 0 5-5m-5 5V5',\n  copy: 'M8 4v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V7.242a2 2 0 0 0-.602-1.43L16.083 2.57A2 2 0 0 0 14.685 2H10a2 2 0 0 0-2 2z',\n  filter: 'M22 3H2l8 9.46V19l4 2v-8.54L22 3z',\n  sort: 'M11 5h10M11 9h7M11 13h4M3 17l3 3m0 0l3-3m-3 3V4',\n  help: 'M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3m.08 4h.01',\n  warning: 'M12 9v4',\n  dashboard: 'M3 13h8V3H3zm0 8h8v-6H3zm10 0h8V11h-8zm0-18v6h8V3z',\n  // Material Design: settings_applications (system profiles/configuration)\n  settingsApplications:\n    'M12 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm7-7H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2z' +\n    'm-1.75 9c0 .23-.02.46-.05.68l1.48 1.16c.13.11.17.3.08.45l-1.4 2.42c-.09.15-.27.21-.43.15l-1.74-.7c-.36.28-.76.51-1.18.69l-.26 1.85c-.03.17-.18.3-.35.3h-2.8' +\n    'c-.17 0-.32-.13-.35-.29l-.26-1.85c-.43-.18-.82-.41-1.18-.69l-1.74.7c-.16.06-.34 0-.43-.15l-1.4-2.42c-.09-.15-.05-.34.08-.45l1.48-1.16c-.03-.23-.05-.46-.05-.69 0-.23.02-.46.05-.68' +\n    'l-1.48-1.16c-.13-.11-.17-.3-.08-.45l1.4-2.42c.09-.15.27-.21.43-.15l1.74.7c.36-.28.76-.51 1.18-.69l.26-1.85c.03-.17.18-.3.35-.3h2.8' +\n    'c.17 0 .32.13.35.29l.26 1.85c.43.18.82.41 1.18.69l1.74-.7c.16-.06.34 0 .43.15l1.4 2.42c.09.15.05.34-.08.45l-1.48 1.16c.03.23.05.46.05.69z',\n  route: 'M19 15.18V7c0-2.21-1.79-4-4-4s-4 1.79-4 4v10c0 1.1-.9 2-2 2s-2-.9-2-2V8.82C8.16 8.4 9 7.3 9 6c0-1.66-1.34-3-3-3S3 4.34 3 6c0 1.3.84 2.4 2 2.82V17c0 2.21 1.79 4 4 4s4-1.79 4-4V7c0-1.1.9-2 2-2s2 .9 2 2v8.18A2.996 2.996 0 0 0 15 18c0 1.66 1.34 3 3 3s3-1.34 3-3c0-1.3-.84-2.4-2-2.82z',\n  developerBoard: 'M9 2v4m6-4v4M9 18v4m6-18v4M2 9h4M2 15h4m16-6h4m-4 6h4',\n  // Material Design: directions (map navigation icon with arrow)\n  directions: 'm21.41 10.59-7.99-8c-.78-.78-2.05-.78-2.83 0l-8.01 8c-.78.78-.78 2.05 0 2.83l8.01 8c.78.78 2.05.78 2.83 0l7.99-8c.79-.79.79-2.05 0-2.83zM13.5 14.5V12H10v3H8v-4c0-.55.45-1 1-1h4.5V7.5L17 11l-3.5 3.5z',\n  category: 'M12 2 6.5 11h11z',\n  logout: 'M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4m7 14 5-5m0 0-5-5m5 5H9',\n  // Material Design: light_mode (sun icon)\n  sun:\n    'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zM2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1zm18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1z' +\n    'M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1zm0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1z' +\n    'M5.99 4.58c-.39-.39-1.03-.39-1.41 0-.39.39-.39 1.03 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41L5.99 4.58zm12.37 12.37c-.39-.39-1.03-.39-1.41 0-.39.39-.39 1.03 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0 .39-.39.39-1.03 0-1.41l-1.06-1.06z' +\n    'm1.06-10.96c.39-.39.39-1.03 0-1.41-.39-.39-1.03-.39-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0l1.06-1.06zM7.05 18.36c.39-.39.39-1.03 0-1.41-.39-.39-1.03-.39-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0l1.06-1.06z',\n  // Material Design: dark_mode (moon icon)\n  moon:\n    'M9.37 5.51C9.19 6.15 9.1 6.82 9.1 7.5c0 4.08 3.32 7.4 7.4 7.4.68 0 1.35-.09 1.99-.27C17.45 17.19 14.93 19 12 19c-3.86 0-7-3.14-7-7 0-2.93 1.81-5.45 4.37-6.49z' +\n    'M12 3c-4.97 0-9 4.03-9 9s4.03 9 9 9 9-4.03 9-9c0-.46-.04-.92-.1-1.36-.98 1.37-2.58 2.26-4.4 2.26-2.98 0-5.4-2.42-5.4-5.4 0-1.81.89-3.42 2.26-4.4-.44-.06-.9-.1-1.36-.1z',\n  default: '',\n};\n\nexport const ICON_ADDITIONAL_SHAPES: Readonly<Record<string, ShapeAttributes[]>> = {\n  view: [{ type: 'circle', cx: '12', cy: '12', r: '3' }],\n  get: [\n    { type: 'circle', cx: '6', cy: '6', r: '3' },\n    { type: 'circle', cx: '18', cy: '18', r: '3' },\n    { type: 'path', d: 'm13 11 2 2-2 2' },\n  ],\n  settings: [{ type: 'circle', cx: '12', cy: '12', r: '3' }],\n  schedule: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  checkCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  cancelCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  error: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  queue: [\n    { type: 'rect', x: '2', y: '3', width: '20', height: '6', rx: '1' },\n    { type: 'rect', x: '2', y: '15', width: '20', height: '6', rx: '1' },\n  ],\n  toggleOn: [\n    { type: 'rect', x: '2', y: '7', width: '20', height: '10', rx: '5' },\n    { type: 'circle', cx: '18', cy: '12', r: '4', fill: 'color' },\n  ],\n  toggleOff: [\n    { type: 'rect', x: '2', y: '7', width: '20', height: '10', rx: '5' },\n    { type: 'circle', cx: '6', cy: '12', r: '4', fill: 'color' },\n  ],\n  playCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  visibility: [{ type: 'circle', cx: '12', cy: '12', r: '3' }],\n  record: [{ type: 'circle', cx: '12', cy: '12', r: '5', fill: 'color' }],\n  xCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  exclamationTriangle: [{ type: 'path', d: 'M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z' }],\n  person: [],\n  envelope: [{ type: 'path', d: 'm22 6-10 7L2 6' }],\n  infoCircle: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  checkSquare: [{ type: 'rect', x: '3', y: '3', width: '18', height: '18', rx: '2' }],\n  square: [{ type: 'rect', x: '3', y: '3', width: '18', height: '18', rx: '2' }],\n  dashSquare: [{ type: 'rect', x: '3', y: '3', width: '18', height: '18', rx: '2' }],\n  people: [],\n  boxSeam: [{ type: 'path', d: 'M21 8.5v7c0 .6-.2 1.2-.6 1.7l-7 4c-.3.2-.6.3-1 .3-.3 0-.7-.1-1-.3l-7-4c-.4-.5-.6-1.1-.6-1.7v-7c0-.6.2-1.2.6-1.7l7-4c.6-.4 1.4-.4 2 0l7 4c.4.5.6 1.1.6 1.7z' }, { type: 'path', d: 'M3.3 7L12 12l8.7-5M12 22.5V12' }],\n  personBadge: [\n    { type: 'circle', cx: '12', cy: '12', r: '1.5' },\n    { type: 'path', d: 'M12 9.5v1m0 3v1m2.5-2.5h-1m-3 0h-1' }\n  ],\n  listTask: [\n    { type: 'path', d: 'M3 5l1.5 1.5L7 4' },\n    { type: 'path', d: 'M3 11l1.5 1.5L7 10' },\n    { type: 'path', d: 'M3 17l1.5 1.5L7 16' },\n  ],\n  shuffle: [],\n  motor: [\n    { type: 'circle', cx: '12', cy: '12', r: '8' },\n    { type: 'circle', cx: '12', cy: '12', r: '3', fill: 'color' },\n    { type: 'path', d: 'M12 4v2m0 12v2M4 12h2m12 0h2M7.05 7.05l1.42 1.42m7.07 7.07l1.41 1.41M7.05 16.95l1.42-1.42m7.07-7.07l1.41-1.41' }\n  ],\n  box: [{ type: 'path', d: 'M12 2.7L3.3 7v9.3l8.7 5 8.7-5V7L12 2.7z' }, { type: 'path', d: 'M12 22V12M3.3 7L12 12l8.7-5' }],\n  bell: [],\n  message: [],\n  send: [],\n  file: [{ type: 'path', d: 'M13 2v7h7' }],\n  folder: [],\n  save: [{ type: 'path', d: 'M15 3v6h4M9 21v-8h6v8' }],\n  print: [{ type: 'rect', x: '6', y: '14', width: '12', height: '8', rx: '1' }],\n  clock: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  calendar: [{ type: 'rect', x: '3', y: '4', width: '18', height: '18', rx: '2' }],\n  timer: [{ type: 'circle', cx: '12', cy: '13', r: '9' }, { type: 'path', d: 'M9 2h6' }],\n  lock: [],\n  unlock: [],\n  chart: [],\n  table: [],\n  database: [],\n  home: [{ type: 'path', d: 'M9 22V12h6v10' }],\n  menu: [],\n  arrowLeft: [],\n  arrowRight: [],\n  copy: [{ type: 'rect', x: '4', y: '8', width: '12', height: '12', rx: '2' }],\n  filter: [],\n  sort: [],\n  help: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  warning: [{ type: 'circle', cx: '12', cy: '12', r: '10' }, { type: 'circle', cx: '12', cy: '17', r: '0.5', fill: 'color' }],\n  dashboard: [],\n  settingsApplications: [],\n  route: [],\n  developerBoard: [\n    { type: 'rect', x: '5', y: '5', width: '14', height: '14', rx: '2' },\n    { type: 'rect', x: '9', y: '9', width: '6', height: '6', rx: '0.5' },\n    { type: 'circle', cx: '12', cy: '12', r: '1.5', fill: 'color' },\n  ],\n  directions: [],\n  category: [\n    { type: 'circle', cx: '17.5', cy: '17.5', r: '3.5' },\n    { type: 'rect', x: '3', y: '14', width: '7', height: '7', rx: '1' },\n  ],\n  logout: [],\n  sun: [],\n  moon: [],\n  default: [{ type: 'circle', cx: '12', cy: '12', r: '10' }],\n  edit: [{ type: 'rect', x: '5', y: '19', width: '14', height: '2', rx: '1' }],\n};\n"]}

package/esm2022/lib/icon/icon.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.types.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/icon/icon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ICON_NAMES } from './icon.constants';\n\nexport type IconType = (typeof ICON_NAMES)[number];\nexport type ColorType = 'primary' | 'secondary' | 'warn' | 'success';\nexport type ButtonType = 'button' | 'submit' | 'reset';\n\nexport interface ShapeAttributes {\n  type: 'circle' | 'rect' | 'path';\n  [key: string]: string | number;\n}\n"]}
+{"version":3,"file":"icon.types.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/icon/icon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ICON_NAMES } from './icon.constants';\n\nexport type IconType = (typeof ICON_NAMES)[number];\nexport type ColorType = 'primary' | 'secondary' | 'warn' | 'success' | 'dark';\nexport type ButtonType = 'button' | 'submit' | 'reset';\n\nexport interface ShapeAttributes {\n  type: 'circle' | 'rect' | 'path';\n  [key: string]: string | number;\n}\n"]}

package/esm2022/lib/modal/modal.component.js

@@ -77,10 +77,10 @@ export class C80ModalComponent {
         return this.config().noText ?? 'No';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: C80ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: C80ModalComponent, isStandalone: true, selector: "c80-modal", ngImport: i0, template: "<!-- Modal Backdrop -->\r\n@if (isOpen()) {\r\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\r\n\r\n  <!-- Modal Container -->\r\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\r\n\r\n    <!-- Modal Header -->\r\n    <div class=\"modal-header\">\r\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\r\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" />\r\n    </div>\r\n\r\n    <!-- Modal Body -->\r\n    <div class=\"modal-body\">\r\n      <p class=\"modal-message\">{{ config().message }}</p>\r\n    </div>\r\n\r\n    <!-- Modal Footer -->\r\n    <div class=\"modal-footer\">\r\n\r\n      <!-- Info Modal - Solo OK -->\r\n      @if (showOkButton()) {\r\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" color=\"primary\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\r\n      }\r\n\r\n      <!-- Yes/No Modal -->\r\n      @if (showYesNoButtons()) {\r\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"secondary\" (iconClick)=\"onNo()\" [border]=\"true\" />\r\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" color=\"primary\" (iconClick)=\"onYes()\" [border]=\"true\" />\r\n      }\r\n\r\n      <!-- Confirm Modal -->\r\n      @if (showConfirmButtons()) {\r\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"secondary\" (iconClick)=\"onCancel()\" [border]=\"true\" />\r\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" color=\"primary\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\r\n      }\r\n\r\n    </div>\r\n  </dialog>\r\n</div>\r\n}", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1050;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;outline:none}.modal-backdrop.show{opacity:1}.modal-container{background:#fff;border-radius:8px;box-shadow:0 4px 20px #00000026;border:none;max-width:400px;width:90%;max-height:90vh;overflow:hidden;transform:scale(.9) translateY(-10px);transition:all .15s ease-out;position:relative;padding:0}.modal-container.show{transform:scale(1) translateY(0)}.modal-container::backdrop{background:transparent}.modal-header{display:flex;align-items:center;gap:8px;padding:16px 20px 12px;border-bottom:1px solid #e5e7eb;background:#f8f9fa}.modal-header .modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:#1f2937;line-height:1.3}.modal-body{padding:16px 20px}.modal-body .modal-message{margin:0;font-size:14px;line-height:1.5;color:#374151;white-space:pre-line}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 16px;background:#f8f9fa;border-top:1px solid #e5e7eb}@media(max-width:768px){.modal-container{width:95%;margin:10px}.modal-header{padding:12px 16px 8px}.modal-header .modal-title{font-size:15px}.modal-body{padding:12px 16px}.modal-body .modal-message{font-size:13px}.modal-footer{padding:8px 16px 12px;flex-direction:column}}@keyframes modalFadeIn{0%{opacity:0;transform:scale(.8) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes modalFadeOut{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.8) translateY(-20px)}}\n"], dependencies: [{ kind: "component", type: C80IconComponent, selector: "c80-icon", inputs: ["icon", "color", "customColor", "disabled", "size", "button", "border", "type", "textLeft", "textRight"], outputs: ["iconClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: C80ModalComponent, isStandalone: true, selector: "c80-modal", ngImport: i0, template: "<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" color=\"warn\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" color=\"dark\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" color=\"dark\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"warn\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" color=\"dark\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"warn\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;outline:none}.modal-backdrop.show{opacity:1}.modal-container{background:var(--color-bg-primary);border-radius:8px;box-shadow:0 4px 20px #00000026;border:1px solid var(--color-border-default);max-width:400px;width:90%;max-height:90vh;overflow:hidden;transform:scale(.9) translateY(-10px);transition:all .15s ease-out;position:relative;padding:0}.modal-container.show{transform:scale(1) translateY(0)}.modal-container::backdrop{background:transparent}.modal-header{display:flex;align-items:center;gap:8px;padding:16px 20px 12px;border-bottom:1px solid var(--color-border-default);background:var(--color-bg-secondary)}.modal-header .modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:var(--color-text-primary);line-height:1.3}.modal-body{padding:16px 20px}.modal-body .modal-message{margin:0;font-size:14px;line-height:1.5;color:var(--color-text-primary);white-space:pre-line}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 16px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-default)}@media(max-width:768px){.modal-container{width:95%;margin:10px}.modal-header{padding:12px 16px 8px}.modal-header .modal-title{font-size:15px}.modal-body{padding:12px 16px}.modal-body .modal-message{font-size:13px}.modal-footer{padding:8px 16px 12px;flex-direction:column}}\n"], dependencies: [{ kind: "component", type: C80IconComponent, selector: "c80-icon", inputs: ["icon", "color", "customColor", "disabled", "size", "button", "border", "type", "textLeft", "textRight"], outputs: ["iconClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: C80ModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c80-modal', standalone: true, imports: [C80IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Modal Backdrop -->\r\n@if (isOpen()) {\r\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\r\n\r\n  <!-- Modal Container -->\r\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\r\n\r\n    <!-- Modal Header -->\r\n    <div class=\"modal-header\">\r\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\r\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" />\r\n    </div>\r\n\r\n    <!-- Modal Body -->\r\n    <div class=\"modal-body\">\r\n      <p class=\"modal-message\">{{ config().message }}</p>\r\n    </div>\r\n\r\n    <!-- Modal Footer -->\r\n    <div class=\"modal-footer\">\r\n\r\n      <!-- Info Modal - Solo OK -->\r\n      @if (showOkButton()) {\r\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" color=\"primary\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\r\n      }\r\n\r\n      <!-- Yes/No Modal -->\r\n      @if (showYesNoButtons()) {\r\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"secondary\" (iconClick)=\"onNo()\" [border]=\"true\" />\r\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" color=\"primary\" (iconClick)=\"onYes()\" [border]=\"true\" />\r\n      }\r\n\r\n      <!-- Confirm Modal -->\r\n      @if (showConfirmButtons()) {\r\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"secondary\" (iconClick)=\"onCancel()\" [border]=\"true\" />\r\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" color=\"primary\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\r\n      }\r\n\r\n    </div>\r\n  </dialog>\r\n</div>\r\n}", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1050;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;outline:none}.modal-backdrop.show{opacity:1}.modal-container{background:#fff;border-radius:8px;box-shadow:0 4px 20px #00000026;border:none;max-width:400px;width:90%;max-height:90vh;overflow:hidden;transform:scale(.9) translateY(-10px);transition:all .15s ease-out;position:relative;padding:0}.modal-container.show{transform:scale(1) translateY(0)}.modal-container::backdrop{background:transparent}.modal-header{display:flex;align-items:center;gap:8px;padding:16px 20px 12px;border-bottom:1px solid #e5e7eb;background:#f8f9fa}.modal-header .modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:#1f2937;line-height:1.3}.modal-body{padding:16px 20px}.modal-body .modal-message{margin:0;font-size:14px;line-height:1.5;color:#374151;white-space:pre-line}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 16px;background:#f8f9fa;border-top:1px solid #e5e7eb}@media(max-width:768px){.modal-container{width:95%;margin:10px}.modal-header{padding:12px 16px 8px}.modal-header .modal-title{font-size:15px}.modal-body{padding:12px 16px}.modal-body .modal-message{font-size:13px}.modal-footer{padding:8px 16px 12px;flex-direction:column}}@keyframes modalFadeIn{0%{opacity:0;transform:scale(.8) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes modalFadeOut{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.8) translateY(-20px)}}\n"] }]
+            args: [{ selector: 'c80-modal', standalone: true, imports: [C80IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" color=\"warn\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" color=\"dark\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" color=\"dark\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"warn\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" color=\"dark\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"warn\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;outline:none}.modal-backdrop.show{opacity:1}.modal-container{background:var(--color-bg-primary);border-radius:8px;box-shadow:0 4px 20px #00000026;border:1px solid var(--color-border-default);max-width:400px;width:90%;max-height:90vh;overflow:hidden;transform:scale(.9) translateY(-10px);transition:all .15s ease-out;position:relative;padding:0}.modal-container.show{transform:scale(1) translateY(0)}.modal-container::backdrop{background:transparent}.modal-header{display:flex;align-items:center;gap:8px;padding:16px 20px 12px;border-bottom:1px solid var(--color-border-default);background:var(--color-bg-secondary)}.modal-header .modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:var(--color-text-primary);line-height:1.3}.modal-body{padding:16px 20px}.modal-body .modal-message{margin:0;font-size:14px;line-height:1.5;color:var(--color-text-primary);white-space:pre-line}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 16px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-default)}@media(max-width:768px){.modal-container{width:95%;margin:10px}.modal-header{padding:12px 16px 8px}.modal-header .modal-title{font-size:15px}.modal-body{padding:12px 16px}.modal-body .modal-message{font-size:13px}.modal-footer{padding:8px 16px 12px;flex-direction:column}}\n"] }]
         }], ctorParameters: () => [] });
 //# sourceMappingURL=modal.component.js.map

package/esm2022/lib/modal/modal.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/modal/modal.component.ts","../../../../../libs/ui/src/lib/modal/modal.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, computed, effect, inject, ChangeDetectionStrategy } from '@angular/core';\nimport { ModalService } from './modal.service';\nimport { C80IconComponent } from './../icon';\n\nexport type ModalType = 'info' | 'confirm' | 'yesNo' | 'warning' | 'error';\n\nexport interface ModalConfig {\n  title: string;\n  message: string;\n  type?: ModalType;\n  confirmText?: string;\n  cancelText?: string;\n  yesText?: string;\n  noText?: string;\n  showCancel?: boolean;\n}\n\nexport interface ModalResult {\n  action: 'confirm' | 'cancel' | 'yes' | 'no';\n  confirmed: boolean;\n}\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'c80-modal',\n  standalone: true,\n  imports: [C80IconComponent],\n  templateUrl: './modal.component.html',\n  styleUrl: './modal.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class C80ModalComponent {\n  private readonly modalService = inject(ModalService);\n\n  readonly isOpen = this.modalService.modalState.isOpen;\n  readonly config = this.modalService.modalState.config;\n  readonly isVisible = computed(() => this.isOpen());\n\n  constructor() {\n    effect(() => {\n      if (this.isOpen()) {\n        // Auto-focus modal when opened for accessibility\n        setTimeout(() => {\n          const backdrop = document.querySelector(\n            '.modal-backdrop'\n          ) as HTMLElement;\n          if (backdrop) {\n            backdrop.focus();\n          }\n        }, 100);\n      }\n    });\n  }\n\n  onConfirm() {\n    this.modalService.handleResult({ action: 'confirm', confirmed: true });\n  }\n\n  onCancel() {\n    this.modalService.handleResult({ action: 'cancel', confirmed: false });\n  }\n\n  onYes() {\n    this.modalService.handleResult({ action: 'yes', confirmed: true });\n  }\n\n  onNo() {\n    this.modalService.handleResult({ action: 'no', confirmed: false });\n  }\n\n  closeModal() {\n    this.modalService.closeModal();\n  }\n\n  onBackdropClick(event: Event) {\n    if (event.target === event.currentTarget) {\n      this.closeModal();\n    }\n  }\n\n  getPrimaryButtonClass(): string {\n    const configValue = this.config();\n    switch (configValue.type) {\n      case 'warning':\n        return 'btn-warning';\n      case 'error':\n        return 'btn-danger';\n      case 'confirm':\n      case 'yesNo':\n        return 'btn-primary';\n      default:\n        return 'btn-info';\n    }\n  }\n\n  showYesNoButtons(): boolean {\n    return this.config().type === 'yesNo';\n  }\n\n  showConfirmButtons(): boolean {\n    const type = this.config().type;\n    return type === 'confirm' || type === 'warning' || type === 'error';\n  }\n\n  showOkButton(): boolean {\n    return this.config().type === 'info';\n  }\n\n  getConfirmText(): string {\n    return this.config().confirmText ?? 'Confirmar';\n  }\n\n  getCancelText(): string {\n    return this.config().cancelText ?? 'Cancelar';\n  }\n\n  getYesText(): string {\n    return this.config().yesText ?? 'Sí';\n  }\n\n  getNoText(): string {\n    return this.config().noText ?? 'No';\n  }\n}\n","<!-- Modal Backdrop -->\r\n@if (isOpen()) {\r\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\r\n\r\n  <!-- Modal Container -->\r\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\r\n\r\n    <!-- Modal Header -->\r\n    <div class=\"modal-header\">\r\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\r\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" />\r\n    </div>\r\n\r\n    <!-- Modal Body -->\r\n    <div class=\"modal-body\">\r\n      <p class=\"modal-message\">{{ config().message }}</p>\r\n    </div>\r\n\r\n    <!-- Modal Footer -->\r\n    <div class=\"modal-footer\">\r\n\r\n      <!-- Info Modal - Solo OK -->\r\n      @if (showOkButton()) {\r\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" color=\"primary\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\r\n      }\r\n\r\n      <!-- Yes/No Modal -->\r\n      @if (showYesNoButtons()) {\r\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"secondary\" (iconClick)=\"onNo()\" [border]=\"true\" />\r\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" color=\"primary\" (iconClick)=\"onYes()\" [border]=\"true\" />\r\n      }\r\n\r\n      <!-- Confirm Modal -->\r\n      @if (showConfirmButtons()) {\r\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"secondary\" (iconClick)=\"onCancel()\" [border]=\"true\" />\r\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" color=\"primary\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\r\n      }\r\n\r\n    </div>\r\n  </dialog>\r\n</div>\r\n}"]}
+{"version":3,"file":"modal.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/modal/modal.component.ts","../../../../../libs/ui/src/lib/modal/modal.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, computed, effect, inject, ChangeDetectionStrategy } from '@angular/core';\nimport { ModalService } from './modal.service';\nimport { C80IconComponent } from './../icon';\n\nexport type ModalType = 'info' | 'confirm' | 'yesNo' | 'warning' | 'error';\n\nexport interface ModalConfig {\n  title: string;\n  message: string;\n  type?: ModalType;\n  confirmText?: string;\n  cancelText?: string;\n  yesText?: string;\n  noText?: string;\n  showCancel?: boolean;\n}\n\nexport interface ModalResult {\n  action: 'confirm' | 'cancel' | 'yes' | 'no';\n  confirmed: boolean;\n}\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'c80-modal',\n  standalone: true,\n  imports: [C80IconComponent],\n  templateUrl: './modal.component.html',\n  styleUrl: './modal.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class C80ModalComponent {\n  private readonly modalService = inject(ModalService);\n\n  readonly isOpen = this.modalService.modalState.isOpen;\n  readonly config = this.modalService.modalState.config;\n  readonly isVisible = computed(() => this.isOpen());\n\n  constructor() {\n    effect(() => {\n      if (this.isOpen()) {\n        // Auto-focus modal when opened for accessibility\n        setTimeout(() => {\n          const backdrop = document.querySelector(\n            '.modal-backdrop'\n          ) as HTMLElement;\n          if (backdrop) {\n            backdrop.focus();\n          }\n        }, 100);\n      }\n    });\n  }\n\n  onConfirm() {\n    this.modalService.handleResult({ action: 'confirm', confirmed: true });\n  }\n\n  onCancel() {\n    this.modalService.handleResult({ action: 'cancel', confirmed: false });\n  }\n\n  onYes() {\n    this.modalService.handleResult({ action: 'yes', confirmed: true });\n  }\n\n  onNo() {\n    this.modalService.handleResult({ action: 'no', confirmed: false });\n  }\n\n  closeModal() {\n    this.modalService.closeModal();\n  }\n\n  onBackdropClick(event: Event) {\n    if (event.target === event.currentTarget) {\n      this.closeModal();\n    }\n  }\n\n  getPrimaryButtonClass(): string {\n    const configValue = this.config();\n    switch (configValue.type) {\n      case 'warning':\n        return 'btn-warning';\n      case 'error':\n        return 'btn-danger';\n      case 'confirm':\n      case 'yesNo':\n        return 'btn-primary';\n      default:\n        return 'btn-info';\n    }\n  }\n\n  showYesNoButtons(): boolean {\n    return this.config().type === 'yesNo';\n  }\n\n  showConfirmButtons(): boolean {\n    const type = this.config().type;\n    return type === 'confirm' || type === 'warning' || type === 'error';\n  }\n\n  showOkButton(): boolean {\n    return this.config().type === 'info';\n  }\n\n  getConfirmText(): string {\n    return this.config().confirmText ?? 'Confirmar';\n  }\n\n  getCancelText(): string {\n    return this.config().cancelText ?? 'Cancelar';\n  }\n\n  getYesText(): string {\n    return this.config().yesText ?? 'Sí';\n  }\n\n  getNoText(): string {\n    return this.config().noText ?? 'No';\n  }\n}\n","<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" color=\"warn\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" color=\"dark\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" color=\"dark\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"warn\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" color=\"dark\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"warn\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}"]}

package/esm2022/lib/select/select.component.js

@@ -70,10 +70,10 @@ export class SelectComponent {
         this.searchTerm.set('');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: SelectComponent, isStandalone: true, selector: "c80-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", opened: "opened" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\n  <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() || loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\n    (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\n    <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\n      @if (loading()) {\n      Cargando...\n      } @else {\n      {{ getSelectedLabel() }}\n      }\n    </span>\n    <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">\u25BC</span>\n  </button>\n\n  @if (isOpen()) {\n  <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\n    @if (filterable()) {\n    <div class=\"k-select__search\">\n      <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\n    </div>\n    }\n\n    <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\n      -- {{ placeholder() }} --\n    </button>\n\n    @if (loading()) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      Cargando...\n    </button>\n    } @else if (filteredOptions().length === 0) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\n    </button>\n    } @else {\n    @for (option of filteredOptions(); track option.value) {\n    <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\n      (keydown.enter)=\"selectOption(option)\">\n      {{ option.label }}\n    </button>\n    }\n    }\n  </div>\n  }\n</div>", styles: [".k-select{position:relative;width:100%;font-family:inherit}.k-select--disabled{opacity:.6;pointer-events:none}.k-select__control{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:8px 12px;border:1px solid rgba(0,0,0,.23);border-radius:4px;background-color:#fff;cursor:pointer;transition:all .2s;text-align:left}.k-select__control:hover:not(:disabled){border-color:#000000de}.k-select__control:disabled{cursor:not-allowed;opacity:.6}.k-select--open .k-select__control{border-color:#3f51b5;border-width:2px;padding:7px 11px}.k-select__value{flex:1;font-size:.875rem;color:#000000de;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-select__value--placeholder{color:#00000061}.k-select__arrow{font-size:.5rem;color:#0000008a;transition:transform .2s;margin-left:6px;flex-shrink:0}.k-select__arrow--up{transform:rotate(180deg)}.k-select__backdrop{position:fixed;inset:0;z-index:999;background-color:transparent}.k-select__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;background-color:#fff;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;z-index:1000;animation:fadeIn .15s ease-out}.k-select__search{position:sticky;top:0;padding:8px;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12);z-index:1}.k-select__search-input{width:100%;padding:6px 10px;font-size:.875rem;border:1px solid rgba(0,0,0,.23);border-radius:4px;outline:none;transition:border-color .2s}.k-select__search-input:focus{border-color:#3f51b5}.k-select__search-input::placeholder{color:#00000061}.k-select__option{width:100%;padding:8px 12px;font-size:.875rem;color:#000000de;cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;text-align:left}.k-select__option:hover:not(.k-select__option--disabled):not(:disabled){background-color:#0000000a}.k-select__option--selected{background-color:#3f51b51f;font-weight:500}.k-select__option--selected:hover:not(:disabled){background-color:#3f51b529}.k-select__option--disabled{color:#00000061;cursor:default}.k-select__option:disabled{cursor:not-allowed;opacity:.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: SelectComponent, isStandalone: true, selector: "c80-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", opened: "opened" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\n  <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() || loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\n    (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\n    <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\n      @if (loading()) {\n      Cargando...\n      } @else {\n      {{ getSelectedLabel() }}\n      }\n    </span>\n    <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">\u25BC</span>\n  </button>\n\n  @if (isOpen()) {\n  <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\n    @if (filterable()) {\n    <div class=\"k-select__search\">\n      <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\n    </div>\n    }\n\n    <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\n      -- {{ placeholder() }} --\n    </button>\n\n    @if (loading()) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      Cargando...\n    </button>\n    } @else if (filteredOptions().length === 0) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\n    </button>\n    } @else {\n    @for (option of filteredOptions(); track option.value) {\n    <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\n      (keydown.enter)=\"selectOption(option)\">\n      {{ option.label }}\n    </button>\n    }\n    }\n  </div>\n  }\n</div>", styles: [".k-select{position:relative;width:100%;font-family:inherit}.k-select--disabled{opacity:.6;pointer-events:none}.k-select__control{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--color-border-default);border-radius:4px;background-color:var(--color-bg-primary);cursor:pointer;transition:all .2s;text-align:left;outline:none}.k-select__control:hover:not(:disabled){border-color:var(--color-border-medium)}.k-select__control:disabled{cursor:not-allowed;opacity:.6}.k-select__control:focus{outline:none}.k-select--open .k-select__control{border-color:var(--color-border-medium)}.k-select__value{flex:1;font-size:.875rem;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-select__value--placeholder{color:var(--color-text-muted)}.k-select__arrow{font-size:.5rem;color:var(--color-text-secondary);transition:transform .2s;margin-left:6px;flex-shrink:0}.k-select__arrow--up{transform:rotate(180deg)}.k-select__backdrop{position:fixed;inset:0;z-index:999;background-color:transparent}.k-select__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;background-color:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:4px;box-shadow:var(--shadow-lg);z-index:1000;animation:fadeIn .15s ease-out}.k-select__search{position:sticky;top:0;padding:8px;background-color:var(--color-bg-primary);border-bottom:1px solid var(--color-border-default);z-index:1}.k-select__search-input{width:100%;padding:6px 10px;font-size:.875rem;border:1px solid var(--color-border-default);border-radius:4px;outline:none;transition:border-color .2s;background-color:var(--color-bg-primary);color:var(--color-text-primary)}.k-select__search-input:focus{border-color:var(--color-icon-primary)}.k-select__search-input::placeholder{color:var(--color-text-muted)}.k-select__option{width:100%;padding:8px 12px;font-size:.875rem;color:var(--color-text-primary);cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;text-align:left}.k-select__option:hover:not(.k-select__option--disabled):not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--selected{background-color:var(--color-bg-tertiary);font-weight:500}.k-select__option--selected:hover:not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--disabled{color:var(--color-text-muted);cursor:default}.k-select__option:disabled{cursor:not-allowed;opacity:.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c80-select', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\n  <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() || loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\n    (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\n    <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\n      @if (loading()) {\n      Cargando...\n      } @else {\n      {{ getSelectedLabel() }}\n      }\n    </span>\n    <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">\u25BC</span>\n  </button>\n\n  @if (isOpen()) {\n  <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\n    @if (filterable()) {\n    <div class=\"k-select__search\">\n      <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\n    </div>\n    }\n\n    <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\n      -- {{ placeholder() }} --\n    </button>\n\n    @if (loading()) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      Cargando...\n    </button>\n    } @else if (filteredOptions().length === 0) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\n    </button>\n    } @else {\n    @for (option of filteredOptions(); track option.value) {\n    <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\n      (keydown.enter)=\"selectOption(option)\">\n      {{ option.label }}\n    </button>\n    }\n    }\n  </div>\n  }\n</div>", styles: [".k-select{position:relative;width:100%;font-family:inherit}.k-select--disabled{opacity:.6;pointer-events:none}.k-select__control{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:8px 12px;border:1px solid rgba(0,0,0,.23);border-radius:4px;background-color:#fff;cursor:pointer;transition:all .2s;text-align:left}.k-select__control:hover:not(:disabled){border-color:#000000de}.k-select__control:disabled{cursor:not-allowed;opacity:.6}.k-select--open .k-select__control{border-color:#3f51b5;border-width:2px;padding:7px 11px}.k-select__value{flex:1;font-size:.875rem;color:#000000de;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-select__value--placeholder{color:#00000061}.k-select__arrow{font-size:.5rem;color:#0000008a;transition:transform .2s;margin-left:6px;flex-shrink:0}.k-select__arrow--up{transform:rotate(180deg)}.k-select__backdrop{position:fixed;inset:0;z-index:999;background-color:transparent}.k-select__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;background-color:#fff;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;z-index:1000;animation:fadeIn .15s ease-out}.k-select__search{position:sticky;top:0;padding:8px;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12);z-index:1}.k-select__search-input{width:100%;padding:6px 10px;font-size:.875rem;border:1px solid rgba(0,0,0,.23);border-radius:4px;outline:none;transition:border-color .2s}.k-select__search-input:focus{border-color:#3f51b5}.k-select__search-input::placeholder{color:#00000061}.k-select__option{width:100%;padding:8px 12px;font-size:.875rem;color:#000000de;cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;text-align:left}.k-select__option:hover:not(.k-select__option--disabled):not(:disabled){background-color:#0000000a}.k-select__option--selected{background-color:#3f51b51f;font-weight:500}.k-select__option--selected:hover:not(:disabled){background-color:#3f51b529}.k-select__option--disabled{color:#00000061;cursor:default}.k-select__option:disabled{cursor:not-allowed;opacity:.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"] }]
+            args: [{ selector: 'c80-select', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\n  <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() || loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\n    (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\n    <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\n      @if (loading()) {\n      Cargando...\n      } @else {\n      {{ getSelectedLabel() }}\n      }\n    </span>\n    <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">\u25BC</span>\n  </button>\n\n  @if (isOpen()) {\n  <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\n    @if (filterable()) {\n    <div class=\"k-select__search\">\n      <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\n    </div>\n    }\n\n    <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\n      -- {{ placeholder() }} --\n    </button>\n\n    @if (loading()) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      Cargando...\n    </button>\n    } @else if (filteredOptions().length === 0) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\n    </button>\n    } @else {\n    @for (option of filteredOptions(); track option.value) {\n    <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\n      (keydown.enter)=\"selectOption(option)\">\n      {{ option.label }}\n    </button>\n    }\n    }\n  </div>\n  }\n</div>", styles: [".k-select{position:relative;width:100%;font-family:inherit}.k-select--disabled{opacity:.6;pointer-events:none}.k-select__control{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--color-border-default);border-radius:4px;background-color:var(--color-bg-primary);cursor:pointer;transition:all .2s;text-align:left;outline:none}.k-select__control:hover:not(:disabled){border-color:var(--color-border-medium)}.k-select__control:disabled{cursor:not-allowed;opacity:.6}.k-select__control:focus{outline:none}.k-select--open .k-select__control{border-color:var(--color-border-medium)}.k-select__value{flex:1;font-size:.875rem;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-select__value--placeholder{color:var(--color-text-muted)}.k-select__arrow{font-size:.5rem;color:var(--color-text-secondary);transition:transform .2s;margin-left:6px;flex-shrink:0}.k-select__arrow--up{transform:rotate(180deg)}.k-select__backdrop{position:fixed;inset:0;z-index:999;background-color:transparent}.k-select__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;background-color:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:4px;box-shadow:var(--shadow-lg);z-index:1000;animation:fadeIn .15s ease-out}.k-select__search{position:sticky;top:0;padding:8px;background-color:var(--color-bg-primary);border-bottom:1px solid var(--color-border-default);z-index:1}.k-select__search-input{width:100%;padding:6px 10px;font-size:.875rem;border:1px solid var(--color-border-default);border-radius:4px;outline:none;transition:border-color .2s;background-color:var(--color-bg-primary);color:var(--color-text-primary)}.k-select__search-input:focus{border-color:var(--color-icon-primary)}.k-select__search-input::placeholder{color:var(--color-text-muted)}.k-select__option{width:100%;padding:8px 12px;font-size:.875rem;color:var(--color-text-primary);cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;text-align:left}.k-select__option:hover:not(.k-select__option--disabled):not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--selected{background-color:var(--color-bg-tertiary);font-weight:500}.k-select__option--selected:hover:not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--disabled{color:var(--color-text-muted);cursor:default}.k-select__option:disabled{cursor:not-allowed;opacity:.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"] }]
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], filterable: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterable", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], searchInput: [{ type: i0.ViewChild, args: ['searchInput', { isSignal: true }] }] } });
 //# sourceMappingURL=select.component.js.map

package/esm2022/lib/snackbar/snackbar.component.js

@@ -48,10 +48,10 @@ export class SnackbarComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: SnackbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: SnackbarComponent, isStandalone: true, selector: "k-snackbar", ngImport: i0, template: "@if (visible() && data(); as snackData) {\n<div class=\"snackbar\" [class]=\"panelClasses()\">\n  <span class=\"snackbar-message\">{{ snackData.message }}</span>\n  @if (snackData.action) {\n  <button class=\"snackbar-action\" type=\"button\" (click)=\"dismiss()\">\n    {{ snackData.action }}\n  </button>\n  }\n</div>\n}", styles: [":host{position:fixed;z-index:9999;pointer-events:none}.snackbar{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;background:#323232;color:#fff;border-radius:.25rem;box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024;pointer-events:auto;animation:slideIn .3s ease-out;min-width:18rem;max-width:35rem}.snackbar-message{flex:1;font-size:.875rem}.snackbar-action{background:transparent;border:none;color:#90caf9;cursor:pointer;font-size:.875rem;font-weight:500;text-transform:uppercase;padding:.25rem .5rem;border-radius:.25rem;transition:background-color .2s}.snackbar-action:hover{background-color:#ffffff1a}.notification-success{background:#4caf50}.notification-error{background:#f44336}@keyframes slideIn{0%{opacity:0;transform:translateY(-1rem)}to{opacity:1;transform:translateY(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: SnackbarComponent, isStandalone: true, selector: "k-snackbar", ngImport: i0, template: "@if (visible() && data(); as snackData) {\n<div class=\"snackbar\" [class]=\"panelClasses()\">\n  <span class=\"snackbar-message\">{{ snackData.message }}</span>\n  @if (snackData.action) {\n  <button class=\"snackbar-action\" type=\"button\" (click)=\"dismiss()\">\n    {{ snackData.action }}\n  </button>\n  }\n</div>\n}", styles: [":host{position:fixed;z-index:9999;pointer-events:none}.snackbar{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;background:var(--color-bg-snackbar);color:var(--color-text-inverse);border-radius:.25rem;box-shadow:var(--shadow-lg);pointer-events:auto;animation:slideIn .3s ease-out;min-width:18rem;max-width:35rem}.snackbar-message{flex:1;font-size:.875rem}.snackbar-action{background:transparent;border:none;color:var(--color-text-link-light);cursor:pointer;font-size:.875rem;font-weight:500;text-transform:uppercase;padding:.25rem .5rem;border-radius:.25rem;transition:background-color .2s}.snackbar-action:hover{background-color:var(--color-bg-hover-overlay)}.notification-success{background:var(--color-icon-success)}.notification-success .snackbar-action{color:var(--color-text-inverse)}.notification-error{background:var(--color-icon-danger)}.notification-error .snackbar-action{color:var(--color-text-inverse)}@keyframes slideIn{0%{opacity:0;transform:translateY(-1rem)}to{opacity:1;transform:translateY(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: SnackbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'k-snackbar', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (visible() && data(); as snackData) {\n<div class=\"snackbar\" [class]=\"panelClasses()\">\n  <span class=\"snackbar-message\">{{ snackData.message }}</span>\n  @if (snackData.action) {\n  <button class=\"snackbar-action\" type=\"button\" (click)=\"dismiss()\">\n    {{ snackData.action }}\n  </button>\n  }\n</div>\n}", styles: [":host{position:fixed;z-index:9999;pointer-events:none}.snackbar{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;background:#323232;color:#fff;border-radius:.25rem;box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024;pointer-events:auto;animation:slideIn .3s ease-out;min-width:18rem;max-width:35rem}.snackbar-message{flex:1;font-size:.875rem}.snackbar-action{background:transparent;border:none;color:#90caf9;cursor:pointer;font-size:.875rem;font-weight:500;text-transform:uppercase;padding:.25rem .5rem;border-radius:.25rem;transition:background-color .2s}.snackbar-action:hover{background-color:#ffffff1a}.notification-success{background:#4caf50}.notification-error{background:#f44336}@keyframes slideIn{0%{opacity:0;transform:translateY(-1rem)}to{opacity:1;transform:translateY(0)}}\n"] }]
+            args: [{ selector: 'k-snackbar', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (visible() && data(); as snackData) {\n<div class=\"snackbar\" [class]=\"panelClasses()\">\n  <span class=\"snackbar-message\">{{ snackData.message }}</span>\n  @if (snackData.action) {\n  <button class=\"snackbar-action\" type=\"button\" (click)=\"dismiss()\">\n    {{ snackData.action }}\n  </button>\n  }\n</div>\n}", styles: [":host{position:fixed;z-index:9999;pointer-events:none}.snackbar{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;background:var(--color-bg-snackbar);color:var(--color-text-inverse);border-radius:.25rem;box-shadow:var(--shadow-lg);pointer-events:auto;animation:slideIn .3s ease-out;min-width:18rem;max-width:35rem}.snackbar-message{flex:1;font-size:.875rem}.snackbar-action{background:transparent;border:none;color:var(--color-text-link-light);cursor:pointer;font-size:.875rem;font-weight:500;text-transform:uppercase;padding:.25rem .5rem;border-radius:.25rem;transition:background-color .2s}.snackbar-action:hover{background-color:var(--color-bg-hover-overlay)}.notification-success{background:var(--color-icon-success)}.notification-success .snackbar-action{color:var(--color-text-inverse)}.notification-error{background:var(--color-icon-danger)}.notification-error .snackbar-action{color:var(--color-text-inverse)}@keyframes slideIn{0%{opacity:0;transform:translateY(-1rem)}to{opacity:1;transform:translateY(0)}}\n"] }]
         }] });
 //# sourceMappingURL=snackbar.component.js.map